// JavaScript Document
$(document).ready(function() {
	///////////////////////////
	///////MENU TOGGLE////////
	//////////////////////////
	$('.menu-trigger').mouseover(function () {
        $(this).parent().parent().parent().find('.sub-menu').slideDown('fast').show();

        $('.sub-menu').hover(function () {}, function () {
            $(this).slideUp('fast').hide('fast'); //When the mouse hovers out of the subnav, move it back up  
        });

    });
	
	
	
	initHome();
	sliderWebsiteOne();
	
	
});



	///////////////////////////
	/////////SLIDERS//////////
	//////////////////////////
	
	var currentImage;
	var currentIndex = -1;
	var myTimer;
	var images = [];

	function showImage(index, speed) {
    currentIndex = index;


    $('div.navigation img').removeClass('active');
    $('div.navigation img').eq(index).addClass('active');

	
	$('div.slideshow > div.item').stop();
	//$('h1').html(index);
	$('div.slideshow > div.item').eq(index)
	.css({'opacity': '0', 'z-index': '9'}).fadeTo(speed, 1, function(){ 
		$('div.slideshow > div.item').css({'z-index':7});
		$('div.slideshow > div.item').eq(index).css({'z-index':8, 'filter': ''});
	});

    clearTimeout(myTimer);
    myTimer = setTimeout("showNext()", 5000);

}

function showNext() {

    var len = $('div.navigation img').length;
    var next = currentIndex < (len - 1) ? currentIndex + 1 : 0;

    showImage(next, 1500);

}

