/* * jQuery UI Sortable @VERSION * * Copyright (c) 2008 AUTHORS.txt (http://ui.jquery.com/about) * Dual licensed under the MIT (MIT-LICENSE.txt) * and GPL (GPL-LICENSE.txt) licenses. * * http://docs.jquery.com/UI/Sortables * * Depends: * ui.core.js */ (function($) { $.widget("ui.sortable", $.extend({}, $.ui.mouse, { _init: function() { var o = this.options; this.containerCache = {}; this.element.addClass("ui-sortable"); //Get the items this.refresh(); //Let's determine if the items are floating this.floating = this.items.length ? (/left|right/).test(this.items[0].item.css('float')) : false; //Let's determine the parent's offset this.offset = this.element.offset(); //Initialize mouse events for interaction this._mouseInit(); }, destroy: function() { this.element .removeClass("ui-sortable ui-sortable-disabled") .removeData("sortable") .unbind(".sortable"); this._mouseDestroy(); for ( var i = this.items.length - 1; i >= 0; i-- ) this.items[i].item.removeData("sortable-item"); }, _mouseCapture: function(event, overrideHandle) { if (this.reverting) { return false; } if(this.options.disabled || this.options.type == 'static') return false; //We have to refresh the items data once first this._refreshItems(event); //Find out if the clicked node (or one of its parents) is a actual item in this.items var currentItem = null, self = this, nodes = $(event.target).parents().each(function() { if($.data(this, 'sortable-item') == self) { currentItem = $(this); return false; } }); if($.data(event.target, 'sortable-item') == self) currentItem = $(event.target); if(!currentItem) return false; if(this.options.handle && !overrideHandle) { var validHandle = false; $(this.options.handle, currentItem).find("*").andSelf().each(function() { if(this == event.target) validHandle = true; }); if(!validHandle) return false; } this.currentItem = currentItem; this._removeCurrentsFromItems(); return true; }, _mouseStart: function(event, overrideHandle, noActivation) { var o = this.options; this.currentContainer = this; //We only need to call refreshPositions, because the refreshItems call has been moved to mouseCapture this.refreshPositions(); //Create and append the visible helper this.helper = this.createHelper(event); /* * - Position generation - * This block generates everything position related - it's the core of draggables. */ this.margins = { //Cache the margins left: (parseInt(this.currentItem.css("marginLeft"),10) || 0), top: (parseInt(this.currentItem.css("marginTop"),10) || 0) }; this.offset = this.currentItem.offset(); //The element's absolute position on the page this.offset = { //Substract the margins from the element's absolute offset top: this.offset.top - this.margins.top, left: this.offset.left - this.margins.left }; this.offset.click = { //Where the click happened, relative to the element left: event.pageX - this.offset.left, top: event.pageY - this.offset.top }; this.offsetParent = this.helper.offsetParent(); //Get the offsetParent and cache its position var po = this.offsetParent.offset(); this.offsetParentBorders = { top: (parseInt(this.offsetParent.css("borderTopWidth"),10) || 0), left: (parseInt(this.offsetParent.css("borderLeftWidth"),10) || 0) }; this.offset.parent = { //Store its position plus border top: po.top + this.offsetParentBorders.top, left: po.left + this.offsetParentBorders.left }; this.originalPosition = this._generatePosition(event); //Generate the original position this.domPosition = { prev: this.currentItem.prev()[0], parent: this.currentItem.parent()[0] }; //Cache the former DOM position //If o.placeholder is used, create a new element at the given position with the class this.helperProportions = { width: this.helper.outerWidth(), height: this.helper.outerHeight() };//Cache the helper size if(o.helper == "original") { this._storedCSS = { position: this.currentItem.css("position"), top: this.currentItem.css("top"), left: this.currentItem.css("left"), clear: this.currentItem.css("clear") }; } else { this.currentItem.hide(); //Hide the original, won't cause anything bad this way } //Position it absolutely and add a helper class this.helper .css({ position: 'absolute', clear: 'both' }) .addClass('ui-sortable-helper'); //Create the placeholder this._createPlaceholder(); //Call plugins and callbacks this._propagate("start", event); //Recache the helper size if(!this._preserveHelperProportions) this.helperProportions = { width: this.helper.outerWidth(), height: this.helper.outerHeight() }; if(o.cursorAt) { if(o.cursorAt.left != undefined) this.offset.click.left = o.cursorAt.left; if(o.cursorAt.right != undefined) this.offset.click.left = this.helperProportions.width - o.cursorAt.right; if(o.cursorAt.top != undefined) this.offset.click.top = o.cursorAt.top; if(o.cursorAt.bottom != undefined) this.offset.click.top = this.helperProportions.height - o.cursorAt.bottom; } /* * - Position constraining - * Here we prepare position constraining like grid and containment. */ if(o.containment) { if(o.containment == 'parent') o.containment = this.helper[0].parentNode; if(o.containment == 'document' || o.containment == 'window') this.containment = [ 0 - this.offset.parent.left, 0 - this.offset.parent.top, $(o.containment == 'document' ? document : window).width() - this.offset.parent.left - this.helperProportions.width - this.margins.left - (parseInt(this.element.css("marginRight"),10) || 0), ($(o.containment == 'document' ? document : window).height() || document.body.parentNode.scrollHeight) - this.offset.parent.top - this.helperProportions.height - this.margins.top - (parseInt(this.element.css("marginBottom"),10) || 0) ]; if(!(/^(document|window|parent)$/).test(o.containment)) { var ce = $(o.containment)[0]; var co = $(o.containment).offset(); var over = ($(ce).css("overflow") != 'hidden'); this.containment = [ co.left + (parseInt($(ce).css("borderLeftWidth"),10) || 0) - this.offset.parent.left, co.top + (parseInt($(ce).css("borderTopWidth"),10) || 0) - this.offset.parent.top, co.left+(over ? Math.max(ce.scrollWidth,ce.offsetWidth) : ce.offsetWidth) - (parseInt($(ce).css("borderLeftWidth"),10) || 0) - this.offset.parent.left - this.helperProportions.width - this.margins.left - (parseInt(this.currentItem.css("marginRight"),10) || 0), co.top+(over ? Math.max(ce.scrollHeight,ce.offsetHeight) : ce.offsetHeight) - (parseInt($(ce).css("borderTopWidth"),10) || 0) - this.offset.parent.top - this.helperProportions.height - this.margins.top - (parseInt(this.currentItem.css("marginBottom"),10) || 0) ]; } } //Post 'activate' events to possible containers if(!noActivation) { for (var i = this.containers.length - 1; i >= 0; i--) { this.containers[i]._propagate("activate", event, this); } } //Prepare possible droppables if($.ui.ddmanager) $.ui.ddmanager.current = this; if ($.ui.ddmanager && !o.dropBehaviour) $.ui.ddmanager.prepareOffsets(this, event); this.dragging = true; this._mouseDrag(event); //Execute the drag once - this causes the helper not to be visible before getting its correct position return true; }, _mouseDrag: function(event) { //Compute the helpers position this.position = this._generatePosition(event); this.positionAbs = this._convertPositionTo("absolute"); if (!this.lastPositionAbs) { this.lastPositionAbs = this.positionAbs; } //Call the internal plugins $.ui.plugin.call(this, "sort", [event, this._ui()]); //Regenerate the absolute position used for position checks this.positionAbs = this._convertPositionTo("absolute"); //Set the helper's position if (this.helper) { this.helper[0].style.left = this.position.left+'px'; this.helper[0].style.top = this.position.top+'px'; } //Rearrange for (var i = this.items.length - 1; i >= 0; i--) { var item = this.items[i], intersection = this._intersectsWithPointer(item); if (!intersection) continue; var itemChecked = this.items[i].item[0]; if(itemChecked != this.currentItem[0] //cannot intersect with itself && this.placeholder[intersection == 1 ? "next" : "prev"]()[0] != itemChecked //no useless actions that have been done before && !$.ui.contains(this.placeholder[0], itemChecked) //no action if the item moved is the parent of the item checked && (this.options.type == 'semi-dynamic' ? !$.ui.contains(this.element[0], itemChecked) : true) ) { this.direction = intersection == 1 ? "down" : "up"; if (this.options.tolerance == "pointer") { this.options.sortIndicator.call(this, event, item); } else if (this.options.tolerance == "guess" && this._intersectsGuess(item)) { this.options.sortIndicator.call(this, event, item); } this._propagate("change", event); //Call plugins and callbacks break; } } //Post events to containers this._contactContainers(event); //Interconnect with droppables if($.ui.ddmanager) $.ui.ddmanager.drag(this, event); //Call callbacks this.element.triggerHandler("sort", [event, this._ui()], this.options["sort"]); this.lastPositionAbs = this.positionAbs; return false; }, _mouseStop: function(event, noPropagation) { if(!event) return; //If we are using droppables, inform the manager about the drop if ($.ui.ddmanager && !this.options.dropBehaviour) $.ui.ddmanager.drop(this, event); if(this.options.revert) { var self = this; var cur = self.placeholder.offset(); self.reverting = true; $(this.helper).animate({ left: cur.left - this.offset.parent.left - self.margins.left + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollLeft), top: cur.top - this.offset.parent.top - self.margins.top + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollTop) }, parseInt(this.options.revert, 10) || 500, function() { self._clear(event); }); } else { this._clear(event, noPropagation); } return false; }, cancel: function() { if(this.dragging) { this._mouseUp(); if(this.options.helper == "original") this.currentItem.css(this._storedCSS).removeClass("ui-sortable-helper"); else this.currentItem.show(); //Post deactivating events to containers for (var i = this.containers.length - 1; i >= 0; i--){ this.containers[i]._propagate("deactivate", null, this); if(this.containers[i].containerCache.over) { this.containers[i]._propagate("out", null, this); this.containers[i].containerCache.over = 0; } } } //$(this.placeholder[0]).remove(); would have been the jQuery way - unfortunately, it unbinds ALL events from the original node! if(this.placeholder[0].parentNode) this.placeholder[0].parentNode.removeChild(this.placeholder[0]); if(this.options.helper != "original" && this.helper && this.helper[0].parentNode) this.helper.remove(); $.extend(this, { helper: null, dragging: false, reverting: false, _noFinalSort: null }); if(this.domPosition.prev) { $(this.domPosition.prev).after(this.currentItem); } else { $(this.domPosition.parent).prepend(this.currentItem); } return true; }, serialize: function(o) { var items = this._getItemsAsjQuery(o && o.connected); var str = []; o = o || {}; $(items).each(function() { var res = ($(o.item || this).attr(o.attribute || 'id') || '').match(o.expression || (/(.+)[-=_](.+)/)); if(res) str.push((o.key || res[1]+'[]')+'='+(o.key && o.expression ? res[1] : res[2])); }); return str.join('&'); }, toArray: function(o) { var items = this._getItemsAsjQuery(o && o.connected); var ret = []; o = o || {}; items.each(function() { ret.push($(o.item || this).attr(o.attribute || 'id') || ''); }); return ret; }, /* Be careful with the following core functions */ _intersectsWith: function(item) { var x1 = this.positionAbs.left, x2 = x1 + this.helperProportions.width, y1 = this.positionAbs.top, y2 = y1 + this.helperProportions.height; var l = item.left, r = l + item.width, t = item.top, b = t + item.height; var dyClick = this.offset.click.top, dxClick = this.offset.click.left; var isOverElement = (y1 + dyClick) > t && (y1 + dyClick) < b && (x1 + dxClick) > l && (x1 + dxClick) < r; if(this.options.tolerance == "pointer" || this.options.forcePointerForContainers || (this.options.tolerance == "guess" && this.helperProportions[this.floating ? 'width' : 'height'] > item[this.floating ? 'width' : 'height'])) { return isOverElement; } else { return (l < x1 + (this.helperProportions.width / 2) // Right Half && x2 - (this.helperProportions.width / 2) < r // Left Half && t < y1 + (this.helperProportions.height / 2) // Bottom Half && y2 - (this.helperProportions.height / 2) < b ); // Top Half } }, _intersectsWithPointer: function(item) { var dyClick = this.offset.click.top, dxClick = this.offset.click.left; var helperTop = this.positionAbs.top, helperLeft = this.positionAbs.left; var itemHeight = item.height, itemWidth = item.width; var itemTop = item.top, itemLeft = item.left; if (this.cancelIntersection) { return false; } var isOverElementHeight = $.ui.isOverAxis(helperTop + dyClick, itemTop, itemHeight); var isOverElementWidth = $.ui.isOverAxis(helperLeft + dxClick, itemLeft, itemWidth); var isOverElement = isOverElementHeight && isOverElementWidth; var verticalDirection = this._getDragVerticalDirection(); var horizontalDirection = this._getDragHorizontalDirection(); if (!isOverElement) return false; if (this.floating) { if (!horizontalDirection) { return verticalDirection == "down" ? 2 : 1; } return horizontalDirection == "right" ? 2 : 1; } else { if (!verticalDirection) { return false; } return verticalDirection == "down" ? 2 : 1; } return false; }, _intersectsGuess: function(item) { var dyClick = this.offset.click.top, dxClick = this.offset.click.left; var helperTop = this.positionAbs.top, helperLeft = this.positionAbs.left; var itemHeight = item.height, itemWidth = item.width; var itemTop = item.top, itemLeft = item.left; var isOverBottomHalf = $.ui.isOverAxis(helperTop + dyClick, itemTop + (itemHeight/2), itemHeight); var isOverTopHalf = !isOverBottomHalf; var isOverRightHalf = $.ui.isOverAxis(helperLeft + dxClick, itemLeft + (itemWidth/2), itemWidth); var isOverLeftHalf = !isOverRightHalf; var verticalDirection = this._getDragVerticalDirection(); var horizontalDirection = this._getDragHorizontalDirection(); var verticalIntersection = function() { if (!verticalDirection) { return false; } if (verticalDirection == "down" && isOverBottomHalf || verticalDirection == "up" && isOverTopHalf) { return true; } }; var horizontalIntersection = function() { if (!horizontalDirection) { return verticalIntersection(); } if (horizontalDirection == "left" && isOverLeftHalf || horizontalDirection == "right" && isOverRightHalf) { return true; } }; if (this.floating) { return horizontalIntersection(); } else { return verticalIntersection(); } return false; }, _getDragVerticalDirection: function() { var helperTop = this.positionAbs.top; var lastTop = this.lastPositionAbs.top; var delta = helperTop - lastTop; if (delta == 0) { return false; } var direction = delta > 0 ? "down" : "up"; return direction; }, _getDragHorizontalDirection: function() { var helperLeft = this.positionAbs.left; var lastLeft = this.lastPositionAbs.left; var delta = helperLeft - lastLeft; if (delta == 0) { return false; } var direction = delta > 0 ? "right" : "left"; return direction; }, refresh: function(event) { this._refreshItems(event); this.refreshPositions(); }, _getItemsAsjQuery: function(connected) { var self = this; var items = []; var queries = []; if(this.options.connectWith && connected) { for (var i = this.options.connectWith.length - 1; i >= 0; i--){ var cur = $(this.options.connectWith[i]); for (var j = cur.length - 1; j >= 0; j--){ var inst = $.data(cur[j], 'sortable'); if(inst && inst != this && !inst.options.disabled) { queries.push([$.isFunction(inst.options.items) ? inst.options.items.call(inst.element) : $(inst.options.items, inst.element).not(".ui-sortable-helper"), inst]); } }; }; } queries.push([$.isFunction(this.options.items) ? this.options.items.call(this.element, null, { options: this.options, item: this.currentItem }) : $(this.options.items, this.element).not(".ui-sortable-helper"), this]); for (var i = queries.length - 1; i >= 0; i--){ queries[i][0].each(function() { items.push(this); }); }; return $(items); }, _removeCurrentsFromItems: function() { var list = this.currentItem.find(":data(sortable-item)"); for (var i=0; i < this.items.length; i++) { for (var j=0; j < list.length; j++) { if(list[j] == this.items[i].item[0]) this.items.splice(i,1); }; }; }, _refreshItems: function(event) { this.items = []; this.containers = [this]; var items = this.items; var self = this; var queries = [[$.isFunction(this.options.items) ? this.options.items.call(this.element[0], event, { item: this.currentItem }) : $(this.options.items, this.element), this]]; if(this.options.connectWith) { for (var i = this.options.connectWith.length - 1; i >= 0; i--){ var cur = $(this.options.connectWith[i]); for (var j = cur.length - 1; j >= 0; j--){ var inst = $.data(cur[j], 'sortable'); if(inst && inst != this && !inst.options.disabled) { queries.push([$.isFunction(inst.options.items) ? inst.options.items.call(inst.element[0], event, { item: this.currentItem }) : $(inst.options.items, inst.element), inst]); this.containers.push(inst); } }; }; } for (var i = queries.length - 1; i >= 0; i--) { var targetData = queries[i][1]; var _queries = queries[i][0]; for (var j=0, queriesLength = _queries.length; j < queriesLength; j++) { var item = $(_queries[j]); item.data('sortable-item', targetData); // Data for target checking (mouse manager) items.push({ item: item, instance: targetData, width: 0, height: 0, left: 0, top: 0 }); }; }; }, refreshPositions: function(fast) { //This has to be redone because due to the item being moved out/into the offsetParent, the offsetParent's position will change if(this.offsetParent) { var po = this.offsetParent.offset(); this.offset.parent = { top: po.top + this.offsetParentBorders.top, left: po.left + this.offsetParentBorders.left }; } for (var i = this.items.length - 1; i >= 0; i--){ var item = this.items[i]; //We ignore calculating positions of all connected containers when we're not over them if(item.instance != this.currentContainer && this.currentContainer && item.item[0] != this.currentItem[0]) continue; var t = this.options.toleranceElement ? $(this.options.toleranceElement, item.item) : item.item; if (!fast) { if (this.options.accurate) { item.width = t.width(); item.height = t.height(); } else { item.width = t[0].offsetWidth; item.height = t[0].offsetHeight; } } var p = t.offset(); item.left = p.left; item.top = p.top; }; if(this.options.custom && this.options.custom.refreshContainers) { this.options.custom.refreshContainers.call(this); } else { for (var i = this.containers.length - 1; i >= 0; i--){ var p = this.containers[i].element.offset(); this.containers[i].containerCache.left = p.left; this.containers[i].containerCache.top = p.top; this.containers[i].containerCache.width = this.containers[i].element.outerWidth(); this.containers[i].containerCache.height = this.containers[i].element.outerHeight(); }; } }, _createPlaceholder: function(that) { var self = that || this, o = self.options; if(!o.placeholder || o.placeholder.constructor == String) { var className = o.placeholder; o.placeholder = { element: function() { var el = $(document.createElement(self.currentItem[0].nodeName)) .addClass(className || self.currentItem[0].className+" ui-sortable-placeholder") .removeClass('ui-sortable-helper')[0]; if(!className) { el.style.visibility = "hidden"; document.body.appendChild(el); el.innerHTML = self.currentItem[0].innerHTML.replace(/name\=\"[^\"\']+\"/g, ''); //Name attributes are removed, otherwice causes elements to be unchecked document.body.removeChild(el); }; return el; }, update: function(container, p) { if(className && !o.forcePlaceholderSize) return; if(!p.height()) { p.height(self.currentItem.innerHeight() - parseInt(self.currentItem.css('paddingTop')||0, 10) - parseInt(self.currentItem.css('paddingBottom')||0, 10)); }; if(!p.width()) { p.width(self.currentItem.innerWidth() - parseInt(self.currentItem.css('paddingLeft')||0, 10) - parseInt(self.currentItem.css('paddingRight')||0, 10)); }; } }; } //Create the placeholder self.placeholder = $(o.placeholder.element.call(self.element, self.currentItem)); //Append it after the actual current item self.currentItem.after(self.placeholder); //Update the size of the placeholder (TODO: Logic to fuzzy, see line 316/317) o.placeholder.update(self, self.placeholder); }, _contactContainers: function(event) { for (var i = this.containers.length - 1; i >= 0; i--){ if(this._intersectsWith(this.containers[i].containerCache)) { if(!this.containers[i].containerCache.over) { if(this.currentContainer != this.containers[i]) { //When entering a new container, we will find the item with the least distance and append our item near it var dist = 10000; var itemWithLeastDistance = null; var base = this.positionAbs[this.containers[i].floating ? 'left' : 'top']; for (var j = this.items.length - 1; j >= 0; j--) { if(!$.ui.contains(this.containers[i].element[0], this.items[j].item[0])) continue; var cur = this.items[j][this.containers[i].floating ? 'left' : 'top']; if(Math.abs(cur - base) < dist) { dist = Math.abs(cur - base); itemWithLeastDistance = this.items[j]; } } if(!itemWithLeastDistance && !this.options.dropOnEmpty) //Check if dropOnEmpty is enabled continue; this.currentContainer = this.containers[i]; itemWithLeastDistance ? this.options.sortIndicator.call(this, event, itemWithLeastDistance, null, true) : this.options.sortIndicator.call(this, event, null, this.containers[i].element, true); this._propagate("change", event); //Call plugins and callbacks this.containers[i]._propagate("change", event, this); //Call plugins and callbacks //Update the placeholder this.options.placeholder.update(this.currentContainer, this.placeholder); } this.containers[i]._propagate("over", event, this); this.containers[i].containerCache.over = 1; } } else { if(this.containers[i].containerCache.over) { this.containers[i]._propagate("out", event, this); this.containers[i].containerCache.over = 0; } } }; }, createHelper: function(event) { var o = this.options; var helper = typeof o.helper == 'function' ? $(o.helper.apply(this.element[0], [event, this.currentItem])) : (o.helper == "original" ? this.currentItem : this.currentItem.clone()); if (!helper.parents('body').length) $(o.appendTo != 'parent' ? o.appendTo : this.currentItem[0].parentNode)[0].appendChild(helper[0]); //Add the helper to the DOM if that didn't happen already return helper; }, _convertPositionTo: function(d, pos) { if(!pos) pos = this.position; var mod = d == "absolute" ? 1 : -1; return { top: ( pos.top // the calculated relative position + this.offset.parent.top * mod // The offsetParent's offset without borders (offset + border) - (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollTop) * mod // The offsetParent's scroll position + this.margins.top * mod //Add the margin (you don't want the margin counting in intersection methods) ), left: ( pos.left // the calculated relative position + this.offset.parent.left * mod // The offsetParent's offset without borders (offset + border) - (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollLeft) * mod // The offsetParent's scroll position + this.margins.left * mod //Add the margin (you don't want the margin counting in intersection methods) ) }; }, _generatePosition: function(event) { var o = this.options; var position = { top: ( event.pageY // The absolute mouse position - this.offset.click.top // Click offset (relative to the element) - this.offset.parent.top // The offsetParent's offset without borders (offset + border) + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollTop) // The offsetParent's scroll position, not if the element is fixed ), left: ( event.pageX // The absolute mouse position - this.offset.click.left // Click offset (relative to the element) - this.offset.parent.left // The offsetParent's offset without borders (offset + border) + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollLeft) // The offsetParent's scroll position, not if the element is fixed ) }; if(!this.originalPosition) return position; //If we are not dragging yet, we won't check for options /* * - Position constraining - * Constrain the position to a mix of grid, containment. */ if(this.containment) { if(position.left < this.containment[0]) position.left = this.containment[0]; if(position.top < this.containment[1]) position.top = this.containment[1]; if(position.left > this.containment[2]) position.left = this.containment[2]; if(position.top > this.containment[3]) position.top = this.containment[3]; } if(o.grid) { var top = this.originalPosition.top + Math.round((position.top - this.originalPosition.top) / o.grid[1]) * o.grid[1]; position.top = this.containment ? (!(top < this.containment[1] || top > this.containment[3]) ? top : (!(top < this.containment[1]) ? top - o.grid[1] : top + o.grid[1])) : top; var left = this.originalPosition.left + Math.round((position.left - this.originalPosition.left) / o.grid[0]) * o.grid[0]; position.left = this.containment ? (!(left < this.containment[0] || left > this.containment[2]) ? left : (!(left < this.containment[0]) ? left - o.grid[0] : left + o.grid[0])) : left; } return position; }, _rearrange: function(event, i, a, hardRefresh) { a ? a[0].appendChild(this.placeholder[0]) : i.item[0].parentNode.insertBefore(this.placeholder[0], (this.direction == 'down' ? i.item[0] : i.item[0].nextSibling)); //Various things done here to improve the performance: // 1. we create a setTimeout, that calls refreshPositions // 2. on the instance, we have a counter variable, that get's higher after every append // 3. on the local scope, we copy the counter variable, and check in the timeout, if it's still the same // 4. this lets only the last addition to the timeout stack through this.counter = this.counter ? ++this.counter : 1; var self = this, counter = this.counter; window.setTimeout(function() { if(counter == self.counter) self.refreshPositions(!hardRefresh); //Precompute after each DOM insertion, NOT on mousemove },0); }, _clear: function(event, noPropagation) { this.reverting = false; //We first have to update the dom position of the actual currentItem if(!this._noFinalSort) this.placeholder.before(this.currentItem); this._noFinalSort = null; if(this.options.helper == "original") this.currentItem.css(this._storedCSS).removeClass("ui-sortable-helper"); else this.currentItem.show(); if(this.domPosition.prev != this.currentItem.prev().not(".ui-sortable-helper")[0] || this.domPosition.parent != this.currentItem.parent()[0]) this._propagate("update", event, null, noPropagation); //Trigger update callback if the DOM position has changed if(!$.ui.contains(this.element[0], this.currentItem[0])) { //Node was moved out of the current element this._propagate("remove", event, null, noPropagation); for (var i = this.containers.length - 1; i >= 0; i--){ if($.ui.contains(this.containers[i].element[0], this.currentItem[0])) { this.containers[i]._propagate("update", event, this, noPropagation); this.containers[i]._propagate("receive", event, this, noPropagation); } }; }; //Post events to containers for (var i = this.containers.length - 1; i >= 0; i--){ this.containers[i]._propagate("deactivate", event, this, noPropagation); if(this.containers[i].containerCache.over) { this.containers[i]._propagate("out", event, this); this.containers[i].containerCache.over = 0; } } this.dragging = false; if(this.cancelHelperRemoval) { this._propagate("beforeStop", event, null, noPropagation); this._propagate("stop", event, null, noPropagation); return false; } this._propagate("beforeStop", event, null, noPropagation); //$(this.placeholder[0]).remove(); would have been the jQuery way - unfortunately, it unbinds ALL events from the original node! this.placeholder[0].parentNode.removeChild(this.placeholder[0]); if(this.options.helper != "original") this.helper.remove(); this.helper = null; this._propagate("stop", event, null, noPropagation); return true; }, _propagate: function(n, event, inst, noPropagation) { $.ui.plugin.call(this, n, [event, this._ui(inst)]); var dontCancel = !noPropagation ? this.element.triggerHandler(n == "sort" ? n : "sort"+n, [event, this._ui(inst)], this.options[n]) : true; if(dontCancel === false) this.cancel(); }, plugins: {}, _ui: function(inst) { var self = inst || this; return { helper: self.helper, placeholder: self.placeholder || $([]), position: self.position, absolutePosition: self.positionAbs, item: self.currentItem, sender: inst ? inst.element : null }; } })); $.extend($.ui.sortable, { getter: "serialize toArray", version: "@VERSION", defaults: { accurate: false, appendTo: "parent", cancel: ":input", delay: 0, distance: 1, dropOnEmpty: true, forcePlaceholderSize: false, helper: "original", items: '> *', scope: "default", scroll: true, scrollSensitivity: 20, scrollSpeed: 20, sortIndicator: $.ui.sortable.prototype._rearrange, tolerance: "guess", zIndex: 1000 } }); /* * Sortable Extensions */ $.ui.plugin.add("sortable", "axis", { sort: function(event, ui) { var i = $(this).data('sortable'), o = i.options; if(o.axis == "y") i.position.left = i.originalPosition.left; if(o.axis == "x") i.position.top = i.originalPosition.top; } }); $.ui.plugin.add("sortable", "cursor", { start: function(event, ui) { var t = $('body'), i = $(this).data('sortable'); if (t.css("cursor")) i.options._cursor = t.css("cursor"); t.css("cursor", i.options.cursor); }, beforeStop: function(event, ui) { var i = $(this).data('sortable'); if (i.options._cursor) $('body').css("cursor", i.options._cursor); } }); $.ui.plugin.add("sortable", "opacity", { start: function(event, ui) { var t = ui.helper, i = $(this).data('sortable'); if(t.css("opacity")) i.options._opacity = t.css("opacity"); t.css('opacity', i.options.opacity); }, beforeStop: function(event, ui) { var i = $(this).data('sortable'); if(i.options._opacity) $(ui.helper).css('opacity', i.options._opacity); } }); $.ui.plugin.add("sortable", "scroll", { start: function(event, ui) { var i = $(this).data('sortable'), o = i.options; i.overflowY = function(el) { do { if(/auto|scroll/.test(el.css('overflow')) || (/auto|scroll/).test(el.css('overflow-y'))) return el; el = el.parent(); } while (el[0].parentNode); return $(document); }(i.currentItem); i.overflowX = function(el) { do { if(/auto|scroll/.test(el.css('overflow')) || (/auto|scroll/).test(el.css('overflow-x'))) return el; el = el.parent(); } while (el[0].parentNode); return $(document); }(i.currentItem); if(i.overflowY[0] != document && i.overflowY[0].tagName != 'HTML') i.overflowYOffset = i.overflowY.offset(); if(i.overflowX[0] != document && i.overflowX[0].tagName != 'HTML') i.overflowXOffset = i.overflowX.offset(); }, sort: function(event, ui) { var i = $(this).data('sortable'), o = i.options; if(i.overflowY[0] != document && i.overflowY[0].tagName != 'HTML') { if((i.overflowYOffset.top + i.overflowY[0].offsetHeight) - event.pageY < o.scrollSensitivity) i.overflowY[0].scrollTop = i.overflowY[0].scrollTop + o.scrollSpeed; if(event.pageY - i.overflowYOffset.top < o.scrollSensitivity) i.overflowY[0].scrollTop = i.overflowY[0].scrollTop - o.scrollSpeed; } else { if(event.pageY - $(document).scrollTop() < o.scrollSensitivity) $(document).scrollTop($(document).scrollTop() - o.scrollSpeed); if($(window).height() - (event.pageY - $(document).scrollTop()) < o.scrollSensitivity) $(document).scrollTop($(document).scrollTop() + o.scrollSpeed); } if(i.overflowX[0] != document && i.overflowX[0].tagName != 'HTML') { if((i.overflowXOffset.left + i.overflowX[0].offsetWidth) - event.pageX < o.scrollSensitivity) i.overflowX[0].scrollLeft = i.overflowX[0].scrollLeft + o.scrollSpeed; if(event.pageX - i.overflowXOffset.left < o.scrollSensitivity) i.overflowX[0].scrollLeft = i.overflowX[0].scrollLeft - o.scrollSpeed; } else { if(event.pageX - $(document).scrollLeft() < o.scrollSensitivity) $(document).scrollLeft($(document).scrollLeft() - o.scrollSpeed); if($(window).width() - (event.pageX - $(document).scrollLeft()) < o.scrollSensitivity) $(document).scrollLeft($(document).scrollLeft() + o.scrollSpeed); } } }); $.ui.plugin.add("sortable", "zIndex", { start: function(event, ui) { var t = ui.helper, i = $(this).data('sortable'); if(t.css("zIndex")) i.options._zIndex = t.css("zIndex"); t.css('zIndex', i.options.zIndex); }, beforeStop: function(event, ui) { var i = $(this).data('sortable'); if(i.options._zIndex) $(ui.helper).css('zIndex', i.options._zIndex); } }); })(jQuery);