/* -------------------------------------------------------------------------------------------------------------
   LAYTOPIA.JS 1.0 - LAYOUT UTOPIA
   -------------------------------------------------------------------------------------------------------------
   Created by		: Jim McGinley, July 11 2007   Last Modified: September 20, 2007
   Code tested in	: PC IE6.0.2900 (Windows XP SP2), PC Firefox 2.0.0.4 (Windows XP SP2)
*/

/* User Variables */

var laytopiaWidth = 0, laytopiaHeight = 0;
var laytopiaWidthMin = 800, laytopiaHeightMin = 600;
// var laytopiaWidthMin = 100, laytopiaHeightMin = 100;
var laytopiaWidthMax = 0, laytopiaHeightMax = 0;  // *** is this relevant?

var layoutDivs = null, layoutDivIndex = -1;
var laytopiaError = "";
var laytopiaWidthHold = -1, laytopiaHeightHold = -1;
var layoutTimeoutID = "";

var laytopiaImages = false;

function laytopiaTrim(stringToTrim) {
	// from http://www.somacon.com/p355.php
	return stringToTrim.replace(/^\s+|\s+$/g,"");
}

function laytopiaAddLoadEvent(func) {
	// Add BEFORE OnLoad (but don't kill what's already in OnLoad)
	if (typeof window.onload != 'function') {
		window.onload = func;
	} else {
		var holdonload = window.onload;
		window.onload = function() { func(); holdonload(); }
	}
}

function laytopiaAddResizeEvent(func) {
	// Add to BEOFRE OnResize (but don't kill what's already in OnLoad)
	if (typeof window.onresize != 'function') {
		window.onresize = func;
	} else {
		var holdonresize = window.onresize;
		window.onresize = function() { func(); holdonresize(); }
	}
}

function laytopiaWidthHeightInitialize() {
	var newWidth = 0, newHeight = 0;

	// Width
	if (laytopiaWidthMax != 0) {
		newWidth = laytopiaWidthMax;
	} else {
		if ( typeof( window.innerWidth ) == 'number' ) {
			//Non-IE
			newWidth  = window.innerWidth;
		} else if ( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
			//IE 6+ in 'standards compliant mode'
			newWidth = document.documentElement.clientWidth - 0; // factor in vertical scrollbar
		} else if ( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
			//IE 4 compatible
			newWidth = document.body.clientWidth - 0; // factor in vertical scrollbar
		} else if (screen.availWidth) {
			newWidth = screen.availWidth;
		}	else {
			alert("Laytopia:Error:laytopiaWidthHeightInitialize:Can't determine browser width");
		}
	}

	// Height
	if (laytopiaHeightMax != 0) {
		newHeight = laytopiaHeightMax;
	} else {
		// Get actual gBrowser width & height (not the screen)
		if ( typeof( window.innerWidth ) == 'number' ) {
			//Non-IE
			newHeight = window.innerHeight;
		} else if ( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
			//IE 6+ in 'standards compliant mode'
			newHeight = document.documentElement.clientHeight;
		} else if ( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
			//IE 4 compatible
			newHeight = document.body.clientHeight;
		} else if (screen.availHeight) {
			newHeight = screen.availHeight;
		} else {
			alert("Laytopia:Error:laytopiaWidthHeightInitialize:Can't determine browser height");			
		}
	}

	if (newWidth < laytopiaWidthMin) { newWidth = laytopiaWidthMin; }
	if (newHeight < laytopiaHeightMin) { newHeight = laytopiaHeightMin; }

	laytopiaWidth = newWidth; laytopiaHeight = newHeight;
}


