hdot = 16;
$(function() {
	// Contenu centré
	var bw = $(document).width();
	var leftmargin = Math.round((bw-920)/3);
	$("body").css("background-position", ((-104)+leftmargin)+"px 0px");
	$("#logo").css("margin-left", leftmargin+"px");
	$("#define").css("margin-left", leftmargin+"px");
	$("#navigation").css("margin-left", leftmargin+"px");
	$("#maincontentbg").css("margin-left", (leftmargin)+"px");
	$("#maincontent").css("margin-left", (leftmargin)+"px");
	
	
	$("a.fancybox").fancybox({
		'zoomSpeedIn': 0,
		'zoomSpeedOut': 0,
		'autoScale' : true,
		'width' : 1000,
		'height' : 600,
		'centerOnScroll' : false,
		'overlayShow': true,
		'overlayColor': '#fff'
	}); 
	
	$("#flags>div").css("opacity", 0.5);
	$("#flags>div.selected").css("opacity", 1);
	$("#flags>div").hover(function() {
		$(this).css("opacity", 0.8);
	},function() {
		$(this).css("opacity", 0.5);
	});
	$("#flags>div.selected").hover(function() {
		$(this).css("opacity", 0.8);
	},function() {
		$(this).css("opacity", 1);
	});
		/**
	 * Most jQuery.localScroll's settings, actually belong to jQuery.ScrollTo, check it's demo for an example of each option.
	 * @see http://flesler.demos.com/jquery/scrollTo/
	 * You can use EVERY single setting of jQuery.ScrollTo, in the settings hash you send to jQuery.LocalScroll.
	 */
	
	// The default axis is 'y', but in this demo, I want to scroll both
	// You can modify any default like this
	$.localScroll.defaults.axis = 'xy';
	
	// Scroll initially if there's a hash (#something) in the url 
	$.localScroll.hash({
		target: '#maincontent', // Could be a selector or a jQuery object too.
		queue:true,
		duration:1500
	});
	
	/**
	 * NOTE: I use $.localScroll instead of $('#navigation').localScroll() so I
	 * also affect the >> and << links. I want every link in the page to scroll.
	 */
	$.localScroll({
		target: '#maincontent', // could be a selector or a jQuery object too.
		queue:true,
		duration:1000,
		hash:true,
		onBefore:function( e, anchor, $target ){
			// The 'this' is the settings object, can be modified
		},
		onAfter:function( anchor, settings ){
			// The 'this' contains the scrolled element (#content)
		}
	});
	$("#clients .clients .client").hover(function() {
		$(this).addClass("hover");
		$(this).children(".desc").animate({
			bottom:"3px",
		},300);
		$(this).children(".link").animate({
			right:"6px",
		},300);
	},function() {
		$(this).removeClass("hover");
		$(this).children(".desc").animate({
			bottom:"-33px",
		},300);
		$(this).children(".link").animate({
			right:"-22px",
		},300);
	});
	
	$("#clients .clients .client .desc").css("bottom","-33px");
	$("#clients .clients .client .link").css("right","-22px");
	
	$("#mycarousel li .info").css("top","-39px");
	$("#mycarousel li .credits").css("bottom","-24px");
	$("#mycarousel li").hover(function() {
		$(this).children(".info").animate({
			top:"0px",
		},300);
		$(this).children(".credits").animate({
			bottom:"0px",
		},300);
	},function() {
		$(this).removeClass("hover");
		$(this).children(".info").animate({
			top:"-39px",
		},300);
		$(this).children(".credits").animate({
			bottom:"-24px",
		},300);
	});
	
	$("#portfolio a.link").click(function() {
		var name = $(this).attr("name");
		$("#portfolio a.link").removeClass("selected");
		$(this).addClass("selected");
		if (name=="pic") {
			$('#portfolio .dyncontent').hide(500);
			$('#portfolio .selection_area').animate({height:"400px"},500);
		} else {
			$('#portfolio .selection_area').animate({height:"0px"},500);
			$('#portfolio .dyncontent').show(500);
			$('#portfolio .dyncontent').load('../pages/ajax/index.php?display='+name);	
		}
	});
	
	$("#navigation a.menu_link").click(function() {
		$("#navigation a.menu_link").removeClass("selected");
		$(this).addClass("selected");
	});
	
	$('#mycarousel').jcarousel({
        vertical: true,
		animation: "fast",
        scroll: 1,
		wrap: 'both',
        initCallback: mycarousel_initCallback,
        buttonNextHTML: null,
        buttonPrevHTML: null,
		itemFirstInCallback:  mycarousel_itemFirstInCallback
    });
	
	positionBottom();
	$(window).bind('resize', function() {
		positionBottom();
	});
	
	$(".references span.credits").hide();
	$(".reference a").hover(function() {
		$(this).next("span.credits").show();
	},function() {
		$(this).next("span.credits").hide();
	});
});


function positionBottom() {
	var height = $('body').height();
    if (height<640) {
		$("#footer").css({bottom: "inherit", top:"600px"});
	} else {
		$("#footer").css({bottom: "40px", top:"inherit"});
	}
}

function mycarousel_initCallback(carousel) {
    jQuery('.jcarousel-control a').bind('click', function() {
        carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text()));
        return false;
    });

    jQuery('.jcarousel-scroll select').bind('change', function() {
        carousel.options.scroll = jQuery.jcarousel.intval(this.options[this.selectedIndex].value);
        return false;
    });

    jQuery('#mycarousel-next').bind('click', function() {
        carousel.next();
        return false;
    });

    jQuery('#mycarousel-prev').bind('click', function() {
        carousel.prev();
        return false;
    });
};
function mycarousel_itemFirstInCallback(carousel, item, idx, state) {
	var top = ((hdot*idx)-hdot);
	jQuery('.dot_full').css("top",top+"px");
	//jQuery('.dot_full').animate({"top":top+"px"});
};


