﻿$(window).load(function () {


    $ShowroomInit = function (inTransitionType) {

        var $showroom = null;
        var $imageholder = null;
        var $images = null;
        var $boxholder = null;
        var $boxes = null;
        var $activebox = null;

        $showroom = $("#Showroom");
        $imageholder = $showroom.find(".images");
        $images = $imageholder.find("img");

        $boxholder = $showroom.find(".Infoboxes");
        $boxes = $boxholder.find(".Infobox");


        if ($images.size() == 0) {
            $showroom.hide();
        } else {

            //Initialization settings!

            $transitionType = 'fade';



            var $transitionSpeed = 1100;
            var $transitionSpeedManual = 400;
            var $transitionEasing = 'easeOutCirc';
            var $pauseBeforeAutoplayRestarts = 5500;
            var $pauseBetweenTransitions = 5500;
            var $navigationTransitionSpeed = 200;
            var $navigationTransitionEasing = 'easeOutCirc';

            //Navigation holders.
            var $navPrev = $showroom.find(".prevholder");
            var $navNext = $showroom.find(".nextholder");
            var $navLink = $showroom.find("div.link");

            //Find height and width from the first image
            var $slideHeight = $imageholder.find("img:first").height();
            var $slideWidth = $imageholder.find("img:first").width();

            //Do some auto css'ing.
            $showroom.css("height", $slideHeight);
            $showroom.css("width", $slideWidth);

            $navPrev.css("height", $slideHeight);
            //$navPrev.css("width", Math.floor($slideWidth / 2));
            $navNext.css("height", $slideHeight);
            //$navNext.css("width", Math.floor($slideWidth / 2));

            if ($transitionType == 'fade') {
                $images.css({ 'top': 0, 'left': 0, 'display': 'block', 'position': 'absolute' });
            }

            //Used for the fading slide cause of stacked images.
            $.fn.SetZIndex = function () {

                var z = 1000;
                $imageholder.find("img").each(function () {
                    z--;
                    $(this).css("z-index", z);

                });
            }
            $.fn.restartautoplay = function () {
                if (typeof (autoplay) != 'undefined') {
                    clearInterval(autoplay);
                }
                if (typeof (autoplayrestart) != 'undefined') {
                    clearTimeout(autoplayrestart);
                }
                autoplayrestart = setTimeout(function () {
                    $.fn.autoplay()
                }, $pauseBeforeAutoplayRestarts);
            }

            $.fn.nextSlide = function (typeOfRun) {


                //Manual should go faster than auto..
                switch (typeOfRun) {
                    case "manual": $transitionSpeed = $transitionSpeedManual;
                }

                //Fade or slide?
                if ($transitionType == 'fade') {


                    $boxes.removeClass("visible");
                    $activeBox = $boxholder.find("div." + $imageholder.find("img:eq(1)").attr("class"));
                    $activeBox.addClass("visible");    
                    $imageholder.find("img:first").stop(true, true).fadeOut($transitionSpeed, function () {
                        $(this).appendTo($imageholder);
                        $.fn.SetZIndex();
                        $(this).show();
                        $boxes.removeClass("visible");
                        $activeBox.addClass("visible");    
                    
                    });
                    //Display correct infobox
                    

                    
                    //Set correct link
                    $navLink.bind('click', function () {
                        window.location.replace($activeBox.find(".link").attr("href"));
                    });




                } else {
                    $imageholder.stop(true, true);
                    if ($imageholder.width() + parseInt($imageholder.css("left"), 10) == $images[0].width) {

                        $imageholder.find("img:first").appendTo($imageholder);

                        $imageholder.css({
                            left: function (index, value) {
                                return parseFloat(value) + $images[0].width;
                            }
                        });
                    }
                    $imageholder.animate({ left: '-=' + $images[0].width }, $transitionSpeed, $transitionEasing);
                }
            }



            $.fn.prevSlide = function (typeOfRun) {


                //Manual should go faster than auto..
                switch (typeOfRun) {
                    case "manual": $transitionSpeed = $transitionSpeedManual;
                }

                //Fade or slide?
                if ($transitionType == 'fade') {

                    $boxes.removeClass("visible");
                    $imageholder.find("img:last").stop(true, true).hide(0, function () {

                        $(this).prependTo($imageholder);
                        $.fn.SetZIndex();
                        $(this).fadeIn($transitionSpeed);
                        $activeBox = $boxholder.find("div." + $(this).attr("class"));
                    });

                    //Display correct infobox
                    //$activeBox = $boxholder.find("div." + $imageholder.find("img:last").attr("class"));
                    $activeBox.addClass("visible");
                    //Set correct link
                    $navLink.bind('click', function () {
                        window.location.replace($activeBox.find(".link").attr("href"));
                    });


                } else {
                    $imageholder.stop(true, true);
                    if (parseInt($imageholder.css("left"), 10) == 0) {

                        $imageholder.find("img:last").prependTo($imageholder);
                        $imageholder.css({
                            left: function (index, value) {
                                return parseFloat(value) - $images[0].width;
                            }
                        });
                    }
                    $imageholder.animate({ left: '+=' + $images[0].width }, $transitionSpeed, $transitionEasing);
                }
            }


            $.fn.autoplay = function () {
                autoplay = setInterval("$.fn.nextSlide()", $pauseBetweenTransitions);
            }


            $.fn.restartautoplay = function () {
                if (typeof (autoplay) != 'undefined') {
                    clearInterval(autoplay);
                }
                if (typeof (autoplayrestart) != 'undefined') {
                    clearTimeout(autoplayrestart);
                }
                autoplayrestart = setTimeout(function () {
                    $.fn.autoplay()
                }, $pauseBeforeAutoplayRestarts);
            }


            //Only allow navigation if there are multiple images.
            if ($images.size() > 1) {
                $navPrev.click(function () {
                    $.fn.prevSlide("manual");
                    $.fn.restartautoplay();
                });


                $navNext.click(function () {
                    $.fn.nextSlide("manual");
                    $.fn.restartautoplay();
                });


                $(document).keydown(function (e) {
                    if (e.keyCode == 37) {
                        $.fn.prevSlide("manual");
                        $.fn.restartautoplay();
                        return false;
                    }
                });


                $(document).keydown(function (e) {
                    if (e.keyCode == 39) {
                        $.fn.nextSlide("manual");
                        $.fn.restartautoplay();
                        return false;
                    }
                });
                $navPrev.hover(function () {
                    $(this).find("div").stop(true, true).animate({ marginLeft: 0 }, $navigationTransitionSpeed, $navigationTransitionEasing);
                }, function () {
                    $(this).find("div").stop(true, true).animate({ marginLeft: -65 }, $navigationTransitionSpeed, $navigationTransitionEasing);
                });

                $navNext.hover(function () {
                    $(this).find("div").stop(true, true).animate({ marginRight: 0 }, $navigationTransitionSpeed, $navigationTransitionEasing);
                }, function () {
                    $(this).find("div").stop(true, true).animate({ marginRight: -65 }, $navigationTransitionSpeed, $navigationTransitionEasing);
                });
            }


            $(function () {
                $.extend($.fn.disableSelect = function () {
                    return this.each(function () {
                        if ($.browser.mozilla) {//Firefox
                            $(this).css('MozUserSelect', 'none');
                        } else if ($.browser.msie) {//IE
                            $(this).bind('selectstart', function () { return false; });
                        } else {//Opera, etc.
                            $(this).mousedown(function () { return false; });
                        }
                    });
                });
                $showroom.disableSelect(); //No text selection on elements with a class of 'noSelect'
            });


            //If there are no or just a single image..
            //Start autoplay
            $activebox = $boxholder.find("div." + $imageholder.find("img:first").attr("class"));
            $activebox.addClass("visible");

            //Set correct link
            $navLink.bind('click', function () {
                window.location.replace($activebox.find(".link").attr("href"));
            });


            switch ($images.size()) {
                case 1:
                    $navPrev.hide();
                    $navNext.hide();
                    break;
                default:
                    if ($transitionType == 'fade') {
                        $.fn.SetZIndex();

                        $imageholder.css("width", $images[0].width);



                    } else { $imageholder.css("width", $images[0].width * $images.size()); }

                    $.fn.autoplay();
                    break;
            }

        }
    }
});
