[Summary view] [Print] [Text view]

   1  /*
   2  YUI 3.17.2 (build 9c3c78e)
   3  Copyright 2014 Yahoo! Inc. All rights reserved.
   4  Licensed under the BSD License.
   5  http://yuilibrary.com/license/
   6  */
   7  
   8  YUI.add('dd-ddm', function (Y, NAME) {
   9  
  10  
  11      /**
  12       * Extends the dd-ddm-base Class to add support for the viewport shim to allow a draggable
  13       * anode to drag to be dragged over an iframe or any other node that traps mousemove events.
  14       * It is also required to have Drop Targets enabled, as the viewport shim will contain the shims for the Drop Targets.
  15       * @module dd
  16       * @submodule dd-ddm
  17       * @for DDM
  18       * @namespace DD
  19       */
  20      Y.mix(Y.DD.DDM, {
  21          /**
  22          * The shim placed over the screen to track the mousemove event.
  23          * @private
  24          * @property _pg
  25          * @type {Node}
  26          */
  27          _pg: null,
  28          /**
  29          * Set this to true to set the shims opacity to .5 for debugging it, default: false.
  30          * @private
  31          * @property _debugShim
  32          * @type {Boolean}
  33          */
  34          _debugShim: false,
  35          _activateTargets: function() { },
  36          _deactivateTargets: function() {},
  37          _startDrag: function() {
  38              if (this.activeDrag && this.activeDrag.get('useShim')) {
  39                  this._shimming = true;
  40                  this._pg_activate();
  41                  this._activateTargets();
  42              }
  43          },
  44          _endDrag: function() {
  45              this._pg_deactivate();
  46              this._deactivateTargets();
  47          },
  48          /**
  49          * Deactivates the shim
  50          * @private
  51          * @method _pg_deactivate
  52          */
  53          _pg_deactivate: function() {
  54              this._pg.setStyle('display', 'none');
  55          },
  56          /**
  57          * Activates the shim
  58          * @private
  59          * @method _pg_activate
  60          */
  61          _pg_activate: function() {
  62              if (!this._pg) {
  63                  this._createPG();
  64              }
  65              var ah = this.activeDrag.get('activeHandle'), cur = 'auto';
  66              if (ah) {
  67                  cur = ah.getStyle('cursor');
  68              }
  69              if (cur === 'auto') {
  70                  cur = this.get('dragCursor');
  71              }
  72  
  73              this._pg_size();
  74              this._pg.setStyles({
  75                  top: 0,
  76                  left: 0,
  77                  display: 'block',
  78                  opacity: ((this._debugShim) ? '.5' : '0'),
  79                  cursor: cur
  80              });
  81          },
  82          /**
  83          * Sizes the shim on: activatation, window:scroll, window:resize
  84          * @private
  85          * @method _pg_size
  86          */
  87          _pg_size: function() {
  88              if (this.activeDrag) {
  89                  var b = Y.one('body'),
  90                  h = b.get('docHeight'),
  91                  w = b.get('docWidth');
  92                  this._pg.setStyles({
  93                      height: h + 'px',
  94                      width: w + 'px'
  95                  });
  96              }
  97          },
  98          /**
  99          * Creates the shim and adds it's listeners to it.
 100          * @private
 101          * @method _createPG
 102          */
 103          _createPG: function() {
 104              var pg = Y.Node.create('<div></div>'),
 105              bd = Y.one('body'), win;
 106              pg.setStyles({
 107                  top: '0',
 108                  left: '0',
 109                  position: 'absolute',
 110                  zIndex: '9999',
 111                  overflow: 'hidden',
 112                  backgroundColor: 'red',
 113                  display: 'none',
 114                  height: '5px',
 115                  width: '5px'
 116              });
 117              pg.set('id', Y.stamp(pg));
 118              pg.addClass(Y.DD.DDM.CSS_PREFIX + '-shim');
 119              bd.prepend(pg);
 120              this._pg = pg;
 121              this._pg.on('mousemove', Y.throttle(Y.bind(this._move, this), this.get('throttleTime')));
 122              this._pg.on('mouseup', Y.bind(this._end, this));
 123  
 124              win = Y.one('win');
 125              Y.on('window:resize', Y.bind(this._pg_size, this));
 126              win.on('scroll', Y.bind(this._pg_size, this));
 127          }
 128      }, true);
 129  
 130  
 131  
 132  
 133  }, '3.17.2', {"requires": ["dd-ddm-base", "event-resize"]});