/* Sending an alert message
function doSomething() {
    alert("I'm done resizing for the moment");
};
*/

var resizeTimer;
var $currentTarget;
var $lastTarget;
var $currentZindex;




$(document).ready(function(){


    if(window.innerWidth<1450)
	{
			
	$(".background_1").css("width",(window.innerWidth + ($(".coffee").width()-100)));
	$(".background_2").css("width",(window.innerWidth + ($(".coffee").width()-100)));
	
	}

	
	
	

	
	http://player.vimeo.com/video/28559434
	
	// We call the resize window method to catch the resizing event
	windowResizeManage();

	// Calling the different animation fonctions
	verticalScrolling();
	
	// Getting the center position of each section
	getSectionsCenter();
	
	$(this).find("#section1").stop()
		.css("background","transparent")
		.css("-ms-filter","\"progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)\"")
		.css("filter","progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF")
		.css("zoom","1")
	$(this).find("#section2").stop()
		.css("background","transparent")
		.css("-ms-filter","\"progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)\"")
		.css("filter","progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF")
		.css("zoom","1")
	$(this).find("#section3").stop()
		.css("background","transparent")
		.css("-ms-filter","\"progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)\"")
		.css("filter","progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF")

	
	
	$(this).find(".palms div").stop()
		.css("-ms-filter","\"progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)\"")
		.css("filter","progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF")
		.css("zoom","1")
		
		$(this).find(".sunglasses").stop()
		.css("-ms-filter","\"progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)\"")
		.css("filter","progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF")
		.css("zoom","1")
		
		$(this).find(".pencil").stop()
		.css("-ms-filter","\"progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)\"")
		.css("filter","progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF")
		.css("zoom","1")
	
		/*
		
		background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; iei8
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);      
    zoom: 1;*/

	
	// Setting the right margin of the elements depending on the screens size
	/*
	$(this).find("#section1").stop()
		.css("margin-left",$section1Position)
		
	$(this).find("#section2").stop()
		.css("margin-left",$section2Position)
		
	$(this).find("#section3").stop()
		.css("margin-left",$section3Position)
		
	$(this).find("#section4").stop()
		.css("margin-left",$section3Position)
	*/	
	
	
	
  	loadClickedPage();
	
	initSweewsVideo();
	
	changeBackground();
      
	
	
	 
});

function changeBackground() {
		
		// Make sure the new container is always on the background
		//currentZindex--;
		/*
		$(".palm_top").fadeOut(0);
		$(".shadow_top_left").fadeOut(0);	
		$(".shadow_down_left").fadeOut(0);	
		$(".shadow_down_right").fadeOut(0);	
		$(".sunglasses").fadeOut(0);	
		$(".earphones").fadeOut(0);	
		*/
		
		$(".background_1").fadeOut(1);
		$(".switch").css("background-image","url(img/switch_right.png)");
		$(".earphones").fadeOut(1);	
		

					
					
	
		
		// we set the index to 10 at the begin
		currentZindex = 0;
		
		
		
		
		
		$(".switch_container").click(function() 
		{
				
			
				// We test if which is the current background by modulo
				if(currentZindex%2==0)
				{	
					$(".switch").css("background-image","url(img/switch_left.png)");
					$(".palm_top").fadeOut();	
					$(".shadow_top_left").fadeOut();	
					$(".shadow_down_left").fadeOut();	
					$(".shadow_down_right").fadeOut();	
					$(".sunglasses").fadeOut();	
					$(".earphones").fadeOut();	
					
					
					// So we fade IN the background 1
					$(".background_1").fadeIn(function() {
					
						
					});
					//$(".pencil").fadeIn();	
				}
				else
				{
					$(".switch").css("background-image","url(img/switch_right.png)");
					window.setTimeout(function()
					{
						$(".palm_top").fadeIn(300);
						$(".shadow_top_left").fadeIn();	
						$(".shadow_down_left").fadeIn();	
						$(".shadow_down_right").fadeIn();
						$(".sunglasses").fadeIn();		
						$(".earphone").fadeIn();
					}, 100); 
					
					// We fade OUT the background 1
					$(".background_1").fadeOut(300);
					//$(".pencil").fadeOut();	
					
				}	
				
				currentZindex++;

		});
		
		
		
		
		
};
	
	
function loadClickedPage()
{
	  // Check for hash value in URL  
        var hash = window.location.hash.substr(1);  
        var href = $('#nav li a').each(function(){  
            var href = $(this).attr('href');  
            if(hash==href.substr(0,href.length-5)){  
                var toLoad = hash+'.html #content';  
                $('#content').load(toLoad)  
            }  
        });  
      
        $('.side-nav li a').click(function(){  
      
			var toLoad = $(this).attr('href')+' #content';  
			$('#content').hide('fast',loadContent);  
			$('#load').remove();  
			$('#sidebar').append('<span id="load">LOADING...</span>');  
			$('#load').fadeIn('normal');  
			window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);  
			
			function loadContent() {  
				$('#content').load(toLoad,'',showNewContent())  
			}  
			
			function showNewContent() {
				 window.setTimeout(function()
				{
					$('#content').show('normal',hideLoader()); 
				}, 1000); 
				 
			}  
			
			function hideLoader() {  
				$('#load').fadeOut('normal');  
			}  
			return false;  
      
        });  
}

