$(function() {
    var browserDimensions = [$(window).width(), $(window).height()];
    var posY = Math.floor((browserDimensions[1] - 611) / 2 - 25)
    if (posY < 0) { posY = 0; }
    $('.popup .window').css({ top: posY + 'px' });
    //--- Ferme le popup du slider ----------------------------------
    $('.popup .window .close').click(function(event) {
        event.preventDefault();
        if ($.browser.msie) { $('#flvPlayer').html(''); }
        $('.popup').fadeOut('slow');
    });

    //--- Empêche les click sur l'image au centre du carousel --------
    $('.year-imgs ul li a').live('click', function(event) { event.preventDefault(); });

    $('#carouselItemContainer li a.thumItem').live('click', function(event) {
        event.preventDefault();
        $('#popupContainer').css({ left: '0' });
        var node = $(this).children('img').attr('data-nodeID');
        $('.popup').fadeIn('slow');

      

        var yearTitle = $('.year-imgs .ieFix .imgs li.selected').attr('data-year') +
                        " - " +
                        $(this).next().children().first().text();
        updateLightBox(node, yearTitle, function() {
            sliderVideoIni();
            mediasUpdate($('.popup .slider a:first'));
            $('.popup .arrow.next').click(function() { deplacementSliderPopup(sliderVideoObj, -1); });
            $('.popup .arrow.previous').click(function() { deplacementSliderPopup(sliderVideoObj, 1); });

            $('.popup .slider a').live('click', function(event) {
                event.preventDefault();
                mediasUpdate($(this));
            });
        });
    });
});



function sliderVideoIni() {
    sliderVideoObj = { element: $('#DetailContent ul'), nbr: $('#DetailContent ul').children().length, largeurUnite: 133, fenetre: $('#DetailContent').width(), pos: 0, vitesse: 300, nbrVisible: 4, incrementation: 0 };
    sliderVideoObj.element.css({ width: sliderVideoObj.nbr * sliderVideoObj.largeurUnite + 'px' });
    if (sliderVideoObj.nbr < (sliderVideoObj.nbrVisible + 1)) 
    {
        if ($('.popup .arrow.next').hasClass('inactive'))
        { }
        else 
        {
            $('.popup .arrow.next').addClass('inactive');
        }
    } 
    else 
    {
        if ($('.popup .arrow.next').hasClass('inactive')) 
        {
            $('.popup .arrow.next').removeClass('inactive');
        }
    }
    $('.popup .arrow.previous').addClass('inactive');
    $('.popup .slider a:first').click();
    //ajustementVerticalThumbs();
}

function mediasUpdate(pThumb) {
    var type = pThumb.attr('data-type');
    var lien = pThumb.attr('href');
    var title = pThumb.attr('data-title');
    var imageText = pThumb.parent().find(".text").html();
    
    var item = pThumb.attr('data-item');

    $('.popup .window').children('h2').html(title);
    $('.popup .slider-desc').html(imageText);

    $('.popup .slider li.highlight').removeClass('highlight');
    pThumb.parent().addClass('highlight');
    if (type == "youtube") {
        $('#yt').attr('src', lien + '?wmode=transparent&autohide=1&showinfo=0').css({ display: 'block' });
        $('.player img, #flvPlayer').css({ display: 'none' });
    } else if (type == "vimeo") {
        $('#yt').attr('src', item + '?title=0&amp;byline=0&amp;portrait=0').css({ display: 'block' });
        $('.player img, #flvPlayer').css({ display: 'none' });
    } else if (type == "flv") {
        updatePlayer(item);
        $('#flvPlayer').css({ display: 'block' });
        $('.player img, #yt').css({ display: 'none' });
    } else {
        $('.player img').attr('src', lien);
        $('.player img').css({ display: 'inline' })
        $('#yt, #flvPlayer').css({ display: 'none' });
    }
}

