/**
* Overlay
* overlay component
* @constructor
* @base Div
* @namespace stubhub.ui
* @param {String} id The html id of div
* @param {Object} cfg Json config object
*		{initHide:boolean whether to hide the overlay on init,
* 		 bMask:boolean whether to display mask or not}
* @return Overlay object
*/

stubhub.ui.Overlay = function(id, cfg){

	function getBrowserDimensions(){
		
		var win = window, doc = document;
		var w, h;
		if (win.innerHeight && window.scrollMaxY) {
			w = win.innerWidth + win.scrollMaxX;
			h = win.innerHeight + win.scrollMaxY;
		} else if (doc.body.scrollHeight > doc.body.offsetHeight){
			w = doc.body.scrollWidth;
			h = doc.body.scrollHeight;
		} else {
			w = doc.body.offsetWidth;
			h = doc.body.offsetHeight;
		}
		
		var vPortW, vPortH;
		if (self.innerHeight) {
			vPortW = (doc.documentElement.clientWidth) ? doc.documentElement.clientWidth : self.innerWidth;
			vPortH = self.innerHeight;
		} else if (doc.documentElement && doc.documentElement.clientHeight) {
			vPortW = doc.documentElement.clientWidth;
			vPortH = doc.documentElement.clientHeight;
		} else if (doc.body) {
			vPortW = doc.body.clientWidth;
			vPortH = doc.body.clientHeight;
		}	
		
		pageHeight = (h < vPortH) ? vPortH : h;
		pageWidth = (w < vPortW) ? w : vPortW;

		return {pageH:pageHeight, pageW:pageWidth, viewPortH:vPortH, viewPortW:vPortW};
	}
	
	var innerDiv = id + "_content";
	var iMaskOpacity = 30;
	var o = stubhub.extend(new stubhub.ui.core.Div(id));
	o.objType = "stubhub.ui.Overlay";
	o.cfg = cfg;
	o.shim = null;
	o.modalMask = null;
	o.isHidden = false;
	o.addShim = function(){
		if (!this.shim){
			this.shim = document.createElement("IFRAME");
			this.shim.src = "/resources/img/s.gif";
			var s = this.shim.style;
			s.position = "absolute";
			s.top = "0px";
			s.left = "0px";
			s.zIndex = this.elem.style.zIndex-2;
			s.filter="alpha(opacity=\"0\")";
			s.filter="chroma(color='white')";
			s.opacity = "0";
            s.border = "none";
            s.margin = "0";
            s.padding = "0";
			this.shim.frameBorder=0;
			this.elem.parentNode.appendChild(this.shim);
		}
	};
	o.resizeShim = function(){
		if (this.shim){
			var s = this.shim.style;
			var shadowModifier = (cfg && cfg.bShadow)?2:0;
			
			if (cfg.bMask && this.modalMask){
				s.top  = - this.getOffsetTop() + "px";
				s.left = - this.getOffsetLeft()+ "px";
				s.width = this.modalMask.elem.offsetWidth + "px";
				s.height = this.modalMask.elem.offsetHeight + "px";
			}else{
				s.width = this.offsetWidth + shadowModifier + "px";
				s.height = this.offsetHeight + shadowModifier + "px";
			}
		}
	}
	o.removeShim = function(){
		if (this.shim){
			this.elem.parentNode.removeChild(this.shim);
			this.shim = null;
		}
	};
	o.addMask = function(){
		if (!this.modalMask){
			var e = this.elem;
			var o = document.createElement("DIV");
			o.id = this.id + "_modalMask";
			o.innerHTML = "&#160;";
			var s = o.style;
			s.position = "absolute";
			s.display = "none";
			s.background = "#000";
			s.zIndex = e.style.zIndex-1;
			s.left = "0px";
			s.top = "0px";
			
			stubhub.window.addEventListener("resize", function(){o.resizeMask();})
			document.body.insertBefore(o, document.body.firstChild);
			this.modalMask = new stubhub.ui.core.Div(o.id);
			this.resizeMask();
		}
	};
	o.resizeMask = function(){
		if (this.modalMask){
			var s = this.modalMask.elem.style;
			var sizes = getBrowserDimensions();
			s.width = Math.max(sizes.pageW, sizes.viewPortW) + "px";
			s.height = Math.max(sizes.pageH, sizes.viewPortH) + "px";
		}
	};
	o.removeMask = function(){
		if (this.modalMask){
			document.body.removeChild(this.modalMask.elem);
			this.modalMask = null;
		}
	};
	o.overlayShow = o.show;
	o.show = function(){
		this.overlayShow();
		if (this.cfg.bMask){
			var s = this.modalMask.elem.style;
			this.resizeMask();
			s.display = "block";
			this.modalMask.fade(0, iMaskOpacity);
		};

		this.addShim();
		this.resizeShim();
		this.isHidden = false;
	};
	o.overlayHide = o.hide;
	o.hide = function(){
		if (this.cfg.bMask && !this.isHidden){
			this.modalMask.fade(iMaskOpacity, 0);	
			//this.modalMask.elem.style.display = "none";
		}
		this.overlayHide();
		this.removeShim();
		this.isHidden = true;
	};
	o.center = function(){
		var sT = 0;
		var sL = 0;
		var sizes = getBrowserDimensions();
		
		sT = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
	
		this.initOffsets();
		var t=parseInt((sizes.viewPortH-this.offsetHeight)/2)-this.getAbsoluteOffset(this.elem.offsetParent, "offsetTop");
		t = (t<0)?sT:t+sT;
		var l=parseInt((sizes.pageW-this.offsetWidth)/2)+sL-this.getAbsoluteOffset(this.elem.offsetParent, "offsetLeft");
		var s = o.elem.style;
		s.top = t + "px";
		s.left = l + "px";
	};
	
	if (o.elem){
		var s = o.elem.style;
		s.position = "absolute";
		s.zIndex = 100;
		
		//recalculate these values because they change
		//after setting position = absolute.
		o.initOffsets();

		if (cfg){
			if (cfg.bMask){ o.addMask(); }
			
			if (cfg.initHide){
				o.hide();
			}
		}
	};
	return o;
};