if(typeof done1 == 'undefined'){
    var done1 = {};
}

done1.events = new Events();

done1.gallery = {};

done1.gallery.scroll = new Class({

    Implements: [Events, Options],

    options: {
        /*
         onStart: $empty,
         onCancel: $empty,
         onComplete: $empty,
         */
        width: 10000,
        height: 100,
        padding: 20,
        isScroll: true
    },

    initialize: function(parent, options){
        this.setOptions(options);
        this.pos = 0;
        this.length = 0;
        this.sWidth = 0;
        this.width = 0;
        this.imgs = {};

        this.dom = new Element('div', {
            'class': 'scroll'
        });
        this.container = new Element('div', {
            'class': 'container'
        });
        this.mask = new Element('div', {
            'class': 'mask'
        });
        this.wrapper = new Element('div', {
            'class': 'wrapper'
        });
        done1.events.addEvent('gallery.scroll.close', this.onClose.bind(this));
        done1.events.addEvent('gallery.scroll.clickload', this.onClickLoad.bind(this));

        this.dom.appendChild(this.wrapper);
        this.dom.appendChild(this.mask);
        this.wrapper.appendChild(this.container);
        parent.appendChild(this.dom);
    },
    add: function(sid, src, href){

        this.length++;
        var _self = this;
        var img = new Image();
        this.imgs[sid] = {
            'img': img,
            'dom': null
        };
        img.onload = function(){
            _self.onload(this, sid, href);
        };
        img.onerror = function(){
            _self.onerror(sid);
        };
        img.src = src;
    },
    onload: function(img, sid, href){
        var dom = new Element('a')
        dom.set('href', href);
        dom.setStyles({
            'height': this.options.height,
            'width': img.width,
            'margin-right': 5
        });
        this.sWidth += img.width + 5;
        dom.appendChild(img);
        //this.scroll.appendChild(dom);
        this.imgs[sid]['dom'] = dom;
        //this.container.appendChild(dom);
        dom.addEvent('click', this.onClick.bindWithEvent(this, [sid, img]));
        this.length--;
        this.checkSize();
    //done1.events.fireEvent('gallery.scroll.loading', [sid, img]);
    },
    onerror: function(sid){
        delete this.imgs[sid];
        this.length--;
    },
    render: function(){

        return true;
    },
    checkSize: function(){
        if (this.length == 0) {
            for(var i in this.imgs){
                if(this.imgs[i] && this.imgs[i]['dom'])
                    this.container.appendChild(this.imgs[i]['dom']);
            }


            this.width = this.sWidth - this.wrapper.getSize().x -5; //TODO check it
            this.container.setStyle('width', this.sWidth);
            if (this.width > 0) {
                if (!this.isShow) {
                    var _self = this;
                    this.isShow = true;
                    this.wrapper.setStyles({
                        'margin': '0 ' + this.options.padding + 'px'
                    });
                    this.width += this.options.padding * 2;
                    this.createButtons(parent);
                    if (this.options.isScroll) {
                        this.dom.addEvent('mousewheel', function(e){
                            e = new Event(e);
                            e.stop();
                            _self.move(e.wheel * 5);
                        });
                    }
                }
            }
            this.hideMask();
        }
        return true;
    },
    hideMask: function(){
        var tween = new Fx.Tween(this.mask, {
            duration: 300,
            transition: Fx.Transitions.Quad.easeIn,
            onComplete: function(el){
                el.style.display = 'none';
            }
        });
        tween.start('opacity', 1, 0);
    },
    onClick: function(e, sid, img){
        new Event(e).stop();
        if (this.imgs[sid]) {
            this.actItem = this.imgs[sid];
            this.actItem.dom.addClass('loader');
            var tween = new Fx.Tween(this.imgs[sid].img, {
                duration: 300
            });
            tween.start('top', 0, -this.imgs[sid].img.getSize().y);
            this.fireEvent('onClick', sid)
            done1.events.fireEvent('gallery.scroll.click', [sid, img]);
        }
    },
    onClickLoad: function(){
        if (this.actItem) {
            this.actItem.dom.removeClass('loader');
        }
    },
    onClose: function(){
        if (this.actItem) {
            var tween = new Fx.Tween(this.actItem.img, {
                duration: 300
            });
            tween.start('top', -this.actItem.img.getSize().y, 0);
        }
    },
    startMove: function(side){
        if (this.isClick)
            return false;
        this.isClick = true;
        var _self = this;
        this.stopMove();
        this.timer = setInterval(function(){
            _self.move(side);
        }, 50);
        return true;
    },
    stopMove: function(){
        if (this.timer)
            clearInterval(this.timer);
        this.isClick = false;
    },
    move: function(side){
        var p = this.pos = this.pos + side * 20;
        if (p <= 0) {
            this.pos = 0;
            this.stopMove();
        }
        if (p >= this.width) {
            this.pos = this.width;
            this.stopMove();
        }
        this.container.style.left = -this.pos + 'px';
    },
    createButtons: function(parent){
        var _self = this;

        this.dleft = new Element('div', {
            'class': 'left'
        });
        this.dleft.addEvents({
            'mousedown': function(){
                _self.startMove(-1);
            },
            'mouseup': function(){
                _self.stopMove();
            }
        });
        this.dright = new Element('div', {
            'class': 'right'
        });
        this.dright.addEvents({
            'mousedown': function(){
                _self.startMove(1);
            },
            'mouseup': function(){
                _self.stopMove();
            }
        });
        this.dom.appendChild(this.dleft);
        this.dom.appendChild(this.dright);
    }
});


