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

if (typeof(Jesper.utils) == 'undefined')
    Jesper.utils = {};

Jesper.utils.Lightbox = new Class({
    initialize: function (sel) {
        var win = this.win = new Element('div', {'id': 'lightbox', 'html': this.loading_html});
        win.inject(document.body);
        var self = this;

        if (typeof(sel) != 'undefined')
            document.getElements(sel).each(function (el){self.add(el)});

        document.addEvent('click', function (){win.hide()});
        window.addEvent('resize', this.reposition.bind(this));
        window.addEvent('scroll', this.reposition.bind(this));
    },

    add: function (el) {
        el.loaded = false;
        var self = this;
        el.addEvent('click', function (e) {
            if(self.win.isDisplayed()){
              self.win.hide();
              return false;
            }
            if(!el.loaded){
              self.win.set('html', self.loading_html).show();
            }
            self.reposition();

            var img = new Element('img', {
              'title': "",
              'src': this.getProperty('href')
            });
            if(!el.loaded && (typeof(img.width) == 'undefined' || img.width <= 0)){
              img.addEvent('load', function () {
                el.loaded = true;
                self.win.set('html', '');
                img.inject(self.win);
                self.win.show()
                self.reposition();
              });
            } else {
                self.win.set('html', '');
                img.inject(self.win);
                self.win.show()
                self.reposition();
            }
            
            e.stop();
        });
    },

    reposition: function (e) {
        /*
        Hämtar den korekta höjden. 
        window.getHeight(); hämtade den totala storleken och inte den 
        faktiska storleken, 
        */ 
        var size         = window.getSize(),
            scrollOffset = window.getScroll();
        this.win.setStyle("top", (size.y/2-this.win.getHeight()/2)+scrollOffset.y)
                .setStyle("left", (size.x/2-this.win.getWidth()/2)+scrollOffset.x);
    },

    loading_html: "<img src=\"http://static.jesper.nu/images/lightbox-loading.gif\" alt=\"Laddar...\" />"
});