@better-scroll/scroll-bar - npm Package Compare versions

Comparing version 2.3.1 to 2.4.0

dist/scroll-bar.esm.js

@@ -546,3 +546,4 @@ /*!
     Indicator.prototype.fade = function (visible) {
-        var time = visible ? 250 : 500;
+        var _a = this.options, fadeInTime = _a.fadeInTime, fadeOutTime = _a.fadeOutTime;
+        var time = visible ? fadeInTime : fadeOutTime;
         var wrapper = this.wrapper;
@@ -733,2 +734,4 @@ wrapper.style[style.transitionDuration] = time + 'ms';
             fade: true,
+            fadeInTime: 250,
+            fadeOutTime: 500,
             interactive: false,
@@ -735,0 +738,0 @@ customElements: [],

dist/scroll-bar.js

@@ -552,3 +552,4 @@ /*!
         Indicator.prototype.fade = function (visible) {
-            var time = visible ? 250 : 500;
+            var _a = this.options, fadeInTime = _a.fadeInTime, fadeOutTime = _a.fadeOutTime;
+            var time = visible ? fadeInTime : fadeOutTime;
             var wrapper = this.wrapper;
@@ -739,2 +740,4 @@ wrapper.style[style.transitionDuration] = time + 'ms';
                 fade: true,
+                fadeInTime: 250,
+                fadeOutTime: 500,
                 interactive: false,
@@ -741,0 +744,0 @@ customElements: [],

dist/scroll-bar.min.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).ScrollBar=e()}(this,function(){"use strict";var d=function(){return(d=Object.assign||function(t){for(var e,o=1,s=arguments.length;o<s;o++)for(var r in e=arguments[o])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t}).apply(this,arguments)};var s="undefined"!=typeof window,o=s&&navigator.userAgent.toLowerCase(),i=(o&&/wechatdevtools/.test(o),o&&o.indexOf("android"),function(){if("string"!=typeof o)return;var t=/os (\d\d?_\d(_\d)?)/.exec(o);if(!t)return;var e=t[1].split("_").map(function(t){return parseInt(t,10)});13===e[0]&&e[1]}(),!1);if(s){try{var t={};Object.defineProperty(t,"passive",{get:function(){i=!0}}),window.addEventListener("test-passive",function(){},t)}catch(t){}}function f(){return window.performance&&window.performance.now&&window.performance.timing?window.performance.now()+window.performance.timing.navigationStart:+new Date}function v(t,e,o){return t<e?e:o<t?o:t}var r=s&&document.createElement("div").style,e=function(){if(!s)return!1;for(var t=0,e=[{key:"standard",value:"transform"},{key:"webkit",value:"webkitTransform"},{key:"Moz",value:"MozTransform"},{key:"O",value:"OTransform"},{key:"ms",value:"msTransform"}];t<e.length;t++){var o=e[t];if(void 0!==r[o.value])return o.key}return!1}();function n(t){return!1===e?t:"standard"===e?"transitionEnd"===t?"transitionend":t:e+t.charAt(0).toUpperCase()+t.substr(1)}function a(t,e,o,s){var r=i?{passive:!1,capture:!!s}:!!s;t.addEventListener(e,o,r)}function l(t,e,o,s){t.removeEventListener(e,o,{capture:!!s})}e&&"standard"!==e&&e.toLowerCase();var h=n("transform"),c=(n("transition"),s&&n("perspective")in r,h),p=n("transitionTimingFunction"),u=n("transitionDuration"),y=(n("transitionDelay"),n("transformOrigin"),n("transitionEnd"),n("transitionProperty"),m.prototype.on=function(t,e,o){return void 0===o&&(o=this),this.hasType(t),this.events[t]||(this.events[t]=[]),this.events[t].push([e,o]),this},m.prototype.once=function(s,r,i){var n=this;void 0===i&&(i=this),this.hasType(s);var a=function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];n.off(s,a);var o=r.apply(i,t);if(!0===o)return o};return a.fn=r,this.on(s,a),this},m.prototype.off=function(t,e){if(!t&&!e)return this.events={},this;if(t){if(this.hasType(t),!e)return this.events[t]=[],this;var o=this.events[t];if(!o)return this;for(var s=o.length;s--;)(o[s][0]===e||o[s][0]&&o[s][0].fn===e)&&o.splice(s,1);return this}},m.prototype.trigger=function(t){for(var e=[],o=1;o<arguments.length;o++)e[o-1]=arguments[o];this.hasType(t);var s=this.events[t];if(s)for(var r,i=s.length,n=function(){for(var t=0,e=0,o=arguments.length;e<o;e++)t+=arguments[e].length;for(var s=Array(t),r=0,e=0;e<o;e++)for(var i=arguments[e],n=0,a=i.length;n<a;n++,r++)s[r]=i[n];return s}(s),a=0;a<i;a++){var l=n[a],h=l[0],c=l[1];if(h&&!0===(r=h.apply(c,e)))return r}},m.prototype.registerType=function(t){var e=this;t.forEach(function(t){e.eventTypes[t]=t})},m.prototype.destroy=function(){this.events={},this.eventTypes={}},m.prototype.hasType=function(t){var e,o=this.eventTypes;o[t]===t||(e='EventEmitter has used unknown event type: "'+t+'", should be oneof ['+Object.keys(o).map(function(t){return JSON.stringify(t)})+"]",console.error("[BScroll warn]: "+e))},m);function m(t){this.events={},this.eventTypes={},this.registerType(t)}var g=(k.prototype.destroy=function(){this.removeDOMEvents(),this.events=[]},k.prototype.addDOMEvents=function(){this.handleDOMEvents(a)},k.prototype.removeDOMEvents=function(){this.handleDOMEvents(l)},k.prototype.handleDOMEvents=function(e){var o=this,s=this.wrapper;this.events.forEach(function(t){e(s,t.name,o,!!t.capture)})},k.prototype.handleEvent=function(e){var o=e.type;this.events.some(function(t){return t.name===o&&(t.handler(e),!0)})},k);function k(t,e){this.wrapper=t,this.events=e,this.addDOMEvents()}var T=(b.prototype.registerEvents=function(){var t=this.options,e=t.disableMouse,o=t.disableTouch,s=[],r=[],i=[];e||(s.push({name:"mousedown",handler:this.start.bind(this)}),r.push({name:"mousemove",handler:this.move.bind(this)}),i.push({name:"mouseup",handler:this.end.bind(this)})),o||(s.push({name:"touchstart",handler:this.start.bind(this)}),r.push({name:"touchmove",handler:this.move.bind(this)}),i.push({name:"touchend",handler:this.end.bind(this)},{name:"touchcancel",handler:this.end.bind(this)})),this.startEventRegister=new g(this.indicator.indicatorEl,s),this.moveEventRegister=new g(window,r),this.endEventRegister=new g(window,i)},b.prototype.BScrollIsDisabled=function(){return!this.indicator.scroll.enabled},b.prototype.start=function(t){var e;this.BScrollIsDisabled()||(e=t.touches?t.touches[0]:t,t.preventDefault(),t.stopPropagation(),this.initiated=!0,this.lastPoint=e[this.indicator.keysMap.point],this.hooks.trigger(this.hooks.eventTypes.touchStart))},b.prototype.move=function(t){var e,o;this.initiated&&(e=(t.touches?t.touches[0]:t)[this.indicator.keysMap.point],t.preventDefault(),t.stopPropagation(),o=e-this.lastPoint,this.lastPoint=e,this.hooks.trigger(this.hooks.eventTypes.touchMove,o))},b.prototype.end=function(t){this.initiated&&(this.initiated=!1,t.preventDefault(),t.stopPropagation(),this.hooks.trigger(this.hooks.eventTypes.touchEnd))},b.prototype.destroy=function(){this.startEventRegister.destroy(),this.moveEventRegister.destroy(),this.endEventRegister.destroy()},b);function b(t,e){this.indicator=t,this.options=e,this.hooks=new y(["touchStart","touchMove","touchEnd"]),this.registerEvents()}var w=(S.prototype.handleFade=function(){this.options.fade&&(this.wrapper.style.opacity="0")},S.prototype.handleHooks=function(){var t,e,o,s,r=this,i=this.options,n=i.fade,a=i.interactive,l=i.scrollbarTrackClickable,h=this.scroll,c=h.hooks,p=h.scroller.translater.hooks,d=h.scroller.animater.hooks;this.registerHooks(c,c.eventTypes.refresh,this.refresh),this.registerHooks(p,p.eventTypes.translate,function(t){var e=r.keysMap.hasScroll;r.scroll[e]&&r.updatePosition(t)}),this.registerHooks(d,d.eventTypes.time,this.transitionTime),this.registerHooks(d,d.eventTypes.timeFunction,this.transitionTimingFunction),n&&(this.registerHooks(h,h.eventTypes.scrollEnd,function(){r.fade()}),this.registerHooks(h,h.eventTypes.scrollStart,function(){r.fade(!0)}),h.eventTypes.mousewheelStart&&h.eventTypes.mousewheelEnd&&(this.registerHooks(h,h.eventTypes.mousewheelStart,function(){r.fade(!0)}),this.registerHooks(h,h.eventTypes.mousewheelMove,function(){r.fade(!0)}),this.registerHooks(h,h.eventTypes.mousewheelEnd,function(){r.fade()}))),a&&(e=(t=this.scroll.options).disableMouse,o=t.disableTouch,this.eventHandler=new T(this,{disableMouse:e,disableTouch:o}),s=this.eventHandler.hooks,this.registerHooks(s,s.eventTypes.touchStart,this.startHandler),this.registerHooks(s,s.eventTypes.touchMove,this.moveHandler),this.registerHooks(s,s.eventTypes.touchEnd,this.endHandler)),l&&this.bindClick()},S.prototype.registerHooks=function(t,e,o){t.on(e,o,this),this.hooksFn.push([t,e,o])},S.prototype.bindClick=function(){var t=this.wrapper;this.clickEventRegister=new g(t,[{name:"click",handler:this.handleClick.bind(this)}])},S.prototype.handleClick=function(t){var e=this.calculateclickOffsetPos(t),o=this.scroll,s=o.x,r=o.y,s="horizontal"===this.direction?e:s,r="vertical"===this.direction?e:r;this.scroll.scrollTo(s,r,this.options.scrollbarTrackOffsetTime)},S.prototype.calculateclickOffsetPos=function(t){var e=this.keysMap,o=e.point,s=e.domRect,r=this.options.scrollbarTrackOffsetType,i=t[o]-this.wrapperRect[s],n=i<this.currentPos?-1:1,a=0,l=this.currentPos;return"step"===r?a=this.scrollInfo.baseSize*n:(a=0,l=i),this.newPos(l,a,this.scrollInfo)},S.prototype.getKeysMap=function(){return"vertical"===this.direction?{hasScroll:"hasVerticalScroll",size:"height",wrapperSize:"clientHeight",scrollerSize:"scrollerHeight",maxScrollPos:"maxScrollY",pos:"y",point:"pageY",translateProperty:"translateY",domRect:"top"}:{hasScroll:"hasHorizontalScroll",size:"width",wrapperSize:"clientWidth",scrollerSize:"scrollerWidth",maxScrollPos:"maxScrollX",pos:"x",point:"pageX",translateProperty:"translateX",domRect:"left"}},S.prototype.fade=function(t){var e=t?250:500,o=this.wrapper;o.style[u]=e+"ms",o.style.opacity=t?"1":"0"},S.prototype.refresh=function(){var t,e,o,s,r=this.keysMap.hasScroll,i=this.scroll,n=i.x,a=i.y;this.wrapperRect=this.wrapper.getBoundingClientRect(),this.canScroll(i[r])&&(e=(t=this.keysMap).wrapperSize,o=t.scrollerSize,s=t.maxScrollPos,this.scrollInfo=this.refreshScrollInfo(this.wrapper[e],i[o],i[s],this.indicatorEl[e]),this.updatePosition({x:n,y:a}))},S.prototype.transitionTime=function(t){void 0===t&&(t=0),this.indicatorEl.style[u]=t+"ms"},S.prototype.transitionTimingFunction=function(t){this.indicatorEl.style[p]=t},S.prototype.canScroll=function(t){return this.wrapper.style.display=t?"block":"none",t},S.prototype.refreshScrollInfo=function(t,e,o,s){var r=Math.max(Math.round(t*t/(e||t||1)),this.options.minSize);this.options.isCustom&&(r=s);var i=t-r;return{baseSize:r,maxScrollPos:i,minScrollPos:0,sizeRatio:i/o}},S.prototype.updatePosition=function(t){var e=this.caculatePosAndSize(t,this.scrollInfo),o=e.pos,s=e.size;this.refreshStyle(s,o),this.currentPos=o},S.prototype.caculatePosAndSize=function(t,e){var o,s=this.keysMap.pos,r=e.sizeRatio,i=e.baseSize,n=e.maxScrollPos,a=e.minScrollPos,l=this.options.minSize,h=Math.round(r*t[s]);return h<a?(o=Math.max(i+3*h,l),h=a):n<h?h=n+i-(o=Math.max(i-3*(h-n),l)):o=i,{pos:h,size:o}},S.prototype.refreshStyle=function(t,e){var o=this.keysMap,s=o.translateProperty,r=o.size,i=this.scroll.options.translateZ;this.indicatorEl.style[r]=t+"px",this.indicatorEl.style[c]=s+"("+e+"px)"+i},S.prototype.startHandler=function(){this.moved=!1,this.startTime=f(),this.transitionTime(),this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.beforeScrollStart)},S.prototype.moveHandler=function(t){var e;this.moved||this.indicatorNotMoved(t)||(this.moved=!0,this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.scrollStart)),this.moved&&(e=this.newPos(this.currentPos,t,this.scrollInfo),this.syncBScroll(e))},S.prototype.endHandler=function(){var t,e,o;this.moved&&(e=(t=this.scroll).x,o=t.y,this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.scrollEnd,{x:e,y:o}))},S.prototype.indicatorNotMoved=function(t){var e=this.currentPos,o=this.scrollInfo,s=o.maxScrollPos;return e===o.minScrollPos&&t<=0||e===s&&0<=t},S.prototype.syncBScroll=function(t){var e=f(),o=this.scroll,s=o.x,r=o.y,i=o.options,n=o.scroller,a=o.maxScrollY,l=o.minScrollY,h=o.maxScrollX,c=o.minScrollX,p=i.probeType,d=i.momentumLimitTime,u={x:s,y:r};"vertical"===this.direction?u.y=v(t,a,l):u.x=v(t,h,c),n.translater.translate(u),e-this.startTime>d&&(this.startTime=e,1===p&&n.hooks.trigger(n.hooks.eventTypes.scroll,u)),1<p&&n.hooks.trigger(n.hooks.eventTypes.scroll,u)},S.prototype.newPos=function(t,e,o){var s=o.maxScrollPos,r=o.sizeRatio,i=v(i=t+e,o.minScrollPos,s);return Math.round(i/r)},S.prototype.destroy=function(){var t=this.options,e=t.interactive,o=t.scrollbarTrackClickable,s=t.isCustom;e&&this.eventHandler.destroy(),o&&this.clickEventRegister.destroy(),s||this.wrapper.parentNode.removeChild(this.wrapper),this.hooksFn.forEach(function(t){var e=t[0],o=t[1],s=t[2];e.off(o,s)}),this.hooksFn.length=0},S);function S(t,e){this.scroll=t,this.options=e,this.hooksFn=[],this.wrapper=e.wrapper,this.direction=e.direction,this.indicatorEl=this.wrapper.children[0],this.keysMap=this.getKeysMap(),this.handleFade(),this.handleHooks()}function E(t){this.scroll=t,this.handleOptions(),this.createIndicators(),this.handleHooks()}return E.prototype.handleHooks=function(){var o=this,t=this.scroll;t.hooks.on(t.hooks.eventTypes.destroy,function(){for(var t=0,e=o.indicators;t<e.length;t++){e[t].destroy()}})},E.prototype.handleOptions=function(){var t=!0===this.scroll.options.scrollbar?{}:this.scroll.options.scrollbar;this.options=function(t,e){for(var o in e)t[o]=e[o];return t}({fade:!0,interactive:!1,customElements:[],minSize:8,scrollbarTrackClickable:!1,scrollbarTrackOffsetType:"step",scrollbarTrackOffsetTime:300},t)},E.prototype.createIndicators=function(){for(var t,e=this.scroll,o=[],s=["scrollX","scrollY"],r=["horizontal","vertical"],i=this.options.customElements,n=0;n<s.length;n++){var a,l,h,c,p=s[n];e.options[p]&&(a=i.shift(),l=r[n],h=!1,(c=a||this.createScrollbarElement(l))!==a?e.wrapper.appendChild(c):h=!0,t=d(d({wrapper:c,direction:l},this.options),{isCustom:h}),o.push(new w(e,t)))}this.indicators=o},E.prototype.createScrollbarElement=function(t,e){void 0===e&&(e=this.options.scrollbarTrackClickable);var o=document.createElement("div"),s=document.createElement("div");return o.style.cssText="position:absolute;z-index:9999;overflow:hidden;",s.style.cssText="box-sizing:border-box;position:absolute;background:rgba(0,0,0,0.5);border:1px solid rgba(255,255,255,0.9);border-radius:3px;",s.className="bscroll-indicator","horizontal"===t?(o.style.cssText+="height:7px;left:2px;right:2px;bottom:0;",s.style.height="100%",o.className="bscroll-horizontal-scrollbar"):(o.style.cssText+="width:7px;bottom:2px;top:2px;right:1px;",s.style.width="100%",o.className="bscroll-vertical-scrollbar"),e||(o.style.cssText+="pointer-events:none;"),o.appendChild(s),o},E.pluginName="scrollbar",E});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).ScrollBar=e()}(this,function(){"use strict";var d=function(){return(d=Object.assign||function(t){for(var e,o=1,s=arguments.length;o<s;o++)for(var i in e=arguments[o])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t}).apply(this,arguments)};var s="undefined"!=typeof window,o=s&&navigator.userAgent.toLowerCase(),r=(o&&/wechatdevtools/.test(o),o&&o.indexOf("android"),function(){if("string"!=typeof o)return;var t=/os (\d\d?_\d(_\d)?)/.exec(o);if(!t)return;var e=t[1].split("_").map(function(t){return parseInt(t,10)});13===e[0]&&e[1]}(),!1);if(s){try{var t={};Object.defineProperty(t,"passive",{get:function(){r=!0}}),window.addEventListener("test-passive",function(){},t)}catch(t){}}function f(){return window.performance&&window.performance.now&&window.performance.timing?window.performance.now()+window.performance.timing.navigationStart:+new Date}function v(t,e,o){return t<e?e:o<t?o:t}var i=s&&document.createElement("div").style,e=function(){if(!s)return!1;for(var t=0,e=[{key:"standard",value:"transform"},{key:"webkit",value:"webkitTransform"},{key:"Moz",value:"MozTransform"},{key:"O",value:"OTransform"},{key:"ms",value:"msTransform"}];t<e.length;t++){var o=e[t];if(void 0!==i[o.value])return o.key}return!1}();function n(t){return!1===e?t:"standard"===e?"transitionEnd"===t?"transitionend":t:e+t.charAt(0).toUpperCase()+t.substr(1)}function a(t,e,o,s){var i=r?{passive:!1,capture:!!s}:!!s;t.addEventListener(e,o,i)}function l(t,e,o,s){t.removeEventListener(e,o,{capture:!!s})}e&&"standard"!==e&&e.toLowerCase();var h=n("transform"),c=(n("transition"),s&&n("perspective")in i,h),p=n("transitionTimingFunction"),u=n("transitionDuration"),y=(n("transitionDelay"),n("transformOrigin"),n("transitionEnd"),n("transitionProperty"),m.prototype.on=function(t,e,o){return void 0===o&&(o=this),this.hasType(t),this.events[t]||(this.events[t]=[]),this.events[t].push([e,o]),this},m.prototype.once=function(s,i,r){var n=this;void 0===r&&(r=this),this.hasType(s);var a=function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];n.off(s,a);var o=i.apply(r,t);if(!0===o)return o};return a.fn=i,this.on(s,a),this},m.prototype.off=function(t,e){if(!t&&!e)return this.events={},this;if(t){if(this.hasType(t),!e)return this.events[t]=[],this;var o=this.events[t];if(!o)return this;for(var s=o.length;s--;)(o[s][0]===e||o[s][0]&&o[s][0].fn===e)&&o.splice(s,1);return this}},m.prototype.trigger=function(t){for(var e=[],o=1;o<arguments.length;o++)e[o-1]=arguments[o];this.hasType(t);var s=this.events[t];if(s)for(var i,r=s.length,n=function(){for(var t=0,e=0,o=arguments.length;e<o;e++)t+=arguments[e].length;for(var s=Array(t),i=0,e=0;e<o;e++)for(var r=arguments[e],n=0,a=r.length;n<a;n++,i++)s[i]=r[n];return s}(s),a=0;a<r;a++){var l=n[a],h=l[0],c=l[1];if(h&&!0===(i=h.apply(c,e)))return i}},m.prototype.registerType=function(t){var e=this;t.forEach(function(t){e.eventTypes[t]=t})},m.prototype.destroy=function(){this.events={},this.eventTypes={}},m.prototype.hasType=function(t){var e,o=this.eventTypes;o[t]===t||(e='EventEmitter has used unknown event type: "'+t+'", should be oneof ['+Object.keys(o).map(function(t){return JSON.stringify(t)})+"]",console.error("[BScroll warn]: "+e))},m);function m(t){this.events={},this.eventTypes={},this.registerType(t)}var g=(k.prototype.destroy=function(){this.removeDOMEvents(),this.events=[]},k.prototype.addDOMEvents=function(){this.handleDOMEvents(a)},k.prototype.removeDOMEvents=function(){this.handleDOMEvents(l)},k.prototype.handleDOMEvents=function(e){var o=this,s=this.wrapper;this.events.forEach(function(t){e(s,t.name,o,!!t.capture)})},k.prototype.handleEvent=function(e){var o=e.type;this.events.some(function(t){return t.name===o&&(t.handler(e),!0)})},k);function k(t,e){this.wrapper=t,this.events=e,this.addDOMEvents()}var T=(b.prototype.registerEvents=function(){var t=this.options,e=t.disableMouse,o=t.disableTouch,s=[],i=[],r=[];e||(s.push({name:"mousedown",handler:this.start.bind(this)}),i.push({name:"mousemove",handler:this.move.bind(this)}),r.push({name:"mouseup",handler:this.end.bind(this)})),o||(s.push({name:"touchstart",handler:this.start.bind(this)}),i.push({name:"touchmove",handler:this.move.bind(this)}),r.push({name:"touchend",handler:this.end.bind(this)},{name:"touchcancel",handler:this.end.bind(this)})),this.startEventRegister=new g(this.indicator.indicatorEl,s),this.moveEventRegister=new g(window,i),this.endEventRegister=new g(window,r)},b.prototype.BScrollIsDisabled=function(){return!this.indicator.scroll.enabled},b.prototype.start=function(t){var e;this.BScrollIsDisabled()||(e=t.touches?t.touches[0]:t,t.preventDefault(),t.stopPropagation(),this.initiated=!0,this.lastPoint=e[this.indicator.keysMap.point],this.hooks.trigger(this.hooks.eventTypes.touchStart))},b.prototype.move=function(t){var e,o;this.initiated&&(e=(t.touches?t.touches[0]:t)[this.indicator.keysMap.point],t.preventDefault(),t.stopPropagation(),o=e-this.lastPoint,this.lastPoint=e,this.hooks.trigger(this.hooks.eventTypes.touchMove,o))},b.prototype.end=function(t){this.initiated&&(this.initiated=!1,t.preventDefault(),t.stopPropagation(),this.hooks.trigger(this.hooks.eventTypes.touchEnd))},b.prototype.destroy=function(){this.startEventRegister.destroy(),this.moveEventRegister.destroy(),this.endEventRegister.destroy()},b);function b(t,e){this.indicator=t,this.options=e,this.hooks=new y(["touchStart","touchMove","touchEnd"]),this.registerEvents()}var w=(S.prototype.handleFade=function(){this.options.fade&&(this.wrapper.style.opacity="0")},S.prototype.handleHooks=function(){var t,e,o,s,i=this,r=this.options,n=r.fade,a=r.interactive,l=r.scrollbarTrackClickable,h=this.scroll,c=h.hooks,p=h.scroller.translater.hooks,d=h.scroller.animater.hooks;this.registerHooks(c,c.eventTypes.refresh,this.refresh),this.registerHooks(p,p.eventTypes.translate,function(t){var e=i.keysMap.hasScroll;i.scroll[e]&&i.updatePosition(t)}),this.registerHooks(d,d.eventTypes.time,this.transitionTime),this.registerHooks(d,d.eventTypes.timeFunction,this.transitionTimingFunction),n&&(this.registerHooks(h,h.eventTypes.scrollEnd,function(){i.fade()}),this.registerHooks(h,h.eventTypes.scrollStart,function(){i.fade(!0)}),h.eventTypes.mousewheelStart&&h.eventTypes.mousewheelEnd&&(this.registerHooks(h,h.eventTypes.mousewheelStart,function(){i.fade(!0)}),this.registerHooks(h,h.eventTypes.mousewheelMove,function(){i.fade(!0)}),this.registerHooks(h,h.eventTypes.mousewheelEnd,function(){i.fade()}))),a&&(e=(t=this.scroll.options).disableMouse,o=t.disableTouch,this.eventHandler=new T(this,{disableMouse:e,disableTouch:o}),s=this.eventHandler.hooks,this.registerHooks(s,s.eventTypes.touchStart,this.startHandler),this.registerHooks(s,s.eventTypes.touchMove,this.moveHandler),this.registerHooks(s,s.eventTypes.touchEnd,this.endHandler)),l&&this.bindClick()},S.prototype.registerHooks=function(t,e,o){t.on(e,o,this),this.hooksFn.push([t,e,o])},S.prototype.bindClick=function(){var t=this.wrapper;this.clickEventRegister=new g(t,[{name:"click",handler:this.handleClick.bind(this)}])},S.prototype.handleClick=function(t){var e=this.calculateclickOffsetPos(t),o=this.scroll,s=o.x,i=o.y,s="horizontal"===this.direction?e:s,i="vertical"===this.direction?e:i;this.scroll.scrollTo(s,i,this.options.scrollbarTrackOffsetTime)},S.prototype.calculateclickOffsetPos=function(t){var e=this.keysMap,o=e.point,s=e.domRect,i=this.options.scrollbarTrackOffsetType,r=t[o]-this.wrapperRect[s],n=r<this.currentPos?-1:1,a=0,l=this.currentPos;return"step"===i?a=this.scrollInfo.baseSize*n:(a=0,l=r),this.newPos(l,a,this.scrollInfo)},S.prototype.getKeysMap=function(){return"vertical"===this.direction?{hasScroll:"hasVerticalScroll",size:"height",wrapperSize:"clientHeight",scrollerSize:"scrollerHeight",maxScrollPos:"maxScrollY",pos:"y",point:"pageY",translateProperty:"translateY",domRect:"top"}:{hasScroll:"hasHorizontalScroll",size:"width",wrapperSize:"clientWidth",scrollerSize:"scrollerWidth",maxScrollPos:"maxScrollX",pos:"x",point:"pageX",translateProperty:"translateX",domRect:"left"}},S.prototype.fade=function(t){var e=this.options,o=e.fadeInTime,s=e.fadeOutTime,i=t?o:s,r=this.wrapper;r.style[u]=i+"ms",r.style.opacity=t?"1":"0"},S.prototype.refresh=function(){var t,e,o,s,i=this.keysMap.hasScroll,r=this.scroll,n=r.x,a=r.y;this.wrapperRect=this.wrapper.getBoundingClientRect(),this.canScroll(r[i])&&(e=(t=this.keysMap).wrapperSize,o=t.scrollerSize,s=t.maxScrollPos,this.scrollInfo=this.refreshScrollInfo(this.wrapper[e],r[o],r[s],this.indicatorEl[e]),this.updatePosition({x:n,y:a}))},S.prototype.transitionTime=function(t){void 0===t&&(t=0),this.indicatorEl.style[u]=t+"ms"},S.prototype.transitionTimingFunction=function(t){this.indicatorEl.style[p]=t},S.prototype.canScroll=function(t){return this.wrapper.style.display=t?"block":"none",t},S.prototype.refreshScrollInfo=function(t,e,o,s){var i=Math.max(Math.round(t*t/(e||t||1)),this.options.minSize);this.options.isCustom&&(i=s);var r=t-i;return{baseSize:i,maxScrollPos:r,minScrollPos:0,sizeRatio:r/o}},S.prototype.updatePosition=function(t){var e=this.caculatePosAndSize(t,this.scrollInfo),o=e.pos,s=e.size;this.refreshStyle(s,o),this.currentPos=o},S.prototype.caculatePosAndSize=function(t,e){var o,s=this.keysMap.pos,i=e.sizeRatio,r=e.baseSize,n=e.maxScrollPos,a=e.minScrollPos,l=this.options.minSize,h=Math.round(i*t[s]);return h<a?(o=Math.max(r+3*h,l),h=a):n<h?h=n+r-(o=Math.max(r-3*(h-n),l)):o=r,{pos:h,size:o}},S.prototype.refreshStyle=function(t,e){var o=this.keysMap,s=o.translateProperty,i=o.size,r=this.scroll.options.translateZ;this.indicatorEl.style[i]=t+"px",this.indicatorEl.style[c]=s+"("+e+"px)"+r},S.prototype.startHandler=function(){this.moved=!1,this.startTime=f(),this.transitionTime(),this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.beforeScrollStart)},S.prototype.moveHandler=function(t){var e;this.moved||this.indicatorNotMoved(t)||(this.moved=!0,this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.scrollStart)),this.moved&&(e=this.newPos(this.currentPos,t,this.scrollInfo),this.syncBScroll(e))},S.prototype.endHandler=function(){var t,e,o;this.moved&&(e=(t=this.scroll).x,o=t.y,this.scroll.scroller.hooks.trigger(this.scroll.scroller.hooks.eventTypes.scrollEnd,{x:e,y:o}))},S.prototype.indicatorNotMoved=function(t){var e=this.currentPos,o=this.scrollInfo,s=o.maxScrollPos;return e===o.minScrollPos&&t<=0||e===s&&0<=t},S.prototype.syncBScroll=function(t){var e=f(),o=this.scroll,s=o.x,i=o.y,r=o.options,n=o.scroller,a=o.maxScrollY,l=o.minScrollY,h=o.maxScrollX,c=o.minScrollX,p=r.probeType,d=r.momentumLimitTime,u={x:s,y:i};"vertical"===this.direction?u.y=v(t,a,l):u.x=v(t,h,c),n.translater.translate(u),e-this.startTime>d&&(this.startTime=e,1===p&&n.hooks.trigger(n.hooks.eventTypes.scroll,u)),1<p&&n.hooks.trigger(n.hooks.eventTypes.scroll,u)},S.prototype.newPos=function(t,e,o){var s=o.maxScrollPos,i=o.sizeRatio,r=v(r=t+e,o.minScrollPos,s);return Math.round(r/i)},S.prototype.destroy=function(){var t=this.options,e=t.interactive,o=t.scrollbarTrackClickable,s=t.isCustom;e&&this.eventHandler.destroy(),o&&this.clickEventRegister.destroy(),s||this.wrapper.parentNode.removeChild(this.wrapper),this.hooksFn.forEach(function(t){var e=t[0],o=t[1],s=t[2];e.off(o,s)}),this.hooksFn.length=0},S);function S(t,e){this.scroll=t,this.options=e,this.hooksFn=[],this.wrapper=e.wrapper,this.direction=e.direction,this.indicatorEl=this.wrapper.children[0],this.keysMap=this.getKeysMap(),this.handleFade(),this.handleHooks()}function E(t){this.scroll=t,this.handleOptions(),this.createIndicators(),this.handleHooks()}return E.prototype.handleHooks=function(){var o=this,t=this.scroll;t.hooks.on(t.hooks.eventTypes.destroy,function(){for(var t=0,e=o.indicators;t<e.length;t++){e[t].destroy()}})},E.prototype.handleOptions=function(){var t=!0===this.scroll.options.scrollbar?{}:this.scroll.options.scrollbar;this.options=function(t,e){for(var o in e)t[o]=e[o];return t}({fade:!0,fadeInTime:250,fadeOutTime:500,interactive:!1,customElements:[],minSize:8,scrollbarTrackClickable:!1,scrollbarTrackOffsetType:"step",scrollbarTrackOffsetTime:300},t)},E.prototype.createIndicators=function(){for(var t,e=this.scroll,o=[],s=["scrollX","scrollY"],i=["horizontal","vertical"],r=this.options.customElements,n=0;n<s.length;n++){var a,l,h,c,p=s[n];e.options[p]&&(a=r.shift(),l=i[n],h=!1,(c=a||this.createScrollbarElement(l))!==a?e.wrapper.appendChild(c):h=!0,t=d(d({wrapper:c,direction:l},this.options),{isCustom:h}),o.push(new w(e,t)))}this.indicators=o},E.prototype.createScrollbarElement=function(t,e){void 0===e&&(e=this.options.scrollbarTrackClickable);var o=document.createElement("div"),s=document.createElement("div");return o.style.cssText="position:absolute;z-index:9999;overflow:hidden;",s.style.cssText="box-sizing:border-box;position:absolute;background:rgba(0,0,0,0.5);border:1px solid rgba(255,255,255,0.9);border-radius:3px;",s.className="bscroll-indicator","horizontal"===t?(o.style.cssText+="height:7px;left:2px;right:2px;bottom:0;",s.style.height="100%",o.className="bscroll-horizontal-scrollbar"):(o.style.cssText+="width:7px;bottom:2px;top:2px;right:1px;",s.style.width="100%",o.className="bscroll-vertical-scrollbar"),e||(o.style.cssText+="pointer-events:none;"),o.appendChild(s),o},E.pluginName="scrollbar",E});

dist/types/index.d.ts

@@ -6,2 +6,4 @@ import BScroll from '@better-scroll/core';
     fade: boolean;
+    fadeInTime: number;
+    fadeOutTime: number;
     interactive: boolean;
@@ -8,0 +10,0 @@ customElements: HTMLElement[];

dist/types/indicator.d.ts

@@ -16,2 +16,4 @@ import BScroll, { TranslaterPoint } from '@better-scroll/core';
     fade: boolean;
+    fadeInTime: number;
+    fadeOutTime: number;
     interactive: boolean;
@@ -18,0 +20,0 @@ minSize: number;

package.json

 {
   "name": "@better-scroll/scroll-bar",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "description": "scrollbar is used to BetterScroll, which behaves like browser scrollbar",
@@ -33,5 +33,5 @@ "author": {
   "dependencies": {
-    "@better-scroll/core": "^2.3.1"
+    "@better-scroll/core": "^2.4.0"
   },
-  "gitHead": "b492215cf74c22a6b7e65d02cd63291d4b5147b3"
+  "gitHead": "a33d24e10d2d6cb431a29f9b356274845f3c3787"
 }

src/__tests__/event-handler.spec.ts

@@ -30,2 +30,4 @@ import Indicator, { IndicatorDirection, OffsetType } from '../indicator'
     fade: true,
+    fadeInTime: 250,
+    fadeOutTime: 500,
     interactive: false,
@@ -32,0 +34,0 @@ minSize: 8,

src/__tests__/indicator.spec.ts

@@ -29,2 +29,4 @@ import Indicator, { IndicatorDirection, OffsetType } from '../indicator'
     fade: true,
+    fadeInTime: 250,
+    fadeOutTime: 500,
     interactive: false,
@@ -31,0 +33,0 @@ minSize: 8,

src/index.ts

@@ -13,2 +13,4 @@ import BScroll from '@better-scroll/core'
   fade: boolean
+  fadeInTime: number
+  fadeOutTime: number
   interactive: boolean
@@ -54,2 +56,4 @@ customElements: HTMLElement[]
       fade: true,
+      fadeInTime: 250,
+      fadeOutTime: 500,
       interactive: false,
@@ -56,0 +60,0 @@ customElements: [],

src/indicator.ts

@@ -31,2 +31,4 @@ import BScroll, { TranslaterPoint } from '@better-scroll/core'
   fade: boolean
+  fadeInTime: number
+  fadeOutTime: number
   interactive: boolean
@@ -251,3 +253,4 @@ minSize: number
   fade(visible?: boolean) {
-    const time = visible ? 250 : 500
+    const { fadeInTime, fadeOutTime } = this.options
+    const time = visible ? fadeInTime : fadeOutTime
     const wrapper = this.wrapper
@@ -254,0 +257,0 @@ wrapper.style[style.transitionDuration as any] = time + 'ms'

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

121052

increased by0.67%

Lines of code

2919

increased by0.76%

Dependency changes

• Updated@better-scroll/core@^2.4.0