besom - npm Package Compare versions

Comparing version 1.0.3 to 2.0.0

dist/besom.min.js

@@ -5,2 +5,2 @@ /**
  **/
-!function(t,e){"function"==typeof define&&define.amd?define(e):"object"==typeof module&&module.exports?module.exports=e():t.Besom=e()}(this,function(){function c(t){return Math.round(1e3*parseFloat(t))/1e3}function m(t){this.element=t,this.resetTransform()}var d={create:function(t){if("string"==typeof t){var e=(/matrix\((.*)\)/.exec(t)||["",""])[1].split(",");t=6<=e.length?[[c(e[0]),c(e[2]),c(e[4])],[c(e[1]),c(e[3]),c(e[5])],[0,0,1]]:[[1,0,0],[0,1,0],[0,0,1]]}else{var n=t.translate||0,a=t.scale.x||1,r=(r=t.rotate||0)*Math.PI/180,s=c(Math.sin(r)),i=c(Math.cos(r));t=this.mutiply(this.mutiply([[1,0,n.x],[0,1,n.y],[0,0,1]],[[i,-s,0],[s,i,0],[0,0,1]]),[[a,0,0],[0,a,0],[0,0,1]])}return t},mutiply:function(t,e){for(var n=[],a=0;a<t.length;a++){for(var r=[],s=0;s<e[a].length;s++)r.push(c(t[a][0]*e[0][s]+t[a][1]*e[1][s]+t[a][2]*e[2][s]));n.push(r)}return n},parse:function(t){var e=t[0][0],n=t[1][0],a=t[0][1],r=t[1][1],s=t[0][2],i=t[1][2],o=Math.atan2(n,e)*(180/Math.PI),l=-Math.PI/180*o;return{scale:{x:c(Math.sqrt(e*e+n*n)),y:c(Math.sqrt(a*a+r*r))},rotate:c(o),translate:{x:c(Math.cos(l)*s-Math.sin(l)*i),y:c(Math.sin(l)*s+Math.cos(l)*i)}}}};m.prototype={offset:function(){for(var t=(n=this.element).offsetLeft,e=n.offsetTop;n.offsetParent;){var n;t+=(n=n.offsetParent).offsetLeft,e+=n.offsetTop}return{left:t,top:e}},resetTransform:function(){var t=window.getComputedStyle(this.element,!1),e=d.create("none"!=t.transform?t.transform:"matrix(1,0,0,1,0,0)"),n=t["transform-origin"].split(" "),a=(d.parse(e),c(n[0])),r=c(n[1]);this.transform={matrix:e,json:d.parse(e),origin:{x:a,y:r}}},getPointOrigin:function(t){var e,n,a=this.offset(),r=t.pageX-a.left,s=t.pageY-a.top,i=this.transform,o=Math.PI/180,l=i.json,h=i.origin,u=l.rotate,f=l.scale.x,c=l.translate,m=c.x,d=c.y,g=h.x-r,p=h.y-s,v=Math.sqrt(g*g+p*p)/f,x=Math.atan(Math.abs(p/g))/o;0<p&&0<g&&(toangle=x-u),0<p&&g<0&&(toangle=180-x-u),p<0&&0<g&&(toangle=x+u),p<0&&g<0&&(toangle=x-u);var y=v*Math.cos(toangle*o),b=v*Math.sin(toangle*o);return 0<p&&0<g&&(e=h.x-y)&&(n=h.y-b),0<p&&g<0&&(e=h.x-y)&&(n=h.y-b),p<0&&0<g&&(e=h.x-y)&&(n=h.y+b),p<0&&g<0&&(e=h.x+y)&&(n=h.y+b),{x:e-m/f,y:n-d/f}},setOrigin:function(t){var e=this.transform,n=e.matrix,a=e.origin,r=a.x-t.x,s=a.y-t.y,i=[[-r],[-s],[1]],o=d.mutiply(n,i),l=o[0][0]+a.x,h=o[1][0]+a.y,u=r+(l-a.x),f=s-(a.y-h);this.render({translate:{x:u,y:f},origin:t}),this.resetTransform()},translate:function(t,e){var n=this.transform.matrix,a=n[0][2],r=n[1][2],s={x:a+t.x,y:r+t.y};this.render({translate:s},e),this.resetTransform()},scale:function(t,e){var n=t*this.transform.json.scale.x;this.render({scale:n},e),this.resetTransform()},rotate:function(t,e){var n=this.transform.json.rotate+t;this.render({rotate:n},e),this.resetTransform()},render:function(t,e){var n=this.element,a=n.style.cssText||"",r=this.transform,s=r.matrix,i=r.json,o=t.origin||r.origin,l=(e=e||"0s",t.translate||{x:s[0][2],y:s[1][2]}),h=c(t.scale||i.scale.x),u=c(t.rotate||i.rotate),f=(e="-webkit-transition:"+e+";","-webkit-transform: translate("+c(l.x)+"px, "+c(l.y)+"px) scale("+h+") rotate("+u+"deg);");o="-webkit-transform-origin:"+o.x+"px "+o.y+"px;";n.style.cssText=a+";"+e+f+o}};function b(t,e){var n=e.pageX-t.pageX,a=e.pageY-t.pageY;return{offsetx:n,offsety:a,length:Math.sqrt(n*n+a*a)}}function M(t){var e=t.touches&&t.touches.length?t.touches:t.changedTouches&&t.changedTouches.length?t.changedTouches:[t],n={time:(new Date).getTime(),count:e.length,event:e};if(2==e.length){var a=e[0],r=e[1],s=r.pageX-a.pageX,i=r.pageY-a.pageY,o=Math.sqrt(s*s+i*i),l=Math.sqrt(o*o/4-i*i/4),h=a.pageY+i/2,u=a.pageX+(s<0?-l:l);n.length=o,n.center={pageX:u,pageY:h}}return n}function w(t,e,n,a){var r,s=[e,n,a],i=(this.events,this.element.element),o=a.event[0].target,l=this.delegates[t];if(l)t:for(;o!=i;){var h=o.getAttribute("__gid");if(h){r=l[h];break t}var u=(o.className||"").split(" ");e:for(var f=0;f<u.length;f++){var c=u[f];if(c&&l[c]){o.setAttribute("__gid",c),r=l[c];break e}}if(r)break t;o=o.parentNode}r?r.apply(new m(o),s):this.events[t]&&this.events[t].apply(this.element,s)}function n(){function h(t){return-1<v.enabled.indexOf(t)}function t(t){if(t.preventDefault(),2==(g=M(t)).count){var e=g.center,n=v.element.getPointOrigin(e);v.element.setOrigin(n)}w.call(v,"start",null,g,g),f.addEventListener(_?"touchmove":"mousemove",c,!1),f.addEventListener(_?"touchend":"mouseup",y,!1),f.addEventListener(_?"touchcancel":"mouseleave",y,!1)}var m,d,g,p,u,v=this,f=this.element.element,i=function(){if(p){m=m||{x:0,y:0};var t=g.event[0],e=p.event[0],n=b(t,e),a=n.offsetx,r=n.offsety,s={x:a,y:r};v.onlydetect||v.element.translate({x:s.x-m.x,y:s.y-m.y},0),w.call(v,"slide",{increase:{x:s.x-m.x,y:s.y-m.y},total:s},p,g),m={x:a,y:r},T(i)}},x=function(){if(p&&2==p.count&&2==g.count){var t=g.event,e=p.event,n=g.length,a=p.length,r=Math.PI/180,s=a/n,i=b(e[0],t[0]),o=b(e[1],t[1]),l=i.length+o.length,h=(n*n+a*a-l*l)/(2*n*a),u=Math.acos(h<-1?-1:1<h?1:h)/r;if(d=null==d?.01<Math.abs(s-1)||Math.abs(u)<.2:d){var f=s/(m=m||1);v.onlydetect||v.element.scale(f,0),w.call(v,"pinch",{increase:f,total:s},p,g),m=s}else{m=m||0;var c=t[0].pageY<t[1].pageY?0:1;f=(u=(0<=e[c].pageX-t[c].pageX?1:-1)*u)-m;v.onlydetect||v.element.rotate(f,0),w.call(v,"rotate",{increase:f,total:u},p,g),m=u}T(x)}},c=function(t){t.preventDefault(),p=M(t),u||(h("slide")&&1==p.count&&1==g.count&&T(i),(h("pinch")||h("rotate"))&&2==p.count&&2==g.count&&(d=!!h("pinch")&&(!h("rotate")||void 0),T(x)),u=!0)},y=function(t){var e,n=g.event,a=M(t),r=a.event,s=a.time-g.time;if(t.preventDefault(),!t.touches||0==t.touches.length){if(1==g.count){var i=b(n[0],r[0]),o=i.offsetx,l=i.offsety;Math.abs(o)<3&&Math.abs(l)<3?function(t,e,n){var a=this,r=this.__lastTouch,s=r&&e.time-r.time<300?"doubletap":t<200?"tap":"longtap";if("tap"==s&&(this.__lastTouch=e),setTimeout(function(){a.__lastTouch=null},300),"tap"==s&&h("doubletap")){var i=setTimeout(function(){w.call(a,"tap",{duration:t},e,n)},300);this.__lastTouch.itv=i}else r&&r.itv&&clearTimeout(r.itv),h(s)&&w.call(this,s,{duration:t},e,n)}.call(v,s,a,g):e="slide"}else e=h("pinch")?"pinch":h("rotate")?"rotate":void 0;v.element.resetTransform(),e&&w.call(v,e+"End",{duration:s,total:m},a,g),p=null,d=m=u=void 0,f.removeEventListener(_?"touchmove":"mousemove",c,!1),f.removeEventListener(_?"touchend":"mouseup",y,!1),f.removeEventListener(_?"touchcancel":"mouseleave",y,!1)}};return f.addEventListener(_?"touchstart":"mousedown",t,!1),t}function a(t,e){if(t.length)throw new Error("The element parameter shouldn't be an array list. If you want to add gestures to these elements, please use delegate method of their parent element");this.element=new m(t),this.events={},this.delegates={},this.enabled=["tap"],this.onlydetect=e||!1,this.__evtfn=n.call(this)}var T=window.requestAnimationFrame||window.webkitRequestAnimationFrame||function(t){window.setTimeout(t,1e3/60)},_="ontouchend"in document;return a.prototype={enable:function(){for(var t=["tap","longtap","doubletap","slide","pinch","rotate"],e=0;e<arguments.length;e++){var n=arguments[e];if(!(-1<t.indexOf(n)))throw new Error('Only Support: "'+t.join("|")+'"!');this.enabled.indexOf(n)<0&&this.enabled.push(n)}},getPointOrigin:function(t){this.element.getPointOrigin(t)},setOrigin:function(t){this.element.setOrigin(t)},scale:function(t,e){this.element.scale(t,e)},rotate:function(t,e){this.element.rotate(t,e)},translate:function(t,e){this.element.translate(t,e)},disable:function(){for(var t=0;t<arguments.length;t++){var e=arguments[t],n=this.enabled.indexOf(e);-1<n&&this.enabled.splice(n,1)}},on:function(t,e){this.events[t]=e},delegate:function(t,e,n){if(t.indexOf(".")<0)throw new Error('The parameter cls shoud start width "."!');t=t.substring(1),this.onlydetect=!0,this.delegates[e]=this.delegates[e]||{},this.delegates[e][t]=n},destroy:function(){this.element.removeEventListener(_?"touchstart":"mousedown",this.__evtfn,!1),this.__evtfn,this.element=null,this.events={},this.delegates={},this.onlydetect=!1}},{create:function(t,e){return new a(t,e||!1)},element:function(t){return new m(t)}}});
+!function(t,e){"function"==typeof define&&define.amd?define(e):"object"==typeof module&&module.exports?module.exports=e():t.Besom=e()}(this,function(){function w(t){return Math.round(1e3*parseFloat(t))/1e3}var l="ontouchend"in document,c=function(t){if("string"==typeof t){var e=(/matrix\((.*)\)/.exec(t)||["",""])[1].split(",");t=6<=e.length?[[w(e[0]),w(e[2]),w(e[4])],[w(e[1]),w(e[3]),w(e[5])],[0,0,1]]:[[1,0,0],[0,1,0],[0,0,1]]}return t},u=function(t,e){for(var n=[],o=0;o<t.length;o++){for(var a=[],s=0;s<e[o].length;s++)a.push(w(t[o][0]*e[0][s]+t[o][1]*e[1][s]+t[o][2]*e[2][s]));n.push(a)}return n},M=function(t){var e=t[0][0],n=t[1][0],o=t[0][1],a=t[1][1],s=t[0][2],r=t[1][2],i=Math.atan2(n,e)*(180/Math.PI),l=-Math.PI/180*i;return{scale:{x:w(Math.sqrt(e*e+n*n)),y:w(Math.sqrt(o*o+a*a))},rotate:w(i),translate:{x:w(Math.cos(l)*s-Math.sin(l)*r),y:w(Math.sin(l)*s+Math.cos(l)*r)}}},v=(t.prototype={offset:function(){for(var t=(n=this.element).offsetLeft,e=n.offsetTop;n.offsetParent;){var n;t+=(n=n.offsetParent).offsetLeft,e+=n.offsetTop}return{left:t,top:e}},getPointOrigin:function(t){var e=this.offset(),n=this.transform,o=Math.PI/180,a=_(this.element),s=M(a),r=n.origin,i=n.scale.x,l=n.rotate,f=s.translate.x,h=s.translate.y,u=t.pageX-e.left,c=t.pageY-e.top,v=r.x-u,g=r.y-c;v=0==v?.1:v,g=0==g?.1:g;var m,d,p=Math.sqrt(v*v+g*g)/i,x=Math.atan(Math.abs(g/v))/o;0<g&&0<v&&(toangle=x-l),0<g&&v<0&&(toangle=180-x-l),g<0&&0<v&&(toangle=x+l),g<0&&v<0&&(toangle=x-l);var y=p*Math.cos(toangle*o),b=p*Math.sin(toangle*o);return 0<g&&0<v&&(m=r.x-y)&&(d=r.y-b),0<g&&v<0&&(m=r.x-y)&&(d=r.y-b),g<0&&0<v&&(m=r.x-y)&&(d=r.y+b),g<0&&v<0&&(m=r.x+y)&&(d=r.y+b),{x:w(m-f/i),y:w(d-h/i)}},setPointAsOrigin:function(t){var e=this.transform.origin,n=_(this.element),o=this.getPointOrigin(t),a=e.x-o.x,s=e.y-o.y,r=u(n,[[-a],[-s],[1]]),i=r[0][0]+e.x,l=r[1][0]+e.y,f=i-e.x,h=e.y-l;g.call(this,{translate:{x:a+f,y:s-h},origin:o})},translate:function(t,e){if(t){var n=this.transform.translate,o=n.x,a=n.y,s={x:o+t.x,y:a+t.y};g.call(this,{translate:s},e)}},scale:function(t,e){if(t){var n=this.transform.scale.x,o=t*n;console.log(t,n),g.call(this,{scale:o},e)}},rotate:function(t,e){if(t){var n=this.transform.rotate;g.call(this,{rotate:n+t},e)}}},t);function _(t){var e=window.getComputedStyle(t,!1);return c("none"!=e.transform?e.transform:"matrix(1,0,0,1,0,0)")}function g(t,e){var n=this.element,o=n.style.cssText||"",a=this.transform,s=(e=e||"0s",t.origin||a.origin),r=t.translate||a.translate,i=t.scale||a.scale.x,l=t.rotate||a.rotate,f=(e="-webkit-transition:"+e+";","-webkit-transform: translate("+w(r.x)+"px, "+w(r.y)+"px) scale("+w(i)+") rotate("+w(l)+"deg);"),h="-webkit-transform-origin:"+w(s.x)+"px "+w(s.y)+"px;";n.style.cssText=o+";"+e+f+h}function t(t){this.element=t,this.transform=function(t){var e=t.style?t.style.cssText:"";if(rt=/translate\((.+)\)/i.exec(e)||[],rs=/scale\((.+)\)/i.exec(e)||[],rr=/rotate\((.+)\)/i.exec(e)||[],ro=/origin:\s*([^;]+)/i.exec(e)||[],rt.length&&rs.length&&rr.length&&ro.length){var n=rt[1].split(","),o=rs[1],a=rr[1],s=ro[1].split(" ");f={translate:{x:w(n[0]),y:w(n[1])},scale:{x:w(o),y:w(o)},rotate:w(a),origin:{x:w(s[0]),y:w(s[1])}}}else{var r=window.getComputedStyle(t,!1),i=c("none"!=r.transform?r.transform:"matrix(1,0,0,1,0,0)"),l=r["transform-origin"].split(" "),f=M(i),h=w(l[0]),u=w(l[1]);f.origin={x:h,y:u}}return f}(t)}function q(t,e){var n=e.pageX-t.pageX,o=e.pageY-t.pageY;return{offsetx:n,offsety:o,length:Math.sqrt(n*n+o*o)}}function f(t){var e=t.touches&&t.touches.length?t.touches:t.changedTouches&&t.changedTouches.length?t.changedTouches:[t],n={time:(new Date).getTime(),count:e.length,events:e};if(2==e.length){var o=e[0],a=e[1],s=q(o,a),r=s.offsetx,i=s.offsety,l=s.length,f=Math.sqrt(l*l/4-i*i/4),h=o.pageY+i/2,u=o.pageX+(r<0?-f:f);n.length=l,n.center={pageX:u,pageY:h}}return n}function A(t,e,n){var o,a=[e,n],s=this.events,r=this.element,i=n.events[0].target;if(s=this.events[t]){t:for(;i!=r;){var l=i.getAttribute("__gid");if(l){o=s[l];break t}var f=(i.className||"").split(" ");e:for(var h=0;h<f.length;h++){var u=f[h];if(u&&s[u]){i.setAttribute("__gid",u),o=s[u];break e}}if(o)break t;i=i.parentNode}o=o||s[m]}o&&o.apply(new v(i),a)}function e(){function _(t){return-1<O.enabled.indexOf(t)}function o(t){t.preventDefault(),t.stopPropagation()}function t(t){o(t),L=f(t),A.call(O,"start",L,L),a.addEventListener(l?"touchmove":"mousemove",r,!1),a.addEventListener(l?"touchend":"mouseup",i,!1),a.addEventListener(l?"touchcancel":"mouseleave",i,!1)}var T,E,L,P,O=this,a=this.element,k=function(){if(L&&P){var t=L.events,e=P.events,n=q(t[0],e[0]);if(1==L.count&&1==P.count&&_("slide")&&3<n.length){var o={x:n.offsetx,y:n.offsety};E=E||{x:0,y:0},P.translate={x:o.x-E.x,y:o.y-E.y},E=o,T="slide"}else if(2==L.count&&2==P.count){var a=L.length,s=P.length,r=Math.PI/180,i=s/a,l=q(e[1],t[1]),f=n.length+l.length,h=(a*a+s*s-f*f)/(2*a*s),u=Math.acos(h<-1?-1:1<h?1:h)/r;if(!T)if(_("pinch")&&_("rotate"))if(.02<Math.abs(i-1))T="pinch";else{if(!(1<Math.abs(u)))return;T="rotate"}else T=_("pinch")?"pinch":"rotate";if("pinch"==T)null==E&&(E=1),P.scale=i/E,E=i;else if("rotate"==T&&null!=u){null==E&&(E=0);var c=L.center,v=t[0],g=e[0],m=q(c,v),d=q(c,g),p=t[1],x=e[1],y=q(c,p),b=q(c,x),w=m.offsetx*d.offsety-m.offsety*d.offsetx,M=y.offsetx*b.offsety-y.offsety*b.offsetx;u=w<0||M<0?-u:u,P.rotate=u-E,E=u}}T&&A.call(O,T,P,L),X(k)}},s=!1,r=function(t){o(t),P=f(t),!s&&(_("slide")||_("roate")||_("pinch"))&&(X(k),s=!0)},i=function(t){if(!t.touches||0==t.touches.length){o(t);L.events;var e=f(t),n=(e.events,e.time-L.time);e.duration=n,T?A.call(O,T+"End",L,e):function(t,e){var n=t.duration,o=this.__lastTouch,a=o&&t.time-o.time<300?"doubletap":n<200?"tap":"longtap";if("tap"==a&&(this.__lastTouch=t),setTimeout(function(){O.__lastTouch=null},300),"tap"==a&&_("doubletap")){var s=setTimeout(function(){A.call(O,"tap",t,e)},300);this.__lastTouch.itv=s}else o&&o.itv&&clearTimeout(o.itv),_(a)&&A.call(this,a,t,e)}.call(O,e,L),P=L=null,s=!1,E=T=void 0,a.removeEventListener(l?"touchmove":"mousemove",r,!1),a.removeEventListener(l?"touchend":"mouseup",i,!1),a.removeEventListener(l?"touchcancel":"mouseleave",i,!1)}};return a.addEventListener(l?"touchstart":"mousedown",t,!1),t}function n(t){this.element=t||document.body,this.events={},this.enabled=["tap"],this.element.setAttribute("__gid",m),this.__evtfn=e.call(this)}var X=window.requestAnimationFrame||window.webkitRequestAnimationFrame||function(t){window.setTimeout(t,1e3/60)},m="besom-gid-root";return n.prototype={enable:function(){for(var t=["tap","longtap","doubletap","slide","pinch","rotate"],e=0;e<arguments.length;e++){var n=arguments[e];if(!(-1<t.indexOf(n)))throw new Error('Only Support: "'+t.join("|")+'"!');this.enabled.indexOf(n)<0&&this.enabled.push(n)}},disable:function(){for(var t=0;t<arguments.length;t++){var e=arguments[t],n=this.enabled.indexOf(e);-1<n&&this.enabled.splice(n,1)}},on:function(t,e){this.events[t]=this.events[t]||{},this.events[t][m]=e},delegate:function(t,e,n){if(t.indexOf(".")<0)throw new Error('The arguments[0] shoud start width "."!');t=t.substring(1),this.events[e]=this.events[e]||{},this.events[e][t]=n},destroy:function(){this.element.removeEventListener(l?"touchstart":"mousedown",this.__evtfn,!1),this.__evtfn,this.element=null,this.events={}}},{create:function(t){return new n(t)},element:function(t){return new v(t)}}});

