X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..6b044c28b5f26fb99c86c237ffad19741c0f7f3d:/src/widgets/Window.js?ds=sidebyside diff --git a/src/widgets/Window.js b/src/widgets/Window.js index 70eec676..208cd731 100644 --- a/src/widgets/Window.js +++ b/src/widgets/Window.js @@ -1,8 +1,8 @@ /*! - * Ext JS Library 3.0.0 - * Copyright(c) 2006-2009 Ext JS, LLC - * licensing@extjs.com - * http://www.extjs.com/license + * Ext JS Library 3.3.1 + * Copyright(c) 2006-2010 Sencha Inc. + * licensing@sencha.com + * http://www.sencha.com/license */ /** * @class Ext.Window @@ -10,7 +10,7 @@ *
A specialized panel intended for use as an application window. Windows are floated, {@link #resizable}, and * {@link #draggable} by default. Windows can be {@link #maximizable maximized} to fill the viewport, * restored to their prior size, and can be {@link #minimize}d.
- *Windows can also be linked to a {@link Ext.WindowGroup} or managed by the {@link Ext.WindowMgr} to provide + *
Windows can also be linked to a {@link Ext.WindowGroup} or managed by the {@link Ext.WindowMgr} to provide * grouping, activation, to front, to back and other application-specific behavior.
*By default, Windows will be rendered to document.body. To {@link #constrain} a Window to another element * specify {@link Ext.Component#renderTo renderTo}.
@@ -50,8 +50,13 @@ Ext.Window = Ext.extend(Ext.Panel, { * A reference to the WindowGroup that should manage this window (defaults to {@link Ext.WindowMgr}). */ /** - * @cfg {String/Number/Button} defaultButton - * The id / index of a button or a button instance to focus when this window received the focus. + * @cfg {String/Number/Component} defaultButton + *Specifies a Component to receive focus when this Window is focussed.
+ *This may be one of:
If this Window is configured {@link #draggable}, this property will contain + * an instance of {@link Ext.dd.DD} which handles dragging the Window's DOM Element.
+ *This has implementations of startDrag
, onDrag
and endDrag
+ * which perform the dragging action. If extra logic is needed at these points, use
+ * {@link Function#createInterceptor createInterceptor} or {@link Function#createSequence createSequence} to
+ * augment the existing implementations.
this
reference) in which the callback is executed. Defaults to this Window.
* @return {Ext.Window} this
*/
show : function(animateTarget, cb, scope){
@@ -496,7 +536,7 @@ Ext.Window = Ext.extend(Ext.Panel, {
this.on('show', cb, scope, {single:true});
}
this.hidden = false;
- if(animateTarget !== undefined){
+ if(Ext.isDefined(animateTarget)){
this.setAnimateTarget(animateTarget);
}
this.beforeShow();
@@ -510,13 +550,16 @@ Ext.Window = Ext.extend(Ext.Panel, {
// private
afterShow : function(isAnim){
+ if (this.isDestroyed){
+ return false;
+ }
this.proxy.hide();
this.el.setStyle('display', 'block');
this.el.show();
if(this.maximized){
this.fitContainer();
}
- if(Ext.isMac && Ext.isGecko){ // work around stupid FF 2.0/Mac scroll bar bug
+ if(Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
this.cascade(this.setAutoScroll);
}
@@ -534,6 +577,7 @@ Ext.Window = Ext.extend(Ext.Panel, {
var sz = this.getSize();
this.onResize(sz.width, sz.height);
}
+ this.onShow();
this.fireEvent('show', this);
},
@@ -542,15 +586,15 @@ Ext.Window = Ext.extend(Ext.Panel, {
this.proxy.show();
this.proxy.setBox(this.animateTarget.getBox());
this.proxy.setOpacity(0);
- var b = this.getBox(false);
- b.callback = this.afterShow.createDelegate(this, [true], false);
- b.scope = this;
- b.duration = 0.25;
- b.easing = 'easeNone';
- b.opacity = 0.5;
- b.block = true;
+ var b = this.getBox();
this.el.setStyle('display', 'none');
- this.proxy.shift(b);
+ this.proxy.shift(Ext.apply(b, {
+ callback: this.afterShow.createDelegate(this, [true], false),
+ scope: this,
+ easing: 'easeNone',
+ duration: this.showAnimDuration,
+ opacity: 0.5
+ }));
},
/**
@@ -558,7 +602,7 @@ Ext.Window = Ext.extend(Ext.Panel, {
* @param {String/Element} animateTarget (optional) The target element or id to which the window should
* animate while hiding (defaults to null with no animation)
* @param {Function} callback (optional) A callback function to call after the window is hidden
- * @param {Object} scope (optional) The scope in which to execute the callback
+ * @param {Object} scope (optional) The scope (this
reference) in which the callback is executed. Defaults to this Window.
* @return {Ext.Window} this
*/
hide : function(animateTarget, cb, scope){
@@ -594,6 +638,7 @@ Ext.Window = Ext.extend(Ext.Panel, {
if(this.keyMap){
this.keyMap.disable();
}
+ this.onHide();
this.fireEvent('hide', this);
},
@@ -604,16 +649,27 @@ Ext.Window = Ext.extend(Ext.Panel, {
var tb = this.getBox(false);
this.proxy.setBox(tb);
this.el.hide();
- var b = this.animateTarget.getBox();
- b.callback = this.afterHide;
- b.scope = this;
- b.duration = 0.25;
- b.easing = 'easeNone';
- b.block = true;
- b.opacity = 0;
- this.proxy.shift(b);
+ this.proxy.shift(Ext.apply(this.animateTarget.getBox(), {
+ callback: this.afterHide,
+ scope: this,
+ duration: this.hideAnimDuration,
+ easing: 'easeNone',
+ opacity: 0
+ }));
},
+ /**
+ * Method that is called immediately before the show
event is fired.
+ * Defaults to Ext.emptyFn
.
+ */
+ onShow : Ext.emptyFn,
+
+ /**
+ * Method that is called immediately before the hide
event is fired.
+ * Defaults to Ext.emptyFn
.
+ */
+ onHide : Ext.emptyFn,
+
// private
onWindowResize : function(){
if(this.maximized){
@@ -670,8 +726,8 @@ Ext.Window = Ext.extend(Ext.Panel, {
}
if(show !== false){
this.el.show();
- this.focus();
- if(Ext.isMac && Ext.isGecko){ // work around stupid FF 2.0/Mac scroll bar bug
+ this.focus.defer(10, this);
+ if(Ext.isMac && Ext.isGecko2){ // work around stupid FF 2.0/Mac scroll bar bug
this.cascade(this.setAutoScroll);
}
}
@@ -704,13 +760,20 @@ Ext.Window = Ext.extend(Ext.Panel, {
*/
close : function(){
if(this.fireEvent('beforeclose', this) !== false){
- this.hide(null, function(){
- this.fireEvent('close', this);
- this.destroy();
- }, this);
+ if(this.hidden){
+ this.doClose();
+ }else{
+ this.hide(null, this.doClose, this);
+ }
}
},
+ // private
+ doClose : function(){
+ this.fireEvent('close', this);
+ this.destroy();
+ },
+
/**
* Fits the window within its current container and automatically replaces
* the {@link #maximizable 'maximize' tool button} with the 'restore' tool button.
@@ -754,9 +817,14 @@ Ext.Window = Ext.extend(Ext.Panel, {
*/
restore : function(){
if(this.maximized){
+ var t = this.tools;
this.el.removeClass('x-window-maximized');
- this.tools.restore.hide();
- this.tools.maximize.show();
+ if(t.restore){
+ t.restore.hide();
+ }
+ if(t.maximize){
+ t.maximize.show();
+ }
this.setPosition(this.restorePos[0], this.restorePos[1]);
this.setSize(this.restoreSize.width, this.restoreSize.height);
delete this.restorePos;
@@ -767,8 +835,8 @@ Ext.Window = Ext.extend(Ext.Panel, {
if(this.dd){
this.dd.unlock();
}
- if(this.collapsible){
- this.tools.toggle.show();
+ if(this.collapsible && t.toggle){
+ t.toggle.show();
}
this.container.removeClass('x-window-maximized-ct');
@@ -789,7 +857,7 @@ Ext.Window = Ext.extend(Ext.Panel, {
// private
fitContainer : function(){
- var vs = this.container.getViewSize();
+ var vs = this.container.getViewSize(false);
this.setSize(vs.width, vs.height);
},
@@ -812,7 +880,7 @@ Ext.Window = Ext.extend(Ext.Panel, {
/**
* Aligns the window to the specified element
* @param {Mixed} element The element to align to.
- * @param {String} position The position to align to (see {@link Ext.Element#alignTo} for more details).
+ * @param {String} position (optional, defaults to "tl-bl?") The position to align to (see {@link Ext.Element#alignTo} for more details).
* @param {Array} offsets (optional) Offset the positioning by [x, y]
* @return {Ext.Window} this
*/
@@ -832,22 +900,44 @@ Ext.Window = Ext.extend(Ext.Panel, {
* @return {Ext.Window} this
*/
anchorTo : function(el, alignment, offsets, monitorScroll){
- if(this.doAnchor){
- Ext.EventManager.removeResizeListener(this.doAnchor, this);
- Ext.EventManager.un(window, 'scroll', this.doAnchor, this);
- }
- this.doAnchor = function(){
- this.alignTo(el, alignment, offsets);
- };
- Ext.EventManager.onWindowResize(this.doAnchor, this);
-
- var tm = typeof monitorScroll;
- if(tm != 'undefined'){
- Ext.EventManager.on(window, 'scroll', this.doAnchor, this,
- {buffer: tm == 'number' ? monitorScroll : 50});
- }
- this.doAnchor();
- return this;
+ this.clearAnchor();
+ this.anchorTarget = {
+ el: el,
+ alignment: alignment,
+ offsets: offsets
+ };
+
+ Ext.EventManager.onWindowResize(this.doAnchor, this);
+ var tm = typeof monitorScroll;
+ if(tm != 'undefined'){
+ Ext.EventManager.on(window, 'scroll', this.doAnchor, this,
+ {buffer: tm == 'number' ? monitorScroll : 50});
+ }
+ return this.doAnchor();
+ },
+
+ /**
+ * Performs the anchor, using the saved anchorTarget property.
+ * @return {Ext.Window} this
+ * @private
+ */
+ doAnchor : function(){
+ var o = this.anchorTarget;
+ this.alignTo(o.el, o.alignment, o.offsets);
+ return this;
+ },
+
+ /**
+ * Removes any existing anchor from this window. See {@link #anchorTo}.
+ * @return {Ext.Window} this
+ */
+ clearAnchor : function(){
+ if(this.anchorTarget){
+ Ext.EventManager.removeResizeListener(this.doAnchor, this);
+ Ext.EventManager.un(window, 'scroll', this.doAnchor, this);
+ delete this.anchorTarget;
+ }
+ return this;
},
/**
@@ -866,7 +956,8 @@ Ext.Window = Ext.extend(Ext.Panel, {
/**
* Makes this the active window by showing its shadow, or deactivates it by hiding its shadow. This method also
- * fires the {@link #activate} or {@link #deactivate} event depending on which action occurred.
+ * fires the {@link #activate} or {@link #deactivate} event depending on which action occurred. This method is
+ * called internally by {@link Ext.WindowMgr}.
* @param {Boolean} active True to activate the window, false to deactivate it (defaults to false)
*/
setActive : function(active){
@@ -907,19 +998,20 @@ Ext.Window = Ext.extend(Ext.Panel, {
Ext.reg('window', Ext.Window);
// private - custom Window DD implementation
-Ext.Window.DD = function(win){
- this.win = win;
- Ext.Window.DD.superclass.constructor.call(this, win.el.id, 'WindowDD-'+win.id);
- this.setHandleElId(win.header.id);
- this.scroll = false;
-};
-
-Ext.extend(Ext.Window.DD, Ext.dd.DD, {
+Ext.Window.DD = Ext.extend(Ext.dd.DD, {
+
+ constructor : function(win){
+ this.win = win;
+ Ext.Window.DD.superclass.constructor.call(this, win.el.id, 'WindowDD-'+win.id);
+ this.setHandleElId(win.header.id);
+ this.scroll = false;
+ },
+
moveOnly:true,
headerOffsets:[100, 25],
startDrag : function(){
var w = this.win;
- this.proxy = w.ghost();
+ this.proxy = w.ghost(w.initialConfig.cls);
if(w.constrain !== false){
var so = w.el.shadowOffset;
this.constrainTo(w.container, {right: so, left: so, bottom: so});