/**
+ * Extends the dd-ddm-base Class to add support for the viewport shim to allow a draggable node to drag to be dragged over an iframe or any other node that traps mousemove events.
+ * It is also required to have Drop Targets enabled, as the viewport shim will contain the shims for the Drop Targets.
+ * @module dd
+ * @submodule dd-ddm
+ * @for DDM
+ * @namespace DD
+ */
+ Y.mix(Y.DD.DDM, {
+ /**
+ * @private
+ * @property _pg
+ * @description The shim placed over the screen to track the mousemove event.
+ * @type {Node}
+ */
+ _pg: null,
+ /**
+ * @private
+ * @property _debugShim
+ * @description Set this to true to set the shims opacity to .5 for debugging it, default: false.
+ * @type {Boolean}
+ */
+ _debugShim: false,
+ _activateTargets: function() {},
+ _deactivateTargets: function() {},
+ _startDrag: function() {
+ if (this.activeDrag.get('useShim')) {
+ this._pg_activate();
+ this._activateTargets();
+ }
+ },
+ _endDrag: function() {
+ this._pg_deactivate();
+ this._deactivateTargets();
+ },
+ /**
+ * @private
+ * @method _pg_deactivate
+ * @description Deactivates the shim
+ */
+ _pg_deactivate: function() {
+ this._pg.setStyle('display', 'none');
+ },
+ /**
+ * @private
+ * @method _pg_activate
+ * @description Activates the shim
+ */
+ _pg_activate: function() {
+ var ah = this.activeDrag.get('activeHandle'), cur = 'auto';
+ if (ah) {
+ cur = ah.getStyle('cursor');
+ }
+ if (cur == 'auto') {
+ cur = this.get('dragCursor');
+ }
+
+ this._pg_size();
+ this._pg.setStyles({
+ top: 0,
+ left: 0,
+ display: 'block',
+ opacity: ((this._debugShim) ? '.5' : '0'),
+ cursor: cur
+ });
+ },
+ /**
+ * @private
+ * @method _pg_size
+ * @description Sizes the shim on: activatation, window:scroll, window:resize
+ */
+ _pg_size: function() {
+ if (this.activeDrag) {
+ var b = Y.get('body'),
+ h = b.get('docHeight'),
+ w = b.get('docWidth');
+ this._pg.setStyles({
+ height: h + 'px',
+ width: w + 'px'
+ });
+ }
+ },
+ /**
+ * @private
+ * @method _createPG
+ * @description Creates the shim and adds it's listeners to it.
+ */
+ _createPG: function() {
+ var pg = Y.Node.create('<div></div>'),
+ bd = Y.get('body');
+ pg.setStyles({
+ top: '0',
+ left: '0',
+ position: 'absolute',
+ zIndex: '9999',
+ overflow: 'hidden',
+ backgroundColor: 'red',
+ display: 'none',
+ height: '5px',
+ width: '5px'
+ });
+ pg.set('id', Y.stamp(pg));
+ pg.addClass('yui-dd-shim');
+ if (bd.get('firstChild')) {
+ bd.insertBefore(pg, bd.get('firstChild'));
+ } else {
+ bd.appendChild(pg);
+ }
+ this._pg = pg;
+ this._pg.on('mouseup', Y.bind(this._end, this));
+ this._pg.on('mousemove', Y.bind(this._move, this));
+
+ var win = Y.get(window);
+ Y.on('window:resize', Y.bind(this._pg_size, this));
+ win.on('scroll', Y.bind(this._pg_size, this));
+ }
+ }, true);
+
+ Y.on('domready', Y.bind(Y.DD.DDM._createPG, Y.DD.DDM));
+