﻿
App.Homepage = function () {

    /* Private */

    /* Properties */

    var cmp = {};





    /* Defaults */

    TVI.debug = false;





    /* Methods */

    var init = function () {

        //Cycle
        $(window).load(function () {
            $('.imageCycle').cycle({
                speed: 1400,
                timeout: 7000,
                after: onAfter
            });
        });

        // Set height of cycle container to image height
        function onAfter(curr, next, opts, fwd) {
            var $ht = $(this).height();

            //set the container's height to that of the current slide
            $('.homeMainContainer').animate({ height: $ht });
        }

        // Newsletter Form
        cmp.newsletterForm = new TVI.Form({

            ID: 'newsletterForm',
            url: TVI.handlers + '/app.account.aspx/newsletter',
            success: function () {
                this.success();
                $('#newsletterForm-email').hide();
            }
        });

        // Carousel Image Fade



        // Image Carousel
        var currentThumb = 0;

        // Get total width
        var totalWidth = 0;
        $('.carouselItem').each(function () {

            totalWidth += $(this).outerWidth(true);

        });

        // Set container to total width
        $('.carousel .itemScroller').width(totalWidth);

        // Carousel
        function moveCarousel(direction, oldThumb, carousel) {

            // Change thumnail according to direction. Check not start or end of carousel. 
            if (direction == 'left') {

                // Get offset of next thumb
                var itemWidth = carousel.find('.carouselItem:last').outerWidth(true);

                // Move last item to front of stack
                carousel.find('.carouselItem:last').prependTo('.itemScroller');

                // Reset position
                $('.itemScroller').css({ 'left': '-' + itemWidth + 'px' });

                // Move carousel
                carousel.find('.itemScroller').animate({ 'left': '0px' }, 250);

            } else if (direction == 'right') {

                // Get offset of next thumb
                var itemWidth = carousel.find('.carouselItem:first').outerWidth(true);

                // Move carousel
                carousel.find('.itemScroller').animate({ 'left': '-' + itemWidth + 'px' }, 250, function () {

                    // Move first item to end of stack
                    carousel.find('.carouselItem:first').appendTo('.itemScroller');

                    // Reset position
                    $(this).css({ 'left': '0px' });

                });

            }
        }

        /* Methods */

        // Arrow click
        $('.carousel .leftArrow, .carousel .rightArrow').live('click', function () {

            var carousel = $(this).parents('.carousel');

            // Get direction
            if ($(this).hasClass('leftArrow')) {
                direction = 'left';
            } else {
                direction = 'right';
            }

            moveCarousel(direction, currentThumb, carousel);

            clearInterval(interval);
            interval = setInterval(function () {
                moveCarousel('right', currentThumb, ($('.carousel')))
            }, 3000);

            return false;
        });

        // Move carousel every 3 seconds to the right
        var interval = setInterval(function () {
            moveCarousel('right', currentThumb, ($('.carousel')))
        }, 3000);

        var fadeTimer;

        // Pause Carousel On Hover + change opacity
        $(".carousel .carouselItem").hover(
            function () {
                clearTimeout(fadeTimer);
                clearInterval(interval);

                $(this).siblings(".carouselItem").stop(true, true).animate({
                    opacity: 0.5
                }, 350);
                $(this).animate({
                    opacity: 1
                }, 350);

            },
            function () {
                interval = setInterval(function () {
                    moveCarousel('right', currentThumb, ($('.carousel')))
                }, 3000);

                fadeTimer = setTimeout(function () {
                    $(".carouselItem").animate({
                        opacity: 1
                    }, 350);
                }, 100);

            }
        );


    };





    /* Public */

    TVI.apply(cmp, {

        /* Properties */

        test: 'test',

        /* Methods */

        test: function () {

            /* Test function  */

        }

    });


    TVI.ready(init);


    return cmp;


} ();
