人人商城

mui.zoom.js 4.7KB

1
  1. !function(o,t){var e="."+o.className("zoom"),r="."+o.className("zoom-scroller"),n="pinchstart",a="pinch",i="pinchend";"ongesturestart"in t&&(n="gesturestart",a="gesturechange",i="gestureend"),o.Zoom=function(t,s){var m=this;m.options=o.extend(o.Zoom.defaults,s),m.wrapper=m.element=t,m.scroller=t.querySelector(r),m.scrollerStyle=m.scroller&&m.scroller.style,m.zoomer=t.querySelector(e),m.zoomerStyle=m.zoomer&&m.zoomer.style,m.init=function(){o.options.gestureConfig.pinch=!0,o.options.gestureConfig.doubletap=!0,m.initEvents()},m.initEvents=function(o){var t=o?"removeEventListener":"addEventListener",e=m.scroller;e[t](n,m.onPinchstart),e[t](a,m.onPinch),e[t](i,m.onPinchend),e[t]("touchstart",m.onTouchstart),e[t]("touchmove",m.onTouchMove),e[t]("touchcancel",m.onTouchEnd),e[t]("touchend",m.onTouchEnd),e[t]("drag",function(o){(T||h)&&o.stopPropagation()}),e[t]("doubletap",function(o){m.toggleZoom(o.detail.center)})},m.transition=function(o,t){return t=t||0,o.webkitTransitionDuration=t+"ms",m},m.translate=function(o,t,e){return t=t||0,e=e||0,o.webkitTransform="translate3d("+t+"px,"+e+"px,0px)",m},m.scale=function(o,t){return t=t||1,o.webkitTransform="translate3d(0,0,0) scale("+t+")",m},m.scrollerTransition=function(o){return m.transition(m.scrollerStyle,o)},m.scrollerTransform=function(o,t){return m.translate(m.scrollerStyle,o,t)},m.zoomerTransition=function(o){return m.transition(m.zoomerStyle,o)},m.zoomerTransform=function(o){return m.scale(m.zoomerStyle,o)};var l=1,c=1,u=!1,h=!1;m.onPinchstart=function(o){h=!0},m.onPinch=function(o){u||(m.zoomerTransition(0),u=!0),(l=(o.detail?o.detail.scale:o.scale)*c)>m.options.maxZoom&&(l=m.options.maxZoom-1+Math.pow(l-m.options.maxZoom+1,.5)),l<m.options.minZoom&&(l=m.options.minZoom+1-Math.pow(m.options.minZoom-l+1,.5)),m.zoomerTransform(l)},m.onPinchend=function(o){l=Math.max(Math.min(l,m.options.maxZoom),m.options.minZoom),m.zoomerTransition(m.options.speed).zoomerTransform(l),c=l,u=!1},m.setZoom=function(o){l=c=o,m.scrollerTransition(m.options.speed).scrollerTransform(0,0),m.zoomerTransition(m.options.speed).zoomerTransform(l)},m.toggleZoom=function(t,e){if("number"==typeof t&&(e=t,t=void 0),e=void 0===e?m.options.speed:e,l&&1!==l)l=c=1,m.scrollerTransition(e).scrollerTransform(0,0);else if(l=c=m.options.maxZoom,t){var r=o.offset(m.zoomer),n=r.top,a=r.left,i=(t.x-a)*l,s=(t.y-n)*l;this._cal(),i>=z&&i<=z+f?i=z-i+f/2:i<z?i=z-i+f/2:i>z+f&&(i=z+f-i-f/2),s>=y&&s<=y+p?s=y-s+p/2:s<y?s=y-s+p/2:s>y+p&&(s=y+p-s-p/2),i=Math.min(Math.max(i,x),z),s=Math.min(Math.max(s,v),y),m.scrollerTransition(e).scrollerTransform(i,s)}else m.scrollerTransition(e).scrollerTransform(0,0);m.zoomerTransition(e).zoomerTransform(l)},m._cal=function(){f=m.wrapper.offsetWidth,p=m.wrapper.offsetHeight,w=m.zoomer.offsetWidth,Z=m.zoomer.offsetHeight;var o=w*l,t=Z*l;x=Math.min(f/2-o/2,0),z=-x,v=Math.min(p/2-t/2,0),y=-v};var f,p,d,T,g,M,x,v,z,y,w,Z,b,S,E,P,k,A,H,W={},X={};return m.onTouchstart=function(o){o.preventDefault(),d=!0,W.x="touchstart"===o.type?o.targetTouches[0].pageX:o.pageX,W.y="touchstart"===o.type?o.targetTouches[0].pageY:o.pageY},m.onTouchMove=function(t){if(t.preventDefault(),d){if(!T){f=m.wrapper.offsetWidth,p=m.wrapper.offsetHeight,w=m.zoomer.offsetWidth,Z=m.zoomer.offsetHeight;var e=o.parseTranslateMatrix(o.getStyles(m.scroller,"webkitTransform"));b=e.x||0,S=e.y||0,m.scrollerTransition(0)}var r=w*l,n=Z*l;r<f&&n<p||(x=Math.min(f/2-r/2,0),z=-x,v=Math.min(p/2-n/2,0),y=-v,X.x="touchmove"===t.type?t.targetTouches[0].pageX:t.pageX,X.y="touchmove"===t.type?t.targetTouches[0].pageY:t.pageY,T||u||!(Math.floor(x)===Math.floor(b)&&X.x<W.x||Math.floor(z)===Math.floor(b)&&X.x>W.x)?(T=!0,g=X.x-W.x+b,M=X.y-W.y+S,g<x&&(g=x+1-Math.pow(x-g+1,.8)),g>z&&(g=z-1+Math.pow(g-z+1,.8)),M<v&&(M=v+1-Math.pow(v-M+1,.8)),M>y&&(M=y-1+Math.pow(M-y+1,.8)),E||(E=X.x),A||(A=X.y),P||(P=o.now()),k=(X.x-E)/(o.now()-P)/2,H=(X.y-A)/(o.now()-P)/2,Math.abs(X.x-E)<2&&(k=0),Math.abs(X.y-A)<2&&(H=0),E=X.x,A=X.y,P=o.now(),m.scrollerTransform(g,M)):d=!1)}},m.onTouchEnd=function(o){if(o.touches.length||(h=!1),!d||!T)return d=!1,void(T=!1);d=!1,T=!1;var t=300,e=300,r=g+k*t,n=M+H*e;0!==k&&(t=Math.abs((r-g)/k)),0!==H&&(e=Math.abs((n-M)/H));var a=Math.max(t,e);g=r,M=n;var i=w*l,s=Z*l;x=Math.min(f/2-i/2,0),z=-x,v=Math.min(p/2-s/2,0),y=-v,g=Math.max(Math.min(g,z),x),M=Math.max(Math.min(M,y),v),m.scrollerTransition(a).scrollerTransform(g,M)},m.destory=function(){m.initEvents(!0),delete o.data[m.wrapper.getAttribute("data-zoomer")],m.wrapper.setAttribute("data-zoomer","")},m.init(),m},o.Zoom.defaults={speed:300,maxZoom:3,minZoom:1},o.fn.zoom=function(t){var e=[];return this.each(function(){var r=null,n=this,a=n.getAttribute("data-zoomer");a?r=o.data[a]:(a=++o.uuid,o.data[a]=r=new o.Zoom(n,t),n.setAttribute("data-zoomer",a)),e.push(r)}),1===e.length?e[0]:e}}(mui,window);