3 * Copyright(c) 2006-2010 Ext JS, Inc.
5 * http://www.extjs.com/license
8 * @class Ext.dd.PanelProxy
9 * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally
10 * for the Panel's drag drop implementation, and should never need to be created directly.
12 * @param panel The {@link Ext.Panel} to proxy for
13 * @param config Configuration options
15 Ext.dd.PanelProxy = function(panel, config){
17 this.id = this.panel.id +'-ddproxy';
18 Ext.apply(this, config);
21 Ext.dd.PanelProxy.prototype = {
23 * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
24 * false to drag with no proxy (defaults to true).
29 setStatus : Ext.emptyFn,
36 * Gets the proxy's element
37 * @return {Element} The proxy's element
44 * Gets the proxy's ghost element
45 * @return {Element} The proxy's ghost element
47 getGhost : function(){
52 * Gets the proxy's element
53 * @return {Element} The proxy's element
55 getProxy : function(){
68 this.panel.el.dom.style.display = '';
79 this.ghost = this.panel.createGhost(undefined, undefined, Ext.getBody());
80 this.ghost.setXY(this.panel.el.getXY());
82 this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
83 this.proxy.setSize(this.panel.getSize());
85 this.panel.el.dom.style.display = 'none';
90 repair : function(xy, callback, scope){
92 if(typeof callback == "function"){
93 callback.call(scope || this);
98 * Moves the proxy to a different position in the DOM. This is typically called while dragging the Panel
99 * to keep the proxy sync'd to the Panel's location.
100 * @param {HTMLElement} parentNode The proxy's parent DOM node
101 * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
102 * to the parent's last child if not specified)
104 moveProxy : function(parentNode, before){
106 parentNode.insertBefore(this.proxy.dom, before);
111 // private - DD implementation for Panels
112 Ext.Panel.DD = function(panel, cfg){
114 this.dragData = {panel: panel};
115 this.proxy = new Ext.dd.PanelProxy(panel, cfg);
116 Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
117 var h = panel.header;
119 this.setHandleElId(h.id);
121 (h ? h : this.panel.body).setStyle('cursor', 'move');
125 Ext.extend(Ext.Panel.DD, Ext.dd.DragSource, {
126 showFrame: Ext.emptyFn,
127 startDrag: Ext.emptyFn,
128 b4StartDrag: function(x, y) {
131 b4MouseDown: function(e) {
132 var x = e.getPageX();
133 var y = e.getPageY();
134 this.autoOffset(x, y);
136 onInitDrag : function(x, y){
137 this.onStartDrag(x, y);
140 createFrame : Ext.emptyFn,
141 getDragEl : function(e){
142 return this.proxy.ghost.dom;
144 endDrag : function(e){
146 this.panel.saveState();
149 autoOffset : function(x, y) {
150 x -= this.startPageX;
151 y -= this.startPageY;