@marshal93/vue-directives
Version:
vue-directives with types
2 lines (1 loc) • 2.93 kB
JavaScript
var t;!function(t){t.TAP="tap",t.SWIPE="swipe",t.SWIPE_LEFT="swipeLeft",t.SWIPE_RIGHT="swipeRight",t.SWIPE_UP="swipeUp",t.SWIPE_DOWN="swipeDown",t.LONG_TAP="longTap"}(t||(t={}));var i=function(){function i(t,i,e,n){var o=this;this.element=t,this.longTapTimer=(null==n?void 0:n.longTapTimer)||1e3,this.binding=i,this.position={x:50,y:100},n&&(this.position.x="number"==typeof n.x?Math.sqrt(Math.pow(n.x,2)):50,this.position.y="number"==typeof n.y?Math.sqrt(Math.pow(n.y,2)):100),this.touchType=e,this.firstTouchPosition={x:0,y:0},this.firstTouchTime=0,this.callBack=i.value,this.moved=!1,this.leaved=!1,this.longTouched=!1;var s=Object.create(null),h=function(t){return function(i){var e=o.binding.modifiers,n=e.stop,h=e.prevent,c=e.self,a=e.once;n&&i.stopPropagation(),h&&i.preventDefault(),a&&o.element.removeEventListener("touch".concat(t),s[t]),c&&i.target!==i.currentTarget||o[t](i)}};s.start=h("start"),s.end=h("end"),s.move=h("move"),this.element.addEventListener("touchstart",s.start,!1),this.element.addEventListener("touchend",s.end,!1),this.element.addEventListener("touchmove",s.move,!1)}return i.prototype.start=function(i){var e=this;this.moved=!1,this.leaved=!1,this.longTouched=!1,this.firstTouchPosition=this.getMultiCenter(i.changedTouches),this.firstTouchTime=i.timeStamp,this.longTouchedTimer=setTimeout((function(){e.leaved||e.moved||(e.touchType===t.LONG_TAP&&e.callBack(i,e.binding.value),e.longTouched=!0)}),this.longTapTimer)},i.prototype.end=function(i){var e=this.getMultiCenter(i.changedTouches),n=e.x,o=e.y,s=n-this.firstTouchPosition.x,h=o-this.firstTouchPosition.y,c=i.timeStamp-this.firstTouchTime;clearTimeout(this.longTouchedTimer),c>300?("swipe"===this.touchType&&this.callBack(i,this.binding.value),h>=this.position.y&&this.touchType===t.SWIPE_DOWN&&this.callBack(i,this.binding.value),h<=-this.position.y&&this.touchType===t.SWIPE_UP&&this.callBack(i,this.binding.value),s<=-this.position.x&&this.touchType===t.SWIPE_LEFT&&this.callBack(i,this.binding.value),s>=this.position.x&&this.touchType===t.SWIPE_RIGHT&&this.callBack(i,this.binding.value)):this.longTouched||this.moved||(this.touchType===t.TAP&&this.callBack(i,this.binding.value),this.leaved=!0)},i.prototype.move=function(){this.moved=!0},i.prototype.getMultiCenter=function(t){for(var i=0,e=0,n=t.length,o=0;o<n;o++)i+=t[o].pageX,e+=t[o].pageY;return{x:Math.round(i/n),y:Math.round(e/n)}},i}(),e={install:function(e,n){e.directive(t.SWIPE,{bind:function(e,o){new i(e,o,t.SWIPE,n)}}),e.directive(t.TAP,{bind:function(e,o){new i(e,o,t.TAP,n)}}),e.directive(t.SWIPE_LEFT,{bind:function(e,o){new i(e,o,t.SWIPE_LEFT,n)}}),e.directive(t.SWIPE_RIGHT,{bind:function(e,o){new i(e,o,t.SWIPE_RIGHT,n)}}),e.directive(t.SWIPE_DOWN,{bind:function(e,o){new i(e,o,t.SWIPE_DOWN,n)}}),e.directive(t.SWIPE_UP,{bind:function(e,o){new i(e,o,t.SWIPE_UP,n)}}),e.directive(t.LONG_TAP,{bind:function(e,o){new i(e,o,t.LONG_TAP,n)}})}};export{e as default};