/* 	
	------------------------------------------------------------------------------
	/framework/classes/js/panel.js
	
	Een panel is een div die hidden of visible is. Dat is alles!
	
 	------------------------------------------------------------------------------
*/
// some static variables
var activePopupPanelId = ""; // can be used to prevent the opening of 2 popup windows

function Panel(_id) {

	// standard properties
	this.id = _id;	
	
	this.containerElementId = "C_" + this.id;
	this.containerElement = document.getElementById(this.containerElementId);
	this.handleElementId = "H_" + this.id;
	this.handleElement = document.getElementById(this.handleElementId);
	this.popupElementId = "P_" + this.id;
	this.popupElement = document.getElementById(this.popupElementId);
	this.popupBackgroundElementId = "B_" + this.id;
	this.popupBackgroundElement = document.getElementById(this.popupBackgroundElementId);
	
	// appearance
	this.visible = true;
	this.type = "normal";
	this.width = 0;
	this.height = 0;
	this.disappearDelay = 0;
	this.style = "";
	this.className = "";
	
	// events
	// extra properties
	
	
	// methods
	this.show = Panel_show;
	this.hide = Panel_hide;
	
	this.setPopupTitle = Panel_setPopupTitle;
	this.showPopupBackground = Panel_showPopupBackground;
	this.hidePopupBackground = Panel_hidePopupBackground;
	
	this.showDialogBackground = Panel_showDialogBackground;
	this.hideDialogBackground = Panel_hideDialogBackground;
	
	this.showMyDropdowns = Panel_showMyDropdowns;
	this.setValue = Panel_setValue;
	
	this.render = Panel_render;
	this.destroy = Panel_destroy;
	
	this.appendChild = Panel_appendChild;


}

function Panel_appendChild(childToAppend) {
	if (this.containerElement) {
		this.containerElement.appendChild(childToAppend);
	}
}

function Panel_destroy() {
	debug.write("Destroyin' myself: " + this.id);
	if (this.containerElement) {
		if (this.containerElement.parentNode) {
			debug.write("really destroying");
			this.containerElement.parentNode.removeChild(this.containerElement);
		}
	}
	this.containerElement = null;
}

function Panel_setPopupTitle(newText) {
	var el = document.getElementById("T_" + this.id);
	if (el) {
		el.innerHTML = newText;
	}
	
}

function Panel_render() {
	debug.write("rendering " + this.id + " in " + this.parentElement.id + " with value " + this.value);
	
	// currently, only dialog panels are possible
	if (this.type == "dialog") {
		this.containerElement = document.createElement("div");
		this.containerElementId = "C_" + this.id;
		this.containerElement.id = this.containerElementId;
		
		if (this.containerElement != "") 
			this.containerElement.style.width = this.width + "px";
		
			
		this.containerElement.style.display = "none";
		
		if (this.className != "")
			this.containerElement.className = this.className;
		else 
			this.containerElement.className = "fw_panel_" + this.type;
		
		this.parentElement.appendChild(this.containerElement);	
		
		
		
	}
	else {
		debug.write("Creation of panel type " + this.type + " not yet implemented");
	}
	
}



function Panel_setValue(what) {
	this.containerElement.innerHTML = what;
}

function Panel_hide() {
	if (this.containerElement) {
		if (this.type == "popup") {
			this.hidePopupBackground();
			showDropDowns();
			//new Effect.Fade(this.containerElementId);
			this.containerElement.style.display = "none";	
			
			activePopupPanelId = "";
		}
		else if (this.type == "dialog") {
			this.hidePopupBackground();
			showDropDowns();
			new Effect.Fade(this.containerElementId);
		}
		else {
			this.containerElement.style.display = "none";	
		}
		this.visible = false;
		
		
		
	}
}

