PanelDD.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:4k
源码类别:

中间件编程

开发平台:

JavaScript

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