1 | /* |
---|
2 | * Ext JS Library 2.2.1 |
---|
3 | * Copyright(c) 2006-2009, Ext JS, LLC. |
---|
4 | * licensing@extjs.com |
---|
5 | * |
---|
6 | * http://extjs.com/license |
---|
7 | */ |
---|
8 | |
---|
9 | /** |
---|
10 | * @class Ext.dd.DropZone |
---|
11 | * @extends Ext.dd.DropTarget |
---|
12 | * This class provides a container DD instance that proxies for multiple child node targets.<br /> |
---|
13 | * By default, this class requires that child nodes accepting drop are registered with {@link Ext.dd.Registry}. |
---|
14 | * @constructor |
---|
15 | * @param {Mixed} el The container element |
---|
16 | * @param {Object} config |
---|
17 | */ |
---|
18 | Ext.dd.DropZone = function(el, config){ |
---|
19 | Ext.dd.DropZone.superclass.constructor.call(this, el, config); |
---|
20 | }; |
---|
21 | |
---|
22 | Ext.extend(Ext.dd.DropZone, Ext.dd.DropTarget, { |
---|
23 | /** |
---|
24 | * Returns a custom data object associated with the DOM node that is the target of the event. By default |
---|
25 | * this looks up the event target in the {@link Ext.dd.Registry}, although you can override this method to |
---|
26 | * provide your own custom lookup. |
---|
27 | * @param {Event} e The event |
---|
28 | * @return {Object} data The custom data |
---|
29 | */ |
---|
30 | getTargetFromEvent : function(e){ |
---|
31 | return Ext.dd.Registry.getTargetFromEvent(e); |
---|
32 | }, |
---|
33 | |
---|
34 | /** |
---|
35 | * Called internally when the DropZone determines that a {@link Ext.dd.DragSource} has entered a drop node |
---|
36 | * that it has registered. This method has no default implementation and should be overridden to provide |
---|
37 | * node-specific processing if necessary. |
---|
38 | * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from |
---|
39 | * {@link #getTargetFromEvent} for this node) |
---|
40 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
41 | * @param {Event} e The event |
---|
42 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
43 | */ |
---|
44 | onNodeEnter : function(n, dd, e, data){ |
---|
45 | |
---|
46 | }, |
---|
47 | |
---|
48 | /** |
---|
49 | * Called internally while the DropZone determines that a {@link Ext.dd.DragSource} is over a drop node |
---|
50 | * that it has registered. The default implementation returns this.dropNotAllowed, so it should be |
---|
51 | * overridden to provide the proper feedback. |
---|
52 | * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from |
---|
53 | * {@link #getTargetFromEvent} for this node) |
---|
54 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
55 | * @param {Event} e The event |
---|
56 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
57 | * @return {String} status The CSS class that communicates the drop status back to the source so that the |
---|
58 | * underlying {@link Ext.dd.StatusProxy} can be updated |
---|
59 | */ |
---|
60 | onNodeOver : function(n, dd, e, data){ |
---|
61 | return this.dropAllowed; |
---|
62 | }, |
---|
63 | |
---|
64 | /** |
---|
65 | * Called internally when the DropZone determines that a {@link Ext.dd.DragSource} has been dragged out of |
---|
66 | * the drop node without dropping. This method has no default implementation and should be overridden to provide |
---|
67 | * node-specific processing if necessary. |
---|
68 | * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from |
---|
69 | * {@link #getTargetFromEvent} for this node) |
---|
70 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
71 | * @param {Event} e The event |
---|
72 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
73 | */ |
---|
74 | onNodeOut : function(n, dd, e, data){ |
---|
75 | |
---|
76 | }, |
---|
77 | |
---|
78 | /** |
---|
79 | * Called internally when the DropZone determines that a {@link Ext.dd.DragSource} has been dropped onto |
---|
80 | * the drop node. The default implementation returns false, so it should be overridden to provide the |
---|
81 | * appropriate processing of the drop event and return true so that the drag source's repair action does not run. |
---|
82 | * @param {Object} nodeData The custom data associated with the drop node (this is the same value returned from |
---|
83 | * {@link #getTargetFromEvent} for this node) |
---|
84 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
85 | * @param {Event} e The event |
---|
86 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
87 | * @return {Boolean} True if the drop was valid, else false |
---|
88 | */ |
---|
89 | onNodeDrop : function(n, dd, e, data){ |
---|
90 | return false; |
---|
91 | }, |
---|
92 | |
---|
93 | /** |
---|
94 | * Called internally while the DropZone determines that a {@link Ext.dd.DragSource} is being dragged over it, |
---|
95 | * but not over any of its registered drop nodes. The default implementation returns this.dropNotAllowed, so |
---|
96 | * it should be overridden to provide the proper feedback if necessary. |
---|
97 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
98 | * @param {Event} e The event |
---|
99 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
100 | * @return {String} status The CSS class that communicates the drop status back to the source so that the |
---|
101 | * underlying {@link Ext.dd.StatusProxy} can be updated |
---|
102 | */ |
---|
103 | onContainerOver : function(dd, e, data){ |
---|
104 | return this.dropNotAllowed; |
---|
105 | }, |
---|
106 | |
---|
107 | /** |
---|
108 | * Called internally when the DropZone determines that a {@link Ext.dd.DragSource} has been dropped on it, |
---|
109 | * but not on any of its registered drop nodes. The default implementation returns false, so it should be |
---|
110 | * overridden to provide the appropriate processing of the drop event if you need the drop zone itself to |
---|
111 | * be able to accept drops. It should return true when valid so that the drag source's repair action does not run. |
---|
112 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
113 | * @param {Event} e The event |
---|
114 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
115 | * @return {Boolean} True if the drop was valid, else false |
---|
116 | */ |
---|
117 | onContainerDrop : function(dd, e, data){ |
---|
118 | return false; |
---|
119 | }, |
---|
120 | |
---|
121 | /** |
---|
122 | * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the source is now over |
---|
123 | * the zone. The default implementation returns this.dropNotAllowed and expects that only registered drop |
---|
124 | * nodes can process drag drop operations, so if you need the drop zone itself to be able to process drops |
---|
125 | * you should override this method and provide a custom implementation. |
---|
126 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
127 | * @param {Event} e The event |
---|
128 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
129 | * @return {String} status The CSS class that communicates the drop status back to the source so that the |
---|
130 | * underlying {@link Ext.dd.StatusProxy} can be updated |
---|
131 | */ |
---|
132 | notifyEnter : function(dd, e, data){ |
---|
133 | return this.dropNotAllowed; |
---|
134 | }, |
---|
135 | |
---|
136 | /** |
---|
137 | * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the drop zone. |
---|
138 | * This method will be called on every mouse movement while the drag source is over the drop zone. |
---|
139 | * It will call {@link #onNodeOver} while the drag source is over a registered node, and will also automatically |
---|
140 | * delegate to the appropriate node-specific methods as necessary when the drag source enters and exits |
---|
141 | * registered nodes ({@link #onNodeEnter}, {@link #onNodeOut}). If the drag source is not currently over a |
---|
142 | * registered node, it will call {@link #onContainerOver}. |
---|
143 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
144 | * @param {Event} e The event |
---|
145 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
146 | * @return {String} status The CSS class that communicates the drop status back to the source so that the |
---|
147 | * underlying {@link Ext.dd.StatusProxy} can be updated |
---|
148 | */ |
---|
149 | notifyOver : function(dd, e, data){ |
---|
150 | var n = this.getTargetFromEvent(e); |
---|
151 | if(!n){ // not over valid drop target |
---|
152 | if(this.lastOverNode){ |
---|
153 | this.onNodeOut(this.lastOverNode, dd, e, data); |
---|
154 | this.lastOverNode = null; |
---|
155 | } |
---|
156 | return this.onContainerOver(dd, e, data); |
---|
157 | } |
---|
158 | if(this.lastOverNode != n){ |
---|
159 | if(this.lastOverNode){ |
---|
160 | this.onNodeOut(this.lastOverNode, dd, e, data); |
---|
161 | } |
---|
162 | this.onNodeEnter(n, dd, e, data); |
---|
163 | this.lastOverNode = n; |
---|
164 | } |
---|
165 | return this.onNodeOver(n, dd, e, data); |
---|
166 | }, |
---|
167 | |
---|
168 | /** |
---|
169 | * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the source has been dragged |
---|
170 | * out of the zone without dropping. If the drag source is currently over a registered node, the notification |
---|
171 | * will be delegated to {@link #onNodeOut} for node-specific handling, otherwise it will be ignored. |
---|
172 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target |
---|
173 | * @param {Event} e The event |
---|
174 | * @param {Object} data An object containing arbitrary data supplied by the drag zone |
---|
175 | */ |
---|
176 | notifyOut : function(dd, e, data){ |
---|
177 | if(this.lastOverNode){ |
---|
178 | this.onNodeOut(this.lastOverNode, dd, e, data); |
---|
179 | this.lastOverNode = null; |
---|
180 | } |
---|
181 | }, |
---|
182 | |
---|
183 | /** |
---|
184 | * The function a {@link Ext.dd.DragSource} calls once to notify this drop zone that the dragged item has |
---|
185 | * been dropped on it. The drag zone will look up the target node based on the event passed in, and if there |
---|
186 | * is a node registered for that event, it will delegate to {@link #onNodeDrop} for node-specific handling, |
---|
187 | * otherwise it will call {@link #onContainerDrop}. |
---|
188 | * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop zone |
---|
189 | * @param {Event} e The event |
---|
190 | * @param {Object} data An object containing arbitrary data supplied by the drag source |
---|
191 | * @return {Boolean} True if the drop was valid, else false |
---|
192 | */ |
---|
193 | notifyDrop : function(dd, e, data){ |
---|
194 | if(this.lastOverNode){ |
---|
195 | this.onNodeOut(this.lastOverNode, dd, e, data); |
---|
196 | this.lastOverNode = null; |
---|
197 | } |
---|
198 | var n = this.getTargetFromEvent(e); |
---|
199 | return n ? |
---|
200 | this.onNodeDrop(n, dd, e, data) : |
---|
201 | this.onContainerDrop(dd, e, data); |
---|
202 | }, |
---|
203 | |
---|
204 | // private |
---|
205 | triggerCacheRefresh : function(){ |
---|
206 | Ext.dd.DDM.refreshCache(this.groups); |
---|
207 | } |
---|
208 | }); |
---|