/*
  Affiche les Infobulles sur les boutons tout rond du menu collant
*/
$(function(){
    
    $(".bouton_rond li a").mouseover(function(){
        if($(this).attr("title")=="") return false;
        
        $("body").append('<span class="infobulle"></span>');
        var bulle = $(".infobulle:last");
        bulle.append($(this).attr("title"));
        $(this).attr("title","");
        var posTop = $(this).offset().top+$(this).height()+20;
        var posLeft = $(this).offset().left+$(this).width()/2-bulle.width()/2;
        bulle.css({
            left:posLeft-7,
            top:posTop-20,
            opacity:0
        });
        bulle.animate({
            top:posTop-10,
            opacity:0.99
        });
    });
    
    $(".bouton_rond li a").mouseout(function(){
        var bulle = $(".infobulle:last");
        $(this).attr("title",bulle.text());
        bulle.animate(
            {
                top:bulle.offset().top+10,
                opacity:0
            },
            500,
            "linear",
            function(){
                bulle.remove();  
            }
        );
    });
});

/*
  Affiche les Infobulles sur les boutons des cercles du processus de creation
*/
$(function(){
    
    $("#process li").mouseover(function(){
        if($(this).attr("title")=="") return false;
        
        $("body").append('<span class="infobulle_process"></span>');
        var bulle = $(".infobulle_process:last");
        bulle.append($(this).attr("title"));
		bulle.append('<div id="fleche_info"></div>');
        $(this).attr("title","");
        var posTop = $(this).offset().top-$(this).height()+50;
        var posLeft = $(this).offset().left+$(this).width()/2-bulle.width()/2;
        bulle.css({
            left:posLeft-7,
            top:posTop-20,
            opacity:0
        });
        bulle.animate({
            top:posTop-10,
            opacity:0.99
        });
    });
    
    $("#process li").mouseout(function(){
        var bulle = $(".infobulle_process:last");
        $(this).attr("title",bulle.text());
        bulle.animate(
            {
                top:bulle.offset().top+10,
                opacity:0
            },
            500,
            "linear",
            function(){
                bulle.remove();  
            }
        );
    });
});
/*----------------Apple LOUPE-------------------*/
$(document).ready(function(){

	/* This code is executed on the document ready event */

	var left	= 0,
		top		= 0,
		sizes	= { retina: { width:150, height:150 }, webpage:{ width:278, height:190 } },
		webpage	= $('#voir_portfolio'),
		offset	= { left: webpage.offset().left, top: webpage.offset().top },
		retina	= $('#retina');

	if(navigator.userAgent.indexOf('Chrome')!=-1)
	{
		/*	Applying a special chrome curosor,
			as it fails to render completely blank curosrs. */
			
		retina.addClass('chrome');
	}
	
	webpage.mousemove(function(e){

		left = (e.pageX-offset.left);
		top = (e.pageY-offset.top);

		if(retina.is(':not(:animated):hidden')){
			/* Fixes a bug where the retina div is not shown */
			webpage.trigger('mouseenter');
		}

		if(left<0 || top<0 || left > sizes.webpage.width || top > sizes.webpage.height)
		{
			/*	If we are out of the bondaries of the
				webpage screenshot, hide the retina div */

			if(!retina.is(':animated')){
				webpage.trigger('mouseleave');
			}
			return false;
		}

		/*	Moving the retina div with the mouse
			(and scrolling the background) */

		retina.css({
			left				: left - sizes.retina.width/2,
			top					: top - sizes.retina.height/2,
			backgroundPosition	: '-'+(1.6*left)+'px -'+(1.35*top)+'px'
		});
		
	}).mouseleave(function(){
		retina.stop(true,true).fadeOut('fast');
	}).mouseenter(function(){
		retina.stop(true,true).fadeIn('fast');
	});
});
/*------------------------------------------*/
/*
 	Scroll animé sur toutes les ancres
*/
$(document).ready(function(){
	$('a[href^=#]').click(function() {
		cible=$(this).attr('href');
		scrollTo(cible);
		return false;
	});
});

