]> git.proxmox.com Git - extjs.git/blame - extjs/classic/classic/src/dd/DropTarget.js
add extjs 6.0.1 sources
[extjs.git] / extjs / classic / classic / src / dd / DropTarget.js
CommitLineData
6527f429
DM
1/**\r
2 * A simple class that provides the basic implementation needed to make any element a drop target that can have\r
3 * draggable items dropped onto it. The drop has no effect until an implementation of notifyDrop is provided.\r
4 */\r
5Ext.define('Ext.dd.DropTarget', {\r
6 extend: 'Ext.dd.DDTarget',\r
7 requires: ['Ext.dd.ScrollManager'],\r
8\r
9 /**\r
10 * Creates new DropTarget.\r
11 * @param {String/HTMLElement/Ext.dom.Element} el The container element or ID of it.\r
12 * @param {Object} config\r
13 */\r
14 constructor : function(el, config){\r
15 this.el = Ext.get(el);\r
16\r
17 Ext.apply(this, config);\r
18\r
19 if(this.containerScroll){\r
20 Ext.dd.ScrollManager.register(this.el);\r
21 }\r
22\r
23 this.callParent([this.el.dom, this.ddGroup || this.group,\r
24 {isTarget: true}]);\r
25 },\r
26\r
27 /**\r
28 * @cfg {Boolean} containerScroll\r
29 * True to register this container with the ScrollManager for auto scrolling during\r
30 * drag operations.\r
31 */\r
32 containerScroll: false,\r
33\r
34 /**\r
35 * @cfg {String} ddGroup\r
36 * A named drag drop group to which this object belongs. If a group is specified, then this object will only\r
37 * interact with other drag drop objects in the same group.\r
38 */\r
39 /**\r
40 * @cfg {String} [overClass=""]\r
41 * The CSS class applied to the drop target element while the drag source is over it.\r
42 */\r
43 /**\r
44 * @cfg {String} dropAllowed\r
45 * The CSS class returned to the drag source when drop is allowed.\r
46 */\r
47 dropAllowed : Ext.baseCSSPrefix + 'dd-drop-ok',\r
48 /**\r
49 * @cfg {String} dropNotAllowed\r
50 * The CSS class returned to the drag source when drop is not allowed.\r
51 */\r
52 dropNotAllowed : Ext.baseCSSPrefix + 'dd-drop-nodrop',\r
53\r
54 /**\r
55 * @private\r
56 */\r
57 isTarget : true,\r
58\r
59 /**\r
60 * @private\r
61 */\r
62 isNotifyTarget : true,\r
63\r
64 /**\r
65 * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source is now over the\r
66 * target. This default implementation adds the CSS class specified by overClass (if any) to the drop element\r
67 * and returns the dropAllowed config value. This method should be overridden if drop validation is required.\r
68 * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target\r
69 * @param {Event} e The event\r
70 * @param {Object} data An object containing arbitrary data supplied by the drag source\r
71 * @return {String} status The CSS class that communicates the drop status back to the source so that the\r
72 * underlying {@link Ext.dd.StatusProxy} can be updated\r
73 * @template\r
74 */\r
75 notifyEnter : function(dd, e, data){\r
76 if(this.overClass){\r
77 this.el.addCls(this.overClass);\r
78 }\r
79 return this.dropAllowed;\r
80 },\r
81\r
82 /**\r
83 * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the target.\r
84 * This method will be called on every mouse movement while the drag source is over the drop target.\r
85 * This default implementation simply returns the dropAllowed config value.\r
86 * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target\r
87 * @param {Event} e The event\r
88 * @param {Object} data An object containing arbitrary data supplied by the drag source\r
89 * @return {String} status The CSS class that communicates the drop status back to the source so that the\r
90 * underlying {@link Ext.dd.StatusProxy} can be updated\r
91 * @template\r
92 */\r
93 notifyOver : function(dd, e, data){\r
94 return this.dropAllowed;\r
95 },\r
96\r
97 /**\r
98 * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source has been dragged\r
99 * out of the target without dropping. This default implementation simply removes the CSS class specified by\r
100 * `overClass` (if any) from the drop element.\r
101 * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target\r
102 * @param {Event} e The event\r
103 * @param {Object} data An object containing arbitrary data supplied by the drag source\r
104 * @template\r
105 */\r
106 notifyOut : function(dd, e, data){\r
107 if (this.overClass){\r
108 this.el.removeCls(this.overClass);\r
109 }\r
110 },\r
111\r
112 /**\r
113 * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the dragged item has\r
114 * been dropped on it. This method removes any `overClass` and returns false, so you must provide an\r
115 * implementation that does something to process the drop event and returns true so that the drag source's\r
116 * repair action does not run.\r
117 *\r
118 * You should `callParent` from an override of this method to ensure proper cleanup is\r
119 * performed.\r
120 *\r
121 * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target\r
122 * @param {Event} e The event\r
123 * @param {Object} data An object containing arbitrary data supplied by the drag source\r
124 * @return {Boolean} False if the drop was invalid.\r
125 * @template\r
126 */\r
127 notifyDrop : function(dd, e, data){\r
128 if (this.overClass){\r
129 this.el.removeCls(this.overClass);\r
130 }\r
131 return false;\r
132 },\r
133\r
134 destroy : function(){\r
135 this.callParent();\r
136 if (this.containerScroll) {\r
137 Ext.dd.ScrollManager.unregister(this.el);\r
138 }\r
139 }\r
140});\r