/*
	APPLE.COM HOVER MENU Style
	
	Copyright: Projet Bleu and Cedric Dugas 
	(Change, use this code for whatever you need)
	
	A small program using jquery to do a hover style menu
	
	2 small bug, the A tags are moving a little from their emplacement.
	This is cause by the fact that they are all on relative position, it is a
	 small bug considering that doing this animation with an absolute position
	  would be alot more difficult and longer.
	Also, the animation can fliker a bit, you need to be very careful with your
	 css, as jquery have a tendancy to not be thatstable with advanced positioning 
	 and animation.
	
	Enjoy!
*/

var $j = jQuery.noConflict();

$j(document).ready(function() {	
	divDance.init()
	
	
 divDance.init();new Accordian('basic-accordian',10,'header_highlight'); 
});


divDance = {
	
	init : function()  {
		divDance.callback = false		
		
		$j(".listDance a.move").hover(function () {
			
			// The 2 if are for delaying the animation in case you rollover too fast
			if ($j(this).parent().find(".imgContent").css("height") > "194px" ){
		
				if(divDance.callback == false) {
					divDance.dancing(this)
				}else{
					caller = this
					setTimeout("divDance.dancing(caller)", 800);
				}
		  	}	
	      }, 
	      function () {});
	      // the hover function do not work if you don't have a rollout function...
	},
	
	dancing : function(caller,startAnim)  {
     	
		// the callback variable is set to do the animation only when the slideDown is finish so no animation are on the same time
		if (divDance.callback == false){
			
//			$j(".listDance a.move").not($j(caller).parent().find("a.move")).addClass("hover")
//			$j(caller).removeClass("hover")	 
				divDance.callback = true
				//animation is inbricked in callback method
				$j(".listDance .imgContent").not($j(caller).parent().find(".imgContent")).slideUp(600, function () {
		
					$j(caller).parent().find(".imgContent").slideDown(600, function () {
						divDance.callback = false
					});  
				});  
		}
	}
	
}





openDiv = {
	init : function(caller)  {
	$j(caller).next().css('display','none')	
	},
	
	toggle : function(caller)  {
		
		if($j(caller).next().css('display') == 'none' ) {
			$j(caller).next().slideDown("slow")
			$j(caller).addClass("openDiv")
		}else{
			$j(caller).next().slideUp("slow")
			$j(caller).removeClass("openDiv")
		}	
	},
	
	chambreToggle : function(caller) {
		if($j(caller).next().css('display') == 'none' ) {
			$j(caller).next().slideDown("slow", function() {
				var targetOffset = ($j(caller).offset().top -40)
				$j("html,body").animate({scrollTop:targetOffset}, 'slow')
			})
			$j(caller).addClass("openDiv")
		}else{
			$j(caller).next().slideUp("slow")
			$j(caller).removeClass("openDiv")
		}	
	}
}

overlay = {
	open : function(pageToOpen){
		$j("select").css("visibility","hidden")
		
		overlay.displayLoader();
		
		overlay.buildOverlay();
		
		$j('div.overlayContainer').load(pageToOpen,function(){
				
			$j('div.overlayContainer').animate({opacity:'show'},'fast');
			
			var xScroll, yScroll;
		       if (self.pageYOffset) {
		           yScroll = self.pageYOffset;
		           xScroll = self.pageXOffset;
		       } else if (document.documentElement && document.documentElement.scrollTop){     // Explorer 6 Strict
		           yScroll = document.documentElement.scrollTop;
		           xScroll = document.documentElement.scrollLeft;
		       } else if (document.body) {// all other Explorers
		           yScroll = document.body.scrollTop;
		           xScroll = document.body.scrollLeft;    
		       }

			if($j.browser.msie){
				browserHeight = document.documentElement.clientHeight;
			}else{
				browserHeight = window.innerHeight;
			}
			
			planifOffset = $j("#planif").offset().top
			
		
			if(browserHeight >= $j('div.overlayContainer').height()){
				$j('div.overlayContainer').css({
					'top' : "100px",
					'left' : "50%",
					'margin' : '0px 0 0 -' + $j('div.overlayContainer').width()/2 + "px"
				});
				$j('html,body').animate({scrollTop:100},'slow');
			}else{
				$j('html,body').animate({scrollTop:100},'slow');
				$j('div.overlayContainer').css({
					'top' : "100px",
					'left' : "50%",
					'margin' : '0 0 0 -' + $j('div.overlayContainer').width()/2 + "px"
				});
			}

			$j('#bigAjaxLoader').remove();
		});
	},
	close : function(){
		$j('div.overlayContainer').fadeOut('fast',function(){
			$j(this).remove();
			$j('div.overlay').fadeOut('fast',function(){
				$j(this).remove();
				$j("select").css("visibility","visible")
			});
		});
	},
	buildOverlay : function(){

		// Build the background overlay div
		backgroundDiv = document.createElement('div');
			
		$j(backgroundDiv).addClass('overlay');
		$j(backgroundDiv).css({ 'height':$j('#container').height() });
		
		$j(backgroundDiv).bind('click',function(){
			overlay.close();
		});
		
		// Build the content overlay divs
		overlayContainer = document.createElement('div')
		$j(overlayContainer).addClass('overlayContainer');
		
		
		$j('body').append(backgroundDiv);
		// $j(overlayContentContainer).append(overlayContent);
		// $j(overlayContainer).append(overlayContentContainer);
		$j('body').append(overlayContainer);
		
		// Then fade it in
		$j('div.overlay').css('opacity',0);
		$j('div.overlay').show();
		$j('body').append(ajaxLoader);
		$j('div.overlay').animate({opacity: 0.60}, 300, "");
		
		overlayContent = document.createElement('div')
		$j(overlayContent).addClass('overlayContent');
		
		$j(overlayContainer).append(overlayContent);
		
	},
	displayLoader : function(){
		ajaxLoader = document.createElement('img')
		$j(ajaxLoader).attr({
			'id':'bigAjaxLoader',
			'src':'img/ajax-loader.gif'
		});
		$j(ajaxLoader).css({
			'position':'absolute',
			'top':'50%',
			'left':'50%'
		});
	}
}