done1.gallery.fx = new Class({
    Extends: Fx,

    set: function(now){
        this.fireEvent('onStep', now);
    }
});


done1.gallery.popup = new Class({
    Implements: [Events, Options],
    initialize: function(){
        done1.events.addEvent('gallery.scroll.click', this.open.bind(this));
        done1.events.addEvent('gallery.popup.show', this.show.bind(this));
        done1.events.addEvent('gallery.popup.errorload', this.errorload.bind(this));
        this.imgs = {};
    },
    errorload:function(sid){
        delete this.imgs[sid];
    },
    create: function(){
        if (this.isCreate) {
            this.dom.style.display = 'block';
            return false;
        }


        var s = window.getSize();
        var o = window.getScroll();
        this.width = s.x;
        this.height = s.y;
        this.dom = $('g-popup') ? $('g-popup') : new Element('div', {
            'id': 'g-popup'
        });
        this.wrap = new Element('div', {
            'class': 'wrap'
        });
        var _self = this;
        this.tween = new Fx.Tween(this.wrap, {
            duration: 300,
            transition: Fx.Transitions.Quad.easeOut,
            onComplete: function(){
                if (_self.isShow) {
                    _self.close();
                }
                else {
                    _self.isShow = true;
                }
            }
        });
        this.dom.addEvent('mousewheel', function(e){
            new Event(e).stop();
            _self.wheel(e.wheel > 0 ? 1 : -1);
        });
        this.dom.addEvent('click', function(e){
            _self.close();
        });

        window.addEvent('resize', this.resize.bind(this));
        this.resize(true);
        this.dom.appendChild(this.wrap);
        document.body.appendChild(this.dom);
        this.isCreate = true;
    },
    wheel: function(wheel){

        if (this.imgs[this.active + wheel] && this.imgs[this.active + wheel].isLoad){
            this.show(this.active + wheel);

        }
    },
    resize: function(init){
        var s = window.getSize();
        var o = window.getScroll();
        this.width = s.x;
        this.height = s.y;
        this.dom.setStyles({
            'width': s.x,
            'height': s.y,
            'top': o.y
        })
        var t = init === true ? -s.y : 0;
        this.wrap.setStyles({
            'width': s.x,
            'height': s.y,
            'top': t
        });
        if (this.next) {
            this.next.setPos(this.width - 110, 10);
        }
        if (this.imgs[this.active]) {
            this.imgs[this.active].setPos(this.width / 2, 10);
        }
    },
    add: function(sid, thumb, src, title, txt){
        this.imgs[sid] = new done1.gallery.popup.img(sid, thumb, src, title, txt);
    },
    open: function(sid, img){
        
        this.create();
        this.resize(true);
        if (this.imgs[sid]) {
            var img = this.imgs[sid];
            img.onLoad(function(){
                this.show(sid);
                done1.events.fireEvent('gallery.scroll.clickload');
            }, this);
        }
    },
    close: function(){
        done1.mask.hide();
        Tool.showFlash();
        this.isShow = false;
        this.dom.style.display = 'none';

        if(this.next) this.next.remove();
        if(this.prev) this.prev.remove();
        if(this.imgs[this.active]) this.imgs[this.active].remove();
        done1.events.fireEvent('gallery.scroll.close');
    },
    reset:function(){
        for(var i in this.imgs){
            this.imgs[i].remove();
            delete this.imgs[i];
        }
        this.imgs = {};
        this.isShow = false;
        this.active = null;
    },
    show: function(sid){

        if (this.isAnimations()) {
            return false;
        }
        var img = this.imgs[sid];
        if (!img) {
            return false;
        }
        
        if (this.isShow) {
            if (this.active == sid) {
                this.tween.start('top', 0, -this.height);
            }
            else {
                var act = this.imgs[this.active];
                if (sid > this.active) {
                    //w prawo
                    if (this.prev) {
                        this.prev.remove();
                    }
                    act.toMin(90);
                    this.prev = act;
                    this.setNext(this.getNext(sid), true);
                }
                else {
                    if (this.next) {
                        this.next.remove();
                    }
                    act.toMin(this.width - 110);
                    this.next = act;
                    this.setPrev(this.getPrev(sid), true);
                }
                img.toMax(this.width / 2 + 5);
                this.active = sid;
            }
        }
        else {
            done1.mask.show();
            Tool.hideFlash();
            this.setPrev(this.getPrev(sid));
            this.setNext(this.getNext(sid));


            this.active = sid;
            this.wrap.appendChild(img.dom);
            img.setMaxSize();
            img.show();
            img.toBottom();
            img.setPos(this.width / 2 + 5, 10);


            this.tween.start('top', -this.height, 0);
        }
    },
    isAnimations: function(){
        for (var i in this.imgs) {
            if (this.imgs[i].isAnim) {
                return true;
            }
        }
        return false;
    },
    setNext: function(n, anim){
        this.next = null;
        if (n) {
            n.reset(this.width - 110);
            this.wrap.appendChild(n.dom);
            n.show(anim);
            this.next = n;
        }
    },
    setPrev: function(p, anim){
        this.prev = null;
        if (p) {
            p.reset(90);
            this.wrap.appendChild(p.dom);
            p.show(anim);
            this.prev = p;
        }
    },
    getNext: function(sid){
        if (this.imgs[sid + 1]) {
            return this.imgs[sid + 1];
        }
        return null;
    },
    getPrev: function(sid){
        if (this.imgs[sid - 1]) {
            return this.imgs[sid - 1];
        }
        return null;
    }
});

