From 68514549ad161c168387803109e159db459c2710 Mon Sep 17 00:00:00 2001 From: kaptinlin Date: Mon, 17 Oct 2016 23:02:01 +0800 Subject: [PATCH] Release v0.4.4 --- .eslintrc.yml | 2 +- README.md | 13 +++++--- bower.json | 4 +-- dist/css/asScrollable.css | 2 +- dist/css/asScrollable.min.css | 2 +- dist/jquery-asScrollable.es.js | 11 +++---- dist/jquery-asScrollable.js | 14 ++++----- dist/jquery-asScrollable.min.js | 4 +-- examples/index.html | 6 ++-- examples/js/jquery-asScrollbar.js | 49 ++++++++++++------------------- package.json | 4 +-- src/asScrollable.js | 4 +-- src/info.js | 2 +- src/util.js | 39 ++++++++++++++++++++++++ 14 files changed, 91 insertions(+), 65 deletions(-) create mode 100644 src/util.js diff --git a/.eslintrc.yml b/.eslintrc.yml index caab979..4af437c 100644 --- a/.eslintrc.yml +++ b/.eslintrc.yml @@ -60,7 +60,7 @@ rules: # Best Practices accessor-pairs: "error" block-scoped-var: "error" - consistent-return: "error" + consistent-return: "off" curly: "error" default-case: "error" dot-location: "off" diff --git a/README.md b/README.md index 8985f5c..f1ffc8c 100755 --- a/README.md +++ b/README.md @@ -46,6 +46,11 @@ bower install jquery-asScrollable --save npm install jquery-asScrollable --save ``` +#### Install From Yarn +```sh +yarn add jquery-asScrollable +``` + #### Build From Source If you want build from source: @@ -155,11 +160,11 @@ You can also save the instances to variable for further use. ```javascript // call directly -$().asScrollable('destory'); +$().asScrollable('destroy'); // or var api = $().data('asScrollable'); -api.destory(); +api.destroy(); ``` #### scrollTo(direction, position) @@ -213,8 +218,8 @@ $('.the-element').on('asScrollable::ready', function (e) { Event | Description ------- | ----------- ready | Fires when the instance is ready for API use. -enable | This event is fired immediately when the `enable` instance method has been called. -disable | This event is fired immediately when the `disable` instance method has been called. +enable | Fired when the `enable` instance method has been called. +disable | Fired when the `disable` instance method has been called. destroy | Fires when an instance is destroyed. ## No conflict diff --git a/bower.json b/bower.json index 461003f..42bf765 100755 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "jquery-asScrollable", - "version": "0.4.3", + "version": "0.4.4", "description": "A jquery plugin that make a block element scrollable.", "main": "dist/jquery-asScrollable.js", "copyright": "amazingSurge", @@ -29,6 +29,6 @@ ], "dependencies": { "jquery": ">=2.2.0", - "jquery-asScrollbar": "^0.5.3" + "jquery-asScrollbar": "^0.5.4" } } diff --git a/dist/css/asScrollable.css b/dist/css/asScrollable.css index 3066196..e63f499 100644 --- a/dist/css/asScrollable.css +++ b/dist/css/asScrollable.css @@ -1,5 +1,5 @@ /** -* jQuery asScrollable v0.4.3 +* jQuery asScrollable v0.4.4 * https://github.com/amazingSurge/jquery-asScrollable * * Copyright (c) amazingSurge diff --git a/dist/css/asScrollable.min.css b/dist/css/asScrollable.min.css index b1fcafb..d549425 100644 --- a/dist/css/asScrollable.min.css +++ b/dist/css/asScrollable.min.css @@ -1,5 +1,5 @@ /** -* jQuery asScrollable v0.4.3 +* jQuery asScrollable v0.4.4 * https://github.com/amazingSurge/jquery-asScrollable * * Copyright (c) amazingSurge diff --git a/dist/jquery-asScrollable.es.js b/dist/jquery-asScrollable.es.js index 4a915dd..80db8a6 100644 --- a/dist/jquery-asScrollable.es.js +++ b/dist/jquery-asScrollable.es.js @@ -1,5 +1,5 @@ /** -* jQuery asScrollable v0.4.3 +* jQuery asScrollable v0.4.4 * https://github.com/amazingSurge/jquery-asScrollable * * Copyright (c) amazingSurge @@ -36,9 +36,6 @@ var DEFAULTS = { scrollbar: {} }; -/** - * Helper functions - **/ function getTime() { if (typeof window.performance !== 'undefined' && window.performance.now) { return window.performance.now(); @@ -804,7 +801,7 @@ class AsScrollable { } } - destory() { + destroy() { this.$wrap.removeClass(`${this.classes.wrap}-vertical`) .removeClass(`${this.classes.wrap}-horizontal`) .removeClass(this.classes.wrap) @@ -828,7 +825,7 @@ class AsScrollable { } this.$content.removeClass(this.classes.content); this.$element.data(NAMESPACE$1, null); - this.trigger('destory'); + this.trigger('destroy'); } static setDefaults(options) { @@ -837,7 +834,7 @@ class AsScrollable { } var info = { - version:'0.4.3' + version:'0.4.4' }; const NAMESPACE = 'asScrollable'; diff --git a/dist/jquery-asScrollable.js b/dist/jquery-asScrollable.js index 1b21b77..e6c4af5 100644 --- a/dist/jquery-asScrollable.js +++ b/dist/jquery-asScrollable.js @@ -1,5 +1,5 @@ /** -* jQuery asScrollable v0.4.3 +* jQuery asScrollable v0.4.4 * https://github.com/amazingSurge/jquery-asScrollable * * Copyright (c) amazingSurge @@ -100,10 +100,6 @@ scrollbar: {} }; - /** - * Helper functions - **/ - function getTime() { if (typeof window.performance !== 'undefined' && window.performance.now) { @@ -1000,8 +996,8 @@ } } }, { - key: 'destory', - value: function destory() { + key: 'destroy', + value: function destroy() { this.$wrap.removeClass(this.classes.wrap + '-vertical').removeClass(this.classes.wrap + '-horizontal').removeClass(this.classes.wrap).removeClass(this.options.enabledClass).removeClass(this.classes.disabledClass); this.unStyle(); @@ -1022,7 +1018,7 @@ } this.$content.removeClass(this.classes.content); this.$element.data(NAMESPACE$1, null); - this.trigger('destory'); + this.trigger('destroy'); } }], [{ key: 'setDefaults', @@ -1035,7 +1031,7 @@ }(); var info = { - version: '0.4.3' + version: '0.4.4' }; var NAMESPACE = 'asScrollable'; diff --git a/dist/jquery-asScrollable.min.js b/dist/jquery-asScrollable.min.js index 4ecdf13..44569d2 100644 --- a/dist/jquery-asScrollable.min.js +++ b/dist/jquery-asScrollable.min.js @@ -1,8 +1,8 @@ /** -* jQuery asScrollable v0.4.3 +* jQuery asScrollable v0.4.4 * https://github.com/amazingSurge/jquery-asScrollable * * Copyright (c) amazingSurge * Released under the LGPL-3.0 license */ -!function(t,e){if("function"==typeof define&&define.amd)define(["jquery"],e);else if("undefined"!=typeof exports)e(require("jquery"));else{var i={exports:{}};e(t.jQuery),t.jqueryAsScrollableEs=i.exports}}(this,function(t){"use strict";function e(t){return t&&t.__esModule?t:{default:t}}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function s(){return"undefined"!=typeof window.performance&&window.performance.now?window.performance.now():Date.now()}function n(t){return"string"==typeof t&&t.indexOf("%")!==-1}function a(t){return t<0?t=0:t>1&&(t=1),100*parseFloat(t).toFixed(4)+"%"}function o(t){return parseFloat(t.slice(0,-1)/100,10)}var r=e(t),l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol?"symbol":typeof t},h=function(){function t(t,e){for(var i=0;i23)}(),u="asScrollable",d=0,v=function(){function t(e,s){i(this,t),this.$element=(0,r.default)(e),s=this.options=r.default.extend({},c,s||{},this.$element.data("options")||{}),this.classes={wrap:s.namespace,content:s.namespace+"-content",container:s.namespace+"-container",bar:s.namespace+"-bar",barHide:s.namespace+"-bar-hide",skin:s.skin},this.attributes={vertical:{axis:"Y",overflow:"overflow-y",scroll:"scrollTop",scrollLength:"scrollHeight",pageOffset:"pageYOffset",ffPadding:"padding-right",length:"height",clientLength:"clientHeight",offset:"offsetHeight",crossLength:"width",crossClientLength:"clientWidth",crossOffset:"offsetWidth"},horizontal:{axis:"X",overflow:"overflow-x",scroll:"scrollLeft",scrollLength:"scrollWidth",pageOffset:"pageXOffset",ffPadding:"padding-bottom",length:"width",clientLength:"clientWidth",offset:"offsetWidth",crossLength:"height",crossClientLength:"clientHeight",crossOffset:"offsetHeight"}},this._states={},this.horizontal=null,this.vertical=null,this.$bar=null,this._frameId=null,this._timeoutId=null,this.instanceId=++d,this.easing=r.default.asScrollbar.getEasing(this.options.easing)||r.default.asScrollbar.getEasing("ease");var n=this.$element.css("position");this.options.containerSelector?(this.$container=this.$element.find(this.options.containerSelector),this.$wrap=this.$element,"static"===n&&this.$wrap.css("position","relative")):(this.$container=this.$element.wrap("
"),this.$wrap=this.$container.parent(),this.$wrap.height(this.$element.height()),"static"!==n?this.$wrap.css("position",n):this.$wrap.css("position","relative")),this.options.contentSelector?this.$content=this.$container.find(this.options.contentSelector):(this.$content=this.$container.wrap("
"),this.$container=this.$content.parent()),this.init()}return h(t,[{key:"init",value:function(){switch(this.options.direction){case"vertical":this.vertical=!0;break;case"horizontal":this.horizontal=!0;break;case"both":this.horizontal=!0,this.vertical=!0;break;case"auto":var t=this.$element.css("overflow-x"),e=this.$element.css("overflow-y");"scroll"!==t&&"auto"!==t||(this.horizontal=!0),"scroll"!==e&&"auto"!==e||(this.vertical=!0)}(this.vertical||this.horizontal)&&(this.$wrap.addClass(this.classes.wrap),this.$container.addClass(this.classes.container),this.$content.addClass(this.classes.content),this.options.skin&&this.$wrap.addClass(this.classes.skin),this.$wrap.addClass(this.options.enabledClass),this.vertical&&(this.$wrap.addClass(this.classes.wrap+"-vertical"),this.initLayout("vertical"),this.createBar("vertical")),this.horizontal&&(this.$wrap.addClass(this.classes.wrap+"-horizontal"),this.initLayout("horizontal"),this.createBar("horizontal")),this.bindEvents(),this.trigger("ready"))}},{key:"bindEvents",value:function(){var t=this;if(this.options.responsive&&((0,r.default)(window).on(this.eventNameWithId("orientationchange"),function(){t.update()}),(0,r.default)(window).on(this.eventNameWithId("resize"),this.throttle(function(){t.update()},this.options.throttle))),this.horizontal||this.vertical){var e=this;this.$wrap.on(this.eventName("mouseenter"),function(){e.$wrap.addClass(t.options.hoveringClass),e.enter("hovering"),e.trigger("hover")}),this.$wrap.on(this.eventName("mouseleave"),function(){e.$wrap.removeClass(t.options.hoveringClass),e.is("hovering")&&(e.leave("hovering"),e.trigger("hovered"))}),this.options.showOnHover&&(this.options.showOnBarHover?this.$bar.on("asScrollbar::hover",function(){e.horizontal&&e.showBar("horizontal"),e.vertical&&e.showBar("vertical")}).on("asScrollbar::hovered",function(){e.horizontal&&e.hideBar("horizontal"),e.vertical&&e.hideBar("vertical")}):(this.$element.on(u+"::hover",r.default.proxy(this.showBar,this)),this.$element.on(u+"::hovered",r.default.proxy(this.hideBar,this)))),this.$container.on(this.eventName("scroll"),function(){if(e.horizontal){var t=e.offsetLeft;e.offsetLeft=e.getOffset("horizontal"),t!==e.offsetLeft&&(e.trigger("scroll",e.getPercentOffset("horizontal"),"horizontal"),0===e.offsetLeft&&e.trigger("scrolltop","horizontal"),e.offsetLeft===e.getScrollLength("horizontal")&&e.trigger("scrollend","horizontal"))}if(e.vertical){var i=e.offsetTop;e.offsetTop=e.getOffset("vertical"),i!==e.offsetTop&&(e.trigger("scroll",e.getPercentOffset("vertical"),"vertical"),0===e.offsetTop&&e.trigger("scrolltop","vertical"),e.offsetTop===e.getScrollLength("vertical")&&e.trigger("scrollend","vertical"))}}),this.$element.on(u+"::scroll",function(t,i,s,n){e.is("scrolling")||(e.enter("scrolling"),e.$wrap.addClass(e.options.scrollingClass));var o=i.getBarApi(n);o.moveTo(a(s),!1,!0),clearTimeout(e._timeoutId),e._timeoutId=setTimeout(function(){e.$wrap.removeClass(e.options.scrollingClass),e.leave("scrolling")},200)}),this.$bar.on("asScrollbar::change",function(t,i,s){"string"==typeof t.target.direction&&e.scrollTo(t.target.direction,a(s),!1,!0)}),this.$bar.on("asScrollbar::drag",function(){e.$wrap.addClass(e.options.draggingClass)}).on("asScrollbar::dragged",function(){e.$wrap.removeClass(e.options.draggingClass)})}}},{key:"unbindEvents",value:function(){this.$wrap.off(this.eventName()),this.$element.off(u+"::scroll").off(u+"::hover").off(u+"::hovered"),this.$container.off(this.eventName()),(0,r.default)(window).off(this.eventNameWithId())}},{key:"initLayout",value:function(t){"vertical"===t&&this.$container.css("height",this.$wrap.height());var e=this.attributes[t],i=this.$container[0],s=i.parentNode[e.crossClientLength],n=this.getBrowserScrollbarWidth(t);this.$content.css(e.crossLength,s+"px"),this.$container.css(e.crossLength,n+s+"px"),0===n&&f&&this.$container.css(e.ffPadding,16)}},{key:"createBar",value:function(t){var e=r.default.extend(this.options.scrollbar,{namespace:this.classes.bar,direction:t,useCssTransitions:!1,keyboard:!1}),i=(0,r.default)("
");i.asScrollbar(e),this.options.showOnHover&&i.addClass(this.classes.barHide),i.appendTo(this.$wrap),this["$"+t]=i,null===this.$bar?this.$bar=i:this.$bar=this.$bar.add(i),this.updateBarHandle(t)}},{key:"trigger",value:function(t){for(var e=arguments.length,i=Array(e>1?e-1:0),s=1;s0}},{key:"enter",value:function(t){void 0===this._states[t]&&(this._states[t]=0),this._states[t]++}},{key:"leave",value:function(t){this._states[t]--}},{key:"eventName",value:function(t){if("string"!=typeof t||""===t)return"."+this.options.namespace;t=t.split(" ");for(var e=t.length,i=0;ie?(n&&(clearTimeout(n),n=null),l=d,r=t.apply(a,o),n||(a=o=null)):n||(n=setTimeout(h,v)),r}}},{key:"getBrowserScrollbarWidth",value:function(t){var e=this.attributes[t],i=void 0,s=void 0;return e.scrollbarWidth?e.scrollbarWidth:(i=document.createElement("div"),s=i.style,s.position="absolute",s.width="100px",s.height="100px",s.overflow="scroll",s.top="-9999px",document.body.appendChild(i),e.scrollbarWidth=i[e.offset]-i[e.clientLength],document.body.removeChild(i),e.scrollbarWidth)}},{key:"getOffset",value:function(t){var e=this.attributes[t],i=this.$container[0];return i[e.pageOffset]||i[e.scroll]}},{key:"getPercentOffset",value:function(t){return this.getOffset(t)/this.getScrollLength(t)}},{key:"getContainerLength",value:function(t){return this.$container[0][this.attributes[t].clientLength]}},{key:"getScrollLength",value:function(t){var e=this.$content[0][this.attributes[t].scrollLength];return e-this.getContainerLength(t)}},{key:"scrollTo",value:function(t,e,i,s){var a="undefined"==typeof e?"undefined":l(e);"string"===a&&(n(e)&&(e=o(e)*this.getScrollLength(t)),e=parseFloat(e),a="number"),"number"===a&&this.move(t,e,i,s)}},{key:"scrollBy",value:function(t,e,i,s){var a="undefined"==typeof e?"undefined":l(e);"string"===a&&(n(e)&&(e=o(e)*this.getScrollLength(t)),e=parseFloat(e),a="number"),"number"===a&&this.move(t,this.getOffset(t)+e,i,s)}},{key:"move",value:function(t,e,i,n){var a=this;if(this[t]===!0&&"number"==typeof e){this.enter("moving"),e<0?e=0:e>this.getScrollLength(t)&&(e=this.getScrollLength(t));var o=this.attributes[t],r=this,l=function(){r.leave("moving")};n?(this.$container[0][o.scroll]=e,i!==!1&&this.trigger("change",e/this.getScrollLength(t),t),l()):!function(){a.enter("animating");var n=s(),h=a.getOffset(t),c=e,f=function s(a){var f=(a-n)/r.options.duration;f>1&&(f=1),f=r.easing.fn(f);var u=parseFloat(h+f*(c-h),10);r.$container[0][o.scroll]=u,i!==!1&&r.trigger("change",e/r.getScrollLength(t),t),1===f?(window.cancelAnimationFrame(r._frameId),r._frameId=null,r.leave("animating"),l()):r._frameId=window.requestAnimationFrame(s)};a._frameId=window.requestAnimationFrame(f)}()}}},{key:"scrollXto",value:function(t,e,i){return this.scrollTo("horizontal",t,e,i)}},{key:"scrollYto",value:function(t,e,i){return this.scrollTo("vertical",t,e,i)}},{key:"scrollXby",value:function(t,e,i){return this.scrollBy("horizontal",t,e,i)}},{key:"scrollYby",value:function(t,e,i){return this.scrollBy("vertical",t,e,i)}},{key:"getBar",value:function(t){return t&&this["$"+t]?this["$"+t]:this.$bar}},{key:"getBarApi",value:function(t){return this.getBar(t).data("asScrollbar")}},{key:"getBarX",value:function(){return this.getBar("horizontal")}},{key:"getBarY",value:function(){return this.getBar("vertical")}},{key:"showBar",value:function(t){this.getBar(t).removeClass(this.classes.barHide)}},{key:"hideBar",value:function(t){this.getBar(t).addClass(this.classes.barHide)}},{key:"updateBarHandle",value:function(t){var e=this.getBarApi(t);if(e){var i=this.getContainerLength(t),s=this.getScrollLength(t);s>0?(e.is("disabled")&&e.enable(),e.setHandleLength(e.getBarLength()*i/(s+i),!0)):e.disable()}}},{key:"disable",value:function(){this.is("disabled")||(this.enter("disabled"),this.$wrap.addClass(this.options.disabledClass).removeClass(this.options.enabledClass),this.unbindEvents(),this.unStyle()),this.trigger("disable")}},{key:"enable",value:function(){this.is("disabled")&&(this.leave("disabled"),this.$wrap.addClass(this.options.enabledClass).removeClass(this.options.disabledClass),this.bindEvents(),this.update()),this.trigger("enable")}},{key:"update",value:function(){this.is("disabled")||(this.vertical&&(this.initLayout("vertical"),this.updateBarHandle("vertical")),this.horizontal&&(this.initLayout("horizontal"),this.updateBarHandle("horizontal")))}},{key:"unStyle",value:function(){this.horizontal&&(this.$container.css({height:"","padding-bottom":""}),this.$content.css({height:""})),this.vertical&&(this.$container.css({width:"",height:"","padding-right":""}),this.$content.css({width:""})),this.options.containerSelector||this.$wrap.css({height:""})}},{key:"destory",value:function(){this.$wrap.removeClass(this.classes.wrap+"-vertical").removeClass(this.classes.wrap+"-horizontal").removeClass(this.classes.wrap).removeClass(this.options.enabledClass).removeClass(this.classes.disabledClass),this.unStyle(),this.$bar&&this.$bar.remove(),this.unbindEvents(),this.options.containerSelector?this.$container.removeClass(this.classes.container):this.$container.unwrap(),this.options.contentSelector||this.$content.unwrap(),this.$content.removeClass(this.classes.content),this.$element.data(u,null),this.trigger("destory")}}],[{key:"setDefaults",value:function(t){r.default.extend(c,r.default.isPlainObject(t)&&t)}}]),t}(),g={version:"0.4.3"},p="asScrollable",b=r.default.fn.asScrollable,m=function(t){for(var e=this,i=arguments.length,s=Array(i>1?i-1:0),n=1;n1&&(t=1),100*parseFloat(t).toFixed(4)+"%"}function o(t){return parseFloat(t.slice(0,-1)/100,10)}var r=e(t),l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol?"symbol":typeof t},h=function(){function t(t,e){for(var i=0;i23)}(),u="asScrollable",d=0,v=function(){function t(e,s){i(this,t),this.$element=(0,r.default)(e),s=this.options=r.default.extend({},c,s||{},this.$element.data("options")||{}),this.classes={wrap:s.namespace,content:s.namespace+"-content",container:s.namespace+"-container",bar:s.namespace+"-bar",barHide:s.namespace+"-bar-hide",skin:s.skin},this.attributes={vertical:{axis:"Y",overflow:"overflow-y",scroll:"scrollTop",scrollLength:"scrollHeight",pageOffset:"pageYOffset",ffPadding:"padding-right",length:"height",clientLength:"clientHeight",offset:"offsetHeight",crossLength:"width",crossClientLength:"clientWidth",crossOffset:"offsetWidth"},horizontal:{axis:"X",overflow:"overflow-x",scroll:"scrollLeft",scrollLength:"scrollWidth",pageOffset:"pageXOffset",ffPadding:"padding-bottom",length:"width",clientLength:"clientWidth",offset:"offsetWidth",crossLength:"height",crossClientLength:"clientHeight",crossOffset:"offsetHeight"}},this._states={},this.horizontal=null,this.vertical=null,this.$bar=null,this._frameId=null,this._timeoutId=null,this.instanceId=++d,this.easing=r.default.asScrollbar.getEasing(this.options.easing)||r.default.asScrollbar.getEasing("ease");var n=this.$element.css("position");this.options.containerSelector?(this.$container=this.$element.find(this.options.containerSelector),this.$wrap=this.$element,"static"===n&&this.$wrap.css("position","relative")):(this.$container=this.$element.wrap("
"),this.$wrap=this.$container.parent(),this.$wrap.height(this.$element.height()),"static"!==n?this.$wrap.css("position",n):this.$wrap.css("position","relative")),this.options.contentSelector?this.$content=this.$container.find(this.options.contentSelector):(this.$content=this.$container.wrap("
"),this.$container=this.$content.parent()),this.init()}return h(t,[{key:"init",value:function(){switch(this.options.direction){case"vertical":this.vertical=!0;break;case"horizontal":this.horizontal=!0;break;case"both":this.horizontal=!0,this.vertical=!0;break;case"auto":var t=this.$element.css("overflow-x"),e=this.$element.css("overflow-y");"scroll"!==t&&"auto"!==t||(this.horizontal=!0),"scroll"!==e&&"auto"!==e||(this.vertical=!0)}(this.vertical||this.horizontal)&&(this.$wrap.addClass(this.classes.wrap),this.$container.addClass(this.classes.container),this.$content.addClass(this.classes.content),this.options.skin&&this.$wrap.addClass(this.classes.skin),this.$wrap.addClass(this.options.enabledClass),this.vertical&&(this.$wrap.addClass(this.classes.wrap+"-vertical"),this.initLayout("vertical"),this.createBar("vertical")),this.horizontal&&(this.$wrap.addClass(this.classes.wrap+"-horizontal"),this.initLayout("horizontal"),this.createBar("horizontal")),this.bindEvents(),this.trigger("ready"))}},{key:"bindEvents",value:function(){var t=this;if(this.options.responsive&&((0,r.default)(window).on(this.eventNameWithId("orientationchange"),function(){t.update()}),(0,r.default)(window).on(this.eventNameWithId("resize"),this.throttle(function(){t.update()},this.options.throttle))),this.horizontal||this.vertical){var e=this;this.$wrap.on(this.eventName("mouseenter"),function(){e.$wrap.addClass(t.options.hoveringClass),e.enter("hovering"),e.trigger("hover")}),this.$wrap.on(this.eventName("mouseleave"),function(){e.$wrap.removeClass(t.options.hoveringClass),e.is("hovering")&&(e.leave("hovering"),e.trigger("hovered"))}),this.options.showOnHover&&(this.options.showOnBarHover?this.$bar.on("asScrollbar::hover",function(){e.horizontal&&e.showBar("horizontal"),e.vertical&&e.showBar("vertical")}).on("asScrollbar::hovered",function(){e.horizontal&&e.hideBar("horizontal"),e.vertical&&e.hideBar("vertical")}):(this.$element.on(u+"::hover",r.default.proxy(this.showBar,this)),this.$element.on(u+"::hovered",r.default.proxy(this.hideBar,this)))),this.$container.on(this.eventName("scroll"),function(){if(e.horizontal){var t=e.offsetLeft;e.offsetLeft=e.getOffset("horizontal"),t!==e.offsetLeft&&(e.trigger("scroll",e.getPercentOffset("horizontal"),"horizontal"),0===e.offsetLeft&&e.trigger("scrolltop","horizontal"),e.offsetLeft===e.getScrollLength("horizontal")&&e.trigger("scrollend","horizontal"))}if(e.vertical){var i=e.offsetTop;e.offsetTop=e.getOffset("vertical"),i!==e.offsetTop&&(e.trigger("scroll",e.getPercentOffset("vertical"),"vertical"),0===e.offsetTop&&e.trigger("scrolltop","vertical"),e.offsetTop===e.getScrollLength("vertical")&&e.trigger("scrollend","vertical"))}}),this.$element.on(u+"::scroll",function(t,i,s,n){e.is("scrolling")||(e.enter("scrolling"),e.$wrap.addClass(e.options.scrollingClass));var o=i.getBarApi(n);o.moveTo(a(s),!1,!0),clearTimeout(e._timeoutId),e._timeoutId=setTimeout(function(){e.$wrap.removeClass(e.options.scrollingClass),e.leave("scrolling")},200)}),this.$bar.on("asScrollbar::change",function(t,i,s){"string"==typeof t.target.direction&&e.scrollTo(t.target.direction,a(s),!1,!0)}),this.$bar.on("asScrollbar::drag",function(){e.$wrap.addClass(e.options.draggingClass)}).on("asScrollbar::dragged",function(){e.$wrap.removeClass(e.options.draggingClass)})}}},{key:"unbindEvents",value:function(){this.$wrap.off(this.eventName()),this.$element.off(u+"::scroll").off(u+"::hover").off(u+"::hovered"),this.$container.off(this.eventName()),(0,r.default)(window).off(this.eventNameWithId())}},{key:"initLayout",value:function(t){"vertical"===t&&this.$container.css("height",this.$wrap.height());var e=this.attributes[t],i=this.$container[0],s=i.parentNode[e.crossClientLength],n=this.getBrowserScrollbarWidth(t);this.$content.css(e.crossLength,s+"px"),this.$container.css(e.crossLength,n+s+"px"),0===n&&f&&this.$container.css(e.ffPadding,16)}},{key:"createBar",value:function(t){var e=r.default.extend(this.options.scrollbar,{namespace:this.classes.bar,direction:t,useCssTransitions:!1,keyboard:!1}),i=(0,r.default)("
");i.asScrollbar(e),this.options.showOnHover&&i.addClass(this.classes.barHide),i.appendTo(this.$wrap),this["$"+t]=i,null===this.$bar?this.$bar=i:this.$bar=this.$bar.add(i),this.updateBarHandle(t)}},{key:"trigger",value:function(t){for(var e=arguments.length,i=Array(e>1?e-1:0),s=1;s0}},{key:"enter",value:function(t){void 0===this._states[t]&&(this._states[t]=0),this._states[t]++}},{key:"leave",value:function(t){this._states[t]--}},{key:"eventName",value:function(t){if("string"!=typeof t||""===t)return"."+this.options.namespace;t=t.split(" ");for(var e=t.length,i=0;ie?(n&&(clearTimeout(n),n=null),l=d,r=t.apply(a,o),n||(a=o=null)):n||(n=setTimeout(h,v)),r}}},{key:"getBrowserScrollbarWidth",value:function(t){var e=this.attributes[t],i=void 0,s=void 0;return e.scrollbarWidth?e.scrollbarWidth:(i=document.createElement("div"),s=i.style,s.position="absolute",s.width="100px",s.height="100px",s.overflow="scroll",s.top="-9999px",document.body.appendChild(i),e.scrollbarWidth=i[e.offset]-i[e.clientLength],document.body.removeChild(i),e.scrollbarWidth)}},{key:"getOffset",value:function(t){var e=this.attributes[t],i=this.$container[0];return i[e.pageOffset]||i[e.scroll]}},{key:"getPercentOffset",value:function(t){return this.getOffset(t)/this.getScrollLength(t)}},{key:"getContainerLength",value:function(t){return this.$container[0][this.attributes[t].clientLength]}},{key:"getScrollLength",value:function(t){var e=this.$content[0][this.attributes[t].scrollLength];return e-this.getContainerLength(t)}},{key:"scrollTo",value:function(t,e,i,s){var a="undefined"==typeof e?"undefined":l(e);"string"===a&&(n(e)&&(e=o(e)*this.getScrollLength(t)),e=parseFloat(e),a="number"),"number"===a&&this.move(t,e,i,s)}},{key:"scrollBy",value:function(t,e,i,s){var a="undefined"==typeof e?"undefined":l(e);"string"===a&&(n(e)&&(e=o(e)*this.getScrollLength(t)),e=parseFloat(e),a="number"),"number"===a&&this.move(t,this.getOffset(t)+e,i,s)}},{key:"move",value:function(t,e,i,n){var a=this;if(this[t]===!0&&"number"==typeof e){this.enter("moving"),e<0?e=0:e>this.getScrollLength(t)&&(e=this.getScrollLength(t));var o=this.attributes[t],r=this,l=function(){r.leave("moving")};n?(this.$container[0][o.scroll]=e,i!==!1&&this.trigger("change",e/this.getScrollLength(t),t),l()):!function(){a.enter("animating");var n=s(),h=a.getOffset(t),c=e,f=function s(a){var f=(a-n)/r.options.duration;f>1&&(f=1),f=r.easing.fn(f);var u=parseFloat(h+f*(c-h),10);r.$container[0][o.scroll]=u,i!==!1&&r.trigger("change",e/r.getScrollLength(t),t),1===f?(window.cancelAnimationFrame(r._frameId),r._frameId=null,r.leave("animating"),l()):r._frameId=window.requestAnimationFrame(s)};a._frameId=window.requestAnimationFrame(f)}()}}},{key:"scrollXto",value:function(t,e,i){return this.scrollTo("horizontal",t,e,i)}},{key:"scrollYto",value:function(t,e,i){return this.scrollTo("vertical",t,e,i)}},{key:"scrollXby",value:function(t,e,i){return this.scrollBy("horizontal",t,e,i)}},{key:"scrollYby",value:function(t,e,i){return this.scrollBy("vertical",t,e,i)}},{key:"getBar",value:function(t){return t&&this["$"+t]?this["$"+t]:this.$bar}},{key:"getBarApi",value:function(t){return this.getBar(t).data("asScrollbar")}},{key:"getBarX",value:function(){return this.getBar("horizontal")}},{key:"getBarY",value:function(){return this.getBar("vertical")}},{key:"showBar",value:function(t){this.getBar(t).removeClass(this.classes.barHide)}},{key:"hideBar",value:function(t){this.getBar(t).addClass(this.classes.barHide)}},{key:"updateBarHandle",value:function(t){var e=this.getBarApi(t);if(e){var i=this.getContainerLength(t),s=this.getScrollLength(t);s>0?(e.is("disabled")&&e.enable(),e.setHandleLength(e.getBarLength()*i/(s+i),!0)):e.disable()}}},{key:"disable",value:function(){this.is("disabled")||(this.enter("disabled"),this.$wrap.addClass(this.options.disabledClass).removeClass(this.options.enabledClass),this.unbindEvents(),this.unStyle()),this.trigger("disable")}},{key:"enable",value:function(){this.is("disabled")&&(this.leave("disabled"),this.$wrap.addClass(this.options.enabledClass).removeClass(this.options.disabledClass),this.bindEvents(),this.update()),this.trigger("enable")}},{key:"update",value:function(){this.is("disabled")||(this.vertical&&(this.initLayout("vertical"),this.updateBarHandle("vertical")),this.horizontal&&(this.initLayout("horizontal"),this.updateBarHandle("horizontal")))}},{key:"unStyle",value:function(){this.horizontal&&(this.$container.css({height:"","padding-bottom":""}),this.$content.css({height:""})),this.vertical&&(this.$container.css({width:"",height:"","padding-right":""}),this.$content.css({width:""})),this.options.containerSelector||this.$wrap.css({height:""})}},{key:"destroy",value:function(){this.$wrap.removeClass(this.classes.wrap+"-vertical").removeClass(this.classes.wrap+"-horizontal").removeClass(this.classes.wrap).removeClass(this.options.enabledClass).removeClass(this.classes.disabledClass),this.unStyle(),this.$bar&&this.$bar.remove(),this.unbindEvents(),this.options.containerSelector?this.$container.removeClass(this.classes.container):this.$container.unwrap(),this.options.contentSelector||this.$content.unwrap(),this.$content.removeClass(this.classes.content),this.$element.data(u,null),this.trigger("destroy")}}],[{key:"setDefaults",value:function(t){r.default.extend(c,r.default.isPlainObject(t)&&t)}}]),t}(),g={version:"0.4.4"},p="asScrollable",b=r.default.fn.asScrollable,m=function(t){for(var e=this,i=arguments.length,s=Array(i>1?i-1:0),n=1;nSimple Structure - +
@@ -206,8 +206,8 @@