function tokenParse(pValue, pDiv) {
	// I'm expecting to be passed "ID.property" and the DIV it came from
	// Valid properties are .left, .top, .width, .height, .right (.left + .width), .bottom (.top + .height)
	// can't verify that pValue is legitimate div, because it could be practicallly anything! no idea what the something.something expression could be
	// i.e. it could be div.style.disabled or window.document.getElementById

	var raw = "", divname = "", propertyname = ""; // change hold into name/id/anything else
	var error = "";
	var div = null;
	var newvalue = "";

	raw = pValue.split(".");
	if (raw.length < 2) {
		error += "Laytopia:Error:tokenParse:Syntax error in property. " + pDiv.id + " - '" + pDiv.getAttribute("laytopia") + "'.\n";
	} else {
		divname = laytopiaTrim(raw[0].toLowerCase());
		propertyname = laytopiaTrim(raw[1].toLowerCase());

		if ((divname != "") && (propertyname != "")) {  // i don't know what this is, but it's not my concern i.e. 0.78?

			// PARENT
			if (divname == "parent") {
				// Parent (can't be trusted in IE) is special since it doesn't map to a GetElementByID exactly. Replace this width & height with Numbers directly (don't bother with Eval or Parsing)	
				// Your container/parent will, relative to embedded you, will always have a left & top of 0, and the width and height will always match right and bottom		
				switch (propertyname)
				{
				case "left":
				case "top":
					newvalue = "0";
					break;   
				case "width":		
				case "right":
					if (pDiv.parentNode == document.body) {
						newvalue = laytopiaWidth + "";
					} else {
						if (pDiv.parentNode.style.position.toLowerCase() != "absolute") {
							error += "Laytopia:Error:tokenParse:Parent must have Laytopia property or use 'Position:Absolute'. " + pDiv.id + " - '" + pValue + "'.\n";
						} else {
							newvalue = parseInt(pDiv.parentNode.offsetWidth) + "";
						}
					}
					break;
				case "height":
				case "bottom":
					if (pDiv.parentNode == document.body) {
						newvalue = laytopiaHeight + "";
					} else {
						if (pDiv.parentNode.style.position.toLowerCase() != "absolute") {
							error += "Laytopia:Error:tokenParse:Parent must have Laytopia property or use 'Position:Absolute'. " + pDiv.id + " - '" + pDiv.getAttribute("laytopia") + "'.\n";
						} else {
							newvalue = parseInt(pDiv.parentNode.offsetHeight) + "";
						}
					}
					break;
				default:		
					error += "Laytopia:Error:tokenParse:Parent.property only supports 6 properties (left, top, width, height, right, bottom). " + pDiv.id + " - '" + pDiv.getAttribute("laytopia") + "'.\n";
				}


			} else {

				div = null;

				// THIS				
				if (divname == "this") {
					div = pDiv;
					/*
					fix this once we have forward reference working
					layoutDivs[layoutDivIndex];
					s = s.replace(/([^a-zA-Z0-9])this.left/gi, "$1bobby");
					// i kinda already know this about myself, plus I really want to use layLeft, layWidth, layTop, layHeight
					newvalue = newvalue.replace(/this.left/gi, pDiv.offsetLeft);
					newvalue = newvalue.replace(/this.top/gi, pDiv.offsetTop);
					newvalue = newvalue.replace(/this.width/gi, pDiv.offsetWidth);
					newvalue = newvalue.replace(/this.height/gi, pDiv.offsetHeight);
					*/


				// PREVIOUS
				} else if (divname == "previous") {
					// find the previous DIV that's on your level (do NOT go up to container. even though I could easily, it would be too helpful & too confusing)
					for (index = (layoutDivIndex - 1); index > -1; index--) {
						if (layoutDivs[index].deep == layoutDivs[layoutDivIndex].deep) {
							div = layoutDivs[index];   // can't use ID since this may not HAVE an ID (fix this eventually)
							break;
						}
					}
					if (div == null) {
						error += "Laytopia:Error:tokenParse:There is no DIV before this one. Can't use Before to refer to Browser. " + pDiv.id + " - '" + pDiv.getAttribute("laytopia") + "'.\n";
						// could hard-code the necessary Browser stuff, it wouldn't be too bad
					}
				}

				if (error == "") {
					if (div == null) { div = window.document.getElementById(divname); }   // all we know is that this MIGHT be a DIV, could be div.property or div.style.property
					if (div != null) {
						switch(propertyname)
						{
						case "left":
							newvalue = div.offsetLeft + "";   // 0 gets interpretted as == "", "0" is what we want
							// alert(newvalue);
							break;    
						case "top":
							newvalue = div.offsetTop + "";
							break;
						case "width":
							newvalue = div.offsetWidth + "";
							break;
						case "height":
							newvalue = div.offsetHeight + "";
							break;
						case "right":
							newvalue = (div.offsetLeft + div.offsetWidth) + "";
							break;    
						case "bottom":
							newvalue = (div.offsetTop + div.offsetHeight) + "";
							break;
						}
					}
				}
			}
		}
	}

	if (error != "") { laytopiaError += error; }
	if (newvalue == "") { newvalue = pValue; } // leave it untouched i.e. div.style.disabled
	return newvalue;
}


