Upgrade to ExtJS 3.3.1 - Released 11/30/2010
[extjs.git] / docs / source / PanelDD.html
index 8fab00e..3334447 100644 (file)
-<html>\r
-<head>\r
-  <title>The source code</title>\r
-    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
-    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body  onload="prettyPrint();">\r
-    <pre class="prettyprint lang-js"><div id="cls-Ext.dd.PanelProxy"></div>/**\r
- * @class Ext.dd.PanelProxy\r
- * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally\r
- * for the Panel's drag drop implementation, and should never need to be created directly.\r
- * @constructor\r
- * @param panel The {@link Ext.Panel} to proxy for\r
- * @param config Configuration options\r
- */\r
-Ext.dd.PanelProxy = function(panel, config){\r
-    this.panel = panel;\r
-    this.id = this.panel.id +'-ddproxy';\r
-    Ext.apply(this, config);\r
-};\r
-\r
-Ext.dd.PanelProxy.prototype = {\r
-    <div id="cfg-Ext.dd.PanelProxy-insertProxy"></div>/**\r
-     * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,\r
-     * false to drag with no proxy (defaults to true).\r
-     */\r
-    insertProxy : true,\r
-\r
-    // private overrides\r
-    setStatus : Ext.emptyFn,\r
-    reset : Ext.emptyFn,\r
-    update : Ext.emptyFn,\r
-    stop : Ext.emptyFn,\r
-    sync: Ext.emptyFn,\r
-\r
-    <div id="method-Ext.dd.PanelProxy-getEl"></div>/**\r
-     * Gets the proxy's element\r
-     * @return {Element} The proxy's element\r
-     */\r
-    getEl : function(){\r
-        return this.ghost;\r
-    },\r
-\r
-    <div id="method-Ext.dd.PanelProxy-getGhost"></div>/**\r
-     * Gets the proxy's ghost element\r
-     * @return {Element} The proxy's ghost element\r
-     */\r
-    getGhost : function(){\r
-        return this.ghost;\r
-    },\r
-\r
-    <div id="method-Ext.dd.PanelProxy-getProxy"></div>/**\r
-     * Gets the proxy's element\r
-     * @return {Element} The proxy's element\r
-     */\r
-    getProxy : function(){\r
-        return this.proxy;\r
-    },\r
-\r
-    <div id="method-Ext.dd.PanelProxy-hide"></div>/**\r
-     * Hides the proxy\r
-     */\r
-    hide : function(){\r
-        if(this.ghost){\r
-            if(this.proxy){\r
-                this.proxy.remove();\r
-                delete this.proxy;\r
-            }\r
-            this.panel.el.dom.style.display = '';\r
-            this.ghost.remove();\r
-            delete this.ghost;\r
-        }\r
-    },\r
-\r
-    <div id="method-Ext.dd.PanelProxy-show"></div>/**\r
-     * Shows the proxy\r
-     */\r
-    show : function(){\r
-        if(!this.ghost){\r
-            this.ghost = this.panel.createGhost(undefined, undefined, Ext.getBody());\r
-            this.ghost.setXY(this.panel.el.getXY())\r
-            if(this.insertProxy){\r
-                this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});\r
-                this.proxy.setSize(this.panel.getSize());\r
-            }\r
-            this.panel.el.dom.style.display = 'none';\r
-        }\r
-    },\r
-\r
-    // private\r
-    repair : function(xy, callback, scope){\r
-        this.hide();\r
-        if(typeof callback == "function"){\r
-            callback.call(scope || this);\r
-        }\r
-    },\r
-\r
-    <div id="method-Ext.dd.PanelProxy-moveProxy"></div>/**\r
-     * Moves the proxy to a different position in the DOM.  This is typically called while dragging the Panel\r
-     * to keep the proxy sync'd to the Panel's location.\r
-     * @param {HTMLElement} parentNode The proxy's parent DOM node\r
-     * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults\r
-     * to the parent's last child if not specified)\r
-     */\r
-    moveProxy : function(parentNode, before){\r
-        if(this.proxy){\r
-            parentNode.insertBefore(this.proxy.dom, before);\r
-        }\r
-    }\r
-};\r
-\r
-// private - DD implementation for Panels\r
-Ext.Panel.DD = function(panel, cfg){\r
-    this.panel = panel;\r
-    this.dragData = {panel: panel};\r
-    this.proxy = new Ext.dd.PanelProxy(panel, cfg);\r
-    Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);\r
-    var h = panel.header;\r
-    if(h){\r
-        this.setHandleElId(h.id);\r
-    }\r
-    (h ? h : this.panel.body).setStyle('cursor', 'move');\r
-    this.scroll = false;\r
-};\r
-\r
-Ext.extend(Ext.Panel.DD, Ext.dd.DragSource, {\r
-    showFrame: Ext.emptyFn,\r
-    startDrag: Ext.emptyFn,\r
-    b4StartDrag: function(x, y) {\r
-        this.proxy.show();\r
-    },\r
-    b4MouseDown: function(e) {\r
-        var x = e.getPageX();\r
-        var y = e.getPageY();\r
-        this.autoOffset(x, y);\r
-    },\r
-    onInitDrag : function(x, y){\r
-        this.onStartDrag(x, y);\r
-        return true;\r
-    },\r
-    createFrame : Ext.emptyFn,\r
-    getDragEl : function(e){\r
-        return this.proxy.ghost.dom;\r
-    },\r
-    endDrag : function(e){\r
-        this.proxy.hide();\r
-        this.panel.saveState();\r
-    },\r
-\r
-    autoOffset : function(x, y) {\r
-        x -= this.startPageX;\r
-        y -= this.startPageY;\r
-        this.setDelta(x, y);\r
-    }\r
-});</pre>    \r
-</body>\r
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
+  <title>The source code</title>
+    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+</head>
+<body  onload="prettyPrint();">
+    <pre class="prettyprint lang-js">/*!
+ * Ext JS Library 3.3.1
+ * Copyright(c) 2006-2010 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+<div id="cls-Ext.dd.PanelProxy"></div>/**
+ * @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);        
+    },
+    
+    <div id="cfg-Ext.dd.PanelProxy-insertProxy"></div>/**
+     * @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,
+
+    <div id="method-Ext.dd.PanelProxy-getEl"></div>/**
+     * Gets the proxy's element
+     * @return {Element} The proxy's element
+     */
+    getEl : function(){
+        return this.ghost;
+    },
+
+    <div id="method-Ext.dd.PanelProxy-getGhost"></div>/**
+     * Gets the proxy's ghost element
+     * @return {Element} The proxy's ghost element
+     */
+    getGhost : function(){
+        return this.ghost;
+    },
+
+    <div id="method-Ext.dd.PanelProxy-getProxy"></div>/**
+     * Gets the proxy's element
+     * @return {Element} The proxy's element
+     */
+    getProxy : function(){
+        return this.proxy;
+    },
+
+    <div id="method-Ext.dd.PanelProxy-hide"></div>/**
+     * 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;
+        }
+    },
+
+    <div id="method-Ext.dd.PanelProxy-show"></div>/**
+     * 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);
+        }
+    },
+
+    <div id="method-Ext.dd.PanelProxy-moveProxy"></div>/**
+     * 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);
+    }
+});</pre>    
+</body>
 </html>
\ No newline at end of file