// describes the menu animation

function animateMenu() {
			
		// obtain trigger x position for comparison part
		var divTrigger = $("#trigger");
		var triggerX = divTrigger.position();
		var triggerLeft = triggerX.left;
		
		// make implode function
		function implodeLeft() {
		
			// fade trigger to zero
			$("#trigger").fadeTo("fast", 0, function() {
				
				// update earlier called comparison vars
				triggerX = divTrigger.position();
				triggerLeft = triggerX.left;
				
				// animate ALL the divs
				$("#header").animate({width: 550}, "fast");
				$("#curvedshadow").animate({width: 565}, "fast");
				
				// get trigger to animate and fade back
				$("#trigger").animate({left: 485}, "fast", function() {
					$("#trigger").fadeTo("fast", 1, function() {
					});
				});
						
			});
					
		}
				
		// make explode function
		function explodeLeft() {
		
			// once again, fade trigger to zero
			$("#trigger").fadeTo("fast", 0, function() {
				
				// update x pos of trigger
				triggerX = divTrigger.position();
				triggerLeft = triggerX.left;
				
				// ANIMATE all the divs
				$("#header").animate({width: 920}, "fast");
				$("#curvedshadow").animate({width: 950}, "fast");
				
				// get trigger back to default
				$("#trigger").animate({left: 855}, "fast", function() {
					$("#trigger").fadeTo("fast", 1, function() {
					});
				});
						
			});
		}
	
	// compare x position of trigger		
	if(triggerLeft <= 490) {
		explodeLeft();
	} else {
		implodeLeft();
	}
	
	// clear jquery stacks to avoid animation bugging
	$("#trigger").clearQueue();
	$("#header").clearQueue();
	$("#curvedshadow").clearQueue();
				
}