$(document).ready( function() {
	
	//load up flash piece
	swfobject.embedSWF("assets/header1a.swf", "main-flash", "510", "319", "9.0.0", "expressInstall.swf", {}, {wmode:"transparent"});
	
	var removingFade = 0; //this for "click to learn more"
	var running = 0;
	
	$("#main-content ul li a").hover( function() {
		if( $(this).parent("li").next("li").is(".content") ){
			//this slide is open!
		}else{
			$(this).append('<div class="clicktolearn"></div>');
			//check for IE7 because of NASTY clearType rendering
			if( $.browser.msie && parseInt($.browser.version) == 7 ){
				$(".clicktolearn", $(this)).show();
			}else{
				$(".clicktolearn", $(this)).fadeIn("slow");
			}
		}
		
	}, function() {
		if( $(".clicktolearn", $(this)) ){
			if( $.browser.msie && parseInt($.browser.version) == 7 ){
				$(".clicktolearn", $(this)).remove();
			}else{
				$(".clicktolearn", $(this)).fadeOut("slow", function() {
					$(this).remove();
				});
			}
		}
	});
	

			
	//setup click function for accordian
	$("#main-content ul li a").click( function() {
	if( running == 0){	//make sure nothing is animating when we want to animate something new :-)
		//set to 1 because we know SOMETHING is going to be animating
		running = 1;
		
		//double-click if "learn more" image is being shown
		if( $(".clicktolearn", $(this)) ){
			$(".clicktolearn", $(this)).remove();
		}
		
		//make sure the nutrition content is not there!
		if( $("#related-content-wrapper").children().is("#related-content") ){
			$("#related-content").animate( {width: 0}, 450, function(){
				running = 0;
				$(this).remove();
			});
			$("#related-content-wrapper .bottom").animate( {width: 0}, 450, function(){
				running = 0;
				$(this).remove();
			});
				$("#nutri-slider ul").animate( {left: -280}, "slow", function(){
					$("#nutri-slider").css("margin-left", "0px");
					$("#nutri-slider ul li a").parent("li").toggleClass("opened");
				});
		}
		
		//indicate which slide is being toggled
		for( var i=1; i<=3; i++){
			if( "slide-"+i == $(this).parent().attr("id") ) {
				var slideNum = i;
			}else{
				//make sure other slides have the correct arrow
				$("#slide-" + i).children().children("div").attr("class", "");
			}
		}
		
		//switch open/close arrow
		$(this).children("div").toggleClass("toggle-close");
		
		//check for right margin because of 1st slide
		if( $("#slide-2").css("margin-right") == "-30px" ){
			if( slideNum == 2){
				$("#slide-2").animate({marginRight: -10,marginLeft: -30},400);
			}else{
				$("#slide-2").animate({marginRight: -10},400);
			}
		}

		//remove pevious content list element
		$(".content").empty();
		$(".content").animate({ width: 0}, "slow", function(){
			if( $(this).prev("li").attr("id") == "slide-" + slideNum){
				//we just wanted to close the current slide... no more "running"
				running = 0;
			}
			$(this).remove();
		});
		
		//make sure slide 2 or 3 isn't sliding too fast
		if( slideNum != 1 ){
			$(".content").prev("li").animate({ marginLeft: -10}, 400);
		}
		
		//make sure slide3 always slides correctly
		if( slideNum == 1){
			$("#slide-3").animate({ marginLeft: -10}, 400);
		}
		
		//check if current slide already has content open
		if( $(this).parent().next().is(".content")){
			//this slide has content... close the content!
			//make sure slide 2 loses right margin
			if(slideNum == 1){
				$("#slide-2").animate({marginRight: -10},400);
			}
		}else{	//user is wanting to see a new slide.. make it happen!
			
			//put margin right on slide 2, since slide 1 shouldn't have margin left
			if( slideNum == 1){
				//first slide, adjust slide 2!
				$("#slide-2").animate({marginRight: -30, marginLeft: -10}, 400);
			}else{	//OK to put margin left on current slide
				$(this).parent().animate({marginLeft: -30}, 400);
			}
			//open the one we clicked
			
			var newContent = $("<li class=content></li>").css("width", "0").animate({width: 322}, "slow", function(){
				running = 0;	//everything is done, user can toggle new slides
				$.ajax({
				  type: "GET",
				  url: "slide-"+slideNum+".html",
				  dataType: "text",
				  success: getSlideCallback
				});
			});
			
			//add new content next to the slide that we clicked
			$(this).parent().after(newContent);
			
		}
		
	}	
	return false;
	});
	
	function getSlideCallback(data) {
		//append data to slide
		$(".content").append(data);
		//close p tags initially
		$(".content ul li div").toggle();
		//open up first one :)
		$(".content ul li h2:first").next("div").slideToggle("slow");
		$(".content ul li h2:first").children("a").toggleClass("toggle-close");
		
		//setup P sliding
		$(".content ul li h2").click( function() {
			$(this).next("div").slideToggle("slow");
			$(this).children("a").toggleClass("toggle-close");
			return false;
		});
	}
	
	//Lets click the 1st slide on default
	$("#main-content ul li a:first").click();
	
	
});