function windowResizeManage()
{
	
		$(window).resize(function() 
		{
			if(window.innerWidth<1450)
			{
				clearTimeout(resizeTimer);
				resizeTimer = setTimeout(updateBackgroundWidth(), 100);
			}
			else
			{
				$(".background_1").css("width","100%");
				$(".background_2").css("width","100%");
			}
		});
		
		
}

function getSectionsCenter()
{
	$section1Position = (($(window).width() - 500)/2) ;
	$section2Position = $section1Position + (($(window).width() - 500)/2) ;
	$section3Position = $section2Position + (($(window).width() - 500)/2) ;
}

function updateBackgroundWidth()
{
		$(".background_1").css("width",(window.innerWidth + ($(".coffee").width()-100)));
		$(".background_2").css("width",(window.innerWidth + ($(".coffee").width()-100)));
}

function updateSectionCenterByScrolling()
{
		// We get the current positiion center of the sections
		getSectionsCenter();
		
		var $offset = $($currentSection.attr('href')).offset().left;
		$offset = $offset - $section1Position;
	
		$('html, body').stop().animate({
			scrollLeft: $offset
		}, 1000);
		event.preventDefault();
		$offset = 0;
}

function initSweewsVideo()
{
	// Init sweews vidéo (from vimeo)
	$(".video2").videopopup(
	{
		'videoid' : '21504557',
		'videoplayer' : 'vimeo', //options - youtube or vimeo
		'autoplay' : 'true',// options - true or false
		'width' : '900',
		'height' : '510'
	});
}

function logonameHover()
{
	$(".logo_name").hover(function() {
		
		$(this).stop()
		.animate({opacity:0.8}, "fast")
		
		$(".avatar_infos").stop()
		.animate({opacity:0.6}, "fast")
	}, function() {
		
		$(this).stop()
		.animate({opacity:1}, "fast")
		
		$(".avatar_infos").stop()
		.animate({opacity: 0}, "fast")
	});
}
	


function verticalScrolling()
{
	
	
	
	/*
	
	$('a[href*=#]').click(function() 
	{
		if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
		&& location.hostname == this.hostname) 
		{
			
			if($currentTarget != null)
			{
				$lastTarget = $currentTarget;
			}	
			
			
			 $currentTarget = $(this.hash);
			 
			 $($currentTarget).stop()
				.css("display","block")
				
			 $($currentTarget).stop()
			.animate({opacity:1}, 300)
			
			
			 
			
			
			if($lastTarget != null)
			{
				$($lastTarget).hide('fast');  
				

			}
		
			
			
			

		  
		}
 	});
	*/
}


	
	
	
	