done1.gallery.popup.img = new Class({
    Implements: [Events, Options],
    initialize: function(sid, thumbSrc, src, title, descr){


        this.dom = new Element('div', {
            'class': 'item'
        });

        this.isLoad = false;
        this.thumb = thumb;
        this.src = src;

        var _self = this;
        this.dom.addEvent('click', function(e){
            new Event(e).stop();
            if(_self.isLoad){
                done1.events.fireEvent('gallery.popup.show', [sid]);
            }
        });
        var thumb = new Image();
        thumb.onerror = function(){
            done1.events.fireEvent('gallery.popup.errorload', [sid]);
        };
        thumb.onload = function(){
            _self.loadThumbEv(this);
        };
        thumb.src = thumbSrc;

        this.tween = new Fx.Morph(this.dom, {
            duration: 500
        });
        var _self = this;
        this.move = new Fx.Tween(this.dom, {
            duration: 500,
            onComplete: function(){
                _self.isAnim = false;
                if (_self.isMax) {
                    _self.descr.show();
                }
            }
        });

        this.mask = new Element('div', {
            'class': 'mask',
            'opacity': 0.6
        });
        this.dom.appendChild(this.mask);

        this.descr = new done1.gallery.popup.descr(this, title, descr);

    },
    loadThumbEv:function(img){
        this.thumb = img;
        this.twidth = img.width;
        this.theight = img.height;
        this.dom.appendChild(img);
        this.setMinSize();
        this.setPos(this.x,this.y);
        this.isLoadThumb = true;
    },
    reset: function(left){
        this.setMinSize();
        this.onLoad();
        this.setPos(left, 10);
        this.dom.setOpacity(0);
        this.toTop();
        this.descr.hide();
    },
    toMax: function(x){
        if (!this.isAnim) {
            this.isAnim = true;
            this.isMax = true;
            this.toBottom();
            x -= parseInt(this.iwidth / 2);
            this.move.start('left', this.x, x);
            this.x = x;
            this.width = this.iwidth;

            this.tween.start({
                'width': [this.twidth, this.iwidth],
                'height': [this.theight, this.iheight]
            });
        }
    },
    toMin: function(x){
        if (!this.isAnim) {
            this.isAnim = true;
            this.isMax = false;
            this.descr.hide();
            this.toTop();
            x -= parseInt(this.twidth / 2);
            this.move.start('left', this.x, x);
            this.x = x;
            this.width = this.twidth;
            this.tween.start({
                'width': [this.iwidth, this.twidth],
                'height': [this.iheight, this.theight]
            });
        }
    },
    setSize: function(w, h){
        this.width = w;
        this.height = h;
        this.dom.setStyles({
            'width': w,
            'height': h
        });
        return this;
    },
    setMaxSize: function(){
        this.descr.show();
        this.setSize(this.iwidth, this.iheight);
    },
    setMinSize: function(){
        this.setSize(this.twidth, this.theight);
    },
    setPos: function(x, y){
        this.x = x - parseInt(this.width / 2);
        this.y = y;
        this.dom.setStyles({
            'left': this.x,
            'top': this.y
        });
        return this;
    },
    onLoad: function(fn, bind){
        bind = bind || this;
        if (!this.isLoad) {
            var img = new Image();
            var _self = this;
            img.onerror = function(){
                _self.onLoadEv(this, fn, bind);
            };
            img.onload = function(){
                _self.onLoadEv(this, fn, bind);
            };
            img.src = this.src;
        }
        else {
            if (fn)
                fn.apply(bind);
        }
    },
    onLoadEv: function(img, fn, bind){
        this.isLoad = true;
        this.iwidth = img.width;
        this.iheight = img.height;
        this.img = img;
        if (fn) {
            fn.apply(bind, []);
        }
        if(this.thumb)
            this.dom.replaceChild(img, this.thumb);
        else
            this.dom.appendChild(img);

        this.mask.fade(0);
    },
    hide: function(){
        this.dom.setOpacity(0);
    },
    show: function(anim){
        if (anim) {
            var _self = this;
            setTimeout(function(){
                _self.dom.fade(1);
            }, 300);
        }
        else {
            this.dom.fade(1);
        }

    },
    remove: function(){
        this.dom.fade(0);
        var _self = this;
        if(_self.dom.parentNode){
            setTimeout(function(){

                _self.dom.parentNode.removeChild(_self.dom);
            }, 300);
        }
        this.dom.setOpacity(1);
    },
    toBottom: function(){
        this.dom.style.zIndex = 1;
    },
    toTop: function(){
        this.dom.style.zIndex = 10;
    }
});

