lite-window.js

zapatec suite 最新版 20070204,非常棒的ajax widgets 工具包

 *
 * @param x [integer] x coordinate.
 * @param y [integer] y coordinate.
 * @param width [integer] width of the window.
 * @param height [integer] height of the window.v
 *
 * @return [object] { x, y } containing the position.
 */
Zapatec.Window.prototype.create = function (x, y, width, height)  {
	if (width == "auto") {
		this.config.autoContentWidth = true;
	}
	if (height == "auto") {
		this.config.autoContentHeight = true;
	}
	var noButtons = !(this.config.showCloseButton);
	var config = this.config;
	//creating of the top level div to control the width and position of the window
	var div = this.winDiv = Zapatec.Utils.createElement("div", null, true);
	div.style.position = "absolute";
	div.style.width = (this.config.width = parseInt(width, 10) || this.config.minWidth) + "px";
	div.style.display = "none";
	this.config.visible = false;
	this.addEvents();
	
	//creating of another div with zpWin class
	div = Zapatec.Utils.createElement("div", div, true);
	div.className = "zpWin";
	
	//table with all the elements
	var table = Zapatec.Utils.createElement("table", div, true);
	table.border = 0;
	table.cellPadding = "0";
	table.cellSpacing = "0";
	
	var tbody = Zapatec.Utils.createElement("tbody", table, true);
	
	//title area of the window
	if (config.showTitle == true) {
		var tr = this.titleArea = Zapatec.Utils.createElement("tr", tbody);
		tr.buttonType = "move";
		tr.className = "zpWinTitleArea";
		
		//additional cell for ronded borders in title
		var td = Zapatec.Utils.createElement("td", tr);
		div = Zapatec.Utils.createElement("div", td);
		div.innerHTML = " ";

		//cell with title text
		td = Zapatec.Utils.createElement("td", tr);
		td.style.width = "100%";
		
		div = this.titleText = Zapatec.Utils.createElement("div", td);
		div.className = "zpWinTitleText";
		div.style.overflow = "hidden";
		div.style.height = "100%";
		//Safari Fix
		if (Zapatec.is_khtml) div = Zapatec.Utils.createElement("div", div);
		div.appendChild(document.createTextNode(""));
			
		//cell with close button
		td = Zapatec.Utils.createElement("td", tr);
		
		if (config.showCloseButton == true) {		
			div = this.closeButton = Zapatec.Utils.createElement("div", td);
			div.style.overflow = "hidden";
			div.buttonType = "close";
			div.className = "zpWinCloseButton";
		} else if (!Zapatec.is_ie && noButtons) {
			//a workaround for Gecko's behaviour(we need to create at least one button cell for the window to be shown correctly).
			div = Zapatec.Utils.createElement("div", td);
			div.innerHTML = " ";
		}
		tr.firstChild.id = "titleFirstCell";
		tr.lastChild.id = "titleLastCell";
	}
	
	//creating content area
	tr = Zapatec.Utils.createElement("tr", tbody, true);
		
	td = Zapatec.Utils.createElement("td", tr, true);
	td.colSpan = 5;
	td.id = "contentCell";
		
	div = this.contentArea = document.createElement("div");
	td.appendChild(div);
	div.style.height = (this.config.height = parseInt(height, 10) || this.config.minHeight) + "px";
	div.style.overflow = "auto";
	div.className = "zpWinContent";
	//Safari Fix
	if (Zapatec.is_khtml) div = Zapatec.Utils.createElement("div", div);
	div.appendChild(document.createTextNode(""));
		
	window.document.body.appendChild(this.winDiv);
	//Seting widths of title, content and status elements for IE to proceed overflows.
	this.calculateSizes();
	var size = Zapatec.Utils.getWindowSize(); 
	var br = {};
	if (Zapatec.is_ie) {
		br.y = window.document.body.scrollTop;
		br.x = window.document.body.scrollLeft;
	} else {
		br.y = window.scrollY || 0;
		br.x = window.scrollX || 0;
	}
 	if (x == 'center') { 
 		if (screen.width) { 
 			x = (size.width -  this.config.width)/2 + br.x; 
 		} 
 	} 
 	if (y == 'center') { 
 		if (screen.height) { 
			y = (size.height - (this.config.height + this.config.heightDiff))/2 + br.y; 
 		} 
 	}
	this.winDiv.style.left = (this.config.left = x) + "px";
	this.winDiv.style.top = (this.config.top = y) + "px";
	if (this.titleText) this.titleText.style.width = this.config.titleWidth + "px";
	if (this.contentArea) this.contentArea.style.width = this.config.contentWidth + "px";
	
	//Creating WCH
	this.WCH = Zapatec.Utils.createWCH();
	
	//Activating window.
	if (this.config.modal == true) {
		this.modalLayer = Zapatec.Utils.createElement("DIV", document.body);
		var st = this.modalLayer.style;
		st.display = "none";
		st.position = "absolute";
		st.top = br.y + "px";
		st.left = br.x + "px";
		var dim = Zapatec.Utils.getWindowSize();
		st.width = dim.width + "px";
		st.height = dim.height + "px";
		st.zIndex = Zapatec.Window.maxNumber++;
		this.modalLayer.className = "zpWinModal";
		Zapatec.ScrollWithWindow.register(this.modalLayer);
	}
	this.setNumber();
	this.winDiv.style.zIndex = Zapatec.Window.maxNumber;
	Zapatec.Window.winArray.push(this);
	this.setCurrent();
	//alert(document.getElementById("1").innerHTML);
	return true;
}	

// Global that holds the array of all the windows on the page
Zapatec.Window.winArray = [];
// Global that keeps track of max number of windows
Zapatec.Window.maxNumber = 0;
// Global that holds the pointer to the current window
Zapatec.Window.currentWindow = null;
// Global that keeps last active window
Zapatec.Window.lastActive = null;

