/***************************************************************
 *  Copyright notice
 *
 *  (c) 2011 Cobweb <typo3@cobweb.ch>
 *  All rights reserved
 *
 *  This script is part of the TYPO3 project. The TYPO3 project is
 *  free software; you can redistribute it and/or modify
 *  it under the terms of the GNU General Public License as published by
 *  the Free Software Foundation; either version 2 of the License, or
 *  (at your option) any later version.
 *
 *  The GNU General Public License can be found at
 *  http://www.gnu.org/copyleft/gpl.html.
 *  A copy is found in the textfile GPL.txt and important notices to the license
 *  from the author is found in LICENSE.txt distributed with these scripts.
 *
 *
 *  This script is distributed in the hope that it will be useful,
 *  but WITHOUT ANY WARRANTY; without even the implied warranty of
 *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *  GNU General Public License for more details.
 *
 *  This copyright notice MUST APPEAR in all copies of the script!
 ***************************************************************/

/**
 * @author Cobweb <typo3@cobweb.ch>
 * @package TYPO3
 */

/* Configuration */
var SShow_config_IntervalDefault = 4;
var SShow_config_IntervalOnClick = 6;
var SShow_config_navItemsPerLine = 4;


/* Variables */
var SShow_currentDisplayedStep = 1;
var SShow_currentSelectedStep = 1;
var SShow_currentSelectedLi = null;
var SShow_currentSelectedLiNum = 1;
var SShow_currentNavBarPosition = 0;
var SShow_navTotalItems = 0;
var SShow_navItemsWidth = false;
var SShow_currentInterval = 0;

function SShow_Init() {
    callFunc('SShow_Init');

    // Ajoute l'ombre au dessus des grandes images
    $('#slideshow_main').before('<div id="slideshow_topshadow"></div>');
    // Crée la structure de la barre de navigation
    $('#slideshow_main').after('' +
       '<div id="slideshow_navbar">' +
           '<ul id="slideshow_navitems"></ul>' +
           '<div id="slideshow_navbar_pagination" class="no_prev no_next">' +
               '<div id="slideshow_navbar_pagination_text">' +
                   '<span id="slideshow_navbar_pagination_prev"></span>' +
                   '<span id="slideshow_navbar_pagination_current">1 - 4  of </span>' +
                   '<span id="slideshow_navbar_pagination_total">8</span>' +
                   '<span id="slideshow_navbar_pagination_next"></span>' +
               '</div>' +
           '</div>' +
       '</div>');

    // Bouge tous les éléments thumbnails dans la barre de navigation
    $('ul#slideshow_main li .slideshow_thumbnail').appendTo($('ul#slideshow_navitems'));
    $('ul#slideshow_navitems .slideshow_thumbnail').wrap('<li />');

    // Sélectionne le premier item de la liste
    $('ul#slideshow_navitems li:first').addClass('selected');
    $('ul#slideshow_main li:first').addClass('selected');

    // On définit les identifiants des éléments de la liste des grandes images
    $('ul#slideshow_main li').each(function(el, item){
        var tmpNum = (el + 1);
        item.id = 'slideshow_item_' + tmpNum + '_big';
        if (tmpNum == 1) $(item).css('display','block');
        else $(item).css('display','none');
    });

    // On définit les identifiants des éléments de la liste des items de navigation
    $('ul#slideshow_navitems li').each(function(el, item){
        var tmpNum = (el + 1);
        item.id = 'slideshow_item_' + tmpNum;
        $(item).click(function(){
            SShow_switchImg($(this));
            SShow_currentSelectedLiNum = tmpNum;
            SShow_currentSelectedStep = SShow_getStepOfElement(SShow_currentSelectedLiNum);
            SShow_currentInterval = SShow_config_IntervalOnClick;
        });
    });

    // Définit l'élément actuellement sélectionné
    SShow_currentSelectedLi = $('ul#slideshow_navitems li:first');
    
    // Définit le total des éléments affichés
    SShow_navTotalItems = $('ul#slideshow_navitems li').length;
    // Calcule le nombre total d'éléments
    SShow_navItemsWidth = $('ul#slideshow_navitems li:first').outerWidth() * SShow_config_navItemsPerLine;

    // Initialisation de la navigation
    SShow_calcNewNavigation();
}

function SShow_switchImg(SShow_clickedItem) {
    callFunc('SShow_switchImg');

    if( SShow_clickedItem.attr('id') != SShow_currentSelectedLi.attr('id') ) {
        
        var ImgToHide = $('#' + SShow_currentSelectedLi.attr('id') + '_big');
        var ImgToShow = $('#' + SShow_clickedItem.attr('id') + '_big');

        ImgToShow.hide();
        ImgToShow.appendTo($('#slideshow_main'));
        ImgToShow.fadeIn(1000, function() {
            ImgToShow.addClass('selected');
            ImgToHide.css('display','none');
        });
        $('#' + SShow_currentSelectedLi.attr('id')).removeClass('selected');
        ImgToHide.removeClass('selected');
        $('#' + SShow_clickedItem.attr('id')).addClass('selected');

        SShow_currentSelectedLi = SShow_clickedItem;

    }
}