done1.gallery.popup.descr = new Class({
    initialize: function(parent, title, descr){
        this.parent = parent;
        this.dom = new Element('div', {
            'class': 'descr'
        });

        this.cont = new Element('div');
        this.cont.style.display = 'none';

        this.txt = new Element('p');

        if (this.setText(title, descr)) {
            this.isActive = true;
            parent.dom.appendChild(this.dom);
            parent.dom.addEvent('mouseenter', this.over.bind(this));
            parent.dom.addEvent('mouseleave', this.out.bind(this));

            this.cont.setOpacity(0.8);
            this.dom.appendChild(this.cont);


            this.cont.appendChild(this.txt);


            var _s = this;

            this.tween = new Fx.Tween(this.cont, {
                duration: 200,
                //transition: Fx.Transitions.Quad.easeOut,
                onComplete: function(a){

                },
                onCancel: function(a){

                }
            });
        }
    },
    over: function(){
        if (this.isActive) {
            this.tween.cancel();
            this.cont.style.display = 'block';
            this.height = this.cont.offsetHeight;
            this.checkScroll();
            this.cont.style.bottom = '-' + this.height + 'px';
            this.tween.start('bottom', -this.height, 0);
        }
    },
    out: function(){
        if (this.isActive) {
            this.tween.cancel();
            this.tween.start('bottom', 0, -this.height);
        }
    },
    checkScroll: function(){
        if (!this.isCheck) {
            this.isCheck = true;
            if (this.height > this.dom.offsetHeight / 3) {
                this.height
            }
        }
    },
    setText: function(title, txt){
        title = title ? '<em>' + title + '</em>' : '';
        txt = txt ? txt : '';
        var descr = title + txt;
        if (descr.length > 0) {
            this.txt.innerHTML = descr;
            return true;
        }
        return false;
    },
    show: function(){
        this.dom.style.display = 'block';
        this.isActive = true;
    },
    hide: function(){
        this.dom.style.display = 'none';
        this.isActive = false;
    }
});