﻿Type.registerNamespace('inst');

(function ($) {

    /**** PLUGIN BODY ****/
    $.fn.showcase = function (options) {

        var options = $.extend({
            autoSlide: true,
            autoSlideDirection: "left",
            delayTime: 3000,
            slideTime: 300,
            slideControl: true,
            bulletControl: true,
            flashVars: undefined,
            params: {
                quality: 'high',
                bgcolor: '#000000',
                align: 'middle',
                allowScriptAccess: 'always',
                allowFullScreen: 'true',
                wmode: 'opaque'
            }
        }, options);

        options.params.flashVars = options.flashVars;

        return this.each(function () {


            $("#carousel-loader").hide();
            $("#showcase").show();
            /* STATIC VARIABLES */
            var $this = $(this);
            var $showcase = $this.children(":first");
            var $info = $showcase.next();
            var $elementsCount = $showcase.children().length;
            var $initialWidth = $showcase.width();

            /* GENERATING CONTROL BUTTONS */
            if (options.slideControl && $elementsCount > 1) {
                $("<div/>", {
                    "class": "prev-button",
                    click: function () { showPrev(); return false; },
                    css: { "display": "none" }
                }).appendTo($(this));
                $("<div/>", {
                    "class": "next-button",
                    click: function () { showNext(); return false; },
                    css: { "display": "none" }
                }).appendTo($(this));
            }

            /* GENERATING CONTROL BULLETS */
            if (options.bulletControl) {
                /* creating bulletbar */
                $bullets = $("<div/>", {
                    "class": "bullets"
                }).appendTo($this);
                /* creating previewbar */
                $bulletPreview = $("<div/>", {
                    "id": "bullet-preview"
                }).appendTo($bullets);
                $bulletPreviewWidth = $bulletPreview.width();
                $bulletPreviewHeight = $bulletPreview.height();

                /* creating bullets... */
                frame = $showcase.children(":first").children(":first");
                for (i = 0; i < $elementsCount; i++) {
                    $("<div/>", {
                        "class": "bullet",
                        "id": "bullet-" + (i + 1),
                        click: function () {
                            slideBullet($(this));
                            return false;
                        }
                    }).appendTo($bullets);
                    /* ...and preview images */
                    $("<img>", {
                        src: frame.attr("src"),
                        css: {
                            "left": $bulletPreviewWidth,
                            "width": $bulletPreviewWidth,
                            "height": $bulletPreviewHeight
                        },
                        "id": "preview-image-" + (i + 1)
                    }).appendTo($bulletPreview);
                    frame = frame.parent().next().children(":first");
                }
                $bulletPreview.children(":first").css("left", 0).addClass("active");
                $bulletWidth = $bullets.children(":last").width();

                /* BULLETS PREVIEW CONTROL */
                hidePreview = setTimeout(function () { $bulletPreview.fadeOut(20); }, 100);
                $bullets.children("div.bullet").hover(function () {
                    var bulletNum = parseInt($(this).attr("id").slice(7));
                    var currentNum = $bullets.children("div.bullet.active:first").attr("id").slice(7);

                    clearTimeout(hidePreview);
                    $bulletPreview
						.fadeIn(50, function () {
						    $(this).stop();
						})
						.animate({
						    "left": $bulletWidth * (bulletNum - 0.5) - $bulletPreviewWidth / 2
						}, 200)
						.attr("rel", bulletNum);

                    var nextPreview = $bulletPreview.find("#preview-image-" + bulletNum);
                    var currentPreview = $bulletPreview.find(".active");
                    if (bulletNum > currentNum)
                        var dir = "left";
                    else if (bulletNum < currentNum)
                        var dir = "right";
                    slidePreview(currentPreview, nextPreview, dir);

                }, function () {
                    hidePreview = setTimeout(function () { $bulletPreview.fadeOut(20); }, 100);
                });

                $bulletPreview.hover(function () {
                    clearTimeout(hidePreview);
                }, function () {
                    hidePreview = setTimeout(function () { $bulletPreview.fadeOut(20); }, 100);
                })
                $bulletPreview.click(function () {
                    slideBullet($bullets.find("#bullet-" + $(this).attr("rel")));
                });
            }

            /* PLACING ELEMENTS FOR ROTATING */
            $showcase.children().css({
                "position": "absolute",
                "float": "none",
                "left": $initialWidth
            });
            $frame = $showcase.children(":first").addClass("active").css({
                "left": "0"
            });
            for (i = 0; i < $elementsCount; i++) {
                $frame.attr("id", "frame-" + (i + 1));
                $frame = $frame.next();
            }
            $bullets.children("div.bullet:first").addClass("active");

            /* AUTOSLIDE INITIALISATION */
            if (options.autoSlide && $elementsCount > 1) {
                var carouselLoop = setInterval(options.autoSlideDirection == "left" ? showNext : showPrev, options.delayTime);
                $this.hover(function () {
                    clearInterval(carouselLoop);
                    $this.find("div.next-button,div.prev-button").fadeIn(50);
                }, function () {
                    carouselLoop = setInterval(options.autoSlideDirection == "left" ? showNext : showPrev, options.delayTime);
                    $this.find("div.next-button,div.prev-button").fadeOut(50);
                });
            }

            /* SHOW INFO */
            $showcase.children().click(function () {
                playVideo($(this));
                return false;
            });

            /**** GLOBAL FUNCTIONS ****/
            function showNext() {
                var currentFrame = $showcase.find("a.active:first");
                var nextFrame = currentFrame.next().length ? currentFrame.next() : $showcase.find("a:first");
                slideFrames(currentFrame, nextFrame, "left");
            }
            function showPrev() {
                currentFrame = $showcase.find("a.active:first");
                prevFrame = currentFrame.prev().length ? currentFrame.prev() : $showcase.find("a:last");
                slideFrames(currentFrame, prevFrame, "right");
            }
            function slideBullet(bullet) {
                var currentFrame = $showcase.find("a.active:first");
                var currentFrameNum = parseInt(currentFrame.attr("id").slice(6));
                var nextFrameNum = parseInt(bullet.attr("id").slice(7));
                var nextFrame = $showcase.find("#frame-" + nextFrameNum);
                if (currentFrameNum < nextFrameNum) {
                    slideFrames(currentFrame, nextFrame, "left");
                }
                else if (currentFrameNum > nextFrameNum) {
                    slideFrames(currentFrame, nextFrame, "right");
                }
            }
            function slideFrames(replaced_frame, shown_frame, direction) {
                $this.find("div.prev-button,div.next-button").off("click");
                $bullets.children().off("click");

                $bullets.find("#bullet-" + replaced_frame.attr("id").slice(6)).removeClass("active");
                $bullets.find("#bullet-" + shown_frame.attr("id").slice(6)).addClass("active");
                replaced_frame.removeClass("active");
                shown_frame.addClass("active");
                if (direction == "left") {
                    replaced_frame
						.animate({ "left": -$initialWidth }, options.slideTime);
                    shown_frame
						.animate({ "left": $initialWidth }, 0)
						.animate({ "left": 0 }, options.slideTime, function () {
						    $this.find("div.prev-button").on("click", function () { showPrev(); return false; });
						    $this.find("div.next-button").on("click", function () { showNext(); return false; });
						    $bullets.children("div.bullet").on("click", function () { slideBullet($(this)); });
						    $bulletPreview.on("click", function () { slideBullet($bullets.find("#bullet-" + $(this).attr("rel"))); });
						});
                }
                else {
                    replaced_frame
						.animate({ "left": $initialWidth }, options.slideTime);
                    shown_frame
						.animate({ "left": -$initialWidth }, 0)
						.animate({ "left": 0 }, options.slideTime, function () {
						    $showcase.parent().find("div.prev-button").on("click", function () { showPrev(); return false; });
						    $showcase.parent().find("div.next-button").on("click", function () { showNext(); return false; });
						    $bullets.children("div.bullet").on("click", function () { slideBullet($(this)); });
						    $bulletPreview.on("click", function () { slideBullet($bullets.find("#bullet-" + $(this).attr("rel"))); });
						});
                }
            }
            function slidePreview(replaced_frame, shown_frame, direction) {
                replaced_frame.removeClass("active");
                $bulletPreview.find("#preview-image-" + shown_frame.attr("id").slice(14)).addClass("active");

                if (direction == "left") {
                    replaced_frame
						.animate({ "left": -$bulletPreviewWidth }, 100);
                    shown_frame
						.animate({ "left": $bulletPreviewWidth }, 0)
						.animate({ "left": 0 }, 100);
                }
                else {
                    replaced_frame
						.animate({ "left": $bulletPreviewWidth }, 100);
                    shown_frame
						.animate({ "left": -$bulletPreviewWidth }, 0)
						.animate({ "left": 0 }, 100);
                }
            }
            function playVideo(elem) {
                LoadVotingContainer(elem.attr("video-id"));
                toggleShowcase(elem);
                if (elem.attr("custom-link") == "") {
                    $video = $this.prepend('<div id="player"></div>');
                    swfobject.embedSWF(elem.attr('video-link'), 'player', '715', '370', '8.0.0', 'expressInstall.swf', null, options.params, null);
                }
                else {
                    window.location.href = elem.attr('custom-link'); ;
                }
            }
            function toggleShowcase(frame) {
                if ($showcase.css("display") == "block") {
                    $showcase.fadeOut(options.slideTime);
                    $bullets.fadeOut(options.slideTime);
                    $this.find("div.next-button,div.prev-button").fadeOut(options.slideTime);
                    $this.off("hover");
                    $this.animate({ "height": 370 }, options.slideTime);
                    $info.fadeIn(options.slideTime);
                    $info.find("#video-info-" + frame.attr("data-id")).fadeIn(options.slideTime);
                    $info.find("div.mv-voting-panel").fadeIn(options.slideTime);
                }
                else {
                    $this.children(":first").remove();
                    $this.on("mouseenter", function () {
                        clearInterval(carouselLoop);
                        $this.find("div.next-button,div.prev-button").fadeIn(50);
                    });
                    $this.on("mouseleave", function () {
                        carouselLoop = setInterval(options.autoSlideDirection == "left" ? showNext : showPrev, options.delayTime);
                        $this.find("div.next-button,div.prev-button").fadeOut(50);
                    });
                    $this.animate({ "height": 437 }, options.slideTime);
                    $showcase.fadeIn(options.slideTime);
                    $bullets.fadeIn(options.slideTime);
                    $info.fadeOut(options.slideTime);
                    $info.children().fadeOut(options.slideTime);
                }
            }
            function stopVideo() {
                toggleShowcase();
            }
            inst.stopCarousel = stopVideo;
        });
    }

})(jQuery);

function PlayerIsStopped() {
    inst.stopCarousel();
}
