﻿/// <reference path="../External/jquery-1.3.2-vsdoc2.js" />
//
// Promotional Sequence Player 
//

var timeoutID = 0;
var sequenceIndex = 0;
var CurrentItemIndex = 0;
var FirstIndex = 0;
var VisibleItems = 0;
var MaxItemsInSequence = 8;
var ItemWidth = 55 + 10;

function WithPos(p) {
    for (var i = 0; i < SequenceList.length; i++) {
        if (SequenceList[i] != null && SequenceList[i].pos == p) {
            return i;
        }
    }
    return -1;
};

function IsNullSequence() {
    for (var i = 0; i < SequenceList.length; i++) {
        if (SequenceList[i] != null) {
            return false;
        }
    }
    return true;
};

function SortSequenceList(sortByModal, defaultCategoryID) {

    SequenceList.sort(function() { return 0.5 - Math.random() }); // Randomize list

    var idx = 1;
    var newSequence = [];
    while (!IsNullSequence()) { // Sort the Sequence
        var itemIndex = WithPos(idx);
        if (itemIndex < 0) {
            itemIndex = WithPos(0);
            idx++;
        }
        if (itemIndex > -1) {
            newSequence[newSequence.length] = SequenceList[itemIndex];
            SequenceList[itemIndex] = null;
        }
    }
    
    SequenceList = [];
    SequenceList = SequenceList.concat(newSequence);
};

function HtmlEncode(html) {
    return $('<div/>').text(html).html();
};

function HtmlDecode(text) {
    return $('<div/>').html(text).text();
};

var carouselPSP = null;

function homeSequences_initCallback(carousel) {
    carouselPSP = carousel;
    timeoutID = setTimeout(function() {
        sequenceIndex = (++sequenceIndex) % SequenceList.length;
        loadBigImage(SequenceList[sequenceIndex].imageUrl, SequenceList[sequenceIndex].link, SequenceList[sequenceIndex].newwindow);
        if (SequenceList[sequenceIndex].title) {
            loadBigTextMovie(SequenceList[sequenceIndex].title, SequenceList[sequenceIndex].text);
        } else {
            loadBigText(SequenceList[sequenceIndex].text);
        }
    }, switchSpeed);
};

function homeSequences_getItemHTML(itemIdx) {
    var item = SequenceList[itemIdx];
    var thumb = '';
    if (item.thumbUrl == null || item.thumbUrl == '') {
        thumb = thumbUrl + "?img=" + item.imageUrl + ",55,40";
    }
    else {
        thumb = item.thumbUrl;
    }
    return "<a href='javascript:;' onclick=\"loadBigInfo(" + itemIdx + ");\"><img src='" + thumb + "' width='55' height='40'/></a>";
};

function homeSequences_itemVisibleOutCallback(carousel, item, i, state, evt) {
    carousel.remove(i);
};

function InitHomePSP(defaultCategoryID) {
    $(document).ready(function() {
        if (SequenceList.length > 0) {
            SortSequenceList(true, defaultCategoryID);
            if (SequenceList != undefined && SequenceList != null && SequenceList.length > 0) {
                CreateCarousel();
            }
        }
    });
};

function InitPSP() {
    $(document).ready(function() {
        if (SequenceList.length > 0) {
            SortSequenceList(false, 0);

            $('#homeSequences').jcarousel({
                size: SequenceList.length,
                wrap: 'circular',
                initCallback: homeSequences_initCallback,
                itemVisibleInCallback: { onBeforeAnimation: homeSequences_itemVisibleInCallback },
                itemVisibleOutCallback: { onAfterAnimation: homeSequences_itemVisibleOutCallback }
            });
            if ($.browser.msie && $.browser.version.indexOf("6") == 0) {
                $('.jcarousel-skin-wn .jcarousel-container').addClass('jcarousel-container-ie6');
            }

            //Adding Play/Pause buttons
            var btnPlayPause = $("<div class='jcarousel-pause'></div>");
            btnPlayPause.bind("click", function(event) {
                PlayPauseCategory(this);
            });
            $("div.jcarousel-container-horizontal").prepend(btnPlayPause);
        }
    });
};

