// fade
var firstRun = 0;

function fadePanel(thisPanel) {
	// doOutput("thisPanel:" + thisPanel.id);
	if(firstRun == 0) {
			firstRun = 1;
			return;
	}
	for(var k=0;k<=thisPanel.childNodes.length;k++) {
		try {
			if(thisPanel.childNodes[k].id == "overlay") {
				// clearThis is the overlay panel
				// var clearThis = thisPanel.childNodes[k];
				// doOutput(currentPanel);
				fadeOut(thisPanel);
			} else {
				// Not Overlay Panel 
			}
		} catch(err) {
		}
	}
}

function resetPanels() {
	// doOutput('ResetPanels');
	for (var i=1;i<=numPanels;i++) {
		var opac = document.getElementById('panel' + i);
		for (var k=0;k<opac.childNodes.length;k++) {
			if(opac.childNodes[k].id == "overlay") {
				opac.childNodes[k].style.display = 'block';
				opac.childNodes[k].style.opacity = 1;
				opac.childNodes[k].style.MozOpacity = 1;
				opac.childNodes[k].style.KhtmlOpacity = 1;
				opac.childNodes[k].style.filter = "alpha(opacity=" + (1 * 100) + ");";
			}
		}
	}
}

/* function changePanelImgElements(panel,imgwidth) {
		var thisPanel = getElementsByClass('panelimage',panel,null,imgwidth);
		for (var i=0;i<=thisPanel.length;i++) {
			var temp;
			// thisPanel[i].style.width = imgwidth;
		}
		doOutput("Done: " + panel.id);
} */

function showFade() {
	var thisPopupBG = document.createElement('div');
	thisPopupBG.setAttribute('id','thispopupbg');
	thisPopupBG.setAttribute('style','position:absolute;width:100%;height:100%;opacity:.75;background:#dddddd;margin:0px;padding:0px;top:0px;left:0px;z-index:10000;');
    thisPopupBG.setAttribute("class","fadediv");
	document.body.appendChild(thisPopupBG);
}

function hideFade() {
	var thisPopupBG = document.getElementById('thispopupbg');
	document.body.removeChild(thisPopupBG);
}

/* set the opacity of the element (between 0.0 and 1.0) */
function setOpacity(level,thiselement) {
  var element;
  // doOutput(thiselement.id);
  for(var k=0;k<=document.getElementById(thiselement).childNodes.length;k++) {
	try {
		if(document.getElementById(thiselement).childNodes[k].id == "overlay") {
		// doOutput(document.getElementById(thiselement).childNodes[k].id);
		element = document.getElementById(thiselement).childNodes[k];
		element.style.opacity = level;
		element.style.MozOpacity = level;
		element.style.KhtmlOpacity = level;
		element.style.filter = "alpha(opacity=" + (level * 100) + ");";
		}	
	} catch(err) {
	}
  }
}
  	
var duration = 1000;  /* 1000 millisecond fade = 1 sec */
var steps = 20;       /* number of opacity intervals   */
var delay = 5000;     /* 5 sec delay before fading out */

function fadeIn(element){
  for (i = 0; i <= 1; i += (1 / steps)) {
    setTimeout("setOpacity(" + i + ",'" + element.id + "')", i * duration);
  }
}

function hideOverlay(element){ //also hide panel cover
	// doOutput("Hide Overlay/Panel: " + element.id);
	// element.style.display = 'none';
	// doOutput('Element cleared');
	for(var k=0;k<=element.childNodes.length;k++) {
	try {
		if(element.childNodes[k].id == "overlay") {
			var elementchild = element.childNodes[k];
			elementchild.style.display = 'none';
			// doOutput('Cleared: ' + elementchild.id);
		}
	} catch(err) {
	}
  }
}

function showOverlay(element){ //also hide panel cover
	// doOutput(element.id);
	// element.style.display = 'none';
	// doOutput('Element cleared');
	for(var k=0;k<=element.childNodes.length;k++) {
	try {
		if(element.childNodes[k].id == "overlay") {
			var elementchild = element.childNodes[k];
			elementchild.style.display = 'block';
			// doOutput(elementchild.id + ' : After show');
		}
		/* if(element.childNodes[k].id == "content") {
			var elementchild = element.childNodes[k];
			elementchild.style.display = 'display';
			doOutput(elementchild.id + ' : After clear');
		} */	
	} catch(err) {
	}
  }
}

function fadeOut(element) {
  var curPanel;
  curPanel = element.id;
  for (i = 0; i <= 1; i += (1 / steps)) {
	if(i > .95) {
		i=1;
		setTimeout("hideOverlay(" + element.id + ");", i * duration);
	}
	setTimeout("setOpacity(" + (1 - i) + ",'" + element.id + "')", i * duration);
	// if(i < .05) setTimeout("showContent(" + element.id + ");", i * duration);
	// Last step before fade ends
	// if(i < .05) setTimeout("clearContent(" + element.id + ");", i * duration);
  }
  
  // if(currentPanel != curPanel) {
	  // doOutput('after fade 2');
	  // var thisPanel = document.getElementById(curPanel);
	  /* var showThis = document.getElementById(curpanel).childNodes[5];
	  for(n=1;n<5;n++) {
			// var contentPan = 'content' + n;
			// var showThis = document.getElementById(curpanel).childNodes[0];
			// setTimeout(timedClear(clearThis),5000);
			doOutput('Show Contents');
			if(showThis.id == "content") {
				var clearThis = thisPanel.childNodes[k];
				// setTimeout(timedClear(clearThis),5000);
				doOutput('Clear It!');
				showThis.style.display = "block";
				doOutput('After Clear');
			}	
			showThis.style.display = "none";
			doOutput('After Contents');
		} */
		
		/* for(var k=0;k<=thisPanel.childNodes.length;k++) {
		try {
			
			if(thisPanel.childNodes[k].id == "overlay") {
				var clearThis = thisPanel.childNodes[k];
				// setTimeout(timedClear(clearThis),5000);
				doOutput('Clear It!');
				thisPanel.childNodes[k].style.display = "none";
				doOutput('After Clear');
			}	
		} catch(err) {
		}
	  } */
	  
	  var lastPanel = document.getElementById(curPanel);

	  // Show all Panel covers
	  for(var i=0;i<=lastPanel.childNodes.length;i++) {
		try {
			// doOutput("panel element: " + lastPanel.childNodes[i].id);
			if(lastPanel.childNodes[i].id == "overlay") {
				lastPanel.childNodes[i].style.display = "block";
				lastPanel.childNodes[i].style.opacity = 1;
				element.style.opacity = level;
				element.style.MozOpacity = level;
				element.style.KhtmlOpacity = level;
				element.style.filter = "alpha(opacity=" + (level * 100) + ");";
				
			}	
		} catch(err) {
		}
	  }
  currentPanel = curPanel;
}

function timedClear(thisPanel) {
	thisPanel.style.display = "none";
}