From 8f029c395501a959c8f6739520bb7b3e7cb1ec48 Mon Sep 17 00:00:00 2001 From: RubaXa Date: Sun, 28 Sep 2014 11:53:21 +0400 Subject: [PATCH] #96: + 'webkit' prefix --- Sortable.js | 22 +++++++++++++++------- Sortable.min.js | 2 +- 2 files changed, 16 insertions(+), 8 deletions(-) diff --git a/Sortable.js b/Sortable.js index 821078b..356a810 100644 --- a/Sortable.js +++ b/Sortable.js @@ -28,7 +28,6 @@ , lastEl , lastCSS - , lastRect , activeGroup @@ -84,7 +83,7 @@ ghostClass: 'sortable-ghost', ignore: 'a, img', filter: null, - animation: 150 + animation: 0 }; // Set default options @@ -387,6 +386,7 @@ if (ms) { var currentRect = target.getBoundingClientRect(); + _css(target, 'transition', 'none'); _css(target, 'transform', 'translate3d(' + (prevRect.left - currentRect.left) + 'px,' + (prevRect.top - currentRect.top) + 'px,0)' @@ -394,7 +394,7 @@ target.offsetWidth; // repaint - _css(target, 'transition', 'transform ' + ms + 'ms'); + _css(target, 'transition', 'all ' + ms + 'ms'); _css(target, 'transform', 'translate3d(0,0,0)'); clearTimeout(target.animated); @@ -628,7 +628,9 @@ function _css(el, prop, val){ - if( el && el.style ){ + var style = el && el.style; + + if( style ){ if( val === void 0 ){ if( document.defaultView && document.defaultView.getComputedStyle ){ val = document.defaultView.getComputedStyle(el, ''); @@ -636,9 +638,15 @@ else if( el.currentStyle ){ val = el.currentStyle; } - return prop === void 0 ? val : val[prop]; - } else { - el.style[prop] = val + (typeof val === 'string' ? '' : 'px'); + + return prop === void 0 ? val : val[prop]; + } + else { + if (!(prop in style)) { + prop = '-webkit-' + prop; + } + + style[prop] = val + (typeof val === 'string' ? '' : 'px'); } } } diff --git a/Sortable.min.js b/Sortable.min.js index 5aefe97..fb8f2f6 100644 --- a/Sortable.min.js +++ b/Sortable.min.js @@ -1,2 +1,2 @@ /*! Sortable 0.6.0 - MIT | git://github.com/rubaxa/Sortable.git */ -!function(a){"use strict";"function"==typeof define&&define.amd?define(a):"undefined"!=typeof module&&"undefined"!=typeof module.exports?module.exports=a():window.Sortable=a()}(function(){"use strict";function a(a,c){this.el=a,this.options=c=c||{};var d={group:Math.random(),store:null,handle:null,draggable:a.children[0]&&a.children[0].nodeName||(/[uo]l/i.test(a.nodeName)?"li":"*"),ghostClass:"sortable-ghost",ignore:"a, img",filter:null,animation:150};for(var f in d)c[f]=c[f]||d[f];E.forEach(function(d){c[d]=b(this,c[d]||F),e(a,d.substr(2).toLowerCase(),c[d])},this),a[w]=c.group;for(var g in this)"_"===g.charAt(0)&&(this[g]=b(this,this[g]));e(a,"mousedown",this._onTapStart),e(a,"touchstart",this._onTapStart),A&&e(a,"selectstart",this._onTapStart),e(a,"dragover",this._onDragOver),e(a,"dragenter",this._onDragOver),H.push(this._onDragOver),c.store&&this.sort(c.store.get(this))}function b(a,b){var c=G.call(arguments,2);return b.bind?b.bind.apply(b,[a].concat(c)):function(){return b.apply(a,c.concat(G.call(arguments)))}}function c(a,b,c){if("*"===b)return a;if(a){c=c||y,b=b.split(".");var d=b.shift().toUpperCase(),e=new RegExp("\\s("+b.join("|")+")\\s","g");do if(!(""!==d&&a.nodeName!=d||b.length&&((" "+a.className+" ").match(e)||[]).length!=b.length))return a;while(a!==c&&(a=a.parentNode))}return null}function d(a){a.dataTransfer.dropEffect="move",a.preventDefault()}function e(a,b,c){a.addEventListener(b,c,!1)}function f(a,b,c){a.removeEventListener(b,c,!1)}function g(a,b,c){if(a)if(a.classList)a.classList[c?"add":"remove"](b);else{var d=(" "+a.className+" ").replace(/\s+/g," ").replace(" "+b+" ","");a.className=d+(c?" "+b:"")}}function h(a,b,c){if(a&&a.style){if(void 0===c)return y.defaultView&&y.defaultView.getComputedStyle?c=y.defaultView.getComputedStyle(a,""):a.currentStyle&&(c=a.currentStyle),void 0===b?c:c[b];a.style[b]=c+("string"==typeof c?"":"px")}}function i(a,b,c){if(a){var d=a.getElementsByTagName(b),e=0,f=d.length;if(c)for(;f>e;e++)c(d[e],e);return d}return[]}function j(a){return a.draggable=!1}function k(){B=!1}function l(a,b){var c=a.lastElementChild.getBoundingClientRect();return b.clientY-(c.top+c.height)>5}function m(a){for(var b=a.tagName+a.className+a.src+a.href+a.textContent,c=b.length,d=0;c--;)d+=b.charCodeAt(c);return d.toString(36)}var n,o,p,q,r,s,t,u,v,w="Sortable"+(new Date).getTime(),x=window,y=x.document,z=x.parseInt,A=!!y.createElement("div").dragDrop,B=!1,C=function(a,b){var c=y.createEvent("Event");return c.initEvent(a,!0,!0),c.item=b,c},D=function(a,b,c){a.dispatchEvent(C(b,c||a))},E="onAdd onUpdate onRemove onStart onEnd onFilter".split(" "),F=function(){},G=[].slice,H=[];return a.prototype={constructor:a,_applyEffects:function(){g(n,this.options.ghostClass,!0)},_onTapStart:function(a){var b=a.touches&&a.touches[0],f=(b||a).target,g=this.options,h=this.el,k=g.filter;if("mousedown"!==a.type||0===a.button){if("function"==typeof k&&k.call(this,f,this))return D(h,"filter",f),void 0;if(k&&(k=k.split(",").filter(function(a){return c(f,a.trim(),h)}),k.length))return D(h,"filter",f),void 0;if(g.handle&&(f=c(f,g.handle,h)),f=c(f,g.draggable,h),f&&"selectstart"==a.type&&"A"!=f.tagName&&"IMG"!=f.tagName&&f.dragDrop(),f&&!n&&f.parentNode===h){u=a,p=this.el,n=f,q=n.nextSibling,t=this.options.group,n.draggable=!0,g.ignore.split(",").forEach(function(a){i(f,a.trim(),j)}),b&&(u={target:f,clientX:b.clientX,clientY:b.clientY},this._onDragStart(u,!0),a.preventDefault()),e(y,"mouseup",this._onDrop),e(y,"touchend",this._onDrop),e(y,"touchcancel",this._onDrop),e(this.el,"dragstart",this._onDragStart),e(this.el,"dragend",this._onDrop),e(y,"dragover",d);try{y.selection?y.selection.empty():window.getSelection().removeAllRanges()}catch(l){}D(n,"start")}}},_emulateDragOver:function(){if(v){h(o,"display","none");var a=y.elementFromPoint(v.clientX,v.clientY),b=a,c=this.options.group,d=H.length;if(b)do{if(b[w]===c){for(;d--;)H[d]({clientX:v.clientX,clientY:v.clientY,target:a,rootEl:b});break}a=b}while(b=b.parentNode);h(o,"display","")}},_onTouchMove:function(a){if(u){var b=a.touches[0],c=b.clientX-u.clientX,d=b.clientY-u.clientY,e="translate3d("+c+"px,"+d+"px,0)";v=b,h(o,"webkitTransform",e),h(o,"mozTransform",e),h(o,"msTransform",e),h(o,"transform",e),a.preventDefault()}},_onDragStart:function(a,b){var c=a.dataTransfer;if(this._offUpEvents(),b){var d,f=n.getBoundingClientRect(),g=h(n);o=n.cloneNode(!0),h(o,"top",f.top-z(g.marginTop,10)),h(o,"left",f.left-z(g.marginLeft,10)),h(o,"width",f.width),h(o,"height",f.height),h(o,"opacity","0.8"),h(o,"position","fixed"),h(o,"zIndex","100000"),p.appendChild(o),d=o.getBoundingClientRect(),h(o,"width",2*f.width-d.width),h(o,"height",2*f.height-d.height),e(y,"touchmove",this._onTouchMove),e(y,"touchend",this._onDrop),e(y,"touchcancel",this._onDrop),this._loopId=setInterval(this._emulateDragOver,150)}else c.effectAllowed="move",c.setData("Text",n.textContent),e(y,"drop",this._onDrop);setTimeout(this._applyEffects)},_onDragOver:function(a){if(!B&&t===this.options.group&&(void 0===a.rootEl||a.rootEl===this.el)){var b=this.el,d=c(a.target,this.options.draggable,b),e=n.getBoundingClientRect();if(0===b.children.length||b.children[0]===o||b===a.target&&l(b,a))b.appendChild(n),this._animate(e,n);else if(d&&!d.animated&&d!==n&&void 0!==d.parentNode[w]){r!==d&&(r=d,s=h(d));var f,g=d.getBoundingClientRect(),i=g.right-g.left,j=g.bottom-g.top,m=/left|right|inline/.test(s.cssFloat+s.display),p=d.offsetWidth>n.offsetWidth,q=d.offsetHeight>n.offsetHeight,u=(m?(a.clientX-g.left)/i:(a.clientY-g.top)/j)>.5,v=d.nextElementSibling;B=!0,setTimeout(k,30),f=m?d.previousElementSibling===n&&!p||u&&p:v!==n&&!q||u&&q,f&&!v?(b.appendChild(n),this._animate(e,n)):(d.parentNode.insertBefore(n,f?v:d),this._animate(e,n),this._animate(g,d))}}},_animate:function(a,b){var c=this.options.animation;if(c){var d=b.getBoundingClientRect();h(b,"transform","translate3d("+(a.left-d.left)+"px,"+(a.top-d.top)+"px,0)"),b.offsetWidth,h(b,"transition","transform "+c+"ms"),h(b,"transform","translate3d(0,0,0)"),clearTimeout(b.animated),b.animated=setTimeout(function(){h(b,"transition",""),b.animated=!1},c)}},_offUpEvents:function(){f(y,"mouseup",this._onDrop),f(y,"touchmove",this._onTouchMove),f(y,"touchend",this._onDrop),f(y,"touchcancel",this._onDrop)},_onDrop:function(a){clearInterval(this._loopId),f(y,"drop",this._onDrop),f(y,"dragover",d),f(this.el,"dragend",this._onDrop),f(this.el,"dragstart",this._onDragStart),f(this.el,"selectstart",this._onTapStart),this._offUpEvents(),a&&(a.preventDefault(),a.stopPropagation(),o&&o.parentNode.removeChild(o),n&&(j(n),g(n,this.options.ghostClass,!1),p.contains(n)?n.nextSibling!==q&&D(n,"update"):(D(p,"remove",n),D(n,"add")),D(n,"end")),p=n=o=q=u=v=r=s=t=null,this.options.store&&this.options.store.set(this))},toArray:function(){for(var a,b=[],d=this.el.children,e=0,f=d.length;f>e;e++)a=d[e],c(a,this.options.draggable,this.el)&&b.push(a.getAttribute("data-id")||m(a));return b},sort:function(a){var b={},d=this.el;this.toArray().forEach(function(a,e){var f=d.children[e];c(f,this.options.draggable,d)&&(b[a]=f)},this),a.forEach(function(a){b[a]&&(d.removeChild(b[a]),d.appendChild(b[a]))})},closest:function(a,b){return c(a,b||this.options.draggable,this.el)},destroy:function(){var a=this.el,b=this.options;E.forEach(function(c){f(a,c.substr(2).toLowerCase(),b[c])}),f(a,"mousedown",this._onTapStart),f(a,"touchstart",this._onTapStart),f(a,"selectstart",this._onTapStart),f(a,"dragover",this._onDragOver),f(a,"dragenter",this._onDragOver),Array.prototype.forEach.call(a.querySelectorAll("[draggable]"),function(a){a.removeAttribute("draggable")}),H.splice(H.indexOf(this._onDragOver),1),this._onDrop(),this.el=null}},a.utils={on:e,off:f,css:h,find:i,bind:b,closest:c,toggleClass:g,createEvent:C,dispatchEvent:D},a.version="0.6.0",a.create=function(b,c){return new a(b,c)},a}); \ No newline at end of file +!function(a){"use strict";"function"==typeof define&&define.amd?define(a):"undefined"!=typeof module&&"undefined"!=typeof module.exports?module.exports=a():window.Sortable=a()}(function(){"use strict";function a(a,c){this.el=a,this.options=c=c||{};var d={group:Math.random(),store:null,handle:null,draggable:a.children[0]&&a.children[0].nodeName||(/[uo]l/i.test(a.nodeName)?"li":"*"),ghostClass:"sortable-ghost",ignore:"a, img",filter:null,animation:0};for(var f in d)c[f]=c[f]||d[f];E.forEach(function(d){c[d]=b(this,c[d]||F),e(a,d.substr(2).toLowerCase(),c[d])},this),a[w]=c.group;for(var g in this)"_"===g.charAt(0)&&(this[g]=b(this,this[g]));e(a,"mousedown",this._onTapStart),e(a,"touchstart",this._onTapStart),A&&e(a,"selectstart",this._onTapStart),e(a,"dragover",this._onDragOver),e(a,"dragenter",this._onDragOver),H.push(this._onDragOver),c.store&&this.sort(c.store.get(this))}function b(a,b){var c=G.call(arguments,2);return b.bind?b.bind.apply(b,[a].concat(c)):function(){return b.apply(a,c.concat(G.call(arguments)))}}function c(a,b,c){if("*"===b)return a;if(a){c=c||y,b=b.split(".");var d=b.shift().toUpperCase(),e=new RegExp("\\s("+b.join("|")+")\\s","g");do if(!(""!==d&&a.nodeName!=d||b.length&&((" "+a.className+" ").match(e)||[]).length!=b.length))return a;while(a!==c&&(a=a.parentNode))}return null}function d(a){a.dataTransfer.dropEffect="move",a.preventDefault()}function e(a,b,c){a.addEventListener(b,c,!1)}function f(a,b,c){a.removeEventListener(b,c,!1)}function g(a,b,c){if(a)if(a.classList)a.classList[c?"add":"remove"](b);else{var d=(" "+a.className+" ").replace(/\s+/g," ").replace(" "+b+" ","");a.className=d+(c?" "+b:"")}}function h(a,b,c){var d=a&&a.style;if(d){if(void 0===c)return y.defaultView&&y.defaultView.getComputedStyle?c=y.defaultView.getComputedStyle(a,""):a.currentStyle&&(c=a.currentStyle),void 0===b?c:c[b];b in d||(b="-webkit-"+b),d[b]=c+("string"==typeof c?"":"px")}}function i(a,b,c){if(a){var d=a.getElementsByTagName(b),e=0,f=d.length;if(c)for(;f>e;e++)c(d[e],e);return d}return[]}function j(a){return a.draggable=!1}function k(){B=!1}function l(a,b){var c=a.lastElementChild.getBoundingClientRect();return b.clientY-(c.top+c.height)>5}function m(a){for(var b=a.tagName+a.className+a.src+a.href+a.textContent,c=b.length,d=0;c--;)d+=b.charCodeAt(c);return d.toString(36)}var n,o,p,q,r,s,t,u,v,w="Sortable"+(new Date).getTime(),x=window,y=x.document,z=x.parseInt,A=!!y.createElement("div").dragDrop,B=!1,C=function(a,b){var c=y.createEvent("Event");return c.initEvent(a,!0,!0),c.item=b,c},D=function(a,b,c){a.dispatchEvent(C(b,c||a))},E="onAdd onUpdate onRemove onStart onEnd onFilter".split(" "),F=function(){},G=[].slice,H=[];return a.prototype={constructor:a,_applyEffects:function(){g(n,this.options.ghostClass,!0)},_onTapStart:function(a){var b=a.touches&&a.touches[0],f=(b||a).target,g=this.options,h=this.el,k=g.filter;if("mousedown"!==a.type||0===a.button){if("function"==typeof k&&k.call(this,f,this))return D(h,"filter",f),void 0;if(k&&(k=k.split(",").filter(function(a){return c(f,a.trim(),h)}),k.length))return D(h,"filter",f),void 0;if(g.handle&&(f=c(f,g.handle,h)),f=c(f,g.draggable,h),f&&"selectstart"==a.type&&"A"!=f.tagName&&"IMG"!=f.tagName&&f.dragDrop(),f&&!n&&f.parentNode===h){u=a,p=this.el,n=f,q=n.nextSibling,t=this.options.group,n.draggable=!0,g.ignore.split(",").forEach(function(a){i(f,a.trim(),j)}),b&&(u={target:f,clientX:b.clientX,clientY:b.clientY},this._onDragStart(u,!0),a.preventDefault()),e(y,"mouseup",this._onDrop),e(y,"touchend",this._onDrop),e(y,"touchcancel",this._onDrop),e(this.el,"dragstart",this._onDragStart),e(this.el,"dragend",this._onDrop),e(y,"dragover",d);try{y.selection?y.selection.empty():window.getSelection().removeAllRanges()}catch(l){}D(n,"start")}}},_emulateDragOver:function(){if(v){h(o,"display","none");var a=y.elementFromPoint(v.clientX,v.clientY),b=a,c=this.options.group,d=H.length;if(b)do{if(b[w]===c){for(;d--;)H[d]({clientX:v.clientX,clientY:v.clientY,target:a,rootEl:b});break}a=b}while(b=b.parentNode);h(o,"display","")}},_onTouchMove:function(a){if(u){var b=a.touches[0],c=b.clientX-u.clientX,d=b.clientY-u.clientY,e="translate3d("+c+"px,"+d+"px,0)";v=b,h(o,"webkitTransform",e),h(o,"mozTransform",e),h(o,"msTransform",e),h(o,"transform",e),a.preventDefault()}},_onDragStart:function(a,b){var c=a.dataTransfer;if(this._offUpEvents(),b){var d,f=n.getBoundingClientRect(),g=h(n);o=n.cloneNode(!0),h(o,"top",f.top-z(g.marginTop,10)),h(o,"left",f.left-z(g.marginLeft,10)),h(o,"width",f.width),h(o,"height",f.height),h(o,"opacity","0.8"),h(o,"position","fixed"),h(o,"zIndex","100000"),p.appendChild(o),d=o.getBoundingClientRect(),h(o,"width",2*f.width-d.width),h(o,"height",2*f.height-d.height),e(y,"touchmove",this._onTouchMove),e(y,"touchend",this._onDrop),e(y,"touchcancel",this._onDrop),this._loopId=setInterval(this._emulateDragOver,150)}else c.effectAllowed="move",c.setData("Text",n.textContent),e(y,"drop",this._onDrop);setTimeout(this._applyEffects)},_onDragOver:function(a){if(!B&&t===this.options.group&&(void 0===a.rootEl||a.rootEl===this.el)){var b=this.el,d=c(a.target,this.options.draggable,b),e=n.getBoundingClientRect();if(0===b.children.length||b.children[0]===o||b===a.target&&l(b,a))b.appendChild(n),this._animate(e,n);else if(d&&!d.animated&&d!==n&&void 0!==d.parentNode[w]){r!==d&&(r=d,s=h(d));var f,g=d.getBoundingClientRect(),i=g.right-g.left,j=g.bottom-g.top,m=/left|right|inline/.test(s.cssFloat+s.display),p=d.offsetWidth>n.offsetWidth,q=d.offsetHeight>n.offsetHeight,u=(m?(a.clientX-g.left)/i:(a.clientY-g.top)/j)>.5,v=d.nextElementSibling;B=!0,setTimeout(k,30),f=m?d.previousElementSibling===n&&!p||u&&p:v!==n&&!q||u&&q,f&&!v?(b.appendChild(n),this._animate(e,n)):(d.parentNode.insertBefore(n,f?v:d),this._animate(e,n),this._animate(g,d))}}},_animate:function(a,b){var c=this.options.animation;if(c){var d=b.getBoundingClientRect();h(b,"transition","none"),h(b,"transform","translate3d("+(a.left-d.left)+"px,"+(a.top-d.top)+"px,0)"),b.offsetWidth,h(b,"transition","all "+c+"ms"),h(b,"transform","translate3d(0,0,0)"),clearTimeout(b.animated),b.animated=setTimeout(function(){h(b,"transition",""),b.animated=!1},c)}},_offUpEvents:function(){f(y,"mouseup",this._onDrop),f(y,"touchmove",this._onTouchMove),f(y,"touchend",this._onDrop),f(y,"touchcancel",this._onDrop)},_onDrop:function(a){clearInterval(this._loopId),f(y,"drop",this._onDrop),f(y,"dragover",d),f(this.el,"dragend",this._onDrop),f(this.el,"dragstart",this._onDragStart),f(this.el,"selectstart",this._onTapStart),this._offUpEvents(),a&&(a.preventDefault(),a.stopPropagation(),o&&o.parentNode.removeChild(o),n&&(j(n),g(n,this.options.ghostClass,!1),p.contains(n)?n.nextSibling!==q&&D(n,"update"):(D(p,"remove",n),D(n,"add")),D(n,"end")),p=n=o=q=u=v=r=s=t=null,this.options.store&&this.options.store.set(this))},toArray:function(){for(var a,b=[],d=this.el.children,e=0,f=d.length;f>e;e++)a=d[e],c(a,this.options.draggable,this.el)&&b.push(a.getAttribute("data-id")||m(a));return b},sort:function(a){var b={},d=this.el;this.toArray().forEach(function(a,e){var f=d.children[e];c(f,this.options.draggable,d)&&(b[a]=f)},this),a.forEach(function(a){b[a]&&(d.removeChild(b[a]),d.appendChild(b[a]))})},closest:function(a,b){return c(a,b||this.options.draggable,this.el)},destroy:function(){var a=this.el,b=this.options;E.forEach(function(c){f(a,c.substr(2).toLowerCase(),b[c])}),f(a,"mousedown",this._onTapStart),f(a,"touchstart",this._onTapStart),f(a,"selectstart",this._onTapStart),f(a,"dragover",this._onDragOver),f(a,"dragenter",this._onDragOver),Array.prototype.forEach.call(a.querySelectorAll("[draggable]"),function(a){a.removeAttribute("draggable")}),H.splice(H.indexOf(this._onDragOver),1),this._onDrop(),this.el=null}},a.utils={on:e,off:f,css:h,find:i,bind:b,closest:c,toggleClass:g,createEvent:C,dispatchEvent:D},a.version="0.6.0",a.create=function(b,c){return new a(b,c)},a}); \ No newline at end of file