1 /*

     2 Copyright (c) 2009, Yahoo! Inc. All rights reserved.

     3 Code licensed under the BSD License:

     4 http://developer.yahoo.net/yui/license.txt

     5 version: 3.0.0

     6 build: 1549

     7 */

     8 YUI.add('dd-ddm-base', function(Y) {

     9 

    10 

    11     /**

    12      * Provides the base Drag Drop Manger required for making a Node draggable.

    13      * @module dd

    14      * @submodule dd-ddm-base

    15      */     

    16      /**

    17      * Provides the base Drag Drop Manger required for making a Node draggable.

    18      * @class DDM

    19      * @extends Base

    20      * @constructor

    21      * @namespace DD

    22      */

    23     

    24     var DDMBase = function() {

    25         DDMBase.superclass.constructor.apply(this, arguments);

    26     };

    27 

    28     DDMBase.NAME = 'ddm';

    29 

    30     DDMBase.ATTRS = {

    31         /**

    32         * @attribute dragCursor

    33         * @description The cursor to apply when dragging, if shimmed the shim will get the cursor.

    34         * @type String

    35         */

    36         dragCursor: {

    37             value: 'move'

    38         },

    39         /**

    40         * @attribute clickPixelThresh

    41         * @description The number of pixels to move to start a drag operation, default is 3.

    42         * @type Number

    43         */

    44         clickPixelThresh: {

    45             value: 3

    46         },

    47         /**

    48         * @attribute clickTimeThresh

    49         * @description The number of milliseconds a mousedown has to pass to start a drag operation, default is 1000.

    50         * @type Number

    51         */        

    52         clickTimeThresh: {

    53             value: 1000

    54         },

    55         /**

    56         * @attribute dragMode

    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. 

    58         * @type String

    59         */        

    60         dragMode: {

    61             value: 'point',

    62             setter: function(mode) {

    63                 this._setDragMode(mode);

    64                 return mode;

    65             }           

    66         }

    67 

    68     };

    69 

    70     Y.extend(DDMBase, Y.Base, {

    71         /**

    72         * @property _active

    73         * @description flag set when we activate our first drag, so DDM can start listening for events.

    74         * @type {Boolean}

    75         */

    76         _active: null,

    77         /**

    78         * @private

    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

    83         */

    84         _setDragMode: function(mode) {

    85             if (mode === null) {

    86                 mode = Y.DD.DDM.get('dragMode');

    87             }

    88             switch (mode) {

    89                 case 1:

    90                 case 'intersect':

    91                     return 1;

    92                 case 2:

    93                 case 'strict':

    94                     return 2;

    95                 case 0:

    96                 case 'point':

    97                     return 0;

    98             }

    99             return 0;       

   100         },

   101         /**

   102         * @property CSS_PREFIX

   103         * @description The PREFIX to attach to all DD CSS class names

   104         * @type {String}

   105         */

   106         CSS_PREFIX: 'yui-dd',

   107         _activateTargets: function() {},        

   108         /**

   109         * @private

   110         * @property _drags

   111         * @description Holder for all registered drag elements.

   112         * @type {Array}

   113         */

   114         _drags: [],

   115         /**

   116         * @property activeDrag

   117         * @description A reference to the currently active draggable object.

   118         * @type {Drag}

   119         */

   120         activeDrag: false,

   121         /**

   122         * @private

   123         * @method _regDrag

   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

   126         */

   127         _regDrag: function(d) {

   128             if (this.getDrag(d.get('node'))) {

   129                 return false;

   130             }

   131             

   132             if (!this._active) {

   133                 this._setupListeners();

   134             }

   135             this._drags.push(d);

   136             return true;

   137         },

   138         /**

   139         * @private

   140         * @method _unregDrag

   141         * @description Remove this drag object from the DDM._drags array.

   142         * @param {Drag} d The drag object.

   143         */

   144         _unregDrag: function(d) {

   145             var tmp = [];

   146             Y.each(this._drags, function(n, i) {

   147                 if (n !== d) {

   148                     tmp[tmp.length] = n;

   149                 }

   150             });

   151             this._drags = tmp;

   152         },

   153         /**

   154         * @private

   155         * @method _setupListeners

   156         * @description Add the document listeners.

   157         */

   158         _setupListeners: function() {

   159             this._active = true;

   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));

   164         },

   165         /**

   166         * @private

   167         * @method _start

   168         * @description Internal method used by Drag to signal the start of a drag operation

   169         */

   170         _start: function() {

   171             this.fire('ddm:start');

   172             this._startDrag();

   173         },

   174         /**

   175         * @private

   176         * @method _startDrag

   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

   182         */

   183         _startDrag: function() {},

   184         /**

   185         * @private

   186         * @method _endDrag

   187         * @description Factory method to be overwritten by other DDM's

   188         */

   189         _endDrag: function() {},

   190         _dropMove: function() {},

   191         /**

   192         * @private

   193         * @method _end

   194         * @description Internal method used by Drag to signal the end of a drag operation

   195         */

   196         _end: function() {

   197             if (this.activeDrag) {

   198                 this._endDrag();

   199                 this.fire('ddm:end');

   200                 this.activeDrag.end.call(this.activeDrag);

   201                 this.activeDrag = null;

   202             }

   203         },

   204         /**

   205         * @method stopDrag

   206         * @description Method will forcefully stop a drag operation. For example calling this from inside an ESC keypress handler will stop this drag.

   207         * @return {Self}

   208         * @chainable

   209         */       

   210         stopDrag: function() {

   211             if (this.activeDrag) {

   212                 this._end();

   213             }

   214             return this;

   215         },

   216         /**

   217         * @private

   218         * @method _move

   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

   221         */

   222         _move: function(ev) {

   223             if (this.activeDrag) {

   224                 this.activeDrag._move.call(this.activeDrag, ev);

   225                 this._dropMove();

   226             }

   227         },

   228         /**

   229         * //TODO Private, rename??...

   230         * @private

   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.

   235         */

   236         cssSizestoObject: function(gutter) {

   237             var x = gutter.split(' ');

   238                 

   239             switch (x.length) {

   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;

   243             }

   244 

   245             return {

   246                 top   : parseInt(x[0],10),

   247                 right : parseInt(x[1],10),

   248                 bottom: parseInt(x[2],10),

   249                 left  : parseInt(x[3],10)

   250             };

   251         },

   252         /**

   253         * @method getDrag

   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

   256         * @return {Object}

   257         */

   258         getDrag: function(node) {

   259             var drag = false,

   260                 n = Y.get(node);

   261             if (n instanceof Y.Node) {

   262                 Y.each(this._drags, function(v, k) {

   263                     if (n.compareTo(v.get('node'))) {

   264                         drag = v;

   265                     }

   266                 });

   267             }

   268             return drag;

   269         }

   270     });

   271 

   272     Y.namespace('DD');

   273     Y.DD.DDM = new DDMBase();

   274 

   275     /**

   276     * @event ddm:start

   277     * @description Fires from the DDM before all drag events fire.

   278     * @type {Event.Custom}

   279     */

   280     /**

   281     * @event ddm:end

   282     * @description Fires from the DDM after the DDM finishes, before the drag end events.

   283     * @type {Event.Custom}

   284     */

   285 

   286 

   287 

   288 

   289 }, '3.0.0' ,{requires:['node', 'base'], skinnable:false});