if (typeof Effect == 'undefined')
    throw ("captechgallery.js requires including script.aculo.us' effects.js library!");

var CaptechGallery = Class.create();
CaptechGallery.prototype = {


    initialize: function(items, navClass, ref) {
        this.items = items;
        this.ref = ref.down();
        this.trigger = navClass;
        this.bigImage = "";

        if (this.items.length > 0) {
            this.createPopup();
            this.setItemAttributes();
        }
    },

    createPopup: function() {
        this.closeBtn = new Element('a', { href: '#close', 'class': 'close' }, 'Close');

        this.popup = new Element('div', { 'id': 'popup', 'class': 'popup' });
        this.popupimg = new Element('img', { 'class': 'popupimg', border: 0 });
        this.popupzoom = new Element('div', { 'id': 'popupzoom', 'class': 'popupzoom' });

        this.popupoverlaylink = new Element('div', { 'id': 'popupoverlaylink', 'class': 'popupoverlaylink' });

        this.popup.hide();

        this.popup.insert({ 'bottom': this.closeBtn });
        this.popup.insert({ 'bottom': this.popupzoom });
        this.popup.insert({ 'bottom': this.popupimg });
        this.popup.insert({ 'bottom': this.popupoverlaylink });

        this.ref.insert({ 'top': this.popup });

        Event.observe(this.closeBtn, 'click', this.close.bindAsEventListener(this), false);
        Event.observe(this.popupoverlaylink, 'click', this.mediumImgOnClick.bindAsEventListener(this), false);
        Event.observe(this.popupimg, 'load', this.showImage.bindAsEventListener(this), false);

    },

    close: function(evt) {
        if (evt) Event.stop(evt);
        this.popup.hide();
    },

    setItemAttributes: function() {
        for (var i = 0; i < this.items.length; i++) {
            var item = this.items[i];

            item.img = new Image();
            item.img.src = item.href;
            item.img.alt = item.down('.thumber').alt;

            this.setEvent(item, i);
        }
    },

    setEvent: function(item, i) {
        Event.observe(item, 'click', this.onClick.bindAsEventListener(this, item, i), false);
    },
    onClick: function(evt, item, i) {
        Event.stop(evt);

        if (item.img.src == this.popupimg.src && this.popup.style.display != 'none') {
            // Close the image
            this.popup.hide();
        } else {
            // Show the image
            this.prepPop(evt, item, i);
        }
    },
    prepPop: function(evt, item, i) {
        this.popupimg.style.visibility = 'hidden';

        this.popupimg.src = item.img.src;
        this.popupimg.alt = item.img.alt;

        this.bigImage = item.img.alt

        // Sätt bildens länk till den stora bilden
        if (item.img.alt != '') {
            this.popupoverlaylink.style.display = '';
            this.popupzoom.style.display = '';

        } else {
            this.popupoverlaylink.style.display = 'none';
            this.popupzoom.style.display = 'none';
        }

        this.popup.show();
    },

    mediumImgOnClick: function(evt) {
        myCTPopupWindow.openImage(this.bigImage);
    },

    showImage: function(evt) {
        var self = this;
        setTimeout(function() { // IE- ifx som vanligt...
            var imgTop = (375 / 2) - (self.popupimg.height / 2);
            var imgLeft = (375 / 2) - (self.popupimg.width / 2);

            self.popupimg.style.left = imgLeft + 'px';
            self.popupimg.style.top = imgTop + 'px';

            self.popupimg.style.visibility = 'visible';
        }, 1);
    }

}