var popupSliderTransition=false;
function deplacementSliderPopup(pSlider, incrementation) {
    if (pSlider.nbr * pSlider.largeurUnite + pSlider.pos + incrementation >= pSlider.fenetre && pSlider.pos + incrementation * pSlider.largeurUnite <= 0 && popupSliderTransition==false) {
        popupSliderTransition = true;
        pSlider.incrementation += incrementation;
        if (pSlider.incrementation == 0) { pSlider.element.parent().parent().children('.previous').addClass('inactive'); }
        else { pSlider.element.parent().parent().children('.previous').removeClass('inactive'); }
        if (pSlider.nbr + pSlider.incrementation == pSlider.nbrVisible) { pSlider.element.parent().parent().children('.next').addClass('inactive'); }
        else { pSlider.element.parent().parent().children('.next').removeClass('inactive'); }
        pSlider.element.animate({ left: '+=' + pSlider.largeurUnite * incrementation + 'px' }, pSlider.vitesse, function() { popupSliderTransition = false; });
        pSlider.pos += pSlider.largeurUnite * incrementation;
    }
}

function deplacementSlider(pSlider, pIncrementation) {
    var slideDistance = pSlider.thumb_width * 0.3985 * pIncrementation;
    
    if (animation == false) {
        animation = true;

        pSlider.pos += pIncrementation * -1;
        if (pSlider.pos < 0) { pSlider.pos = pSlider.nbr }
        else if (pSlider.pos > pSlider.nbr) { pSlider.pos = 0 }
        pSlider._ul.children('li').each(function(i) {
            if (i == 1) {
                var newPos = 0
                if (pIncrementation == 1) { newPos = 382.4 }
                $(this).animate({ width: slider.thumb_width * 0.8 + 'px', height: slider.thumb_height * 0.8 + 'px', marginTop: '20px', marginLeft: 0, paddingTop: '11px', paddingLeft: '68px', paddingBottom: '18px', paddingRight: '68px', left: newPos + 'px' }, 300, function() {
                    $(this).removeClass('selected');
                });
            } else if (i == 1 - pIncrementation) { // Slide going to the middle
            var slide = $(this);
                slide.css({ zIndex: 3, opacity: 1 }).addClass('selected');
                slide.next().css({ zIndex: 2, opacity: 1 });
                slide.next().next().css({ opacity: 0 });
                slide.prev().prev().css({ opacity: 0 });
                slide.prev().css({ zIndex: 2, opacity: 1 });
                //--- Change la première image des évènements ------------------------

                //$('.year-events li:first a img').attr('src', slide.children().children().attr('src'));
                if (pIncrementation == '1') {
                    var movedLi = '<li data-parentid="' + pSlider._ul.children('li:last').attr('data-parentid') +
                                    '" data-year="' + pSlider._ul.children('li:last').attr('data-year') +
                                    '" data-src="' + pSlider._ul.children('li:last').attr('data-src') +
                                    '" data-nodeid="' + pSlider._ul.children('li:last').attr('data-nodeid') +
                                    '" style="width:382.4px; height:226.4px; padding:11px 68px 18px; margin-top:20px; opacity:0; z-index:1; left:-191.2px;">' +
                                        pSlider._ul.children('li:last').html() + '</li>';
                    $('.imgs').prepend(movedLi).children('li:last').remove();
                    var year = $(this).attr('data-year');
                    var node = $(this).attr('data-nodeid');
                    $('.imgs li:first').animate({ left: 0, opacity: 1 }, 300, callbackYearSelection(year, node));
                }

                slide.animate({ width: slider.thumb_width + 'px', height: slider.thumb_height + 'px', marginTop: 0, marginLeft: '-65px', paddingTop: '14px', paddingLeft: '85px', paddingBottom: '23px', paddingRight: '85px', left: '+=' + slideDistance + 'px' }, 300, function() {


                if (pIncrementation == '-1') {
                    
                        var movedLi = '<li data-parentid="' + pSlider._ul.children('li:first').attr('data-parentid') +
                                        '" data-year="' + pSlider._ul.children('li:first').attr('data-year') +
                                        '" data-nodeid="' + pSlider._ul.children('li:first').attr('data-nodeid') +
                                        '" data-src="' + pSlider._ul.children('li:first').attr('data-src') +
                                        '" style="width:382.4px; height:226.4px; padding:11px 68px 18px; margin-top:20px; opacity:0; z-index:1; left:' + 191.2 * (pSlider.nbr - 1) + 'px;">' + pSlider._ul.children('li:first').html() + '</li>';
                        $('.imgs').append(movedLi).children('li:first').remove();
                        //                        yearSelection(pSlider._ul.children('li.selected').attr('data-year'));
                        yearSelection($(this).attr('data-year'), $(this).attr('data-nodeid'));
                    }
                });

            } else if (i == 1 - pIncrementation + 3) {
                $(this).css({ zIndex: 1, opacity: 0 }).animate({ left: '+=' + slideDistance + 'px' }, 300);
            } else if (i == 1 - pIncrementation + 1) {
            $(this).css({ zIndex: 1 }).animate({ left: '382.4px' }, 300);
            } else {
                $(this).css({ zIndex: 1 }).animate({ left: '+=' + slideDistance + 'px' }, 300, function() {
                    if (i == pSlider.nbr - 1) {
                        animation = false;
                    }
                });
            }
        });
    }
    preloadSlider(pSlider);
}