function laytopiaParse(pValue, pDiv) {
	var parentLeft = 0, parentTop = 0;
	var tokenBegin = 0, token = "", c="", i = 0;
	var holdValue = "";
	var newvalue = "";

//	alert(pValue + "\r\n\r\n" + pDiv.id);
	holdValue = pValue + " ";   // guarantee terminator

	// Body
	holdValue = holdValue.replace(/body.left/gi, "0");
	holdValue = holdValue.replace(/body.top/gi, "0");
	holdValue = holdValue.replace(/body.width/gi, laytopiaWidth + "");
	holdValue = holdValue.replace(/body.height/gi, laytopiaHeight + "");
	holdValue = holdValue.replace(/body.right/gi, laytopiaWidth + "");   // useless property, but pays to be consistent
	holdValue = holdValue.replace(/body.bottom/gi, laytopiaHeight + "");

	/*
	// This
	// holdValue = holdValue.replace(/this.left/gi, "0");
	//	holdValue = holdValue.replace(/this.top/gi, "0");
	holdValue = holdValue.replace(/this.width/gi, pDiv.offsetWidth + "");
	holdValue = holdValue.replace(/this.height/gi, pDiv.offsetHeight + "");
	alert(holdValue + "\r\n\r\n" + pDiv.id);
	*/


	if (laytopiaWidth <= laytopiaWidthMin) {
		holdValue = holdValue.replace(/body.centerleft/gi, "0");
	} else {
		holdValue = holdValue.replace(/body.centerleft/gi, (parseInt((laytopiaWidth - laytopiaWidthMin) / 2) + ""));
	}
	if (laytopiaHeight <= laytopiaHeightMin) {
		holdValue = holdValue.replace(/body.centertop/gi, "0");
	} else {
		holdValue = holdValue.replace(/body.centertop/gi, (parseInt((laytopiaHeight- laytopiaHeightMin) / 2) + ""));
	}


	tokenBegin = 0; token = "";
	for (i = 0; i < holdValue.length; i++) {
		c = holdValue.charAt(i);
		if (tokenBegin == 0) {
			if (c.match(/[a-z]/i)) { tokenBegin = 1; token = c;} else { newvalue += c; }
		} else {
			if (c.match(/[a-z]|[0-9]|[.]/i)) {
				// we're continuing to match, so add it up
				if (c == ".") { tokenBegin = 2; }
				token += c;
			} else {
				// ladies and gentlemen, we possibly have a tag
				if (tokenBegin == 2) { token = tokenParse(token, pDiv); }   // avoid calling tokenParse unless really necessary
				newvalue += token;
				newvalue += c;
				tokenBegin = 0;
			}
		}
	}


	return newvalue;
}


function resizeParentWidth(pDiv) {
	var div = null;

	div = pDiv;
	while (div.parentNode != document.body) {
		if (div.parentNode.offsetWidth < (div.offsetLeft + div.offsetWidth)) {
			div.parentNode.style.width = (div.offsetLeft + div.offsetWidth) + "px";
		}
		div = div.parentNode; // Moving on up;
	}
}


function resizeParentHeight(pDiv) {
	var div = null;

	div = pDiv;
	while (div.parentNode != document.body) {
		if (div.parentNode.offsetHeight < (div.offsetTop + div.offsetHeight)) {
			div.parentNode.style.height = (div.offsetTop + div.offsetHeight) + "px";
		}
		div = div.parentNode; // Moving on up;
	}
}



