docs/source/PanelDD.html

   1 <html>
   2 <head>
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4   <title>The source code</title>
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   7 </head>
   8 <body  onload="prettyPrint();">
   9     <pre class="prettyprint lang-js">/*!
  10  * Ext JS Library 3.2.1
  11  * Copyright(c) 2006-2010 Ext JS, Inc.
  12  * licensing@extjs.com
  13  * http://www.extjs.com/license
  14  */
  15 <div id="cls-Ext.dd.PanelProxy"></div>/**
  16  * @class Ext.dd.PanelProxy
  17  * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally
  18  * for the Panel's drag drop implementation, and should never need to be created directly.
  19  * @constructor
  20  * @param panel The {@link Ext.Panel} to proxy for
  21  * @param config Configuration options
  22  */
  23 Ext.dd.PanelProxy = function(panel, config){
  24     this.panel = panel;
  25     this.id = this.panel.id +'-ddproxy';
  26     Ext.apply(this, config);
  27 };
  28
  29 Ext.dd.PanelProxy.prototype = {
  30     <div id="cfg-Ext.dd.PanelProxy-insertProxy"></div>/**
  31      * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
  32      * false to drag with no proxy (defaults to true).
  33      */
  34     insertProxy : true,
  35
  36     // private overrides
  37     setStatus : Ext.emptyFn,
  38     reset : Ext.emptyFn,
  39     update : Ext.emptyFn,
  40     stop : Ext.emptyFn,
  41     sync: Ext.emptyFn,
  42
  43     <div id="method-Ext.dd.PanelProxy-getEl"></div>/**
  44      * Gets the proxy's element
  45      * @return {Element} The proxy's element
  46      */
  47     getEl : function(){
  48         return this.ghost;
  49     },
  50
  51     <div id="method-Ext.dd.PanelProxy-getGhost"></div>/**
  52      * Gets the proxy's ghost element
  53      * @return {Element} The proxy's ghost element
  54      */
  55     getGhost : function(){
  56         return this.ghost;
  57     },
  58
  59     <div id="method-Ext.dd.PanelProxy-getProxy"></div>/**
  60      * Gets the proxy's element
  61      * @return {Element} The proxy's element
  62      */
  63     getProxy : function(){
  64         return this.proxy;
  65     },
  66
  67     <div id="method-Ext.dd.PanelProxy-hide"></div>/**
  68      * Hides the proxy
  69      */
  70     hide : function(){
  71         if(this.ghost){
  72             if(this.proxy){
  73                 this.proxy.remove();
  74                 delete this.proxy;
  75             }
  76             this.panel.el.dom.style.display = '';
  77             this.ghost.remove();
  78             delete this.ghost;
  79         }
  80     },
  81
  82     <div id="method-Ext.dd.PanelProxy-show"></div>/**
  83      * Shows the proxy
  84      */
  85     show : function(){
  86         if(!this.ghost){
  87             this.ghost = this.panel.createGhost(undefined, undefined, Ext.getBody());
  88             this.ghost.setXY(this.panel.el.getXY());
  89             if(this.insertProxy){
  90                 this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
  91                 this.proxy.setSize(this.panel.getSize());
  92             }
  93             this.panel.el.dom.style.display = 'none';
  94         }
  95     },
  96
  97     // private
  98     repair : function(xy, callback, scope){
  99         this.hide();
 100         if(typeof callback == "function"){
 101             callback.call(scope || this);
 102         }
 103     },
 104
 105     <div id="method-Ext.dd.PanelProxy-moveProxy"></div>/**
 106      * Moves the proxy to a different position in the DOM.  This is typically called while dragging the Panel
 107      * to keep the proxy sync'd to the Panel's location.
 108      * @param {HTMLElement} parentNode The proxy's parent DOM node
 109      * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
 110      * to the parent's last child if not specified)
 111      */
 112     moveProxy : function(parentNode, before){
 113         if(this.proxy){
 114             parentNode.insertBefore(this.proxy.dom, before);
 115         }
 116     }
 117 };
 118
 119 // private - DD implementation for Panels
 120 Ext.Panel.DD = function(panel, cfg){
 121     this.panel = panel;
 122     this.dragData = {panel: panel};
 123     this.proxy = new Ext.dd.PanelProxy(panel, cfg);
 124     Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
 125     var h = panel.header;
 126     if(h){
 127         this.setHandleElId(h.id);
 128     }
 129     (h ? h : this.panel.body).setStyle('cursor', 'move');
 130     this.scroll = false;
 131 };
 132
 133 Ext.extend(Ext.Panel.DD, Ext.dd.DragSource, {
 134     showFrame: Ext.emptyFn,
 135     startDrag: Ext.emptyFn,
 136     b4StartDrag: function(x, y) {
 137         this.proxy.show();
 138     },
 139     b4MouseDown: function(e) {
 140         var x = e.getPageX();
 141         var y = e.getPageY();
 142         this.autoOffset(x, y);
 143     },
 144     onInitDrag : function(x, y){
 145         this.onStartDrag(x, y);
 146         return true;
 147     },
 148     createFrame : Ext.emptyFn,
 149     getDragEl : function(e){
 150         return this.proxy.ghost.dom;
 151     },
 152     endDrag : function(e){
 153         this.proxy.hide();
 154         this.panel.saveState();
 155     },
 156
 157     autoOffset : function(x, y) {
 158         x -= this.startPageX;
 159         y -= this.startPageY;
 160         this.setDelta(x, y);
 161     }
 162 });</pre>
 163 </body>
 164 </html>