Simple Structure

$('.api-disable').on('click', function() { $('.simple').asScrollable('disable'); }); - $('.api-destory').on('click', function() { - $('.simple').asScrollable('destory'); + $('.api-destroy').on('click', function() { + $('.simple').asScrollable('destroy'); }); }); diff --git a/examples/js/jquery-asScrollbar.js b/examples/js/jquery-asScrollbar.js index d1c8c95..54c6344 100644 --- a/examples/js/jquery-asScrollbar.js +++ b/examples/js/jquery-asScrollbar.js @@ -1,5 +1,5 @@ /** -* jQuery asScrollbar v0.5.3 +* jQuery asScrollbar v0.5.4 * https://github.com/amazingSurge/jquery-asScrollbar * * Copyright (c) amazingSurge @@ -215,40 +215,31 @@ })(); } - /** - * Helper functions - **/ - var isPercentage = function isPercentage(n) { - 'use strict'; - + function isPercentage(n) { return typeof n === 'string' && n.indexOf('%') !== -1; - }; - - var convertPercentageToFloat = function convertPercentageToFloat(n) { - 'use strict'; + } + function convertPercentageToFloat(n) { return parseFloat(n.slice(0, -1) / 100, 10); - }; - - var convertMatrixToArray = function convertMatrixToArray(value) { - 'use strict'; + } + function convertMatrixToArray(value) { if (value && value.substr(0, 6) === 'matrix') { return value.replace(/^.*\((.*)\)$/g, '$1').replace(/px/g, '').split(/, +/); } return false; - }; + } - var getTime = function getTime() { + function getTime() { if (typeof window.performance !== 'undefined' && window.performance.now) { return window.performance.now(); } return Date.now(); - }; + } /** * Css features detect @@ -379,11 +370,13 @@ **/ var asScrollbar = function() { - function asScrollbar(bar, options) { + function asScrollbar(bar) { + var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1]; + _classCallCheck(this, asScrollbar); this.$bar = (0, _jquery2.default)(bar); - options = this.options = _jquery2.default.extend({}, DEFAULTS, options || {}, this.$bar.data('options') || {}); + options = this.options = _jquery2.default.extend({}, DEFAULTS, options, this.$bar.data('options') || {}); bar.direction = this.options.direction; this.classes = { @@ -464,13 +457,11 @@ }, { key: 'trigger', value: function trigger(eventType) { - var _ref; - for (var _len = arguments.length, params = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { params[_key - 1] = arguments[_key]; } - var data = (_ref = [this]).concat.apply(_ref, params); + var data = [this].concat(params); // event this.$bar.trigger(NAMESPACE$1 + '::' + eventType, data); @@ -485,9 +476,7 @@ var onFunction = 'on' + eventType; if (typeof this.options[onFunction] === 'function') { - var _options$onFunction; - - (_options$onFunction = this.options[onFunction]).apply.apply(_options$onFunction, [this].concat(params)); + this.options[onFunction].apply(this, params); } } }, { @@ -1173,8 +1162,8 @@ this.trigger('disable'); } }, { - key: 'destory', - value: function destory() { + key: 'destroy', + value: function destroy() { this.$handle.removeClass(this.classes.handleClass); this.$bar.removeClass(this.classes.barClass).removeClass(this.classes.directionClass).attr('draggable', null); @@ -1184,7 +1173,7 @@ this.$bar.off(this.eventName()); this.$handle.off(this.eventName()); - this.trigger('destory'); + this.trigger('destroy'); } }], [{ key: 'registerEasing', @@ -1211,7 +1200,7 @@ }(); var info = { - version: '0.5.3' + version: '0.5.4' }; var NAMESPACE = 'asScrollbar'; diff --git a/package.json b/package.json index fe8d3cf..a47c10f 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "jquery-asScrollable", "title": "jQuery asScrollable", "description": "A jquery plugin that make a block element scrollable.", - "version": "0.4.3", + "version": "0.4.4", "homepage": "https://github.com/amazingSurge/jquery-asScrollable", "author": { "name": "amazingSurge", @@ -123,6 +123,6 @@ }, "dependencies": { "jquery": ">=2.2.0", - "jquery-asScrollbar": "^0.5.3" + "jquery-asScrollbar": "^0.5.4" } } diff --git a/src/asScrollable.js b/src/asScrollable.js index 90f08b1..078608b 100644 --- a/src/asScrollable.js +++ b/src/asScrollable.js @@ -727,7 +727,7 @@ class AsScrollable { } } - destory() { + destroy() { this.$wrap.removeClass(`${this.classes.wrap}-vertical`) .removeClass(`${this.classes.wrap}-horizontal`) .removeClass(this.classes.wrap) @@ -751,7 +751,7 @@ class AsScrollable { } this.$content.removeClass(this.classes.content); this.$element.data(NAMESPACE, null); - this.trigger('destory'); + this.trigger('destroy'); } static setDefaults(options) { diff --git a/src/info.js b/src/info.js index 8ebe42a..119a683 100644 --- a/src/info.js +++ b/src/info.js @@ -1,3 +1,3 @@ export default { - version:'0.4.3' + version:'0.4.4' }; diff --git a/src/util.js b/src/util.js new file mode 100644 index 0000000..5207d5d --- /dev/null +++ b/src/util.js @@ -0,0 +1,39 @@ +export function getTime() { + if (typeof window.performance !== 'undefined' && window.performance.now) { + return window.performance.now(); + } + return Date.now(); +} + +export function isPercentage(n) { + return typeof n === 'string' && n.indexOf('%') !== -1; +} + +export function conventToPercentage(n) { + if (n < 0) { + n = 0; + } else if (n > 1) { + n = 1; + } + return `${parseFloat(n).toFixed(4) * 100}%`; +} + +export function convertPercentageToFloat(n) { + return parseFloat(n.slice(0, -1) / 100, 10); +} + +export let isFFLionScrollbar = (() => { + 'use strict'; + + let isOSXFF, ua, version; + ua = window.navigator.userAgent; + isOSXFF = /(?=.+Mac OS X)(?=.+Firefox)/.test(ua); + if (!isOSXFF) { + return false; + } + version = /Firefox\/\d{2}\./.exec(ua); + if (version) { + version = version[0].replace(/\D+/g, ''); + } + return isOSXFF && +version > 23; +})();