(function(){
	
	Imagegallery = {
		Y : null
		, objPics : null
		, overlay : null
		, overlay_background : null
		, div : null
		, imageNr : 0
		, init : function (Y) {
			this.Y = Y;
			this.objPics = null;
			this.overlay = null;
			this.imageNr = 0;
		}
		, close : function () {
			this.overlay.hide();
			this.overlay.destroy();
			this.overlay = null;
			this.overlay_background.setStyle('width', '0px');
			this.overlay_background.setStyle('height', '0px');
		}
		, back : function () {
			this.setPrevNr();
			this.showImage();
		}
		, forward : function () {
			this.setNextNr();
			this.showImage();
		}
		, setData : function (objPics) {
			this.objPics = objPics;
		}
		, setNextNr : function () {
			if (this.imageNr == this.objPics.pics.length - 1) {
				this.imageNr = 0;
			}
			else {
				++this.imageNr;
			}
		}
		, setPrevNr : function () {
			if (this.imageNr == 0) {
				this.imageNr = this.objPics.pics.length - 1;
			}
			else {
				--this.imageNr;
			}
		}
		, show : function (nr) {
			var that = this;
			
			this.imageNr = nr;
			this.buildOverlay();
			this.overlay.render(this.div);
			
			var overlay_background_event = this.overlay_background.on('click', function () {
				that.close(that.overlay_background);
			});
			
			var resize_event = this.Y.on('resize', function () {
				that.resize_window();
				that.showImage();
			});
			
			this.overlay.on('destroy', function () {
				that.div.get('parentNode').removeChild(that.div);
				overlay_background_event.detach();
				resize_event.detach();
			});
			
			this.showImage();
		}
		, buildOverlay : function () {
			this.div = this.Y.Node.create('<div id="yui-overlay-box"></div>');
			var body = this.Y.one(document.body);
			body.append(this.div);
			this.overlay_background = this.Y.one('#overlay-background');
			this.resize_window();
			
			this.overlay = new this.Y.Overlay({
				visible: true
				, centered: true
				, zIndex: 999
				, bodyContent: ''
				, footerContent: ''
			});

			var headerContent = '<div id="headerdiv">';
			headerContent += '<div class="clearfix closeheader" style="position:relative;height:24px;">';
			if (this.objPics.pics.length > 1) {
			   	headerContent += '<button id="leftchange" style="width:30px;" onclick="Imagegallery.back();">&laquo;</button>&nbsp;<button id="rightchange" style="width:30px;" onclick="Imagegallery.forward();">&raquo;</button>';
			}
			headerContent += '<div style="cursor:pointer;position:absolute;right:10px;top:6px;" onclick="Imagegallery.close()"><button>x</button></div>';
			headerContent += '</div>';
			headerContent += '</div>';
			var footerContent = '<div id="footerdiv" class="clearfix" style="width:700px;">';
			footerContent += '<div id="gallerycaption"></div>'; 
			footerContent += '</div>';
			this.overlay.set('headerContent', headerContent);
			this.overlay.set('footerContent', footerContent);
			this.overlay.set('bodyContent', '<img id="galleryimg" src="">');
		}
		, showImage : function () {
			var posX = (typeof pageXOffset !== 'undefined') ? pageXOffset : document.documentElement.scrollLeft;
			var posY = (typeof pageYOffset !== 'undefined') ? pageYOffset : document.documentElement.scrollTop;
			var xWidth = (typeof innerWidth !== 'undefined') ? innerWidth : document.body.offsetWidth;
			var pic = this.objPics.pics[this.imageNr]; 
			this.Y.one('#footerdiv').setStyle('width', pic['midwidth'] + 'px');
			this.Y.one('#headerdiv').setStyle('width', pic['midwidth'] + 'px');
			this.Y.one('#galleryimg').set('src', this.objPics.info['midbase'] + pic.name);
			this.Y.one('#gallerycaption').set('innerHTML', pic.caption);
			this.overlay.move(posX + parseInt((document.body.offsetWidth - pic['midwidth']) / 2), posY + 50);
			var that = this;
			setTimeout(function() { that.resize_window(); }, 500);
		}
		, get_window_size : function() {
			var w_width = 0;
			var w_height = 0;

			if (window.innerWidth) {
				w_width = window.innerWidth;
			} else if (document.body && document.body.offsetWidth) {
				w_width = document.body.offsetWidth;
			}
			
			if (window.innerHeight) {
				w_height = window.innerHeight;
			} else if (document.body && document.body.offsetHeight) {
				w_height = document.body.offsetHeight;
			}

			return { width: w_width, height: w_height };
		}
		, resize_window : function() {
			var body = this.Y.one(document.body);
			var w = body.get('docWidth');
			var h = body.get('docHeight');
			this.overlay_background.setStyle('width', w + 'px');
			this.overlay_background.setStyle('height', h + 'px');
		}
	}
	
	YUI().use('node', 'event', 'overlay', function(Y) {
		Imagegallery.init(Y);
		Y.on("domready", function () {
			if (typeof objPics != 'undefined') {
				Imagegallery.setData(objPics);
			}
		});
	});
})();