//function needs to be encapsulated to receive correctly parameters.
function callbackYearSelection(pYear, pNode)
{
    yearSelection(pYear, pNode);
}

function sync()
{
    var selected = $('.year-imgs .ieFix .imgs li.selected');

    $('#carouselItemContainer').children('li').each(function(index)
    {
        $(this).removeClass("firstPosition");
        if (selected.attr('data-nodeid') == $(this).children("a").children("img").attr('data-nodeid'))
        {
            $(this).addClass("firstPosition");
        }
    });

    var active = $('#carouselItemContainer').children('li.firstPosition');
    active.prependTo(active.parent());
}

function preloadSlider(pSlider)
{
    var xiPlus3 = pSlider._ul.children('li.selected').next().next().next();
    var xLast = pSlider._ul.children().last();
    if (xiPlus3.children('a').children('img').attr('src') != xiPlus3.attr('data-src'))
    {
        xiPlus3.children('a').children('img').attr('src', xiPlus3.attr('data-src'));
    }
    if (xLast.children('a').children('img').attr('src') != xLast.attr('data-src'))
    {
        xLast.children('a').children('img').attr('src', xLast.attr('data-src'));
    }
}

//--- Reconstruit la courbes des ANNÉES ----------------------------------------------
function populateYears(pDecade, pSelected, changeDecade)
{
    var bools = $('.year-imgs').attr("data-HasCarouselItem").split(",");
    var hasBeenSelected = false;
    
    for (i = 0; i <= 10; i++)
    {
        var year = parseInt(pDecade) + i;
        var classToAdd = '';

        if (!hasBeenSelected && bools[year - 1960] == '1')
        {
//            classToAdd += 'selected';
            hasBeenSelected = true;
        }
        else
        {
            if (bools[year - 1960] == '0')
            {
                classToAdd += ' off';
            }
        }
         
        $('.year-imgs .ieFix .years li:eq(' + i + ') a').html(year).parent().removeClass('selected off').addClass(classToAdd);
    }

//    if (changeDecade)
//    {
//        
//        //        var test1 = $('.year-imgs .ieFix .years li')[1];
//        var test1 = $('.year-imgs .ieFix .years li');
//        var count = 0;
//        test1.each(function(i)
//        {
//            if (test1.eq(i).hasClass('off') == false)
//            {
//                count++;
////                alert(test1[i]);
//                if (count == 2)
//                {
//                    test1.eq(i).addClass('selected');
//                }
//            }

//        });
//    }
}
//--- Affiche l'ANNÉE sélectionné -----------------------------------------------------
function yearIncrementation(pIncrementation)
{
    var year = $('.year-imgs .ieFix .years li.selected a').text();
    var i = parseInt(year.substring(year.length - 1)) + pIncrementation * -1;
    if (i > -1 && i < 10)
    {
        if (pIncrementation == -1) { $('.year-imgs .ieFix .years li.selected').removeClass('selected').next().addClass('selected'); }
        else { $('.year-imgs .ieFix .years li.selected').removeClass('selected').prev().addClass('selected'); }
    } else
    {
        decadeIncrementation(pIncrementation);
    }
    $('.year-events .more .year').text(parseInt(year) + pIncrementation * -1);
}

