diff --git a/bundler/config/rollup.config_js_min.mjs b/bundler/config/rollup.config_js_min.mjs index 79b83c8..e8da986 100644 --- a/bundler/config/rollup.config_js_min.mjs +++ b/bundler/config/rollup.config_js_min.mjs @@ -32,6 +32,7 @@ export default { }, mangle: { keep_classnames: true, + reserved: ["JOS"], }, }), ], diff --git a/dev/jos.js b/dev/jos.js index 0286a84..d52d843 100644 --- a/dev/jos.js +++ b/dev/jos.js @@ -340,10 +340,18 @@ class jos { child.setAttribute("data-jos_duration", stagger_duration); - child.setAttribute( - "data-jos_delay", - parseFloat(stagger_delay) + stagger_seq * i - ); + // let delg = parseFloat(stagger_seq, 2); + // delg = (delg * i).toFixed(1); + // delg = parseFloat(delg); + // console.log(delg); + // delg = delg + parseFloat(stagger_delay); + + // const delg = parseFloat((parseFloat(stagger_seq, 2) * i).toFixed(1)) + parseFloat(stagger_delay); + + const delg = parseFloat(stagger_seq * i + stagger_delay); + + child.setAttribute("data-jos_delay", delg); + child.setAttribute("data-jos_once", stagger_once); if (stagger_mirror === "false") { diff --git a/dev/jos.min.js b/dev/jos.min.js index 41e4a97..ec0fbcf 100644 --- a/dev/jos.min.js +++ b/dev/jos.min.js @@ -22,6 +22,8 @@ class jos { disable = false; static version = "0.9.1 (Minified)"; + static author = "Jesvi Jonathan"; + static webpage = "https://jos-animation.vercel.app"; static github = "https://github.com/jesvijonathan/JOS-Animation-Library"; options = {}; @@ -328,10 +330,18 @@ class jos { child.setAttribute("data-jos_duration", stagger_duration); - child.setAttribute( - "data-jos_delay", - parseFloat(stagger_delay) + stagger_seq * i - ); + // let delg = parseFloat(stagger_seq, 2); + // delg = (delg * i).toFixed(1); + // delg = parseFloat(delg); + // console.log(delg); + // delg = delg + parseFloat(stagger_delay); + + // const delg = parseFloat((parseFloat(stagger_seq, 2) * i).toFixed(1)) + parseFloat(stagger_delay); + + const delg = parseFloat(stagger_seq * i + stagger_delay); + + child.setAttribute("data-jos_delay", delg); + child.setAttribute("data-jos_once", stagger_once); if (stagger_mirror === "false") { diff --git a/dist/jos.debug.js b/dist/jos.debug.js index 0286a84..d52d843 100644 --- a/dist/jos.debug.js +++ b/dist/jos.debug.js @@ -340,10 +340,18 @@ class jos { child.setAttribute("data-jos_duration", stagger_duration); - child.setAttribute( - "data-jos_delay", - parseFloat(stagger_delay) + stagger_seq * i - ); + // let delg = parseFloat(stagger_seq, 2); + // delg = (delg * i).toFixed(1); + // delg = parseFloat(delg); + // console.log(delg); + // delg = delg + parseFloat(stagger_delay); + + // const delg = parseFloat((parseFloat(stagger_seq, 2) * i).toFixed(1)) + parseFloat(stagger_delay); + + const delg = parseFloat(stagger_seq * i + stagger_delay); + + child.setAttribute("data-jos_delay", delg); + child.setAttribute("data-jos_once", stagger_once); if (stagger_mirror === "false") { diff --git a/dist/jos.js b/dist/jos.js index 9b95599..31870dc 100644 --- a/dist/jos.js +++ b/dist/jos.js @@ -1 +1 @@ -!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";!function(t,s){void 0===s&&(s={});var a=s.insertAt;if(t&&"undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===a&&e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.styleSheet?o.styleSheet.cssText=t:o.appendChild(document.createTextNode(t))}}(".jos,.jos-anchor{transition:all .4s ease-in-out}.jos-anchor{opacity:0;transition-timing-function:ease-in-out}.jos-static{opacity:1;transform:translate(0)}.jos-no-transition{transition-duration:0s;transition-timing-function:linear}.jos-hidden{display:none}.jos-visible{display:block;opacity:1}.jos-fade{opacity:0}.jos-fade-right{opacity:0;transform:translateX(-100px)}.jos-fade-left{opacity:0;transform:translateX(100px)}.jos-fade-up{opacity:0;transform:translateY(50px)}.jos-fade-down{opacity:0;transform:translateY(-50px)}.jos-fade-right-up{opacity:0;transform:translateX(-100px) translateY(50px)}.jos-fade-right-down{opacity:0;transform:translateX(-100px) translateY(-50px)}.jos-fade-left-up{opacity:0;transform:translateX(100px) translateY(50px)}.jos-fade-left-down{opacity:0;transform:translateX(100px) translateY(-50px)}.jos-slide,.jos-slide-right{transform:translateX(-100px)}.jos-slide-left{transform:translateX(100px)}.jos-slide-up{transform:translateY(100px)}.jos-slide-down{transform:translateY(-100px)}.jos-slide-right-up{transform:translateX(-100px) translateY(100px)}.jos-slide-right-down{transform:translateX(-100px) translateY(-100px)}.jos-slide-left-up{transform:translateX(100px) translateY(100px)}.jos-slide-left-down{transform:translateX(100px) translateY(-100px)}.jos-zoom,.jos-zoom-out{opacity:0;transform:scale(.8)}.jos-zoom-out-right,.jos-zoom-right{opacity:0;transform:scale(.8) translate3d(-100px,0,-100px)}.jos-zoom-left,.jos-zoom-out-left{opacity:0;transform:scale(.8) translate3d(100px,0,-100px)}.jos-zoom-down,.jos-zoom-out-down{opacity:0;transform:scale(.8) translate3d(0,-100px,0)}.jos-zoom-out-up,.jos-zoom-up{opacity:0;transform:scale(.8) translate3d(0,100px,0)}.jos-grow{transform:scale(0)}.jos-grow-right{transform:scale(0) translate3d(-100px,0,-100px)}.jos-grow-left{transform:scale(0) translate3d(100px,0,-100px)}.jos-grow-down{transform:scale(0) translate3d(0,-100px,0)}.jos-grow-up{transform:scale(0) translate3d(0,100px,0)}.jos-zoom-in{opacity:0;transform:scale(1.1)}.jos-zoom-in-down{opacity:0;transform:scale(1.1) translate3d(0,-100px,0)}.jos-zoom-in-up{opacity:0;transform:scale(1.1) translate3d(0,100px,0)}.jos-zoom-in-right{opacity:0;transform:scale(1.1) translate3d(-100px,0,-100px)}.jos-zoom-in-left{opacity:0;transform:scale(1.1) translate3d(100px,0,-100px)}.jos-shrink{transform:scale(1.4)}.jos-shrink-right{transform:scale(1.4) translate3d(-100px,0,-100px)}.jos-shrink-left{transform:scale(1.4) translate3d(100px,0,-100px)}.jos-shrink-down{transform:scale(1.4) translate3d(0,-100px,0)}.jos-shrink-up{transform:scale(1.4) translate3d(0,100px,0)}.jos-flip,.jos-flip-right{opacity:0;transform:perspective(2500px) rotateY(-100deg)}.jos-flip-left{opacity:0;transform:perspective(2500px) rotateY(100deg)}.jos-flip-up{opacity:0;transform:perspective(2500px) rotateX(-100deg)}.jos-flip-down{opacity:0;transform:perspective(2500px) rotateX(100deg)}.jos-rotate,.jos-rotate-right{opacity:0;transform:rotate(-180deg)}.jos-rotate-left{opacity:0;transform:rotate(180deg)}.jos-spin,.jos-spin-right{opacity:0;transform:rotate(-180deg) scale(0)}.jos-spin-left{opacity:0;transform:rotate(180deg) scale(0)}.jos-revolve,.jos-revolve-right{opacity:0;transform:rotate(-1turn) scale(0)}.jos-revolve-left{opacity:0;transform:rotate(1turn) scale(0)}.jos-stretch{opacity:0;transform:scaleX(0)}.jos-stretch-vertical{opacity:0;transform:scaleY(0)}.jos-skew{opacity:0;transform:skew(20deg,20deg)}.jos-skew-right{opacity:0;transform:skew(20deg,20deg) translate3d(-100px,0,-100px)}.jos-skew-left{opacity:0;transform:skew(20deg,20deg) translate3d(100px,0,-100px)}.jos-skew-down{opacity:0;transform:skew(20deg,20deg) translate3d(0,-100px,0)}.jos-skew-up{opacity:0;transform:skew(20deg,20deg) translate3d(0,100px,0)}.jos-slant{transform:skew(25deg,25deg)}.jos-slant-right{transform:skew(25deg,0deg)}.jos-slant-left{transform:skew(0deg,25deg)}.jos-bar,.jos-bar_vertical{transform:perspective(2500px) rotateY(-100deg)}.jos-bar_horizontal{transform:perspective(2500px) rotateX(-100deg)}.jos-grey{filter:grayscale(100%)}.jos-blur{filter:blur(7px)}.jos-backdrop{backdrop-filter:blur(7px);opacity:.8}.jos-invert{filter:invert(100%)}.jos-sepia{filter:sepia(100%)}.jos-saturate{filter:saturate(100%)}.jos-hue-rotate{filter:hue-rotate(90deg)}.jos-brightness{filter:brightness(.5)}[data-jos_timing_function=ease]{transition-timing-function:ease!important}[data-jos_timing_function=ease-in]{transition-timing-function:ease-in!important}[data-jos_timing_function=ease-out]{transition-timing-function:ease-out!important}[data-jos_timing_function=ease-in-out]{transition-timing-function:ease-in-out!important}[data-jos_timing_function=linear]{transition-timing-function:linear!important}[data-jos_timing_function=step-start]{transition-timing-function:step-start!important}[data-jos_timing_function=step-end]{transition-timing-function:step-end!important}[data-jos_timing_function=steps]{transition-timing-function:steps(5)!important}[data-jos_timing_function=frames]{transition-timing-function:frames(5)!important}.jos-slide-horizontal-play,.jos-slide-play{animation:jos-slide-play .7s ease-in-out infinite;animation-direction:alternate-reverse;transition:1s}@keyframes jos-slide-play{0%{transform:translateX(-100px)}to{transform:translateX(100px)}}.jos-slide-vertical-play{animation:jos-slide-vertical-play .7s ease-in-out infinite;animation-direction:alternate-reverse}@keyframes jos-slide-vertical-play{0%{transform:translateY(-100px)}to{transform:translateY(100px)}}.jos-pulse-play,.jos-zoom-in-play{animation:jos-zoom-in-play 1s infinite;animation-direction:alternate}@keyframes jos-zoom-in-play{0%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(.8)}}.jos-pulse-out-play,.jos-zoom-out-play,.jos-zoom-play{animation:jos-zoom-play .5s linear infinite;animation-direction:alternate}@keyframes jos-zoom-play{0%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1.1)}}.jos-flip-play{animation:jos-flip-play .7s infinite;animation-direction:alternate}@keyframes jos-flip-play{0%{transform:rotateY(0deg)}to{transform:rotateY(180deg)}}.jos-rotate-play{animation:jos-rotate-play 1s linear infinite forwards;animation-direction:alternate-reverse;border-radius:0}@keyframes jos-rotate-play{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.jos-spin-play{animation:jos-spin-play 1.5s infinite;animation-direction:alternate}@keyframes jos-spin-play{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(1turn)}}.jos-revolve-play{animation:jos-revolve-play 1.5s infinite;animation-direction:alternate}@keyframes jos-revolve-play{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.jos-grow-play,.jos-shrink-play{animation:jos-grow-play 1s infinite;animation-direction:alternate}@keyframes jos-grow-play{0%{transform:scale(0)}to{transform:scale(1)}}.jos-shrink-play{animation-direction:alternate-reverse}.jos-stretch-play{animation:jos-stretch-play .7s infinite;animation-direction:alternate}@keyframes jos-stretch-play{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.jos-stretch-vertical-play{animation:jos-stretch-vertical-play .7s infinite;animation-direction:alternate-reverse}@keyframes jos-stretch-vertical-play{0%{transform:scaleY(1)}to{transform:scaleY(0)}}.jos-fade-play{animation:jos-fade-play .8s infinite;animation-direction:alternate}@keyframes jos-fade-play{0%{opacity:0}to{opacity:1}}.jos-fade-horizontal-play{animation:jos-fade-horizontal-play 1s infinite;animation-direction:alternate-reverse}@keyframes jos-fade-horizontal-play{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(-100px)}}.jos-fade-vertical-play{animation:jos-fade-vertical-play 1s infinite;animation-direction:alternate-reverse}@keyframes jos-fade-vertical-play{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(-100px)}}.jos-blink-play{animation:jos-blink-play 1s step-end infinite}@keyframes jos-blink-play{0%{opacity:1}50%{opacity:0}}");class jos{default_once=!1;default_animation="fade";default_animationinverse=void 0;default_timingFunction="ease-in-out";default_threshold=0;default_duration=.4;default_delay=0;default_intersectionRatio=0;default_rootMargin="-10% 0% -40% 0%";default_startVisible=void 0;default_scrolldirection=void 0;default_passive=!0;default_mirror=void 0;setRange=new Set;debug=!1;scrollProgressDisable=void 0;disable=!1;static version="0.9.1";static author="Jesvi Jonathan";static webpage="https://jos-animation.vercel.app";static github="https://github.com/jesvijonathan/JOS-Animation-Library";options={};jos_stylesheet=void 0;boxes=void 0;observers=[];scrollEnter=[];constructor(){}version(){console.log(`JOS: Javascript On Scroll Animation Library\n - Version: ${jos.version}\n - Author: ${jos.author}\n - Webpage: ${jos.webpage}\n - Github: ${jos.github}\n`)}debugger(t=0){0==t&&this.debugMode&&(this.version(),console.log(`JOS Settings:\n - animation: ${this.default_animation}\n - once: ${this.default_once}\n - animationinverse: ${this.default_animationinverse}\n - timingFunction: ${this.default_timingFunction}\n - duration: ${this.default_duration}\n - delay: ${this.default_delay}\n - threshold: ${this.default_threshold}\n - startVisible: ${this.default_startVisible}\n - scrolldirection: ${this.default_scrolldirection}\n - intersectionRatio: ${this.default_intersectionRatio}\n - rootMargin: ${this.default_rootMargin}\n - disable: ${this.disable}\n - debugMode: ${this.debugMode}\n`)),console.log("JOS Initialized:\n\n"),1!=t&&0!=t||!this.debugMode||console.log(this.boxes||"No Elements Found")}callbackRouter_anchor=(t,s)=>{if(this.disable)return;let a=t[0],e=a.target;document.querySelectorAll("[data-jos_anchor='#"+e.id+"']").forEach((t=>{let e=t.dataset.jos_animation,o=t.dataset.jos_animationinverse;if(a.isIntersecting){if(null!=t.dataset.jos_counter){let s=parseInt(t.dataset.jos_counter);s++,t.dataset.jos_counter=s}e&&(t.classList.remove("jos-"+e),null!=t.dataset.jos_invoke&&window[t.dataset.jos_invoke](t),null==t.dataset.jos_once&&"false"==t.dataset.jos_once||("true"==t.dataset.jos_once||t.dataset.jos_counter>=t.dataset.jos_once)&&s.unobserve(t),null!=o&&t.classList.add("jos-"+o))}else void 0!==t.dataset.jos_scrolldirection&&"down"!==t.dataset.jos_scrolldirection&&"none"!==t.dataset.jos_scrolldirection||(t.classList.add("jos-"+e),void 0!==t.dataset.jos_invoke_out&&window[t.dataset.jos_invoke_out](t))}))};callbackScroller=t=>{if(this.disable||this.scrollProgressDisable)return;const s=this.default_rootMargin;let a=window.innerHeight;const e=t=>{const e=t.dataset.jos_rootmargin||s,o=e.split(" ").map(parseFloat),i=a*o[0]/100,n=a*o[2]/100;t.jos={rootMargin:e,rootMarginValues:o,topMargin:i,bottomMargin:n};const r=t.getBoundingClientRect(),l=r.top-t.jos.topMargin,d=r.bottom-t.jos.bottomMargin,c=r.top/a,f=l/(a-t.jos.topMargin-t.jos.bottomMargin);let m=0;m=f<=0?0:f>=100?1:f,t.jos={elementRect:r,elementTop:l,elementBottom:d,windowScrollProgress:c,rootScrollProgress:f,scrollProgress:m},window[t.dataset.jos_scroll](t)};document.onscroll=s=>{this.disable||this.scrollProgressDisable||t.forEach(e)}};callbackRouter=(t,s,a=1)=>{if(this.disable)return;let e=t[0],o=e.target,i=o.dataset.jos_animation,n=o.dataset.jos_animationinverse,r=1;if(r=e.boundingClientRect.top<0?0:1,e.isIntersecting){if("false"!=o.dataset.jos_scroll&&null!=o.dataset.jos_scroll&&(this.scrollEnter.push(o),this.callbackScroller(this.scrollEnter)),null!=o.dataset.jos_counter){let t=parseInt(o.dataset.jos_counter);t++,o.dataset.jos_counter=t}"false"==o.dataset.jos_mirror&&o.classList.remove("jos-no-mirror"),i&&(o.classList.remove("jos-"+i),null!=o.dataset.jos_invoke&&window[o.dataset.jos_invoke](o),null==o.dataset.jos_once&&"false"==o.dataset.jos_once||("true"==o.dataset.jos_once||o.dataset.jos_counter>=o.dataset.jos_once)&&s.unobserve(o)),null!=n&&o.classList.add("jos-"+n)}else(void 0===o.dataset.jos_scrolldirection||1===r&&"down"===o.dataset.jos_scrolldirection||0===r&&"up"===o.dataset.jos_scrolldirection||"none"===o.dataset.jos_scrolldirection)&&(o.classList.toggle("jos-no-mirror","false"==o.dataset.jos_mirror),o.classList.add("jos-"+i),null!=n&&o.classList.remove("jos-"+n),void 0!==o.dataset.jos_invoke_out&&window[o.dataset.jos_invoke_out](o)),"false"!=o.dataset.jos_scroll&&null!=o.dataset.jos_scroll&&(this.scrollEnter=this.scrollEnter.filter((t=>t.id!==o.id)),this.callbackScroller(this.scrollEnter))};animationInit(){let t=[],s=a=>{let e=a.dataset.jos_once,o=a.dataset.jos_animation||this.default_animation,i=a.dataset.jos_animationinverse,n=a.dataset.jos_timingFunction,r=a.dataset.jos_duration,l=a.dataset.jos_delay,d=a.dataset.jos_mirror||this.default_mirror;if(a.classList.contains("jos_disabled")&&(a.classList.remove("jos_disabled"),a.classList.add("jos")),e&&("true"==e||/^\d+$/.test(e))?a.setAttribute("data-jos_once",e):a.setAttribute("data-jos_once",this.default_once?"1":"false"),a.dataset.jos_stagger){const e=this.default_delay,o=this.default_duration,i=this.once,n=this.mirror,r=this.scrolldirection,l=this.rootMargin;if(a.id||(a.id=Math.random().toString(36).substring(7)),Array.from(a.children).forEach(((d,c)=>{if(!d.classList.contains("jos")){d.classList.add("jos"),d.id||(d.id=`${a.id}_${c}`);const f=a.dataset.jos_stagger,m=a.dataset.jos_stagger_delay||e,p=a.dataset.jos_stagger_seq||0,j=a.dataset.jos_stagger_duration||o,u=a.dataset.jos_stagger_once||i,h=a.dataset.jos_staggerinverse||n,_=a.dataset.jos_stagger_mirror||n,g=a.dataset.jos_stagger_startVisible,y=a.dataset.jos_stagger_scrolldirection||r,b=a.dataset.jos_stagger_rootmargin||l;if(a.dataset.jos_stagger_anchor||d.dataset.jos_anchor){const t="true"===a.dataset.jos_stagger_anchor?"#"+a.id:a.dataset.jos_stagger_anchor;d.setAttribute("data-jos_anchor",t)}d.setAttribute("data-jos_animation",f),h&&d.setAttribute("data-jos_animationinverse",h),d.setAttribute("data-jos_duration",j),d.setAttribute("data-jos_delay",parseFloat(m)+p*c),d.setAttribute("data-jos_once",u),"false"===_&&d.setAttribute("data-jos_mirror","false"),g&&t.push(d),y&&d.setAttribute("data-jos_scrolldirection",y),b&&d.setAttribute("data-jos_rootmargin",b),a.dataset.jos_stagger_scroll&&d.setAttribute("data-jos_scroll",a.dataset.jos_stagger_scroll),a.dataset.jos_stagger_timingFunction&&d.setAttribute("data-jos_timingFunction",a.dataset.jos_stagger_timingFunction),a.dataset.jos_stagger_invoke&&d.setAttribute("data-jos_invoke",a.dataset.jos_stagger_invoke),a.dataset.jos_stagger_invoke_out&&d.setAttribute("data-jos_invoke_out",a.dataset.jos_stagger_invoke_out),this.boxes=[...this.boxes,d],s(d)}})),!a.dataset.jos_animation)return void a.classList.remove("jos")}a.setAttribute("data-jos_animation",o),i&&a.setAttribute("data-jos_animationinverse",i),n&&a.setAttribute("data-jos_timingFunction",n),"false"==d&&a.setAttribute("data-jos_mirror",d),r&&(a.setAttribute("data-jos_duration",r),this.setRange.add(parseFloat(r))),l&&(a.setAttribute("data-jos_delay",l),this.setRange.add(parseFloat(l))),a.setAttribute("data-jos_counter","0"),a.classList.add("jos-"+o),(a.dataset.jos_startvisible||this.default_startVisible)&&t.push(a),this.default_scrolldirection&&a.setAttribute("data-jos_scrolldirection",this.default_scrolldirection);let c={rootMargin:[a.dataset.jos_rootmargin_top||this.default_rootMargin.split(" ")[0],a.dataset.jos_rootmargin_right||this.default_rootMargin.split(" ")[1],a.dataset.jos_rootmargin_bottom||this.default_rootMargin.split(" ")[2],a.dataset.jos_rootmargin_left||this.default_rootMargin.split(" ")[3]].map((t=>t.startsWith("-")?t.substring(1):`-${t}`)).join(" "),threshold:this.default_threshold,passive:this.default_passive};if(a.dataset.jos_anchor){const t=new IntersectionObserver(this.callbackRouter_anchor,c);this.observers.push(t),t.observe(document.getElementById(a.dataset.jos_anchor.substring(1)))}else{const t=new IntersectionObserver(this.callbackRouter,c);this.observers.push(t),t.observe(a)}};this.boxes.forEach((t=>{s(t)})),setTimeout((()=>{t.forEach((t=>{let s=t.dataset.jos_startvisible;setTimeout((()=>{"true"==s&&(s=0),t.classList.remove("jos-"+t.dataset.jos_animation)}),s||this.default_startVisible)}))}),100)}animationUnset(t=0){-1!=t&&this.boxes?.forEach((s=>{s.classList.remove("jos"),s.classList.add("jos_disabled"),0==t?s.classList.add("jos-"+s.dataset.jos_animation):s.classList.remove("jos-"+s.dataset.jos_animation)})),this.observers?.forEach((t=>t.disconnect()))}getStylesheet(){const t=document.createElement("style");document.head.appendChild(t);const s=t.sheet;s.insertRule(".jos-no-mirror { transition: 0s forwards !important;}");let a="all "+this.default_duration+"s "+this.default_timingFunction+" "+this.default_delay+"s ;";s.insertRule(".jos {transition: "+a+";}");for(const t of this.setRange)s.insertRule(`[data-jos_duration="${t}"] {\n transition-duration: ${t}s !important;\n }`),s.insertRule(`[data-jos_delay="${t}"] {\n transition-delay: ${t}s !important;\n }`);this.jos_stylesheet=s}getBoxes(){return this.boxes=void 0,this.boxes||(this.boxes=document.querySelectorAll(".jos")),this.boxes}getDefault(t={}){let{once:s,animation:a,animationinverse:e,timingFunction:o,threshold:i,startVisible:n,scrollDirection:r,intersectionRatio:l,duration:d,mirror:c,delay:f,debugMode:m,disable:p,scrollProgressDisable:j,rootMargin:u,rootMarginTop:h,rootMarginBottom:_}=t;this.default_once=s||this.default_once,this.default_animation=a||this.default_animation,this.default_animationinverse=e||this.default_animation,this.default_timingFunction=o||this.default_timingFunction,this.default_threshold=i||this.default_threshold,this.default_startVisible=n||this.default_startVisible,this.default_scrolldirection=r||this.default_scrolldirection,this.default_intersectionRatio=l||this.default_threshold,this.default_duration=d||this.default_duration,this.default_delay=f||this.default_delay,this.debugMode=m||this.debugMode,null!=p&&(this.disable=p),this.scrollProgressDisable=j||this.scrollProgressDisable,this.default_rootMargin=u||`${h||"-10%"} 0% ${_||"-40%"} 0%`,this.default_mirror=c||this.default_mirror}init(t=this.options){this.options=t,this.getDefault(t),this.disable||(this.getBoxes(),this.debugMode&&this.debugger(),this.start(),this.getStylesheet())}start(t=0){return-1!=t&&(this.stop(),this.animationInit()),this.disable=!1,"Started"}stop(t=0){return 1==t?t=0:0==t&&(t=1),this.disable=!0,-1!=t&&this.animationUnset(t),"Stopped"}refresh(){return this.animationUnset(-1),this.boxes=void 0,this.getBoxes(),this.animationInit(),this.debugger(1),"Refreshed"}destroy(t=0){this.animationUnset(-1),this.boxes=void 0,this.observers=[],1==t&&(this.jos_stylesheet.disabled=!0),this.jos_stylesheet=void 0;for(let t in this)this.hasOwnProperty(t)&&"function"!=typeof this[t]&&(this[t]=void 0);return Object.setPrototypeOf(this,null),"JOS Instance Nuked"}}const JOS=new jos;"undefined"!=typeof module&&void 0!==module.exports?module.exports=JOS:"function"==typeof define&&define.amd?define([],(function(){return JOS})):window.JOS=JOS})); +!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";!function(t,s){void 0===s&&(s={});var a=s.insertAt;if(t&&"undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===a&&e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.styleSheet?o.styleSheet.cssText=t:o.appendChild(document.createTextNode(t))}}(".jos,.jos-anchor{transition:all .4s ease-in-out}.jos-anchor{opacity:0;transition-timing-function:ease-in-out}.jos-static{opacity:1;transform:translate(0)}.jos-no-transition{transition-duration:0s;transition-timing-function:linear}.jos-hidden{display:none}.jos-visible{display:block;opacity:1}.jos-fade{opacity:0}.jos-fade-right{opacity:0;transform:translateX(-100px)}.jos-fade-left{opacity:0;transform:translateX(100px)}.jos-fade-up{opacity:0;transform:translateY(50px)}.jos-fade-down{opacity:0;transform:translateY(-50px)}.jos-fade-right-up{opacity:0;transform:translateX(-100px) translateY(50px)}.jos-fade-right-down{opacity:0;transform:translateX(-100px) translateY(-50px)}.jos-fade-left-up{opacity:0;transform:translateX(100px) translateY(50px)}.jos-fade-left-down{opacity:0;transform:translateX(100px) translateY(-50px)}.jos-slide,.jos-slide-right{transform:translateX(-100px)}.jos-slide-left{transform:translateX(100px)}.jos-slide-up{transform:translateY(100px)}.jos-slide-down{transform:translateY(-100px)}.jos-slide-right-up{transform:translateX(-100px) translateY(100px)}.jos-slide-right-down{transform:translateX(-100px) translateY(-100px)}.jos-slide-left-up{transform:translateX(100px) translateY(100px)}.jos-slide-left-down{transform:translateX(100px) translateY(-100px)}.jos-zoom,.jos-zoom-out{opacity:0;transform:scale(.8)}.jos-zoom-out-right,.jos-zoom-right{opacity:0;transform:scale(.8) translate3d(-100px,0,-100px)}.jos-zoom-left,.jos-zoom-out-left{opacity:0;transform:scale(.8) translate3d(100px,0,-100px)}.jos-zoom-down,.jos-zoom-out-down{opacity:0;transform:scale(.8) translate3d(0,-100px,0)}.jos-zoom-out-up,.jos-zoom-up{opacity:0;transform:scale(.8) translate3d(0,100px,0)}.jos-grow{transform:scale(0)}.jos-grow-right{transform:scale(0) translate3d(-100px,0,-100px)}.jos-grow-left{transform:scale(0) translate3d(100px,0,-100px)}.jos-grow-down{transform:scale(0) translate3d(0,-100px,0)}.jos-grow-up{transform:scale(0) translate3d(0,100px,0)}.jos-zoom-in{opacity:0;transform:scale(1.1)}.jos-zoom-in-down{opacity:0;transform:scale(1.1) translate3d(0,-100px,0)}.jos-zoom-in-up{opacity:0;transform:scale(1.1) translate3d(0,100px,0)}.jos-zoom-in-right{opacity:0;transform:scale(1.1) translate3d(-100px,0,-100px)}.jos-zoom-in-left{opacity:0;transform:scale(1.1) translate3d(100px,0,-100px)}.jos-shrink{transform:scale(1.4)}.jos-shrink-right{transform:scale(1.4) translate3d(-100px,0,-100px)}.jos-shrink-left{transform:scale(1.4) translate3d(100px,0,-100px)}.jos-shrink-down{transform:scale(1.4) translate3d(0,-100px,0)}.jos-shrink-up{transform:scale(1.4) translate3d(0,100px,0)}.jos-flip,.jos-flip-right{opacity:0;transform:perspective(2500px) rotateY(-100deg)}.jos-flip-left{opacity:0;transform:perspective(2500px) rotateY(100deg)}.jos-flip-up{opacity:0;transform:perspective(2500px) rotateX(-100deg)}.jos-flip-down{opacity:0;transform:perspective(2500px) rotateX(100deg)}.jos-rotate,.jos-rotate-right{opacity:0;transform:rotate(-180deg)}.jos-rotate-left{opacity:0;transform:rotate(180deg)}.jos-spin,.jos-spin-right{opacity:0;transform:rotate(-180deg) scale(0)}.jos-spin-left{opacity:0;transform:rotate(180deg) scale(0)}.jos-revolve,.jos-revolve-right{opacity:0;transform:rotate(-1turn) scale(0)}.jos-revolve-left{opacity:0;transform:rotate(1turn) scale(0)}.jos-stretch{opacity:0;transform:scaleX(0)}.jos-stretch-vertical{opacity:0;transform:scaleY(0)}.jos-skew{opacity:0;transform:skew(20deg,20deg)}.jos-skew-right{opacity:0;transform:skew(20deg,20deg) translate3d(-100px,0,-100px)}.jos-skew-left{opacity:0;transform:skew(20deg,20deg) translate3d(100px,0,-100px)}.jos-skew-down{opacity:0;transform:skew(20deg,20deg) translate3d(0,-100px,0)}.jos-skew-up{opacity:0;transform:skew(20deg,20deg) translate3d(0,100px,0)}.jos-slant{transform:skew(25deg,25deg)}.jos-slant-right{transform:skew(25deg,0deg)}.jos-slant-left{transform:skew(0deg,25deg)}.jos-bar,.jos-bar_vertical{transform:perspective(2500px) rotateY(-100deg)}.jos-bar_horizontal{transform:perspective(2500px) rotateX(-100deg)}.jos-grey{filter:grayscale(100%)}.jos-blur{filter:blur(7px)}.jos-backdrop{backdrop-filter:blur(7px);opacity:.8}.jos-invert{filter:invert(100%)}.jos-sepia{filter:sepia(100%)}.jos-saturate{filter:saturate(100%)}.jos-hue-rotate{filter:hue-rotate(90deg)}.jos-brightness{filter:brightness(.5)}[data-jos_timing_function=ease]{transition-timing-function:ease!important}[data-jos_timing_function=ease-in]{transition-timing-function:ease-in!important}[data-jos_timing_function=ease-out]{transition-timing-function:ease-out!important}[data-jos_timing_function=ease-in-out]{transition-timing-function:ease-in-out!important}[data-jos_timing_function=linear]{transition-timing-function:linear!important}[data-jos_timing_function=step-start]{transition-timing-function:step-start!important}[data-jos_timing_function=step-end]{transition-timing-function:step-end!important}[data-jos_timing_function=steps]{transition-timing-function:steps(5)!important}[data-jos_timing_function=frames]{transition-timing-function:frames(5)!important}.jos-slide-horizontal-play,.jos-slide-play{animation:jos-slide-play .7s ease-in-out infinite;animation-direction:alternate-reverse;transition:1s}@keyframes jos-slide-play{0%{transform:translateX(-100px)}to{transform:translateX(100px)}}.jos-slide-vertical-play{animation:jos-slide-vertical-play .7s ease-in-out infinite;animation-direction:alternate-reverse}@keyframes jos-slide-vertical-play{0%{transform:translateY(-100px)}to{transform:translateY(100px)}}.jos-pulse-play,.jos-zoom-in-play{animation:jos-zoom-in-play 1s infinite;animation-direction:alternate}@keyframes jos-zoom-in-play{0%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(.8)}}.jos-pulse-out-play,.jos-zoom-out-play,.jos-zoom-play{animation:jos-zoom-play .5s linear infinite;animation-direction:alternate}@keyframes jos-zoom-play{0%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1.1)}}.jos-flip-play{animation:jos-flip-play .7s infinite;animation-direction:alternate}@keyframes jos-flip-play{0%{transform:rotateY(0deg)}to{transform:rotateY(180deg)}}.jos-rotate-play{animation:jos-rotate-play 1s linear infinite forwards;animation-direction:alternate-reverse;border-radius:0}@keyframes jos-rotate-play{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.jos-spin-play{animation:jos-spin-play 1.5s infinite;animation-direction:alternate}@keyframes jos-spin-play{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(1turn)}}.jos-revolve-play{animation:jos-revolve-play 1.5s infinite;animation-direction:alternate}@keyframes jos-revolve-play{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.jos-grow-play,.jos-shrink-play{animation:jos-grow-play 1s infinite;animation-direction:alternate}@keyframes jos-grow-play{0%{transform:scale(0)}to{transform:scale(1)}}.jos-shrink-play{animation-direction:alternate-reverse}.jos-stretch-play{animation:jos-stretch-play .7s infinite;animation-direction:alternate}@keyframes jos-stretch-play{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.jos-stretch-vertical-play{animation:jos-stretch-vertical-play .7s infinite;animation-direction:alternate-reverse}@keyframes jos-stretch-vertical-play{0%{transform:scaleY(1)}to{transform:scaleY(0)}}.jos-fade-play{animation:jos-fade-play .8s infinite;animation-direction:alternate}@keyframes jos-fade-play{0%{opacity:0}to{opacity:1}}.jos-fade-horizontal-play{animation:jos-fade-horizontal-play 1s infinite;animation-direction:alternate-reverse}@keyframes jos-fade-horizontal-play{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(-100px)}}.jos-fade-vertical-play{animation:jos-fade-vertical-play 1s infinite;animation-direction:alternate-reverse}@keyframes jos-fade-vertical-play{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(-100px)}}.jos-blink-play{animation:jos-blink-play 1s step-end infinite}@keyframes jos-blink-play{0%{opacity:1}50%{opacity:0}}");class jos{default_once=!1;default_animation="fade";default_animationinverse=void 0;default_timingFunction="ease-in-out";default_threshold=0;default_duration=.4;default_delay=0;default_intersectionRatio=0;default_rootMargin="-10% 0% -40% 0%";default_startVisible=void 0;default_scrolldirection=void 0;default_passive=!0;default_mirror=void 0;setRange=new Set;debug=!1;scrollProgressDisable=void 0;disable=!1;static version="0.9.1";static author="Jesvi Jonathan";static webpage="https://jos-animation.vercel.app";static github="https://github.com/jesvijonathan/JOS-Animation-Library";options={};jos_stylesheet=void 0;boxes=void 0;observers=[];scrollEnter=[];constructor(){}version(){console.log(`JOS: Javascript On Scroll Animation Library\n - Version: ${jos.version}\n - Author: ${jos.author}\n - Webpage: ${jos.webpage}\n - Github: ${jos.github}\n`)}debugger(t=0){0==t&&this.debugMode&&(this.version(),console.log(`JOS Settings:\n - animation: ${this.default_animation}\n - once: ${this.default_once}\n - animationinverse: ${this.default_animationinverse}\n - timingFunction: ${this.default_timingFunction}\n - duration: ${this.default_duration}\n - delay: ${this.default_delay}\n - threshold: ${this.default_threshold}\n - startVisible: ${this.default_startVisible}\n - scrolldirection: ${this.default_scrolldirection}\n - intersectionRatio: ${this.default_intersectionRatio}\n - rootMargin: ${this.default_rootMargin}\n - disable: ${this.disable}\n - debugMode: ${this.debugMode}\n`)),console.log("JOS Initialized:\n\n"),1!=t&&0!=t||!this.debugMode||console.log(this.boxes||"No Elements Found")}callbackRouter_anchor=(t,s)=>{if(this.disable)return;let a=t[0],e=a.target;document.querySelectorAll("[data-jos_anchor='#"+e.id+"']").forEach((t=>{let e=t.dataset.jos_animation,o=t.dataset.jos_animationinverse;if(a.isIntersecting){if(null!=t.dataset.jos_counter){let s=parseInt(t.dataset.jos_counter);s++,t.dataset.jos_counter=s}e&&(t.classList.remove("jos-"+e),null!=t.dataset.jos_invoke&&window[t.dataset.jos_invoke](t),null==t.dataset.jos_once&&"false"==t.dataset.jos_once||("true"==t.dataset.jos_once||t.dataset.jos_counter>=t.dataset.jos_once)&&s.unobserve(t),null!=o&&t.classList.add("jos-"+o))}else void 0!==t.dataset.jos_scrolldirection&&"down"!==t.dataset.jos_scrolldirection&&"none"!==t.dataset.jos_scrolldirection||(t.classList.add("jos-"+e),void 0!==t.dataset.jos_invoke_out&&window[t.dataset.jos_invoke_out](t))}))};callbackScroller=t=>{if(this.disable||this.scrollProgressDisable)return;const s=this.default_rootMargin;let a=window.innerHeight;const e=t=>{const e=t.dataset.jos_rootmargin||s,o=e.split(" ").map(parseFloat),i=a*o[0]/100,n=a*o[2]/100;t.jos={rootMargin:e,rootMarginValues:o,topMargin:i,bottomMargin:n};const r=t.getBoundingClientRect(),l=r.top-t.jos.topMargin,d=r.bottom-t.jos.bottomMargin,c=r.top/a,f=l/(a-t.jos.topMargin-t.jos.bottomMargin);let m=0;m=f<=0?0:f>=100?1:f,t.jos={elementRect:r,elementTop:l,elementBottom:d,windowScrollProgress:c,rootScrollProgress:f,scrollProgress:m},window[t.dataset.jos_scroll](t)};document.onscroll=s=>{this.disable||this.scrollProgressDisable||t.forEach(e)}};callbackRouter=(t,s,a=1)=>{if(this.disable)return;let e=t[0],o=e.target,i=o.dataset.jos_animation,n=o.dataset.jos_animationinverse,r=1;if(r=e.boundingClientRect.top<0?0:1,e.isIntersecting){if("false"!=o.dataset.jos_scroll&&null!=o.dataset.jos_scroll&&(this.scrollEnter.push(o),this.callbackScroller(this.scrollEnter)),null!=o.dataset.jos_counter){let t=parseInt(o.dataset.jos_counter);t++,o.dataset.jos_counter=t}"false"==o.dataset.jos_mirror&&o.classList.remove("jos-no-mirror"),i&&(o.classList.remove("jos-"+i),null!=o.dataset.jos_invoke&&window[o.dataset.jos_invoke](o),null==o.dataset.jos_once&&"false"==o.dataset.jos_once||("true"==o.dataset.jos_once||o.dataset.jos_counter>=o.dataset.jos_once)&&s.unobserve(o)),null!=n&&o.classList.add("jos-"+n)}else(void 0===o.dataset.jos_scrolldirection||1===r&&"down"===o.dataset.jos_scrolldirection||0===r&&"up"===o.dataset.jos_scrolldirection||"none"===o.dataset.jos_scrolldirection)&&(o.classList.toggle("jos-no-mirror","false"==o.dataset.jos_mirror),o.classList.add("jos-"+i),null!=n&&o.classList.remove("jos-"+n),void 0!==o.dataset.jos_invoke_out&&window[o.dataset.jos_invoke_out](o)),"false"!=o.dataset.jos_scroll&&null!=o.dataset.jos_scroll&&(this.scrollEnter=this.scrollEnter.filter((t=>t.id!==o.id)),this.callbackScroller(this.scrollEnter))};animationInit(){let t=[],s=a=>{let e=a.dataset.jos_once,o=a.dataset.jos_animation||this.default_animation,i=a.dataset.jos_animationinverse,n=a.dataset.jos_timingFunction,r=a.dataset.jos_duration,l=a.dataset.jos_delay,d=a.dataset.jos_mirror||this.default_mirror;if(a.classList.contains("jos_disabled")&&(a.classList.remove("jos_disabled"),a.classList.add("jos")),e&&("true"==e||/^\d+$/.test(e))?a.setAttribute("data-jos_once",e):a.setAttribute("data-jos_once",this.default_once?"1":"false"),a.dataset.jos_stagger){const e=this.default_delay,o=this.default_duration,i=this.once,n=this.mirror,r=this.scrolldirection,l=this.rootMargin;if(a.id||(a.id=Math.random().toString(36).substring(7)),Array.from(a.children).forEach(((d,c)=>{if(!d.classList.contains("jos")){d.classList.add("jos"),d.id||(d.id=`${a.id}_${c}`);const f=a.dataset.jos_stagger,m=a.dataset.jos_stagger_delay||e,p=a.dataset.jos_stagger_seq||0,j=a.dataset.jos_stagger_duration||o,u=a.dataset.jos_stagger_once||i,h=a.dataset.jos_staggerinverse||n,_=a.dataset.jos_stagger_mirror||n,g=a.dataset.jos_stagger_startVisible,y=a.dataset.jos_stagger_scrolldirection||r,b=a.dataset.jos_stagger_rootmargin||l;if(a.dataset.jos_stagger_anchor||d.dataset.jos_anchor){const t="true"===a.dataset.jos_stagger_anchor?"#"+a.id:a.dataset.jos_stagger_anchor;d.setAttribute("data-jos_anchor",t)}d.setAttribute("data-jos_animation",f),h&&d.setAttribute("data-jos_animationinverse",h),d.setAttribute("data-jos_duration",j);const v=parseFloat(p*c+m);d.setAttribute("data-jos_delay",v),d.setAttribute("data-jos_once",u),"false"===_&&d.setAttribute("data-jos_mirror","false"),g&&t.push(d),y&&d.setAttribute("data-jos_scrolldirection",y),b&&d.setAttribute("data-jos_rootmargin",b),a.dataset.jos_stagger_scroll&&d.setAttribute("data-jos_scroll",a.dataset.jos_stagger_scroll),a.dataset.jos_stagger_timingFunction&&d.setAttribute("data-jos_timingFunction",a.dataset.jos_stagger_timingFunction),a.dataset.jos_stagger_invoke&&d.setAttribute("data-jos_invoke",a.dataset.jos_stagger_invoke),a.dataset.jos_stagger_invoke_out&&d.setAttribute("data-jos_invoke_out",a.dataset.jos_stagger_invoke_out),this.boxes=[...this.boxes,d],s(d)}})),!a.dataset.jos_animation)return void a.classList.remove("jos")}a.setAttribute("data-jos_animation",o),i&&a.setAttribute("data-jos_animationinverse",i),n&&a.setAttribute("data-jos_timingFunction",n),"false"==d&&a.setAttribute("data-jos_mirror",d),r&&(a.setAttribute("data-jos_duration",r),this.setRange.add(parseFloat(r))),l&&(a.setAttribute("data-jos_delay",l),this.setRange.add(parseFloat(l))),a.setAttribute("data-jos_counter","0"),a.classList.add("jos-"+o),(a.dataset.jos_startvisible||this.default_startVisible)&&t.push(a),this.default_scrolldirection&&a.setAttribute("data-jos_scrolldirection",this.default_scrolldirection);let c={rootMargin:[a.dataset.jos_rootmargin_top||this.default_rootMargin.split(" ")[0],a.dataset.jos_rootmargin_right||this.default_rootMargin.split(" ")[1],a.dataset.jos_rootmargin_bottom||this.default_rootMargin.split(" ")[2],a.dataset.jos_rootmargin_left||this.default_rootMargin.split(" ")[3]].map((t=>t.startsWith("-")?t.substring(1):`-${t}`)).join(" "),threshold:this.default_threshold,passive:this.default_passive};if(a.dataset.jos_anchor){const t=new IntersectionObserver(this.callbackRouter_anchor,c);this.observers.push(t),t.observe(document.getElementById(a.dataset.jos_anchor.substring(1)))}else{const t=new IntersectionObserver(this.callbackRouter,c);this.observers.push(t),t.observe(a)}};this.boxes.forEach((t=>{s(t)})),setTimeout((()=>{t.forEach((t=>{let s=t.dataset.jos_startvisible;setTimeout((()=>{"true"==s&&(s=0),t.classList.remove("jos-"+t.dataset.jos_animation)}),s||this.default_startVisible)}))}),100)}animationUnset(t=0){-1!=t&&this.boxes?.forEach((s=>{s.classList.remove("jos"),s.classList.add("jos_disabled"),0==t?s.classList.add("jos-"+s.dataset.jos_animation):s.classList.remove("jos-"+s.dataset.jos_animation)})),this.observers?.forEach((t=>t.disconnect()))}getStylesheet(){const t=document.createElement("style");document.head.appendChild(t);const s=t.sheet;s.insertRule(".jos-no-mirror { transition: 0s forwards !important;}");let a="all "+this.default_duration+"s "+this.default_timingFunction+" "+this.default_delay+"s ;";s.insertRule(".jos {transition: "+a+";}");for(const t of this.setRange)s.insertRule(`[data-jos_duration="${t}"] {\n transition-duration: ${t}s !important;\n }`),s.insertRule(`[data-jos_delay="${t}"] {\n transition-delay: ${t}s !important;\n }`);this.jos_stylesheet=s}getBoxes(){return this.boxes=void 0,this.boxes||(this.boxes=document.querySelectorAll(".jos")),this.boxes}getDefault(t={}){let{once:s,animation:a,animationinverse:e,timingFunction:o,threshold:i,startVisible:n,scrollDirection:r,intersectionRatio:l,duration:d,mirror:c,delay:f,debugMode:m,disable:p,scrollProgressDisable:j,rootMargin:u,rootMarginTop:h,rootMarginBottom:_}=t;this.default_once=s||this.default_once,this.default_animation=a||this.default_animation,this.default_animationinverse=e||this.default_animation,this.default_timingFunction=o||this.default_timingFunction,this.default_threshold=i||this.default_threshold,this.default_startVisible=n||this.default_startVisible,this.default_scrolldirection=r||this.default_scrolldirection,this.default_intersectionRatio=l||this.default_threshold,this.default_duration=d||this.default_duration,this.default_delay=f||this.default_delay,this.debugMode=m||this.debugMode,null!=p&&(this.disable=p),this.scrollProgressDisable=j||this.scrollProgressDisable,this.default_rootMargin=u||`${h||"-10%"} 0% ${_||"-40%"} 0%`,this.default_mirror=c||this.default_mirror}init(t=this.options){this.options=t,this.getDefault(t),this.disable||(this.getBoxes(),this.debugMode&&this.debugger(),this.start(),this.getStylesheet())}start(t=0){return-1!=t&&(this.stop(),this.animationInit()),this.disable=!1,"Started"}stop(t=0){return 1==t?t=0:0==t&&(t=1),this.disable=!0,-1!=t&&this.animationUnset(t),"Stopped"}refresh(){return this.animationUnset(-1),this.boxes=void 0,this.getBoxes(),this.animationInit(),this.debugger(1),"Refreshed"}destroy(t=0){this.animationUnset(-1),this.boxes=void 0,this.observers=[],1==t&&(this.jos_stylesheet.disabled=!0),this.jos_stylesheet=void 0;for(let t in this)this.hasOwnProperty(t)&&"function"!=typeof this[t]&&(this[t]=void 0);return Object.setPrototypeOf(this,null),"JOS Instance Nuked"}}const JOS=new jos;"undefined"!=typeof module&&void 0!==module.exports?module.exports=JOS:"function"==typeof define&&define.amd?define([],(function(){return JOS})):window.JOS=JOS})); diff --git a/dist/jos.min.js b/dist/jos.min.js index 5fd3730..f3c4ba5 100644 --- a/dist/jos.min.js +++ b/dist/jos.min.js @@ -1 +1 @@ -!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";!function(t,s){void 0===s&&(s={});var e=s.insertAt;if(t&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===e&&o.firstChild?o.insertBefore(a,o.firstChild):o.appendChild(a),a.styleSheet?a.styleSheet.cssText=t:a.appendChild(document.createTextNode(t))}}(".jos,.jos-anchor{transition:all .4s ease-in-out}.jos-anchor{opacity:0;transition-timing-function:ease-in-out}.jos-static{opacity:1;transform:translate(0)}.jos-no-transition{transition-duration:0s;transition-timing-function:linear}.jos-hidden{display:none}.jos-visible{display:block;opacity:1}.jos-fade{opacity:0}.jos-fade-right{opacity:0;transform:translateX(-100px)}.jos-fade-left{opacity:0;transform:translateX(100px)}.jos-fade-up{opacity:0;transform:translateY(50px)}.jos-fade-down{opacity:0;transform:translateY(-50px)}.jos-fade-right-up{opacity:0;transform:translateX(-100px) translateY(50px)}.jos-fade-right-down{opacity:0;transform:translateX(-100px) translateY(-50px)}.jos-fade-left-up{opacity:0;transform:translateX(100px) translateY(50px)}.jos-fade-left-down{opacity:0;transform:translateX(100px) translateY(-50px)}.jos-slide,.jos-slide-right{transform:translateX(-100px)}.jos-slide-left{transform:translateX(100px)}.jos-slide-up{transform:translateY(100px)}.jos-slide-down{transform:translateY(-100px)}.jos-slide-right-up{transform:translateX(-100px) translateY(100px)}.jos-slide-right-down{transform:translateX(-100px) translateY(-100px)}.jos-slide-left-up{transform:translateX(100px) translateY(100px)}.jos-slide-left-down{transform:translateX(100px) translateY(-100px)}.jos-zoom,.jos-zoom-out{opacity:0;transform:scale(.8)}.jos-zoom-out-right,.jos-zoom-right{opacity:0;transform:scale(.8) translate3d(-100px,0,-100px)}.jos-zoom-left,.jos-zoom-out-left{opacity:0;transform:scale(.8) translate3d(100px,0,-100px)}.jos-zoom-down,.jos-zoom-out-down{opacity:0;transform:scale(.8) translate3d(0,-100px,0)}.jos-zoom-out-up,.jos-zoom-up{opacity:0;transform:scale(.8) translate3d(0,100px,0)}.jos-grow{transform:scale(0)}.jos-grow-right{transform:scale(0) translate3d(-100px,0,-100px)}.jos-grow-left{transform:scale(0) translate3d(100px,0,-100px)}.jos-grow-down{transform:scale(0) translate3d(0,-100px,0)}.jos-grow-up{transform:scale(0) translate3d(0,100px,0)}.jos-zoom-in{opacity:0;transform:scale(1.1)}.jos-zoom-in-down{opacity:0;transform:scale(1.1) translate3d(0,-100px,0)}.jos-zoom-in-up{opacity:0;transform:scale(1.1) translate3d(0,100px,0)}.jos-zoom-in-right{opacity:0;transform:scale(1.1) translate3d(-100px,0,-100px)}.jos-zoom-in-left{opacity:0;transform:scale(1.1) translate3d(100px,0,-100px)}.jos-shrink{transform:scale(1.4)}.jos-shrink-right{transform:scale(1.4) translate3d(-100px,0,-100px)}.jos-shrink-left{transform:scale(1.4) translate3d(100px,0,-100px)}.jos-shrink-down{transform:scale(1.4) translate3d(0,-100px,0)}.jos-shrink-up{transform:scale(1.4) translate3d(0,100px,0)}.jos-flip,.jos-flip-right{opacity:0;transform:perspective(2500px) rotateY(-100deg)}.jos-flip-left{opacity:0;transform:perspective(2500px) rotateY(100deg)}.jos-flip-up{opacity:0;transform:perspective(2500px) rotateX(-100deg)}.jos-flip-down{opacity:0;transform:perspective(2500px) rotateX(100deg)}.jos-rotate,.jos-rotate-right{opacity:0;transform:rotate(-180deg)}.jos-rotate-left{opacity:0;transform:rotate(180deg)}.jos-spin,.jos-spin-right{opacity:0;transform:rotate(-180deg) scale(0)}.jos-spin-left{opacity:0;transform:rotate(180deg) scale(0)}.jos-revolve,.jos-revolve-right{opacity:0;transform:rotate(-1turn) scale(0)}.jos-revolve-left{opacity:0;transform:rotate(1turn) scale(0)}.jos-stretch{opacity:0;transform:scaleX(0)}.jos-stretch-vertical{opacity:0;transform:scaleY(0)}.jos-skew{opacity:0;transform:skew(20deg,20deg)}.jos-skew-right{opacity:0;transform:skew(20deg,20deg) translate3d(-100px,0,-100px)}.jos-skew-left{opacity:0;transform:skew(20deg,20deg) translate3d(100px,0,-100px)}.jos-skew-down{opacity:0;transform:skew(20deg,20deg) translate3d(0,-100px,0)}.jos-skew-up{opacity:0;transform:skew(20deg,20deg) translate3d(0,100px,0)}.jos-slant{transform:skew(25deg,25deg)}.jos-slant-right{transform:skew(25deg,0deg)}.jos-slant-left{transform:skew(0deg,25deg)}.jos-bar,.jos-bar_vertical{transform:perspective(2500px) rotateY(-100deg)}.jos-bar_horizontal{transform:perspective(2500px) rotateX(-100deg)}.jos-grey{filter:grayscale(100%)}.jos-blur{filter:blur(7px)}.jos-backdrop{backdrop-filter:blur(7px);opacity:.8}.jos-invert{filter:invert(100%)}.jos-sepia{filter:sepia(100%)}.jos-saturate{filter:saturate(100%)}.jos-hue-rotate{filter:hue-rotate(90deg)}.jos-brightness{filter:brightness(.5)}[data-jos_timing_function=ease]{transition-timing-function:ease!important}[data-jos_timing_function=ease-in]{transition-timing-function:ease-in!important}[data-jos_timing_function=ease-out]{transition-timing-function:ease-out!important}[data-jos_timing_function=ease-in-out]{transition-timing-function:ease-in-out!important}[data-jos_timing_function=linear]{transition-timing-function:linear!important}[data-jos_timing_function=step-start]{transition-timing-function:step-start!important}[data-jos_timing_function=step-end]{transition-timing-function:step-end!important}[data-jos_timing_function=steps]{transition-timing-function:steps(5)!important}[data-jos_timing_function=frames]{transition-timing-function:frames(5)!important}");const t=new class{default_once=!1;default_animation="fade";default_animationinverse=void 0;default_timingFunction="ease-in-out";default_threshold=0;default_duration=.4;default_delay=0;default_intersectionRatio=0;default_rootMargin="-10% 0% -40% 0%";default_startVisible=void 0;default_scrolldirection=void 0;default_passive=!0;default_mirror=void 0;setRange=new Set;debug=!1;scrollProgressDisable=void 0;disable=!1;static version="0.9.1 (Minified)";static github="https://github.com/jesvijonathan/JOS-Animation-Library";options={};jos_stylesheet=void 0;boxes=void 0;observers=[];scrollEnter=[];constructor(){}version(){}debugger(t=0){if(0==t&&this.debugMode){this.version();for(const[t,s]of Object.entries(this));}(1==t||0==t)&&this.debugMode}callbackRouter_anchor=(t,s)=>{if(this.disable)return;let e=t[0],o=e.target;document.querySelectorAll("[data-jos_anchor='#"+o.id+"']").forEach((t=>{let o=t.dataset.jos_animation,a=t.dataset.jos_animationinverse;if(e.isIntersecting){if(null!=t.dataset.jos_counter){let s=parseInt(t.dataset.jos_counter);s++,t.dataset.jos_counter=s}o&&(t.classList.remove("jos-"+o),null!=t.dataset.jos_invoke&&window[t.dataset.jos_invoke](t),null==t.dataset.jos_once&&"false"==t.dataset.jos_once||("true"==t.dataset.jos_once||t.dataset.jos_counter>=t.dataset.jos_once)&&s.unobserve(t),null!=a&&t.classList.add("jos-"+a))}else void 0!==t.dataset.jos_scrolldirection&&"down"!==t.dataset.jos_scrolldirection&&"none"!==t.dataset.jos_scrolldirection||(t.classList.add("jos-"+o),void 0!==t.dataset.jos_invoke_out&&window[t.dataset.jos_invoke_out](t))}))};callbackScroller=t=>{if(this.disable||this.scrollProgressDisable)return;const s=this.default_rootMargin;let e=window.innerHeight;const o=t=>{const o=t.dataset.jos_rootmargin||s,a=o.split(" ").map(parseFloat),i=e*a[0]/100,r=e*a[2]/100;t.jos={rootMargin:o,rootMarginValues:a,topMargin:i,bottomMargin:r};const n=t.getBoundingClientRect(),l=n.top-t.jos.topMargin,d=n.bottom-t.jos.bottomMargin,c=n.top/e,u=l/(e-t.jos.topMargin-t.jos.bottomMargin);let f=0;f=u<=0?0:u>=100?1:u,t.jos={elementRect:n,elementTop:l,elementBottom:d,windowScrollProgress:c,rootScrollProgress:u,scrollProgress:f},window[t.dataset.jos_scroll](t)};document.onscroll=s=>{this.disable||this.scrollProgressDisable||t.forEach(o)}};callbackRouter=(t,s,e=1)=>{if(this.disable)return;let o=t[0],a=o.target,i=a.dataset.jos_animation,r=a.dataset.jos_animationinverse,n=1;if(n=o.boundingClientRect.top<0?0:1,o.isIntersecting){if("false"!=a.dataset.jos_scroll&&null!=a.dataset.jos_scroll&&(this.scrollEnter.push(a),this.callbackScroller(this.scrollEnter)),null!=a.dataset.jos_counter){let t=parseInt(a.dataset.jos_counter);t++,a.dataset.jos_counter=t}"false"==a.dataset.jos_mirror&&a.classList.remove("jos-no-mirror"),i&&(a.classList.remove("jos-"+i),null!=a.dataset.jos_invoke&&window[a.dataset.jos_invoke](a),null==a.dataset.jos_once&&"false"==a.dataset.jos_once||("true"==a.dataset.jos_once||a.dataset.jos_counter>=a.dataset.jos_once)&&s.unobserve(a)),null!=r&&a.classList.add("jos-"+r)}else(void 0===a.dataset.jos_scrolldirection||1===n&&"down"===a.dataset.jos_scrolldirection||0===n&&"up"===a.dataset.jos_scrolldirection||"none"===a.dataset.jos_scrolldirection)&&(a.classList.toggle("jos-no-mirror","false"==a.dataset.jos_mirror),a.classList.add("jos-"+i),null!=r&&a.classList.remove("jos-"+r),void 0!==a.dataset.jos_invoke_out&&window[a.dataset.jos_invoke_out](a)),"false"!=a.dataset.jos_scroll&&null!=a.dataset.jos_scroll&&(this.scrollEnter=this.scrollEnter.filter((t=>t.id!==a.id)),this.callbackScroller(this.scrollEnter))};animationInit(){let t=[],s=e=>{let o=e.dataset.jos_once,a=e.dataset.jos_animation||this.default_animation,i=e.dataset.jos_animationinverse,r=e.dataset.jos_timingFunction,n=e.dataset.jos_duration,l=e.dataset.jos_delay,d=e.dataset.jos_mirror||this.default_mirror;if(e.classList.contains("jos_disabled")&&(e.classList.remove("jos_disabled"),e.classList.add("jos")),o&&("true"==o||/^\d+$/.test(o))?e.setAttribute("data-jos_once",o):e.setAttribute("data-jos_once",this.default_once?"1":"false"),e.dataset.jos_stagger){const o=this.default_delay,a=this.default_duration,i=this.once,r=this.mirror,n=this.scrolldirection,l=this.rootMargin;if(e.id||(e.id=Math.random().toString(36).substring(7)),Array.from(e.children).forEach(((d,c)=>{if(!d.classList.contains("jos")){d.classList.add("jos"),d.id||(d.id=`${e.id}_${c}`);const u=e.dataset.jos_stagger,f=e.dataset.jos_stagger_delay||o,j=e.dataset.jos_stagger_seq||0,_=e.dataset.jos_stagger_duration||a,m=e.dataset.jos_stagger_once||i,p=e.dataset.jos_staggerinverse||r,h=e.dataset.jos_stagger_mirror||r,g=e.dataset.jos_stagger_startVisible,b=e.dataset.jos_stagger_scrolldirection||n,v=e.dataset.jos_stagger_rootmargin||l;if(e.dataset.jos_stagger_anchor||d.dataset.jos_anchor){const t="true"===e.dataset.jos_stagger_anchor?"#"+e.id:e.dataset.jos_stagger_anchor;d.setAttribute("data-jos_anchor",t)}d.setAttribute("data-jos_animation",u),p&&d.setAttribute("data-jos_animationinverse",p),d.setAttribute("data-jos_duration",_),d.setAttribute("data-jos_delay",parseFloat(f)+j*c),d.setAttribute("data-jos_once",m),"false"===h&&d.setAttribute("data-jos_mirror","false"),g&&t.push(d),b&&d.setAttribute("data-jos_scrolldirection",b),v&&d.setAttribute("data-jos_rootmargin",v),e.dataset.jos_stagger_scroll&&d.setAttribute("data-jos_scroll",e.dataset.jos_stagger_scroll),e.dataset.jos_stagger_timingFunction&&d.setAttribute("data-jos_timingFunction",e.dataset.jos_stagger_timingFunction),e.dataset.jos_stagger_invoke&&d.setAttribute("data-jos_invoke",e.dataset.jos_stagger_invoke),e.dataset.jos_stagger_invoke_out&&d.setAttribute("data-jos_invoke_out",e.dataset.jos_stagger_invoke_out),this.boxes=[...this.boxes,d],s(d)}})),!e.dataset.jos_animation)return void e.classList.remove("jos")}e.setAttribute("data-jos_animation",a),i&&e.setAttribute("data-jos_animationinverse",i),r&&e.setAttribute("data-jos_timingFunction",r),"false"==d&&e.setAttribute("data-jos_mirror",d),n&&(e.setAttribute("data-jos_duration",n),this.setRange.add(parseFloat(n))),l&&(e.setAttribute("data-jos_delay",l),this.setRange.add(parseFloat(l))),e.setAttribute("data-jos_counter","0"),e.classList.add("jos-"+a),(e.dataset.jos_startvisible||this.default_startVisible)&&t.push(e),this.default_scrolldirection&&e.setAttribute("data-jos_scrolldirection",this.default_scrolldirection);let c={rootMargin:[e.dataset.jos_rootmargin_top||this.default_rootMargin.split(" ")[0],e.dataset.jos_rootmargin_right||this.default_rootMargin.split(" ")[1],e.dataset.jos_rootmargin_bottom||this.default_rootMargin.split(" ")[2],e.dataset.jos_rootmargin_left||this.default_rootMargin.split(" ")[3]].map((t=>t.startsWith("-")?t.substring(1):`-${t}`)).join(" "),threshold:this.default_threshold,passive:this.default_passive};if(e.dataset.jos_anchor){const t=new IntersectionObserver(this.callbackRouter_anchor,c);this.observers.push(t),t.observe(document.getElementById(e.dataset.jos_anchor.substring(1)))}else{const t=new IntersectionObserver(this.callbackRouter,c);this.observers.push(t),t.observe(e)}};this.boxes.forEach((t=>{s(t)})),setTimeout((()=>{t.forEach((t=>{let s=t.dataset.jos_startvisible;setTimeout((()=>{"true"==s&&(s=0),t.classList.remove("jos-"+t.dataset.jos_animation)}),s||this.default_startVisible)}))}),100)}animationUnset(t=0){-1!=t&&this.boxes?.forEach((s=>{s.classList.remove("jos"),s.classList.add("jos_disabled"),0==t?s.classList.add("jos-"+s.dataset.jos_animation):s.classList.remove("jos-"+s.dataset.jos_animation)})),this.observers?.forEach((t=>t.disconnect()))}getStylesheet(){const t=document.createElement("style");document.head.appendChild(t);const s=t.sheet;s.insertRule(".jos-no-mirror { transition: 0s forwards !important;}");let e="all "+this.default_duration+"s "+this.default_timingFunction+" "+this.default_delay+"s ;";s.insertRule(".jos {transition: "+e+";}");for(const t of this.setRange)s.insertRule(`[data-jos_duration="${t}"] {\n transition-duration: ${t}s !important;\n }`),s.insertRule(`[data-jos_delay="${t}"] {\n transition-delay: ${t}s !important;\n }`);this.jos_stylesheet=s}getBoxes(){return this.boxes=void 0,this.boxes||(this.boxes=document.querySelectorAll(".jos")),this.boxes}getDefault(t={}){let{once:s,animation:e,animationinverse:o,timingFunction:a,threshold:i,startVisible:r,scrollDirection:n,intersectionRatio:l,duration:d,mirror:c,delay:u,debugMode:f,disable:j,scrollProgressDisable:_,rootMargin:m,rootMarginTop:p,rootMarginBottom:h}=t;this.default_once=s||this.default_once,this.default_animation=e||this.default_animation,this.default_animationinverse=o||this.default_animation,this.default_timingFunction=a||this.default_timingFunction,this.default_threshold=i||this.default_threshold,this.default_startVisible=r||this.default_startVisible,this.default_scrolldirection=n||this.default_scrolldirection,this.default_intersectionRatio=l||this.default_threshold,this.default_duration=d||this.default_duration,this.default_delay=u||this.default_delay,this.debugMode=f||this.debugMode,null!=j&&(this.disable=j),this.scrollProgressDisable=_||this.scrollProgressDisable,this.default_rootMargin=m||`${p||"-10%"} 0% ${h||"-40%"} 0%`,this.default_mirror=c||this.default_mirror}init(t=this.options){this.options=t,this.getDefault(t),this.disable||(this.getBoxes(),this.debugMode&&this.debugger(),this.start(),this.getStylesheet())}start(t=0){return-1!=t&&(this.stop(),this.animationInit()),this.disable=!1,"Started"}stop(t=0){return 1==t?t=0:0==t&&(t=1),this.disable=!0,-1!=t&&this.animationUnset(t),"Stopped"}refresh(){return this.animationUnset(-1),this.boxes=void 0,this.getBoxes(),this.animationInit(),this.debugger(1),"Refreshed"}destroy(t=0){this.animationUnset(-1),this.boxes=void 0,this.observers=[],1==t&&(this.jos_stylesheet.disabled=!0),this.jos_stylesheet=void 0;for(let t in this)this.hasOwnProperty(t)&&"function"!=typeof this[t]&&(this[t]=void 0);return Object.setPrototypeOf(this,null),"JOS Instance Nuked"}};"undefined"!=typeof module&&void 0!==module.exports?module.exports=t:"function"==typeof define&&define.amd?define([],(function(){return t})):window.JOS=t})); +!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";!function(t,s){void 0===s&&(s={});var e=s.insertAt;if(t&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===e&&o.firstChild?o.insertBefore(a,o.firstChild):o.appendChild(a),a.styleSheet?a.styleSheet.cssText=t:a.appendChild(document.createTextNode(t))}}(".jos,.jos-anchor{transition:all .4s ease-in-out}.jos-anchor{opacity:0;transition-timing-function:ease-in-out}.jos-static{opacity:1;transform:translate(0)}.jos-no-transition{transition-duration:0s;transition-timing-function:linear}.jos-hidden{display:none}.jos-visible{display:block;opacity:1}.jos-fade{opacity:0}.jos-fade-right{opacity:0;transform:translateX(-100px)}.jos-fade-left{opacity:0;transform:translateX(100px)}.jos-fade-up{opacity:0;transform:translateY(50px)}.jos-fade-down{opacity:0;transform:translateY(-50px)}.jos-fade-right-up{opacity:0;transform:translateX(-100px) translateY(50px)}.jos-fade-right-down{opacity:0;transform:translateX(-100px) translateY(-50px)}.jos-fade-left-up{opacity:0;transform:translateX(100px) translateY(50px)}.jos-fade-left-down{opacity:0;transform:translateX(100px) translateY(-50px)}.jos-slide,.jos-slide-right{transform:translateX(-100px)}.jos-slide-left{transform:translateX(100px)}.jos-slide-up{transform:translateY(100px)}.jos-slide-down{transform:translateY(-100px)}.jos-slide-right-up{transform:translateX(-100px) translateY(100px)}.jos-slide-right-down{transform:translateX(-100px) translateY(-100px)}.jos-slide-left-up{transform:translateX(100px) translateY(100px)}.jos-slide-left-down{transform:translateX(100px) translateY(-100px)}.jos-zoom,.jos-zoom-out{opacity:0;transform:scale(.8)}.jos-zoom-out-right,.jos-zoom-right{opacity:0;transform:scale(.8) translate3d(-100px,0,-100px)}.jos-zoom-left,.jos-zoom-out-left{opacity:0;transform:scale(.8) translate3d(100px,0,-100px)}.jos-zoom-down,.jos-zoom-out-down{opacity:0;transform:scale(.8) translate3d(0,-100px,0)}.jos-zoom-out-up,.jos-zoom-up{opacity:0;transform:scale(.8) translate3d(0,100px,0)}.jos-grow{transform:scale(0)}.jos-grow-right{transform:scale(0) translate3d(-100px,0,-100px)}.jos-grow-left{transform:scale(0) translate3d(100px,0,-100px)}.jos-grow-down{transform:scale(0) translate3d(0,-100px,0)}.jos-grow-up{transform:scale(0) translate3d(0,100px,0)}.jos-zoom-in{opacity:0;transform:scale(1.1)}.jos-zoom-in-down{opacity:0;transform:scale(1.1) translate3d(0,-100px,0)}.jos-zoom-in-up{opacity:0;transform:scale(1.1) translate3d(0,100px,0)}.jos-zoom-in-right{opacity:0;transform:scale(1.1) translate3d(-100px,0,-100px)}.jos-zoom-in-left{opacity:0;transform:scale(1.1) translate3d(100px,0,-100px)}.jos-shrink{transform:scale(1.4)}.jos-shrink-right{transform:scale(1.4) translate3d(-100px,0,-100px)}.jos-shrink-left{transform:scale(1.4) translate3d(100px,0,-100px)}.jos-shrink-down{transform:scale(1.4) translate3d(0,-100px,0)}.jos-shrink-up{transform:scale(1.4) translate3d(0,100px,0)}.jos-flip,.jos-flip-right{opacity:0;transform:perspective(2500px) rotateY(-100deg)}.jos-flip-left{opacity:0;transform:perspective(2500px) rotateY(100deg)}.jos-flip-up{opacity:0;transform:perspective(2500px) rotateX(-100deg)}.jos-flip-down{opacity:0;transform:perspective(2500px) rotateX(100deg)}.jos-rotate,.jos-rotate-right{opacity:0;transform:rotate(-180deg)}.jos-rotate-left{opacity:0;transform:rotate(180deg)}.jos-spin,.jos-spin-right{opacity:0;transform:rotate(-180deg) scale(0)}.jos-spin-left{opacity:0;transform:rotate(180deg) scale(0)}.jos-revolve,.jos-revolve-right{opacity:0;transform:rotate(-1turn) scale(0)}.jos-revolve-left{opacity:0;transform:rotate(1turn) scale(0)}.jos-stretch{opacity:0;transform:scaleX(0)}.jos-stretch-vertical{opacity:0;transform:scaleY(0)}.jos-skew{opacity:0;transform:skew(20deg,20deg)}.jos-skew-right{opacity:0;transform:skew(20deg,20deg) translate3d(-100px,0,-100px)}.jos-skew-left{opacity:0;transform:skew(20deg,20deg) translate3d(100px,0,-100px)}.jos-skew-down{opacity:0;transform:skew(20deg,20deg) translate3d(0,-100px,0)}.jos-skew-up{opacity:0;transform:skew(20deg,20deg) translate3d(0,100px,0)}.jos-slant{transform:skew(25deg,25deg)}.jos-slant-right{transform:skew(25deg,0deg)}.jos-slant-left{transform:skew(0deg,25deg)}.jos-bar,.jos-bar_vertical{transform:perspective(2500px) rotateY(-100deg)}.jos-bar_horizontal{transform:perspective(2500px) rotateX(-100deg)}.jos-grey{filter:grayscale(100%)}.jos-blur{filter:blur(7px)}.jos-backdrop{backdrop-filter:blur(7px);opacity:.8}.jos-invert{filter:invert(100%)}.jos-sepia{filter:sepia(100%)}.jos-saturate{filter:saturate(100%)}.jos-hue-rotate{filter:hue-rotate(90deg)}.jos-brightness{filter:brightness(.5)}[data-jos_timing_function=ease]{transition-timing-function:ease!important}[data-jos_timing_function=ease-in]{transition-timing-function:ease-in!important}[data-jos_timing_function=ease-out]{transition-timing-function:ease-out!important}[data-jos_timing_function=ease-in-out]{transition-timing-function:ease-in-out!important}[data-jos_timing_function=linear]{transition-timing-function:linear!important}[data-jos_timing_function=step-start]{transition-timing-function:step-start!important}[data-jos_timing_function=step-end]{transition-timing-function:step-end!important}[data-jos_timing_function=steps]{transition-timing-function:steps(5)!important}[data-jos_timing_function=frames]{transition-timing-function:frames(5)!important}");const JOS=new class{default_once=!1;default_animation="fade";default_animationinverse=void 0;default_timingFunction="ease-in-out";default_threshold=0;default_duration=.4;default_delay=0;default_intersectionRatio=0;default_rootMargin="-10% 0% -40% 0%";default_startVisible=void 0;default_scrolldirection=void 0;default_passive=!0;default_mirror=void 0;setRange=new Set;debug=!1;scrollProgressDisable=void 0;disable=!1;static version="0.9.1 (Minified)";static author="Jesvi Jonathan";static webpage="https://jos-animation.vercel.app";static github="https://github.com/jesvijonathan/JOS-Animation-Library";options={};jos_stylesheet=void 0;boxes=void 0;observers=[];scrollEnter=[];constructor(){}version(){}debugger(t=0){if(0==t&&this.debugMode){this.version();for(const[t,s]of Object.entries(this));}(1==t||0==t)&&this.debugMode}callbackRouter_anchor=(t,s)=>{if(this.disable)return;let e=t[0],o=e.target;document.querySelectorAll("[data-jos_anchor='#"+o.id+"']").forEach((t=>{let o=t.dataset.jos_animation,a=t.dataset.jos_animationinverse;if(e.isIntersecting){if(null!=t.dataset.jos_counter){let s=parseInt(t.dataset.jos_counter);s++,t.dataset.jos_counter=s}o&&(t.classList.remove("jos-"+o),null!=t.dataset.jos_invoke&&window[t.dataset.jos_invoke](t),null==t.dataset.jos_once&&"false"==t.dataset.jos_once||("true"==t.dataset.jos_once||t.dataset.jos_counter>=t.dataset.jos_once)&&s.unobserve(t),null!=a&&t.classList.add("jos-"+a))}else void 0!==t.dataset.jos_scrolldirection&&"down"!==t.dataset.jos_scrolldirection&&"none"!==t.dataset.jos_scrolldirection||(t.classList.add("jos-"+o),void 0!==t.dataset.jos_invoke_out&&window[t.dataset.jos_invoke_out](t))}))};callbackScroller=t=>{if(this.disable||this.scrollProgressDisable)return;const s=this.default_rootMargin;let e=window.innerHeight;const o=t=>{const o=t.dataset.jos_rootmargin||s,a=o.split(" ").map(parseFloat),i=e*a[0]/100,r=e*a[2]/100;t.jos={rootMargin:o,rootMarginValues:a,topMargin:i,bottomMargin:r};const n=t.getBoundingClientRect(),l=n.top-t.jos.topMargin,d=n.bottom-t.jos.bottomMargin,c=n.top/e,u=l/(e-t.jos.topMargin-t.jos.bottomMargin);let f=0;f=u<=0?0:u>=100?1:u,t.jos={elementRect:n,elementTop:l,elementBottom:d,windowScrollProgress:c,rootScrollProgress:u,scrollProgress:f},window[t.dataset.jos_scroll](t)};document.onscroll=s=>{this.disable||this.scrollProgressDisable||t.forEach(o)}};callbackRouter=(t,s,e=1)=>{if(this.disable)return;let o=t[0],a=o.target,i=a.dataset.jos_animation,r=a.dataset.jos_animationinverse,n=1;if(n=o.boundingClientRect.top<0?0:1,o.isIntersecting){if("false"!=a.dataset.jos_scroll&&null!=a.dataset.jos_scroll&&(this.scrollEnter.push(a),this.callbackScroller(this.scrollEnter)),null!=a.dataset.jos_counter){let t=parseInt(a.dataset.jos_counter);t++,a.dataset.jos_counter=t}"false"==a.dataset.jos_mirror&&a.classList.remove("jos-no-mirror"),i&&(a.classList.remove("jos-"+i),null!=a.dataset.jos_invoke&&window[a.dataset.jos_invoke](a),null==a.dataset.jos_once&&"false"==a.dataset.jos_once||("true"==a.dataset.jos_once||a.dataset.jos_counter>=a.dataset.jos_once)&&s.unobserve(a)),null!=r&&a.classList.add("jos-"+r)}else(void 0===a.dataset.jos_scrolldirection||1===n&&"down"===a.dataset.jos_scrolldirection||0===n&&"up"===a.dataset.jos_scrolldirection||"none"===a.dataset.jos_scrolldirection)&&(a.classList.toggle("jos-no-mirror","false"==a.dataset.jos_mirror),a.classList.add("jos-"+i),null!=r&&a.classList.remove("jos-"+r),void 0!==a.dataset.jos_invoke_out&&window[a.dataset.jos_invoke_out](a)),"false"!=a.dataset.jos_scroll&&null!=a.dataset.jos_scroll&&(this.scrollEnter=this.scrollEnter.filter((t=>t.id!==a.id)),this.callbackScroller(this.scrollEnter))};animationInit(){let t=[],s=e=>{let o=e.dataset.jos_once,a=e.dataset.jos_animation||this.default_animation,i=e.dataset.jos_animationinverse,r=e.dataset.jos_timingFunction,n=e.dataset.jos_duration,l=e.dataset.jos_delay,d=e.dataset.jos_mirror||this.default_mirror;if(e.classList.contains("jos_disabled")&&(e.classList.remove("jos_disabled"),e.classList.add("jos")),o&&("true"==o||/^\d+$/.test(o))?e.setAttribute("data-jos_once",o):e.setAttribute("data-jos_once",this.default_once?"1":"false"),e.dataset.jos_stagger){const o=this.default_delay,a=this.default_duration,i=this.once,r=this.mirror,n=this.scrolldirection,l=this.rootMargin;if(e.id||(e.id=Math.random().toString(36).substring(7)),Array.from(e.children).forEach(((d,c)=>{if(!d.classList.contains("jos")){d.classList.add("jos"),d.id||(d.id=`${e.id}_${c}`);const u=e.dataset.jos_stagger,f=e.dataset.jos_stagger_delay||o,j=e.dataset.jos_stagger_seq||0,_=e.dataset.jos_stagger_duration||a,m=e.dataset.jos_stagger_once||i,p=e.dataset.jos_staggerinverse||r,h=e.dataset.jos_stagger_mirror||r,g=e.dataset.jos_stagger_startVisible,b=e.dataset.jos_stagger_scrolldirection||n,v=e.dataset.jos_stagger_rootmargin||l;if(e.dataset.jos_stagger_anchor||d.dataset.jos_anchor){const t="true"===e.dataset.jos_stagger_anchor?"#"+e.id:e.dataset.jos_stagger_anchor;d.setAttribute("data-jos_anchor",t)}d.setAttribute("data-jos_animation",u),p&&d.setAttribute("data-jos_animationinverse",p),d.setAttribute("data-jos_duration",_);const x=parseFloat(j*c+f);d.setAttribute("data-jos_delay",x),d.setAttribute("data-jos_once",m),"false"===h&&d.setAttribute("data-jos_mirror","false"),g&&t.push(d),b&&d.setAttribute("data-jos_scrolldirection",b),v&&d.setAttribute("data-jos_rootmargin",v),e.dataset.jos_stagger_scroll&&d.setAttribute("data-jos_scroll",e.dataset.jos_stagger_scroll),e.dataset.jos_stagger_timingFunction&&d.setAttribute("data-jos_timingFunction",e.dataset.jos_stagger_timingFunction),e.dataset.jos_stagger_invoke&&d.setAttribute("data-jos_invoke",e.dataset.jos_stagger_invoke),e.dataset.jos_stagger_invoke_out&&d.setAttribute("data-jos_invoke_out",e.dataset.jos_stagger_invoke_out),this.boxes=[...this.boxes,d],s(d)}})),!e.dataset.jos_animation)return void e.classList.remove("jos")}e.setAttribute("data-jos_animation",a),i&&e.setAttribute("data-jos_animationinverse",i),r&&e.setAttribute("data-jos_timingFunction",r),"false"==d&&e.setAttribute("data-jos_mirror",d),n&&(e.setAttribute("data-jos_duration",n),this.setRange.add(parseFloat(n))),l&&(e.setAttribute("data-jos_delay",l),this.setRange.add(parseFloat(l))),e.setAttribute("data-jos_counter","0"),e.classList.add("jos-"+a),(e.dataset.jos_startvisible||this.default_startVisible)&&t.push(e),this.default_scrolldirection&&e.setAttribute("data-jos_scrolldirection",this.default_scrolldirection);let c={rootMargin:[e.dataset.jos_rootmargin_top||this.default_rootMargin.split(" ")[0],e.dataset.jos_rootmargin_right||this.default_rootMargin.split(" ")[1],e.dataset.jos_rootmargin_bottom||this.default_rootMargin.split(" ")[2],e.dataset.jos_rootmargin_left||this.default_rootMargin.split(" ")[3]].map((t=>t.startsWith("-")?t.substring(1):`-${t}`)).join(" "),threshold:this.default_threshold,passive:this.default_passive};if(e.dataset.jos_anchor){const t=new IntersectionObserver(this.callbackRouter_anchor,c);this.observers.push(t),t.observe(document.getElementById(e.dataset.jos_anchor.substring(1)))}else{const t=new IntersectionObserver(this.callbackRouter,c);this.observers.push(t),t.observe(e)}};this.boxes.forEach((t=>{s(t)})),setTimeout((()=>{t.forEach((t=>{let s=t.dataset.jos_startvisible;setTimeout((()=>{"true"==s&&(s=0),t.classList.remove("jos-"+t.dataset.jos_animation)}),s||this.default_startVisible)}))}),100)}animationUnset(t=0){-1!=t&&this.boxes?.forEach((s=>{s.classList.remove("jos"),s.classList.add("jos_disabled"),0==t?s.classList.add("jos-"+s.dataset.jos_animation):s.classList.remove("jos-"+s.dataset.jos_animation)})),this.observers?.forEach((t=>t.disconnect()))}getStylesheet(){const t=document.createElement("style");document.head.appendChild(t);const s=t.sheet;s.insertRule(".jos-no-mirror { transition: 0s forwards !important;}");let e="all "+this.default_duration+"s "+this.default_timingFunction+" "+this.default_delay+"s ;";s.insertRule(".jos {transition: "+e+";}");for(const t of this.setRange)s.insertRule(`[data-jos_duration="${t}"] {\n transition-duration: ${t}s !important;\n }`),s.insertRule(`[data-jos_delay="${t}"] {\n transition-delay: ${t}s !important;\n }`);this.jos_stylesheet=s}getBoxes(){return this.boxes=void 0,this.boxes||(this.boxes=document.querySelectorAll(".jos")),this.boxes}getDefault(t={}){let{once:s,animation:e,animationinverse:o,timingFunction:a,threshold:i,startVisible:r,scrollDirection:n,intersectionRatio:l,duration:d,mirror:c,delay:u,debugMode:f,disable:j,scrollProgressDisable:_,rootMargin:m,rootMarginTop:p,rootMarginBottom:h}=t;this.default_once=s||this.default_once,this.default_animation=e||this.default_animation,this.default_animationinverse=o||this.default_animation,this.default_timingFunction=a||this.default_timingFunction,this.default_threshold=i||this.default_threshold,this.default_startVisible=r||this.default_startVisible,this.default_scrolldirection=n||this.default_scrolldirection,this.default_intersectionRatio=l||this.default_threshold,this.default_duration=d||this.default_duration,this.default_delay=u||this.default_delay,this.debugMode=f||this.debugMode,null!=j&&(this.disable=j),this.scrollProgressDisable=_||this.scrollProgressDisable,this.default_rootMargin=m||`${p||"-10%"} 0% ${h||"-40%"} 0%`,this.default_mirror=c||this.default_mirror}init(t=this.options){this.options=t,this.getDefault(t),this.disable||(this.getBoxes(),this.debugMode&&this.debugger(),this.start(),this.getStylesheet())}start(t=0){return-1!=t&&(this.stop(),this.animationInit()),this.disable=!1,"Started"}stop(t=0){return 1==t?t=0:0==t&&(t=1),this.disable=!0,-1!=t&&this.animationUnset(t),"Stopped"}refresh(){return this.animationUnset(-1),this.boxes=void 0,this.getBoxes(),this.animationInit(),this.debugger(1),"Refreshed"}destroy(t=0){this.animationUnset(-1),this.boxes=void 0,this.observers=[],1==t&&(this.jos_stylesheet.disabled=!0),this.jos_stylesheet=void 0;for(let t in this)this.hasOwnProperty(t)&&"function"!=typeof this[t]&&(this[t]=void 0);return Object.setPrototypeOf(this,null),"JOS Instance Nuked"}};"undefined"!=typeof module&&void 0!==module.exports?module.exports=JOS:"function"==typeof define&&define.amd?define([],(function(){return JOS})):window.JOS=JOS})); diff --git a/dist/v0.9.1/jos.debug.js b/dist/v0.9.1/jos.debug.js index 0286a84..d52d843 100644 --- a/dist/v0.9.1/jos.debug.js +++ b/dist/v0.9.1/jos.debug.js @@ -340,10 +340,18 @@ class jos { child.setAttribute("data-jos_duration", stagger_duration); - child.setAttribute( - "data-jos_delay", - parseFloat(stagger_delay) + stagger_seq * i - ); + // let delg = parseFloat(stagger_seq, 2); + // delg = (delg * i).toFixed(1); + // delg = parseFloat(delg); + // console.log(delg); + // delg = delg + parseFloat(stagger_delay); + + // const delg = parseFloat((parseFloat(stagger_seq, 2) * i).toFixed(1)) + parseFloat(stagger_delay); + + const delg = parseFloat(stagger_seq * i + stagger_delay); + + child.setAttribute("data-jos_delay", delg); + child.setAttribute("data-jos_once", stagger_once); if (stagger_mirror === "false") { diff --git a/dist/v0.9.1/jos.js b/dist/v0.9.1/jos.js index 9b95599..31870dc 100644 --- a/dist/v0.9.1/jos.js +++ b/dist/v0.9.1/jos.js @@ -1 +1 @@ -!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";!function(t,s){void 0===s&&(s={});var a=s.insertAt;if(t&&"undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===a&&e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.styleSheet?o.styleSheet.cssText=t:o.appendChild(document.createTextNode(t))}}(".jos,.jos-anchor{transition:all .4s ease-in-out}.jos-anchor{opacity:0;transition-timing-function:ease-in-out}.jos-static{opacity:1;transform:translate(0)}.jos-no-transition{transition-duration:0s;transition-timing-function:linear}.jos-hidden{display:none}.jos-visible{display:block;opacity:1}.jos-fade{opacity:0}.jos-fade-right{opacity:0;transform:translateX(-100px)}.jos-fade-left{opacity:0;transform:translateX(100px)}.jos-fade-up{opacity:0;transform:translateY(50px)}.jos-fade-down{opacity:0;transform:translateY(-50px)}.jos-fade-right-up{opacity:0;transform:translateX(-100px) translateY(50px)}.jos-fade-right-down{opacity:0;transform:translateX(-100px) translateY(-50px)}.jos-fade-left-up{opacity:0;transform:translateX(100px) translateY(50px)}.jos-fade-left-down{opacity:0;transform:translateX(100px) translateY(-50px)}.jos-slide,.jos-slide-right{transform:translateX(-100px)}.jos-slide-left{transform:translateX(100px)}.jos-slide-up{transform:translateY(100px)}.jos-slide-down{transform:translateY(-100px)}.jos-slide-right-up{transform:translateX(-100px) translateY(100px)}.jos-slide-right-down{transform:translateX(-100px) translateY(-100px)}.jos-slide-left-up{transform:translateX(100px) translateY(100px)}.jos-slide-left-down{transform:translateX(100px) translateY(-100px)}.jos-zoom,.jos-zoom-out{opacity:0;transform:scale(.8)}.jos-zoom-out-right,.jos-zoom-right{opacity:0;transform:scale(.8) translate3d(-100px,0,-100px)}.jos-zoom-left,.jos-zoom-out-left{opacity:0;transform:scale(.8) translate3d(100px,0,-100px)}.jos-zoom-down,.jos-zoom-out-down{opacity:0;transform:scale(.8) translate3d(0,-100px,0)}.jos-zoom-out-up,.jos-zoom-up{opacity:0;transform:scale(.8) translate3d(0,100px,0)}.jos-grow{transform:scale(0)}.jos-grow-right{transform:scale(0) translate3d(-100px,0,-100px)}.jos-grow-left{transform:scale(0) translate3d(100px,0,-100px)}.jos-grow-down{transform:scale(0) translate3d(0,-100px,0)}.jos-grow-up{transform:scale(0) translate3d(0,100px,0)}.jos-zoom-in{opacity:0;transform:scale(1.1)}.jos-zoom-in-down{opacity:0;transform:scale(1.1) translate3d(0,-100px,0)}.jos-zoom-in-up{opacity:0;transform:scale(1.1) translate3d(0,100px,0)}.jos-zoom-in-right{opacity:0;transform:scale(1.1) translate3d(-100px,0,-100px)}.jos-zoom-in-left{opacity:0;transform:scale(1.1) translate3d(100px,0,-100px)}.jos-shrink{transform:scale(1.4)}.jos-shrink-right{transform:scale(1.4) translate3d(-100px,0,-100px)}.jos-shrink-left{transform:scale(1.4) translate3d(100px,0,-100px)}.jos-shrink-down{transform:scale(1.4) translate3d(0,-100px,0)}.jos-shrink-up{transform:scale(1.4) translate3d(0,100px,0)}.jos-flip,.jos-flip-right{opacity:0;transform:perspective(2500px) rotateY(-100deg)}.jos-flip-left{opacity:0;transform:perspective(2500px) rotateY(100deg)}.jos-flip-up{opacity:0;transform:perspective(2500px) rotateX(-100deg)}.jos-flip-down{opacity:0;transform:perspective(2500px) rotateX(100deg)}.jos-rotate,.jos-rotate-right{opacity:0;transform:rotate(-180deg)}.jos-rotate-left{opacity:0;transform:rotate(180deg)}.jos-spin,.jos-spin-right{opacity:0;transform:rotate(-180deg) scale(0)}.jos-spin-left{opacity:0;transform:rotate(180deg) scale(0)}.jos-revolve,.jos-revolve-right{opacity:0;transform:rotate(-1turn) scale(0)}.jos-revolve-left{opacity:0;transform:rotate(1turn) scale(0)}.jos-stretch{opacity:0;transform:scaleX(0)}.jos-stretch-vertical{opacity:0;transform:scaleY(0)}.jos-skew{opacity:0;transform:skew(20deg,20deg)}.jos-skew-right{opacity:0;transform:skew(20deg,20deg) translate3d(-100px,0,-100px)}.jos-skew-left{opacity:0;transform:skew(20deg,20deg) translate3d(100px,0,-100px)}.jos-skew-down{opacity:0;transform:skew(20deg,20deg) translate3d(0,-100px,0)}.jos-skew-up{opacity:0;transform:skew(20deg,20deg) translate3d(0,100px,0)}.jos-slant{transform:skew(25deg,25deg)}.jos-slant-right{transform:skew(25deg,0deg)}.jos-slant-left{transform:skew(0deg,25deg)}.jos-bar,.jos-bar_vertical{transform:perspective(2500px) rotateY(-100deg)}.jos-bar_horizontal{transform:perspective(2500px) rotateX(-100deg)}.jos-grey{filter:grayscale(100%)}.jos-blur{filter:blur(7px)}.jos-backdrop{backdrop-filter:blur(7px);opacity:.8}.jos-invert{filter:invert(100%)}.jos-sepia{filter:sepia(100%)}.jos-saturate{filter:saturate(100%)}.jos-hue-rotate{filter:hue-rotate(90deg)}.jos-brightness{filter:brightness(.5)}[data-jos_timing_function=ease]{transition-timing-function:ease!important}[data-jos_timing_function=ease-in]{transition-timing-function:ease-in!important}[data-jos_timing_function=ease-out]{transition-timing-function:ease-out!important}[data-jos_timing_function=ease-in-out]{transition-timing-function:ease-in-out!important}[data-jos_timing_function=linear]{transition-timing-function:linear!important}[data-jos_timing_function=step-start]{transition-timing-function:step-start!important}[data-jos_timing_function=step-end]{transition-timing-function:step-end!important}[data-jos_timing_function=steps]{transition-timing-function:steps(5)!important}[data-jos_timing_function=frames]{transition-timing-function:frames(5)!important}.jos-slide-horizontal-play,.jos-slide-play{animation:jos-slide-play .7s ease-in-out infinite;animation-direction:alternate-reverse;transition:1s}@keyframes jos-slide-play{0%{transform:translateX(-100px)}to{transform:translateX(100px)}}.jos-slide-vertical-play{animation:jos-slide-vertical-play .7s ease-in-out infinite;animation-direction:alternate-reverse}@keyframes jos-slide-vertical-play{0%{transform:translateY(-100px)}to{transform:translateY(100px)}}.jos-pulse-play,.jos-zoom-in-play{animation:jos-zoom-in-play 1s infinite;animation-direction:alternate}@keyframes jos-zoom-in-play{0%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(.8)}}.jos-pulse-out-play,.jos-zoom-out-play,.jos-zoom-play{animation:jos-zoom-play .5s linear infinite;animation-direction:alternate}@keyframes jos-zoom-play{0%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1.1)}}.jos-flip-play{animation:jos-flip-play .7s infinite;animation-direction:alternate}@keyframes jos-flip-play{0%{transform:rotateY(0deg)}to{transform:rotateY(180deg)}}.jos-rotate-play{animation:jos-rotate-play 1s linear infinite forwards;animation-direction:alternate-reverse;border-radius:0}@keyframes jos-rotate-play{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.jos-spin-play{animation:jos-spin-play 1.5s infinite;animation-direction:alternate}@keyframes jos-spin-play{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(1turn)}}.jos-revolve-play{animation:jos-revolve-play 1.5s infinite;animation-direction:alternate}@keyframes jos-revolve-play{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.jos-grow-play,.jos-shrink-play{animation:jos-grow-play 1s infinite;animation-direction:alternate}@keyframes jos-grow-play{0%{transform:scale(0)}to{transform:scale(1)}}.jos-shrink-play{animation-direction:alternate-reverse}.jos-stretch-play{animation:jos-stretch-play .7s infinite;animation-direction:alternate}@keyframes jos-stretch-play{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.jos-stretch-vertical-play{animation:jos-stretch-vertical-play .7s infinite;animation-direction:alternate-reverse}@keyframes jos-stretch-vertical-play{0%{transform:scaleY(1)}to{transform:scaleY(0)}}.jos-fade-play{animation:jos-fade-play .8s infinite;animation-direction:alternate}@keyframes jos-fade-play{0%{opacity:0}to{opacity:1}}.jos-fade-horizontal-play{animation:jos-fade-horizontal-play 1s infinite;animation-direction:alternate-reverse}@keyframes jos-fade-horizontal-play{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(-100px)}}.jos-fade-vertical-play{animation:jos-fade-vertical-play 1s infinite;animation-direction:alternate-reverse}@keyframes jos-fade-vertical-play{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(-100px)}}.jos-blink-play{animation:jos-blink-play 1s step-end infinite}@keyframes jos-blink-play{0%{opacity:1}50%{opacity:0}}");class jos{default_once=!1;default_animation="fade";default_animationinverse=void 0;default_timingFunction="ease-in-out";default_threshold=0;default_duration=.4;default_delay=0;default_intersectionRatio=0;default_rootMargin="-10% 0% -40% 0%";default_startVisible=void 0;default_scrolldirection=void 0;default_passive=!0;default_mirror=void 0;setRange=new Set;debug=!1;scrollProgressDisable=void 0;disable=!1;static version="0.9.1";static author="Jesvi Jonathan";static webpage="https://jos-animation.vercel.app";static github="https://github.com/jesvijonathan/JOS-Animation-Library";options={};jos_stylesheet=void 0;boxes=void 0;observers=[];scrollEnter=[];constructor(){}version(){console.log(`JOS: Javascript On Scroll Animation Library\n - Version: ${jos.version}\n - Author: ${jos.author}\n - Webpage: ${jos.webpage}\n - Github: ${jos.github}\n`)}debugger(t=0){0==t&&this.debugMode&&(this.version(),console.log(`JOS Settings:\n - animation: ${this.default_animation}\n - once: ${this.default_once}\n - animationinverse: ${this.default_animationinverse}\n - timingFunction: ${this.default_timingFunction}\n - duration: ${this.default_duration}\n - delay: ${this.default_delay}\n - threshold: ${this.default_threshold}\n - startVisible: ${this.default_startVisible}\n - scrolldirection: ${this.default_scrolldirection}\n - intersectionRatio: ${this.default_intersectionRatio}\n - rootMargin: ${this.default_rootMargin}\n - disable: ${this.disable}\n - debugMode: ${this.debugMode}\n`)),console.log("JOS Initialized:\n\n"),1!=t&&0!=t||!this.debugMode||console.log(this.boxes||"No Elements Found")}callbackRouter_anchor=(t,s)=>{if(this.disable)return;let a=t[0],e=a.target;document.querySelectorAll("[data-jos_anchor='#"+e.id+"']").forEach((t=>{let e=t.dataset.jos_animation,o=t.dataset.jos_animationinverse;if(a.isIntersecting){if(null!=t.dataset.jos_counter){let s=parseInt(t.dataset.jos_counter);s++,t.dataset.jos_counter=s}e&&(t.classList.remove("jos-"+e),null!=t.dataset.jos_invoke&&window[t.dataset.jos_invoke](t),null==t.dataset.jos_once&&"false"==t.dataset.jos_once||("true"==t.dataset.jos_once||t.dataset.jos_counter>=t.dataset.jos_once)&&s.unobserve(t),null!=o&&t.classList.add("jos-"+o))}else void 0!==t.dataset.jos_scrolldirection&&"down"!==t.dataset.jos_scrolldirection&&"none"!==t.dataset.jos_scrolldirection||(t.classList.add("jos-"+e),void 0!==t.dataset.jos_invoke_out&&window[t.dataset.jos_invoke_out](t))}))};callbackScroller=t=>{if(this.disable||this.scrollProgressDisable)return;const s=this.default_rootMargin;let a=window.innerHeight;const e=t=>{const e=t.dataset.jos_rootmargin||s,o=e.split(" ").map(parseFloat),i=a*o[0]/100,n=a*o[2]/100;t.jos={rootMargin:e,rootMarginValues:o,topMargin:i,bottomMargin:n};const r=t.getBoundingClientRect(),l=r.top-t.jos.topMargin,d=r.bottom-t.jos.bottomMargin,c=r.top/a,f=l/(a-t.jos.topMargin-t.jos.bottomMargin);let m=0;m=f<=0?0:f>=100?1:f,t.jos={elementRect:r,elementTop:l,elementBottom:d,windowScrollProgress:c,rootScrollProgress:f,scrollProgress:m},window[t.dataset.jos_scroll](t)};document.onscroll=s=>{this.disable||this.scrollProgressDisable||t.forEach(e)}};callbackRouter=(t,s,a=1)=>{if(this.disable)return;let e=t[0],o=e.target,i=o.dataset.jos_animation,n=o.dataset.jos_animationinverse,r=1;if(r=e.boundingClientRect.top<0?0:1,e.isIntersecting){if("false"!=o.dataset.jos_scroll&&null!=o.dataset.jos_scroll&&(this.scrollEnter.push(o),this.callbackScroller(this.scrollEnter)),null!=o.dataset.jos_counter){let t=parseInt(o.dataset.jos_counter);t++,o.dataset.jos_counter=t}"false"==o.dataset.jos_mirror&&o.classList.remove("jos-no-mirror"),i&&(o.classList.remove("jos-"+i),null!=o.dataset.jos_invoke&&window[o.dataset.jos_invoke](o),null==o.dataset.jos_once&&"false"==o.dataset.jos_once||("true"==o.dataset.jos_once||o.dataset.jos_counter>=o.dataset.jos_once)&&s.unobserve(o)),null!=n&&o.classList.add("jos-"+n)}else(void 0===o.dataset.jos_scrolldirection||1===r&&"down"===o.dataset.jos_scrolldirection||0===r&&"up"===o.dataset.jos_scrolldirection||"none"===o.dataset.jos_scrolldirection)&&(o.classList.toggle("jos-no-mirror","false"==o.dataset.jos_mirror),o.classList.add("jos-"+i),null!=n&&o.classList.remove("jos-"+n),void 0!==o.dataset.jos_invoke_out&&window[o.dataset.jos_invoke_out](o)),"false"!=o.dataset.jos_scroll&&null!=o.dataset.jos_scroll&&(this.scrollEnter=this.scrollEnter.filter((t=>t.id!==o.id)),this.callbackScroller(this.scrollEnter))};animationInit(){let t=[],s=a=>{let e=a.dataset.jos_once,o=a.dataset.jos_animation||this.default_animation,i=a.dataset.jos_animationinverse,n=a.dataset.jos_timingFunction,r=a.dataset.jos_duration,l=a.dataset.jos_delay,d=a.dataset.jos_mirror||this.default_mirror;if(a.classList.contains("jos_disabled")&&(a.classList.remove("jos_disabled"),a.classList.add("jos")),e&&("true"==e||/^\d+$/.test(e))?a.setAttribute("data-jos_once",e):a.setAttribute("data-jos_once",this.default_once?"1":"false"),a.dataset.jos_stagger){const e=this.default_delay,o=this.default_duration,i=this.once,n=this.mirror,r=this.scrolldirection,l=this.rootMargin;if(a.id||(a.id=Math.random().toString(36).substring(7)),Array.from(a.children).forEach(((d,c)=>{if(!d.classList.contains("jos")){d.classList.add("jos"),d.id||(d.id=`${a.id}_${c}`);const f=a.dataset.jos_stagger,m=a.dataset.jos_stagger_delay||e,p=a.dataset.jos_stagger_seq||0,j=a.dataset.jos_stagger_duration||o,u=a.dataset.jos_stagger_once||i,h=a.dataset.jos_staggerinverse||n,_=a.dataset.jos_stagger_mirror||n,g=a.dataset.jos_stagger_startVisible,y=a.dataset.jos_stagger_scrolldirection||r,b=a.dataset.jos_stagger_rootmargin||l;if(a.dataset.jos_stagger_anchor||d.dataset.jos_anchor){const t="true"===a.dataset.jos_stagger_anchor?"#"+a.id:a.dataset.jos_stagger_anchor;d.setAttribute("data-jos_anchor",t)}d.setAttribute("data-jos_animation",f),h&&d.setAttribute("data-jos_animationinverse",h),d.setAttribute("data-jos_duration",j),d.setAttribute("data-jos_delay",parseFloat(m)+p*c),d.setAttribute("data-jos_once",u),"false"===_&&d.setAttribute("data-jos_mirror","false"),g&&t.push(d),y&&d.setAttribute("data-jos_scrolldirection",y),b&&d.setAttribute("data-jos_rootmargin",b),a.dataset.jos_stagger_scroll&&d.setAttribute("data-jos_scroll",a.dataset.jos_stagger_scroll),a.dataset.jos_stagger_timingFunction&&d.setAttribute("data-jos_timingFunction",a.dataset.jos_stagger_timingFunction),a.dataset.jos_stagger_invoke&&d.setAttribute("data-jos_invoke",a.dataset.jos_stagger_invoke),a.dataset.jos_stagger_invoke_out&&d.setAttribute("data-jos_invoke_out",a.dataset.jos_stagger_invoke_out),this.boxes=[...this.boxes,d],s(d)}})),!a.dataset.jos_animation)return void a.classList.remove("jos")}a.setAttribute("data-jos_animation",o),i&&a.setAttribute("data-jos_animationinverse",i),n&&a.setAttribute("data-jos_timingFunction",n),"false"==d&&a.setAttribute("data-jos_mirror",d),r&&(a.setAttribute("data-jos_duration",r),this.setRange.add(parseFloat(r))),l&&(a.setAttribute("data-jos_delay",l),this.setRange.add(parseFloat(l))),a.setAttribute("data-jos_counter","0"),a.classList.add("jos-"+o),(a.dataset.jos_startvisible||this.default_startVisible)&&t.push(a),this.default_scrolldirection&&a.setAttribute("data-jos_scrolldirection",this.default_scrolldirection);let c={rootMargin:[a.dataset.jos_rootmargin_top||this.default_rootMargin.split(" ")[0],a.dataset.jos_rootmargin_right||this.default_rootMargin.split(" ")[1],a.dataset.jos_rootmargin_bottom||this.default_rootMargin.split(" ")[2],a.dataset.jos_rootmargin_left||this.default_rootMargin.split(" ")[3]].map((t=>t.startsWith("-")?t.substring(1):`-${t}`)).join(" "),threshold:this.default_threshold,passive:this.default_passive};if(a.dataset.jos_anchor){const t=new IntersectionObserver(this.callbackRouter_anchor,c);this.observers.push(t),t.observe(document.getElementById(a.dataset.jos_anchor.substring(1)))}else{const t=new IntersectionObserver(this.callbackRouter,c);this.observers.push(t),t.observe(a)}};this.boxes.forEach((t=>{s(t)})),setTimeout((()=>{t.forEach((t=>{let s=t.dataset.jos_startvisible;setTimeout((()=>{"true"==s&&(s=0),t.classList.remove("jos-"+t.dataset.jos_animation)}),s||this.default_startVisible)}))}),100)}animationUnset(t=0){-1!=t&&this.boxes?.forEach((s=>{s.classList.remove("jos"),s.classList.add("jos_disabled"),0==t?s.classList.add("jos-"+s.dataset.jos_animation):s.classList.remove("jos-"+s.dataset.jos_animation)})),this.observers?.forEach((t=>t.disconnect()))}getStylesheet(){const t=document.createElement("style");document.head.appendChild(t);const s=t.sheet;s.insertRule(".jos-no-mirror { transition: 0s forwards !important;}");let a="all "+this.default_duration+"s "+this.default_timingFunction+" "+this.default_delay+"s ;";s.insertRule(".jos {transition: "+a+";}");for(const t of this.setRange)s.insertRule(`[data-jos_duration="${t}"] {\n transition-duration: ${t}s !important;\n }`),s.insertRule(`[data-jos_delay="${t}"] {\n transition-delay: ${t}s !important;\n }`);this.jos_stylesheet=s}getBoxes(){return this.boxes=void 0,this.boxes||(this.boxes=document.querySelectorAll(".jos")),this.boxes}getDefault(t={}){let{once:s,animation:a,animationinverse:e,timingFunction:o,threshold:i,startVisible:n,scrollDirection:r,intersectionRatio:l,duration:d,mirror:c,delay:f,debugMode:m,disable:p,scrollProgressDisable:j,rootMargin:u,rootMarginTop:h,rootMarginBottom:_}=t;this.default_once=s||this.default_once,this.default_animation=a||this.default_animation,this.default_animationinverse=e||this.default_animation,this.default_timingFunction=o||this.default_timingFunction,this.default_threshold=i||this.default_threshold,this.default_startVisible=n||this.default_startVisible,this.default_scrolldirection=r||this.default_scrolldirection,this.default_intersectionRatio=l||this.default_threshold,this.default_duration=d||this.default_duration,this.default_delay=f||this.default_delay,this.debugMode=m||this.debugMode,null!=p&&(this.disable=p),this.scrollProgressDisable=j||this.scrollProgressDisable,this.default_rootMargin=u||`${h||"-10%"} 0% ${_||"-40%"} 0%`,this.default_mirror=c||this.default_mirror}init(t=this.options){this.options=t,this.getDefault(t),this.disable||(this.getBoxes(),this.debugMode&&this.debugger(),this.start(),this.getStylesheet())}start(t=0){return-1!=t&&(this.stop(),this.animationInit()),this.disable=!1,"Started"}stop(t=0){return 1==t?t=0:0==t&&(t=1),this.disable=!0,-1!=t&&this.animationUnset(t),"Stopped"}refresh(){return this.animationUnset(-1),this.boxes=void 0,this.getBoxes(),this.animationInit(),this.debugger(1),"Refreshed"}destroy(t=0){this.animationUnset(-1),this.boxes=void 0,this.observers=[],1==t&&(this.jos_stylesheet.disabled=!0),this.jos_stylesheet=void 0;for(let t in this)this.hasOwnProperty(t)&&"function"!=typeof this[t]&&(this[t]=void 0);return Object.setPrototypeOf(this,null),"JOS Instance Nuked"}}const JOS=new jos;"undefined"!=typeof module&&void 0!==module.exports?module.exports=JOS:"function"==typeof define&&define.amd?define([],(function(){return JOS})):window.JOS=JOS})); +!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";!function(t,s){void 0===s&&(s={});var a=s.insertAt;if(t&&"undefined"!=typeof document){var e=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===a&&e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.styleSheet?o.styleSheet.cssText=t:o.appendChild(document.createTextNode(t))}}(".jos,.jos-anchor{transition:all .4s ease-in-out}.jos-anchor{opacity:0;transition-timing-function:ease-in-out}.jos-static{opacity:1;transform:translate(0)}.jos-no-transition{transition-duration:0s;transition-timing-function:linear}.jos-hidden{display:none}.jos-visible{display:block;opacity:1}.jos-fade{opacity:0}.jos-fade-right{opacity:0;transform:translateX(-100px)}.jos-fade-left{opacity:0;transform:translateX(100px)}.jos-fade-up{opacity:0;transform:translateY(50px)}.jos-fade-down{opacity:0;transform:translateY(-50px)}.jos-fade-right-up{opacity:0;transform:translateX(-100px) translateY(50px)}.jos-fade-right-down{opacity:0;transform:translateX(-100px) translateY(-50px)}.jos-fade-left-up{opacity:0;transform:translateX(100px) translateY(50px)}.jos-fade-left-down{opacity:0;transform:translateX(100px) translateY(-50px)}.jos-slide,.jos-slide-right{transform:translateX(-100px)}.jos-slide-left{transform:translateX(100px)}.jos-slide-up{transform:translateY(100px)}.jos-slide-down{transform:translateY(-100px)}.jos-slide-right-up{transform:translateX(-100px) translateY(100px)}.jos-slide-right-down{transform:translateX(-100px) translateY(-100px)}.jos-slide-left-up{transform:translateX(100px) translateY(100px)}.jos-slide-left-down{transform:translateX(100px) translateY(-100px)}.jos-zoom,.jos-zoom-out{opacity:0;transform:scale(.8)}.jos-zoom-out-right,.jos-zoom-right{opacity:0;transform:scale(.8) translate3d(-100px,0,-100px)}.jos-zoom-left,.jos-zoom-out-left{opacity:0;transform:scale(.8) translate3d(100px,0,-100px)}.jos-zoom-down,.jos-zoom-out-down{opacity:0;transform:scale(.8) translate3d(0,-100px,0)}.jos-zoom-out-up,.jos-zoom-up{opacity:0;transform:scale(.8) translate3d(0,100px,0)}.jos-grow{transform:scale(0)}.jos-grow-right{transform:scale(0) translate3d(-100px,0,-100px)}.jos-grow-left{transform:scale(0) translate3d(100px,0,-100px)}.jos-grow-down{transform:scale(0) translate3d(0,-100px,0)}.jos-grow-up{transform:scale(0) translate3d(0,100px,0)}.jos-zoom-in{opacity:0;transform:scale(1.1)}.jos-zoom-in-down{opacity:0;transform:scale(1.1) translate3d(0,-100px,0)}.jos-zoom-in-up{opacity:0;transform:scale(1.1) translate3d(0,100px,0)}.jos-zoom-in-right{opacity:0;transform:scale(1.1) translate3d(-100px,0,-100px)}.jos-zoom-in-left{opacity:0;transform:scale(1.1) translate3d(100px,0,-100px)}.jos-shrink{transform:scale(1.4)}.jos-shrink-right{transform:scale(1.4) translate3d(-100px,0,-100px)}.jos-shrink-left{transform:scale(1.4) translate3d(100px,0,-100px)}.jos-shrink-down{transform:scale(1.4) translate3d(0,-100px,0)}.jos-shrink-up{transform:scale(1.4) translate3d(0,100px,0)}.jos-flip,.jos-flip-right{opacity:0;transform:perspective(2500px) rotateY(-100deg)}.jos-flip-left{opacity:0;transform:perspective(2500px) rotateY(100deg)}.jos-flip-up{opacity:0;transform:perspective(2500px) rotateX(-100deg)}.jos-flip-down{opacity:0;transform:perspective(2500px) rotateX(100deg)}.jos-rotate,.jos-rotate-right{opacity:0;transform:rotate(-180deg)}.jos-rotate-left{opacity:0;transform:rotate(180deg)}.jos-spin,.jos-spin-right{opacity:0;transform:rotate(-180deg) scale(0)}.jos-spin-left{opacity:0;transform:rotate(180deg) scale(0)}.jos-revolve,.jos-revolve-right{opacity:0;transform:rotate(-1turn) scale(0)}.jos-revolve-left{opacity:0;transform:rotate(1turn) scale(0)}.jos-stretch{opacity:0;transform:scaleX(0)}.jos-stretch-vertical{opacity:0;transform:scaleY(0)}.jos-skew{opacity:0;transform:skew(20deg,20deg)}.jos-skew-right{opacity:0;transform:skew(20deg,20deg) translate3d(-100px,0,-100px)}.jos-skew-left{opacity:0;transform:skew(20deg,20deg) translate3d(100px,0,-100px)}.jos-skew-down{opacity:0;transform:skew(20deg,20deg) translate3d(0,-100px,0)}.jos-skew-up{opacity:0;transform:skew(20deg,20deg) translate3d(0,100px,0)}.jos-slant{transform:skew(25deg,25deg)}.jos-slant-right{transform:skew(25deg,0deg)}.jos-slant-left{transform:skew(0deg,25deg)}.jos-bar,.jos-bar_vertical{transform:perspective(2500px) rotateY(-100deg)}.jos-bar_horizontal{transform:perspective(2500px) rotateX(-100deg)}.jos-grey{filter:grayscale(100%)}.jos-blur{filter:blur(7px)}.jos-backdrop{backdrop-filter:blur(7px);opacity:.8}.jos-invert{filter:invert(100%)}.jos-sepia{filter:sepia(100%)}.jos-saturate{filter:saturate(100%)}.jos-hue-rotate{filter:hue-rotate(90deg)}.jos-brightness{filter:brightness(.5)}[data-jos_timing_function=ease]{transition-timing-function:ease!important}[data-jos_timing_function=ease-in]{transition-timing-function:ease-in!important}[data-jos_timing_function=ease-out]{transition-timing-function:ease-out!important}[data-jos_timing_function=ease-in-out]{transition-timing-function:ease-in-out!important}[data-jos_timing_function=linear]{transition-timing-function:linear!important}[data-jos_timing_function=step-start]{transition-timing-function:step-start!important}[data-jos_timing_function=step-end]{transition-timing-function:step-end!important}[data-jos_timing_function=steps]{transition-timing-function:steps(5)!important}[data-jos_timing_function=frames]{transition-timing-function:frames(5)!important}.jos-slide-horizontal-play,.jos-slide-play{animation:jos-slide-play .7s ease-in-out infinite;animation-direction:alternate-reverse;transition:1s}@keyframes jos-slide-play{0%{transform:translateX(-100px)}to{transform:translateX(100px)}}.jos-slide-vertical-play{animation:jos-slide-vertical-play .7s ease-in-out infinite;animation-direction:alternate-reverse}@keyframes jos-slide-vertical-play{0%{transform:translateY(-100px)}to{transform:translateY(100px)}}.jos-pulse-play,.jos-zoom-in-play{animation:jos-zoom-in-play 1s infinite;animation-direction:alternate}@keyframes jos-zoom-in-play{0%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(.8)}}.jos-pulse-out-play,.jos-zoom-out-play,.jos-zoom-play{animation:jos-zoom-play .5s linear infinite;animation-direction:alternate}@keyframes jos-zoom-play{0%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1.1)}}.jos-flip-play{animation:jos-flip-play .7s infinite;animation-direction:alternate}@keyframes jos-flip-play{0%{transform:rotateY(0deg)}to{transform:rotateY(180deg)}}.jos-rotate-play{animation:jos-rotate-play 1s linear infinite forwards;animation-direction:alternate-reverse;border-radius:0}@keyframes jos-rotate-play{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.jos-spin-play{animation:jos-spin-play 1.5s infinite;animation-direction:alternate}@keyframes jos-spin-play{0%{opacity:0;transform:rotate(0deg)}to{opacity:1;transform:rotate(1turn)}}.jos-revolve-play{animation:jos-revolve-play 1.5s infinite;animation-direction:alternate}@keyframes jos-revolve-play{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.jos-grow-play,.jos-shrink-play{animation:jos-grow-play 1s infinite;animation-direction:alternate}@keyframes jos-grow-play{0%{transform:scale(0)}to{transform:scale(1)}}.jos-shrink-play{animation-direction:alternate-reverse}.jos-stretch-play{animation:jos-stretch-play .7s infinite;animation-direction:alternate}@keyframes jos-stretch-play{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.jos-stretch-vertical-play{animation:jos-stretch-vertical-play .7s infinite;animation-direction:alternate-reverse}@keyframes jos-stretch-vertical-play{0%{transform:scaleY(1)}to{transform:scaleY(0)}}.jos-fade-play{animation:jos-fade-play .8s infinite;animation-direction:alternate}@keyframes jos-fade-play{0%{opacity:0}to{opacity:1}}.jos-fade-horizontal-play{animation:jos-fade-horizontal-play 1s infinite;animation-direction:alternate-reverse}@keyframes jos-fade-horizontal-play{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(-100px)}}.jos-fade-vertical-play{animation:jos-fade-vertical-play 1s infinite;animation-direction:alternate-reverse}@keyframes jos-fade-vertical-play{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(-100px)}}.jos-blink-play{animation:jos-blink-play 1s step-end infinite}@keyframes jos-blink-play{0%{opacity:1}50%{opacity:0}}");class jos{default_once=!1;default_animation="fade";default_animationinverse=void 0;default_timingFunction="ease-in-out";default_threshold=0;default_duration=.4;default_delay=0;default_intersectionRatio=0;default_rootMargin="-10% 0% -40% 0%";default_startVisible=void 0;default_scrolldirection=void 0;default_passive=!0;default_mirror=void 0;setRange=new Set;debug=!1;scrollProgressDisable=void 0;disable=!1;static version="0.9.1";static author="Jesvi Jonathan";static webpage="https://jos-animation.vercel.app";static github="https://github.com/jesvijonathan/JOS-Animation-Library";options={};jos_stylesheet=void 0;boxes=void 0;observers=[];scrollEnter=[];constructor(){}version(){console.log(`JOS: Javascript On Scroll Animation Library\n - Version: ${jos.version}\n - Author: ${jos.author}\n - Webpage: ${jos.webpage}\n - Github: ${jos.github}\n`)}debugger(t=0){0==t&&this.debugMode&&(this.version(),console.log(`JOS Settings:\n - animation: ${this.default_animation}\n - once: ${this.default_once}\n - animationinverse: ${this.default_animationinverse}\n - timingFunction: ${this.default_timingFunction}\n - duration: ${this.default_duration}\n - delay: ${this.default_delay}\n - threshold: ${this.default_threshold}\n - startVisible: ${this.default_startVisible}\n - scrolldirection: ${this.default_scrolldirection}\n - intersectionRatio: ${this.default_intersectionRatio}\n - rootMargin: ${this.default_rootMargin}\n - disable: ${this.disable}\n - debugMode: ${this.debugMode}\n`)),console.log("JOS Initialized:\n\n"),1!=t&&0!=t||!this.debugMode||console.log(this.boxes||"No Elements Found")}callbackRouter_anchor=(t,s)=>{if(this.disable)return;let a=t[0],e=a.target;document.querySelectorAll("[data-jos_anchor='#"+e.id+"']").forEach((t=>{let e=t.dataset.jos_animation,o=t.dataset.jos_animationinverse;if(a.isIntersecting){if(null!=t.dataset.jos_counter){let s=parseInt(t.dataset.jos_counter);s++,t.dataset.jos_counter=s}e&&(t.classList.remove("jos-"+e),null!=t.dataset.jos_invoke&&window[t.dataset.jos_invoke](t),null==t.dataset.jos_once&&"false"==t.dataset.jos_once||("true"==t.dataset.jos_once||t.dataset.jos_counter>=t.dataset.jos_once)&&s.unobserve(t),null!=o&&t.classList.add("jos-"+o))}else void 0!==t.dataset.jos_scrolldirection&&"down"!==t.dataset.jos_scrolldirection&&"none"!==t.dataset.jos_scrolldirection||(t.classList.add("jos-"+e),void 0!==t.dataset.jos_invoke_out&&window[t.dataset.jos_invoke_out](t))}))};callbackScroller=t=>{if(this.disable||this.scrollProgressDisable)return;const s=this.default_rootMargin;let a=window.innerHeight;const e=t=>{const e=t.dataset.jos_rootmargin||s,o=e.split(" ").map(parseFloat),i=a*o[0]/100,n=a*o[2]/100;t.jos={rootMargin:e,rootMarginValues:o,topMargin:i,bottomMargin:n};const r=t.getBoundingClientRect(),l=r.top-t.jos.topMargin,d=r.bottom-t.jos.bottomMargin,c=r.top/a,f=l/(a-t.jos.topMargin-t.jos.bottomMargin);let m=0;m=f<=0?0:f>=100?1:f,t.jos={elementRect:r,elementTop:l,elementBottom:d,windowScrollProgress:c,rootScrollProgress:f,scrollProgress:m},window[t.dataset.jos_scroll](t)};document.onscroll=s=>{this.disable||this.scrollProgressDisable||t.forEach(e)}};callbackRouter=(t,s,a=1)=>{if(this.disable)return;let e=t[0],o=e.target,i=o.dataset.jos_animation,n=o.dataset.jos_animationinverse,r=1;if(r=e.boundingClientRect.top<0?0:1,e.isIntersecting){if("false"!=o.dataset.jos_scroll&&null!=o.dataset.jos_scroll&&(this.scrollEnter.push(o),this.callbackScroller(this.scrollEnter)),null!=o.dataset.jos_counter){let t=parseInt(o.dataset.jos_counter);t++,o.dataset.jos_counter=t}"false"==o.dataset.jos_mirror&&o.classList.remove("jos-no-mirror"),i&&(o.classList.remove("jos-"+i),null!=o.dataset.jos_invoke&&window[o.dataset.jos_invoke](o),null==o.dataset.jos_once&&"false"==o.dataset.jos_once||("true"==o.dataset.jos_once||o.dataset.jos_counter>=o.dataset.jos_once)&&s.unobserve(o)),null!=n&&o.classList.add("jos-"+n)}else(void 0===o.dataset.jos_scrolldirection||1===r&&"down"===o.dataset.jos_scrolldirection||0===r&&"up"===o.dataset.jos_scrolldirection||"none"===o.dataset.jos_scrolldirection)&&(o.classList.toggle("jos-no-mirror","false"==o.dataset.jos_mirror),o.classList.add("jos-"+i),null!=n&&o.classList.remove("jos-"+n),void 0!==o.dataset.jos_invoke_out&&window[o.dataset.jos_invoke_out](o)),"false"!=o.dataset.jos_scroll&&null!=o.dataset.jos_scroll&&(this.scrollEnter=this.scrollEnter.filter((t=>t.id!==o.id)),this.callbackScroller(this.scrollEnter))};animationInit(){let t=[],s=a=>{let e=a.dataset.jos_once,o=a.dataset.jos_animation||this.default_animation,i=a.dataset.jos_animationinverse,n=a.dataset.jos_timingFunction,r=a.dataset.jos_duration,l=a.dataset.jos_delay,d=a.dataset.jos_mirror||this.default_mirror;if(a.classList.contains("jos_disabled")&&(a.classList.remove("jos_disabled"),a.classList.add("jos")),e&&("true"==e||/^\d+$/.test(e))?a.setAttribute("data-jos_once",e):a.setAttribute("data-jos_once",this.default_once?"1":"false"),a.dataset.jos_stagger){const e=this.default_delay,o=this.default_duration,i=this.once,n=this.mirror,r=this.scrolldirection,l=this.rootMargin;if(a.id||(a.id=Math.random().toString(36).substring(7)),Array.from(a.children).forEach(((d,c)=>{if(!d.classList.contains("jos")){d.classList.add("jos"),d.id||(d.id=`${a.id}_${c}`);const f=a.dataset.jos_stagger,m=a.dataset.jos_stagger_delay||e,p=a.dataset.jos_stagger_seq||0,j=a.dataset.jos_stagger_duration||o,u=a.dataset.jos_stagger_once||i,h=a.dataset.jos_staggerinverse||n,_=a.dataset.jos_stagger_mirror||n,g=a.dataset.jos_stagger_startVisible,y=a.dataset.jos_stagger_scrolldirection||r,b=a.dataset.jos_stagger_rootmargin||l;if(a.dataset.jos_stagger_anchor||d.dataset.jos_anchor){const t="true"===a.dataset.jos_stagger_anchor?"#"+a.id:a.dataset.jos_stagger_anchor;d.setAttribute("data-jos_anchor",t)}d.setAttribute("data-jos_animation",f),h&&d.setAttribute("data-jos_animationinverse",h),d.setAttribute("data-jos_duration",j);const v=parseFloat(p*c+m);d.setAttribute("data-jos_delay",v),d.setAttribute("data-jos_once",u),"false"===_&&d.setAttribute("data-jos_mirror","false"),g&&t.push(d),y&&d.setAttribute("data-jos_scrolldirection",y),b&&d.setAttribute("data-jos_rootmargin",b),a.dataset.jos_stagger_scroll&&d.setAttribute("data-jos_scroll",a.dataset.jos_stagger_scroll),a.dataset.jos_stagger_timingFunction&&d.setAttribute("data-jos_timingFunction",a.dataset.jos_stagger_timingFunction),a.dataset.jos_stagger_invoke&&d.setAttribute("data-jos_invoke",a.dataset.jos_stagger_invoke),a.dataset.jos_stagger_invoke_out&&d.setAttribute("data-jos_invoke_out",a.dataset.jos_stagger_invoke_out),this.boxes=[...this.boxes,d],s(d)}})),!a.dataset.jos_animation)return void a.classList.remove("jos")}a.setAttribute("data-jos_animation",o),i&&a.setAttribute("data-jos_animationinverse",i),n&&a.setAttribute("data-jos_timingFunction",n),"false"==d&&a.setAttribute("data-jos_mirror",d),r&&(a.setAttribute("data-jos_duration",r),this.setRange.add(parseFloat(r))),l&&(a.setAttribute("data-jos_delay",l),this.setRange.add(parseFloat(l))),a.setAttribute("data-jos_counter","0"),a.classList.add("jos-"+o),(a.dataset.jos_startvisible||this.default_startVisible)&&t.push(a),this.default_scrolldirection&&a.setAttribute("data-jos_scrolldirection",this.default_scrolldirection);let c={rootMargin:[a.dataset.jos_rootmargin_top||this.default_rootMargin.split(" ")[0],a.dataset.jos_rootmargin_right||this.default_rootMargin.split(" ")[1],a.dataset.jos_rootmargin_bottom||this.default_rootMargin.split(" ")[2],a.dataset.jos_rootmargin_left||this.default_rootMargin.split(" ")[3]].map((t=>t.startsWith("-")?t.substring(1):`-${t}`)).join(" "),threshold:this.default_threshold,passive:this.default_passive};if(a.dataset.jos_anchor){const t=new IntersectionObserver(this.callbackRouter_anchor,c);this.observers.push(t),t.observe(document.getElementById(a.dataset.jos_anchor.substring(1)))}else{const t=new IntersectionObserver(this.callbackRouter,c);this.observers.push(t),t.observe(a)}};this.boxes.forEach((t=>{s(t)})),setTimeout((()=>{t.forEach((t=>{let s=t.dataset.jos_startvisible;setTimeout((()=>{"true"==s&&(s=0),t.classList.remove("jos-"+t.dataset.jos_animation)}),s||this.default_startVisible)}))}),100)}animationUnset(t=0){-1!=t&&this.boxes?.forEach((s=>{s.classList.remove("jos"),s.classList.add("jos_disabled"),0==t?s.classList.add("jos-"+s.dataset.jos_animation):s.classList.remove("jos-"+s.dataset.jos_animation)})),this.observers?.forEach((t=>t.disconnect()))}getStylesheet(){const t=document.createElement("style");document.head.appendChild(t);const s=t.sheet;s.insertRule(".jos-no-mirror { transition: 0s forwards !important;}");let a="all "+this.default_duration+"s "+this.default_timingFunction+" "+this.default_delay+"s ;";s.insertRule(".jos {transition: "+a+";}");for(const t of this.setRange)s.insertRule(`[data-jos_duration="${t}"] {\n transition-duration: ${t}s !important;\n }`),s.insertRule(`[data-jos_delay="${t}"] {\n transition-delay: ${t}s !important;\n }`);this.jos_stylesheet=s}getBoxes(){return this.boxes=void 0,this.boxes||(this.boxes=document.querySelectorAll(".jos")),this.boxes}getDefault(t={}){let{once:s,animation:a,animationinverse:e,timingFunction:o,threshold:i,startVisible:n,scrollDirection:r,intersectionRatio:l,duration:d,mirror:c,delay:f,debugMode:m,disable:p,scrollProgressDisable:j,rootMargin:u,rootMarginTop:h,rootMarginBottom:_}=t;this.default_once=s||this.default_once,this.default_animation=a||this.default_animation,this.default_animationinverse=e||this.default_animation,this.default_timingFunction=o||this.default_timingFunction,this.default_threshold=i||this.default_threshold,this.default_startVisible=n||this.default_startVisible,this.default_scrolldirection=r||this.default_scrolldirection,this.default_intersectionRatio=l||this.default_threshold,this.default_duration=d||this.default_duration,this.default_delay=f||this.default_delay,this.debugMode=m||this.debugMode,null!=p&&(this.disable=p),this.scrollProgressDisable=j||this.scrollProgressDisable,this.default_rootMargin=u||`${h||"-10%"} 0% ${_||"-40%"} 0%`,this.default_mirror=c||this.default_mirror}init(t=this.options){this.options=t,this.getDefault(t),this.disable||(this.getBoxes(),this.debugMode&&this.debugger(),this.start(),this.getStylesheet())}start(t=0){return-1!=t&&(this.stop(),this.animationInit()),this.disable=!1,"Started"}stop(t=0){return 1==t?t=0:0==t&&(t=1),this.disable=!0,-1!=t&&this.animationUnset(t),"Stopped"}refresh(){return this.animationUnset(-1),this.boxes=void 0,this.getBoxes(),this.animationInit(),this.debugger(1),"Refreshed"}destroy(t=0){this.animationUnset(-1),this.boxes=void 0,this.observers=[],1==t&&(this.jos_stylesheet.disabled=!0),this.jos_stylesheet=void 0;for(let t in this)this.hasOwnProperty(t)&&"function"!=typeof this[t]&&(this[t]=void 0);return Object.setPrototypeOf(this,null),"JOS Instance Nuked"}}const JOS=new jos;"undefined"!=typeof module&&void 0!==module.exports?module.exports=JOS:"function"==typeof define&&define.amd?define([],(function(){return JOS})):window.JOS=JOS})); diff --git a/dist/v0.9.1/jos.min.js b/dist/v0.9.1/jos.min.js index 5fd3730..f3c4ba5 100644 --- a/dist/v0.9.1/jos.min.js +++ b/dist/v0.9.1/jos.min.js @@ -1 +1 @@ -!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";!function(t,s){void 0===s&&(s={});var e=s.insertAt;if(t&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===e&&o.firstChild?o.insertBefore(a,o.firstChild):o.appendChild(a),a.styleSheet?a.styleSheet.cssText=t:a.appendChild(document.createTextNode(t))}}(".jos,.jos-anchor{transition:all .4s ease-in-out}.jos-anchor{opacity:0;transition-timing-function:ease-in-out}.jos-static{opacity:1;transform:translate(0)}.jos-no-transition{transition-duration:0s;transition-timing-function:linear}.jos-hidden{display:none}.jos-visible{display:block;opacity:1}.jos-fade{opacity:0}.jos-fade-right{opacity:0;transform:translateX(-100px)}.jos-fade-left{opacity:0;transform:translateX(100px)}.jos-fade-up{opacity:0;transform:translateY(50px)}.jos-fade-down{opacity:0;transform:translateY(-50px)}.jos-fade-right-up{opacity:0;transform:translateX(-100px) translateY(50px)}.jos-fade-right-down{opacity:0;transform:translateX(-100px) translateY(-50px)}.jos-fade-left-up{opacity:0;transform:translateX(100px) translateY(50px)}.jos-fade-left-down{opacity:0;transform:translateX(100px) translateY(-50px)}.jos-slide,.jos-slide-right{transform:translateX(-100px)}.jos-slide-left{transform:translateX(100px)}.jos-slide-up{transform:translateY(100px)}.jos-slide-down{transform:translateY(-100px)}.jos-slide-right-up{transform:translateX(-100px) translateY(100px)}.jos-slide-right-down{transform:translateX(-100px) translateY(-100px)}.jos-slide-left-up{transform:translateX(100px) translateY(100px)}.jos-slide-left-down{transform:translateX(100px) translateY(-100px)}.jos-zoom,.jos-zoom-out{opacity:0;transform:scale(.8)}.jos-zoom-out-right,.jos-zoom-right{opacity:0;transform:scale(.8) translate3d(-100px,0,-100px)}.jos-zoom-left,.jos-zoom-out-left{opacity:0;transform:scale(.8) translate3d(100px,0,-100px)}.jos-zoom-down,.jos-zoom-out-down{opacity:0;transform:scale(.8) translate3d(0,-100px,0)}.jos-zoom-out-up,.jos-zoom-up{opacity:0;transform:scale(.8) translate3d(0,100px,0)}.jos-grow{transform:scale(0)}.jos-grow-right{transform:scale(0) translate3d(-100px,0,-100px)}.jos-grow-left{transform:scale(0) translate3d(100px,0,-100px)}.jos-grow-down{transform:scale(0) translate3d(0,-100px,0)}.jos-grow-up{transform:scale(0) translate3d(0,100px,0)}.jos-zoom-in{opacity:0;transform:scale(1.1)}.jos-zoom-in-down{opacity:0;transform:scale(1.1) translate3d(0,-100px,0)}.jos-zoom-in-up{opacity:0;transform:scale(1.1) translate3d(0,100px,0)}.jos-zoom-in-right{opacity:0;transform:scale(1.1) translate3d(-100px,0,-100px)}.jos-zoom-in-left{opacity:0;transform:scale(1.1) translate3d(100px,0,-100px)}.jos-shrink{transform:scale(1.4)}.jos-shrink-right{transform:scale(1.4) translate3d(-100px,0,-100px)}.jos-shrink-left{transform:scale(1.4) translate3d(100px,0,-100px)}.jos-shrink-down{transform:scale(1.4) translate3d(0,-100px,0)}.jos-shrink-up{transform:scale(1.4) translate3d(0,100px,0)}.jos-flip,.jos-flip-right{opacity:0;transform:perspective(2500px) rotateY(-100deg)}.jos-flip-left{opacity:0;transform:perspective(2500px) rotateY(100deg)}.jos-flip-up{opacity:0;transform:perspective(2500px) rotateX(-100deg)}.jos-flip-down{opacity:0;transform:perspective(2500px) rotateX(100deg)}.jos-rotate,.jos-rotate-right{opacity:0;transform:rotate(-180deg)}.jos-rotate-left{opacity:0;transform:rotate(180deg)}.jos-spin,.jos-spin-right{opacity:0;transform:rotate(-180deg) scale(0)}.jos-spin-left{opacity:0;transform:rotate(180deg) scale(0)}.jos-revolve,.jos-revolve-right{opacity:0;transform:rotate(-1turn) scale(0)}.jos-revolve-left{opacity:0;transform:rotate(1turn) scale(0)}.jos-stretch{opacity:0;transform:scaleX(0)}.jos-stretch-vertical{opacity:0;transform:scaleY(0)}.jos-skew{opacity:0;transform:skew(20deg,20deg)}.jos-skew-right{opacity:0;transform:skew(20deg,20deg) translate3d(-100px,0,-100px)}.jos-skew-left{opacity:0;transform:skew(20deg,20deg) translate3d(100px,0,-100px)}.jos-skew-down{opacity:0;transform:skew(20deg,20deg) translate3d(0,-100px,0)}.jos-skew-up{opacity:0;transform:skew(20deg,20deg) translate3d(0,100px,0)}.jos-slant{transform:skew(25deg,25deg)}.jos-slant-right{transform:skew(25deg,0deg)}.jos-slant-left{transform:skew(0deg,25deg)}.jos-bar,.jos-bar_vertical{transform:perspective(2500px) rotateY(-100deg)}.jos-bar_horizontal{transform:perspective(2500px) rotateX(-100deg)}.jos-grey{filter:grayscale(100%)}.jos-blur{filter:blur(7px)}.jos-backdrop{backdrop-filter:blur(7px);opacity:.8}.jos-invert{filter:invert(100%)}.jos-sepia{filter:sepia(100%)}.jos-saturate{filter:saturate(100%)}.jos-hue-rotate{filter:hue-rotate(90deg)}.jos-brightness{filter:brightness(.5)}[data-jos_timing_function=ease]{transition-timing-function:ease!important}[data-jos_timing_function=ease-in]{transition-timing-function:ease-in!important}[data-jos_timing_function=ease-out]{transition-timing-function:ease-out!important}[data-jos_timing_function=ease-in-out]{transition-timing-function:ease-in-out!important}[data-jos_timing_function=linear]{transition-timing-function:linear!important}[data-jos_timing_function=step-start]{transition-timing-function:step-start!important}[data-jos_timing_function=step-end]{transition-timing-function:step-end!important}[data-jos_timing_function=steps]{transition-timing-function:steps(5)!important}[data-jos_timing_function=frames]{transition-timing-function:frames(5)!important}");const t=new class{default_once=!1;default_animation="fade";default_animationinverse=void 0;default_timingFunction="ease-in-out";default_threshold=0;default_duration=.4;default_delay=0;default_intersectionRatio=0;default_rootMargin="-10% 0% -40% 0%";default_startVisible=void 0;default_scrolldirection=void 0;default_passive=!0;default_mirror=void 0;setRange=new Set;debug=!1;scrollProgressDisable=void 0;disable=!1;static version="0.9.1 (Minified)";static github="https://github.com/jesvijonathan/JOS-Animation-Library";options={};jos_stylesheet=void 0;boxes=void 0;observers=[];scrollEnter=[];constructor(){}version(){}debugger(t=0){if(0==t&&this.debugMode){this.version();for(const[t,s]of Object.entries(this));}(1==t||0==t)&&this.debugMode}callbackRouter_anchor=(t,s)=>{if(this.disable)return;let e=t[0],o=e.target;document.querySelectorAll("[data-jos_anchor='#"+o.id+"']").forEach((t=>{let o=t.dataset.jos_animation,a=t.dataset.jos_animationinverse;if(e.isIntersecting){if(null!=t.dataset.jos_counter){let s=parseInt(t.dataset.jos_counter);s++,t.dataset.jos_counter=s}o&&(t.classList.remove("jos-"+o),null!=t.dataset.jos_invoke&&window[t.dataset.jos_invoke](t),null==t.dataset.jos_once&&"false"==t.dataset.jos_once||("true"==t.dataset.jos_once||t.dataset.jos_counter>=t.dataset.jos_once)&&s.unobserve(t),null!=a&&t.classList.add("jos-"+a))}else void 0!==t.dataset.jos_scrolldirection&&"down"!==t.dataset.jos_scrolldirection&&"none"!==t.dataset.jos_scrolldirection||(t.classList.add("jos-"+o),void 0!==t.dataset.jos_invoke_out&&window[t.dataset.jos_invoke_out](t))}))};callbackScroller=t=>{if(this.disable||this.scrollProgressDisable)return;const s=this.default_rootMargin;let e=window.innerHeight;const o=t=>{const o=t.dataset.jos_rootmargin||s,a=o.split(" ").map(parseFloat),i=e*a[0]/100,r=e*a[2]/100;t.jos={rootMargin:o,rootMarginValues:a,topMargin:i,bottomMargin:r};const n=t.getBoundingClientRect(),l=n.top-t.jos.topMargin,d=n.bottom-t.jos.bottomMargin,c=n.top/e,u=l/(e-t.jos.topMargin-t.jos.bottomMargin);let f=0;f=u<=0?0:u>=100?1:u,t.jos={elementRect:n,elementTop:l,elementBottom:d,windowScrollProgress:c,rootScrollProgress:u,scrollProgress:f},window[t.dataset.jos_scroll](t)};document.onscroll=s=>{this.disable||this.scrollProgressDisable||t.forEach(o)}};callbackRouter=(t,s,e=1)=>{if(this.disable)return;let o=t[0],a=o.target,i=a.dataset.jos_animation,r=a.dataset.jos_animationinverse,n=1;if(n=o.boundingClientRect.top<0?0:1,o.isIntersecting){if("false"!=a.dataset.jos_scroll&&null!=a.dataset.jos_scroll&&(this.scrollEnter.push(a),this.callbackScroller(this.scrollEnter)),null!=a.dataset.jos_counter){let t=parseInt(a.dataset.jos_counter);t++,a.dataset.jos_counter=t}"false"==a.dataset.jos_mirror&&a.classList.remove("jos-no-mirror"),i&&(a.classList.remove("jos-"+i),null!=a.dataset.jos_invoke&&window[a.dataset.jos_invoke](a),null==a.dataset.jos_once&&"false"==a.dataset.jos_once||("true"==a.dataset.jos_once||a.dataset.jos_counter>=a.dataset.jos_once)&&s.unobserve(a)),null!=r&&a.classList.add("jos-"+r)}else(void 0===a.dataset.jos_scrolldirection||1===n&&"down"===a.dataset.jos_scrolldirection||0===n&&"up"===a.dataset.jos_scrolldirection||"none"===a.dataset.jos_scrolldirection)&&(a.classList.toggle("jos-no-mirror","false"==a.dataset.jos_mirror),a.classList.add("jos-"+i),null!=r&&a.classList.remove("jos-"+r),void 0!==a.dataset.jos_invoke_out&&window[a.dataset.jos_invoke_out](a)),"false"!=a.dataset.jos_scroll&&null!=a.dataset.jos_scroll&&(this.scrollEnter=this.scrollEnter.filter((t=>t.id!==a.id)),this.callbackScroller(this.scrollEnter))};animationInit(){let t=[],s=e=>{let o=e.dataset.jos_once,a=e.dataset.jos_animation||this.default_animation,i=e.dataset.jos_animationinverse,r=e.dataset.jos_timingFunction,n=e.dataset.jos_duration,l=e.dataset.jos_delay,d=e.dataset.jos_mirror||this.default_mirror;if(e.classList.contains("jos_disabled")&&(e.classList.remove("jos_disabled"),e.classList.add("jos")),o&&("true"==o||/^\d+$/.test(o))?e.setAttribute("data-jos_once",o):e.setAttribute("data-jos_once",this.default_once?"1":"false"),e.dataset.jos_stagger){const o=this.default_delay,a=this.default_duration,i=this.once,r=this.mirror,n=this.scrolldirection,l=this.rootMargin;if(e.id||(e.id=Math.random().toString(36).substring(7)),Array.from(e.children).forEach(((d,c)=>{if(!d.classList.contains("jos")){d.classList.add("jos"),d.id||(d.id=`${e.id}_${c}`);const u=e.dataset.jos_stagger,f=e.dataset.jos_stagger_delay||o,j=e.dataset.jos_stagger_seq||0,_=e.dataset.jos_stagger_duration||a,m=e.dataset.jos_stagger_once||i,p=e.dataset.jos_staggerinverse||r,h=e.dataset.jos_stagger_mirror||r,g=e.dataset.jos_stagger_startVisible,b=e.dataset.jos_stagger_scrolldirection||n,v=e.dataset.jos_stagger_rootmargin||l;if(e.dataset.jos_stagger_anchor||d.dataset.jos_anchor){const t="true"===e.dataset.jos_stagger_anchor?"#"+e.id:e.dataset.jos_stagger_anchor;d.setAttribute("data-jos_anchor",t)}d.setAttribute("data-jos_animation",u),p&&d.setAttribute("data-jos_animationinverse",p),d.setAttribute("data-jos_duration",_),d.setAttribute("data-jos_delay",parseFloat(f)+j*c),d.setAttribute("data-jos_once",m),"false"===h&&d.setAttribute("data-jos_mirror","false"),g&&t.push(d),b&&d.setAttribute("data-jos_scrolldirection",b),v&&d.setAttribute("data-jos_rootmargin",v),e.dataset.jos_stagger_scroll&&d.setAttribute("data-jos_scroll",e.dataset.jos_stagger_scroll),e.dataset.jos_stagger_timingFunction&&d.setAttribute("data-jos_timingFunction",e.dataset.jos_stagger_timingFunction),e.dataset.jos_stagger_invoke&&d.setAttribute("data-jos_invoke",e.dataset.jos_stagger_invoke),e.dataset.jos_stagger_invoke_out&&d.setAttribute("data-jos_invoke_out",e.dataset.jos_stagger_invoke_out),this.boxes=[...this.boxes,d],s(d)}})),!e.dataset.jos_animation)return void e.classList.remove("jos")}e.setAttribute("data-jos_animation",a),i&&e.setAttribute("data-jos_animationinverse",i),r&&e.setAttribute("data-jos_timingFunction",r),"false"==d&&e.setAttribute("data-jos_mirror",d),n&&(e.setAttribute("data-jos_duration",n),this.setRange.add(parseFloat(n))),l&&(e.setAttribute("data-jos_delay",l),this.setRange.add(parseFloat(l))),e.setAttribute("data-jos_counter","0"),e.classList.add("jos-"+a),(e.dataset.jos_startvisible||this.default_startVisible)&&t.push(e),this.default_scrolldirection&&e.setAttribute("data-jos_scrolldirection",this.default_scrolldirection);let c={rootMargin:[e.dataset.jos_rootmargin_top||this.default_rootMargin.split(" ")[0],e.dataset.jos_rootmargin_right||this.default_rootMargin.split(" ")[1],e.dataset.jos_rootmargin_bottom||this.default_rootMargin.split(" ")[2],e.dataset.jos_rootmargin_left||this.default_rootMargin.split(" ")[3]].map((t=>t.startsWith("-")?t.substring(1):`-${t}`)).join(" "),threshold:this.default_threshold,passive:this.default_passive};if(e.dataset.jos_anchor){const t=new IntersectionObserver(this.callbackRouter_anchor,c);this.observers.push(t),t.observe(document.getElementById(e.dataset.jos_anchor.substring(1)))}else{const t=new IntersectionObserver(this.callbackRouter,c);this.observers.push(t),t.observe(e)}};this.boxes.forEach((t=>{s(t)})),setTimeout((()=>{t.forEach((t=>{let s=t.dataset.jos_startvisible;setTimeout((()=>{"true"==s&&(s=0),t.classList.remove("jos-"+t.dataset.jos_animation)}),s||this.default_startVisible)}))}),100)}animationUnset(t=0){-1!=t&&this.boxes?.forEach((s=>{s.classList.remove("jos"),s.classList.add("jos_disabled"),0==t?s.classList.add("jos-"+s.dataset.jos_animation):s.classList.remove("jos-"+s.dataset.jos_animation)})),this.observers?.forEach((t=>t.disconnect()))}getStylesheet(){const t=document.createElement("style");document.head.appendChild(t);const s=t.sheet;s.insertRule(".jos-no-mirror { transition: 0s forwards !important;}");let e="all "+this.default_duration+"s "+this.default_timingFunction+" "+this.default_delay+"s ;";s.insertRule(".jos {transition: "+e+";}");for(const t of this.setRange)s.insertRule(`[data-jos_duration="${t}"] {\n transition-duration: ${t}s !important;\n }`),s.insertRule(`[data-jos_delay="${t}"] {\n transition-delay: ${t}s !important;\n }`);this.jos_stylesheet=s}getBoxes(){return this.boxes=void 0,this.boxes||(this.boxes=document.querySelectorAll(".jos")),this.boxes}getDefault(t={}){let{once:s,animation:e,animationinverse:o,timingFunction:a,threshold:i,startVisible:r,scrollDirection:n,intersectionRatio:l,duration:d,mirror:c,delay:u,debugMode:f,disable:j,scrollProgressDisable:_,rootMargin:m,rootMarginTop:p,rootMarginBottom:h}=t;this.default_once=s||this.default_once,this.default_animation=e||this.default_animation,this.default_animationinverse=o||this.default_animation,this.default_timingFunction=a||this.default_timingFunction,this.default_threshold=i||this.default_threshold,this.default_startVisible=r||this.default_startVisible,this.default_scrolldirection=n||this.default_scrolldirection,this.default_intersectionRatio=l||this.default_threshold,this.default_duration=d||this.default_duration,this.default_delay=u||this.default_delay,this.debugMode=f||this.debugMode,null!=j&&(this.disable=j),this.scrollProgressDisable=_||this.scrollProgressDisable,this.default_rootMargin=m||`${p||"-10%"} 0% ${h||"-40%"} 0%`,this.default_mirror=c||this.default_mirror}init(t=this.options){this.options=t,this.getDefault(t),this.disable||(this.getBoxes(),this.debugMode&&this.debugger(),this.start(),this.getStylesheet())}start(t=0){return-1!=t&&(this.stop(),this.animationInit()),this.disable=!1,"Started"}stop(t=0){return 1==t?t=0:0==t&&(t=1),this.disable=!0,-1!=t&&this.animationUnset(t),"Stopped"}refresh(){return this.animationUnset(-1),this.boxes=void 0,this.getBoxes(),this.animationInit(),this.debugger(1),"Refreshed"}destroy(t=0){this.animationUnset(-1),this.boxes=void 0,this.observers=[],1==t&&(this.jos_stylesheet.disabled=!0),this.jos_stylesheet=void 0;for(let t in this)this.hasOwnProperty(t)&&"function"!=typeof this[t]&&(this[t]=void 0);return Object.setPrototypeOf(this,null),"JOS Instance Nuked"}};"undefined"!=typeof module&&void 0!==module.exports?module.exports=t:"function"==typeof define&&define.amd?define([],(function(){return t})):window.JOS=t})); +!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";!function(t,s){void 0===s&&(s={});var e=s.insertAt;if(t&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===e&&o.firstChild?o.insertBefore(a,o.firstChild):o.appendChild(a),a.styleSheet?a.styleSheet.cssText=t:a.appendChild(document.createTextNode(t))}}(".jos,.jos-anchor{transition:all .4s ease-in-out}.jos-anchor{opacity:0;transition-timing-function:ease-in-out}.jos-static{opacity:1;transform:translate(0)}.jos-no-transition{transition-duration:0s;transition-timing-function:linear}.jos-hidden{display:none}.jos-visible{display:block;opacity:1}.jos-fade{opacity:0}.jos-fade-right{opacity:0;transform:translateX(-100px)}.jos-fade-left{opacity:0;transform:translateX(100px)}.jos-fade-up{opacity:0;transform:translateY(50px)}.jos-fade-down{opacity:0;transform:translateY(-50px)}.jos-fade-right-up{opacity:0;transform:translateX(-100px) translateY(50px)}.jos-fade-right-down{opacity:0;transform:translateX(-100px) translateY(-50px)}.jos-fade-left-up{opacity:0;transform:translateX(100px) translateY(50px)}.jos-fade-left-down{opacity:0;transform:translateX(100px) translateY(-50px)}.jos-slide,.jos-slide-right{transform:translateX(-100px)}.jos-slide-left{transform:translateX(100px)}.jos-slide-up{transform:translateY(100px)}.jos-slide-down{transform:translateY(-100px)}.jos-slide-right-up{transform:translateX(-100px) translateY(100px)}.jos-slide-right-down{transform:translateX(-100px) translateY(-100px)}.jos-slide-left-up{transform:translateX(100px) translateY(100px)}.jos-slide-left-down{transform:translateX(100px) translateY(-100px)}.jos-zoom,.jos-zoom-out{opacity:0;transform:scale(.8)}.jos-zoom-out-right,.jos-zoom-right{opacity:0;transform:scale(.8) translate3d(-100px,0,-100px)}.jos-zoom-left,.jos-zoom-out-left{opacity:0;transform:scale(.8) translate3d(100px,0,-100px)}.jos-zoom-down,.jos-zoom-out-down{opacity:0;transform:scale(.8) translate3d(0,-100px,0)}.jos-zoom-out-up,.jos-zoom-up{opacity:0;transform:scale(.8) translate3d(0,100px,0)}.jos-grow{transform:scale(0)}.jos-grow-right{transform:scale(0) translate3d(-100px,0,-100px)}.jos-grow-left{transform:scale(0) translate3d(100px,0,-100px)}.jos-grow-down{transform:scale(0) translate3d(0,-100px,0)}.jos-grow-up{transform:scale(0) translate3d(0,100px,0)}.jos-zoom-in{opacity:0;transform:scale(1.1)}.jos-zoom-in-down{opacity:0;transform:scale(1.1) translate3d(0,-100px,0)}.jos-zoom-in-up{opacity:0;transform:scale(1.1) translate3d(0,100px,0)}.jos-zoom-in-right{opacity:0;transform:scale(1.1) translate3d(-100px,0,-100px)}.jos-zoom-in-left{opacity:0;transform:scale(1.1) translate3d(100px,0,-100px)}.jos-shrink{transform:scale(1.4)}.jos-shrink-right{transform:scale(1.4) translate3d(-100px,0,-100px)}.jos-shrink-left{transform:scale(1.4) translate3d(100px,0,-100px)}.jos-shrink-down{transform:scale(1.4) translate3d(0,-100px,0)}.jos-shrink-up{transform:scale(1.4) translate3d(0,100px,0)}.jos-flip,.jos-flip-right{opacity:0;transform:perspective(2500px) rotateY(-100deg)}.jos-flip-left{opacity:0;transform:perspective(2500px) rotateY(100deg)}.jos-flip-up{opacity:0;transform:perspective(2500px) rotateX(-100deg)}.jos-flip-down{opacity:0;transform:perspective(2500px) rotateX(100deg)}.jos-rotate,.jos-rotate-right{opacity:0;transform:rotate(-180deg)}.jos-rotate-left{opacity:0;transform:rotate(180deg)}.jos-spin,.jos-spin-right{opacity:0;transform:rotate(-180deg) scale(0)}.jos-spin-left{opacity:0;transform:rotate(180deg) scale(0)}.jos-revolve,.jos-revolve-right{opacity:0;transform:rotate(-1turn) scale(0)}.jos-revolve-left{opacity:0;transform:rotate(1turn) scale(0)}.jos-stretch{opacity:0;transform:scaleX(0)}.jos-stretch-vertical{opacity:0;transform:scaleY(0)}.jos-skew{opacity:0;transform:skew(20deg,20deg)}.jos-skew-right{opacity:0;transform:skew(20deg,20deg) translate3d(-100px,0,-100px)}.jos-skew-left{opacity:0;transform:skew(20deg,20deg) translate3d(100px,0,-100px)}.jos-skew-down{opacity:0;transform:skew(20deg,20deg) translate3d(0,-100px,0)}.jos-skew-up{opacity:0;transform:skew(20deg,20deg) translate3d(0,100px,0)}.jos-slant{transform:skew(25deg,25deg)}.jos-slant-right{transform:skew(25deg,0deg)}.jos-slant-left{transform:skew(0deg,25deg)}.jos-bar,.jos-bar_vertical{transform:perspective(2500px) rotateY(-100deg)}.jos-bar_horizontal{transform:perspective(2500px) rotateX(-100deg)}.jos-grey{filter:grayscale(100%)}.jos-blur{filter:blur(7px)}.jos-backdrop{backdrop-filter:blur(7px);opacity:.8}.jos-invert{filter:invert(100%)}.jos-sepia{filter:sepia(100%)}.jos-saturate{filter:saturate(100%)}.jos-hue-rotate{filter:hue-rotate(90deg)}.jos-brightness{filter:brightness(.5)}[data-jos_timing_function=ease]{transition-timing-function:ease!important}[data-jos_timing_function=ease-in]{transition-timing-function:ease-in!important}[data-jos_timing_function=ease-out]{transition-timing-function:ease-out!important}[data-jos_timing_function=ease-in-out]{transition-timing-function:ease-in-out!important}[data-jos_timing_function=linear]{transition-timing-function:linear!important}[data-jos_timing_function=step-start]{transition-timing-function:step-start!important}[data-jos_timing_function=step-end]{transition-timing-function:step-end!important}[data-jos_timing_function=steps]{transition-timing-function:steps(5)!important}[data-jos_timing_function=frames]{transition-timing-function:frames(5)!important}");const JOS=new class{default_once=!1;default_animation="fade";default_animationinverse=void 0;default_timingFunction="ease-in-out";default_threshold=0;default_duration=.4;default_delay=0;default_intersectionRatio=0;default_rootMargin="-10% 0% -40% 0%";default_startVisible=void 0;default_scrolldirection=void 0;default_passive=!0;default_mirror=void 0;setRange=new Set;debug=!1;scrollProgressDisable=void 0;disable=!1;static version="0.9.1 (Minified)";static author="Jesvi Jonathan";static webpage="https://jos-animation.vercel.app";static github="https://github.com/jesvijonathan/JOS-Animation-Library";options={};jos_stylesheet=void 0;boxes=void 0;observers=[];scrollEnter=[];constructor(){}version(){}debugger(t=0){if(0==t&&this.debugMode){this.version();for(const[t,s]of Object.entries(this));}(1==t||0==t)&&this.debugMode}callbackRouter_anchor=(t,s)=>{if(this.disable)return;let e=t[0],o=e.target;document.querySelectorAll("[data-jos_anchor='#"+o.id+"']").forEach((t=>{let o=t.dataset.jos_animation,a=t.dataset.jos_animationinverse;if(e.isIntersecting){if(null!=t.dataset.jos_counter){let s=parseInt(t.dataset.jos_counter);s++,t.dataset.jos_counter=s}o&&(t.classList.remove("jos-"+o),null!=t.dataset.jos_invoke&&window[t.dataset.jos_invoke](t),null==t.dataset.jos_once&&"false"==t.dataset.jos_once||("true"==t.dataset.jos_once||t.dataset.jos_counter>=t.dataset.jos_once)&&s.unobserve(t),null!=a&&t.classList.add("jos-"+a))}else void 0!==t.dataset.jos_scrolldirection&&"down"!==t.dataset.jos_scrolldirection&&"none"!==t.dataset.jos_scrolldirection||(t.classList.add("jos-"+o),void 0!==t.dataset.jos_invoke_out&&window[t.dataset.jos_invoke_out](t))}))};callbackScroller=t=>{if(this.disable||this.scrollProgressDisable)return;const s=this.default_rootMargin;let e=window.innerHeight;const o=t=>{const o=t.dataset.jos_rootmargin||s,a=o.split(" ").map(parseFloat),i=e*a[0]/100,r=e*a[2]/100;t.jos={rootMargin:o,rootMarginValues:a,topMargin:i,bottomMargin:r};const n=t.getBoundingClientRect(),l=n.top-t.jos.topMargin,d=n.bottom-t.jos.bottomMargin,c=n.top/e,u=l/(e-t.jos.topMargin-t.jos.bottomMargin);let f=0;f=u<=0?0:u>=100?1:u,t.jos={elementRect:n,elementTop:l,elementBottom:d,windowScrollProgress:c,rootScrollProgress:u,scrollProgress:f},window[t.dataset.jos_scroll](t)};document.onscroll=s=>{this.disable||this.scrollProgressDisable||t.forEach(o)}};callbackRouter=(t,s,e=1)=>{if(this.disable)return;let o=t[0],a=o.target,i=a.dataset.jos_animation,r=a.dataset.jos_animationinverse,n=1;if(n=o.boundingClientRect.top<0?0:1,o.isIntersecting){if("false"!=a.dataset.jos_scroll&&null!=a.dataset.jos_scroll&&(this.scrollEnter.push(a),this.callbackScroller(this.scrollEnter)),null!=a.dataset.jos_counter){let t=parseInt(a.dataset.jos_counter);t++,a.dataset.jos_counter=t}"false"==a.dataset.jos_mirror&&a.classList.remove("jos-no-mirror"),i&&(a.classList.remove("jos-"+i),null!=a.dataset.jos_invoke&&window[a.dataset.jos_invoke](a),null==a.dataset.jos_once&&"false"==a.dataset.jos_once||("true"==a.dataset.jos_once||a.dataset.jos_counter>=a.dataset.jos_once)&&s.unobserve(a)),null!=r&&a.classList.add("jos-"+r)}else(void 0===a.dataset.jos_scrolldirection||1===n&&"down"===a.dataset.jos_scrolldirection||0===n&&"up"===a.dataset.jos_scrolldirection||"none"===a.dataset.jos_scrolldirection)&&(a.classList.toggle("jos-no-mirror","false"==a.dataset.jos_mirror),a.classList.add("jos-"+i),null!=r&&a.classList.remove("jos-"+r),void 0!==a.dataset.jos_invoke_out&&window[a.dataset.jos_invoke_out](a)),"false"!=a.dataset.jos_scroll&&null!=a.dataset.jos_scroll&&(this.scrollEnter=this.scrollEnter.filter((t=>t.id!==a.id)),this.callbackScroller(this.scrollEnter))};animationInit(){let t=[],s=e=>{let o=e.dataset.jos_once,a=e.dataset.jos_animation||this.default_animation,i=e.dataset.jos_animationinverse,r=e.dataset.jos_timingFunction,n=e.dataset.jos_duration,l=e.dataset.jos_delay,d=e.dataset.jos_mirror||this.default_mirror;if(e.classList.contains("jos_disabled")&&(e.classList.remove("jos_disabled"),e.classList.add("jos")),o&&("true"==o||/^\d+$/.test(o))?e.setAttribute("data-jos_once",o):e.setAttribute("data-jos_once",this.default_once?"1":"false"),e.dataset.jos_stagger){const o=this.default_delay,a=this.default_duration,i=this.once,r=this.mirror,n=this.scrolldirection,l=this.rootMargin;if(e.id||(e.id=Math.random().toString(36).substring(7)),Array.from(e.children).forEach(((d,c)=>{if(!d.classList.contains("jos")){d.classList.add("jos"),d.id||(d.id=`${e.id}_${c}`);const u=e.dataset.jos_stagger,f=e.dataset.jos_stagger_delay||o,j=e.dataset.jos_stagger_seq||0,_=e.dataset.jos_stagger_duration||a,m=e.dataset.jos_stagger_once||i,p=e.dataset.jos_staggerinverse||r,h=e.dataset.jos_stagger_mirror||r,g=e.dataset.jos_stagger_startVisible,b=e.dataset.jos_stagger_scrolldirection||n,v=e.dataset.jos_stagger_rootmargin||l;if(e.dataset.jos_stagger_anchor||d.dataset.jos_anchor){const t="true"===e.dataset.jos_stagger_anchor?"#"+e.id:e.dataset.jos_stagger_anchor;d.setAttribute("data-jos_anchor",t)}d.setAttribute("data-jos_animation",u),p&&d.setAttribute("data-jos_animationinverse",p),d.setAttribute("data-jos_duration",_);const x=parseFloat(j*c+f);d.setAttribute("data-jos_delay",x),d.setAttribute("data-jos_once",m),"false"===h&&d.setAttribute("data-jos_mirror","false"),g&&t.push(d),b&&d.setAttribute("data-jos_scrolldirection",b),v&&d.setAttribute("data-jos_rootmargin",v),e.dataset.jos_stagger_scroll&&d.setAttribute("data-jos_scroll",e.dataset.jos_stagger_scroll),e.dataset.jos_stagger_timingFunction&&d.setAttribute("data-jos_timingFunction",e.dataset.jos_stagger_timingFunction),e.dataset.jos_stagger_invoke&&d.setAttribute("data-jos_invoke",e.dataset.jos_stagger_invoke),e.dataset.jos_stagger_invoke_out&&d.setAttribute("data-jos_invoke_out",e.dataset.jos_stagger_invoke_out),this.boxes=[...this.boxes,d],s(d)}})),!e.dataset.jos_animation)return void e.classList.remove("jos")}e.setAttribute("data-jos_animation",a),i&&e.setAttribute("data-jos_animationinverse",i),r&&e.setAttribute("data-jos_timingFunction",r),"false"==d&&e.setAttribute("data-jos_mirror",d),n&&(e.setAttribute("data-jos_duration",n),this.setRange.add(parseFloat(n))),l&&(e.setAttribute("data-jos_delay",l),this.setRange.add(parseFloat(l))),e.setAttribute("data-jos_counter","0"),e.classList.add("jos-"+a),(e.dataset.jos_startvisible||this.default_startVisible)&&t.push(e),this.default_scrolldirection&&e.setAttribute("data-jos_scrolldirection",this.default_scrolldirection);let c={rootMargin:[e.dataset.jos_rootmargin_top||this.default_rootMargin.split(" ")[0],e.dataset.jos_rootmargin_right||this.default_rootMargin.split(" ")[1],e.dataset.jos_rootmargin_bottom||this.default_rootMargin.split(" ")[2],e.dataset.jos_rootmargin_left||this.default_rootMargin.split(" ")[3]].map((t=>t.startsWith("-")?t.substring(1):`-${t}`)).join(" "),threshold:this.default_threshold,passive:this.default_passive};if(e.dataset.jos_anchor){const t=new IntersectionObserver(this.callbackRouter_anchor,c);this.observers.push(t),t.observe(document.getElementById(e.dataset.jos_anchor.substring(1)))}else{const t=new IntersectionObserver(this.callbackRouter,c);this.observers.push(t),t.observe(e)}};this.boxes.forEach((t=>{s(t)})),setTimeout((()=>{t.forEach((t=>{let s=t.dataset.jos_startvisible;setTimeout((()=>{"true"==s&&(s=0),t.classList.remove("jos-"+t.dataset.jos_animation)}),s||this.default_startVisible)}))}),100)}animationUnset(t=0){-1!=t&&this.boxes?.forEach((s=>{s.classList.remove("jos"),s.classList.add("jos_disabled"),0==t?s.classList.add("jos-"+s.dataset.jos_animation):s.classList.remove("jos-"+s.dataset.jos_animation)})),this.observers?.forEach((t=>t.disconnect()))}getStylesheet(){const t=document.createElement("style");document.head.appendChild(t);const s=t.sheet;s.insertRule(".jos-no-mirror { transition: 0s forwards !important;}");let e="all "+this.default_duration+"s "+this.default_timingFunction+" "+this.default_delay+"s ;";s.insertRule(".jos {transition: "+e+";}");for(const t of this.setRange)s.insertRule(`[data-jos_duration="${t}"] {\n transition-duration: ${t}s !important;\n }`),s.insertRule(`[data-jos_delay="${t}"] {\n transition-delay: ${t}s !important;\n }`);this.jos_stylesheet=s}getBoxes(){return this.boxes=void 0,this.boxes||(this.boxes=document.querySelectorAll(".jos")),this.boxes}getDefault(t={}){let{once:s,animation:e,animationinverse:o,timingFunction:a,threshold:i,startVisible:r,scrollDirection:n,intersectionRatio:l,duration:d,mirror:c,delay:u,debugMode:f,disable:j,scrollProgressDisable:_,rootMargin:m,rootMarginTop:p,rootMarginBottom:h}=t;this.default_once=s||this.default_once,this.default_animation=e||this.default_animation,this.default_animationinverse=o||this.default_animation,this.default_timingFunction=a||this.default_timingFunction,this.default_threshold=i||this.default_threshold,this.default_startVisible=r||this.default_startVisible,this.default_scrolldirection=n||this.default_scrolldirection,this.default_intersectionRatio=l||this.default_threshold,this.default_duration=d||this.default_duration,this.default_delay=u||this.default_delay,this.debugMode=f||this.debugMode,null!=j&&(this.disable=j),this.scrollProgressDisable=_||this.scrollProgressDisable,this.default_rootMargin=m||`${p||"-10%"} 0% ${h||"-40%"} 0%`,this.default_mirror=c||this.default_mirror}init(t=this.options){this.options=t,this.getDefault(t),this.disable||(this.getBoxes(),this.debugMode&&this.debugger(),this.start(),this.getStylesheet())}start(t=0){return-1!=t&&(this.stop(),this.animationInit()),this.disable=!1,"Started"}stop(t=0){return 1==t?t=0:0==t&&(t=1),this.disable=!0,-1!=t&&this.animationUnset(t),"Stopped"}refresh(){return this.animationUnset(-1),this.boxes=void 0,this.getBoxes(),this.animationInit(),this.debugger(1),"Refreshed"}destroy(t=0){this.animationUnset(-1),this.boxes=void 0,this.observers=[],1==t&&(this.jos_stylesheet.disabled=!0),this.jos_stylesheet=void 0;for(let t in this)this.hasOwnProperty(t)&&"function"!=typeof this[t]&&(this[t]=void 0);return Object.setPrototypeOf(this,null),"JOS Instance Nuked"}};"undefined"!=typeof module&&void 0!==module.exports?module.exports=JOS:"function"==typeof define&&define.amd?define([],(function(){return JOS})):window.JOS=JOS}));