window-core.js

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

	//wethter window is resizable
	this.defineConfigOption("canResize", true);
	//resizing directions
	this.defineConfigOption("resizeDirection", "all");
	//wether to raise only on clicking the title
	this.defineConfigOption("raiseOnlyOnTitle", false);
	//wether window is draggable
	this.defineConfigOption("canDrag", true);
	//dragging method
	this.defineConfigOption("dragMethod", "cut");
	//dragging class name (applied only when dragging)
	this.defineConfigOption("addDragCSS", null);
	//dragging class name (applied only when dragging, overwrites all others)
	this.defineConfigOption("newDragCSS", null);
	//wether window is modal
	this.defineConfigOption("modal", false);
	//limitations on the window
	this.defineConfigOption("limit", {
		minWidth : 120,
		maxWidth : null,
		minHeight : 120,
		maxHeight : null,
		minX : null,
		maxX : null,
		minY : null,
		maxY : null
	});
	//should we show content in IFRAME Pane or just simple div Pane
	this.defineConfigOption("iframeContent", false);
	//do we hide on close or destroy
	this.defineConfigOption("hideOnClose", false);
	//is minimized window draggable
	this.defineConfigOption("dragMin", false);
	//do we minimize to the bottom
	this.defineConfigOption("bottomMinimize", true);
	//is Window position fixed on the page
	this.defineConfigOption("fixed", false);
	//default theme winxp
	this.defineConfigOption("theme", "winxp");
	//we need the HTML part of our window to be loaded, so defining the source and sourceType
	this.defineConfigOption("template", Zapatec.Window.path + "struc.html");
	//callback source function
	this.defineConfigOption("callbackSource", function(args) {
		//getting window object that requested the load
		var win = args.object;
		//not a Zapatec.Window - no load
		if (!win || win.widgetType != "window") {
			return null;
		}
		switch (args.action) {
			//action is loading template
			case "loadTemplate" : {
				return {source : win.getConfiguration().template, sourceType : "html/url"};
			}
		}
		return null;
	});
	this.defineConfigOption('langId', Zapatec.Window.id);
	this.defineConfigOption('lang', "eng");
	// processing Widget functionality
	Zapatec.Window.SUPERclass.configure.call(this, config);
	config = this.getConfiguration();
	if (config.dragMethod == "copy" || config.dragMethod == "dummy") {
		config.dragMethod = "dummy";
		config.newDragCSS = "zpWinDummy";
	}
};

/**
 * Reconfigures the object with new parameters.
 * @param config {object} new configuration parameters.
 */
Zapatec.Window.prototype.reconfigure = function(config) {
	// Call parent method
	Zapatec.Window.SUPERclass.reconfigure.call(this, config);
};

/**
 * We overwrite the zpwidgets loadDataHtml method to parse 
 * needed values from given HTML source.
 * @param el [HTML element] - DOM representation of or HTML part.
 */
Zapatec.Window.prototype.loadDataHtml = function(el) {
	//el is an DOM element created from the struct.html file, which contains HTML part of this widget.
	if (this.parseDom(el)) {
		this.changeState("loaded");
	}
};

/**
 * This function appends the loaded structure to the documents BODY,
 * makes Window draggable, sets all the parameters of the visual elements.
 * All its actions are closely connected with config options.
 * @param x [integer] x coordinate.
 * @param y [integer] y coordinate.
 * @param width [integer] width of the window.
 * @param height [integer] height of the window.
 */