function laytopiaHeights()
{
	// widths MUST be present. Either absolute or percentage
	// divs just don't work like you'd expect unless their height is set properly.
   // is creating a separate array really a good idea? i'm not sure. deep illustrates my pain.
   // mapping the array back to a div is okay, thanks to getdocumentbyid.
   // mapping the div back to it's array element is NOT so nice (and it's going to be slow)
   // this allows me to shift things around without ever seeing it happen on the screen
   // then again, i could keep adding new properties to the divs themselves, and this would solve that

   // i believe i thought firefox couldn't support this, but it only doesn't support attributes added directly to the html

	// ignore resize events that occur due to my code (apply en masse with an event turnoff toggle) standard + 1 type garbagola

	// presumable for ... in can be counted on to traverse the order in which things were added (depends if the browser javascript developers were idiots)

	/*
		Mirror Photocopying a Mirror / Which calculates First? 
		
		I can't position the TOP, because it could reference Height.
		I can't determine HEIGHT, because I need the TOP (of things inside me)

		Maybe that's how things get resolved.
		Go to the most inside thing.
      a) (newborn)Figure out the top & left & width & height of all the children.
      b) (sibling) Then make all the children equal width & hieght (if they aren't already - don't trust the browser)
      c) (parents) Then tell the parent the perfect width & height he'll be as a result
      Rinse & Repeat
	*/


	var holdObjects = new Object();
	var holdObject = null;
	var div = null;
	var raw = "";
	var deepest = -1;


	// *** need to check for errors!
   // *** what if the parentNode DOESN"T HAVE an ID? Isn't found in holdObjects?

	var layoutDivs = document.getElementsByTagName("div");
	for (var layoutDivIndex = 0; layoutDivIndex < layoutDivs.length; layoutDivIndex++)
	{
		div = layoutDivs[layoutDivIndex];
		raw = div.getAttribute("laytopia");
		if ((raw != null) && (raw != ""))
		{
			if (!div.id) { div.id = "layotopia" + layoutDivIndex; }

			holdObjects[div.id] = new Object();
			holdObject = holdObjects[div.id];
			holdObject.div = div;
			holdObject.width = 0; // div.offsetWidth;
			holdObject.height = 0; // div.offsetHeight;

			// alert(div.id + " " + div.offsetHeight);
			if (div.parentNode == document.body) {
				holdObject.parent = null;
				holdObject.deep = 0;				
			} else {
				holdObject.parent = holdObjects[div.parentNode.id];
				holdObject.deep = holdObject.parent.deep + 1;
			}
			if (holdObject.deep > deepest) { deepest = holdObject.deep; }
		}
	}

	// establish offsetheight
	for (var Index = deepest; Index > -1; Index--)
	{
		for ( key in holdObjects )
		{
			holdObject = holdObjects[key];
			if ( holdObject.deep == Index )
			{
				if (holdObject.height == 0) { holdObject.height = holdObject.div.offsetHeight; }
				if ((holdObject.parent != null) && (holdObject.parent.height < holdObject.height)) { holdObject.parent.height = holdObject.height; }
			}
		}
	}

	for ( key in holdObjects ) {
		holdObject = holdObjects[key];
		holdObject.div.style.height = holdObject.height + "px";
		
		// holdObject.div.style.width = 200 + "px";
	}

}