function initHome() {
	
	
/*	showNext(); //loads first image
        $('div.navigation img').each(function (index, domEle) {

            $(domEle).bind('click', function () {
                $('div.navigation img').removeClass('active');
                $(domEle).addClass('active');

                showImage($(domEle).index(), 1500);

            })
        });*/

		
		$('.trigger-2').hover(function () {
			
            $('#homepage .col-2 .object-2').animate({
				'opacity':1,
				},10, function(){
				$('#homepage .col-2 .object-2').fadeIn('10');
			})
			

        }, function () {
           	
			$('#homepage .col-2 .object-2').fadeOut('10',function(){
							 
			});
			
		
        })
	
		$('.trigger-3').hover(function () {
			
            $('#homepage .col-2 .object-3').animate({
				'opacity':1,
				},10, function(){
				$('#homepage .col-2 .object-3').fadeIn('10');
			})
			

        }, function () {
           	
			$('#homepage .col-2 .object-3').fadeOut('10',function(){
							 
			});
			
		
        })
		
		$('.trigger-4').hover(function () {
			
            $('#homepage .col-2 .object-4').animate({
				'opacity':1,
				},10, function(){
				$('#homepage .col-2 .object-4').fadeIn('10');
			})
			

        }, function () {
           	
			$('#homepage .col-2 .object-4').fadeOut('10',function(){
							 
			});
			
		
        })
		$('.trigger-5').hover(function () {
			
            $('#homepage .col-2 .object-5').animate({
				'opacity':1,
				},10, function(){
				$('#homepage .col-2 .object-5').fadeIn('10');
			})
			

        }, function () {
           	
			$('#homepage .col-2 .object-5').fadeOut('10',function(){
							 
			});
			
		
        })
		$('.trigger-6').hover(function () {
			
            $('#homepage .col-2 .object-6').animate({
				'opacity':1,
				},10, function(){
				$('#homepage .col-2 .object-6').fadeIn('10');
			})
			

        }, function () {
           	
			$('#homepage .col-2 .object-6').fadeOut('10',function(){
							 
			});
			
		
        })
		$('.trigger-7').hover(function () {
			
            $('#homepage .col-2 .object-7').animate({
				'opacity':1,
				},10, function(){
				$('#homepage .col-2 .object-7').fadeIn('10');
			})
			

        }, function () {
           	
			$('#homepage .col-2 .object-7').fadeOut('10',function(){
							 
			});
			
		
        })
		$('.trigger-8').hover(function () {
			
            $('#homepage .col-2 .object-8').animate({
				'opacity':1,
				},10, function(){
				$('#homepage .col-2 .object-8').fadeIn('10');
			})
			

        }, function () {
           	
			$('#homepage .col-2 .object-8').fadeOut('10',function(){
							 
			});
			
		
        })

}
//slider portfolio//
////////////////////////Slider Websites//////////////////////////
///////////////////////////////////////////////////////////////
function sliderWebsiteOne() {
	//Configuration
	var retour = true;
	var tempsTransition = 1000;
	var affichePlayPause = false;
	var lectureAutomatique = true;
	var tempsAttente = 6000;

	var icones = new Array();
	icones['play'] = 'img/play_slider.png';
	icones['pause'] = 'img/pause_slider.png';

	var currentPosition = 0;
	var slideWidth = 650;
	var slides = $('.slide');
	var numberOfSlides = slides.length;
	var interval;
	var lectureEnCours = false;
	// Supprime la scrollbar en JS
	$('.slides-container').css('overflow', 'hidden');

	// Attribue  .slide-inner  à toutes les div .slide
	slides.wrapAll('<div class="slide-inner"></div>')
	// Float left to display horizontally, readjust .slides width
	.css({
		'float': 'left',
		'width': slideWidth
	});

	// Longueur de .slide-inner égale au total de la longueur de tous les slides
	$('.slide-inner').css('width', slideWidth * numberOfSlides);

	// Insert controls in the DOM
	$('.control-container').prepend('<span class="control" id="leftControl">Précédent</span>').append('<span class="control" id="rightControl">Suivant</span>');



	// Hide left arrow control on first load
	manageControls(currentPosition);

	//Crée un écouteur d'évènement de type clic sur les classes .control
	$('.control').bind('click', function () {

		// Determine la nouvelle position
		currentPosition = ($(this).attr('id') == 'rightControl') ? currentPosition + 1 : currentPosition - 1;

		if (currentPosition == numberOfSlides && retour == false) {
			currentPosition--;
			pause();
		}

		// Cache ou montre les controles
		manageControls(currentPosition);
		// Fais bouger le slide
		$('.slide-inner').animate({
			'marginLeft': slideWidth * (-currentPosition)
		}, tempsTransition);
	});

	// manageControls: Cache ou montre les flêches de controle en fonction de la position courante

	function manageControls(position) {
		// Cache la fleche "précédent" si on est sur le premier slide
		if (position == 0) {
			$('#leftControl').hide()
		} else {
			$('#leftControl').show()
		}
		// Cache la fleche "suivant" si on est sur le dernier slide (et que le retour automatique n'est pas activé)
		if (position == numberOfSlides - 1 && retour == false) {
			$('#rightControl').hide();
		} else {
			$('#rightControl').show();
		}
		if (position == numberOfSlides && retour == true) {
			currentPosition = 0;
			$('#leftControl').hide();
		}
	}

	function suivant() {
		$('#rightControl').click();
	}

	function start() {
		lectureEnCours = true;
		interval = setInterval(suivant, tempsAttente);
	}

	function pause() {
		lectureEnCours = false;
		clearInterval(interval);
	}

	//Si le diapo est activé 
	if (lectureAutomatique == true) {
		start();
	}
	if (affichePlayPause == true) {
		$('.slides-container').prepend('<img id="navDiapo" src="" alt="Navigation diaporama" />');
		if (lectureAutomatique == true) {
			$('#navDiapo').attr('src', icones['pause']);
		} else {
			$('#navDiapo').attr('src', icones['play']);
		}
		$('#navDiapo').bind('click', function () {
			if (lectureEnCours == true) {
				$(this).attr('src', icones['play']);
				pause();
			} else {
				$(this).attr('src', icones['pause']);
				start();
			}
		});
	}
}