function scrollTo(cible){
	if($(cible).length>=1){
		hauteur=$(cible).offset().top;
	}
	else{
		hauteur=$("a[name="+cible.substr(1,cible.length-1)+"]").offset().top;
	}
	hauteur -= (windowH()-$(cible).height())/2;
	$('html,body').animate({scrollTop: hauteur}, 1000);
	return false;
}

function  windowH(){
	if (window.innerHeight) return window.innerHeight  ;
	else{return $(window).height();}
}



/*  
  Menu collant des boutons tout rond
 */

$(function(){
		   
		   $('.bouton_rond').each(function(){
			     var parent = $(this).parent();
				 var dTop = $(this).offset().top;
				 var elem = $(this);
				 var stickyHeight = this.clientHeight;
				 parent.css('position','relative');
				 elem.css('position','absolute');
				 $(window).scroll(function(){
							var scroll = scrollY();
							var aboutMeHeight = document.getElementById('aboutMe').clientHeight
							if(aboutMeHeight != 0){
								// 15 : see aboutMe.content padding bottom
								aboutMeHeight += 15;
							}
							var dTopWithAboutMeHeight = dTop + aboutMeHeight;
							//alert(dTopWithAboutMeHeight);
							if(document.height-scroll<stickyHeight+dTopWithAboutMeHeight){
								var footerTop = document.height - document.getElementById('global-footer').clientHeight;
								elem.stop().animate({top:footerTop-stickyHeight-dTopWithAboutMeHeight},500);
							} else if(scroll>dTopWithAboutMeHeight+200){
								elem.stop().animate({top:scroll-parent.offset().top-220},500);
							}else{
								elem.stop().animate({top:dTopWithAboutMeHeight-parent.offset().top},500)
							}
				});
        });
});

/*
      Return the position of the top
*/
function scrollY(){
	scrOfY=0;
	if(typeof( window.pageYOffset ) == 'number' ){
		//Netscape compliant
		scrOfY = window.pageYOffset;
	}else if (document.body && (document.body.scrollTop)){
		//DOM compliant
		scrOfY = document.body.scrollTop;
	}else if (document.documentElement && (document.documentElement.scrollTop)){
		//IE6 standards compliant mode
		scrOfY = document.documentElement.scrollTop;
	}
	return scrOfY;
}


var columnReadyCounter = 0;

// This is the callback function for the "hiding" animations
// it gets called for each animation (since we don't know which is slowest)
// the third time it's called, then it resets the column positions
function ifReadyThenReset() {
	
	columnReadyCounter++;
	
	if (columnReadyCounter == 3) {
		$(".col").not(".current .col").css("top", 350);
		columnReadyCounter = 0;
	}

};



/*
      Slot Machine Tabs Presentation
*/
// When the DOM is ready
$(function() {
	
	var $allContentBoxes = $(".content-box-machine"),
	    $allTabs = $(".tabs li a"),
	    $el, $colOne, $colTwo, $colThree,
	    hrefSelector = "",
	    speedOne = 1000,
		speedTwo = 2000,
		speedThree = 1500;
	
	// first tab and first content box are default current
	$(".tabs li:first-child a, .content-box-machine:first").addClass("current");
	$(".box-wrapper .current .col").css("top", 0);
	
	$("#slot-machine-tabs").delegate(".tabs a", "click", function() {
		
		$el = $(this);
		
		if ( (!$el.hasClass("current")) && ($(":animated").length == 0 ) ) {
		
			// current tab correctly set
			$allTabs.removeClass("current");
			$el.addClass("current");
			
			// optional... random speeds each time.
			speedOne = Math.floor(Math.random()*1000) + 500;
			speedTwo = Math.floor(Math.random()*1000) + 500;
			speedThree = Math.floor(Math.random()*1000) + 500;
		
			// each column is animated upwards to hide
			// kind of annoyingly redudundant code
			$colOne = $(".box-wrapper .current .col-one");
			$colOne.animate({
				"top": -$colOne.height() -30
			}, speedOne);
		
			$colTwo = $(".box-wrapper .current .col-two");
			$colTwo.animate({
				"top": -$colTwo.height() -30
			}, speedTwo);
		
			$colThree = $(".box-wrapper .current .col-three");
			$colThree.animate({
				"top": -$colThree.height() -30
			}, speedThree);
			
			// new content box is marked as current
			$allContentBoxes.removeClass("current");		
			hrefSelector = $el.attr("id");
			$(hrefSelector).addClass("current");
		
			// columns from new content area are moved up from the bottom
			// also annoying redundant and triple callback seems weird
			$(".box-wrapper .current .col-one").animate({
				"top": 0
			}, speedOne, function() {
				ifReadyThenReset();
			});
	
			$(".box-wrapper .current .col-two").animate({
				"top": 0
			}, speedTwo, function() {
				ifReadyThenReset();
			});
		
			$(".box-wrapper .current .col-three").animate({
				"top": 0
			}, speedThree, function() {
				ifReadyThenReset();
			});
		
		};

	});

});