Zapatec.Window.prototype.create = function (x, y, width, height)  {
	//parsing numbers for coordinates and sizes
	if (x != "center") {
		x = parseInt(x, 10) || 0;
	}
	if (y != "center") {
		y = parseInt(y, 10) || 0; 
	}
	if (width != "auto") {
		width = parseInt(width, 10) || 0; 
	}
	if (height != "auto") {
		height = parseInt(height, 10) || 0;
	}
	//If not everything is ready for creating the widget we should wait a little and try again.
	//some kind of imitation of "threaded widget", if you know what I mean :)
	if (!this.fireOnState("body_loaded", function() {this.create(x, y, width, height);}) || !this.fireOnState("loaded", function() {this.create(x, y, width, height);})) {
		return;
	}
	//appending the loaded element
	document.body.appendChild(this.getContainer());
	//adding a class name for using specified theme
	Zapatec.Utils.addClass(this.getContainer(), this.getClassName({prefix : "zpWin", suffix : "Container"}));
	//adding buttons
	function replaceButton(but, idPrefix, func) {
		//creating Zapatec.Button
		var button = new Zapatec.Button({
			className : but.className,
			style : but.style.cssText,
			theme : null,
			idPrefix : idPrefix,
			clickAction : func
		});
		//replaceing old one
		var nxtSbl = but.nextSibling;
		var par = but.parentNode;
		if (but.outerHTML) {
			but.outerHTML = "";
		} else {
			par.removeChild(but);
		}
		//putting new button
		par.insertBefore(button.getContainer(), nxtSbl);
		//returning new object
		return button;
	}
	var self = this;
	//min button
	this.minButton = replaceButton(this.minButton, "zpWin" + self.id + "MinButton", function() {self.minimize();});
	//max button
	this.maxButton = replaceButton(this.maxButton, "zpWin" + self.id + "MaxButton", function() {self.maximize();});
	//close button
	this.closeButton = replaceButton(this.closeButton, "zpWin" + self.id + "CloseButton", function() {self.close();});
	//restore button
	this.restoreButton = replaceButton(this.restoreButton, "zpWin" + self.id + "RestoreButton", function() {self.restore();});
	//customizing the structure to the options of config
	this.setModeOn("immediate_execution");
	this.reconfig();
	this.setModeOff("immediate_execution");
	//saving width of the old content
	var contentWidth = Zapatec.Utils.getWidth(this.content);
	//Creating a Pane object
	var pane = new Zapatec.Pane({
		containerType : (this.config.iframeContent ? "iframe" : "div")
	});
	this.content.getContainer = function() {return this;};
	//Currently we will not set width auto, we'll do it
	//on content load
	if (width == "auto") {
		width = 0;
		this.addEventListener("onContentLoad", function() {
			this.setWidth("auto");
			this.removeEventListener("onContentLoad", arguments.callee);
		});
	}
	if (height == "auto") {
		height = 0;
		this.addEventListener("onContentLoad", function() {
			this.setHeight("auto");
			this.removeEventListener("onContentLoad", arguments.callee);
		});
	}
	//copying class name
	pane.getContainer().className = this.content.className;
	//FIXME : these are also some tricks
	pane.fireWhenReady(function() {
		//removing margin and padding
		if (this.getContentElement()) {
			if (this.config.containerType.toLowerCase() == "iframe") {
				this.getContentElement().style.padding = "0px";
			}
			this.getContentElement().style.margin = "0px";
		}
		//removing border
		var width = Zapatec.Utils.getWidth(this.getContainer());
		this.removeBorder();
		Zapatec.Utils.setWidth(this.getContainer(), width);
	});
	//Creating WCH
	this.createProperty(this, "WCH", Zapatec.Utils.createWCH());
	if (this.WCH) {
		//puting WCH to right place
		this.WCH.style.zIndex = Zapatec.Window.maxNumber++;
		Zapatec.Utils.setWidth(this.WCH, Zapatec.Utils.getWidth(this.getContainer()));
		Zapatec.Utils.setHeight(this.WCH, Zapatec.Utils.getHeight(this.getContainer()));
		var pos = Zapatec.Utils.getElementOffset(this.getContainer());
		Zapatec.Utils.moveTo(this.WCH, pos.x, pos.y);
	}
	//manipulating with container
	this.container.style.zIndex = Zapatec.Window.maxNumber++;
	//making Window movable
	this.makeMovable();
	//making Window sizable
	this.makeSizable();
	//making Window draggable
	this.makeDraggable();
	//making Window resizable
	this.makeResizable();
	//replacing content with pane
	var content = this.content;
	this.content = pane;
	this.replaceWithSizable(content, this.content.getContainer());
	//adding "onContentLoad" event listener launch
	this.content.addEventListener("contentLoaded", function() {
		self.fireEvent('onContentLoad');
	});
	//adding a button type for titleArea to react on dbl click
	this.titleArea.buttonType = "title";
	//adding a button type for content not to cancel selection
	this.content.getContainer().buttonType = "content";
	//adding a button type for container to limit seeking of target element
	this.getContainer().buttonType = "container";
	//adding event listeners
	this.addEvents();
	//turning on immediate execution
	this.setModeOn("immediate_execution");
	//trying to set sizes and pos by our methods
	this.setSize(
		width > this.getConfiguration().limit.minWidth ? width : this.getConfiguration().limit.minWidth, 
		height > this.getConfiguration().limit.minHeight ? height : this.getConfiguration().limit.minHeight 
	);
	if (this.getConfiguration().fixed) {
		Zapatec.FixateOnScreen.register(this.getContainer());
		Zapatec.FixateOnScreen.register(this.WCH);
	}
	this.setScreenPosition(x, y);
	//hiding new window
	this.hide();
	//turning off immediate execution
	this.setModeOff("immediate_execution");
	//setting the state to ready
	this.changeState("ready");
};