function Panel_show(ev) {
	
	if (this.containerElement) {
		
		if (this.type == "normal") {
			this.visible = true;
			this.containerElement.style.display = "block";
		}
		else if (this.type == "dialog") {
			
			// positie bepalen ahv breedte van de control (steeds bovenaan)
			var popupWidth = this.width;
			var popupHeight = this.height;
			posX = (getdocwidth() - popupWidth) / 2;
			
			
			this.containerElement.style.position = "absolute";	
			//this.containerElement.style.backgroundColor = "#FFFFFF";	
			//this.containerElement.style.border = "1px solid #CECECE";	
			this.containerElement.style.left = posX + "px";
			this.containerElement.style.top = "0px";
			this.containerElement.style.width =  popupWidth + "px";
			this.containerElement.style.height =  popupHeight + "px";
			this.containerElement.style.zIndex = "101";
			
			
			if (this.disappearDelay == 0) {
				this.showDialogBackground();
			}
			
			
			
			//this.containerElement.style.display = "block";
			//new Effect.SlideDown(this.containerElementId);	// werkt niet :(
			//new Effect.BlindDown(this.containerElementId);	
			new Effect.Appear(this.containerElementId);	
			if (this.disappearDelay > 0) {
				//new Effect.Fade(this.containerElementId, {delay:this.disappearDelay});
				new Effect.Fade(this.containerElementId, {delay:this.disappearDelay});
			}
			this.visible = true;
			
		}
		else { // popup
			
			if (activePopupPanelId == "") { // er mag maar 1 popup zijn!
				activePopupPanelId = this.id;
				
				// positie bepalen ahv breedte van de control
				var popupWidth = this.width;
				var popupHeight = this.height;
				posX = (getdocwidth() - popupWidth) / 2;
				posY = (getdocheight() - popupHeight) / 2 - 30;
				
				// zijn we gescrolled?
				if (document.documentElement && document.documentElement.scrollTop)
					theTop = document.documentElement.scrollTop;
				else if (document.body)
					theTop = document.body.scrollTop;
							
				
				this.popupElement.style.height = popupHeight + "px";
				this.popupElement.style.width = popupWidth + "px";
				
				this.containerElement.style.position = "absolute";	
				this.containerElement.style.display = "block";
				this.containerElement.style.backgroundColor = "#FFFFFF";	
				//this.containerElement.style.border = "1px solid #CECECE";	
				this.containerElement.style.left = posX + "px";
				this.containerElement.style.top = posY + theTop + "px";
				this.containerElement.style.width =  popupWidth + "px";
				this.containerElement.style.zIndex = "101";
				
				// dropdowns komen erdoor
				hideDropDowns();
				// maar de dropdowns op de form zelf moeten wel zichtbaar zijn
				this.showMyDropdowns();
				
				this.showPopupBackground();
				this.containerElement.style.display = "block";
				
				
				this.visible = true;
			}
		}
		
	}
}

function Panel_showPopupBackground() {
	this.popupBackgroundElement = document.createElement("div");
	this.popupBackgroundElement.id = "B_" + this.id;
	this.popupBackgroundElement.className = "fw_popupbackground";
	this.popupBackgroundElement.style.display = "block";
	this.popupBackgroundElement.style.height = document.documentElement.scrollHeight + "px";
	this.popupBackgroundElement.style.width = "100%";
	this.popupBackgroundElement.style.position = "absolute";
	this.popupBackgroundElement.style.top = "0px";
	this.popupBackgroundElement.style.left = "0px";
	this.popupBackgroundElement.style.zIndex = "100";
	// peter: ik haal het hieruit -> steek het dus in de css
	//this.popupBackgroundElement.style.backgroundColor = "#CCCCCC";
	//this.popupBackgroundElement.style.opacity = ".7"; 
	//this.popupBackgroundElement.style.filter = "alpha(opacity=70)"; /* IE */
	document.body.appendChild(this.popupBackgroundElement);
}

function Panel_hidePopupBackground() {
	if (this.popupBackgroundElement) {
		document.body.removeChild(this.popupBackgroundElement);
		this.popupBackgroundElement = null;
	}
}

function Panel_showDialogBackground() {
	// ook bij een dialog mag je niks anders meer doen
	this.popupBackgroundElement = document.createElement("div");
	this.popupBackgroundElement.id = "B_" + this.id;
	this.popupBackgroundElement.className = "fw_popupbackground";
	this.popupBackgroundElement.style.display = "block";
	this.popupBackgroundElement.style.height = document.documentElement.scrollHeight + "px";
	this.popupBackgroundElement.style.width = "100%";
	this.popupBackgroundElement.style.position = "absolute";
	this.popupBackgroundElement.style.backgroundColor = "#000000";
	this.popupBackgroundElement.style.top = "0px";
	this.popupBackgroundElement.style.left = "0px";
	this.popupBackgroundElement.style.zIndex = "100";
	this.popupBackgroundElement.style.opacity = ".5"; 
	this.popupBackgroundElement.style.filter = "alpha(opacity=50)"; /* IE */
	document.body.appendChild(this.popupBackgroundElement);
}

function Panel_hideDialogBackground() {
	if (this.popupBackgroundElement) {
		document.body.removeChild(this.popupBackgroundElement);
		this.popupBackgroundElement = null;
	}
}

function Panel_showMyDropdowns() {
	elems = this.containerElement.getElementsByTagName("select");
	n_elems = elems.length;
	for (i = 0; i < n_elems; i++) {
		if (elems[i].type.toString() == "select-one")
			elems[i].style.display = "block";
	}
}