diff --git a/dist/js-scroll-effect-module.js b/dist/js-scroll-effect-module.js index cd4be96..e690ba6 100644 --- a/dist/js-scroll-effect-module.js +++ b/dist/js-scroll-effect-module.js @@ -1,17 +1,8 @@ /*! - * JS SCROLL EFFECT MODULE (JavaScript Library) - * js-scroll-effect-module - * Version 0.6.1 + * @yama-dev/js-scroll-effect-module + * Version 0.7.0 * Repository https://github.com/yama-dev/js-scroll-effect-module * Copyright yama-dev * Licensed MIT */ -!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.SCROLL_EFFECT_MODULE=e():t.SCROLL_EFFECT_MODULE=e()}(window,function(){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var o=e[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(i,o,function(e){return t[e]}.bind(null,o));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e,n){window,t.exports=function(t){var e={};function n(i){if(e[i])return e[i].exports;var o=e[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(i,o,function(e){return t[e]}.bind(null,o));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";n.r(e);var i=function(){function t(t,e){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:{};!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.Version="0.6.1",this.State={NumScrolltopPre:window.pageYOffset,NumScrolltop:window.pageYOffset,NumAcceleration:0,PosList:[],PosListFixPre:[],PosListFix:[],PosListNoneFix:[]};this.Config=o({elem:null,firstElem:null,displayRatio:.8,displayReverse:!1,firstDelay:10,firstDelaySteps:100,addClassNameActive:"is-active",acceleration:!1,on:{Scroll:null,Change:null,In:null,Out:null,Acceleration:null}},n),"complete"==document.readyState||"interactive"==document.readyState?(this.CacheDom(),this.BindEvent()):document.addEventListener("DOMContentLoaded",function(){e.CacheDom(),e.BindEvent()})}var e,n,i;return e=t,(n=[{key:"BindEvent",value:function(){var t=this;setTimeout(function(){t.Update(),t.StoreElementStateAtPosList("load")},this.Config.firstDelay),window.addEventListener("resize",function(){t.Update()}),window.addEventListener("scroll",function(){t.StoreElementStateAtPosList("scroll")})}},{key:"CacheDom",value:function(){this.$elemItem=r.selectDom(this.Config.elem),this.$elemItemFirst=r.selectDom(this.Config.firstElem)}},{key:"CacheDomSize",value:function(){this.NumWindowHeight=window.innerHeight}},{key:"SetDom",value:function(){var t=this;this.State.PosList=[],this.State.NumScrolltop=window.pageYOffset;var e=r.selectDom(this.$elemItem);e&&e.map(function(e){t.State.PosList.push(e.getBoundingClientRect().top+t.State.NumScrolltop)})}},{key:"Update",value:function(){this.CacheDom(),this.CacheDomSize(),this.SetDom()}},{key:"Refresh",value:function(){this.Update(),this.Clear(),this.ActionChange()}},{key:"Clear",value:function(){var t=this;this.State.PosList.map(function(e,n){r.removeClass(t.$elemItem[n],t.Config.addClassNameActive)})}},{key:"StoreElementStateAtPosList",value:function(t){var e=this;this.State.PosListFix=[],this.State.PosListNoneFix=[],this.State.NumScrolltop=window.pageYOffset,this.State.PosList.map(function(t,n){e.State.NumScrolltop+e.NumWindowHeight*e.Config.displayRatio>t?e.State.PosListFix.push(n):e.State.PosListNoneFix.push(n)}),this.Config.acceleration&&(Math.abs(this.State.NumAcceleration)<=Math.abs(this.State.NumScrolltop-this.State.NumScrolltopPre)&&(this.State.NumAcceleration=this.State.NumScrolltop-this.State.NumScrolltopPre,this.State.NumAcceleration>=100&&(this.State.NumAcceleration=100),this.State.NumAcceleration<=-100&&(this.State.NumAcceleration=-100),clearInterval(this.Interval),this.CheckAcceleration()),this.Config.on.Acceleration&&"function"==typeof this.Config.on.Acceleration&&this.Config.on.Acceleration(this.State.NumAcceleration)),"load"===t?this.ActionChangeFirst():"scroll"===t&&this.State.PosListFixPre.length!==this.State.PosListFix.length&&this.ActionChange(),this.Config.on.Scroll&&"function"==typeof this.Config.on.Scroll&&this.Config.on.Scroll(this.State.NumScrolltop),this.State.NumScrolltopPre=this.State.NumScrolltop,this.State.PosListFixPre=this.State.PosListFix}},{key:"CheckAcceleration",value:function(){var t=this;this.Interval=setInterval(function(){var e=Math.pow(1.02,Math.abs(t.State.NumAcceleration))-.6;t.State.NumAcceleration>0?t.State.NumAcceleration=t.State.NumAcceleration-e:t.State.NumAcceleration<0&&(t.State.NumAcceleration=t.State.NumAcceleration+e),t.State.NumAcceleration=Math.ceil(100*t.State.NumAcceleration)/100,t.State.NumAcceleration>-.8&&t.State.NumAcceleration<.8&&(t.State.NumAcceleration=0,clearInterval(t.Interval)),t.Config.on.Acceleration&&"function"==typeof t.Config.on.Acceleration&&t.Config.on.Acceleration(t.State.NumAcceleration)},10)}},{key:"ActionChangeFirst",value:function(){var t=this,e=0;this.$elemItemFirst?function n(){setTimeout(function(){t.Config.addClassNameActive&&r.addClass(t.$elemItemFirst[e],t.Config.addClassNameActive),++e0&&void 0!==arguments[0]?arguments[0]:{};!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.Version="0.7.0",this.State={NumScrolltopPre:window.pageYOffset,NumScrolltop:window.pageYOffset,NumAcceleration:0,PosList:[],PosListFixPre:[],PosListFix:[],PosListNoneFix:[]};this.Config=l({elem:null,firstElem:null,displayRatio:.8,displayReverse:!1,firstDelay:10,firstDelaySteps:100,addClassNameActive:"is-active",acceleration:!1,on:{Scroll:null,Change:null,In:null,Out:null,Acceleration:null}},n),"complete"==document.readyState||"interactive"==document.readyState?(this.CacheDom(),this.BindEvent()):document.addEventListener("DOMContentLoaded",(function(){e.CacheDom(),e.BindEvent()}))}var e,n,i;return e=t,(n=[{key:"BindEvent",value:function(){var t=this;setTimeout((function(){t.Update(),t.StoreElementStateAtPosList("load")}),this.Config.firstDelay),window.addEventListener("resize",(function(){t.Update()})),window.addEventListener("scroll",(function(){t.StoreElementStateAtPosList("scroll")}))}},{key:"CacheDom",value:function(){this.$elemItem=o(this.Config.elem),this.$elemItemFirst=o(this.Config.firstElem)}},{key:"CacheDomSize",value:function(){this.NumWindowHeight=window.innerHeight}},{key:"SetDom",value:function(){var t=this;this.State.PosList=[],this.State.NumScrolltop=window.pageYOffset;var e=o(this.$elemItem);e&&e.map((function(e){t.State.PosList.push(e.getBoundingClientRect().top+t.State.NumScrolltop)}))}},{key:"Update",value:function(){this.CacheDom(),this.CacheDomSize(),this.SetDom()}},{key:"Refresh",value:function(){this.Update(),this.Clear(),this.ActionChange()}},{key:"Clear",value:function(){var t=this;this.State.PosList.map((function(e,n){s(t.$elemItem[n],t.Config.addClassNameActive)}))}},{key:"StoreElementStateAtPosList",value:function(t){var e=this;this.State.PosListFix=[],this.State.PosListNoneFix=[],this.State.NumScrolltop=window.pageYOffset,this.State.PosList.map((function(t,n){e.State.NumScrolltop+e.NumWindowHeight*e.Config.displayRatio>t?e.State.PosListFix.push(n):e.State.PosListNoneFix.push(n)})),this.Config.acceleration&&(Math.abs(this.State.NumAcceleration)<=Math.abs(this.State.NumScrolltop-this.State.NumScrolltopPre)&&(this.State.NumAcceleration=this.State.NumScrolltop-this.State.NumScrolltopPre,this.State.NumAcceleration>=100&&(this.State.NumAcceleration=100),this.State.NumAcceleration<=-100&&(this.State.NumAcceleration=-100),clearInterval(this.Interval),this.CheckAcceleration()),this.Config.on.Acceleration&&"function"==typeof this.Config.on.Acceleration&&this.Config.on.Acceleration(this.State.NumAcceleration)),"load"===t?this.ActionChangeFirst():"scroll"===t&&this.State.PosListFixPre.length!==this.State.PosListFix.length&&this.ActionChange(),this.Config.on.Scroll&&"function"==typeof this.Config.on.Scroll&&this.Config.on.Scroll(this.State.NumScrolltop),this.State.NumScrolltopPre=this.State.NumScrolltop,this.State.PosListFixPre=this.State.PosListFix}},{key:"CheckAcceleration",value:function(){var t=this;this.Interval=setInterval((function(){var e=Math.pow(1.02,Math.abs(t.State.NumAcceleration))-.6;t.State.NumAcceleration>0?t.State.NumAcceleration=t.State.NumAcceleration-e:t.State.NumAcceleration<0&&(t.State.NumAcceleration=t.State.NumAcceleration+e),t.State.NumAcceleration=Math.ceil(100*t.State.NumAcceleration)/100,t.State.NumAcceleration>-.8&&t.State.NumAcceleration<.8&&(t.State.NumAcceleration=0,clearInterval(t.Interval)),t.Config.on.Acceleration&&"function"==typeof t.Config.on.Acceleration&&t.Config.on.Acceleration(t.State.NumAcceleration)}),10)}},{key:"ActionChangeFirst",value:function(){var t=this,e=0;this.$elemItemFirst?function n(){setTimeout((function(){t.Config.addClassNameActive&&r(t.$elemItemFirst[e],t.Config.addClassNameActive),++e{ this.State.PosList.push( el.getBoundingClientRect().top + this.State.NumScrolltop); @@ -110,7 +109,7 @@ export default class SCROLL_EFFECT_MODULE { Clear(){ this.State.PosList.map((el, i)=>{ - dom.removeClass(this.$elemItem[i], this.Config.addClassNameActive); + DOM.removeClass(this.$elemItem[i], this.Config.addClassNameActive); }); } @@ -191,7 +190,7 @@ export default class SCROLL_EFFECT_MODULE { // for Initial display setTimeout(() => { - if(this.Config.addClassNameActive) dom.addClass(this.$elemItemFirst[loopCount], this.Config.addClassNameActive); + if(this.Config.addClassNameActive) DOM.addClass(this.$elemItemFirst[loopCount], this.Config.addClassNameActive); loopCount++; @@ -221,8 +220,8 @@ export default class SCROLL_EFFECT_MODULE { ActionChange(){ this.State.PosListFix.map((el)=>{ - if(!dom.hasClass(this.$elemItem[el], this.Config.addClassNameActive)){ - if(this.Config.addClassNameActive) dom.addClass(this.$elemItem[el], this.Config.addClassNameActive); + if(!DOM.hasClass(this.$elemItem[el], this.Config.addClassNameActive)){ + if(this.Config.addClassNameActive) DOM.addClass(this.$elemItem[el], this.Config.addClassNameActive); // Callback function. if(this.Config.on.In && typeof(this.Config.on.In) === 'function') this.Config.on.In(this.$elemItem[el], el, this.State.NumScrolltop); @@ -231,8 +230,8 @@ export default class SCROLL_EFFECT_MODULE { if(this.Config.displayReverse){ this.State.PosListNoneFix.map((el)=>{ - if(dom.hasClass(this.$elemItem[el], this.Config.addClassNameActive)){ - dom.removeClass(this.$elemItem[el], this.Config.addClassNameActive); + if(DOM.hasClass(this.$elemItem[el], this.Config.addClassNameActive)){ + DOM.removeClass(this.$elemItem[el], this.Config.addClassNameActive); // Callback function. if(this.Config.on.Out && typeof(this.Config.on.Out) === 'function') this.Config.on.Out(this.$elemItem[el], el, this.State.NumScrolltop); diff --git a/webpack.config.js b/webpack.config.js index e37756e..26239ce 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,7 +1,6 @@ const pkg = require('./package.json'); -const comment = `JS SCROLL EFFECT MODULE (JavaScript Library) - ${pkg.name} +const comment = `@yama-dev/${pkg.name} Version ${pkg.version} Repository ${pkg.repository.url} Copyright ${pkg.author} @@ -27,12 +26,12 @@ const babelPlugin = [ const config = { mode: env || 'development', - entry: './src/js-scroll-effect-module.js', + entry: { + 'js-scroll-effect-module': './src/js-scroll-effect-module.js', + }, output: { path: `${__dirname}/dist`, - filename: 'js-scroll-effect-module.js', - library: 'SCROLL_EFFECT_MODULE', - libraryExport: 'default', + filename: '[name].js', libraryTarget: 'umd' }, module: { @@ -45,7 +44,7 @@ const config = { }, { test: /\.js$/, - exclude: /node_modules/, + exclude: /node_modules[//\/](?!(@yama\-dev)\/).*/, use: { loader: 'babel-loader', options: {