3 * Copyright(c) 2006-2010 Sencha Inc.
5 * http://www.sencha.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 = Ext.extend(Object, {
17 constructor : function(panel, config){
19 this.id = this.panel.id +'-ddproxy';
20 Ext.apply(this, config);
24 * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
25 * false to drag with no proxy (defaults to true).
30 setStatus : Ext.emptyFn,
37 * Gets the proxy's element
38 * @return {Element} The proxy's element
45 * Gets the proxy's ghost element
46 * @return {Element} The proxy's ghost element
48 getGhost : function(){
53 * Gets the proxy's element
54 * @return {Element} The proxy's element
56 getProxy : function(){
69 this.panel.el.dom.style.display = '';
80 this.ghost = this.panel.createGhost(this.panel.initialConfig.cls, undefined, Ext.getBody());
81 this.ghost.setXY(this.panel.el.getXY());
83 this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
84 this.proxy.setSize(this.panel.getSize());
86 this.panel.el.dom.style.display = 'none';
91 repair : function(xy, callback, scope){
93 if(typeof callback == "function"){
94 callback.call(scope || this);
99 * Moves the proxy to a different position in the DOM. This is typically called while dragging the Panel
100 * to keep the proxy sync'd to the Panel's location.
101 * @param {HTMLElement} parentNode The proxy's parent DOM node
102 * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
103 * to the parent's last child if not specified)
105 moveProxy : function(parentNode, before){
107 parentNode.insertBefore(this.proxy.dom, before);
112 // private - DD implementation for Panels
113 Ext.Panel.DD = Ext.extend(Ext.dd.DragSource, {
115 constructor : function(panel, cfg){
117 this.dragData = {panel: panel};
118 this.proxy = new Ext.dd.PanelProxy(panel, cfg);
119 Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
120 var h = panel.header,
123 this.setHandleElId(h.id);
126 el.setStyle('cursor', 'move');
130 showFrame: Ext.emptyFn,
131 startDrag: Ext.emptyFn,
132 b4StartDrag: function(x, y) {
135 b4MouseDown: function(e) {
136 var x = e.getPageX(),
138 this.autoOffset(x, y);
140 onInitDrag : function(x, y){
141 this.onStartDrag(x, y);
144 createFrame : Ext.emptyFn,
145 getDragEl : function(e){
146 return this.proxy.ghost.dom;
148 endDrag : function(e){
150 this.panel.saveState();
153 autoOffset : function(x, y) {
154 x -= this.startPageX;
155 y -= this.startPageY;