@better-scroll/zoom
Version:
a BetterScroll plugin to enlarge or narrow
2 lines (1 loc) • 8.65 kB
JavaScript
!function(o,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(o="undefined"!=typeof globalThis?globalThis:o||self).Zoom=t()}(this,function(){"use strict";var o=[{key:"zoomTo",name:"zoomTo"}].map(function(o){return{key:o.key,sourceKey:"plugins.zoom."+o.name}}),r="undefined"!=typeof window,t=r&&navigator.userAgent.toLowerCase();if(t&&/wechatdevtools/.test(t),t&&t.indexOf("android"),"string"==typeof t)(t=/os (\d\d?_\d(_\d)?)/.exec(t))&&(13===(t=t[1].split("_").map(function(o){return parseInt(o,10)}))[0]&&t[1]);if(r)try{var e={};Object.defineProperty(e,"passive",{get:function(){}}),window.addEventListener("test-passive",function(){},e)}catch(o){}function f(){return window.performance&&window.performance.now&&window.performance.timing?window.performance.now()+window.performance.timing.navigationStart:+new Date}function m(o,t,e){return o<t?t:e<o?e:o}var i=r&&document.createElement("div").style,n=function(){if(r)for(var o=0,t=[{key:"standard",value:"transform"},{key:"webkit",value:"webkitTransform"},{key:"Moz",value:"MozTransform"},{key:"O",value:"OTransform"},{key:"ms",value:"msTransform"}];o<t.length;o++){var e=t[o];if(void 0!==i[e.value])return e.key}return!1}();function s(o){return!1===n?o:"standard"===n?"transitionEnd"===o?"transitionend":o:n+o.charAt(0).toUpperCase()+o.substr(1)}n&&"standard"!==n&&n.toLowerCase();s("transform"),s("transition");r&&s("perspective")in i;s("transitionTimingFunction"),s("transitionDuration"),s("transitionDelay");var a=s("transformOrigin");s("transitionEnd"),s("transitionProperty");function l(o){var t;return o instanceof window.SVGElement?{top:(t=o.getBoundingClientRect()).top,left:t.left,width:t.width,height:t.height}:{top:o.offsetTop,left:o.offsetLeft,width:o.offsetWidth,height:o.offsetHeight}}var g={style:"cubic-bezier(0.165, 0.84, 0.44, 1)",fn:function(o){return 1- --o*o*o*o}},t=r&&window;function c(){}var d=r?t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(o){return window.setTimeout(o,o.interval||1e3/60)}:c,y=r?t.cancelAnimationFrame||t.webkitCancelAnimationFrame||t.mozCancelAnimationFrame||t.oCancelAnimationFrame||function(o){window.clearTimeout(o)}:c;function h(o){this.scroll=o,this.scale=1,this.prevScale=1,this.init()}return h.prototype.init=function(){this.handleBScroll(),this.handleOptions(),this.handleHooks(),this.tryInitialZoomTo(this.zoomOpt)},h.prototype.zoomTo=function(o,t,e,r){t=this.resolveOrigin(t,e),e={x:t.originX,y:t.originY,baseScale:this.scale};this._doZoomTo(o,e,r,!0)},h.prototype.handleBScroll=function(){this.scroll.proxy(o),this.scroll.registerType(["beforeZoomStart","zoomStart","zooming","zoomEnd"])},h.prototype.handleOptions=function(){var o=!0===this.scroll.options.zoom?{}:this.scroll.options.zoom;this.zoomOpt=function(o,t){for(var e in t)o[e]=t[e];return o}({start:1,min:1,max:4,initialOrigin:[0,0],minimalZoomDistance:5,bounceTime:800},o)},h.prototype.handleHooks=function(){var e=this,o=this.scroll,t=this.scroll.scroller,r=(this.wrapper=this.scroll.scroller.wrapper,this.setTransformOrigin(this.scroll.scroller.content),t.scrollBehaviorX),i=t.scrollBehaviorY;this.hooksFn=[],this.registerHooks(o.hooks,o.hooks.eventTypes.contentChanged,function(o){e.setTransformOrigin(o),e.scale=1,e.tryInitialZoomTo(e.zoomOpt)}),this.registerHooks(o.hooks,o.hooks.eventTypes.beforeInitialScrollTo,function(){if(1!==e.zoomOpt.start)return!0}),this.registerHooks(r.hooks,r.hooks.eventTypes.beforeComputeBoundary,function(){var o=l(e.scroll.scroller.content);r.contentSize=Math.floor(o.width*e.scale)}),this.registerHooks(i.hooks,i.hooks.eventTypes.beforeComputeBoundary,function(){var o=l(e.scroll.scroller.content);i.contentSize=Math.floor(o.height*e.scale)}),this.registerHooks(t.actions.hooks,t.actions.hooks.eventTypes.start,function(o){var t=o.touches&&o.touches.length||0;e.fingersOperation(t),2===t&&e.zoomStart(o)}),this.registerHooks(t.actions.hooks,t.actions.hooks.eventTypes.beforeMove,function(o){var t=o.touches&&o.touches.length||0;if(e.fingersOperation(t),2===t)return e.zoom(o),!0}),this.registerHooks(t.actions.hooks,t.actions.hooks.eventTypes.beforeEnd,function(o){if(2===e.fingersOperation())return e.zoomEnd(),!0}),this.registerHooks(t.translater.hooks,t.translater.hooks.eventTypes.beforeTranslate,function(o,t){t=t.scale||e.prevScale;e.prevScale=t,o.push("scale("+t+")")}),this.registerHooks(t.hooks,t.hooks.eventTypes.scrollEnd,function(){2===e.fingersOperation()&&e.scroll.trigger(e.scroll.eventTypes.zoomEnd,{scale:e.scale})}),this.registerHooks(this.scroll.hooks,"destroy",this.destroy)},h.prototype.setTransformOrigin=function(o){o.style[a]="0 0"},h.prototype.tryInitialZoomTo=function(o){var t=o.start,o=o.initialOrigin,e=this.scroll.scroller,r=e.scrollBehaviorX,e=e.scrollBehaviorY;1!==t&&(this.resetBoundaries([r,e]),this.zoomTo(t,o[0],o[1],0))},h.prototype.fingersOperation=function(o){if("number"!=typeof o)return this.numberOfFingers;this.numberOfFingers=o},h.prototype._doZoomTo=function(o,t,e,r){var i,n,s,a,l=this,c=(void 0===e&&(e=this.zoomOpt.bounceTime),void 0===r&&(r=!1),this.zoomOpt),h=c.min,c=c.max,u=this.scale,p=m(o,h,c);0===e?l.scroll.trigger(l.scroll.eventTypes.zooming,{scale:p}):0<e&&(n=f(),s=n+e,(a=function(){var o=f();s<=o?(l.scroll.trigger(l.scroll.eventTypes.zooming,{scale:p}),y(i)):(o=g.fn((o-n)/e),l.scroll.trigger(l.scroll.eventTypes.zooming,{scale:o*(p-u)+u}),i=d(a))})()),this.fingersOperation(2),this._zoomTo(p,u,t,e,r)},h.prototype._zoomTo=function(o,t,e,r,i){void 0===i&&(i=!1);var n=o/e.baseScale,s=(this.setScale(o),this.scroll.scroller),a=s.scrollBehaviorX,l=s.scrollBehaviorY,c=(this.resetBoundaries([a,l]),this.getNewPos(e.x,n,a,!0,i)),e=this.getNewPos(e.y,n,l,!0,i);a.currentPos===Math.round(c)&&l.currentPos===Math.round(e)&&o===t||s.scrollTo(c,e,r,g,{start:{scale:t},end:{scale:o}})},h.prototype.resolveOrigin=function(o,t){var e=this.scroll.scroller,r=e.scrollBehaviorX,i=e.scrollBehaviorY,e={left:function(){return 0},top:function(){return 0},right:function(){return r.contentSize},bottom:function(){return i.contentSize},center:function(o){return(0===o?r:i).contentSize/2}};return{originX:"number"==typeof o?o:e[o](0),originY:"number"==typeof t?t:e[t](1)}},h.prototype.zoomStart=function(o){var t=o.touches[0],e=o.touches[1],o=(this.startDistance=this.getFingerDistance(o),this.startScale=this.scale,{left:-((o=(o=this.wrapper).getBoundingClientRect()).left+window.pageXOffset),top:-(o.top+window.pageYOffset)}),r=o.left,o=o.top;this.origin={x:Math.abs(t.pageX+e.pageX)/2+r-this.scroll.x,y:Math.abs(t.pageY+e.pageY)/2+o-this.scroll.y,baseScale:this.startScale},this.scroll.trigger(this.scroll.eventTypes.beforeZoomStart)},h.prototype.zoom=function(o){var t,e,r,i,o=this.getFingerDistance(o);!this.zoomed&&Math.abs(o-this.startDistance)<this.zoomOpt.minimalZoomDistance||(i=(o=this.dampingScale(o/this.startDistance*this.startScale))/this.startScale,this.setScale(o),this.zoomed||(this.zoomed=!0,this.scroll.trigger(this.scroll.eventTypes.zoomStart)),r=(t=this.scroll.scroller).scrollBehaviorX,e=t.scrollBehaviorY,r=this.getNewPos(this.origin.x,i,r,!1,!1),i=this.getNewPos(this.origin.y,i,e,!1,!1),this.scroll.trigger(this.scroll.eventTypes.zooming,{scale:this.scale}),t.translater.translate({x:r,y:i,scale:o}))},h.prototype.zoomEnd=function(){this.zoomed&&(this.shouldRebound()?this._doZoomTo(this.scale,this.origin,this.zoomOpt.bounceTime):this.scroll.trigger(this.scroll.eventTypes.zoomEnd,{scale:this.scale}))},h.prototype.getFingerDistance=function(o){var t=o.touches[0],o=o.touches[1],e=Math.abs(t.pageX-o.pageX),t=Math.abs(t.pageY-o.pageY);return Math.sqrt(e*e+t*t)},h.prototype.shouldRebound=function(){var o=this.zoomOpt,t=o.min,o=o.max,e=this.scale;return e!==m(e,t,o)||(t=(e=this.scroll.scroller).scrollBehaviorX,o=e.scrollBehaviorY,this.resetBoundaries([t,o]),e=t.checkInBoundary().inBoundary,o=t.checkInBoundary().inBoundary,!(e&&o))},h.prototype.dampingScale=function(o){var t=this.zoomOpt,e=t.min,t=t.max;return o<e?o=.5*e*Math.pow(2,o/e):t<o&&(o=2*t*Math.pow(.5,t/o)),o},h.prototype.setScale=function(o){this.scale=o},h.prototype.resetBoundaries=function(o){o.forEach(function(o){return o.computeBoundary()})},h.prototype.getNewPos=function(o,t,e,r,i){o=o-o*t+((i=void 0===i?!1:i)?e.currentPos:e.startPos);return 0<(o=r?m(o,e.maxScrollPos,e.minScrollPos):o)?Math.floor(o):Math.ceil(o)},h.prototype.registerHooks=function(o,t,e){o.on(t,e,this),this.hooksFn.push([o,t,e])},h.prototype.destroy=function(){this.hooksFn.forEach(function(o){var t=o[0],e=o[1],o=o[2];t.off(e,o)}),this.hooksFn.length=0},h.pluginName="zoom",h});