GZ/nwyj/WebContent/admin/scripts/dojo/dojox/layout/ResizeHandle.js

if (!dojo._hasResource["dojox.layout.ResizeHandle"]) { // _hasResource checks
														// added by build. Do
														// not use _hasResource
														// directly in your
														// code.
	dojo._hasResource["dojox.layout.ResizeHandle"] = true;
	dojo.provide("dojox.layout.ResizeHandle");
	dojo.experimental("dojox.layout.ResizeHandle");

	dojo.require("dijit._Widget");
	dojo.require("dijit._Templated");
	dojo.require("dojo.fx");

	dojo.declare("dojox.layout.ResizeHandle",
			[dijit._Widget, dijit._Templated], {
				// summary
				// The handle on the bottom-right corner of FloatingPane or
				// other widgets that allows
				// the widget to be resized.
				// Typically not used directly.

				// targetId: String
				// id of the Widget OR DomNode that I will size
				targetId : '',

				// targetContainer: DomNode
				// over-ride targetId and attch this handle directly to a
				// reference of a DomNode
				targetContainer : null,

				// resizeAxis: String
				// one of: x|y|xy limit resizing to a single axis, default to xy
				// ...
				resizeAxis : "xy",

				// activeResize: Boolean
				// if true, node will size realtime with mouse movement,
				// if false, node will create virtual node, and only resize
				// target on mouseUp
				activeResize : false,

				// activeResizeClass: String
				// css class applied to virtual resize node.
				activeResizeClass : 'dojoxResizeHandleClone',

				// animateSizing: Boolean
				// only applicable if activeResize = false. onMouseup, animate
				// the node to the
				// new size
				animateSizing : true,

				// animateMethod: String
				// one of "chain" or "combine" ... visual effect only. combine
				// will "scale"
				// node to size, "chain" will alter width, then height
				animateMethod : 'chain',

				// animateDuration: Integer
				// time in MS to run sizing animation. if animateMethod="chain",
				// total animation
				// playtime is 2*animateDuration
				animateDuration : 225,

				// minHeight: Integer
				// smallest height in px resized node can be
				minHeight : 100,

				// minWidth: Integer
				// smallest width in px resize node can be
				minWidth : 100,

				// resize handle template, fairly easy to override:
				templateString : '<div dojoAttachPoint="resizeHandle" class="dojoxResizeHandle"><div></div></div>',

				// private propteries and holders
				_isSizing : false,
				_connects : [],
				_activeResizeNode : null,
				_activeResizeLastEvent : null,
				// defaults to match default resizeAxis. set resizeAxis variable
				// to modify.
				_resizeX : true,
				_resizeY : true,

				postCreate : function() {
					// summary: setup our one major listener upon creation
					dojo.connect(this.resizeHandle, "onmousedown", this,
							"_beginSizing");
					if (!this.activeResize) {
						this._activeResizeNode = document.createElement('div');
						dojo.addClass(this._activeResizeNode,
								this.activeResizeClass);
					} else {
						this.animateSizing = false;
					}

					if (!this.minSize) {
						this.minSize = {
							w : this.minWidth,
							h : this.minHeight
						};
					}
					// should we modify the css for the cursor hover to n-resize
					// nw-resize and w-resize?
					this._resizeX = this._resizeY = false;
					switch (this.resizeAxis.toLowerCase()) {
						case "xy" :
							this._resizeX = this._resizeY = true;
							// FIXME: need logic to determine NW or NE class to
							// see
							// based on which [todo] corner is clicked
							dojo.addClass(this.resizeHandle, "dojoxResizeNW");
							break;
						case "x" :
							this._resizeX = true;
							dojo.addClass(this.resizeHandle, "dojoxResizeW");
							break;
						case "y" :
							this._resizeY = true;
							dojo.addClass(this.resizeHandle, "dojoxResizeN");
							break;
					}
				},

				_beginSizing : function(/* Event */e) {
					// summary: setup movement listeners and calculate initial
					// size

					if (this._isSizing) {
						return false;
					}

					this.targetWidget = dijit.byId(this.targetId);

					// FIXME: resizing widgets does weird things, disable
					// virtual resizing for now:
					if (this.targetWidget) {
						this.activeResize = true;
					}

					this.targetDomNode = this.targetWidget
							? this.targetWidget.domNode
							: dojo.byId(this.targetId);
					if (this.targetContainer) {
						this.targetDomNode = this.targetContainer;
					}
					if (!this.targetDomNode) {
						return;
					}

					if (!this.activeResize) {
						this.targetDomNode.appendChild(this._activeResizeNode);
						dojo.fadeIn({
							node : this._activeResizeNode,
							duration : 120,
							beforeBegin : dojo.hitch(this, function() {
										this._activeResizeNode.style.display = '';
									})
						}).play();
					}

					this._isSizing = true;
					this.startPoint = {
						'x' : e.clientX,
						'y' : e.clientY
					};

					// FIXME: this is funky: marginBox adds height, contentBox
					// ignores padding (expected, but foo!)
					var mb = (this.targetWidget) ? dojo
							.marginBox(this.targetDomNode) : dojo
							.contentBox(this.targetDomNode);
					this.startSize = {
						'w' : mb.w,
						'h' : mb.h
					};

					this._connects = [];
					this._connects.push(dojo.connect(document, "onmousemove",
							this, "_updateSizing"));
					this._connects.push(dojo.connect(document, "onmouseup",
							this, "_endSizing"));

					e.preventDefault();
				},

				_updateSizing : function(/* Event */e) {
					// summary: called when moving the ResizeHandle ...
					// determines
					// new size based on settings/position and sets styles.

					if (this.activeResize) {
						this._changeSizing(e);
					} else {
						var tmp = this._getNewCoords(e);
						if (tmp === false) {
							return;
						}
						dojo.style(this._activeResizeNode, "width", tmp.width
										+ "px");
						dojo.style(this._activeResizeNode, "height", tmp.height
										+ "px");
						this._activeResizeNode.style.display = '';
					}
				},

				_getNewCoords : function(/* Event */e) {

					// On IE, if you move the mouse above/to the left of the
					// object being resized,
					// sometimes clientX/Y aren't set, apparently. Just ignore
					// the event.
					try {
						if (!e.clientX || !e.clientY) {
							return false;
						}
					} catch (e) {
						// sometimes you get an exception accessing above
						// fields...
						return false;
					}
					this._activeResizeLastEvent = e;

					var dx = this.startPoint.x - e.clientX;
					var dy = this.startPoint.y - e.clientY;

					var newW = (this._resizeX)
							? this.startSize.w - dx
							: this.startSize.w;
					var newH = (this._resizeY)
							? this.startSize.h - dy
							: this.startSize.h;

					// minimum size check
					if (this.minSize) {
						// var mb = dojo.marginBox(this.targetDomNode);
						if (newW < this.minSize.w) {
							newW = this.minSize.w;
						}
						if (newH < this.minSize.h) {
							newH = this.minSize.h;
						}
					}
					return {
						width : newW,
						height : newH
					}; // Object
				},

				_changeSizing : function(/* Event */e) {
					// summary: apply sizing information based on information in
					// (e) to attached node
					var tmp = this._getNewCoords(e);
					if (tmp === false) {
						return;
					}

					if (this.targetWidget
							&& typeof this.targetWidget.resize == "function") {
						this.targetWidget.resize({
									w : tmp.width,
									h : tmp.height
								});
					} else {
						if (this.animateSizing) {
							var anim = dojo.fx[this.animateMethod]([
									dojo.animateProperty({
												node : this.targetDomNode,
												properties : {
													width : {
														start : this.startSize.w,
														end : tmp.width,
														unit : 'px'
													}
												},
												duration : this.animateDuration
											}), dojo.animateProperty({
												node : this.targetDomNode,
												properties : {
													height : {
														start : this.startSize.h,
														end : tmp.height,
														unit : 'px'
													}
												},
												duration : this.animateDuration
											})]);
							anim.play();
						} else {
							dojo.style(this.targetDomNode, "width", tmp.width
											+ "px");
							dojo.style(this.targetDomNode, "height", tmp.height
											+ "px");
						}
					}
					e.preventDefault();
				},

				_endSizing : function(/* Event */e) {
					// summary: disconnect listenrs and cleanup sizing
					dojo.forEach(this._connects, function(c) {
								dojo.disconnect(c);
							});
					if (!this.activeResize) {
						dojo.fadeOut({
							node : this._activeResizeNode,
							duration : 250,
							onEnd : dojo.hitch(this, function() {
										this._activeResizeNode.style.display = "none";
									})
						}).play();
						this._changeSizing(e);
					}
					this._isSizing = false;
				}

			});

}