/*
      Accordeon formation
*/
$(document).ready(function(){
	/* This code is executed after the DOM has been completely loaded */

	/* Changing thedefault easing effect - will affect the slideUp/slideDown methods: */
	$.easing.def = "easeOutQuad";

	/* Binding a click event handler to the links: */
	$('li.button a').click(function(e){
	
		/* Finding the drop down list that corresponds to the current section: */
		var dropDown = $(this).parent().next();
		
		/* Closing all other drop down sections, except the current one */
		$('.dropdown').not(dropDown).slideUp('slow');
		dropDown.slideToggle('slow');
		
		/* Preventing the default event (which would be to navigate the browser to the link's address) */
		e.preventDefault();
	})
	
});


// t: current time, b: begInnIng value, c: change In value, d: duration
jQuery.easing['jswing'] = jQuery.easing['swing'];

jQuery.extend( jQuery.easing,
{
	def: 'easeOutQuad',
	swing: function (x, t, b, c, d) {
		//alert(jQuery.easing.default);
		return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
	},
	easeOutQuad: function (x, t, b, c, d) {
		return -c *(t/=d)*(t-2) + b;
	},
	easeOutBounce: function (x, t, b, c, d) {
		if ((t/=d) < (1/2.75)) {
			return c*(7.5625*t*t) + b;
		} else if (t < (2/2.75)) {
			return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
		} else if (t < (2.5/2.75)) {
			return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
		} else {
			return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
		}
	}

});

/*
      Icones flotantes dans Identité numérique
*/
$(document).ready(function() {

	/* =Shadow Nav 
	-------------------------------------------------------------------------- */
	
		// Append shadow image to each LI
		
		$("#social_network li").append('<img class="shadow" style="margin-top:-14px;" src="http://www.lionelmultimedias.fr/blog/wp-content/themes/multimedias-beta/images/icons-shadow.png" width="160" height="40" alt="identité numérique" />');
	
		// Animate buttons, shrink and fade shadow
		
		$("#social_network li").hover(function() {
			var e = this;
		    $(e).find("a").stop().animate({ marginTop: "-14px" }, 250, function() {
		    	$(e).find("a").animate({ marginTop: "-10px" }, 250);
		    });
		    $(e).find("img.shadow").stop().animate({ width: "80%", height: "35px", marginLeft: "8px", marginTop:"-14", opacity: 0.5 }, 250);
		},function(){
			var e = this;
		    $(e).find("a").stop().animate({ marginTop: "0px" }, 250, function() {
		    	$(e).find("a").animate({ marginTop: "0px" }, 250);
		    });
		    $(e).find("img.shadow").stop().animate({ width: "158px", height: "40px", marginLeft: "0", opacity: 1 }, 250);
		});
						
	// End jQuery
	
	});


/*
      Icones flotantes dans Design process
*/
$(document).ready(function() {

	/* =Shadow Nav 
	-------------------------------------------------------------------------- */
	
		// Append shadow image to each LI
		
		$("#process li").append('<img class="shadow" style="margin-top:0px;" src="http://www.lionelmultimedias.fr/blog/wp-content/themes/multimedias-beta/images/icons-shadow.png" width="160" height="40" alt="identité numérique" />');
	
	});