﻿$(function () {
    var $homePageImages = $(".homePageImages .homePageImage");
    var numImgs = $homePageImages.size();
    var i;
    var imgs = new Array();
    var LEFT_MOVE = 0;
    var RIGHT_MOVE = 1;

    function HomeImage(data_src, link, i) {
        this.img = new Image();
        this.img.index = i;
        this.img.src = null;
        this.img.link = link;
        this.src = data_src;
    }

    WQ.LoadCss("../../Content/homeImagesSlide_v3.css");

    $('#mainLeft').show();
    $('#mainLeft').append($(".homePageImages"));
    var $imgesWall = $('#mainLeft .homePageImages');
    var $imgesWindow = $imgesWall.children('.imageSlideWall');
    $imgesWall.show();

    $imgesWindow.append('<div class="canvas"></div>');
    $canvas = $imgesWindow.children('.canvas');
    $canvas.css('width', 740 * numImgs);
    $canvas.append($homePageImages);

    $imgesWindow.append('<div class="reflection"></div>');
    $reflection = $imgesWindow.children('.reflection');
    $reflection.css('width', 740 * numImgs);

    $imgesWindow.append('<div class="shadow"></div>');
    $imgesWindow.children('.shadow').append('<div class="btnPanel"></div>');
    var $btnPanel = $imgesWindow.children('.shadow').children('.btnPanel');

    var currentImg = 0;
    var loadedImg = 0;
    var slideLock = false;
    i = 0;
    $homePageImages.each(
    function () {
        imgs.push(new HomeImage($(this).attr("data_src"), $(this).attr("link"), i));
        $(this).addClass("homePageImage_" + i++);
    });
    for (var i in imgs) {
        imgs[i].img.onload = function () {
            loadedImg++;
            var $imgDiv = $canvas.children(".homePageImage_" + this.index);
            $imgDiv.append('<img alt="" src=' + this.src + '>');
            $reflection.append('<img alt="" src=' + this.src + '>');

            if (this.link != null && this.link != '') {
                $imgDiv.css('cursor', 'pointer');
                var link = this.link;
                $imgDiv.click(
                function () {
                    window.location.href = link;
                });
            }

            $btnPanel.append('<div class="btn" id="btn_' + this.index + '"></div>');
            $btnPanel.css('left', (740 - $btnPanel.width()) / 2);
            if (this.index == 0) {
                $('#btn_0').addClass('currentBtn');
            }
            $('#btn_' + this.index).click(
            function () {
                currentImg = $(this).attr('id').split('_')[1] - 1;
                slideImage();
                $btnPanel.children('.currentBtn').removeClass('currentBtn');
                $(this).addClass('currentBtn');
            });

            if (this.index + 1 < imgs.length && imgs[this.index + 1].img.src != null) {
                imgs[this.index + 1].img.src = imgs[this.index + 1].src;
            }
        }
    }
    imgs[0].img.src = imgs[0].src;
    $canvas.hover(
    function () {
        slideLock = true;
    },
    function () {
        slideLock = false;
    });

    function slideImage() {
        if (!slideLock) {
            currentImg = (currentImg + 1) % loadedImg;
            $btnPanel.children('.currentBtn').removeClass('currentBtn');
            $('#btn_' + currentImg).addClass('currentBtn');
            $canvas.stop().animate({ left: currentImg * -740 }, 500);
            $reflection.stop().animate({ left: currentImg * -740 }, 500);
        }
    }
    setInterval(slideImage, 5000);

    /*------------------------------------------------------------------------------------*/
    $imgesWall.after($('.mainCenter .bottomNewsPanel'));
    var $bottomNewsPanel = $imgesWall.next('.bottomNewsPanel');
    $bottomNewsPanel.show();
    var $bottomNews = $bottomNewsPanel.children('.bottomNews');
    var numBottomNews = $bottomNews.size();
    var bottomNewsPosition = [-253, 0, 253, 506, 759];
    i = 0;

    $bottomNews.each(
    function () {
        var $this = $(this);
        $this.addClass('bottomNews_' + i);
        if (i < 3) {
            $this.css('left', bottomNewsPosition[i + 1]);
        }
        else {
            $this.css('left', bottomNewsPosition[0]);
        }
        $this.append('<div class="bottomNewsTitle ingorePosition">' + $this.attr('news_title') + '</div>');
        $this.append('<div class="bottomNewsContent"><img alt="' + $this.attr('news_title') + '" src="' + $this.attr('img_src') + '">' + '</img></div>');
        if ($this.attr('link') != null && $this.attr('link') != '') {
            $this.children('.bottomNewsContent').css('cursor', 'pointer');
            $this.children('.bottomNewsContent').click(
            function () {
                window.location.href = $this.attr('link');
            });
        }
        i++;
    });

    if (numBottomNews > 3) {
        $bottomNewsPanel.append('<div class="btn leftBtn" style="left:5px"><</div>');
        $bottomNewsPanel.append('<div class="btn rightBtn" style="right:5px">></div>');
        $bottomNewsPanel.children('.btn').css('opacity', 0.3);
        $bottomNewsPanel.children('.btn').hover(
        function () {
            $(this).stop().animate({ 'opacity': 1 }, 100);
        },
        function () {
            $(this).stop().animate({ 'opacity': 0.3 }, 100);
        });

        var currentFirstbottomNews = 0;
        $bottomNewsPanel.children('.leftBtn').click(
        function () {
            bottomNewsMove(LEFT_MOVE);
        });
        $bottomNewsPanel.children('.rightBtn').click(
        function () {
            bottomNewsMove(RIGHT_MOVE);
        });

        function bottomNewsMove(direction) {
            if (direction == LEFT_MOVE) {
                var temp = (currentFirstbottomNews + 3) % numBottomNews;
                $bottomNewsPanel.children('.bottomNews_' + temp).css('left', bottomNewsPosition[4]);
                for (var i = currentFirstbottomNews; i < currentFirstbottomNews + 4; i++) {
                    $bottomNewsPanel.children('.bottomNews_' + (i % numBottomNews)).stop().animate({ 'left': bottomNewsPosition[4 - (currentFirstbottomNews + 4 - i)] }, 500);
                }
                currentFirstbottomNews = (currentFirstbottomNews + 1) % numBottomNews;
            }
            else {
                var temp = (currentFirstbottomNews + numBottomNews - 1) % numBottomNews;
                $bottomNewsPanel.children('.bottomNews_' + temp).css('left', bottomNewsPosition[0]);
                for (var i = currentFirstbottomNews - 1; i < currentFirstbottomNews + 3; i++) {
                    $bottomNewsPanel.children('.bottomNews_' + ((i + numBottomNews) % numBottomNews)).stop().animate({ 'left': bottomNewsPosition[5 - (currentFirstbottomNews + 3 - i)] }, 500);
                }
                currentFirstbottomNews = temp;
            }
        }
        setInterval(bottomNewsMove, 3000);
    }
    /*---------------------------------------------------*/
    var $rightNewsPanel = $('.rightNewsPanel');
    $('#mainRight').show();
    $('#mainRight').append($rightNewsPanel);
    $rightNewsPanel.show();
    var $rightNews = $rightNewsPanel.children('.rightNews');
    $rightNewsPanel.append('<div class="rightNewsWindow"></div>');
    var $rightNewsWindow = $rightNewsPanel.children('.rightNewsWindow');
    $rightNewsWindow.append('<div class="rightNewsSlide"></div>');
    var $rightNewsSlide = $rightNewsWindow.children('.rightNewsSlide');
    $rightNewsSlide.append($rightNews);

    $rightNews.each(
    function () {
        var $this = $(this);
        $this.append('<a class="newsTitle" href=' + $this.attr('link') + '>' + $this.attr('news_title') + '</a>');
        $this.append('<div class="newsContent"><div class="imgFrame"><img alt=' + $this.attr('news_title') + ' src=' + $this.attr('img_src') + '></img></div>' + $this.attr('news_text') + '</div>');
    });

    function waitForCss() {
        if ($('body').css('z-index') == 1) {
            if ($rightNewsSlide.height() > $rightNewsWindow.height()) {
                $rightNewsPanel.append('<div class="scrollBtn">▲<br/>▼</div>');
                $rightNewsPanel.append('<div class="scrollFrame"></div>');
                var $scrollFrame = $rightNewsPanel.children('.scrollFrame');
                $scrollFrame.append('<div class="scrollBlock"></div>');
                $scrollFrame.append('<div class="scrollBlockAlpha"></div>');
                var $scrollBlock = $scrollFrame.children('.scrollBlock');
                var $scrollBlockAlpha = $scrollFrame.children('.scrollBlockAlpha');
                var $scrollBtn = $rightNewsPanel.children('.scrollBtn');
                var fadeOutLock = false;

                var scrollHeight = $rightNewsSlide.height() - $rightNewsWindow.height();
                $scrollBlockAlpha.draggable({
                    axis: "y",
                    containment: "parent",
                    drag: function (even) {
                        var currentTop = parseInt($scrollBlockAlpha.css('top')) - 3;
                        $scrollBlock.css('top', currentTop + 3);
                        $rightNewsWindow.scrollTop(currentTop * scrollHeight / 200);
                    }
                });

                $rightNewsWindow.scroll(
                function () {
                    if (!$.browser.msie) {
                        $scrollFrame.fadeIn(200,
                        function () {
                            setTimeout(scrollBarFadeOut, 2000);
                        });
                    }
                    else {
                        $scrollFrame.show();
                        $scrollBtn.hide();
                    }
                    $scrollBtn.hide();
                    $scrollBlock.css('top', $rightNewsWindow.scrollTop() * 200 / scrollHeight + 3);
                });

                $scrollBlock.hover(
                function () {
                    $scrollBlockAlpha.css('top', $scrollBlock.css('top'));
                }, null);

                $scrollBtn.hover(
                function () {
                    if (!$.browser.msie) {
                        $scrollFrame.fadeIn(200);
                    }
                    else {
                        $scrollFrame.show();
                    }
                    $scrollBtn.hide();
                }, null);

                $scrollFrame.hover(
                function () {
                    fadeOutLock = true;
                },
                function () {
                    fadeOutLock = false;
                    setTimeout(scrollBarFadeOut, 2000);
                });

                function scrollBarFadeOut() {
                    if (!fadeOutLock) {
                        if (!$.browser.msie) {
                            $scrollFrame.fadeOut(200,
                            function () {
                                $scrollBtn.show();
                            });
                        }
                        else {
                            $scrollFrame.hide();
                            $scrollBtn.show();
                        }
                    }
                }
            }
        }
        else {
            setTimeout(waitForCss, 1000);
        }
    }
    waitForCss();

    /*---------------------------------------------------*/
    function waitForSetShadow() {
        if ($('body').css('z-index') == '1') {
            //WQ.setIEShadow($('.homePageImages, .bottomNewsTitle, .imgFrame'), '#999', 6);
            WQ.setIEShadow($('.bottomNewsTitle'), '#999', 6);
        }
        else {
            setTimeout(waitForSetShadow, 1000);
        }
    }
    if (window.ActiveXObject) {
        waitForSetShadow();
    }
    $('.rightNewsWindow').mouseup(function () { $(this).css('overflow', 'auto') }).mousedown(function () { $(this).css('overflow', 'hidden') });

});
