3 <title>The source code</title>
4 <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
5 <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
7 <body onload="prettyPrint();">
8 <pre class="prettyprint lang-js">/*!
10 * Copyright(c) 2006-2009 Ext JS, LLC
12 * http://www.extjs.com/license
14 <div id="cls-Ext.dd.PanelProxy"></div>/**
\r
15 * @class Ext.dd.PanelProxy
\r
16 * A custom drag proxy implementation specific to {@link Ext.Panel}s. This class is primarily used internally
\r
17 * for the Panel's drag drop implementation, and should never need to be created directly.
\r
19 * @param panel The {@link Ext.Panel} to proxy for
\r
20 * @param config Configuration options
\r
22 Ext.dd.PanelProxy = function(panel, config){
\r
24 this.id = this.panel.id +'-ddproxy';
\r
25 Ext.apply(this, config);
\r
28 Ext.dd.PanelProxy.prototype = {
\r
29 <div id="cfg-Ext.dd.PanelProxy-insertProxy"></div>/**
\r
30 * @cfg {Boolean} insertProxy True to insert a placeholder proxy element while dragging the panel,
\r
31 * false to drag with no proxy (defaults to true).
\r
35 // private overrides
\r
36 setStatus : Ext.emptyFn,
\r
37 reset : Ext.emptyFn,
\r
38 update : Ext.emptyFn,
\r
42 <div id="method-Ext.dd.PanelProxy-getEl"></div>/**
\r
43 * Gets the proxy's element
\r
44 * @return {Element} The proxy's element
\r
50 <div id="method-Ext.dd.PanelProxy-getGhost"></div>/**
\r
51 * Gets the proxy's ghost element
\r
52 * @return {Element} The proxy's ghost element
\r
54 getGhost : function(){
\r
58 <div id="method-Ext.dd.PanelProxy-getProxy"></div>/**
\r
59 * Gets the proxy's element
\r
60 * @return {Element} The proxy's element
\r
62 getProxy : function(){
\r
66 <div id="method-Ext.dd.PanelProxy-hide"></div>/**
\r
72 this.proxy.remove();
\r
75 this.panel.el.dom.style.display = '';
\r
76 this.ghost.remove();
\r
81 <div id="method-Ext.dd.PanelProxy-show"></div>/**
\r
86 this.ghost = this.panel.createGhost(undefined, undefined, Ext.getBody());
\r
87 this.ghost.setXY(this.panel.el.getXY())
\r
88 if(this.insertProxy){
\r
89 this.proxy = this.panel.el.insertSibling({cls:'x-panel-dd-spacer'});
\r
90 this.proxy.setSize(this.panel.getSize());
\r
92 this.panel.el.dom.style.display = 'none';
\r
97 repair : function(xy, callback, scope){
\r
99 if(typeof callback == "function"){
\r
100 callback.call(scope || this);
\r
104 <div id="method-Ext.dd.PanelProxy-moveProxy"></div>/**
\r
105 * Moves the proxy to a different position in the DOM. This is typically called while dragging the Panel
\r
106 * to keep the proxy sync'd to the Panel's location.
\r
107 * @param {HTMLElement} parentNode The proxy's parent DOM node
\r
108 * @param {HTMLElement} before (optional) The sibling node before which the proxy should be inserted (defaults
\r
109 * to the parent's last child if not specified)
\r
111 moveProxy : function(parentNode, before){
\r
113 parentNode.insertBefore(this.proxy.dom, before);
\r
118 // private - DD implementation for Panels
\r
119 Ext.Panel.DD = function(panel, cfg){
\r
120 this.panel = panel;
\r
121 this.dragData = {panel: panel};
\r
122 this.proxy = new Ext.dd.PanelProxy(panel, cfg);
\r
123 Ext.Panel.DD.superclass.constructor.call(this, panel.el, cfg);
\r
124 var h = panel.header;
\r
126 this.setHandleElId(h.id);
\r
128 (h ? h : this.panel.body).setStyle('cursor', 'move');
\r
129 this.scroll = false;
\r
132 Ext.extend(Ext.Panel.DD, Ext.dd.DragSource, {
\r
133 showFrame: Ext.emptyFn,
\r
134 startDrag: Ext.emptyFn,
\r
135 b4StartDrag: function(x, y) {
\r
138 b4MouseDown: function(e) {
\r
139 var x = e.getPageX();
\r
140 var y = e.getPageY();
\r
141 this.autoOffset(x, y);
\r
143 onInitDrag : function(x, y){
\r
144 this.onStartDrag(x, y);
\r
147 createFrame : Ext.emptyFn,
\r
148 getDragEl : function(e){
\r
149 return this.proxy.ghost.dom;
\r
151 endDrag : function(e){
\r
153 this.panel.saveState();
\r
156 autoOffset : function(x, y) {
\r
157 x -= this.startPageX;
\r
158 y -= this.startPageY;
\r
159 this.setDelta(x, y);
\r