package.json

 {
   "name": "besom",
-  "version": "1.0.3",
-  "description": "A Javascript Library For Multi-Touch Gestures (tap, longtap, doubletap, rotate, pinch, slide) - Support PC Web Mouse Event",
+  "version": "2.0.0",
+  "description": "A Javascript Library For Multi-Touch or Mouse Event Gestures (tap, longtap, doubletap, pinch, slide, rotate)",
   "main": "src/index.js",
@@ -29,6 +29,8 @@ "scripts": {
   ],
-  "author": {
-    "name": "abcrun",
-    "email": "[e-mail]"
-  },
+  "author": [
+    {
+      "name": "abcrun",
+      "email": "[e-mail]"
+    }
+  ],
   "license": "MIT",
@@ -35,0 +37,0 @@ "bugs": {

README.md

 ### Besom 
 
-A Javascript Library For Multi-Touch Gestures (tap, longtap, doubletap, rotate, pinch, slide) - Support PC Web Mouse Event
+A Javascript Library For Multi-Touch and Mouse Event Gestures (tap, longtap, doubletap, pinch, slide, rotate)
 
 ### Installation
 
-#### NPM
+`npm install besom --save` or `yarn add besom` or cdn  [https://cdn.jsdelivr.net/npm/besom/dist/besom.min.js](https://cdn.jsdelivr.net/npm/besom/dist/besom.min.js)
 
-```
-npm install besom --save
-```
-
-###### or
-
-#### Yarn
-
-```
-yarn add besom
-```
-
-###### or
-
-#### CDN
-
-[https://cdn.jsdelivr.net/npm/besom/dist/besom.min.js](https://cdn.jsdelivr.net/npm/besom/dist/besom.min.js)
-
-
 ### Usage
@@ -38,16 +19,11 @@
 
-  g.on('start', function(){ console.log('gesture start') });//detect the gesture start
-
-  g.on('slide', function(){ console.log('slide') });
+  g.on('slide', function(e){ this.translate(e.translate) });
   g.on('slideEnd', function(){ console.log('slideEnd')  });
 
-  g.on('pinch', function(){ console.log('pinch') });
+  g.on('start', function(e){
+    if(e.counts == 2) this.setPointAsOrigin(e.center)
+  })
+  g.on('pinch', function(e){ this.scale(e.scale) });
   g.on('pinchEnd', function(){ console.log('pinchEnd') });
 
-  g.delegate('.control-bar', 'start', function(){ console.log('control-bar is slide start') })
-  g.delegate('.control-bar', 'slide', function(){ console.log('control-bar is sliding') })
-  g.delegate('.control-bar', 'slideEnd', function(){ console.log('control-bar slide end') })
-
-  g.disable('slide');
-
 ```
@@ -61,3 +37,3 @@
 
-* `tap` 
+* `tap`(enabled default) 
 * `longtap`
@@ -69,5 +45,5 @@ * `doubletap`
 
-### Supported Events
+### Bind Event Name
 
-* `tap`(enabled default)
+* `tap`
 * `longtap`
@@ -83,3 +59,3 @@ * `doubletap`
 
-### Instace And Methods
+### Instance And Methods
 
@@ -89,7 +65,6 @@ ##### Create Gestures Maintainer
 ```javascript
-Besom.create(element, onlydetect)
+Besom.create(element)
 ```
 
-* element:HTMLElement.
-* onlydetect:boolean(default: false) - only detect the gestures and capture the gesture datas to the event function when set `true`. 
+* element:HTMLElement 
 
@@ -102,20 +77,9 @@ ###### Gestures Maintainer Methods
 
-   the parameter of the event  function - `fn(property, currentGestureEventObject, startGestureEventObject)`
+   the parameter of the event function - `fn(currentGestureEventObject, startGestureEventObject)`
 
-  * `property` - the changed value of the gestures
-  * `currentGestureEventObject` and `startGestureEventObject` is the formatted event object.
-  * `this` - refers to a transformable element. more details see bellow.
+     * `currentGestureEventObject` and `startGestureEventObject` is the formatted event object
+     * `this` - refers to a transformable element. More details see bellow
 
-* delegate(className, event, fn) - delegate the gesture of the child element which has the className `class`. If use this method, `onlydetect` will be set true.
+* delegate(className, event, fn) - delegate the gesture of the child element which has the className `className`
 
-* setOrigin(point) - set the element transform origin point({x:number, y:number}), x and y is the relative position in the element matrix.
-
-* scale(scale, duration) - transition: string(for example: '500ms')
-
-* rotate(rotate, duration)
-
-* translate(offset, duration)
-
-* getPointOrigin(point) - get the point({pageX:number, pageY:number) origin in the element matrix
-
 * destroy() - destroy the gesture manager and events
@@ -136,4 +100,4 @@
 * offset() - return the element offset.left and offset.top in the page
-* setOrigin(point) - set the element transform origin point({x:number, y:number}), x and y is the relative position in the element matrix.
-* getPointOrigin(point) - get the point({pageX:number, pageY:number) origin in the element matrix
+* getPointOrigin(point) - caculate the point({pageX:number, pageY:number) in the element matrix
+* setPointAsOrigin(point) - set the point({pageX:number, pageY:number}) as the element origin
 * translate(offset, duration) - translate offset.x as horizon and offset.y as vertical distance in duration time.
@@ -140,0 +104,0 @@ * scale(scale, duration)

src/index.js

@@ -12,2 +12,4 @@ /**
   //util methods
+  var istouch =  'ontouchend' in document;
+
   var f3 = function(num){
@@ -24,10 +26,2 @@ return Math.round(parseFloat(num)*1000)/1000;
         else matrix = [[1, 0, 0], [0, 1, 0], [0, 0, 1]];
-      }else{
-        var t = matrix.translate || 0, s = matrix.scale.x || 1, r = matrix.rotate || 0,
-          r = r * Math.PI/180, sin = f3(Math.sin(r)), cos = f3(Math.cos(r));
-
-        matrix = this.mutiply(this.mutiply(
-          [[1, 0, t.x], [0, 1, t.y],[0, 0, 1]],
-          [[cos, -sin, 0], [sin, cos, 0], [0, 0, 1]]
-        ),[[s, 0, 0], [0, s, 0], [0, 0, 1]]);
       }
@@ -68,97 +62,121 @@
   //element
-  var E = function(elm) {
-    this.element = elm;
-    this.resetTransform();
-  }
-  E.prototype = {
-    offset: function(){
-      var elm = this.element, left = elm.offsetLeft, top = elm.offsetTop;
-      while(elm.offsetParent){
-          var elm = elm.offsetParent;
-          left += elm.offsetLeft;
-          top += elm.offsetTop;
-      }
-      return { left: left, top: top }
-    },
-    resetTransform: function(){
-      var styles = window.getComputedStyle(this.element, false),
-        matrix = Matrix.create(styles['transform'] != 'none' ? styles['transform'] : 'matrix(1,0,0,1,0,0)'), origin = styles['transform-origin'].split(' '),
-        json = Matrix.parse(matrix), originx = f3(origin[0]), originy = f3(origin[1]);
+  var E = (function(){
+    //get matrix
+    var getMatrix = function(elm){
+      var styles = window.getComputedStyle(elm, false);
+      return Matrix.create(styles['transform'] != 'none' ? styles['transform'] : 'matrix(1,0,0,1,0,0)');
+    }
 
-      this.transform = {
-        matrix: matrix,
-        json: Matrix.parse(matrix),
-        origin: {
-          x: originx,
-          y: originy
+    //getTransform
+    var getTransform = function(elm){
+      var cssText = elm.style ? elm.style.cssText : '', transform;
+        rt = /translate\((.+)\)/i.exec(cssText) || [], rs = /scale\((.+)\)/i.exec(cssText) || [], rr = /rotate\((.+)\)/i.exec(cssText) || [], ro = /origin:\s*([^;]+)/i.exec(cssText) || [];
+      if(rt.length && rs.length && rr.length && ro.length){
+        var t = rt[1].split(','), s = rs[1], r = rr[1], o = ro[1].split(' ');
+        transform = {
+          translate:{ x: f3(t[0]), y: f3(t[1]) },
+          scale: { x:f3(s), y:f3(s) },
+          rotate: f3(r),
+          origin: { x: f3(o[0]) , y: f3(o[1]) },
         }
+      }else{
+        var styles = window.getComputedStyle(elm, false),
+          matrix = Matrix.create(styles['transform'] != 'none' ? styles['transform'] : 'matrix(1,0,0,1,0,0)'), origin = styles['transform-origin'].split(' '),
+          transform = Matrix.parse(matrix), originx = f3(origin[0]), originy = f3(origin[1]);
+
+        transform.origin = { x: originx, y: originy };
       }
-    },
-    getPointOrigin: function(point){
-      var o = this.offset(), p = { x: point.pageX - o.left, y: point.pageY - o.top },
-        transform = this.transform, toradian = Math.PI/180, json = transform.json, origin = transform.origin,
-        rotate = json.rotate, scale = json.scale.x, translate = json.translate, tx = translate.x, ty = translate.y,
-        offsetx = origin.x - p.x, offsety = origin.y - p.y, point_origin_distance = Math.sqrt(offsetx*offsetx + offsety*offsety)/scale,
-        angle = Math.atan(Math.abs(offsety/offsetx))/toradian, nx, ny;
 
-      if(offsety > 0 && offsetx > 0) toangle = angle - rotate;
-      if(offsety > 0 && offsetx < 0) toangle = 180 - angle - rotate;
-      if(offsety < 0 && offsetx > 0) toangle = angle + rotate;
-      if(offsety < 0 && offsetx < 0) toangle = angle - rotate;
+      return transform;
+    }
 
-      var dx = point_origin_distance*Math.cos(toangle*toradian), dy = point_origin_distance*Math.sin(toangle*toradian);
+    //render
+    var render = function(opt, transition){
+      var elm = this.element, cssText = elm.style.cssText || '', s = this.transform, transition = transition || '0s',
+        torigin = opt.origin || s.origin, translate = opt.translate || s.translate, scale = opt.scale || s.scale.x, rotate = opt.rotate || s.rotate,
+        transition = '-webkit-transition:' + transition + ';',
+        transform = '-webkit-transform: translate(' + f3(translate.x) + 'px, ' + f3(translate.y) + 'px) scale(' + f3(scale) + ') rotate(' + f3(rotate) + 'deg);',
+        origin = '-webkit-transform-origin:' + f3(torigin.x) + 'px ' + f3(torigin.y) + 'px;';
 
-      if(offsety > 0 && offsetx > 0) (nx = origin.x - dx) && (ny = origin.y - dy);
-      if(offsety > 0 && offsetx < 0) (nx = origin.x - dx) && (ny = origin.y - dy);
-      if(offsety < 0 && offsetx > 0) (nx = origin.x - dx) && (ny = origin.y + dy);
-      if(offsety < 0 && offsetx < 0) (nx = origin.x + dx) && (ny = origin.y + dy);
+      elm.style.cssText = cssText + ';' + transition + transform + origin;
+    }
 
-      return {
-        x: nx - tx/scale,
-        y: ny - ty/scale
-      }
-    },
-    setOrigin: function(origin){
-      var transform = this.transform, matrix = transform.matrix, preorigin = transform.origin;
-      var origin_gridx_inpreorigin = preorigin.x - origin.x, origin_gridy_inpreorigin = preorigin.y - origin.y,
-        origin_matrix_inpreorigin = [ [-origin_gridx_inpreorigin], [-origin_gridy_inpreorigin], [1] ], origin_position_inpreorigin = Matrix.mutiply(matrix, origin_matrix_inpreorigin),
-        origin_positionx_inpreorigin = origin_position_inpreorigin[0][0] + preorigin.x, origin_positiony_inpreorigin = origin_position_inpreorigin[1][0] + preorigin.y,
-        offsetx = origin_positionx_inpreorigin - preorigin.x, offsety = preorigin.y - origin_positiony_inpreorigin,
-        nx = origin_gridx_inpreorigin + offsetx, ny = origin_gridy_inpreorigin - offsety;
+    //constructor
+    var $ = function(elm) {
+      this.element = elm;
+      this.transform = getTransform(elm);
+    }
+    $.prototype = {
+      offset: function(){
+        var elm = this.element, left = elm.offsetLeft, top = elm.offsetTop;
+        while(elm.offsetParent){
+            var elm = elm.offsetParent;
+            left += elm.offsetLeft;
+            top += elm.offsetTop;
+        }
+        return { left: left, top: top }
+      },
+      getPointOrigin: function(point){
+        var o = this.offset(), transform = this.transform, toradian = Math.PI/180, matrix = getMatrix(this.element), json = Matrix.parse(matrix),
+          origin = transform.origin, scale = transform.scale.x, rotate = transform.rotate, tx = json.translate.x, ty = json.translate.y,
+          p = { x: point.pageX - o.left, y: point.pageY - o.top }, offsetx = origin.x - p.x, offsety = origin.y - p.y;
 
-      this.render({ translate:{ x: nx, y: ny }, origin: origin })
-      this.resetTransform();
-    },
-    translate: function(offset, transition){
-      var matrix = this.transform.matrix, tx = matrix[0][2], ty = matrix[1][2], nt = {
-        x: tx + offset.x,
-        y: ty + offset.y
-      }
+        //I am a little lazy
+        offsetx = offsetx == 0 ? .1 : offsetx;
+        offsety = offsety == 0 ? .1 : offsety;
 
-      this.render({ translate: nt }, transition)
-      this.resetTransform();
-    },
-    scale: function(increase, transition){
-      var json = this.transform.json, s = json.scale.x, ns = increase*s;
+        var point_origin_distance = Math.sqrt(offsetx*offsetx + offsety*offsety)/scale, angle = Math.atan(Math.abs(offsety/offsetx))/toradian, nx, ny;
+        if(offsety > 0 && offsetx > 0) toangle = angle - rotate;
+        if(offsety > 0 && offsetx < 0) toangle = 180 - angle - rotate;
+        if(offsety < 0 && offsetx > 0) toangle = angle + rotate;
+        if(offsety < 0 && offsetx < 0) toangle = angle - rotate;
 
-      this.render({ scale: ns }, transition);
-      this.resetTransform();
-    },
-    rotate: function(rotateangle, transition){
-      var json = this.transform.json, r = json.rotate, nr = r + rotateangle;
+        var dx = point_origin_distance*Math.cos(toangle*toradian), dy = point_origin_distance*Math.sin(toangle*toradian);
 
-      this.render({ rotate: nr }, transition);
-      this.resetTransform();
-    },
-    render: function(opt, transition){
-      var elm = this.element, cssText = elm.style.cssText || '', s = this.transform, m = s.matrix, t = s.json, origin = opt.origin || s.origin, transition = transition || '0s',
-        translate = opt.translate || {x:m[0][2], y:m[1][2]}, scale = f3(opt.scale || t.scale.x), rotate = f3(opt.rotate || t.rotate),
-        transition = '-webkit-transition:' + transition + ';',
-        transform = '-webkit-transform: translate(' + f3(translate.x) + 'px, ' + f3(translate.y) + 'px) scale(' + scale + ') rotate(' + rotate + 'deg);',
-        origin = '-webkit-transform-origin:' + origin.x + 'px ' + origin.y + 'px;';
+        if(offsety > 0 && offsetx > 0) (nx = origin.x - dx) && (ny = origin.y - dy);
+        if(offsety > 0 && offsetx < 0) (nx = origin.x - dx) && (ny = origin.y - dy);
+        if(offsety < 0 && offsetx > 0) (nx = origin.x - dx) && (ny = origin.y + dy);
+        if(offsety < 0 && offsetx < 0) (nx = origin.x + dx) && (ny = origin.y + dy);
 
-      elm.style.cssText = cssText + ';' + transition + transform + origin;
+        return {
+          x: f3(nx - tx/scale),
+          y: f3(ny - ty/scale)
+        }
+      },
+      setPointAsOrigin: function(point){
+        var transform = this.transform, preorigin = transform.origin, matrix = getMatrix(this.element), origin = this.getPointOrigin(point);
+        var origin_gridx_inpreorigin = preorigin.x - origin.x, origin_gridy_inpreorigin = preorigin.y - origin.y,
+          origin_matrix_inpreorigin = [ [-origin_gridx_inpreorigin], [-origin_gridy_inpreorigin], [1] ], origin_position_inpreorigin = Matrix.mutiply(matrix, origin_matrix_inpreorigin),
+          origin_positionx_inpreorigin = origin_position_inpreorigin[0][0] + preorigin.x, origin_positiony_inpreorigin = origin_position_inpreorigin[1][0] + preorigin.y,
+          offsetx = origin_positionx_inpreorigin - preorigin.x, offsety = preorigin.y - origin_positiony_inpreorigin,
+          nx = origin_gridx_inpreorigin + offsetx, ny = origin_gridy_inpreorigin - offsety;
+
+        render.call(this, { translate:{ x: nx, y: ny }, origin: origin })
+      },
+      translate: function(offset, transition){
+        if(!offset) return;
+
+        var translate = this.transform.translate, tx = translate.x, ty = translate.y, nt = { x: tx + offset.x, y: ty + offset.y };
+        render.call(this, { translate: nt }, transition)
+      },
+      scale: function(increase, transition){
+        if(!increase) return;
+
+        var scale = this.transform.scale.x, ns = increase*scale;
+        console.log(increase, scale)
+        render.call(this, { scale: ns }, transition);
+      },
+      rotate: function(rotateangle, transition){
+        if(!rotateangle) return;
+
+        var rotate = this.transform.rotate, nr = rotate + rotateangle;
+        render.call(this, { rotate: nr }, transition);
+      }
     }
-  }
 
+    return $;
+
+  })();
+
+
   //animation
@@ -179,17 +197,14 @@ var animation = (function(){
 
-  //touchInfo
-  var getTouchInfo = function(e){
+  //format event
+  var Evt = function(e){
     var touches = (e.touches && e.touches.length) ? e.touches : (e.changedTouches && e.changedTouches.length ? e.changedTouches : [e]), infos = {
       time:new Date().getTime(),
       count: touches.length,
-      event: touches
+      events: touches,
     };
 
     if(touches.length == 2){
-      var finger1 = touches[0], finger2 = touches[1],
-        x = finger2.pageX - finger1.pageX, y = finger2.pageY - finger1.pageY,
-        length = Math.sqrt(x*x + y*y),
+      var finger1 = touches[0], finger2 = touches[1], d = distance(finger1, finger2), x = d.offsetx, y = d.offsety, length = d.length,
         offsetx = Math.sqrt(length*length/4 - y*y/4),
-        top = finger1.pageY + y/2,
-        left = finger1.pageX + (x < 0 ? -offsetx : offsetx);
+        top = finger1.pageY + y/2, left = finger1.pageX + (x < 0 ? -offsetx : offsetx);
 
@@ -204,10 +219,10 @@ infos.length = length;
   //event trigger
-  var trigger = function(name, options, current, start){
-    var arg = [ options, current, start ], events = this.events, elm = this.element.element, target = start.event[0].target, delegates = this.delegates[name], fn;
+  var trigger = function(name, current, start){
+    var arg = [ current, start ], events = this.events, elm = this.element, target = start.events[0].target, events = this.events[name], fn;
 
-    if(delegates){
+    if(events){
       outer: while(target != elm){
         var gid = target.getAttribute('__gid');
         if(gid){
-          fn = delegates[gid];
+          fn = events[gid];
           break outer;
@@ -219,5 +234,5 @@ }else{
             var cl = arr[i];
-            if(cl && delegates[cl]){
+            if(cl && events[cl]){
               target.setAttribute('__gid', cl);
-              fn = delegates[cl];
+              fn = events[cl];
               break inner;
@@ -231,64 +246,66 @@ }
       }
+
+      fn = fn || events[rootgid];
     }
 
     if(fn) fn.apply(new E(target), arg);
-    else if(this.events[name]) this.events[name].apply(this.element, arg)
   }
 
-  var istouch =  'ontouchend' in document;
 
   //bind event
   var bindEvent = function(){
-    var that = this, elm = this.element.element;
+    var that = this, elm = this.element;
     var enabled = function(g){ return that.enabled.indexOf(g) > -1 };
-    var mark, ispinch;
+    var name, mark;
 
-    var slide = function(){
-      if(!moveInfo) return;
-      if(!mark) mark = { x:0, y:0 }
+    var calculate = function(){
+      if(!startInfo || !moveInfo) return;
 
-      var st = startInfo.event[0], mt = moveInfo.event[0], d = distance(st, mt), offsetx = d.offsetx, offsety = d.offsety, offset = { x: offsetx, y: offsety };
+      var starttouches = startInfo.events, movetouches = moveInfo.events, p0 = distance(starttouches[0], movetouches[0]);
+      if(startInfo.count == 1 && moveInfo.count == 1 && enabled('slide') && p0.length > 3){
+        var offset = { x: p0.offsetx, y: p0.offsety };
+        if(!mark) mark = { x: 0, y: 0 };
 
-      !that.onlydetect && that.element.translate({x: offset.x - mark.x, y: offset.y - mark.y }, 0)
-      trigger.call(that, 'slide', {increase: {x: offset.x - mark.x, y: offset.y - mark.y }, total: offset} , moveInfo, startInfo);
-      mark = { x: offsetx, y: offsety };
+        moveInfo.translate = { x: offset.x - mark.x, y: offset.y - mark.y };
+        mark = offset;
+        name = 'slide';
+      }else if(startInfo.count == 2 && moveInfo.count == 2){
+        var startlength = startInfo.length, movelength = moveInfo.length, toradian = Math.PI/180, scale = movelength/startlength;
+        var p1 = distance(movetouches[1], starttouches[1]), rotatelength0 = p0.length, rotatelength1 = p1.length,
+          rotatelength = rotatelength0 + rotatelength1, rvalue = (startlength*startlength + movelength*movelength - rotatelength*rotatelength)/(2*startlength*movelength),
+          rotate = Math.acos(rvalue < -1 ? -1 : (rvalue > 1 ? 1 : rvalue))/toradian;
 
-      animation(slide);
-    };
+        if(!name){
+          if(enabled('pinch') && enabled('rotate')){
+            if(Math.abs(scale - 1) > 0.02) name = 'pinch';
+            else if(Math.abs(rotate) > 1) name = 'rotate';
+            else return;
+          }else{
+            name = enabled('pinch') ? 'pinch' : 'rotate';
+          }
+        }
 
-    var pinchAndRotate = function(){
-      if(!moveInfo || moveInfo.count != 2 || startInfo.count != 2) return;
+        if(name == 'pinch'){
+          if(mark == undefined) mark = 1;
+          moveInfo.scale = scale/mark;
+          mark = scale;
+        }else if(name == 'rotate' && rotate != undefined){
+          if(mark == undefined) mark = 0;
 
-      var starttouches = startInfo.event, movetouches = moveInfo.event, startlength = startInfo.length, movelength = moveInfo.length, toradian = Math.PI/180, totalscale = movelength/startlength,
-        d0 = distance(movetouches[0], starttouches[0]), d1 = distance(movetouches[1], starttouches[1]), rotatelength0 = d0.length, rotatelength1 = d1.length,
-        rotatelength = rotatelength0 + rotatelength1, rvalue = (startlength*startlength + movelength*movelength - rotatelength*rotatelength)/(2*startlength*movelength),
-        totalrotate = Math.acos(rvalue < -1 ? -1 : (rvalue > 1 ? 1 : rvalue))/toradian;
+          var center = startInfo.center,s0 = starttouches[0], e0 = movetouches[0], ds0 = distance(center, s0), de0 = distance(center, e0),
+            s1 = starttouches[1], e1 = movetouches[1], ds1 = distance(center, s1), de1 = distance(center, e1),
+            d0 = ds0.offsetx * de0.offsety - ds0.offsety * de0.offsetx, d1 = ds1.offsetx * de1.offsety - ds1.offsety * de1.offsetx;
 
-
-      ispinch = ispinch == undefined ? (Math.abs(totalscale - 1) > 0.01 || Math.abs(totalrotate) < .2 ? true : false) : ispinch;
-
-      if(ispinch){
-        if(!mark) mark = 1;
-        var increase = totalscale/mark;
-
-        !that.onlydetect && that.element.scale(increase, 0);
-        trigger.call(that, 'pinch', {increase: increase, total: totalscale}, moveInfo, startInfo);
-        mark = totalscale;
-      }else{
-        if(!mark) mark = 0;
-
-        var index = starttouches[0].pageY < starttouches[1].pageY ? 0 : 1, direction = movetouches[index].pageX - starttouches[index].pageX >= 0 ? 1 : -1,
-          totalrotate = direction * totalrotate, increase = totalrotate - mark;
-
-        !that.onlydetect && that.element.rotate(increase, 0);
-        trigger.call(that, 'rotate', { increase: increase, total: totalrotate}, moveInfo, startInfo);
-        mark = totalrotate;
+          rotate = (d0 < 0 || d1 < 0) ? -rotate : rotate;
+          moveInfo.rotate = rotate - mark;
+          mark = rotate;
+        }
       }
 
-      animation(pinchAndRotate);
-
+      name && trigger.call(that, name, moveInfo, startInfo);
+      animation(calculate);
     }
 
-    var tap = function(duration, endInfo, startInfo){
-      var that = this, last = this.__lastTouch, name = last && endInfo.time - last.time < 300 ? 'doubletap' : (duration < 200 ? 'tap' : 'longtap');
+    var tap = function(endInfo, startInfo){
+      var duration = endInfo.duration, last = this.__lastTouch, name = last && endInfo.time - last.time < 300 ? 'doubletap' : (duration < 200 ? 'tap' : 'longtap');
 
@@ -300,3 +317,3 @@ name == 'tap' && (this.__lastTouch = endInfo)
         var itv = setTimeout(function(){
-          trigger.call(that, 'tap', {duration:duration}, endInfo, startInfo)
+          trigger.call(that, 'tap', endInfo, startInfo)
         }, 300);
@@ -306,3 +323,3 @@ this.__lastTouch.itv = itv;
         last && last.itv && clearTimeout(last.itv);
-        enabled(name) && trigger.call(this, name, {duration:duration}, endInfo, startInfo)
+        enabled(name) && trigger.call(this, name, endInfo, startInfo)
       }
@@ -313,61 +330,41 @@ };
     //addEvent
-    var startInfo, moveInfo, ismoving;
+    var startInfo, moveInfo, isanimation = false, die = function(e){
+      e.preventDefault();
+      e.stopPropagation();
+    }
     var start = function(e){
-      e.preventDefault();
-      startInfo = getTouchInfo(e);
+      die(e);
+      startInfo = Evt(e);
 
-      if(startInfo.count == 2){
-        var startcenter = startInfo.center, origin = that.element.getPointOrigin(startcenter);
-        that.element.setOrigin(origin);
-      }
+      trigger.call(that, 'start', startInfo, startInfo);
 
-      trigger.call(that, 'start', null, startInfo, startInfo)
-
       elm.addEventListener(istouch ? 'touchmove' : 'mousemove', move, false);
-      elm.addEventListener(istouch ? 'touchend' : 'mouseup', end, false)
-      elm.addEventListener(istouch ? 'touchcancel' : 'mouseleave', end, false)
+      elm.addEventListener(istouch ? 'touchend' : 'mouseup', end, false);
+      elm.addEventListener(istouch ? 'touchcancel' : 'mouseleave', end, false);
     }
     var move = function(e){
-      e.preventDefault();
+      die(e);
+      moveInfo = Evt(e);
 
-      moveInfo = getTouchInfo(e);
-
-      if(!ismoving){
-        if((enabled('slide')) && moveInfo.count == 1 && startInfo.count == 1){
-          animation(slide);
-        }
-
-        if((enabled('pinch') || enabled('rotate')) && moveInfo.count == 2 && startInfo.count == 2){
-          ispinch = enabled('pinch') ? (!enabled('rotate') ? true : undefined) : false;
-          animation(pinchAndRotate)
-        }
-
-        ismoving = true;
+      if(!isanimation && (enabled('slide') || enabled('roate') || enabled('pinch'))){
+        animation(calculate);
+        isanimation = true;
       }
     }
+
     var end = function(e){
-      var starttouches = startInfo.event, endInfo = getTouchInfo(e), endtouches = endInfo.event, endTime = endInfo.time, duration = endTime - startInfo.time, name;
-
-      e.preventDefault();
       if(e.touches && e.touches.length != 0) return;
+      die(e);
 
-      if(startInfo.count == 1){
-        var d = distance(starttouches[0], endtouches[0]), offsetx = d.offsetx, offsety = d.offsety;
+      var starttouches = startInfo.events, endInfo = Evt(e), endtouches = endInfo.events, endTime = endInfo.time, duration = endTime - startInfo.time;
+      endInfo.duration = duration;
 
-        if(Math.abs(offsetx) < 3 && Math.abs(offsety) < 3){
-          tap.call(that, duration, endInfo, startInfo);
-        }else{
-          name = 'slide';
-        }
-      }else{
-        name = enabled('pinch') ? 'pinch' : (enabled('rotate') ? 'rotate' : undefined);
-      }
+      if(name) trigger.call(that, name + 'End', startInfo, endInfo);
+      else tap.call(that, endInfo, startInfo);
 
-      that.element.resetTransform();
-      name && trigger.call(that, name + 'End', { duration: duration, total: mark }, endInfo, startInfo)
-
+      startInfo = null;
       moveInfo = null;
-      ismoving = undefined;
+      isanimation = false;
+      name = undefined;
       mark = undefined;
-      ispinch = undefined;
 
@@ -384,13 +381,8 @@ elm.removeEventListener(istouch ? 'touchmove' : 'mousemove', move, false);
 
-  var Gesture = function(elm, onlydetect){
-    if(elm.length){
-      throw new Error('The element parameter shouldn\'t be an array list. If you want to add gestures to these elements, please use delegate method of their parent element');
-      return;
-    }
-    this.element = new E(elm);
+  var rootgid = 'besom-gid-root', Gesture = function(elm){
+    this.element = elm || document.body;
     this.events = {};
-    this.delegates = {};
     this.enabled = [ 'tap' ]; //default
-    this.onlydetect = onlydetect || false;
 
+    this.element.setAttribute('__gid', rootgid);
     this.__evtfn = bindEvent.call(this);//return event function in order to destroy
@@ -411,17 +403,2 @@ }
     },
-    getPointOrigin: function(point){
-      this.element.getPointOrigin(point);
-    },
-    setOrigin: function(origin){
-      this.element.setOrigin(origin);
-    },
-    scale: function(scale, transition){
-      this.element.scale(scale, transition);
-    },
-    rotate: function(rotate, transition){
-      this.element.rotate(rotate, transition);
-    },
-    translate: function(offset, transition){
-      this.element.translate(offset, transition);
-    },
     disable: function(){
@@ -434,14 +411,14 @@ for(var i = 0; i < arguments.length; i++){
     on: function(name, fn){
-      this.events[name] = fn;
+      this.events[name] = this.events[name] || {};
+      this.events[name][rootgid] = fn;
     },
     delegate: function(cls, name, fn){
       if(cls.indexOf('.') < 0){
-        throw new Error('The parameter cls shoud start width "."!');
+        throw new Error('The arguments[0] shoud start width "."!');
         return;
       }
       cls = cls.substring(1);
-      this.onlydetect = true;
 
-      this.delegates[name] = this.delegates[name] || {};
-      this.delegates[name][cls] = fn;
+      this.events[name] = this.events[name] || {};
+      this.events[name][cls] = fn;
 
@@ -454,4 +431,2 @@ },
       this.events = {};
-      this.delegates = {};
-      this.onlydetect = false;
     }
@@ -461,4 +436,4 @@ }
   return {
-    create: function(elm, onlydetect){
-      return new Gesture(elm, onlydetect || false);
+    create: function(elm){
+      return new Gesture(elm);
     },
@@ -465,0 +440,0 @@ element: function(elm){

New alerts

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No contributors or author data

Maintenance

Package does not specify a list of contributors or an author in package.json.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

28176

decreased by-93.69%

Number of package files

6

decreased by-25%

Lines of code

378

decreased by-5.74%

Number of high maintenance alerts

1

increased byInfinity%

Number of low maintenance alerts

1

increased byInfinity%

Number of lines in readme file

101

decreased by-26.28%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes