/* We use setInterval instead of setTimeOut because we only want one staggered update to be fired..
The interval is only fired after the last update, before this it is constantly cancelled */

function MagicFullScreen(n){
	var screenLayer;
	var updateInt;
	
	this.name = n ? n : "fullScreenLayer";
	this.colour = "#FFFFFF";
	this.opacity = .5;
	this.zindex = 3;
	this.intervalTime = 50; // The amount of time to update after dragging / scrolling in ms
	
	
	this.create = function(){
		var host = this;
		var b = document.body;
		if(!b){ return; }
		
		screenLayer = document.createElement("div");
		screenLayer.style.position = "absolute"
		screenLayer.style.backgroundColor = this.colour;
		screenLayer.style.zIndex = this.zindex;
		screenLayer.style.opacity = this.opacity;
		screenLayer.style.filter = "alpha(opacity=" + (this.opacity * 100) + ")";
		
		b.appendChild(screenLayer);
		
		var update = function(){host.updateLayer(true);}
		
		this.attachEvent(window , "scroll" , update);
		this.attachEvent(window , "resize" , update); 
		
		this.updateLayer(true);
	}
	
	this.remove = function(){
		if(!screenLayer){ return ; }
		document.body.removeChild(screenLayer);
	}
	
	this.updateLayer = function(doInt){
		var host = this;
		// Get the dimensions for different browsers
		var h = document.documentElement.clientHeight;
		var w = document.documentElement.clientWidth;
		var l = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft;
		var t = document.documentElement.scrollTop ? document.documentElement.scrollTop  : document.body.scrollTop;
		
		screenLayer.style.height = h + "px";
		screenLayer.style.width = w + "px";
		screenLayer.style.left = l + "px";
		screenLayer.style.top = t + "px";
		
		if(doInt){
			this.clearIntervalUpdate();
			updateInt = setInterval(function(){host.updateAfterInterval();} , this.intervalTime);
		}
	}
	
	this.clearIntervalUpdate = function(){
		clearInterval(updateInt);
	}
	
	this.updateAfterInterval = function(){
		//console.log("Int update ");
		this.clearIntervalUpdate();
		this.updateLayer(false);
	}
	
	
	this.attachEvent = function(el , ev , funct){
		if(!el){ return; }
		
		if(el.addEventListener){
			el.addEventListener(ev , funct , false);
			return;
		}
		
		if(el.attachEvent){
			// IE - has to have 'on' before event handler functs
			el.attachEvent('on' + ev , funct);
			return;
		}
		
	}
}