function loadBigInfo(itemIdx) {
    var item = SequenceList[itemIdx];
    sequenceIndex = itemIdx;
    loadBigImage(item.imageUrl, item.link, item.newwindow);
    if (item.title) {
        loadBigTextMovie(item.title, item.text);
    } else {
        loadBigText(item.text);
    }
};

function homeSequences_itemVisibleInCallback(carousel, item, i, state, evt) {
    var idx = carousel.index(i, SequenceList.length);
    carousel.add(i, homeSequences_getItemHTML(idx - 1));

    //Load a Big Image & Text if there is none
    if ($(bigImageID).html() == "") {
        var listIdx = carousel.first - 1;
        loadBigImage(SequenceList[listIdx].imageUrl, SequenceList[listIdx].link, SequenceList[listIdx].newwindow);

        if (SequenceList[listIdx].title) {
            loadBigTextMovie(SequenceList[listIdx].title, SequenceList[listIdx].text);
        } else {
            loadBigText(SequenceList[listIdx].text);
        }
    }
};

function loadBigImage(url, link, newwindow) {
    jQuery("<img>").attr("src", url);

    var div = $(bigImageID);
    div.fadeOut("slow", function() {
        if (link != "") {
            div.html("<a href='" + link + "'><img src='" + url + "'/></a>");
            var target = '';
            if (newwindow == true) {
                target = '_blank';
            }
            div.html('<a href="' + link + '"' + ' target="' + target + '">' + '<img src="' + url + '" /></a>');
        }
        else {
            div.html("<img src='" + url + "'/>");
        }
        div.fadeIn();
    });
};

function loadBigText(text) {
    var div = $(bigTextID);
    
    var playing = timeoutID != 0;

    div.fadeOut("slow", function() {
        div.html(HtmlDecode(text));
        div.fadeIn();

        clearTimeout(timeoutID);
        if (playing) {
            timeoutID = setTimeout(function() {
                sequenceIndex = (++sequenceIndex) % SequenceList.length;
                loadBigImage(SequenceList[sequenceIndex].imageUrl, SequenceList[sequenceIndex].link, SequenceList[sequenceIndex].newwindow);
                loadBigText(SequenceList[sequenceIndex].text);
            }, switchSpeed);
        }
    });
};

function loadBigTextMovie(title, text) {
    var div1 = $(bigTextID);
    var playing = timeoutID != 0;

    div1.fadeOut("slow", function() {
        div1.html('<h2>' + title + '</h2>');
        div1.fadeIn();
    });
    var div2 = $(bigDescriptionID);
    div2.fadeOut("slow", function() {
        div2.html(HtmlDecode(text));
        div2.fadeIn();

        clearTimeout(timeoutID);
        if (playing) {
            timeoutID = setTimeout(function() {
                sequenceIndex = (++sequenceIndex) % SequenceList.length;
                loadBigImage(SequenceList[sequenceIndex].imageUrl, SequenceList[sequenceIndex].link, SequenceList[sequenceIndex].newwindow);
                loadBigTextMovie(SequenceList[sequenceIndex].title, SequenceList[sequenceIndex].text);
            }, switchSpeed);
        }

    });
};

function CreateCarousel() {
    var html = "";

    html += "<a href='javascript:;' class='PlayPause' onclick='PlayPause();'><img src='" +
            pauseBtn + "' /></a>";

    html += "<a href='javascript:;' class='Prev' onclick='Scroll(-1);'><img src='" +
            prevBtn + "' /></a>";
    html += "<div class='Carousel'><div class='FilmStrip' style='width:" + (SequenceList.length * ItemWidth) + "px'>";
    for (var i = 0; i < SequenceList.length; i++) {
        html += CarouselGetItemHTML(i);
    }
    html += "</div></div>";
    html += "<a href='javascript:;' class='Next' onclick='Scroll(1);'><img src='" +
            nextBtn + "' /></a>";

    var Carousel = $('.CarouselDiv', $(pnlPSPID));
    Carousel.html(html);
    if (SequenceList.length > MaxItemsInSequence) {
        $('.Carousel', Carousel).width(MaxItemsInSequence * ItemWidth);
        VisibleItems = MaxItemsInSequence;
    }
    else {
        VisibleItems = SequenceList.length;
    }
    loadBigImageHome(null, 0);
    InitMotion();
    Scroll(0);
};

