// $Id: lite-window.js 6650 2007-03-19 10:14:14Z slip $/** * The Zapatec DHTML Menu * * Copyright (c) 2004-2006 by Zapatec, Inc. * http://www.zapatec.com * 1700 MLK Way, Berkeley, California, * 94709, U.S.A. * All rights reserved. * * Windows Widget * $$ * *//** * The Window object constructor.  Call it, for example, like this: * * \code *   var win = new Zapatec.Window({ *   	showResize : false *   }); * \endcode * * The above creates a new Window object.  The Window isn't displayed * instantly; using the "win" variable, the programmer can now set certain * configuration variables, hook his own event handlers and then display the * window using Zapatec.Window.create() and Zapatec.Window.show(). * * @param config [object] - all parameters are passed as the properties of this object. *  * Constructor recognizes the following properties of the config object * \code *    prop. name     | description *  ------------------------------------------------------------------------------------------------- *   showCloseButton | whether to show close button (default true). *   raiseOnlyOnTitle| whether to raize when clicking on title or on the whole body of the created window (default true). *   canDrag         | whether you can drag the window (default true). *   modal           | if true modal window will be created (default false). *   onClose         | custom handler, will be called when window is closed. *   onShow          | custom handler, will be called when show method is called. *   onHide          | custom handler, will be called when hide method is called. *   onRaize         | custom handler, will be called when window is raized. *   onContentLoad   | custom handler, will be called when content is loaded. *    * \endcode */Zapatec.Window = function (config) {	this.winDiv = null;	this.titleArea = null;	this.titleText = null;	this.closeButton = null;	this.contentArea = null;		this.winNumber = 0;	this.config = {};	this.config.showTitle = true;	this.config.titleWidth = 0;	this.config.contentWidth = 0;	this.config.heightDiff = 0;	this.config.left = 0;	this.config.top = 0;	this.config.width = 0;	this.config.height = 0;	this.config.minWidth = 180;	this.config.minHeight = 70;	this.setConfig(config);};/** * \internal This function is called from the constructor, only once, to  * store only needed properties of the config object passed to the constructor. */Zapatec.Window.prototype.setConfig = function (config) {	this.config.showCloseButton = (typeof config.showCloseButton != "undefined") ? config.showCloseButton : true;	this.config.raiseOnlyOnTitle = (typeof config.raiseOnlyOnTitle != "undefined") ? config.raiseOnlyOnTitle : true;	this.config.canDrag = (typeof config.canDrag != "undefined") ? config.canDrag : true;	this.config.modal = (typeof config.modal != "undefined") ? config.modal : false;	this.config.onClose = (typeof config.onClose != "undefined") ? config.onClose : null;	this.config.onShow = (typeof config.onShow != "undefined") ? config.onShow : null;	this.config.onHide = (typeof config.onHide != "undefined") ? config.onHide : null;	this.config.onRaise = (typeof config.onRaise != "undefined") ? config.onRaise : null;	this.onContentLoad = (typeof config.onLoad != "undefined") ? config.onLoad : function () {};};/** * This is a setup function for Window object. * * It gathers some mostly common routines when seting up the Window object on your page. * For example it creates the simple window and shows it, or creates the popup window. * Mostly in all cases (except popup window) it will be initialy shown. Possible enhancement * is to add a property to control the initial state of the window (including minimized, maximized, etc) * * @param config [object] - all parameters are passed as the properties of this object. Many of them are  * the same as for the constructor. *  * Function recognizes the following properties of the config object (duplicated properties are listed in  * the constructor description so are not included here): * \code *    prop. name   | description *  ------------------------------------------------------------------------------------------------- *   popup         | if it is set than window will be a popup window, triggered by the element you passed in this variable. *   triggerEvent  | if popup is set than this defines which event of the trigger element will force the window to popup.  *                 | Possible values: click, mousemove, mouseover, or any DOM event name. *   align         | align of the popup window relational to the trigger object. For information on values see the Zapatec.Window.prototype.showAtElement function description *   width         | initial width of the window in pixels. *   height        | initial height of the window in pixels. *   left          | initial X coordinate of the window. *   top           | initial Y coordinate of the window. *   title         | title of the window. *   content       | content of the window. *   divContent    | id of or "pointer" to the HTML element containing the content for the window. *   urlContent    | URL to load the content from. *    * \endcode */Zapatec.Window.setup = function (config) {	if (!config) {config = {};}	var win = new Zapatec.Window(config);	win.create(config.left || 0, config.top || 0, config.width || win.config.minWidth, config.height || win.config.minHeight);	if (config.title) {		win.setTitle(config.title);	}	if (config.content) {		win.setContent(config.content);	}	if (config.divContent) {     // Save divContent config option for later use     win.config.divContent = config.divContent;		win.setDivContent(config.divContent);	}	if (config.urlContent) {		win.setContentUrl(config.urlContent);	}	win.show();		return win;}; /** * A function that is called to handle mousedown event for our window. * * This function handles the routines that should be done on mousedown. Target parameter determines * whether something was "pushed" and holds that "pushed" element. "pushed" means that mouse was down * on that element and was not released. buttonType property of the target element determines the action that will be made. * There is one usefull possibility: if the target element has the customMouseDown property and it holds  * function, this function will be called except the default action. * * @param ev [object] - event object. * @param win [object] - our window object. * @param target [object] - "pushed" element. */Zapatec.Window.mouseDown = function (ev, win, target) {	if (!win.config.raiseOnlyOnTitle) {		win.raise();	} else {		if (target && ((target.buttonType == "move") || (target.buttonType == "min") || (target.buttonType == "max") || (target.buttonType == "close") || (target.buttonType == "restore"))) {			win.raise();				}	}	if (target) {		switch (target.buttonType) {			case "move" : {				if (!target.customMouseDown) {					if (win.config.canDrag && win.config.state != "min" && win.config.state != "max") {						var posX = ev.pageX || ev.clientX + window.document.body.scrollLeft || 0;						var posY = ev.pageY || ev.clientY + window.document.body.scrollTop || 0;						var L = parseInt(win.winDiv.style.left) || 0;						var T = parseInt(win.winDiv.style.top) || 0;						win.winDiv.xOffs = (posX - L);						win.winDiv.yOffs = (posY - T);						win.titleArea.style.cursor = "move";					}				} else {					target.customMouseDown(ev, win, target);				}				break;			}			case "close" : {				if (!target.customMouseDown) {				} else {					target.customMouseDown(ev, win, target);				}				break;			}		}	}}/** * A function that is called to handle mousemove event for our window. * * This function handles the routines that should be done on mousedown. Target parameter determines * whether something was "pushed" and holds that "pushed" element. "pushed" means that mouse was down * on that element and was not released. buttonType property of the target element determines the action that will be made. * There is one usefull possibility: if the target element has the customMouseMove property and it holds  * function, this function will be called except the default action. * * @param ev [object] - event object. * @param win [object] - our window object. * @param target [object] - "pushed" element. */Zapatec.Window.mouseMove = function (ev, win, target) {	if (target) {		switch (target.buttonType) {			case "move" : {				if (!target.customMouseMove) {					if (win.config.canDrag && win.config.state != "min" && win.config.state != "max") {						var posX = ev.pageX || ev.clientX + window.document.body.scrollLeft || 0;						var posY = ev.pageY || ev.clientY + window.document.body.scrollTop || 0;						var L = posX - win.winDiv.xOffs, T = posY - win.winDiv.yOffs;						win.setPos(L, T);					}				} else {					target.customMouseMove(ev, win, target);				}				break;			}		}	}}/** * A function that is called to handle mouseup event for our window. * * This function handles the routines that should be done on mousedown. Target parameter determines * whether something was "pushed" and holds that "pushed" element. "pushed" means that mouse was down * on that element and was not released. buttonType property of the target element determines the action that will be made. * There is one usefull possibility: if the target element has the customMouseUp property and it holds  * function, this function will be called except the default action. * * @param ev [object] - event object. * @param win [object] - our window object. * @param target [object] - "pushed" element. */Zapatec.Window.mouseUp = function (ev, win, target, hi) {	if (target) {		switch (target.buttonType) {			case "move" : {				if (!target.customMouseUp) {					if (win.config.canDrag) {						win.titleArea.style.cursor = "default";					}				} else {					target.customMouseUp(ev, win, target);				}				break;			}			case "close" : {				if (!target.customMouseUp) {					if (target == (ev.srcElement || ev.target)) {						win.close();					}				} else {					target.customMouseUp(ev, win, target);				}				break;			}		}	}}/** * This function assigns event handlers and implements "pushed" element finding. * * "Pushed" element finding is implemented the following way: all the event handlers see one * global variable target. When mouse is down on some element we try to get its buttonType property * or seek this property in elements parents. If the element with the buttonType is found it is put * into target variable.  */Zapatec.Window.prototype.addEvents = function () {	var self = this, target = null;	Zapatec.Utils.addEvent(this.winDiv, "mousedown", function (ev) {		ev = ev || window.event; 		target = Zapatec.Utils.getTargetElement(ev);		while(!target.buttonType && (target != self.winDiv)) {			target = target.parentNode;		}		if (!target.buttonType) target = null;		Zapatec.Window.mouseDown(ev, self, target);		if (target) return Zapatec.Utils.stopEvent(ev);	});	Zapatec.Utils.addEvent(window.document, "mousemove", function (ev) {		ev = ev || window.event; 		Zapatec.Window.mouseMove(ev, self, target);		if (target) return Zapatec.Utils.stopEvent(ev);	});	Zapatec.Utils.addEvent(window.document, "mouseup", function (ev) {		ev = ev || window.event; 		Zapatec.Window.mouseUp(ev, self, target);		target = null;		if (target) return Zapatec.Utils.stopEvent(ev);	});}/* * \internal * For internal use only. Calculates some sizes needed to implement title and status text cutting and content scrolling. */Zapatec.Window.prototype.calculateSizes = function () {	this.winDiv.style.display = "block";	if (this.titleArea) {		//Safari Fix		this.config.titleWidth = this.config.width - (this.winDiv.offsetWidth - (Zapatec.is_khtml ? this.titleText.firstChild.offsetWidth : this.titleText.offsetWidth));		//Safari Fix		if (Zapatec.is_khtml) this.titleText.removeChild(this.titleText.firstChild);	}		if (this.contentArea) {		//Safari Fix		this.config.contentWidthDiff = this.winDiv.offsetWidth - (Zapatec.is_khtml ? this.contentArea.firstChild.offsetWidth : this.contentArea.offsetWidth);		this.config.contentWidth = this.config.width - this.config.contentWidthDiff;		//Safari Fix		if (Zapatec.is_khtml) this.contentArea.removeChild(this.contentArea.firstChild);	}		this.config.heightDiff = this.winDiv.offsetHeight - this.config.height;	this.winDiv.style.display = "none";}/** * Creates all HTML elements of the window. This function takes in account * this.config object, trough its properties you can disable the following elements: *  - The whole title (currently don't work) - this.showTitle property; *  - Any of 3 buttons (min, max, close) - this.show(Min|Max|Close)Button property; *  - The status area - this.showStatus property; *  - The resize icon - this.canResize property; * Also calls this.addEvents to assign event handlers to the main div and creates WCH  * (http://www.aplus.co.yu/WCH/). * This function defines the following properties for HTML elements, needed for event handlers: *  - buttonType - one of three buttons or resize icon;