@better-scroll/indicators
Version:
used as parallax scrolling, magnifier effects
2 lines (1 loc) • 8.85 kB
JavaScript
!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?module.exports=i():"function"==typeof define&&define.amd?define(i):(t="undefined"!=typeof globalThis?globalThis:t||self).Indicators=i()}(this,function(){"use strict";var r=function(){return(r=Object.assign||function(t){for(var i,o=1,e=arguments.length;o<e;o++)for(var n in i=arguments[o])Object.prototype.hasOwnProperty.call(i,n)&&(t[n]=i[n]);return t}).apply(this,arguments)};function n(t,i){if(!t)throw new Error("[BScroll] "+i)}var e="undefined"!=typeof window,t=e&&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(t){return parseInt(t,10)}))[0]&&t[1]);var s=!1;if(e)try{var i={};Object.defineProperty(i,"passive",{get:function(){s=!0}}),window.addEventListener("test-passive",function(){},i)}catch(t){}function a(){return window.performance&&window.performance.now&&window.performance.timing?window.performance.now()+window.performance.timing.navigationStart:+new Date}function d(t,i,o){return t<i?i:o<t?o:t}var h=e&&document.createElement("div").style,o=function(){if(e)for(var t=0,i=[{key:"standard",value:"transform"},{key:"webkit",value:"webkitTransform"},{key:"Moz",value:"MozTransform"},{key:"O",value:"OTransform"},{key:"ms",value:"msTransform"}];t<i.length;t++){var o=i[t];if(void 0!==h[o.value])return o.key}return!1}();function l(t){return!1===o?t:"standard"===o?"transitionEnd"===t?"transitionend":t:o+t.charAt(0).toUpperCase()+t.substr(1)}function c(t,i,o,e){e=s?{passive:!1,capture:!!e}:!!e;t.addEventListener(i,o,e)}function p(t,i,o,e){t.removeEventListener(i,o,{capture:!!e})}o&&"standard"!==o&&o.toLowerCase();t=l("transform");l("transition");e&&l("perspective")in h;var u=t,m=l("transitionTimingFunction"),f=l("transitionDuration");l("transitionDelay"),l("transformOrigin"),l("transitionEnd"),l("transitionProperty");y.prototype.destroy=function(){this.removeDOMEvents(),this.events=[]},y.prototype.addDOMEvents=function(){this.handleDOMEvents(c)},y.prototype.removeDOMEvents=function(){this.handleDOMEvents(p)},y.prototype.handleDOMEvents=function(i){var o=this,e=this.wrapper;this.events.forEach(function(t){i(e,t.name,o,!!t.capture)})},y.prototype.handleEvent=function(i){var o=i.type;this.events.some(function(t){return t.name===o&&(t.handler(i),!0)})};var v=y;function y(t,i){this.wrapper=t,this.events=i,this.addDOMEvents()}function g(t){var i;(i=t).cancelable&&i.preventDefault(),t.stopPropagation()}w.prototype.handleDOM=function(){var t=this.options,i=t.relationElement,t=t.relationElementHandleElementIndex,t=void 0===t?0:t;this.wrapper=i,this.indicatorEl=this.wrapper.children[t]},w.prototype.handleHooks=function(){var i=this,t=this.scroll,o=t.hooks,e=t.scroller.translater.hooks,t=t.scroller.animater.hooks;this.registerHooks(o,o.eventTypes.refresh,this.refresh),this.registerHooks(e,e.eventTypes.translate,function(t){i.updatePosition(t)}),this.registerHooks(t,t.eventTypes.time,this.transitionTime),this.registerHooks(t,t.eventTypes.timeFunction,this.transitionTimingFunction)},w.prototype.transitionTime=function(t){this.indicatorEl.style[f]=(t=void 0===t?0:t)+"ms"},w.prototype.transitionTimingFunction=function(t){this.indicatorEl.style[m]=t},w.prototype.handleInteractive=function(){!1!==this.options.interactive&&this.registerEvents()},w.prototype.registerHooks=function(t,i,o){t.on(i,o,this),this.hooksFn.push([t,i,o])},w.prototype.registerEvents=function(){var t=this.scroll.options,i=t.disableMouse,t=t.disableTouch,o=[],e=[],n=[];i||(o.push({name:"mousedown",handler:this.start.bind(this)}),e.push({name:"mousemove",handler:this.move.bind(this)}),n.push({name:"mouseup",handler:this.end.bind(this)})),t||(o.push({name:"touchstart",handler:this.start.bind(this)}),e.push({name:"touchmove",handler:this.move.bind(this)}),n.push({name:"touchend",handler:this.end.bind(this)},{name:"touchcancel",handler:this.end.bind(this)})),this.startEventRegister=new v(this.indicatorEl,o),this.moveEventRegister=new v(window,e),this.endEventRegister=new v(window,n)},w.prototype.refresh=function(){var t=this.scroll,i=t.x,o=t.y,e=t.hasHorizontalScroll,n=t.hasVerticalScroll,r=t.maxScrollX,t=t.maxScrollY,s=(s=this.options.ratio,a={ratioX:0,ratioY:0},s&&("number"==typeof s?a.ratioX=a.ratioY=s:"object"==typeof s&&s&&(a.ratioX=s.x||0,a.ratioY=s.y||0)),a),a=s.ratioX,s=s.ratioY,h={width:(h=this.wrapper).clientWidth,height:h.clientHeight},l=h.width,h=h.height,c=(p=this.indicatorEl)instanceof window.SVGElement?{top:(c=p.getBoundingClientRect()).top,left:c.left,width:c.width,height:c.height}:{top:p.offsetTop,left:p.offsetLeft,width:p.offsetWidth,height:p.offsetHeight},p=c.height;e&&(this.maxScrollX=l-c.width,this.translateXSign=0<this.maxScrollX?-1:1,this.minScrollX=0,this.ratioX=a||Math.abs(this.maxScrollX/r)),n&&(this.maxScrollY=h-p,this.translateYSign=0<this.maxScrollY?-1:1,this.minScrollY=0,this.ratioY=s||Math.abs(this.maxScrollY/t)),this.updatePosition({x:i,y:o})},w.prototype.start=function(t){var i;this.BScrollIsDisabled()||(i=t.touches?t.touches[0]:t,g(t),this.initiated=!0,this.moved=!1,this.lastPointX=i.pageX,this.lastPointY=i.pageY,this.startTime=a(),this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.beforeScrollStart))},w.prototype.BScrollIsDisabled=function(){return!this.scroll.enabled},w.prototype.move=function(t){var i,o,e;this.initiated&&(e=(i=t.touches?t.touches[0]:t).pageX,i=i.pageY,g(t),t=e-this.lastPointX,o=i-this.lastPointY,this.lastPointX=e,this.lastPointY=i,this.moved||this.indicatorNotMoved(t,o)||(this.moved=!0,this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.scrollStart)),this.moved&&(e=this.getBScrollPosByRatio(this.currentPos,t,o),this.syncBScroll(e)))},w.prototype.end=function(t){var i;this.initiated&&(this.initiated=!1,g(t),this.moved&&(i=(t=this.scroll).x,t=t.y,this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.scrollEnd,{x:i,y:t})))},w.prototype.getBScrollPosByRatio=function(t,i,o){var e=t.x,t=t.y,n=this.scroll,r=n.hasHorizontalScroll,s=n.hasVerticalScroll,a=n.minScrollX,h=n.maxScrollX,l=n.minScrollY,n=n.maxScrollY,c=this.scroll,p=c.x,c=c.y;return r&&(r=d(e+i,Math.min(this.minScrollX,this.maxScrollX),Math.max(this.minScrollX,this.maxScrollX)),p=d(Math.round(r/this.ratioX*this.translateXSign),h,a)),s&&(e=d(t+o,Math.min(this.minScrollY,this.maxScrollY),Math.max(this.minScrollY,this.maxScrollY)),c=d(Math.round(e/this.ratioY*this.translateYSign),n,l)),{x:p,y:c}},w.prototype.indicatorNotMoved=function(t,i){var o=this.currentPos,e=o.x,o=o.y,e=e===this.minScrollX&&t<=0||e===this.maxScrollX&&0<=t,t=o===this.minScrollY&&i<=0||o===this.maxScrollY&&0<=i;return e&&t},w.prototype.syncBScroll=function(t){var i=a(),o=this.scroll,e=o.options,o=o.scroller,n=e.probeType,e=e.momentumLimitTime;o.translater.translate(t),i-this.startTime>e&&(this.startTime=i,1===n&&o.hooks.trigger(o.hooks.eventTypes.scroll,t)),1<n&&o.hooks.trigger(o.hooks.eventTypes.scroll,t)},w.prototype.updatePosition=function(t){t=this.getIndicatorPosByRatio(t);this.applyTransformProperty(t),this.currentPos=r({},t)},w.prototype.applyTransformProperty=function(t){var i=this.scroll.options.translateZ,t=["translateX("+t.x+"px)","translateY("+t.y+"px)",""+i];this.indicatorEl.style[u]=t.join(" ")},w.prototype.getIndicatorPosByRatio=function(t){var i=t.x,t=t.y,o=this.scroll,e=o.hasHorizontalScroll,o=o.hasVerticalScroll,n=r({},this.currentPos);return e&&(e=Math.round(this.ratioX*i*this.translateXSign),n.x=d(e,Math.min(this.minScrollX,this.maxScrollX),Math.max(this.minScrollX,this.maxScrollX))),o&&(i=Math.round(this.ratioY*t*this.translateYSign),n.y=d(i,Math.min(this.minScrollY,this.maxScrollY),Math.max(this.minScrollY,this.maxScrollY))),n},w.prototype.destroy=function(){!1!==this.options.interactive&&(this.startEventRegister.destroy(),this.moveEventRegister.destroy(),this.endEventRegister.destroy()),this.hooksFn.forEach(function(t){var i=t[0],o=t[1],t=t[2];i.off(o,t)}),this.hooksFn.length=0};var S=w;function w(t,i){this.scroll=t,this.options=i,this.currentPos={x:0,y:0},this.hooksFn=[],this.handleDOM(),this.handleHooks(),this.handleInteractive()}function x(t){this.scroll=t,this.options=[],this.indicators=[],this.handleOptions(),this.handleHooks()}return x.prototype.handleOptions=function(){var t=this.scroll.options.indicators;n(Array.isArray(t),"'indicators' must be an array.");for(var i=0,o=t;i<o.length;i++){var e=o[i];n(!!e.relationElement,"'relationElement' must be a HTMLElement."),this.createIndicators(e)}},x.prototype.createIndicators=function(t){this.indicators.push(new S(this.scroll,t))},x.prototype.handleHooks=function(){var o=this,t=this.scroll.hooks;t.on(t.eventTypes.destroy,function(){for(var t=0,i=o.indicators;t<i.length;t++)i[t].destroy();o.indicators=[]})},x.pluginName="indicators",x});