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.
Utility class for generating different styles of message boxes. The alias Ext.Msg can also be used.
- *Note that the MessageBox is asynchronous. Unlike a regular JavaScript alert (which will halt
- * browser execution), showing a MessageBox will not cause the code to stop. For this reason, if you have code
- * that should only run after some user feedback from the MessageBox, you must use a callback function
- * (see the function parameter for {@link #show} for more details).
Example usage:
- *
-// Basic alert:
-Ext.Msg.alert('Status', 'Changes saved successfully.');
-
-// Prompt for user data and process the result using a callback:
-Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text){
- if (btn == 'ok'){
- // process text value and close...
- }
-});
-
-// Show a dialog using config options:
-Ext.Msg.show({
- title:'Save Changes?',
- msg: 'You are closing a tab that has unsaved changes. Would you like to save your changes?',
- buttons: Ext.Msg.YESNOCANCEL,
- fn: processResult,
- animEl: 'elId',
- icon: Ext.MessageBox.QUESTION
-});
-Progress and wait dialogs will ignore this option since they do not respond to user - * actions and can only be closed programmatically, so any required function should be called - * by the same code after it closes the dialog. Parameters passed:
-Ext.Msg.show({
- title: 'Address',
- msg: 'Please enter your address:',
- width: 300,
- buttons: Ext.MessageBox.OKCANCEL,
- multiline: true,
- fn: saveAddress,
- animEl: 'addAddressBtn',
- icon: Ext.MessageBox.INFO
-});
--Ext.MessageBox.INFO -Ext.MessageBox.WARNING -Ext.MessageBox.QUESTION -Ext.MessageBox.ERROR - *- * @param {String} icon A CSS classname specifying the icon's background image url, or empty string to clear the icon - * @return {Ext.MessageBox} this - */ - setIcon : function(icon){ - if(!dlg){ - bufferIcon = icon; - return; - } - bufferIcon = undefined; - if(icon && icon != ''){ - iconEl.removeClass('x-hidden'); - iconEl.replaceClass(iconCls, icon); - bodyEl.addClass('x-dlg-icon'); - iconCls = icon; - }else{ - iconEl.replaceClass(iconCls, 'x-hidden'); - bodyEl.removeClass('x-dlg-icon'); - iconCls = ''; - } - return this; - }, - - /** - * Displays a message box with a progress bar. This message box has no buttons and is not closeable by - * the user. You are responsible for updating the progress bar as needed via {@link Ext.MessageBox#updateProgress} - * and closing the message box when the process is complete. - * @param {String} title The title bar text - * @param {String} msg The message box body text - * @param {String} progressText (optional) The text to display inside the progress bar (defaults to '') - * @return {Ext.MessageBox} this - */ - progress : function(title, msg, progressText){ - this.show({ - title : title, - msg : msg, - buttons: false, - progress:true, - closable:false, - minWidth: this.minProgressWidth, - progressText: progressText - }); - return this; - }, - - /** - * Displays a message box with an infinitely auto-updating progress bar. This can be used to block user - * interaction while waiting for a long-running process to complete that does not have defined intervals. - * You are responsible for closing the message box when the process is complete. - * @param {String} msg The message box body text - * @param {String} title (optional) The title bar text - * @param {Object} config (optional) A {@link Ext.ProgressBar#waitConfig} object - * @return {Ext.MessageBox} this - */ - wait : function(msg, title, config){ - this.show({ - title : title, - msg : msg, - buttons: false, - closable:false, - wait:true, - modal:true, - minWidth: this.minProgressWidth, - waitConfig: config - }); - return this; - }, - - /** - * Displays a standard read-only message box with an OK button (comparable to the basic JavaScript alert prompt). - * If a callback function is passed it will be called after the user clicks the button, and the - * id of the button that was clicked will be passed as the only parameter to the callback - * (could also be the top-right close button). - * @param {String} title The title bar text - * @param {String} msg The message box body text - * @param {Function} fn (optional) The callback function invoked after the message box is closed - * @param {Object} scope (optional) The scope (
this reference) in which the callback is executed. Defaults to the browser wnidow.
- * @return {Ext.MessageBox} this
- */
- alert : function(title, msg, fn, scope){
- this.show({
- title : title,
- msg : msg,
- buttons: this.OK,
- fn: fn,
- scope : scope
- });
- return this;
- },
-
- /**
- * Displays a confirmation message box with Yes and No buttons (comparable to JavaScript's confirm).
- * If a callback function is passed it will be called after the user clicks either button,
- * and the id of the button that was clicked will be passed as the only parameter to the callback
- * (could also be the top-right close button).
- * @param {String} title The title bar text
- * @param {String} msg The message box body text
- * @param {Function} fn (optional) The callback function invoked after the message box is closed
- * @param {Object} scope (optional) The scope (this reference) in which the callback is executed. Defaults to the browser wnidow.
- * @return {Ext.MessageBox} this
- */
- confirm : function(title, msg, fn, scope){
- this.show({
- title : title,
- msg : msg,
- buttons: this.YESNO,
- fn: fn,
- scope : scope,
- icon: this.QUESTION
- });
- return this;
- },
-
- /**
- * Displays a message box with OK and Cancel buttons prompting the user to enter some text (comparable to JavaScript's prompt).
- * The prompt can be a single-line or multi-line textbox. If a callback function is passed it will be called after the user
- * clicks either button, and the id of the button that was clicked (could also be the top-right
- * close button) and the text that was entered will be passed as the two parameters to the callback.
- * @param {String} title The title bar text
- * @param {String} msg The message box body text
- * @param {Function} fn (optional) The callback function invoked after the message box is closed
- * @param {Object} scope (optional) The scope (this reference) in which the callback is executed. Defaults to the browser wnidow.
- * @param {Boolean/Number} multiline (optional) True to create a multiline textbox using the defaultTextHeight
- * property, or the height in pixels to create the textbox (defaults to false / single-line)
- * @param {String} value (optional) Default value of the text input element (defaults to '')
- * @return {Ext.MessageBox} this
- */
- prompt : function(title, msg, fn, scope, multiline, value){
- this.show({
- title : title,
- msg : msg,
- buttons: this.OKCANCEL,
- fn: fn,
- minWidth:250,
- scope : scope,
- prompt:true,
- multiline: multiline,
- value: value
- });
- return this;
- },
-
- /**
- * Button config that displays a single OK button
- * @type Object
- */
- OK : {ok:true},
- /**
- * Button config that displays a single Cancel button
- * @type Object
- */
- CANCEL : {cancel:true},
- /**
- * Button config that displays OK and Cancel buttons
- * @type Object
- */
- OKCANCEL : {ok:true, cancel:true},
- /**
- * Button config that displays Yes and No buttons
- * @type Object
- */
- YESNO : {yes:true, no:true},
- /**
- * Button config that displays Yes, No and Cancel buttons
- * @type Object
- */
- YESNOCANCEL : {yes:true, no:true, cancel:true},
- /**
- * The CSS class that provides the INFO icon image
- * @type String
- */
- INFO : 'ext-mb-info',
- /**
- * The CSS class that provides the WARNING icon image
- * @type String
- */
- WARNING : 'ext-mb-warning',
- /**
- * The CSS class that provides the QUESTION icon image
- * @type String
- */
- QUESTION : 'ext-mb-question',
- /**
- * The CSS class that provides the ERROR icon image
- * @type String
- */
- ERROR : 'ext-mb-error',
-
- /**
- * The default height in pixels of the message box's multiline textarea if displayed (defaults to 75)
- * @type Number
- */
- defaultTextHeight : 75,
- /**
- * The maximum width in pixels of the message box (defaults to 600)
- * @type Number
- */
- maxWidth : 600,
- /**
- * The minimum width in pixels of the message box (defaults to 100)
- * @type Number
- */
- minWidth : 100,
- /**
- * The minimum width in pixels of the message box if it is a progress-style dialog. This is useful
- * for setting a different minimum width than text-only dialogs may need (defaults to 250)
- * @type Number
- */
- minProgressWidth : 250,
- /**
- * An object containing the default button text strings that can be overriden for localized language support.
- * Supported properties are: ok, cancel, yes and no. Generally you should include a locale-specific
- * resource file for handling language support across the framework.
- * Customize the default text like so: Ext.MessageBox.buttonText.yes = "oui"; //french
- * @type Object
- */
- buttonText : {
- ok : "OK",
- cancel : "Cancel",
- yes : "Yes",
- no : "No"
- }
- };
-}();
-
-/**
- * Shorthand for {@link Ext.MessageBox}
- */
-Ext.Msg = Ext.MessageBox;/**
- * @class Ext.dd.PanelProxy
- * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally
- * for the Panel's drag drop implementation, and should never need to be created directly.
- * @constructor
- * @param panel The {@link Ext.Panel} to proxy for
- * @param config Configuration options
- */
-Ext.dd.PanelProxy = function(panel, config){
- this.panel = panel;
- this.id = this.panel.id +'-ddproxy';
- Ext.apply(this, config);
-};
-
-Ext.dd.PanelProxy.prototype = {
- /**
- * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
- * false to drag with no proxy (defaults to true).
- */
- insertProxy : true,
-
- // private overrides
- setStatus : Ext.emptyFn,
- reset : Ext.emptyFn,
- update : Ext.emptyFn,
- stop : Ext.emptyFn,
- sync: Ext.emptyFn,
-
- /**
- * Gets the proxy's element
- * @return {Element} The proxy's element
- */
- getEl : function(){
- return this.ghost;
- },
-
- /**
- * Gets the proxy's ghost element
- * @return {Element} The proxy's ghost element
- */
- getGhost : function(){
- return this.ghost;
- },
-
- /**
- * Gets the proxy's element
- * @return {Element} The proxy's element
- */
- getProxy : function(){
- return this.proxy;
- },
-
- /**
- * Hides the proxy
- */
- hide : function(){
- if(this.ghost){
- if(this.proxy){
- this.proxy.remove();
- delete this.proxy;
- }
- this.panel.el.dom.style.display = '';
- this.ghost.remove();
- delete this.ghost;
- }
- },
-
- /**
- * Shows the proxy
- */
- show : function(){
- if(!this.ghost){
- this.ghost = this.panel.createGhost(undefined, undefined, Ext.getBody());
- this.ghost.setXY(this.panel.el.getXY())
- if(this.insertProxy){
- this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
- this.proxy.setSize(this.panel.getSize());
- }
- this.panel.el.dom.style.display = 'none';
- }
- },
-
- // private
- repair : function(xy, callback, scope){
- this.hide();
- if(typeof callback == "function"){
- callback.call(scope || this);
- }
- },
-
- /**
- * Moves the proxy to a different position in the DOM. This is typically called while dragging the Panel
- * to keep the proxy sync'd to the Panel's location.
- * @param {HTMLElement} parentNode The proxy's parent DOM node
- * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
- * to the parent's last child if not specified)
- */
- moveProxy : function(parentNode, before){
- if(this.proxy){
- parentNode.insertBefore(this.proxy.dom, before);
- }
- }
-};
-
-// private - DD implementation for Panels
-Ext.Panel.DD = function(panel, cfg){
- this.panel = panel;
- this.dragData = {panel: panel};
- this.proxy = new Ext.dd.PanelProxy(panel, cfg);
- Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
- var h = panel.header;
- if(h){
- this.setHandleElId(h.id);
- }
- (h ? h : this.panel.body).setStyle('cursor', 'move');
- this.scroll = false;
-};
-
-Ext.extend(Ext.Panel.DD, Ext.dd.DragSource, {
- showFrame: Ext.emptyFn,
- startDrag: Ext.emptyFn,
- b4StartDrag: function(x, y) {
- this.proxy.show();
- },
- b4MouseDown: function(e) {
- var x = e.getPageX();
- var y = e.getPageY();
- this.autoOffset(x, y);
- },
- onInitDrag : function(x, y){
- this.onStartDrag(x, y);
- return true;
- },
- createFrame : Ext.emptyFn,
- getDragEl : function(e){
- return this.proxy.ghost.dom;
- },
- endDrag : function(e){
- this.proxy.hide();
- this.panel.saveState();
- },
-
- autoOffset : function(x, y) {
- x -= this.startPageX;
- y -= this.startPageY;
- this.setDelta(x, y);
- }
+Ext.WindowMgr = new Ext.WindowGroup();/**
+ * @class Ext.MessageBox
+ * Utility class for generating different styles of message boxes. The alias Ext.Msg can also be used.
+ *Note that the MessageBox is asynchronous. Unlike a regular JavaScript alert (which will halt
+ * browser execution), showing a MessageBox will not cause the code to stop. For this reason, if you have code
+ * that should only run after some user feedback from the MessageBox, you must use a callback function
+ * (see the function parameter for {@link #show} for more details).
Example usage:
+ *
+// Basic alert:
+Ext.Msg.alert('Status', 'Changes saved successfully.');
+
+// Prompt for user data and process the result using a callback:
+Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text){
+ if (btn == 'ok'){
+ // process text value and close...
+ }
+});
+
+// Show a dialog using config options:
+Ext.Msg.show({
+ title:'Save Changes?',
+ msg: 'You are closing a tab that has unsaved changes. Would you like to save your changes?',
+ buttons: Ext.Msg.YESNOCANCEL,
+ fn: processResult,
+ animEl: 'elId',
+ icon: Ext.MessageBox.QUESTION
+});
+Progress and wait dialogs will ignore this option since they do not respond to user + * actions and can only be closed programmatically, so any required function should be called + * by the same code after it closes the dialog. Parameters passed:
+Ext.Msg.show({
+ title: 'Address',
+ msg: 'Please enter your address:',
+ width: 300,
+ buttons: Ext.MessageBox.OKCANCEL,
+ multiline: true,
+ fn: saveAddress,
+ animEl: 'addAddressBtn',
+ icon: Ext.MessageBox.INFO
+});
++Ext.MessageBox.INFO +Ext.MessageBox.WARNING +Ext.MessageBox.QUESTION +Ext.MessageBox.ERROR + *+ * @param {String} icon A CSS classname specifying the icon's background image url, or empty string to clear the icon + * @return {Ext.MessageBox} this + */ + setIcon : function(icon){ + if(!dlg){ + bufferIcon = icon; + return; + } + bufferIcon = undefined; + if(icon && icon != ''){ + iconEl.removeClass('x-hidden'); + iconEl.replaceClass(iconCls, icon); + bodyEl.addClass('x-dlg-icon'); + iconCls = icon; + }else{ + iconEl.replaceClass(iconCls, 'x-hidden'); + bodyEl.removeClass('x-dlg-icon'); + iconCls = ''; + } + return this; + }, + + /** + * Displays a message box with a progress bar. This message box has no buttons and is not closeable by + * the user. You are responsible for updating the progress bar as needed via {@link Ext.MessageBox#updateProgress} + * and closing the message box when the process is complete. + * @param {String} title The title bar text + * @param {String} msg The message box body text + * @param {String} progressText (optional) The text to display inside the progress bar (defaults to '') + * @return {Ext.MessageBox} this + */ + progress : function(title, msg, progressText){ + this.show({ + title : title, + msg : msg, + buttons: false, + progress:true, + closable:false, + minWidth: this.minProgressWidth, + progressText: progressText + }); + return this; + }, + + /** + * Displays a message box with an infinitely auto-updating progress bar. This can be used to block user + * interaction while waiting for a long-running process to complete that does not have defined intervals. + * You are responsible for closing the message box when the process is complete. + * @param {String} msg The message box body text + * @param {String} title (optional) The title bar text + * @param {Object} config (optional) A {@link Ext.ProgressBar#waitConfig} object + * @return {Ext.MessageBox} this + */ + wait : function(msg, title, config){ + this.show({ + title : title, + msg : msg, + buttons: false, + closable:false, + wait:true, + modal:true, + minWidth: this.minProgressWidth, + waitConfig: config + }); + return this; + }, + + /** + * Displays a standard read-only message box with an OK button (comparable to the basic JavaScript alert prompt). + * If a callback function is passed it will be called after the user clicks the button, and the + * id of the button that was clicked will be passed as the only parameter to the callback + * (could also be the top-right close button). + * @param {String} title The title bar text + * @param {String} msg The message box body text + * @param {Function} fn (optional) The callback function invoked after the message box is closed + * @param {Object} scope (optional) The scope (
this reference) in which the callback is executed. Defaults to the browser wnidow.
+ * @return {Ext.MessageBox} this
+ */
+ alert : function(title, msg, fn, scope){
+ this.show({
+ title : title,
+ msg : msg,
+ buttons: this.OK,
+ fn: fn,
+ scope : scope,
+ minWidth: this.minWidth
+ });
+ return this;
+ },
+
+ /**
+ * Displays a confirmation message box with Yes and No buttons (comparable to JavaScript's confirm).
+ * If a callback function is passed it will be called after the user clicks either button,
+ * and the id of the button that was clicked will be passed as the only parameter to the callback
+ * (could also be the top-right close button).
+ * @param {String} title The title bar text
+ * @param {String} msg The message box body text
+ * @param {Function} fn (optional) The callback function invoked after the message box is closed
+ * @param {Object} scope (optional) The scope (this reference) in which the callback is executed. Defaults to the browser wnidow.
+ * @return {Ext.MessageBox} this
+ */
+ confirm : function(title, msg, fn, scope){
+ this.show({
+ title : title,
+ msg : msg,
+ buttons: this.YESNO,
+ fn: fn,
+ scope : scope,
+ icon: this.QUESTION,
+ minWidth: this.minWidth
+ });
+ return this;
+ },
+
+ /**
+ * Displays a message box with OK and Cancel buttons prompting the user to enter some text (comparable to JavaScript's prompt).
+ * The prompt can be a single-line or multi-line textbox. If a callback function is passed it will be called after the user
+ * clicks either button, and the id of the button that was clicked (could also be the top-right
+ * close button) and the text that was entered will be passed as the two parameters to the callback.
+ * @param {String} title The title bar text
+ * @param {String} msg The message box body text
+ * @param {Function} fn (optional) The callback function invoked after the message box is closed
+ * @param {Object} scope (optional) The scope (this reference) in which the callback is executed. Defaults to the browser wnidow.
+ * @param {Boolean/Number} multiline (optional) True to create a multiline textbox using the defaultTextHeight
+ * property, or the height in pixels to create the textbox (defaults to false / single-line)
+ * @param {String} value (optional) Default value of the text input element (defaults to '')
+ * @return {Ext.MessageBox} this
+ */
+ prompt : function(title, msg, fn, scope, multiline, value){
+ this.show({
+ title : title,
+ msg : msg,
+ buttons: this.OKCANCEL,
+ fn: fn,
+ minWidth: this.minPromptWidth,
+ scope : scope,
+ prompt:true,
+ multiline: multiline,
+ value: value
+ });
+ return this;
+ },
+
+ /**
+ * Button config that displays a single OK button
+ * @type Object
+ */
+ OK : {ok:true},
+ /**
+ * Button config that displays a single Cancel button
+ * @type Object
+ */
+ CANCEL : {cancel:true},
+ /**
+ * Button config that displays OK and Cancel buttons
+ * @type Object
+ */
+ OKCANCEL : {ok:true, cancel:true},
+ /**
+ * Button config that displays Yes and No buttons
+ * @type Object
+ */
+ YESNO : {yes:true, no:true},
+ /**
+ * Button config that displays Yes, No and Cancel buttons
+ * @type Object
+ */
+ YESNOCANCEL : {yes:true, no:true, cancel:true},
+ /**
+ * The CSS class that provides the INFO icon image
+ * @type String
+ */
+ INFO : 'ext-mb-info',
+ /**
+ * The CSS class that provides the WARNING icon image
+ * @type String
+ */
+ WARNING : 'ext-mb-warning',
+ /**
+ * The CSS class that provides the QUESTION icon image
+ * @type String
+ */
+ QUESTION : 'ext-mb-question',
+ /**
+ * The CSS class that provides the ERROR icon image
+ * @type String
+ */
+ ERROR : 'ext-mb-error',
+
+ /**
+ * The default height in pixels of the message box's multiline textarea if displayed (defaults to 75)
+ * @type Number
+ */
+ defaultTextHeight : 75,
+ /**
+ * The maximum width in pixels of the message box (defaults to 600)
+ * @type Number
+ */
+ maxWidth : 600,
+ /**
+ * The minimum width in pixels of the message box (defaults to 100)
+ * @type Number
+ */
+ minWidth : 100,
+ /**
+ * The minimum width in pixels of the message box if it is a progress-style dialog. This is useful
+ * for setting a different minimum width than text-only dialogs may need (defaults to 250).
+ * @type Number
+ */
+ minProgressWidth : 250,
+ /**
+ * The minimum width in pixels of the message box if it is a prompt dialog. This is useful
+ * for setting a different minimum width than text-only dialogs may need (defaults to 250).
+ * @type Number
+ */
+ minPromptWidth: 250,
+ /**
+ * An object containing the default button text strings that can be overriden for localized language support.
+ * Supported properties are: ok, cancel, yes and no. Generally you should include a locale-specific
+ * resource file for handling language support across the framework.
+ * Customize the default text like so: Ext.MessageBox.buttonText.yes = "oui"; //french
+ * @type Object
+ */
+ buttonText : {
+ ok : "OK",
+ cancel : "Cancel",
+ yes : "Yes",
+ no : "No"
+ }
+ };
+}();
+
+/**
+ * Shorthand for {@link Ext.MessageBox}
+ */
+Ext.Msg = Ext.MessageBox;/**
+ * @class Ext.dd.PanelProxy
+ * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally
+ * for the Panel's drag drop implementation, and should never need to be created directly.
+ * @constructor
+ * @param panel The {@link Ext.Panel} to proxy for
+ * @param config Configuration options
+ */
+Ext.dd.PanelProxy = Ext.extend(Object, {
+
+ constructor : function(panel, config){
+ this.panel = panel;
+ this.id = this.panel.id +'-ddproxy';
+ Ext.apply(this, config);
+ },
+
+ /**
+ * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
+ * false to drag with no proxy (defaults to true).
+ */
+ insertProxy : true,
+
+ // private overrides
+ setStatus : Ext.emptyFn,
+ reset : Ext.emptyFn,
+ update : Ext.emptyFn,
+ stop : Ext.emptyFn,
+ sync: Ext.emptyFn,
+
+ /**
+ * Gets the proxy's element
+ * @return {Element} The proxy's element
+ */
+ getEl : function(){
+ return this.ghost;
+ },
+
+ /**
+ * Gets the proxy's ghost element
+ * @return {Element} The proxy's ghost element
+ */
+ getGhost : function(){
+ return this.ghost;
+ },
+
+ /**
+ * Gets the proxy's element
+ * @return {Element} The proxy's element
+ */
+ getProxy : function(){
+ return this.proxy;
+ },
+
+ /**
+ * Hides the proxy
+ */
+ hide : function(){
+ if(this.ghost){
+ if(this.proxy){
+ this.proxy.remove();
+ delete this.proxy;
+ }
+ this.panel.el.dom.style.display = '';
+ this.ghost.remove();
+ delete this.ghost;
+ }
+ },
+
+ /**
+ * Shows the proxy
+ */
+ show : function(){
+ if(!this.ghost){
+ this.ghost = this.panel.createGhost(this.panel.initialConfig.cls, undefined, Ext.getBody());
+ this.ghost.setXY(this.panel.el.getXY());
+ if(this.insertProxy){
+ this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
+ this.proxy.setSize(this.panel.getSize());
+ }
+ this.panel.el.dom.style.display = 'none';
+ }
+ },
+
+ // private
+ repair : function(xy, callback, scope){
+ this.hide();
+ if(typeof callback == "function"){
+ callback.call(scope || this);
+ }
+ },
+
+ /**
+ * Moves the proxy to a different position in the DOM. This is typically called while dragging the Panel
+ * to keep the proxy sync'd to the Panel's location.
+ * @param {HTMLElement} parentNode The proxy's parent DOM node
+ * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
+ * to the parent's last child if not specified)
+ */
+ moveProxy : function(parentNode, before){
+ if(this.proxy){
+ parentNode.insertBefore(this.proxy.dom, before);
+ }
+ }
+});
+
+// private - DD implementation for Panels
+Ext.Panel.DD = Ext.extend(Ext.dd.DragSource, {
+
+ constructor : function(panel, cfg){
+ this.panel = panel;
+ this.dragData = {panel: panel};
+ this.proxy = new Ext.dd.PanelProxy(panel, cfg);
+ Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
+ var h = panel.header,
+ el = panel.body;
+ if(h){
+ this.setHandleElId(h.id);
+ el = panel.header;
+ }
+ el.setStyle('cursor', 'move');
+ this.scroll = false;
+ },
+
+ showFrame: Ext.emptyFn,
+ startDrag: Ext.emptyFn,
+ b4StartDrag: function(x, y) {
+ this.proxy.show();
+ },
+ b4MouseDown: function(e) {
+ var x = e.getPageX(),
+ y = e.getPageY();
+ this.autoOffset(x, y);
+ },
+ onInitDrag : function(x, y){
+ this.onStartDrag(x, y);
+ return true;
+ },
+ createFrame : Ext.emptyFn,
+ getDragEl : function(e){
+ return this.proxy.ghost.dom;
+ },
+ endDrag : function(e){
+ this.proxy.hide();
+ this.panel.saveState();
+ },
+
+ autoOffset : function(x, y) {
+ x -= this.startPageX;
+ y -= this.startPageY;
+ this.setDelta(x, y);
+ }
});
\ No newline at end of file