if(typeof(T3) == "undefined") T3 = {};
if(!T3.Home) T3.Home = {};

T3.Home.HeroImageSlideShow = function (elm, imgs) {
    var _this = this;
    var _elm = elm;
    var _imgElm;
    var _images = imgs;
    var _index = 0;
    var _controls;
    var _dot;
    var _current;
    var _previous;
    var _timer;

    new function () {
        $(window).unload(function () { dispose(); });
        $(function () { initialize(); });
    };

    function dispose() {
        _this = null;
    };

    function initialize() {
        _imgElm = T3.Utilities.CreateElement(_elm, "div", "heroImgCon", "absolute-elm");
        _controls = T3.Utilities.CreateElement(_elm, "div", "heroControls", "absolute-elm");

        loadImage();
        buildControls();
        buildNavigation();

        $.imgpreload("images/home/hero/control_dot_sel.png", function () {
            _dot = T3.Utilities.CreateElement(_elm, "div", "dot-sel", "absolute-elm");
            _dot.css("opacity", .2);
            _dot.append(this);

            positionDot();
        });
    }

    function buildNavigation() {
        var left = T3.Utilities.CreateElement(_elm, "div", "hero_nav_left", "absolute-elm");
        var spacing = 10;

        $.imgpreload("images/buttons/hero_arrow_left.png", function () {
            left.css("cursor", "pointer");
            left.css("opacity", .2);
            left.append(this);

            var l = Math.round(-left.outerWidth() + spacing);

            left.css("top", Math.round($(_elm).outerHeight() / 2 - left.outerHeight() / 2));
            left.css("left", l);

            left.click(function () {
                _index--;

                if (_index < 0) _index = _images.length - 1;
                loadImage();
            });

            left.mouseover(function () {
                $(this).animate({ left: l - spacing, opacity: .5 }, { queue: false, duration: "1000", easing: "easeOutCirc" });
            });

            left.mouseout(function () {
                $(this).animate({ left: l, opacity: .2 }, { queue: false, duration: "1000", easing: "easeOutCirc" });
            });
        });

        var right = T3.Utilities.CreateElement(_elm, "div", "hero_nav_right", "absolute-elm");

        $.imgpreload("images/buttons/hero_arrow_right.png", function () {
            var l = Math.round($(_elm).outerWidth() - spacing);

            right.css("cursor", "pointer");
            right.css("opacity", .2);
            right.append(this);

            right.css("top", Math.round($(_elm).outerHeight() / 2 - right.outerHeight() / 2));
            right.css("left", l);

            right.click(function () {
                _index++;

                if (_index > _images.length - 1) _index = 0;
                loadImage();
            });

            right.mouseover(function () {
                $(this).animate({ left: l + spacing, opacity: .5 }, { queue: false, duration: "1000", easing: "easeOutCirc" });
            });

            right.mouseout(function () {
                $(this).animate({ left: l, opacity: .2 }, { queue: false, duration: "1000", easing: "easeOutCirc" });
            });
        });
    }

    function buildControls() {
        for (var i = 0; i < _images.length; i++) {
            var d = T3.Utilities.CreateElement(_elm, "div", "dot_" + i.toString(), "control-dot");
            d.append("<img src=\"images/home/hero/control_dot.png\">");
            $(_controls).append(d);

            d.click(function () {
                _index = $(this).attr("id").substring($(this).attr("id").length - 1, $(this).attr("id").length);

                loadImage();
            });

            if (i < _images.length - 1) {
                var div = T3.Utilities.CreateElement(_elm, "div", "hero_div_" + i, "hero-div");
                $(_controls).append(div);
            }
        }

        _controls.css("bottom", 16);
        _controls.css("left", Math.round($(_elm).outerWidth() / 2 - _controls.outerWidth() / 2));
    }

    function positionDot(anim) {
        var cd = $("#dot_" + _index);

        if (cd.position()) {
            var t = $(_controls).position().top + cd.position().top - $(_dot).outerHeight() / 2 + cd.outerHeight() / 2 + 2;
            var l = $(_controls).position().left + cd.position().left - $(_dot).outerWidth() / 2 + cd.outerWidth() / 2;

            if (anim) {
                $(_dot).animate({ top: t, left: l }, { queue: false, duration: "1000", easing: "easeOutCirc" });
            } else {
                $(_dot).css("top", t);
                $(_dot).css("left", l);
            }
        }
    }

    function loadImage() {
        clearInterval(_timer);

        $.imgpreload(imgs[_index].image, function () {
            _previous = _current;
            _current = this;

            $(this).addClass("absolute-elm");
            $(this).css("opacity", 0);
            $(this).css("overflow", "hidden");
            $(this).css("width", 887);
            $(_imgElm).append(this);
            $(this).attr("id", _index);
            $(this).animate({ opacity: 1 }, { queue: false, duration: "2000", easing: "easeOutCirc", complete: removeImage });

            var buttons = imgs[_index].buttons;
            var l = parseInt(buttons[0].x);

            for (var i in buttons) {
                var btn = T3.Utilities.CreateElement(_imgElm, "a", "btn_" + i.toString(), "absolute-elm");
                btn.css("white-space", "nowrap");
                btn.css("text-transform", "none");
                btn.css("font-size", 14);
                btn.css("padding", "6px 23px 12px 23px");
                btn.css("height", 10);
                btn.css("top", parseInt(buttons[i].y));
                btn.css("left", l);
                btn.text(buttons[i].text);
                btn.attr("href", buttons[i].url);

                btn.addClass("button").addClass("shadow");

                if (i < buttons.length && i != buttons.length - 1) {
                    l += btn.outerWidth() + 15;

                    var orTxt = T3.Utilities.CreateElement(_imgElm, "div", "or_" + i.toString(), "absolute-elm");
                    orTxt.css("top", parseInt(buttons[i].y) + 6);
                    orTxt.css("left", l);
                    orTxt.text("or");

                    l += orTxt.outerWidth() + 15;
                }
            }

            _timer = setInterval(function () {
                _index++;

                if (_index > _images.length - 1) _index = 0;
                loadImage();
            }, 10000);
        });

        positionDot(true);
    }

    function removeImage() {
        if (_previous) { $(_previous).remove(); }
    }
}