vendor/assets/javascripts/uikit/components/sortable.js in uikit2-rails-0.1.9 vs vendor/assets/javascripts/uikit/components/sortable.js in uikit2-rails-0.1.10

- old
+ new

@@ -1,6 +1,6 @@ -/*! UIkit 2.26.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ +/*! UIkit 2.27.2 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ /* * Based on nativesortable - Copyright (c) Brian Grinstead - https://github.com/bgrins/nativesortable */ (function(addon) { @@ -8,23 +8,27 @@ if (window.UIkit) { component = addon(UIkit); } - if (typeof define == "function" && define.amd) { - define("uikit-sortable", ["uikit"], function(){ + if (typeof define == 'function' && define.amd) { + define('uikit-sortable', ['uikit'], function(){ return component || addon(UIkit); }); } })(function(UI){ "use strict"; var supportsTouch = ('ontouchstart' in window || 'MSGesture' in window) || (window.DocumentTouch && document instanceof DocumentTouch), - draggingPlaceholder, currentlyDraggingElement, currentlyDraggingTarget, dragging, moving, clickedlink, delayIdle, touchedlists, moved, overElement; + draggingPlaceholder, currentlyDraggingElement, currentlyDraggingTarget, dragging, moving, clickedlink, delayIdle, touchedlists, moved, overElement, startEvent; + var POINTER_DOWN = supportsTouch ? ('MSGesture' in window ? 'pointerdown':'touchstart') : 'mousedown', + POINTER_MOVE = supportsTouch ? ('MSGesture' in window ? 'pointermove':'touchmove') : 'mousemove', + POINTER_UP = supportsTouch ? ('MSGesture' in window ? 'pointerup':'touchend') : 'mouseup'; + function closestSortable(ele) { ele = UI.$(ele); do { @@ -64,25 +68,26 @@ boot: function() { // auto init UI.ready(function(context) { - UI.$("[data-uk-sortable]", context).each(function(){ + UI.$('[data-uk-sortable]', context).each(function(){ var ele = UI.$(this); - if(!ele.data("sortable")) { - UI.sortable(ele, UI.Utils.options(ele.attr("data-uk-sortable"))); + if(!ele.data('sortable')) { + UI.sortable(ele, UI.Utils.options(ele.attr('data-uk-sortable'))); } }); }); - UI.$html.on('mousemove touchmove', function(e) { + UI.$html.on(POINTER_MOVE, function(e) { if (delayIdle) { var src = e.originalEvent.targetTouches ? e.originalEvent.targetTouches[0] : e; + if (Math.abs(src.pageX - delayIdle.pos.x) > delayIdle.threshold || Math.abs(src.pageY - delayIdle.pos.y) > delayIdle.threshold) { delayIdle.apply(src); } } @@ -97,14 +102,15 @@ UI.$html.addClass(draggingPlaceholder.$sortable.options.dragMovingClass); } var offset = draggingPlaceholder.data('mouse-offset'), - left = parseInt(e.originalEvent.pageX, 10) + offset.left, - top = parseInt(e.originalEvent.pageY, 10) + offset.top; + ev = e.originalEvent.touches && e.originalEvent.touches[0] || e.originalEvent, + left = parseInt(ev.pageX, 10) + offset.left, + top = parseInt(ev.pageY, 10) + offset.top; - draggingPlaceholder.css({'left': left, 'top': top }); + draggingPlaceholder.css({left: left, top: top }); // adjust document scrolling if (top + (draggingPlaceholder.height()/3) > document.body.offsetHeight) { return; @@ -116,11 +122,11 @@ UI.$win.scrollTop(UI.$win.scrollTop() + Math.ceil(draggingPlaceholder.height()/3)); } } }); - UI.$html.on('mouseup touchend', function(e) { + UI.$html.on(POINTER_UP, function(e) { delayIdle = clickedlink = false; // dragging? if (!currentlyDraggingElement || !draggingPlaceholder) { @@ -174,11 +180,11 @@ if ($link.length) { $link.one('click', function(e){ e.preventDefault(); - }).one('mouseup touchend', function(){ + }).one(POINTER_UP, function(){ if (!moved) { $link.trigger('click'); if (supportsTouch && $link.attr('href').trim()) { location.href = $link.attr('href'); @@ -227,23 +233,24 @@ return prevent(e); }); // Bind/unbind standard mouse/touch events as a polyfill. function addDragHandlers() { - if (supportsTouch) { - element.addEventListener("touchmove", handleTouchMove, false); + + if (supportsTouch && startEvent.touches && startEvent.touches.length) { + element.addEventListener(POINTER_MOVE, handleTouchMove, false); } else { element.addEventListener('mouseover', handleDragEnter, false); element.addEventListener('mouseout', handleDragLeave, false); } // document.addEventListener("selectstart", prevent, false); } function removeDragHandlers() { - if (supportsTouch) { - element.removeEventListener("touchmove", handleTouchMove, false); + if (supportsTouch && startEvent.touches && startEvent.touches.length) { + element.removeEventListener(POINTER_MOVE, handleTouchMove, false); } else { element.removeEventListener('mouseover', handleDragEnter, false); element.removeEventListener('mouseout', handleDragLeave, false); } @@ -266,23 +273,25 @@ return function(e) { var touch, target, context; + startEvent = e; + if (e) { - touch = (supportsTouch && e.touches && e.touches[0]) || { }; + touch = e.touches && e.touches[0] || e; target = touch.target || e.target; // Fix event.target for a touch event if (supportsTouch && document.elementFromPoint) { - target = document.elementFromPoint(e.pageX - document.body.scrollLeft, e.pageY - document.body.scrollTop); + target = document.elementFromPoint(touch.pageX - document.body.scrollLeft, touch.pageY - document.body.scrollTop); } overElement = UI.$(target); } - if (UI.$(target).hasClass($this.options.childClass)) { + if (UI.$(target).hasClass('.'+$this.options.childClass)) { fn.apply(target, [e]); } else if (target !== element) { // If a child is initiating the event or ending it, then use the container as context for the callback. context = moveUpToChildNode(element, target); @@ -292,12 +301,12 @@ } } }; } - window.addEventListener(supportsTouch ? 'touchmove' : 'mousemove', handleDragMove, false); - element.addEventListener(supportsTouch ? 'touchstart': 'mousedown', handleDragStart, false); + window.addEventListener(POINTER_MOVE, handleDragMove, false); + element.addEventListener(POINTER_DOWN, handleDragStart, false); }, dragStart: function(e, elem) { moved = false; @@ -325,15 +334,15 @@ // init drag placeholder if (draggingPlaceholder) { draggingPlaceholder.remove(); } - var $current = UI.$(currentlyDraggingElement), offset = $current.offset(); + var $current = UI.$(currentlyDraggingElement), offset = $current.offset(), ev = e.touches && e.touches[0] || e; delayIdle = { - pos : { x:e.pageX, y:e.pageY }, + pos : { x:ev.pageX, y:ev.pageY }, threshold : $this.options.handleClass ? 1 : $this.options.threshold, apply : function(evt) { draggingPlaceholder = UI.$('<div class="'+([$this.options.draggingClass, $this.options.dragCustomClass].join(' '))+'"></div>').css({ display : 'none', @@ -342,15 +351,15 @@ width : $current.width(), height : $current.height(), padding : $current.css('padding') }).data({ 'mouse-offset': { - 'left' : offset.left - parseInt(evt.pageX, 10), - 'top' : offset.top - parseInt(evt.pageY, 10) + left : offset.left - parseInt(ev.pageX, 10), + top : offset.top - parseInt(ev.pageY, 10) }, - 'origin' : $this.element, - 'index' : $current.index() + origin : $this.element, + index : $current.index() }).append($current.html()).appendTo('body'); draggingPlaceholder.$current = $current; draggingPlaceholder.$sortable = $this; @@ -361,11 +370,11 @@ }); $this.addDragHandlers(); $this.options.start(this, currentlyDraggingElement); - $this.trigger('start.uk.sortable', [$this, currentlyDraggingElement]); + $this.trigger('start.uk.sortable', [$this, currentlyDraggingElement, draggingPlaceholder]); moved = true; delayIdle = false; } }; @@ -374,14 +383,14 @@ dragMove: function(e, elem) { overElement = UI.$(document.elementFromPoint(e.pageX - (document.body.scrollLeft || document.scrollLeft || 0), e.pageY - (document.body.scrollTop || document.documentElement.scrollTop || 0))); var overRoot = overElement.closest('.'+this.options.baseClass), - groupOver = overRoot.data("sortable-group"), + groupOver = overRoot.data('sortable-group'), $current = UI.$(currentlyDraggingElement), currentRoot = $current.parent(), - groupCurrent = $current.data("sortable-group"), + groupCurrent = $current.data('sortable-group'), overChild; if (overRoot[0] !== currentRoot[0] && groupCurrent !== undefined && groupOver === groupCurrent) { overRoot.data('sortable').addDragHandlers(); @@ -422,16 +431,16 @@ // Prevent dragenter on a child from allowing a dragleave on the container if (previousCounter === 0) { var currentlist = UI.$(elem).parent(), - startlist = UI.$(currentlyDraggingElement).data("start-list"); + startlist = UI.$(currentlyDraggingElement).data('start-list'); if (currentlist[0] !== startlist[0]) { var groupOver = currentlist.data('sortable-group'), - groupCurrent = UI.$(currentlyDraggingElement).data("sortable-group"); + groupCurrent = UI.$(currentlyDraggingElement).data('sortable-group'); if ((groupOver || groupCurrent) && (groupOver != groupCurrent)) { return false; } } @@ -501,11 +510,11 @@ // trigger events once if (!currentlyDraggingElement) return; var $current = UI.$(currentlyDraggingElement), - oldRoot = draggingPlaceholder.data("origin"), + oldRoot = draggingPlaceholder.data('origin'), newRoot = $current.closest('.'+this.options.baseClass), triggers = [], el = UI.$(currentlyDraggingElement); // events depending on move inside lists or across lists @@ -570,11 +579,11 @@ var ele = UI.$(this); ele.data('offset-after', ele.position()); }).each(function() { var ele = UI.$(this), before = ele.data('offset-before'); - ele.css({'position':'absolute', 'top':before.top, 'left':before.left, 'min-width':before.width }); + ele.css({position:'absolute', top:before.top, left:before.left, minWidth:before.width }); }); children.each(function(){ var ele = UI.$(this), @@ -583,10 +592,10 @@ ele.css('pointer-events', 'none').width(); setTimeout(function(){ ele.animate({'top':offset.top, 'left':offset.left}, $this.options.animation, function() { - ele.css({'position':'','top':'', 'left':'', 'min-width': '', 'pointer-events':''}).removeClass($this.options.overClass).removeData('child-dragenter'); + ele.css({position:'',top:'', left:'', minWidth: '', 'pointer-events':''}).removeClass($this.options.overClass).removeData('child-dragenter'); count--; if (!count) { list.css('min-height', ''); UI.Utils.checkDisplay($this.element.parent()); }