/// <reference path="Libs/Plugins/jQuery/jquery.js" />

/// <summary>
/// © XTRA | Estetica e tecnologia
/// Email: info@xtra.it
/// </summary>
$(document).ready(function () {

    // Imposta: Modulo Visual
    $(function () {

        //: Parametri
        var $TimerInterval = 5000;
        var $IsSelectorEnabled = true;
        var $IsTimerEnabled = true;
        var $IsClickOnVisualEnabled = false;

        // Recupera: Elementi dalla pagina
        var $VisualContainer = $(".VisualContainer");
        var $VisualLoader = $(".VisualLoader", $VisualContainer);
        var $VisualItems = $(".VisualItem", $VisualContainer);

        var $Selector = $(".Selector", $VisualContainer);
        var $SelectorPrev = $(".SelectorPrev", $Selector);
        var $SelectorNext = $(".SelectorNext", $Selector);
        var $SelectorItems = $(".SelectorItem", $Selector);

        // Imposta: Posizione assoluta dei visual
        $VisualItems.css({ "position": "absolute", "z-index": 1 });

        // Imposta: Hide e toglie Hidden
        $Selector.hide();
        $Selector.removeClass("Hidden");

        $VisualItems.hide();
        $VisualItems.removeClass("Hidden");

        $VisualLoader.hide();
        $VisualLoader.removeClass("Hidden");

        $("#VideoEmbedPopup").hide();
        $("#VideoEmbedPopup").removeClass("Hidden");

        // Inizializza: Variabili
        var $VisualIndex = 0;
        var $VisualItemSelected = null;
        var $VisualItemPrevious = null;
        var $Timer = null;

        if ($VisualItems.length < 2) {

            $IsTimerEnabled = false;
        }

        VisualSelected_Set();


        //: Se attivato, imposta click di avanzamento su visual
        if ($IsClickOnVisualEnabled) {

            $VisualItems.click(function () {

                // Seleziona: Visual successivo
                MoveNext();

            });
        }

        $SelectorPrev.click(function () {

            // Seleziona: Visual precedente
            MovePrev();

        });

        $SelectorNext.click(function () {

            // Seleziona: Visual successivo
            MoveNext();

        });

        $SelectorItems.click(function () {

            // Seleziona: Visual selezionato
            MoveAt(this);

        });

        // Seleziona: Visual selezionato
        function MoveAt($SelectorItem) {

            // Disattiva: Timer
            Timer_Stop();

            //: Se non sta eseguendo un'animazione imposta il nuovo visual
            if ($VisualItems.filter(":animated").length == 0) {

                $VisualIndex = $SelectorItems.index($SelectorItem);

                // Carica: Visual corrente
                VisualSelected_Set();
            }
        }

        // Seleziona: Visual precedente
        function MovePrev() {

            // Disattiva: Timer
            Timer_Stop();

            //: Se non sta eseguendo un'animazione imposta il nuovo visual
            if ($VisualItems.filter(":animated").length == 0) {

                // Imposta: Nuovo indice
                if ($VisualIndex > 0)
                    $VisualIndex--;
                else
                    $VisualIndex = $VisualItems.length - 1;

                // Carica: Visual corrente
                VisualSelected_Set();
            }
        }

        // Seleziona: Visual successivo
        function MoveNext() {

            // Disattiva: Timer
            Timer_Stop();

            //: Se non sta eseguendo un'animazione imposta il nuovo visual
            if ($VisualItems.filter(":animated").length == 0) {

                // Imposta: Nuovo indice
                if ($VisualIndex < $VisualItems.length - 1)
                    $VisualIndex++;
                else
                    $VisualIndex = 0;

                //[DEV]
                $('.NavigatorIndex').text($VisualIndex);

                // Carica: Visual corrente
                VisualSelected_Set();
            }
        }

        // Carica: Contenuto visual corrente
        function VisualSelected_Set() {

            if ($VisualItems.index($VisualItemSelected) != $VisualIndex || $VisualItemSelected == null) {

                // Imposta: Selettore
                Selector_Set();

                if ($VisualItemSelected != null) {
                    $VisualItemPrevious = $VisualItemSelected;
                }

                // Imposta: Nuovo visual corrente
                $VisualItemSelected = $VisualItems.eq($VisualIndex);

                var $VideoEmbed = $(".VideoEmbed iframe", $VisualItemSelected);

                // Verifica: Se esiste il video
                if ($VideoEmbed.length > 0) {
                    //:Si Video
                    //alert($VideoEmbed.attr("src"));
                    VideoEmbed_Show($VideoEmbed.attr("src"));
                }
                else {
                    //:No Video
                    VideoEmbed_Hide();
                }

                if ($(".VisualImage", $VisualItemSelected).length == 0) {

                    //: Contenuto visual da caricare

                    var $ImageUrl = $(".ImageUrl", $VisualItemSelected).text();
                    var $ImageAlt = $(".ImageAlt", $VisualItemSelected).text();

                    // Imposta: Immagine <img>
                    var $VisualImage = $("<img/>")
                            .addClass("VisualImage Hidden")
                            .attr("alt", $ImageAlt)
                            .attr("src", $ImageUrl);

                    // Imposta: Immagine come background di VisualItem
                    //$VisualItemSelected.css({ "background-image": "url(" + $ImageUrl + "?random=" + (new Date()).getTime() + ")" });
                    $VisualItemSelected.css({ "background-image": "url(" + $ImageUrl + ")" });

                    $VisualLoader.show();

                    $VisualImage.load(function () {

                        $VisualLoader.hide();

                        //: Se attivato: imposta selettore
                        if ($IsSelectorEnabled) {

                            $Selector.show();
                        }

                        $VisualImage.appendTo($VisualItemSelected);

                        // Imposta: Visual corrente
                        VisualSelected_Render();

                    })
                .error(function () {

                    // Se attivato: imposta timer
                    if ($IsTimerEnabled) {

                        Timer_Start();
                    }
                });

                }
                else {

                    //: Contenuto visual già impostato

                    // Imposta: Visual corrente
                    VisualSelected_Render();
                }
            }
        }

        // Imposta: Contenuto visual corrente
        function VisualSelected_Render() {

            $VisualItemSelected.show();

            // Attiva: Visual selezionato sotto il precedente
            if ($VisualItemPrevious != null) {

                $VisualItemPrevious.css({ "z-index": 2 });

                $VisualItemPrevious.fadeOut(function () {

                    $VisualItemPrevious.css({ "z-index": 1 });
                });
            }

            // Se attivato: imposta timer
            if ($IsTimerEnabled) {
                Timer_Start();
            }
        }

        // Imposta: Selettore
        function Selector_Set() {

            $SelectorItems.removeClass("SelectorItem_Selected");
            $SelectorItems.eq($VisualIndex).addClass("SelectorItem_Selected");

            // Imposta: Pallino selezionato
            $(".SelectorItem_Pallino", $SelectorItems).removeClass("SelectorItem_Pallino_Selected");
            $(".SelectorItem_Pallino", $SelectorItems.eq($VisualIndex)).addClass("SelectorItem_Pallino_Selected");
        }

        // Avvia: Timer
        function Timer_Start() {

            $TimerInterval = $(".VisualDelay", $VisualItemSelected).text()*1000;
            $Timer = setTimeout(function () {
                MoveNext();
            }, $TimerInterval);
        }

        // Disattiva: Timer
        function Timer_Stop() {

            clearInterval($Timer);
        }
    });
});

// Attiva: Video
function VideoEmbed_Show(VideoEmbed) {

    if (VideoEmbed != "") {
        $("#VideoEmbedContent").html("<iframe src='" + VideoEmbed + "&autoplay=1' width='280' height='223' frameborder='0'></iframe>");
        $("#VideoEmbedPopup").fadeIn("7");
    }
};

// Disattiva: Video
function VideoEmbed_Hide() {

    $("#VideoEmbedContent").html("");
    $("#VideoEmbedPopup").fadeOut("5");
};