// removes the "px" from a string returned by getting an object's size
function removePX(str) {
	return (str.substring(0, str.length - 2));
}

function SMenuBox(x, y, w, h)
{
	this.menudown = false;
	this.x = x;
	this.y = y;
	this.w = w;
	this.h = h;
}

$(document).ready(function() {
	// store the position of the next menu section
	var leftsum = 283;

	$('.menusection').each(function(index) {
		// get the section's children
		var menumain = $(this).children().filter(".menumain");
		var menudrop = $(this).children().filter(".menudropdown");
		
		// move the drop down bit off the screen
		menudrop.css("top", (-1 * menudrop.height()));
	
		// make the main menu bit and the drop down bit the same width
		if(menudrop.width() > menumain.width())
			menumain.css("width", menudrop.width());
		else
			menudrop.css("width", menumain.width());
		$(this).css("width", menumain.width());
		
		// position the tabs properly
		$(this).css("left", leftsum);
		menumain.css("left", leftsum);
		menudrop.css("left", leftsum);
			
		// for storing menu position and state
		var eventsBox = new SMenuBox(leftsum, 0, menumain.width(), menumain.height() + menudrop.height());
		
		// update the tab position
		leftsum = leftsum + $(this).width() + 6;
	
		// make the menu drop down
		menumain.mouseenter(function(event) {
			if(!eventsBox.menudown)
			{
				menudrop.animate({ top: (menumain.height() - 8)}, 500, "easeOutQuint");
				eventsBox.menudown = true;
			}
		});
		
		// store the eventsBox data
		$(this).data("eventsBox", eventsBox);
	});
	
	// store the largest width side main text
	var widestside = 0;
	$('.sidemain').each(function(index) {
		if($(this).width() > widestside)
			widestside = $(this).width();
	});
	
	// store the position of the next side section
	var topsum = 120;

	$('.sidesection').each(function(index) {
		// get the section's children
		var menumain = $(this).children().filter(".sidemain");
		var menudrop = $(this).children().filter(".sideslideout");
		
		// set the main text width
		menumain.css("width", widestside);
		
		// move the slide bit off the screen
		menudrop.css("left", (-1 * menudrop.width()));
	
		// make the main menu bit and the drop down bit the same height
		if(menudrop.height() > menumain.height())
			menumain.css("height", menudrop.height() + 8);
		else
			menudrop.css("height", menumain.height());
		$(this).css("height", menumain.height());
		
		var menua = menumain.children().filter("a");
		menua.css("margin-top", ((menumain.height() - menua.height()) / 2));
		menua.css("margin-bottom", ((menumain.height() - menua.height()) / 2));
		
		// position the tabs properly
		$(this).css("top", topsum);
		menumain.css("top", topsum);
		menudrop.css("top", topsum);
			
		// for storing menu position and state
		var eventsBox = new SMenuBox(0, topsum, menumain.width() + menudrop.width(), menumain.height());
		
		// update the tab position
		topsum = topsum + $(this).height() + 6;
	
		// make the menu drop down
		menumain.mouseenter(function(event) {
			if(!eventsBox.menudown)
			{
				menudrop.animate({ left: (menumain.width() - 8)}, 500, "easeOutQuint");
				eventsBox.menudown = true;
			}
		})
		
		// store the eventsBox data
		$(this).data("eventsBox", eventsBox);
	});
	
	// now set the mouse out animations
	$(document).mousemove(function(e) {
		$('.menusection').each(function(index) {						
			// get the stored eventsBox data
			var eventsBox = $(this).data("eventsBox");
			
			// check to see if the menu is actually down first
			if(eventsBox.menudown)
			{
				// check to see if we should be moving back up
				if(!(e.pageX >= eventsBox.x && e.pageX <= (eventsBox.x + eventsBox.w) && e.pageY >= eventsBox.y && e.pageY <= (eventsBox.y + eventsBox.h)))
				{
					// move back up!
					$(this).children().filter(".menudropdown").animate({ top: (-1 * $(this).children().filter(".menudropdown").height())}, 500, "easeOutQuint");
					eventsBox.menudown = false;
		
					// store the eventsBox data
					$(this).data("eventsBox", eventsBox);
				}
			}
		});
		
		$('.sidesection').each(function(index) {						
			// get the stored eventsBox data
			var eventsBox = $(this).data("eventsBox");
			
			// check to see if the menu is actually down first
			if(eventsBox.menudown)
			{
				// check to see if we should be moving back up
				if(!(e.pageX >= eventsBox.x && e.pageX <= (eventsBox.x + eventsBox.w) && e.pageY >= eventsBox.y && e.pageY <= (eventsBox.y + eventsBox.h)))
				{
					// move back left!
					$(this).children().filter(".sideslideout").animate({ left: (-1 * $(this).children().filter(".sideslideout").width())}, 500, "easeOutQuint");
					eventsBox.menudown = false;
		
					// store the eventsBox data
					$(this).data("eventsBox", eventsBox);
				}
			}
		});
	});
	
	// colour the selected menu
	//$("#menuhl").children().filter(".sidemain").css("background", "#F7931E");
	$("#menuhl").children().each(function(index) {
		$(this).css("background", "#F7931E");
	});
	
	// position the content, motto, and footer
	$("#theboxfilledwithcontent").css("width", (leftsum - 120 - (2*parseFloat(removePX($("#theboxfilledwithcontent").css("paddingRight"))))));
	//$("#theboxfilledwithcontent").corner();
	
	$("#theboxfilledwithcontent").css("top", (120 + $("#pagetitle").height()));
	
	//$("#motto").css("top", (275-($("#motto").height() + 15)));
	$("#motto").css("width", (leftsum - 120));
	
	$("#footer").css("width", (leftsum - 120));
	$("#footer").css("top", (parseInt(removePX($("#theboxfilledwithcontent").css("top"))) + $("#theboxfilledwithcontent").height() + (2*parseInt(removePX($("#theboxfilledwithcontent").css("paddingBottom")))) + 15));
	
	// add rounded corners to all the menu elements
	DD_roundies.addRule('.menumain', '0px 0px 8px 8px', true);
	DD_roundies.addRule('.sidemain', '0px 8px 8px 0px', true);
	DD_roundies.addRule('.menudropdown', '0px 0px 8px 8px', true);
	DD_roundies.addRule('.sideslideout', '0px 8px 8px 0px', true);
	DD_roundies.addRule('#theboxfilledwithcontent', '8px', true);
});