ddm-drop.js revision c8b61a25e72a46a8725ead6f5bbae7d00b502a33
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * Extends the dd-ddm Class to add support for the placement of Drop Target shims inside the viewport shim. It also handles all Drop Target related events and interactions.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @module dd
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @submodule dd-ddm-drop
daeb6d531149c45a2ceb543ae2cf1e56e5235bbeDav Glass //TODO CSS class name for the bestMatch..
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @property _noShim
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description This flag turns off the use of the mouseover/mouseout shim. It should not be used unless you know what you are doing.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @type {Boolean}
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @property _activeShims
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description Placeholder for all active shims on the page
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @type {Array}
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @method _hasActiveShim
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description This method checks the _activeShims Object to see if there is a shim active.
f69da96c272d2efe7f43da5150c13c0fe6899646Dav Glass * @return {Boolean}
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass return true;
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @method _addActiveShim
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description Adds a Drop Target to the list of active shims
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @param {Object} d The Drop instance to add to the list.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass _addActiveShim: function(d) {
b7bd9aa409761c479bb0a2e5794295d35ebe24eaDav Glass * @method _removeActiveShim
b7bd9aa409761c479bb0a2e5794295d35ebe24eaDav Glass * @description Removes a Drop Target to the list of active shims
b7bd9aa409761c479bb0a2e5794295d35ebe24eaDav Glass * @param {Object} d The Drop instance to remove from the list.
f8b3e367f0b400ff8b4feeb35c56d9387a31f9e0Dav Glass * @method syncActiveShims
f8b3e367f0b400ff8b4feeb35c56d9387a31f9e0Dav Glass * @description This method will sync the position of the shims on the Drop Targets that are currently active.
f8b3e367f0b400ff8b4feeb35c56d9387a31f9e0Dav Glass * @param {Boolean} force Resize/sync all Targets.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass var drops = ((force) ? this.targets : this._lookup());
323ca860aba4b2515b560796e2322d5eaae57e5aDav Glass * @property mode
323ca860aba4b2515b560796e2322d5eaae57e5aDav Glass * @description The mode that the drag operations will run in 0 for Point, 1 for Intersect, 2 for Strict
edefd42ddde54932d14d9150369570db47822ab5Dav Glass * @type Number
323ca860aba4b2515b560796e2322d5eaae57e5aDav Glass * @property POINT
323ca860aba4b2515b560796e2322d5eaae57e5aDav Glass * @description In point mode, a Drop is targeted by the cursor being over the Target
323ca860aba4b2515b560796e2322d5eaae57e5aDav Glass * @type Number
9002d9b85f99bb503c702f12a20f829f732d22f8Dav Glass * @property INTERSECT
9002d9b85f99bb503c702f12a20f829f732d22f8Dav Glass * @description In intersect mode, a Drop is targeted by "part" of the drag node being over the Target
9002d9b85f99bb503c702f12a20f829f732d22f8Dav Glass * @type Number
9002d9b85f99bb503c702f12a20f829f732d22f8Dav Glass * @property STRICT
9002d9b85f99bb503c702f12a20f829f732d22f8Dav Glass * @description In strict mode, a Drop is targeted by the "entire" drag node being over the Target
a2621d519886de7d60c30c5a0850f5c17fd2fb36Dav Glass * @type Number
762b21413a7bbc38b5c7b2d94385fb44f26f9d39Dav Glass * @property useHash
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description Should we only check targets that are in the viewport on drags (for performance), default: true
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @type {Boolean}
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @property activeDrop
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description A reference to the active Drop Target
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @type {Object}
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @property validDrops
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description An array of the valid Drop Targets for this interaction.
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @type {Array}
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass //TODO Change array/object literals to be in sync..
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @property otherDrops
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description An object literal of Other Drop Targets that we encountered during this interaction (in the case of overlapping Drop Targets)
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @type {Object}
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @property targets
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description All of the Targets
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @type {Array}
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @method _addValid
91085c33d52b89808c10ff61e5a94d7b35d57d65Dav Glass * @description Add a Drop Target to the list of Valid Targets. This list get's regenerated on each new drag operation.
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @param {Object} drop
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @return {Self}
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @chainable
91085c33d52b89808c10ff61e5a94d7b35d57d65Dav Glass return this;
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @method _removeValid
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description Removes a Drop Target from the list of Valid Targets. This list get's regenerated on each new drag operation.
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @param {Object} drop
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @return {Self}
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @chainable
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass if (v !== drop) {
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass return this;
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @method isOverTarget
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description Check to see if the Drag element is over the target, method varies on current mode
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @param {Object} drop The drop to check against
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @return {Boolean}
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass if (this.activeDrag.get('dragMode') == this.STRICT) {
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass return this.activeDrag.get('dragNode').inRegion(drop.region, true, this.activeDrag.region);
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass return false;
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass return false;
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass return false;
91085c33d52b89808c10ff61e5a94d7b35d57d65Dav Glass * @method clearCache
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description Clears the cache data used for this interaction.
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass clearCache: function() {
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @method _activateTargets
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass * @description Clear the cache and activate the shims of all the targets
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass * @method getBestMatch
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass * @description This method will gather the area for all potential targets and see which has the hightest covered area and return it.
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass * @param {Array} drops An Array of drops to scan for the best match.
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass * @param {Boolean} all If present, it returns an Array. First item is best match, second is an Array of the other items in the original Array.
91085c33d52b89808c10ff61e5a94d7b35d57d65Dav Glass * @return {Object or Array}
e08067d50c8d5e4692441db53bba084c7a667e0aDav Glass var inter = this.activeDrag.get('dragNode').intersect(v.get('node'));
91085c33d52b89808c10ff61e5a94d7b35d57d65Dav Glass //TODO Sort the others in numeric order by area covered..
e08067d50c8d5e4692441db53bba084c7a667e0aDav Glass if (v !== biggest) {
e08067d50c8d5e4692441db53bba084c7a667e0aDav Glass * @method _deactivateTargets
e08067d50c8d5e4692441db53bba084c7a667e0aDav Glass * @description This method fires the drop:hit, drag:drophit, drag:dropmiss methods and deactivates the shims..
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass //TODO why is this check so hard??
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass if (activeDrag && activeDrop && this.otherDrops[activeDrop]) {
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass //TODO otherDrops -- private..
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass activeDrag.get('node').removeClass(this.CSS_PREFIX + '-drag-over');
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass activeDrop.fire('drop:hit', { drag: activeDrag, drop: activeDrop, others: other });
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass activeDrag.fire('drag:drophit', { drag: activeDrag, drop: activeDrop, others: other });
e08067d50c8d5e4692441db53bba084c7a667e0aDav Glass } else if (activeDrag) {
b80d65233fd7492f4b6487349f5364b9a8ca019eDav Glass activeDrag.get('node').removeClass(this.CSS_PREFIX + '-drag-over');
5cbdc947eb0c9c5e840d59ff8e1dd49a0e2a1887Dav Glass activeDrag.fire('drag:dropmiss', { pageX: activeDrag.lastXY[0], pageY: activeDrag.lastXY[1] });
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @method _dropMove
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description This method is called when the move method is called on the Drag Object.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass _dropMove: function() {
762b21413a7bbc38b5c7b2d94385fb44f26f9d39Dav Glass * @method _lookup
762b21413a7bbc38b5c7b2d94385fb44f26f9d39Dav Glass * @description Filters the list of Drops down to those in the viewport.
762b21413a7bbc38b5c7b2d94385fb44f26f9d39Dav Glass * @return {Array} The valid Drop Targets that are in the viewport.
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass _lookup: function() {
9d0be4bedcaad945c505994577198223ffc4ed9eDav Glass //Only scan drop shims that are in the Viewport
9d0be4bedcaad945c505994577198223ffc4ed9eDav Glass if (v.shim && v.shim.inViewportRegion(false, v.region)) {
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @method _handleTargetOver
762b21413a7bbc38b5c7b2d94385fb44f26f9d39Dav Glass * @description This method execs _handleTargetOver on all valid Drop Targets
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @method _regTarget
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @description Add the passed in Target to the targets collection
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @param {Object} t The Target to add to the targets collection
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass _regTarget: function(t) {
998d2791b549446db8394dc80d46a94a247857d9Dav Glass * @method _unregTarget
998d2791b549446db8394dc80d46a94a247857d9Dav Glass * @description Remove the passed in Target from the targets collection
998d2791b549446db8394dc80d46a94a247857d9Dav Glass * @param {Object} drop The Target to remove from the targets collection
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass if (v !== drop) {
dbf2c770f8178b12e8fe3c36bfa29df58ef13959Dav Glass * @method getDrop
b7bd9aa409761c479bb0a2e5794295d35ebe24eaDav Glass * @description Get a valid Drop instance back from a Node or a selector string, false otherwise
b7bd9aa409761c479bb0a2e5794295d35ebe24eaDav Glass * @param {String/Object} node The Node instance or Selector string to check for a valid Drop Object
b7bd9aa409761c479bb0a2e5794295d35ebe24eaDav Glass * @return {Object}
323ca860aba4b2515b560796e2322d5eaae57e5aDav Glass var drop = false,
323ca860aba4b2515b560796e2322d5eaae57e5aDav Glass if (n instanceof Y.Node) {
e20a95dc78bf51b6544e7bfb4e53ed190ecec3c9Dav Glass}, '@VERSION@' ,{requires:['dd-ddm'], skinnable:false});