function yearSelection(pYear, pSelectedNodeId)
{
    var decade = pYear.substring(0, pYear.length - 1) + '0';

    //    console.log(pYear);
    //    console.log(decade);

    if ($('.decade-list li.selected a').attr('id') != decade)
    {

        $('.decade-list li.selected').removeClass('selected');
        $('#' + decade).parent().addClass('selected');
        populateYears(decade, pYear, false);
    }
    var i = parseInt(pYear.substring(pYear.length - 1));
    $('.year-imgs .ieFix .years li.selected').removeClass('selected');
    $('.year-imgs .ieFix .years li:eq(' + i + ')').addClass('selected');

    var node = $('.year-imgs .ieFix .imgs li.selected').attr("data-parentid");

    //--- load CMS data if year changes ------------------
    loadDetailContent(pYear, node);
}

function loadDetailContent(pYear, pNode) {


    $('.year-events a.more .toggle').text(viewMore);
    if (pYear != $('#renderCarouselItem').data("currentYear"))
    {
        updateDetails(pNode, pYear, function()
        {
            sync();
        });
    }
    else
    {
        sync();
    }
}

//--- Affiche la DÉCÉNNIE sélectionné ----------------------------------------------------
function decadeIncrementation(pIncrementation)
{
    var newDecade = parseInt($('.year-imgs .ieFix .years li:eq(0) a').text()) + pIncrementation * -10;
    var year = newDecade;
    if (pIncrementation == -1)
    {
        populateYears(newDecade, null, false);
        $('.decade-list li.selected').removeClass('selected').next().addClass('selected');
    } else
    {
        year = newDecade + 9;
        populateYears(newDecade, year, false);
        $('.decade-list li.selected').removeClass('selected').prev().addClass('selected');
    }
    $('.year-events .more .year').text(year);
}
function startTimer() {

    timer = setInterval(function() { deplacementSlider(slider, -1) }, 2000);
}

function initiate() {

    $('.year-imgs').show();

    populateYears(1960, null, false);
    startTimer();
    //--- Initialisation --------------------------------------------------------
    slider = {
        element: $('.year-imgs .ieFix'),
        _ul: $('.year-imgs .ieFix ul.imgs'),
        nbr: $('.year-imgs .ieFix .imgs li').length,
        thumb_width: $('.year-imgs .ieFix li').width(),
        thumb_height: $('.year-imgs .ieFix li').height(),
        _width: (($('.year-imgs .ieFix li').length) * ($('.year-imgs .ieFix li').width() * 0.8)),
        _height: $('.year-imgs .ieFix').height(),
        pos: 1,
        nbrVisible: 3,
        incrementation: -1
    };

    slider._ul.width(slider._width);
    setLiPos();
    //--- Clique sur les FLÈCHES -------------------------------------------------
    slider.element.children('.arrow.prev').click(function(event)
    {
        event.preventDefault();
        deplacementSlider(slider, 1);
        if (player) { $('.year-imgs .ieFix .player').click() };

    });
    slider.element.children('.arrow.next').click(function(event)
    {
        event.preventDefault();
        deplacementSlider(slider, -1);

        if (player) { $('.year-imgs .ieFix .player').click() };

    });
    //--- Clique sur les DÉCÉNNIES -------------------------------------------------
    $('.decade-list li a').click(function(event)
    {
        event.preventDefault();
        if ($(this).parent().hasClass('selected'))
        {
            return false;
        } else
        {

            $('.year-events a.more .toggle').text(viewMore);
            
            $('.decade-list li.selected').removeClass('selected');
            $(this).parent().addClass('selected');
            populateYears($(this).attr('id'), null, true);
            changeDecade(slider, parseInt($(this).parent().children('a').attr('id')));

            var yearIcons = $('.year-imgs .ieFix .years li');
            yearIcons.each(function(i)
            {
                var yearOfMasterImage = $('.year-imgs .ieFix .imgs li.selected').attr('data-year');
                var yearOfCurrentIcon = yearIcons.eq(i).children().text();
                if (yearIcons.eq(i).hasClass('off') == false && yearOfMasterImage == yearOfCurrentIcon)
                {
                    yearIcons.eq(i).addClass('selected');
                }
            });

            $('.year-events a.more .year').text($(this).attr('id'));
        }
    });
    //--- Player PLAY/STOP ----------------------------------------------------------
    $('.year-imgs .ieFix .player').click(function(event) {
        event.preventDefault();
        if (player) {
            $('.year-imgs .ieFix .player').removeClass('pause');
            clearInterval(timer)
            player = false;
        } else {
            $('.year-imgs .ieFix .player').addClass('pause');
            deplacementSlider(slider, -1);
            startTimer();
            player = true;
        }
    });

    var initiatingYear = $('.year-imgs .ieFix .imgs li.selected').attr('data-year');

    yearSelection(initiatingYear);
//    loadDetailContent(1960, $('.year-imgs .ieFix .imgs li.selected').attr("data-parentid"));
}