/*
 * \internal
 * For internal use only.
 * Increment the max number of windows
 */
Zapatec.Window.prototype.setNumber = function() {
	this.winNumber = ++Zapatec.Window.maxNumber;
};

/*
 * \internal
 * For internal use only.
 * Sets the current window
 */

Zapatec.Window.prototype.setCurrent = function(deb) {
	var win = this;
	if (!win.winDiv) {
		return false;
	}
	if (Zapatec.Window.currentWindow && //if it is not the first one
			win != Zapatec.Window.currentWindow) { //and it is not the same one as before
		//Show the previous window as not being the current window anymore
		if (Zapatec.Window.currentWindow.winDiv) {
			Zapatec.Utils.removeClass(Zapatec.Window.currentWindow.winDiv, 'zpWinFront');
			Zapatec.Utils.addClass(Zapatec.Window.currentWindow.winDiv, 'zpWinBack');
		}
		if (Zapatec.Window.currentWindow.winDiv) {
			Zapatec.Window.lastActive = Zapatec.Window.currentWindow;
		} 
	}
	//And set the current window
	Zapatec.Window.currentWindow = win;
	Zapatec.Utils.removeClass(win.winDiv, 'zpWinBack');
	Zapatec.Utils.addClass(win.winDiv, 'zpWinFront');
	return true;
}

/* 
 * Set the content of a window.
 * @param type [string] the HTML data to set the content to.
 */

Zapatec.Window.prototype.setContent = function(text) {
	if (!this.winDiv) {
		return false;
	}
	if (this.config.autoContentWidth) {
		if (this.titleText) this.titleText.style.width = "auto";
		if (this.contentArea) {
			this.contentArea.style.width = "auto";
		}
		if (this.statusArea) this.statusArea.style.width = "auto";
		this.contentArea.style.overflow = "visible";
	}
	if (this.config.autoContentHeight) {
		if (this.contentArea) {
			this.contentArea.style.height = "auto";
		}
	}

	this.contentArea.innerHTML = text;

	if (this.config.autoContentWidth || this.config.autoContentHeight) {
		var shown = false;
		if (this.winDiv.style.display != "block") {
			this.show();
			shown = true;
		}
		if (this.config.autoContentWidth) this.setWidth(this.contentArea.offsetWidth + this.config.contentWidthDiff);
		if (this.config.autoContentHeight) this.setHeight(this.contentArea.offsetHeight + (Zapatec.is_opera ? 4 : 0));
		this.contentArea.style.overflow = "auto";
		if (shown) this.hide();
	}
	return true;
}

/* 
 * Set the content of a window from HTML element(DIV).
 * @param div [string]or [object] the HTML data to set the content to.
 */

Zapatec.Window.prototype.setDivContent = function(div) {
	if (!this.winDiv) {
		return false;
	}
	if (typeof div == "string") {
		div = document.getElementById(div);
	}
	if (div && this.contentArea) {
		if (this.config.autoContentWidth) {
			if (this.titleText) this.titleText.style.width = "auto";
			if (this.contentArea) {
				this.contentArea.style.width = "auto";
			}
			if (this.statusArea) this.statusArea.style.width = "auto";
			this.contentArea.style.overflow = "visible";
		}
		if (this.config.autoContentHeight) {
			if (this.contentArea) {
				this.contentArea.style.height = "auto";
			}
		}

		var objChild = null;
	    // Remove all previous window content
	    objChild = this.contentArea.firstChild;
	    while (objChild) {
	      this.contentArea.removeChild(objChild);
	      objChild = this.contentArea.firstChild;
	    }
	    // Move all children to the window
	    objChild = div.firstChild;
	    while (objChild) {
	      this.contentArea.appendChild(objChild);
	      objChild = div.firstChild;
	    }

		if (this.config.autoContentWidth || this.config.autoContentHeight) {
			var shown = false;
			if (this.winDiv.style.display != "block") {
				this.show();
				shown = true;
			}
			if (this.config.autoContentWidth) this.setWidth(this.contentArea.offsetWidth + this.config.contentWidthDiff);
			if (this.config.autoContentHeight) this.setHeight(this.contentArea.offsetHeight + (Zapatec.is_opera ? 4 : 0));
			this.contentArea.style.overflow = "auto";
			if (shown) this.hide();
		}
	}
	return true;
}

/* 
 * Set the content of a window from url.
 * @param div [string]or [object] the HTML data to set the content to.
 */

Zapatec.Window.prototype.setContentUrl = function(url) {
	if (!this.winDiv) {
		return false;
	}
	var self = this;
	Zapatec.Transport.fetch({
		url : url, 
		onLoad : function (result) {
			//FIXED: <script>s didn't actually were executed on loaded piece of HTML, which I think was a problem
			var text = result.responseText, script, scripts = [], attrs;
			while (script = text.match(/<script([^>]*)>([^<]*)<\/script>/)) {
				text = text.replace(/<script[^>]*>[^<]*<\/script>/, "");
				scripts.push(script);
			}
			self.setContent(text);
			for(i in scripts) {
				// Evaluate code in global scope
				setTimeout(scripts[i][2], 0);
			}
			self.onContentLoad();
		},
		onError : function () {
			alert('Error while fetching data from the server');
		}
	});
	return true;
}

/*
 * Set the title of the window
 * @param type [string] the title to set to
 */ 
Zapatec.Window.prototype.setTitle = function(text) {
	if (!this.winDiv) {
		return false;
	}
	if (text === '') {
		this.titleText.innerHTML = 'Window ' + this.winNumber;
	} else {