var mycarousel_itemList = [
	{url: 'img/work_panique.jpg', title: 'Panique au village', linkJob:'http://www.paniqueauvillage.com/'},
	{url: 'img/work_twiggi.jpg', title: 'Twiggi', linkJob:'http://www.twiggi.be/'},
    {url: 'img/work_bureau347.jpg', title: 'Bureau347', linkJob:'http://www.bureau347.com/'},
    {url: 'img/work_laguna4control.jpg', title: 'Laguna 4control', linkJob:'http://www.4control.be/?lang=fr'},
    {url: 'img/work_pingping.jpg', title: 'PingPing', linkJob:'http://www.pingping.be/wp/?lang=fr'},
	{url: 'img/work_kanthaka.jpg', title: 'Kanthaka', linkJob:''}
];
var mycarousel_descriptionList = [
	{title: 'Panique au village', description: 'Int&eacute;gration de la page d\'accueil pour le site promotionnel du film "Panique au village"', jobdescription:'xHTML/CSS'},
	{title: 'Twingo', description: 'Int&eacute;gration du site pour la campagne "Twingo"', jobdescription:'xHTML/CSS'},
	{title: 'Bureau347', description: 'Int&eacute;gration du site de l\'agence Bureau347', jobdescription:'xHTML5/CSS'},
	{title: 'Renault', description: 'Int&eacute;gration du site produit "Laguna 4Control"', jobdescription:'xHTML/CSS'},
	{title: 'Belgacom', description: 'Design et int&eacute;gration Wordpress du site produit "PingPing"', jobdescription:'Webdesign, int&eacute;gration Wordpress'},
	{title: 'Kanthaka', description: 'Projet de design pour un site d\'e-commerce', jobdescription:'Webdesign'}
];

function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt)
{
    // The index() method calculates the index from a
    // given index who is out of the actual item range.
    var idx = carousel.index(i, mycarousel_itemList.length);
    carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[idx - 1]));
	jQuery('#work_projet h6').html(mycarousel_descriptionList[idx - 1].title);
	jQuery('#work_projet p').html(mycarousel_descriptionList[idx - 1].description);
	jQuery('#work_job p').html(mycarousel_descriptionList[idx - 1].jobdescription);
	jQuery('.jcarousel-control a').removeClass('active');
	jQuery('.jcarousel-control a#'+idx).addClass('active');
};

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt)
{
    carousel.remove(i);
};

function mycarousel_initCallback(carousel) {
    jQuery('.jcarousel-control a').bind('click', function() {
        carousel.scroll(jQuery.jcarousel.intval(jQuery(this).attr('id')));
        return false;
    });
    jQuery('#mycarousel-next').bind('click', function() {
        carousel.next();
        return false;
    });
    jQuery('#mycarousel-prev').bind('click', function() {
        carousel.prev();
        return false;
    });
};

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item)
{
    return '<a href="' + item.linkJob + '"<img src="' + item.url + '" alt="' + item.title + '" style="width: 716px; height: 453px;" /></a>';
};


/**
 * formulaire validation.
 */


jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        wrap: 'circular',
        itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
        itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback},
		
		 scroll: 1,
        initCallback: mycarousel_initCallback,
        // This tells jCarousel NOT to autobuild prev/next buttons
        buttonNextHTML: null,
        buttonPrevHTML: null
    });
	jQuery('.jcarousel-clip').wrap('<div id="shadow"></div>');
	
	jQuery(window).load(function () {
  			window.location.replace("#header");
	});
	
	jQuery(document).pngFix( );
	
});


$(function(){

    $('a[href*=#]').click(function() {
    
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 
        && location.hostname == this.hostname) {
        
            var $target = $(this.hash);
            
            $target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');
            
            if ($target.length) {
            
                var targetOffset = $target.offset().top;
                
                $('html,body').animate({scrollTop: targetOffset},1000);
                    
                return false;
                
            }
            
        }
        
    });
    
});