function laytopiaTimer() {
	// This can only be called after the page has been created and Document_OnLoad has occurred.
	// Which is why it's hooked up to that event. Happens BEFORE the regular Load event.
	// Repositioning all the DIVS could trigger the onresize event again, use the laytopiaEvent variable to stop this from being called twice (simultaneously)
	var div = null, raw="";
	var deep = 0;
	var layLeft = "", layTop="", layWidth = "", layHeight="";
	var holdLeft = "", holdTop = "", holdWidth = "", holdHeight = "";
	var resizeWidth = false, resizeHeight = false; 
	var hold = "", error = "";

//	laytopiaHeights();
//	return;

	laytopiaCurtainHide();

	laytopiaWidthHeightInitialize();

	if ((laytopiaWidthHold != laytopiaWidth) || (laytopiaHeightHold != laytopiaHeight)) {
		laytopiaWidthHold = laytopiaWidth; laytopiaHeightHold = laytopiaHeight;   // Remember the size we did this for (or tried to do this for)
		laytopiaError = "";		
		layoutDivs = document.getElementsByTagName("*");

		// let each div know how "deep" it is withing a contaner (relative to the body), this is important when we start to use previous
		// consider breaking out the left, top, width & height into separate properties, so they can be easily referenced by everybody via getelementbyid
      // come to think of it, everybody has offsetleft, offsettop and crap to work with, only i need this 4 segment crap!
		deep = 0; hold = null;
		for (layoutDivIndex = 0; layoutDivIndex < layoutDivs.length; layoutDivIndex++) {
			div = layoutDivs[layoutDivIndex];
			if (div.parentNode == document.body) {
				div.deep = 1;
			} else {
				div.deep = parseInt(div.parentNode.deep) + 1;
			}
		}
	
		// flatten THIS ahead of time if possible
		// s = s.replace(/([^a-zA-Z0-9])this.left/gi, "$1bobby");
      // take 2 and place in 1, etc.
		for (layoutDivIndex = 0; layoutDivIndex < layoutDivs.length; layoutDivIndex++) {
			div = layoutDivs[layoutDivIndex];

			// Width First
			error = "";
			raw = div.getAttribute("laytopia");
			if ((raw != null) && (raw != "")) {
				if (error == "") {
					// Parse the Laytopia attribute.
					layLeft = ""; layTop = ""; layWidth = ""; layHeight = "";
					hold = raw.split(";");
				}
				
				// Left
				if ((error == "") && (hold.length > 0)) {
					holdLeft = laytopiaTrim(hold[0]);
					if ((holdLeft != "") && (holdLeft.toLowerCase() != "default")) {
						holdLeft = laytopiaParse(holdLeft, div);
						try { layLeft = parseInt(eval(holdLeft)); } catch (e) { layLeft = "error"; }
						if (layLeft == "") { layLeft = "0"; }   // eval returning "" does NOT mean an error, it means 0 (hopefully)
						if ((layLeft == "error") || (layLeft == null) || isNaN(layLeft)) { error += "Laytopia:Error:laytopiaTimer:Left portion has a syntax problem. " + div.id + " - '" + raw + "'.\n"; }
						//* Going negative  is acceptable, I can see people wanting this, especially with clipping
					}
				}

				// Top
				if ((error == "") && (hold.length > 1)) {
					holdTop = laytopiaTrim(hold[1]);
					if ((holdTop != "") && (holdTop.toLowerCase() != "default")) {
						holdTop = laytopiaParse(holdTop, div);
						try { layTop = parseInt(eval(holdTop)); } catch (e) { layTop = "error"; }
						if (layTop == "") { layTop = "0"; }   // eval returning "" does NOT mean an error, it means 0 (hopefully)
						if ((layTop == "error") || (layTop == null) || isNaN(layTop)) { error += "Laytopia:Error:laytopiaTimer:Top portion has a syntax problem. " + div.id + " - '" + raw + "'.\n"; }
					}
				}
	
				// Width
				if ((error == "") && (hold.length > 2)) {
					holdWidth  = laytopiaTrim(hold[2]);
					if ((holdWidth != "") && (holdWidth.toLowerCase() != "default")) {
						holdWidth = laytopiaParse(holdWidth, div);
						try { layWidth = parseInt(eval(holdWidth)); } catch (e) { layWidth = "error"; }
						if (layWidth == "") { layWidth = "0"; }
						if ((layWidth == "error") || (layWidth == null) || isNaN(layWidth)) {
							error += "Laytopia:Error:laytopiaTimer:Width portion has a syntax problem. " + div.id + " - '" + raw + "'.\n";
						} else if (parseInt(layWidth) < 5) {
							// 0 means ignore the Width. -'ve values yield errors. going smaller than the text in the div causes discrepencies between browsers
							layWidth = 5;
						}			
					}
				}

				// Height
				if ((error == "") && (hold.length > 3)) {
					holdHeight  = laytopiaTrim(hold[3]);
					if ((holdHeight != "") && (holdHeight.toLowerCase() != "default")) {
						holdHeight = laytopiaParse(holdHeight, div);
						try { layHeight = parseInt(eval(holdHeight)); } catch (e) { layHeight = "error"; }
						if (layHeight == "") { layHeight = "0"; }
						if ((layHeight == "error") || (layHeight == null) || isNaN(layHeight)) {
							error += "Laytopia:Error:Height portion has a syntax problem. " + div.id + " - '" + raw + "'.\n";
						} else if (parseInt(layHeight) < 5) {
							// 0 means ignore the Height. -'ve values yield errors. going smaller than the text in the div causes discrepencies between browsers
							layHeight = 5;
						}			
					}
				}

				// Success. Let's attempt to position	
				if (error == "") {					
					resizeWidth = false; resizeHeight = false; 

					if (layLeft != "") {
						div.style.position="absolute";
						div.style.left = layLeft + "px";
						resizeWidth = true;
					}
					if (layTop != "") {
						div.style.position="absolute";
						div.style.top = layTop + "px";
						resizeHeight = true;
					}

					if (layWidth != "") {
						div.style.width = layWidth + "px";
						// padding (a property I cannot read) has thrown off our size, so fix it.
						if (div.offsetWidth != layWidth) { div.style.width = layWidth - (div.offsetWidth - layWidth) + "px"; } 
						resizeWidth = true;
					}
					if (layHeight != "") {
						div.style.height = layHeight + "px";
						if (div.offsetHeight != layHeight) { div.style.height = layHeight - (div.offsetHeight - layHeight) + "px"; } 
						resizeHeight = true;
					}

					// for some odd reason, container DIVS do not reflect the width & height of the absolute divs they contain. NICE. fix that.
					if (resizeWidth) { resizeParentWidth(div); }   // changing either .left or .width can increase the size of the container
					// if (resizeHeight) { resizeParentHeight(div); }
					
					/* if (div.parentNode == document.body) */
					// div.style.visibility = '';
				}
			}
			laytopiaError += error;
		}
	
		if (laytopiaError != "") {
			alert(laytopiaError);

		} else {

			/*	FUCK!!! how do distinguish between this and HEYAH!!! Another property perhaps?		
			// 2nd pass - committed to height growing...
			for (layoutDivIndex = 0; layoutDivIndex < layoutDivs.length; layoutDivIndex++) {
				div = layoutDivs[layoutDivIndex];
				if (div.parentNode != document.body) {
					raw = div.getAttribute("laytopia");
					if ((raw != null) && (raw != "")) {
						if (div.offsetHeight != div.parentNode.offsetHeight) { div.style.height = div.parentNode.offsetHeight + "px"; }
					}
				}
			}
			*/

			// do we need to do this again? (browser scrollbar may have dissapeared after everything was resized)
			laytopiaWidthHeightInitialize();
			if ((laytopiaWidthHold != laytopiaWidth) || (laytopiaHeightHold != laytopiaHeight)) { laytopiaTimer(); }
		}

		// Size the Container (everything is within the invisible container)
		div = window.document.getElementById("bodynew");
		if (div) {
			if (laytopiaWidth > laytopiaWidthMin) {
				div.style.width = "100%";   // don't know the size of the vertical scrollbar (if there is one)
			} else {
				div.style.width = laytopiaWidthMin + "px";   // causes the scrollbar (optional)
			}
	
			div.style.height = laytopiaHeight + "px";   // div.style.height = "100%"; doesn't work in IE
			div.style.visibility = 'visible';
		}
	}

	layoutTimeoutID = "";

	// --------------------
	if (!laytopiaImages) {
		var src2 = "";
		var divs = document.getElementsByTagName("img");
	
		for (var i = 0; i < divs.length; i++) {
			src2 = (divs[i].getAttribute("src2"));
			if ((src2 != null) && (src2 != "")) {
				divs[i].src = src2;
			}	
		}
		laytopiaImages	= true;
		// need to chain images via onload
		// images interfere with the layout, would need to use curtain or world or hidden instead
	}

}

function laytopiaResizeEvent() {
	// Fires with every pixel movement in IE (don't want that)
	// This event needs to finish before we can read the width & height of the browser properly. i.e. never put any code direclty in here
	if (layoutTimeoutID != "") {
		window.clearTimeout(layoutTimeoutID);
	}
	layoutTimeoutID = window.setTimeout("laytopiaTimer();", 100);
}
laytopiaAddLoadEvent(laytopiaTimer);
laytopiaAddResizeEvent(laytopiaResizeEvent);

function laytopiaCurtainShow(pBackcolor) {
	document.write("<DIV ID='laytopiaCurtain' Style='position:absolute;left:0px;top:0px;width:" + screen.availWidth + "px;height:" + screen.availHeight + "px;z-index:1000;background:" + pBackcolor + ";'>&nbsp;</DIV>");
}
function laytopiaCurtainHide() {
	var div = window.document.getElementById("laytopiaCurtain");
	if ((div) && (div.style.visibility != "hidden")) {		
		div.style.width = "1px"
		div.style.height = "1px"
		div.style.left = "-100px"
		div.style.top = "-100px"
		div.style.visibility = "hidden";
	}
}
