///<reference path="global.js" />
///<reference path="uielements.js" />

Gallery =
{
    Init: function () {
        Gallery.ImageHolder = $G.GET("#image-holder") || $G.Append(document.body, $G.Tag("div", { style: { width: "0px", height: "0px", overflow: "hidden"} }, "image-holder"));

        Gallery.Block = $G.Append(document.body, $G.Tag("div", "block"));
        Gallery.Preloader = $G.Append(Gallery.Block, $G.Tag("div", "preloader"));
        Gallery.Preloader.img = $G.Append(Gallery.Preloader, $G.Tag("img", "preloader_img", "", { src: "res/img/preloader.gif" }));

        Gallery.Div = $G.Append(document.body, $G.Tag("div", "image-popup", "image"));

        Gallery.Div.Slider = $G.Append(Gallery.Div, $G.Tag("div", "slider_pic"));
        Gallery.Div.Slider.Show = false;
        Gallery.Div.Move = $G.Append(Gallery.Div.Slider, $G.Tag("div", "movable_pic scroll type-vert", { toscroll: "up:1,next:1,0" }));

        Gallery.Div.SliderWrap = $G.Append(Gallery.Div, $G.Tag("div", "sliderwrap_pic"));
        Gallery.Div.Pic = $G.Append(Gallery.Div.SliderWrap, $G.Tag("div", "pic", { scroll: "up:1,prev:1,0" }));

        Gallery.Div.SliderVert = $G.Append(Gallery.Div, $G.Tag("div", "slider_pic_vert"));
        Gallery.Div.SliderVert.Show = false;
        Gallery.Div.MoveVert = $G.Append(Gallery.Div.SliderVert, $G.Tag("div", "movable_pic_vert scroll type-hor", { toscroll: "up:1,prev:1,0" }));

        Gallery.Div.SliderVertCone = $G.Append(Gallery.Div, $G.Tag("div", "slider_pic_vert_cone"));

        Gallery.Div.PrevBig = $G.Append(Gallery.Div, $G.Tag("div", "prev_big"));
        Gallery.Div.NextBig = $G.Append(Gallery.Div, $G.Tag("div", "next_big"));

        Gallery.Div.PrevSmall = $G.Append(Gallery.Div, $G.Tag("div", "prev"));
        Gallery.Div.NextSmall = $G.Append(Gallery.Div, $G.Tag("div", "next"));

        Gallery.NextShow = false;
        Gallery.PrevShow = false;

        Scroll.Add("#image,1,0", "scroll_Pic");

        Gallery.Div.Info = $G.Append(Gallery.Div, $G.Tag("div", "info"));
        Gallery.Div.Close = $G.Append(Gallery.Div, $G.Tag("div", "close"));

    },
    Div: null,

    WinResize: function () {

        var h = $G.Window.Height() - 20;

        var width = $G.Window.Width() - 20;

        if (h < 300) { h = 300; }
        if (width < 300) { width = 300; }

        Gallery.Div.SliderVertCone.style.display = "none";

        var _gTop = 10;
        var _gLeft = Math.round((width + 20) / 2);

        Gallery.Div.style.top = _gTop + "px";

        Gallery.Div.PrevSmall.style.display = "none";
        Gallery.Div.NextSmall.style.display = "none";

        Gallery.Div.PrevBig.style.display = "none";
        Gallery.Div.NextBig.style.display = "none";

        if (($G.Window.Width() - Gallery.Div.Pic.offsetWidth) > 100) {

            if (Gallery.PrevShow) { Gallery.Div.PrevBig.style.display = "block"; }
            if (Gallery.NextShow) { Gallery.Div.NextBig.style.display = "block"; }

            Gallery.Div.Prev = Gallery.Div.PrevBig;
            Gallery.Div.Next = Gallery.Div.NextBig;

        } else {

            if (Gallery.PrevShow) { Gallery.Div.PrevSmall.style.display = "block"; }
            if (Gallery.NextShow) { Gallery.Div.NextSmall.style.display = "block"; }

            Gallery.Div.Prev = Gallery.Div.PrevSmall;
            Gallery.Div.Next = Gallery.Div.NextSmall;
        }

        Gallery.Div.Next.style.filter = "alpha(opacity=100)";
        Gallery.Div.Prev.style.filter = "alpha(opacity=100)";
        Gallery.Div.Prev.style.opacity = "1.0";
        Gallery.Div.Next.style.opacity = "1.0";

        $G.Event.Remove(Gallery.Div.Next, "click", Gallery.Next);
        $G.Event.Remove(Gallery.Div.Prev, "click", Gallery.Prev);

        $G.Event.Add(Gallery.Div.Next, "click", Gallery.Next);
        $G.Event.Add(Gallery.Div.Prev, "click", Gallery.Prev);

        if (Gallery.Div.Pic.offsetHeight < h - 20) {
            Gallery.Div.SliderWrap.style.height = Gallery.Div.Pic.offsetHeight + "px";
            Gallery.Div.style.height = Gallery.Div.SliderWrap.offsetHeight + 20 + "px";
        } else {
            Gallery.Div.style.height = h + "px";
            Gallery.Div.SliderWrap.style.height = h - 20 + "px";
        }

        if (Gallery.Div.Pic.offsetHeight > h) {
            Gallery.Div.Slider.Show = true;
            Gallery.Div.Slider.style.display = "block";

            if ((Gallery.Div.Next.className == "next_big") || (Gallery.NextShow == false)) {
                if (h - 62 > 0) {
                    if (!Gallery.Div.SliderVert.Show) {
                        Gallery.Div.Slider.style.height = h - 62 + "px";
                    } else {
                        Gallery.Div.Slider.style.height = h - 72 + "px";
                        Gallery.Div.SliderVertCone.style.display = "block";
                    }
                }

            }
            else {
                if (h - 97 > 0) { Gallery.Div.Slider.style.height = h - 97 + "px"; }
            }
        } else {
            Gallery.Div.Slider.style.height = "0px";
            Gallery.Div.Slider.style.display = "none";
            Gallery.Div.Slider.Show = false;

        }

        if ((width - Gallery.Div.Pic.offsetWidth) < 20) {
            Gallery.Div.style.width = width + "px";
            Gallery.Div.SliderWrap.style.width = width - 20 + "px";

            Gallery.Div.SliderVert.style.display = "block";
            Gallery.Div.SliderVert.Show = true;

            if (Gallery.PrevShow == false && Gallery.NextShow == true) {
                Gallery.Div.SliderVert.style.width = width - 122 + "px";
                Gallery.Div.SliderVert.style.left = "10px";
            }

            if (Gallery.PrevShow == true && Gallery.NextShow == true) {
                Gallery.Div.SliderVert.style.width = width - 122 - 89 + "px";
                Gallery.Div.SliderVert.style.left = 99 + "px";
            }

            if (Gallery.PrevShow == true && Gallery.NextShow == false) {
                if (Gallery.Div.Slider.Show) {
                    Gallery.Div.SliderVert.style.width = width - 119 + "px";
                } else {
                    Gallery.Div.SliderVert.style.width = width - 109 + "px";
                }
                Gallery.Div.SliderVert.style.left = 99 + "px";
            }
        }
        else {
            Gallery.Div.SliderVert.style.width = "0px";
            Gallery.Div.SliderVert.Show = false;
            Gallery.Div.SliderVert.style.display = "none";
            Gallery.Div.SliderWrap.style.width = Gallery.Div.Pic.offsetWidth + "px";
            Gallery.Div.style.width = Gallery.Div.Pic.offsetWidth + 20 + "px";
        }

        Gallery.Div.style.left = _gLeft - Math.round(Gallery.Div.offsetWidth / 2) + "px";

        Gallery.Div.Move.style.marginTop = "0px";
        Gallery.Div.MoveVert.style.marginLeft = "0px";
        Gallery.Div.Pic.style.marginTop = "0px";
        Gallery.Div.Pic.style.marginLeft = "0px";

        $FX.Page.FadeIn("#000000", 60, function () { });

    },

    Show: function (obj, getImages) {

        // ---------------------------- add event ------------------------------------------------------------------------------

        $G.Event.Add(Gallery.Div.Close, "click", Gallery.Close);

        if (Gallery.Div.attachEvent) {
            $G.Event.Add(Gallery.Div, "keydown", Gallery.KeyPress);
        }

        if (window.addEventListener) {
            $G.Event.Add(window, "keydown", Gallery.KeyPress);
        }

        $G.Event.Add(window, "resize", Gallery.WinResize);

        // ----------------------------------------------------------------------------------------------------------------------

        document.body.style.position = "fixed";
        document.body.style.overflow = "hidden";

        Gallery.Div.SliderVert.style.width = "100px";

        if (getImages)
            Gallery.CurrentGetImages = getImages;
        else
            Gallery.CurrentGetImages = null;

        if (obj && obj.getAttribute("bigsrc")) {

            var img = $G.GET(Gallery.ImageHolder, [["@src", obj.getAttribute("bigsrc"), "0"]]);
            if (!img)
                img = $G.Append(Gallery.ImageHolder, $G.Tag("img", { src: obj.getAttribute("bigsrc") }));
            var _gTop = Math.round($G.Window.Height() / 2);
            var _gLeft = Math.round($G.Window.Width() / 2) - 10;
            Gallery.Div.style.width = "86px";
            Gallery.Div.style.height = "86px";
            Gallery.Div.SliderWrap.style.width = "66px";
            Gallery.Div.SliderWrap.style.height = "66px";

            Gallery.Div.style.top = _gTop + "px";
            Gallery.Div.style.left = _gLeft + "px";

            Gallery.Preloader.style.top = _gTop + "px";
            Gallery.Preloader.style.left = _gLeft + "px";

            Gallery.Div.style.display = "block";

            Gallery.Div.SliderVertCone.style.display = Gallery.Div.Info.style.display = Gallery.Div.Close.style.display = Gallery.Div.Slider.style.display = Gallery.Div.SliderVert.style.display = "none";
            Gallery.Div.NextBig.style.display = Gallery.Div.PrevBig.style.display = Gallery.Div.NextSmall.style.display = Gallery.Div.PrevSmall.style.display = "none";

            Gallery.Block.style.display = "block";

            $FX.Time(500).Page.FadeIn("#000000", 60, Gallery.LoadCheck.bind({ img: img, obj: obj }));
        }
    },

    Prev: function () {

        var imgs = Gallery.GetImages(Gallery.Current.obj);
        if (imgs.length > 0) {
            var info = Gallery.GetInfo(Gallery.Current.obj);
            var obj;

            if (info.index > 1)
                obj = imgs[info.index - 2];
            if (obj) {

                if (info.index == 2) {
                    $FX.Time(500).FadeOut(Gallery.Div.Prev, function () { Gallery.Div.Prev.style.cursor = "default"; });
                    Gallery.PrevShow = false;
                };

                if (Gallery.NextShow == false) {
                    $FX.Time(500).FadeIn(Gallery.Div.Next, function () { Gallery.Div.Next.style.cursor = "pointer"; });
                    Gallery.NextShow = true;
                }

                if (obj && obj.getAttribute("bigsrc")) {
                    var img = $G.GET(Gallery.ImageHolder, [["@src", obj.getAttribute("bigsrc"), "0"]]);
                    if (!img)
                        img = $G.Append(Gallery.ImageHolder, $G.Tag("img", { src: obj.getAttribute("bigsrc") }));
                    Gallery.LoadCheck.bind({ img: img, obj: obj })();
                }
            }
        }
    },
    Next: function () {

        var imgs = Gallery.GetImages(Gallery.Current.obj);
        if (imgs.length > 0) {
            var info = Gallery.GetInfo(Gallery.Current.obj);
            var obj;

            if (info.index < imgs.length)
                obj = imgs[info.index];
            if (obj) {

                if (info.index == imgs.length - 1) {
                    $FX.Time(500).FadeOut(Gallery.Div.Next, function () { Gallery.Div.Next.style.cursor = "default"; });
                    Gallery.NextShow = false;
                };

                if (Gallery.PrevShow == false) {
                    $FX.Time(500).FadeIn(Gallery.Div.Prev, function () { Gallery.Div.Prev.style.cursor = "pointer"; });
                    Gallery.PrevShow = true;
                }

                if (obj && obj.getAttribute("bigsrc")) {
                    var img = $G.GET(Gallery.ImageHolder, [["@src", obj.getAttribute("bigsrc"), "0"]]);
                    if (!img)
                        img = $G.Append(Gallery.ImageHolder, $G.Tag("img", { src: obj.getAttribute("bigsrc") }));
                    Gallery.LoadCheck.bind({ img: img, obj: obj })();

                }
            }
        }
    },
    GetImages: function (obj) {
        if (Gallery.CurrentGetImages)
            return Gallery.CurrentGetImages(obj);
        else
            return Gallery.DefaultGetImages(obj);
    },
    DefaultGetImages: function (obj) {
        return $G.GET(obj, "up").getElementsByTagName("img");
    },
    GetInfo: function (obj) {
        var imgs = Gallery.GetImages(obj);
        var result = { amount: 0, index: 0 };
        if (imgs) {
            result.amount = imgs.length;
            for (var i = 0; i < result.amount; i++) {
                if (imgs[i].getAttribute("bigsrc") == obj.getAttribute("bigsrc")) {
                    result.index = i + 1;
                    return result;
                }
            }
        }
        return { index: 0, amount: 0 };
    },
    LoadCheck: function () {        

        var _gTop = Math.round($G.Window.Height() / 2);
        var _gLeft = Math.round($G.Window.Width() / 2) - 10;        

        Gallery.Preloader.style.top = _gTop + "px";
        Gallery.Preloader.style.left = _gLeft + "px";

        Gallery.Block.style.display = "block";


        if (this.img.complete) {

            Gallery.Block.style.display = "none";            
            Gallery.Current = this;           

            Gallery.Div.Pic.style.background = "url(" + this.img.src + ") no-repeat center top";
            Gallery.Div.Pic.style.display = "block";           

            Gallery.Div.Pic.style.width = this.img.offsetWidth + "px";
            Gallery.Div.Pic.style.height = this.img.offsetHeight + "px";

            var h = $G.Window.Height() - 20;

            if (this.img.offsetHeight < h - 20) { h = this.img.offsetHeight + 20; }

            $FX.Interval(10).Time(500).AnimateStyle(Gallery.Div.SliderWrap, "height", h - 20, h - 20, function () {
                Gallery.Div.style.top = "10px";
                Gallery.Div.SliderWrap.style.height = h - 20;
                Gallery.Div.style.height = h;
                var width = this.img.offsetWidth;
                if (($G.Window.Width() + 20) < width) { width = $G.Window.Width() - 40; }
                $FX.Interval(10).Time(500).AnimateStyle(Gallery.Div.SliderWrap, "width", width, width, function () {

                    Gallery.Div.style.width = width + 20 + "px";
                    Gallery.Div.SliderWrap.style.width = width + "px";
                    Gallery.Div.Close.style.display = "block";

                    Gallery.Div.style.left = Math.round(_gLeft - width / 2) + "px";

                    Gallery.NextShow = false;
                    Gallery.PrevShow = false;

                    var info = Gallery.GetInfo(this.obj);

                    if (info.index != info.amount) { Gallery.NextShow = true; }

                    if (info.index != 1) { Gallery.PrevShow = true; }

                    Gallery.Div.focus();

                    Gallery.WinResize();                    

                } .bind(this), function (f) {
                    Gallery.Div.style.width = f + 20 + "px";
                    Gallery.Div.style.left = Math.round(_gLeft - f / 2) + "px";
                }, "AnimateWidth");
            } .bind(this), function (f) {
                if (f != null) {
                    Gallery.Div.style.height = f + 20 + "px";
                    Gallery.Div.style.top = Math.round(_gTop - f / 2) + "px";
                }
            }, "AnimateHeight");
        }
        else {
            setTimeout(Gallery.LoadCheck.bind(this), 100);
        }
    },

    KeyPress: function (e) {

        if ($G.Event.KeyCode(e) == 27) {
            Gallery.Close();
        }

        if ($G.Event.KeyCode(e) == 37) {
            Gallery.Prev();
        }

        if ($G.Event.KeyCode(e) == 39) {
            Gallery.Next();
        }
    },

    Close: function () {
        $G.SetStyle("display", "none", Gallery.Div.SliderVertCone, Gallery.Div.Prev, Gallery.Div.Next, Gallery.Div.Close, Gallery.Div.Info, Gallery.Div.Pic, Gallery.Div.SliderVert, Gallery.Div.Slider);
        Gallery.Div.style.backgroundImage = "url(res/img/px.gif)";
        var cTop = Math.round($G.Window.Height() / 2);
        var cLeft = Math.round($G.Window.Width() / 2) - 10;
        var dLeft = cLeft - $G.GetStyle(Gallery.Div, "left", true);
        var dTop = cTop - $G.GetStyle(Gallery.Div, "top", true);
        $FX.Interval(10).Time(500).Page.FadeOut("#000000");
        $FX.Interval(10).Time(500).AnimateStyle(Gallery.Div, "width", -$G.GetStyle(Gallery.Div, "width", true), 0, function () {
            Gallery.Div.style.display = "none";
            document.body.style.position = "";
            document.body.style.overflow = "";
        }, null, "GalleryWidth");
        $FX.Interval(10).Time(500).AnimateStyle(Gallery.Div, "height", -$G.GetStyle(Gallery.Div, "height", true), 0, null, null, "GalleryHeight");
        $FX.Interval(10).Time(500).AnimateStyle(Gallery.Div, "top", dTop, cTop, null, null, "GalleryTop");
        $FX.Interval(10).Time(500).AnimateStyle(Gallery.Div, "left", dLeft, cLeft, null, null, "GalleryLeft");
        Gallery.Current = null;

        $G.Event.Remove(window, "resize", Gallery.WinResize);

        if (Gallery.Div.attachEvent) {
            $G.Event.Remove(Gallery.Div, "keydown", Gallery.KeyPress);
        }

        if (window.addEventListener) {
            $G.Event.Remove(window, "keydown", Gallery.KeyPress);
        }
    }
}

addDOMLoadEvent(Gallery.Init);