1 YUI.add('dd-scroll', function (Y, NAME) {

     2 

     3 

     4     /**

     5      * Base scroller class used to create the Plugin.DDNodeScroll and Plugin.DDWinScroll.

     6      * This class should not be called on it's own, it's designed to be a plugin.

     7      * @module dd

     8      * @submodule dd-scroll

     9      */

    10     /**

    11      * Base scroller class used to create the Plugin.DDNodeScroll and Plugin.DDWinScroll.

    12      * This class should not be called on it's own, it's designed to be a plugin.

    13      * @class Scroll

    14      * @extends Base

    15      * @namespace DD

    16      * @constructor

    17      */

    18 

    19     var S = function() {

    20         S.superclass.constructor.apply(this, arguments);

    21 

    22     },

    23     WS, NS,

    24     HOST = 'host',

    25     BUFFER = 'buffer',

    26     PARENT_SCROLL = 'parentScroll',

    27     WINDOW_SCROLL = 'windowScroll',

    28     SCROLL_TOP = 'scrollTop',

    29     SCROLL_LEFT = 'scrollLeft',

    30     OFFSET_WIDTH = 'offsetWidth',

    31     OFFSET_HEIGHT = 'offsetHeight';

    32 

    33 

    34     S.ATTRS = {

    35         /**

    36         * Internal config option to hold the node that we are scrolling. Should not be set by the developer.

    37         * @attribute parentScroll

    38         * @protected

    39         * @type Node

    40         */

    41         parentScroll: {

    42             value: false,

    43             setter: function(node) {

    44                 if (node) {

    45                     return node;

    46                 }

    47                 return false;

    48             }

    49         },

    50         /**

    51         * The number of pixels from the edge of the screen to turn on scrolling. Default: 30

    52         * @attribute buffer

    53         * @type Number

    54         */

    55         buffer: {

    56             value: 30,

    57             validator: Y.Lang.isNumber

    58         },

    59         /**

    60         * The number of milliseconds delay to pass to the auto scroller. Default: 235

    61         * @attribute scrollDelay

    62         * @type Number

    63         */

    64         scrollDelay: {

    65             value: 235,

    66             validator: Y.Lang.isNumber

    67         },

    68         /**

    69         * The host we are plugged into.

    70         * @attribute host

    71         * @type Object

    72         */

    73         host: {

    74             value: null

    75         },

    76         /**

    77         * Turn on window scroll support, default: false

    78         * @attribute windowScroll

    79         * @type Boolean

    80         */

    81         windowScroll: {

    82             value: false,

    83             validator: Y.Lang.isBoolean

    84         },

    85         /**

    86         * Allow vertical scrolling, default: true.

    87         * @attribute vertical

    88         * @type Boolean

    89         */

    90         vertical: {

    91             value: true,

    92             validator: Y.Lang.isBoolean

    93         },

    94         /**

    95         * Allow horizontal scrolling, default: true.

    96         * @attribute horizontal

    97         * @type Boolean

    98         */

    99         horizontal: {

   100             value: true,

   101             validator: Y.Lang.isBoolean

   102         }

   103     };

   104 

   105     Y.extend(S, Y.Base, {

   106         /**

   107         * Tells if we are actively scrolling or not.

   108         * @private

   109         * @property _scrolling

   110         * @type Boolean

   111         */

   112         _scrolling: null,

   113         /**

   114         * Cache of the Viewport dims.

   115         * @private

   116         * @property _vpRegionCache

   117         * @type Object

   118         */

   119         _vpRegionCache: null,

   120         /**

   121         * Cache of the dragNode dims.

   122         * @private

   123         * @property _dimCache

   124         * @type Object

   125         */

   126         _dimCache: null,

   127         /**

   128         * Holder for the Timer object returned from Y.later.

   129         * @private

   130         * @property _scrollTimer

   131         * @type {Y.later}

   132         */

   133         _scrollTimer: null,

   134         /**

   135         * Sets the _vpRegionCache property with an Object containing the dims from the viewport.

   136         * @private

   137         * @method _getVPRegion

   138         */

   139         _getVPRegion: function() {

   140             var r = {},

   141                 n = this.get(PARENT_SCROLL),

   142             b = this.get(BUFFER),

   143             ws = this.get(WINDOW_SCROLL),

   144             xy = ((ws) ? [] : n.getXY()),

   145             w = ((ws) ? 'winWidth' : OFFSET_WIDTH),

   146             h = ((ws) ? 'winHeight' : OFFSET_HEIGHT),

   147             t = ((ws) ? n.get(SCROLL_TOP) : xy[1]),

   148             l = ((ws) ? n.get(SCROLL_LEFT) : xy[0]);

   149 

   150             r = {

   151                 top: t + b,

   152                 right: (n.get(w) + l) - b,

   153                 bottom: (n.get(h) + t) - b,

   154                 left: l + b

   155             };

   156             this._vpRegionCache = r;

   157             return r;

   158         },

   159         initializer: function() {

   160             var h = this.get(HOST);

   161             h.after('drag:start', Y.bind(this.start, this));

   162             h.after('drag:end', Y.bind(this.end, this));

   163             h.on('drag:align', Y.bind(this.align, this));

   164 

   165             //TODO - This doesn't work yet??

   166             Y.one('win').on('scroll', Y.bind(function() {

   167                 this._vpRegionCache = null;

   168             }, this));

   169         },

   170         /**

   171         * Check to see if we need to fire the scroll timer. If scroll timer is running this will scroll the window.

   172         * @private

   173         * @method _checkWinScroll

   174         * @param {Boolean} move Should we move the window. From Y.later

   175         */

   176         _checkWinScroll: function(move) {

   177             var r = this._getVPRegion(),

   178                 ho = this.get(HOST),

   179                 ws = this.get(WINDOW_SCROLL),

   180                 xy = ho.lastXY,

   181                 scroll = false,

   182                 b = this.get(BUFFER),

   183                 win = this.get(PARENT_SCROLL),

   184                 sTop = win.get(SCROLL_TOP),

   185                 sLeft = win.get(SCROLL_LEFT),

   186                 w = this._dimCache.w,

   187                 h = this._dimCache.h,

   188                 bottom = xy[1] + h,

   189                 top = xy[1],

   190                 right = xy[0] + w,

   191                 left = xy[0],

   192                 nt = top,

   193                 nl = left,

   194                 st = sTop,

   195                 sl = sLeft;

   196 

   197             if (this.get('horizontal')) {

   198                 if (left <= r.left) {

   199                     scroll = true;

   200                     nl = xy[0] - ((ws) ? b : 0);

   201                     sl = sLeft - b;

   202                 }

   203                 if (right >= r.right) {

   204                     scroll = true;

   205                     nl = xy[0] + ((ws) ? b : 0);

   206                     sl = sLeft + b;

   207                 }

   208             }

   209             if (this.get('vertical')) {

   210                 if (bottom >= r.bottom) {

   211                     scroll = true;

   212                     nt = xy[1] + ((ws) ? b : 0);

   213                     st = sTop + b;

   214 

   215                 }

   216                 if (top <= r.top) {

   217                     scroll = true;

   218                     nt = xy[1] - ((ws) ? b : 0);

   219                     st = sTop - b;

   220                 }

   221             }

   222 

   223             if (st < 0) {

   224                 st = 0;

   225                 nt = xy[1];

   226             }

   227 

   228             if (sl < 0) {

   229                 sl = 0;

   230                 nl = xy[0];

   231             }

   232 

   233             if (nt < 0) {

   234                 nt = xy[1];

   235             }

   236             if (nl < 0) {

   237                 nl = xy[0];

   238             }

   239             if (move) {

   240                 ho.actXY = [nl, nt];

   241                 ho._alignNode([nl, nt], true); //We are srolling..

   242                 xy = ho.actXY;

   243                 ho.actXY = [nl, nt];

   244                 ho._moveNode({ node: win, top: st, left: sl});

   245                 if (!st && !sl) {

   246                     this._cancelScroll();

   247                 }

   248             } else {

   249                 if (scroll) {

   250                     this._initScroll();

   251                 } else {

   252                     this._cancelScroll();

   253                 }

   254             }

   255         },

   256         /**

   257         * Cancel a previous scroll timer and init a new one.

   258         * @private

   259         * @method _initScroll

   260         */

   261         _initScroll: function() {

   262             this._cancelScroll();

   263             this._scrollTimer = Y.Lang.later(this.get('scrollDelay'), this, this._checkWinScroll, [true], true);

   264 

   265         },

   266         /**

   267         * Cancel a currently running scroll timer.

   268         * @private

   269         * @method _cancelScroll

   270         */

   271         _cancelScroll: function() {

   272             this._scrolling = false;

   273             if (this._scrollTimer) {

   274                 this._scrollTimer.cancel();

   275                 delete this._scrollTimer;

   276             }

   277         },

   278         /**

   279         * Called from the drag:align event to determine if we need to scroll.

   280         * @method align

   281         */

   282         align: function(e) {

   283             if (this._scrolling) {

   284                 this._cancelScroll();

   285                 e.preventDefault();

   286             }

   287             if (!this._scrolling) {

   288                 this._checkWinScroll();

   289             }

   290         },

   291         /**

   292         * Set the cache of the dragNode dims.

   293         * @private

   294         * @method _setDimCache

   295         */

   296         _setDimCache: function() {

   297             var node = this.get(HOST).get('dragNode');

   298             this._dimCache = {

   299                 h: node.get(OFFSET_HEIGHT),

   300                 w: node.get(OFFSET_WIDTH)

   301             };

   302         },

   303         /**

   304         * Called from the drag:start event

   305         * @method start

   306         */

   307         start: function() {

   308             this._setDimCache();

   309         },

   310         /**

   311         * Called from the drag:end event

   312         * @method end

   313         */

   314         end: function() {

   315             this._dimCache = null;

   316             this._cancelScroll();

   317         }

   318     });

   319 

   320     Y.namespace('Plugin');

   321 

   322 

   323     /**

   324      * Extends the Scroll class to make the window scroll while dragging.

   325      * @class DDWindowScroll

   326      * @extends Scroll

   327      * @namespace Plugin

   328      * @constructor

   329      */

   330     WS = function() {

   331         WS.superclass.constructor.apply(this, arguments);

   332     };

   333     WS.ATTRS = Y.merge(S.ATTRS, {

   334         /**

   335         * Turn on window scroll support, default: true

   336         * @attribute windowScroll

   337         * @type Boolean

   338         */

   339         windowScroll: {

   340             value: true,

   341             setter: function(scroll) {

   342                 if (scroll) {

   343                     this.set(PARENT_SCROLL, Y.one('win'));

   344                 }

   345                 return scroll;

   346             }

   347         }

   348     });

   349     Y.extend(WS, S, {

   350         //Shouldn't have to do this..

   351         initializer: function() {

   352             this.set('windowScroll', this.get('windowScroll'));

   353         }

   354     });

   355     /**

   356     * The Scroll instance will be placed on the Drag instance under the winscroll namespace.

   357     * @property NS

   358     * @default winscroll

   359     * @readonly

   360     * @protected

   361     * @static

   362     * @type {String}

   363     */

   364     WS.NAME = WS.NS = 'winscroll';

   365     Y.Plugin.DDWinScroll = WS;

   366 

   367 

   368     /**

   369      * Extends the Scroll class to make a parent node scroll while dragging.

   370      * @class DDNodeScroll

   371      * @extends Scroll

   372      * @namespace Plugin

   373      * @constructor

   374      */

   375     NS = function() {

   376         NS.superclass.constructor.apply(this, arguments);

   377 

   378     };

   379     NS.ATTRS = Y.merge(S.ATTRS, {

   380         /**

   381         * The node we want to scroll. Used to set the internal parentScroll attribute.

   382         * @attribute node

   383         * @type Node

   384         */

   385         node: {

   386             value: false,

   387             setter: function(node) {

   388                 var n = Y.one(node);

   389                 if (!n) {

   390                     if (node !== false) {

   391                         Y.error('DDNodeScroll: Invalid Node Given: ' + node);

   392                     }

   393                 } else {

   394                     this.set(PARENT_SCROLL, n);

   395                 }

   396                 return n;

   397             }

   398         }

   399     });

   400     Y.extend(NS, S, {

   401         //Shouldn't have to do this..

   402         initializer: function() {

   403             this.set('node', this.get('node'));

   404         }

   405     });

   406     /**

   407     * The NodeScroll instance will be placed on the Drag instance under the nodescroll namespace.

   408     * @property NS

   409     * @default nodescroll

   410     * @readonly

   411     * @protected

   412     * @static

   413     * @type {String}

   414     */

   415     NS.NAME = NS.NS = 'nodescroll';

   416     Y.Plugin.DDNodeScroll = NS;

   417 

   418     Y.DD.Scroll = S;

   419 

   420 

   421 

   422 

   423 }, '@VERSION@', {"requires": ["dd-drag"]});