function InitMotion() {
    timeoutID = setTimeout(function() {
        loadBigImageHome(null, (++CurrentItemIndex) % SequenceList.length);
    }, switchSpeed);
};

function CarouselGetItemHTML(itemIndex) {
    var thumb = '';
    var item = SequenceList[itemIndex];
    if (item.thumbUrl == null || item.thumbUrl == '') {
        thumb = thumbUrlS3 + "?img=" + item.imageUrl + ",55,40";
    }
    else {
        thumb = item.thumbUrl;
    }
    return "<a href='javascript:;' onclick=\"loadBigImageHome(this, " + itemIndex + ");\"><img src='" + thumb + "' width='55' height='40'/></a>";
};

function loadBigImageHome(sender, idx) {

    var playing = timeoutID != 0;
    
    clearTimeout(timeoutID);

    CurrentItemIndex = idx;
    jQuery("<img>").attr("src", SequenceList[idx].imageUrl);

    var div = $(bigImageID);
    var visible = inviewport(div);

    div.fadeOut("slow", function () {
        if (SequenceList[idx].link != "") {
            var target = '';
            if (SequenceList[idx].newwindow == true) {
                target = '_blank';
            }
            div.html('<a href="' + SequenceList[idx].link + '"' + ' target="' + target + '">' + '<img src="' + SequenceList[idx].imageUrl + '" /></a>');
        }
        else {
            div.html("<img src='" + SequenceList[idx].imageUrl + "'/>");
        }

        if (visible) {
            div.fadeIn();
        }
        else {
            div.show();
        }

        if (playing) {
            timeoutID = setTimeout(function () {
                loadBigImageHome(null, (++CurrentItemIndex) % SequenceList.length);
            }, switchSpeed);
        }
    });
};

function inviewport($element) {
    return $(window).scrollTop() < ($("div.Body").offset().top + $element.height());
};

function Scroll(count) {
    var film = $('.FilmStrip', $(pnlPSPID));
    if (count > 0 && FirstIndex + VisibleItems < SequenceList.length) {
        FirstIndex++;
        film.animate({ marginLeft: -FirstIndex * ItemWidth }, 'fast');
    }
    else if (count < 0 && FirstIndex > 0) {
        FirstIndex--;
        film.animate({ marginLeft: -FirstIndex * ItemWidth }, 'fast');
    }
    if (FirstIndex == 0) {
        $('.Prev img', $(pnlPSPID)).hide();
    }
    else {
        $('.Prev img', $(pnlPSPID)).show();
    }
    if (FirstIndex + VisibleItems < SequenceList.length) {
        $('.Next img', $(pnlPSPID)).show();
    }
    else {
        $('.Next img', $(pnlPSPID)).hide();
    }
};

var PlayPausing = false;

function PlayPause() {
    if (!PlayPausing) {
        PlayPausing = true;
        if (timeoutID == 0) {   // Paused, start Playing
            InitMotion();
            $("a.PlayPause img").attr("src", pauseBtn);
        }
        else {  //Playing, make Pause
            clearInterval(timeoutID);
            timeoutID = 0;
            $("a.PlayPause img").attr("src", playBtn);
        }
        PlayPausing = false;
    }
};

function PlayPauseCategory(sender) {
    if (!PlayPausing) {
        PlayPausing = true;
        if (timeoutID == 0) {   // Paused, start Playing
            homeSequences_initCallback(carouselPSP);
            $(sender).removeClass("jcarousel-play");
        }
        else {  //Playing, make Pause
            clearInterval(timeoutID);
            timeoutID = 0;
            $(sender).addClass("jcarousel-play");
        }
        PlayPausing = false;
    }
};