function SShow_showNext() {
    callFunc('SShow_showNext');

    SShow_currentDisplayedStep = SShow_currentDisplayedStep + 1;
    SShow_currentNavBarPosition = SShow_currentNavBarPosition - SShow_navItemsWidth;
    SShow_animNavBar();
    SShow_calcNewNavigation();
}

function SShow_showPrev() {
    callFunc('SShow_showPrev');

    SShow_currentDisplayedStep = SShow_currentDisplayedStep - 1;
    SShow_currentNavBarPosition = SShow_currentNavBarPosition + SShow_navItemsWidth;
    SShow_animNavBar();
    SShow_calcNewNavigation();
}

function SShow_moveToNext() {
    callFunc('SShow_moveToNext');


    cInfo('check if displayed == selected');
    cInfo('SShow_currentSelectedStep : ' + SShow_currentSelectedStep );
    cInfo('SShow_currentDisplayedStep : ' + SShow_currentDisplayedStep );

    var sync = false;
    if (SShow_currentSelectedStep == SShow_currentDisplayedStep )  {
        sync = true;
    }

    if ( SShow_currentSelectedLiNum == SShow_navTotalItems ) {
        SShow_currentSelectedStep = 1;
        SShow_ReturnToFirstElement();
    }
    else {
        SShow_currentSelectedLiNum = SShow_currentSelectedLiNum + 1;

        if ( SShow_currentSelectedLiNum % SShow_config_navItemsPerLine == 1 ) {
;
            SShow_currentSelectedStep = SShow_currentSelectedStep + 1;
            cInfo('SShow_currentSelectedStep changed in SShow_moveToNext:' + SShow_currentSelectedStep );
            SShow_currentNavBarPosition = SShow_currentNavBarPosition - SShow_navItemsWidth;
        }
    }


    if (sync) {
        SShow_currentDisplayedStep = SShow_currentSelectedStep;
        SShow_animNavBar();
        SShow_calcNewNavigation();
    }


    SShow_switchImg(  $('#slideshow_item_' + SShow_currentSelectedLiNum ) );

}

function SShow_ReturnToFirstElement() {
    callFunc('SShow_ReturnToFirstElement');

    SShow_currentSelectedLiNum = 1;
    SShow_currentNavBarPosition = 0;
    cInfo('SShow_currentSelectedLiNum changed in SShow_ReturnToFirstElement:' + SShow_currentSelectedLiNum );
    SShow_switchImg( $('#slideshow_item_1' ) );
}

function SShow_calcNewNavigation() {
    callFunc('SShow_calcNewNavigation');
    
    var fromVal = (SShow_currentDisplayedStep - 1) * SShow_config_navItemsPerLine + 1;
    var toVal = fromVal + SShow_config_navItemsPerLine - 1;

    if ( toVal < SShow_navTotalItems ) SShow_activateNext();
    else {
        toVal = SShow_navTotalItems;
        SShow_desactivateNext();
    }

    if ( fromVal == 1 ) SShow_desactivatePrev();
    else SShow_activatePrev();

    $('#slideshow_navbar_pagination_current').html( fromVal + ' - ' + toVal + ' of ' );
    $('#slideshow_navbar_pagination_total').html( SShow_navTotalItems );

}

function SShow_activateNext() {
    callFunc('SShow_activateNext');

    $('#slideshow_navbar_pagination').removeClass('no_next');
    $('#slideshow_navbar_pagination_next').unbind('click');
    $('#slideshow_navbar_pagination_next').click(function () {
        SShow_showNext();
    });
}

function SShow_desactivateNext() {
    callFunc('SShow_desactivateNext');

    $('#slideshow_navbar_pagination').addClass('no_next');
    $('#slideshow_navbar_pagination_next').unbind('click');
}

function SShow_activatePrev() {
    callFunc('SShow_activatePrev');

    $('#slideshow_navbar_pagination').removeClass('no_prev');
    $('#slideshow_navbar_pagination_prev').unbind('click');
    $('#slideshow_navbar_pagination_prev').click(function () {
        SShow_showPrev();
    });
}

function SShow_desactivatePrev() {
    callFunc('SShow_desactivatePrev');

    $('#slideshow_navbar_pagination').addClass('no_prev');
    $('#slideshow_navbar_pagination_prev').unbind('click');
}

function SShow_animNavBar() {
    callFunc('SShow_animNavBar');

    $('#slideshow_navitems').animate({
        'margin-left': ( 0 - (SShow_currentDisplayedStep - 1 ) * SShow_navItemsWidth ) + 'px'
    }, 500, function() {
    // Animation complete.
    });


}

function SShow_getStepOfElement(num) {
    var diff = num % SShow_config_navItemsPerLine;
    var div = Math.floor( num / SShow_config_navItemsPerLine) ;
    if (diff > 0) return div + 1;
    else return div;
}

function cInfo(msg) {
    //console.info(msg);
}

function callFunc(msg) {
    //cInfo('------' + msg + '------');
}


$(document).ready(function() {

    SShow_Init();
    SShow_currentInterval = SShow_config_IntervalDefault;
    
    setInterval(function() {
        if (SShow_currentInterval == 0) {
            SShow_currentInterval = SShow_config_IntervalDefault;
            SShow_moveToNext();
        }
        SShow_currentInterval = SShow_currentInterval - 1;

    }, 1000);

});