WA = {};
var dialog;

WA.lightbox = {

        init : function(lightbox) {

                //console.log('WA.lightbox.init started');

                var lightboxConfig= {
                                'z-index': 100001,
                                cls: 'lightbox',
                                constrain: true
                        };

                var overlayConfig= {
                                'z-index': 100000,
                                'cls': 'overlay'
                        };

                var dh=Ext.DomHelper;
                this.overlay = dh.append(document.body, {tag: "div", cls:"overlay"}, true);
                this.overlay.enableDisplayMode("block");
                this.overlay.hide();

/*
                var pos=this.overlay.getPositioning();
                for (blah in pos) {
                        alert(blah+':'+pos[blah]);
                }
*/

                this.overlay.addListener('click',this.close,this);
                this.lightbox = dh.append(document.body, {tag: "div", cls:"lightbox"}, true);
                this.lightbox.enableDisplayMode("block");
                this.lightbox.hide();

                //this.lightbox=new Ext.Layer(lightboxConfig);

                this.events=[];

                // Fix for scrollbars showing through
                //shimElement(this.overlay.id);
                //shimElement(this.lightbox.id);

                //console.log('WA.lightbox.init complete');

                this.currentImageNumber = 0;

        },


        show : function() {
                this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
                this.overlay.show();
                this.lightbox.show();
                this.lightbox.center();
        },

        close : function(lightbox) {
                this.lightbox.hide();
                this.overlay.hide();
        },


        loadURL : function(theurl) {

                //console.log('WA.lightbox.loadURL started');

                Ext.Ajax.request(
                                {
                                        url: theurl,
                                        method: 'GET',
                                        timeout: 10000,
                                        success:  function(result,request)  {
                                                //console.log('WA.lightbox.loadURL successful request');
                                                dialog.lightbox.update(result.responseText,true);
                                                if ('loaded' in dialog.events) {
                                                        dialog.triggerEvent('loaded');
                                                }
                                                //console.log('WA.lightbox.loadURL complete');
                                        },
                                        failure: function(result,request) {
                                                Ext.MessageBox.alert('Error', 'There was a server problem. Please try again.');
                                        }
                                }
                        );

        },

        setEvent : function(event,callback) {
                this.events[event]=callback;
        },

        triggerEvent: function(event) {
                this.events[event]();
        },

        resize: function(event) {
                if (this.overlay.isDisplayed()) {
                        this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
                        //this.overlay.center();
                        //this.overlay.fitToParent();
                }
                if (this.lightbox.isDisplayed()) {
                        this.lightbox.center();
                }
        },

        loadImageLightbox: function(element,imageArray,config) {

                this.imageLightbox={};
                this.imageLightbox.config=config;

                if (!this.imageLightbox.config.preloadimgClass) {
                        this.imageLightbox.config.preloadimgClass='preloadimg';
                }

                this.imageLightbox.element=element;

                this.preloadImages(imageArray);

        },

        preloadImages: function(imageArray) {

                var dh=Ext.DomHelper;

                this.images=[];

                // Pre-load images
                var imageCounter=0;

                for (i=0;i<imageArray.length;i++) {
                        if (imageArray[i] != '') {
                                //this.images[imageCounter]=imageArray[i];
                                dh.append(this.lightbox, { tag: 'img', id: 'preloadimg'+imageCounter, cls: this.imageLightbox.config.preloadimgClass });
                                this.images[imageCounter]=$('preloadimg'+imageCounter);
                                this.images[imageCounter].src=imageArray[i];
                                $('lightboximage'+imageCounter).show();
                                imageCounter++;
                        }
                }

        },

        showImage: function(imageNumber) {
                if (this.images[imageNumber]) {
                        if (typeof this.currentImageNumber == 'number') {
                                $('lightboxlink'+this.currentImageNumber).removeClassName('selected');
                        }
                        this.currentImageNumber=imageNumber;
                        $(this.imageLightbox.element).src=this.images[imageNumber].src;
                        $('lightboxlink'+imageNumber).addClassName('selected');
                }
        },

        showFirstImage: function() {
                this.showImage(0);
        },

        showNextImage: function() {
                if (this.images[this.currentImageNumber+1]) {
                        this.showImage(this.currentImageNumber+1);
                }
        },

        showPreviousImage: function() {
                if (this.images[this.currentImageNumber-1]) {
                        this.showImage(this.currentImageNumber-1);
                }
        }

}

function showImageLightbox(id) {

        if (!dialog) {
                dialog=WA.lightbox;
                dialog.init('image-lightbox');
        }

        Ext.Ajax.request(
                {
                        url : '/lightbox/images-array/'+id+'/article.thtml',
                        method: 'GET',
                        timeout: 10000,
                        success: function ( result, request ) {
                                var json = Ext.util.JSON.decode(result.responseText)
                                var imagesArray=json.images;
                                dialog.setEvent('loaded',function() {
                                                dialog.lightbox.center();
                                                dialog.loadImageLightbox('lightboximage',imagesArray,{});
                                                dialog.showImage(0);
                                                dialog.show();
                                        }
                                );
                                dialog.loadURL('/lightbox/'+id+'/article.thtml');
                        },
                        failure: function ( result, request) {
                                Ext.MessageBox.alert('Error', 'There was a server problem. Please try again.');
                                return false;
                        }
                }
        );

}


var shimElement = function(elementToShim) {

	this.iframe = $('iframeShim');

	if(elementToShim != null){
		Element.toggle(this.iframe);
		if(Element.visible(this.iframe)){
			Position.clone(elementToShim,this.iframe);
		}
	}
}