function setLiPos() {
    slider._ul.children('li').each(function(index) {
        $(this).css({ left: $(this).index() * slider.thumb_width * 0.4 + 'px' });
    });
    slider._ul.children('li').width(slider.thumb_width * 0.8).height(slider.thumb_height * 0.8).css({ paddingTop: '11px', paddingLeft: '68px', paddingBottom: '18px', paddingRight: '68px', marginTop: '20px', opacity: 0 });
    slider._ul.children('li').eq(slider.pos).width(slider.thumb_width).height(slider.thumb_height).addClass('selected').css({ paddingTop: '14px', paddingLeft: '85px', paddingBottom: '23px', paddingRight: '85px', marginTop: 0, marginLeft: '-65px', opacity: 1, zIndex: 3 });
    slider._ul.children('li').eq(slider.pos).next().css({ zIndex: 2, marginTop: '20px', opacity: 1, marginLeft: '0px' });
    slider._ul.children('li').eq(slider.pos).prev().css({ zIndex: 2, marginTop: '20px', opacity: 1, marginLeft: '0px' });
}

function changeDecade(pSlider, selectedDecade) {

    var inferiorDecadeNavigation = selectedDecade < $('.year-imgs .ieFix .imgs li.selected').attr("data-year");
    var actualDecade = (Math.floor(selectedDecade / 10)) * 10;
    
    if (player) {
        $('.year-imgs .ieFix .player').removeClass('pause');
        clearInterval(timer)
        player = false;
    }

    var liNewDecade = [];
    var liGlobal = [];
   
      var decadeOfFirstElement = Math.floor($(slider._ul.children('li')[0]).attr('data-year')/10);
      var decadeOfMaster = Math.floor($('.year-imgs .ieFix .imgs li.selected').attr("data-year")/10);
      var decadeOfSelected = Math.floor(selectedDecade/10);
      if(inferiorDecadeNavigation && (decadeOfMaster - decadeOfSelected) == 1)
      {
        slider._ul.children('li:first').appendTo(slider._ul);
      }

      slider._ul.children('li').each(function(i)
      {
          if ($(this).attr('data-year') >= selectedDecade && $(this).attr('data-year') < selectedDecade + 10)
          {
              $(this).children('a').children('img').attr('src', $(this).attr('data-src'));
              liNewDecade.push(i);
          }
          $(this).removeClass('selected');
          liGlobal.push(i);
      });

    var newListStart = liGlobal.slice(liNewDecade[0] - 1, liGlobal.length);
    var newListEnd = liGlobal.slice(0, liNewDecade[0] - 1);
    var newListNumber = newListStart.concat(newListEnd);
    
    var htmlList = '';
    for (x = 0; x < newListNumber.length; x++) {
        htmlList += $('<div>').append(slider._ul.children('li').eq(newListNumber[x]).clone()).remove().html();
    }
    slider._ul.html(htmlList);
    slider.pos = 1;
    setLiPos();

    slider._ul.children('li').first().children('a').children('img').attr('src', slider._ul.children('li').first().attr('data-src'));
    preloadSlider(slider);

//    loadDetailContent(selectedDecade, $('.year-imgs .ieFix .imgs li.selected').attr("data-parentid"));
    loadDetailContent($('.year-imgs .ieFix .imgs li.selected').attr("data-year"), $('.year-imgs .ieFix .imgs li.selected').attr("data-parentid"));
    
}