2 Copyright (c) 2009, Yahoo! Inc. All rights reserved.
3 Code licensed under the BSD License:
4 http://developer.yahoo.net/yui/license.txt
8 YUI.add('dd-ddm-base', function(Y) {
12 * Provides the base Drag Drop Manger required for making a Node draggable.
14 * @submodule dd-ddm-base
17 * Provides the base Drag Drop Manger required for making a Node draggable.
24 var DDMBase = function() {
25 DDMBase.superclass.constructor.apply(this, arguments);
32 * @attribute dragCursor
33 * @description The cursor to apply when dragging, if shimmed the shim will get the cursor.
40 * @attribute clickPixelThresh
41 * @description The number of pixels to move to start a drag operation, default is 3.
48 * @attribute clickTimeThresh
49 * @description The number of milliseconds a mousedown has to pass to start a drag operation, default is 1000.
57 * @description This attribute only works if the dd-drop module is active. It will set the dragMode (point, intersect, strict) of all future Drag instances.
62 setter: function(mode) {
63 this._setDragMode(mode);
70 Y.extend(DDMBase, Y.Base, {
73 * @description flag set when we activate our first drag, so DDM can start listening for events.
79 * @method _setDragMode
80 * @description Handler for dragMode attribute setter.
81 * @param String/Number The Number value or the String for the DragMode to default all future drag instances to.
82 * @return Number The Mode to be set
84 _setDragMode: function(mode) {
86 mode = Y.DD.DDM.get('dragMode');
102 * @property CSS_PREFIX
103 * @description The PREFIX to attach to all DD CSS class names
106 CSS_PREFIX: 'yui-dd',
107 _activateTargets: function() {},
111 * @description Holder for all registered drag elements.
116 * @property activeDrag
117 * @description A reference to the currently active draggable object.
124 * @description Adds a reference to the drag object to the DDM._drags array, called in the constructor of Drag.
125 * @param {Drag} d The Drag object
127 _regDrag: function(d) {
128 if (this.getDrag(d.get('node'))) {
133 this._setupListeners();
141 * @description Remove this drag object from the DDM._drags array.
142 * @param {Drag} d The drag object.
144 _unregDrag: function(d) {
146 Y.each(this._drags, function(n, i) {
155 * @method _setupListeners
156 * @description Add the document listeners.
158 _setupListeners: function() {
160 var doc = Y.get(document);
161 doc.on('mousemove', Y.bind(this._move, this));
162 //Y.Event.nativeAdd(document, 'mousemove', Y.bind(this._move, this));
163 doc.on('mouseup', Y.bind(this._end, this));
168 * @description Internal method used by Drag to signal the start of a drag operation
171 this.fire('ddm:start');
177 * @description Factory method to be overwritten by other DDM's
178 * @param {Number} x The x position of the drag element
179 * @param {Number} y The y position of the drag element
180 * @param {Number} w The width of the drag element
181 * @param {Number} h The height of the drag element
183 _startDrag: function() {},
187 * @description Factory method to be overwritten by other DDM's
189 _endDrag: function() {},
190 _dropMove: function() {},
194 * @description Internal method used by Drag to signal the end of a drag operation
197 if (this.activeDrag) {
199 this.fire('ddm:end');
200 this.activeDrag.end.call(this.activeDrag);
201 this.activeDrag = null;
206 * @description Method will forcefully stop a drag operation. For example calling this from inside an ESC keypress handler will stop this drag.
210 stopDrag: function() {
211 if (this.activeDrag) {
219 * @description Internal listener for the mousemove DOM event to pass to the Drag's move method.
220 * @param {Event.Facade} ev The Dom mousemove Event
222 _move: function(ev) {
223 if (this.activeDrag) {
224 this.activeDrag._move.call(this.activeDrag, ev);
229 * //TODO Private, rename??...
231 * @method cssSizestoObject
232 * @description Helper method to use to set the gutter from the attribute setter.
233 * @param {String} gutter CSS style string for gutter: '5 0' (sets top and bottom to 5px, left and right to 0px), '1 2 3 4' (top 1px, right 2px, bottom 3px, left 4px)
234 * @return {Object} The gutter Object Literal.
236 cssSizestoObject: function(gutter) {
237 var x = gutter.split(' ');
240 case 1: x[1] = x[2] = x[3] = x[0]; break;
241 case 2: x[2] = x[0]; x[3] = x[1]; break;
242 case 3: x[3] = x[1]; break;
246 top : parseInt(x[0],10),
247 right : parseInt(x[1],10),
248 bottom: parseInt(x[2],10),
249 left : parseInt(x[3],10)
254 * @description Get a valid Drag instance back from a Node or a selector string, false otherwise
255 * @param {String/Object} node The Node instance or Selector string to check for a valid Drag Object
258 getDrag: function(node) {
261 if (n instanceof Y.Node) {
262 Y.each(this._drags, function(v, k) {
263 if (n.compareTo(v.get('node'))) {
273 Y.DD.DDM = new DDMBase();
277 * @description Fires from the DDM before all drag events fire.
278 * @type {Event.Custom}
282 * @description Fires from the DDM after the DDM finishes, before the drag end events.
283 * @type {Event.Custom}
289 }, '3.0.0' ,{requires:['node', 'base'], skinnable:false});