diff --git a/README.md b/README.md new file mode 100644 index 0000000..b958911 --- /dev/null +++ b/README.md @@ -0,0 +1,33 @@ +# FortuneTeller + +## Description + +FortuneTeller is a mystical and engaging application inspired by the Magic 8 Ball. It provides answers to your questions through an enchanting interface. The project uses parallax effects and the GSAP library to create an immersive experience, enhanced with AI-generated images. + +## Features + +- Mystical interface with parallax effects. +- Provides answers to user's questions in a captivating manner. +- Utilizes GSAP library for smooth animations. +- AI-generated images for a visually appealing experience. + +## Demo + +You can try the FortuneTeller [here](https://anastacodes.github.io/FortuneTeller/). + +## Technologies Used + +- HTML +- CSS +- JavaScript +- GSAP (GreenSock Animation Platform) +- AI-generated images + +## Acknowledgments + +- Inspired by the classic Magic 8 Ball toy. +- Images created using AI tools. + +## Contact + +If you have any questions or suggestions, please feel free to reach out. diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..f377b2f --- /dev/null +++ b/css/styles.css @@ -0,0 +1,189 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + } + + :root { + --index: calc(1vw + 1vh); + --text: #e0e7e6; + --transition: transform 0.75s cubic-bezier(0.075, 0.5, 0, 1); + } + + @font-face { + font-family: Neucha-Regular; + src: url(../fonts/Neucha-Regular.ttf); + } + + body { + background-color: #000; + font-family: Neucha-Regular, sans-serif; + line-height: 1.5; + } + + button, input { + font-family: Neucha-Regular, sans-serif; + } + + .main-header { + position: relative; + } + + .main-header::after { + content: ''; + position: absolute; + z-index: 100; + width: 100%; + height: 450px; + background-image: url(../img/ground.png); + background-size: cover; + background-repeat: no-repeat; + background-position: center; + bottom: -225px; + } + + .layers { + height: 100vh; + display: flex; + align-items: center; + justify-content: center; + text-align: center; + overflow: hidden; + position: relative; + } + + .layer { + height: 100%; + width: 100%; + position: absolute; + background-size: cover; + background-position: center; + will-change: transform; + z-index: 2; + transition: var(--transition); + } + + .layers__base { + transform: translate3d(0, calc(var(--scrollTop) / 1.6), 0); + z-index: 0; + } + + .layers__middle { + transform: translate3d(0, calc(var(--scrollTop) / 2.5), 0); + } + + .layers__front { + transform: translate3d(0, calc(var(--scrollTop) / 5.7), 0); + } + + .layer__header { + z-index: 1; + transform: translate3d(0, calc(var(--scrollTop) / 2), 0); + transition: var(--transition); + will-change: transform; + text-transform: uppercase; + font-weight: 900; + color: var(--text); + text-shadow: 0 0 15px #2b929d; + max-width: 1200px; + padding: 0 45px; + } + + .layers__title { + font-size: calc(var(--index) * 2); + letter-spacing: calc(var(--index) / 2.25); + } + + .layers__caption { + font-size: calc(var(--index) / 1); + letter-spacing: calc(var(--index) / 3.5); + margin-top: calc(var(--index) * -0.75); + margin-bottom: 0.5rem; + } + + .main-article { + --main-article-transform: translate3d(0, calc(var(--scrollTop) / -7.5), 0); + min-height: 100vh; + background-size: cover; + background-position: center; + color: var(--text); + display: flex; + align-items: center; + position: relative; + text-align: center; + top: -1px; + z-index: 10; + } + + .main-article__content { + width: 100%; + } + + .main-article__header { + font-size: calc(var(--index) * 1.25); + letter-spacing: calc(var(--index) / 3); + max-width: 40vw; + text-transform: uppercase; + transform: var(--main-article-transform); + transition: var(--transition); + will-change: transform; + text-shadow: 0 0 15px #2b929d; + } + + .main-article__header:first-of-type { + text-align: start; + margin-left: 1vw; + } + + .main-article__header:not(:first-of-type) { + position: absolute; + right: 0; + text-align: end; + margin-right: 1vw; + } + + .main-article__paragraph { + padding-top: 5rem; + padding-left: 5rem; + margin: 0 auto; + max-width: calc(var(--index) * 20); + font-size: calc(var(--index) * 0.9); + margin-top: calc(var(--index) / 1.25); + transform: var(--main-article-transform); + transition: var(--transition); + will-change: transform; + } + + .main-article__paragraph button { + background: transparent; + border: none; + color: white; + font-size: 1.25rem; + cursor: pointer; + margin-top: 1rem; + } + + .content { + will-change: transform; + } + + .copy { + position: absolute; + bottom: calc(var(--index) * 2.5); + opacity: 0.45; + font-size: calc(var(--index) * 0.75); + letter-spacing: calc(var(--index) / 37.5); + } + + #question { + border: none; + background: transparent; + color: white; + font-size: 1.25rem; + border-bottom: 1px solid white; + } + + #answer { + height: 20px; + } + \ No newline at end of file diff --git a/fonts/Neucha-Regular.ttf b/fonts/Neucha-Regular.ttf new file mode 100644 index 0000000..87ddfbe Binary files /dev/null and b/fonts/Neucha-Regular.ttf differ diff --git a/img/favicon.ico b/img/favicon.ico new file mode 100644 index 0000000..6ae616f Binary files /dev/null and b/img/favicon.ico differ diff --git a/img/first-background.png b/img/first-background.png new file mode 100644 index 0000000..004eded Binary files /dev/null and b/img/first-background.png differ diff --git a/img/first-layer.png b/img/first-layer.png new file mode 100644 index 0000000..0b14325 Binary files /dev/null and b/img/first-layer.png differ diff --git a/img/full.png b/img/full.png new file mode 100644 index 0000000..5969a87 Binary files /dev/null and b/img/full.png differ diff --git a/img/ground.png b/img/ground.png new file mode 100644 index 0000000..919da80 Binary files /dev/null and b/img/ground.png differ diff --git a/img/second-background.png b/img/second-background.png new file mode 100644 index 0000000..976080c Binary files /dev/null and b/img/second-background.png differ diff --git a/img/second-layer.png b/img/second-layer.png new file mode 100644 index 0000000..03560f0 Binary files /dev/null and b/img/second-layer.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..5ad4240 --- /dev/null +++ b/index.html @@ -0,0 +1,44 @@ + + + + + + + Fortune Teller + + + + +
+
+
+
+
+
Each of us has wanted to know our fate at least once...
+
Deep into the dark forest... there lie the answers you seek...
+
+
+
+
+
+
+
+
+

The whispers of ancient forests and stars lead you here...

+

What do you wish to know from the sunsets of time?

+
+
+
+

+
+
+
+
+
+ + + + + + + diff --git a/js/animate.js b/js/animate.js new file mode 100644 index 0000000..f554bf9 --- /dev/null +++ b/js/animate.js @@ -0,0 +1,8 @@ +window.addEventListener('scroll', e => { + document.documentElement.style.setProperty('--scrollTop', `${this.scrollY}px`) // Update method +}) +gsap.registerPlugin(ScrollTrigger, ScrollSmoother) +ScrollSmoother.create({ + wrapper: '.wrapper', + content: '.content' +}) diff --git a/js/magicBall.js b/js/magicBall.js new file mode 100644 index 0000000..9beb6c9 --- /dev/null +++ b/js/magicBall.js @@ -0,0 +1,53 @@ +const answers = [ + "Without a doubt", + "It is certain", + "No doubt about it", + "Definitely yes", + "You can count on it", + "I think so", + "Most likely", + "Good prospects", + "Signs point to yes", + "Yes", + "Unclear, try again", + "Ask later", + "Better not tell you now", + "Cannot predict now", + "Concentrate and ask again", + "Don't even think about it", + "My answer is no", + "Based on my data, no", + "Not very good prospects", + "Very doubtful", +]; + +const questionWords = [ + "how", + "why", + "why", + "when", + "where", + "where to", + "where from", + "how much", + "what", + "who", +]; + +document.querySelector("#getAnswer").addEventListener("click", () => { + const question = document.querySelector("#question").value.toLowerCase(); + let answer = document.querySelector("#answer"); + answer.innerHTML = ""; + + if (question === "") { + answer.innerHTML = "The universe does not hear you..."; + return; + } else if (questionWords.some((word) => question.includes(word.toLowerCase()))) { + answer.innerHTML = "The universe cannot answer..."; + return; + } + + const randomIndex = Math.floor(Math.random() * answers.length); + const randomAnswer = answers[randomIndex]; + answer.innerHTML = randomAnswer; +}); diff --git a/libs/gsap/ScrollSmoother.min.js b/libs/gsap/ScrollSmoother.min.js new file mode 100644 index 0000000..db547cb --- /dev/null +++ b/libs/gsap/ScrollSmoother.min.js @@ -0,0 +1 @@ +!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e=e||self).window=e.window||{})}(this,function(e){"use strict";function _defineProperties(e,t){for(var r=0;rMath.abs(l)?s:l)/(1-t),u=-c*t;return 0=t.start&&r<=t.end)return void(l&&(t.trig.progress+=t.trig.direction<0?.001:-.001,t.trig.update(0,0,1),l.resetTo("y",parseFloat(d.y),-w,!0),S&&l.progress(1)));r>t.end&&(a+=t.distance),n-=t.distance}o=h+a+m*((P.utils.clamp(e.start,e.end,r)-e.start-a)/(n-e.start)-c)}o=function _round(e){return Math.round(1e5*e)/1e5||0}(o+u),p.length&&!s&&p.forEach(function(e){return e(o-a)}),l?(l.resetTo("y",o,-w,!0),S&&l.progress(1)):(d.y=o+"px",d.renderTransform(1))}}})),P.core.getCache(i.trigger).stRevert=va,i.startY=h,i.pins=g,i.markers=p,i.ratio=o,i.autoSpeed=s,r.style.willChange="transform"),i}var r,v,t,n,b,i,a,s,l,c,u,f,h=F.getScrollFunc(R),d=1===F.isTouch?!0===e.smoothTouch?.8:parseFloat(e.smoothTouch)||0:0===e.smooth||!1===e.smooth?0:parseFloat(e.smooth)||.8,g=0,w=0,S=1,p=e.onUpdate,m=e.onStop,T=U(0),x={y:0};function refreshHeight(){return t=r.clientHeight,r.style.overflow="visible",H.style.height=t+"px",t-R.innerHeight}F.addEventListener("refresh",ta),P.delayedCall(.5,function(){return S=0}),this.scrollTop=pa,this.scrollTo=function(e,t,r){var n=P.utils.clamp(0,F.maxScroll(R),isNaN(e)?o.offset(e,r):+e);t?l?P.to(o,{duration:d,scrollTop:n,overwrite:"auto",ease:I}):h(n):pa(n)},this.offset=function(e,t){e=M(e)[0];var r,n=P.getProperty(e,"y"),o=F.create({trigger:e,start:t||"top top"});return b&&sa([o]),r=o.start,o.kill(!1),P.set(e,{y:n}),r},this.content=function(e){return arguments.length?(r=M(e||"#smooth-content")[0]||H.children[0],s=r.getAttribute("style")||"",P.set(r,{overflow:"visible",width:"100%"}),this):r},this.wrapper=function(e){return arguments.length?(v=M(e||"#smooth-wrapper")[0]||function _wrap(e){var t=_.createElement("div");return t.classList.add("ScrollSmoother-wrapper"),e.parentNode.insertBefore(t,e),t.appendChild(e),t}(r),a=v.getAttribute("style")||"",refreshHeight(),P.set(v,d?{overflow:"hidden",position:"fixed",height:"100%",width:"100%",top:0,left:0,right:0,bottom:0}:{overflow:"visible",position:"relative",width:"100%",height:"auto",top:"auto",bottom:"auto",left:"auto",right:"auto"}),this):v},this.effects=function(e,t){if(b=b||[],!e)return b.slice(0);(e=M(e)).forEach(function(e){for(var t=b.length;t--;)b[t].trigger===e&&(b[t].kill(),b.splice(t,1))});t=t||{};var r,n,o=t.speed,i=t.lag,a=[];for(r=0;r=Math.abs(r)?t:r}function N(){(Be=we.core.globals().ScrollTrigger)&&Be.core&&function _integrate(){var e=Be.core,r=e.bridge||{},t=e._scrollers,n=e._proxies;t.push.apply(t,k),n.push.apply(n,He),k=t,He=n,o=function _bridge(e,t){return r[e](t)}}()}function O(e){return(we=e||q())&&"undefined"!=typeof document&&document.body&&(ke=window,Me=(Ee=document).documentElement,Ae=Ee.body,t=[ke,Ee,Me,Ae],we.utils.clamp,Ie="onpointerenter"in Ae?"pointer":"mouse",Ce=P.isTouch=ke.matchMedia&&ke.matchMedia("(hover: none), (pointer: coarse)").matches?1:"ontouchstart"in ke||0=i,n=Math.abs(t)>=i;T&&(r||n)&&T(se,e,t,ve,me),r&&(m&&0Math.abs(t)?"x":"y",oe=!0),"y"!==ae&&(ve[2]+=e,se._vx.update(e,!0)),"x"!==ae&&(me[2]+=t,se._vy.update(t,!0)),o?ee=ee||requestAnimationFrame(Ne):Ne()}function Qe(e){if(!Le(e,1)){var t=(e=L(e,s)).clientX,r=e.clientY,n=t-se.x,i=r-se.y,o=se.isDragging;se.x=t,se.y=r,(o||Math.abs(se.startX-t)>=a||Math.abs(se.startY-r)>=a)&&(h&&(re=!0),o||(se.isDragging=!0),Pe(n,i),o||p&&p(se))}}function Se(t){if(!Le(t,1)){B(R?n:be,ze[1],Qe,!0);var e=se.isDragging&&(3=e)return a[n];return a[n-1]}for(n=a.length,e+=r;n--;)if(a[n]<=e)return a[n];return a[0]}:function(e,t,r){void 0===r&&(r=.001);var n=o(e);return!t||Math.abs(n-e)r&&(n*=t/100),e=e.substr(0,r-1)),e=n+(e in D?D[e]*t:~e.indexOf("%")?parseFloat(e)*t/100:parseFloat(e)||0)}return e}function tb(e,t,r,n,i,o,a,s){var l=i.startColor,c=i.endColor,u=i.fontSize,f=i.indent,d=i.fontWeight,p=et.createElement("div"),g=Ca(r)||"fixed"===y(r,"pinType"),h=-1!==e.indexOf("scroller"),b=g?rt:r,v=-1!==e.indexOf("start"),m=v?l:c,x="border-color:"+m+";font-size:"+u+";color:"+m+";font-weight:"+d+";pointer-events:none;white-space:nowrap;font-family:sans-serif,Arial;z-index:1000;padding:4px 8px;border-width:0;border-style:solid;";return x+="position:"+((h||s)&&g?"fixed;":"absolute;"),!h&&!s&&g||(x+=(n===je?S:_)+":"+(o+parseFloat(f))+"px;"),a&&(x+="box-sizing:border-box;text-align:left;width:"+a.offsetWidth+"px;"),p._isStart=v,p.setAttribute("class","gsap-marker-"+e+(t?" marker-"+t:"")),p.style.cssText=x,p.innerText=t||0===t?e+"-"+t:e,b.children[0]?b.insertBefore(p,b.children[0]):b.appendChild(p),p._offset=p["offset"+n.op.d2],X(p,0,n,v),p}function yb(){return 34rt.clientWidth)||(k.cache++,x=x||requestAnimationFrame(U),vt||H("scrollStart"),vt=bt())}function Ab(){m=qe.innerWidth,v=qe.innerHeight}function Bb(){k.cache++,at||g||et.fullscreenElement||et.webkitFullscreenElement||b&&m===qe.innerWidth&&!(Math.abs(qe.innerHeight-v)>.25*qe.innerHeight)||l.restart(!0)}function Eb(){return nb(te,"scrollEnd",Eb)||V(!0)}function Hb(e){for(var t=0;t=A})},Se.update=function(e,t,r){if(!fe||r||e){var n,i,o,a,s,l,c,u=Se.scroll(),f=e?0:(u-M)/z,d=f<0?0:1=Ga(be,ge),ue)if(e||!n&&!l)ac(ie,R);else{var g=Ct(ie,!0),h=u-M;ac(ie,rt,g.top+(ge===je?h:0)+At,g.left+(ge===je?0:h)+At)}Lt(n||l?X:Y),F!==z&&d<1&&n||v(H+(1!==d||l?0:F))}}else v(za(H+F*d));!ce||k.tween||at||ht||G.restart(!0),Z&&(s||le&&d&&(d<1||!dt))&&nt(Z.targets).forEach(function(e){return e.classList[n||le?"add":"remove"](Z.className)}),!Q||he||e||Q(Se),a&&!at?(he&&(c&&("complete"===o?T.pause().totalProgress(1):"reset"===o?T.restart(!0).pause():"restart"===o?T.restart(!0):T[o]()),Q&&Q(Se)),!s&&dt||(ee&&s&&Na(Se,ee),ye[i]&&Na(Se,ye[i]),le&&(1===d?Se.kill(!1,1):ye[i]=0),s||ye[i=1===d?1:3]&&Na(Se,ye[i])),de&&!n&&Math.abs(Se.getVelocity())>(Ka(de)?de:2500)&&(Ma(Se.callbackAnimation),V?V.progress(1):Ma(T,"reverse"===o?1:!d,1))):he&&Q&&!at&&Q(Se)}if(w){var b=fe?u/fe.duration()*(fe._caScrollDist||0):u;x(b+(B._isFlipped?1:0)),w(b)}$&&$(-u/fe.duration()*(fe._caScrollDist||0))}},Se.enable=function(e,t){Se.enabled||(Se.enabled=!0,mb(be,"resize",Bb),mb(ve?et:be,"scroll",zb),_e&&mb(ScrollTrigger,"refreshInit",_e),!1!==e&&(Se.progress=K=0,E=P=Ee=Me()),!1!==t&&Se.refresh())},Se.getTween=function(e){return e&&k?k.tween:V},Se.setPositions=function(e,t){ie&&(H+=e-M,F+=t-e-z),Se.start=M=e,Se.end=A=t,z=t-e,Se.update()},Se.disable=function(e,t){if(Se.enabled&&(!1!==e&&Se.revert(!0,!0),Se.enabled=Se.isActive=!1,t||V&&V.pause(),U=0,n&&(n.uncache=1),_e&&nb(ScrollTrigger,"refreshInit",_e),G&&(G.pause(),k.tween&&k.tween.kill()&&(k.tween=0)),!ve)){for(var r=Bt.length;r--;)if(Bt[r].scroller===be&&Bt[r]!==Se)return;nb(be,"resize",Bb),nb(be,"scroll",zb)}},Se.kill=function(e,t){Se.disable(e,t),V&&!t&&V.kill(),a&&delete Dt[a];var r=Bt.indexOf(Se);0<=r&&Bt.splice(r,1),r===lt&&0o&&(b()>o?a.progress(1)&&b(o):a.resetTo("scrollY",o))}La(e)||(e={}),e.preventDefault=e.isNormalizer=e.allowClicks=!0,e.type||(e.type="wheel,touch"),e.debounce=!!e.debounce,e.id=e.id||"normalizer";var n,o,l,i,a,c,u,s,f=e.normalizeScrollX,t=e.momentum,r=e.allowNestedScroll,d=I(e.target)||tt,p=Ge.core.globals().ScrollSmoother,g=p&&p.get(),h=C&&(e.content&&I(e.content)||g&&!1!==e.content&&!g.smooth()&&g.content()),b=J(d,je),v=J(d,Je),m=1,y=(P.isTouch&&qe.visualViewport?qe.visualViewport.scale*qe.visualViewport.width:qe.outerWidth)/qe.innerWidth,x=0,w=Ja(t)?function(){return t(n)}:function(){return t||2.8},S=hc(d,e.type,!0,r),_=ya,T=ya;return h&&Ge.set(h,{y:"+=0"}),e.ignoreCheck=function(e){return C&&"touchmove"===e.type&&function ignoreDrag(){if(i){requestAnimationFrame(hp);var e=za(n.deltaY/2),t=T(b.v-e);if(h&&t!==b.v+b.offset){b.offset=t-b.v;var r=za((parseFloat(h&&h._gsap.y)||0)-b.offset);h.style.transform="matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, "+r+", 0, 1)",h._gsap.y=r+"px",b.cacheID=k.cache,U()}return!0}b.offset&&lp(),i=!0}()||1.05=o||o-1<=r)&&Ge.to({},{onUpdate:rp,duration:i})}else s.restart(!0)},e.onWheel=function(){a._ts&&a.pause(),1e3a;)s=s._prev;return s?(e._next=s._next,s._next=e):(e._next=t[r],t[r]=e),e._next?e._next._prev=e:t[i]=e,e._prev=s,e.parent=e._dp=t,e}function xa(t,e,r,i){void 0===r&&(r="_first"),void 0===i&&(i="_last");var n=e._prev,a=e._next;n?n._next=a:t[r]===e&&(t[r]=a),a?a._prev=n:t[i]===e&&(t[i]=n),e._next=e._prev=e.parent=null}function ya(t,e){!t.parent||e&&!t.parent.autoRemoveChildren||t.parent.remove(t),t._act=0}function za(t,e){if(t&&(!e||e._end>t._dur||e._start<0))for(var r=t;r;)r._dirty=1,r=r.parent;return t}function Ba(t,e,r,i){return t._startAt&&(I?t._startAt.revert(ht):t.vars.immediateRender&&!t.vars.autoRevert||t._startAt.render(e,!0,i))}function Da(t){return t._repeat?yt(t._tTime,t=t.duration()+t._rDelay)*t:0}function Fa(t,e){return(t-e._start)*e._ts+(0<=e._ts?0:e._dirty?e.totalDuration():e._tDur)}function Ga(t){return t._end=ia(t._start+(t._tDur/Math.abs(t._ts||t._rts||q)||0))}function Ha(t,e){var r=t._dp;return r&&r.smoothChildTiming&&t._ts&&(t._start=ia(r._time-(0q)&&e.render(r,!0)),za(t,e)._dp&&t._initted&&t._time>=t._dur&&t._ts){if(t._dur(n=Math.abs(n))&&(a=i,o=n);return a}function sb(t){return ya(t),t.scrollTrigger&&t.scrollTrigger.kill(!1),t.progress()<1&&Pt(t,"onInterrupt"),t}function xb(t,e,r){return(6*(t+=t<0?1:1>16,e>>8&Ct,e&Ct]:0:St.black;if(!p){if(","===e.substr(-1)&&(e=e.substr(0,e.length-1)),St[e])p=St[e];else if("#"===e.charAt(0)){if(e.length<6&&(e="#"+(n=e.charAt(1))+n+(a=e.charAt(2))+a+(s=e.charAt(3))+s+(5===e.length?e.charAt(4)+e.charAt(4):"")),9===e.length)return[(p=parseInt(e.substr(1,6),16))>>16,p>>8&Ct,p&Ct,parseInt(e.substr(7),16)/255];p=[(e=parseInt(e.substr(1),16))>>16,e>>8&Ct,e&Ct]}else if("hsl"===e.substr(0,3))if(p=d=e.match(tt),r){if(~e.indexOf("="))return p=e.match(et),i&&p.length<4&&(p[3]=1),p}else o=+p[0]%360/360,u=p[1]/100,n=2*(h=p[2]/100)-(a=h<=.5?h*(u+1):h+u-h*u),3=N?u.endTime(!1):t._dur;return r(e)&&(isNaN(e)||e in o)?(a=e.charAt(0),s="%"===e.substr(-1),n=e.indexOf("="),"<"===a||">"===a?(0<=n&&(e=e.replace(/=/,"")),("<"===a?u._start:u.endTime(0<=u._repeat))+(parseFloat(e.substr(1))||0)*(s?(n<0?u:i).totalDuration()/100:1)):n<0?(e in o||(o[e]=h),o[e]):(a=parseFloat(e.charAt(n-1)+e.substr(n+1)),s&&i&&(a=a/100*(K(i)?i[0]:i).totalDuration()),1=r&&te)return i;i=i._next}else for(i=t._last;i&&i._start>=r;){if("isPause"===i.data&&i._start=n._start)&&n._ts&&h!==n){if(n.parent!==this)return this.render(t,e,r);if(n.render(0=this.totalDuration()||!v&&_)&&(f!==this._start&&Math.abs(l)===Math.abs(this._ts)||this._lock||(!t&&g||!(v===m&&0=i&&(a instanceof $t?e&&n.push(a):(r&&n.push(a),t&&n.push.apply(n,a.getChildren(!0,e,r)))),a=a._next;return n},e.getById=function getById(t){for(var e=this.getChildren(1,1,1),r=e.length;r--;)if(e[r].vars.id===t)return e[r]},e.remove=function remove(t){return r(t)?this.removeLabel(t):s(t)?this.killTweensOf(t):(xa(this,t),t===this._recent&&(this._recent=this._last),za(this))},e.totalTime=function totalTime(t,e){return arguments.length?(this._forcing=1,!this._dp&&this._ts&&(this._start=ia(zt.time-(0r:!r||s.isActive())&&n.push(s):(i=s.getTweensOf(a,r)).length&&n.push.apply(n,i),s=s._next;return n},e.tweenTo=function tweenTo(t,e){e=e||{};var r,i=this,n=wt(i,t),a=e.startAt,s=e.onStart,o=e.onStartParams,u=e.immediateRender,h=$t.to(i,pa({ease:e.ease||"none",lazy:!1,immediateRender:!1,time:n,overwrite:"auto",duration:e.duration||Math.abs((n-(a&&"time"in a?a.time:i._time))/i.timeScale())||q,onStart:function onStart(){if(i.pause(),!r){var t=e.duration||Math.abs((n-(a&&"time"in a?a.time:i._time))/i.timeScale());h._dur!==t&&Qa(h,t,0,1).render(h._time,!0,!0),r=1}s&&s.apply(h,o||[])}},e));return u?h.render(0):h},e.tweenFromTo=function tweenFromTo(t,e,r){return this.tweenTo(e,pa({startAt:{time:wt(this,t)}},r))},e.recent=function recent(){return this._recent},e.nextLabel=function nextLabel(t){return void 0===t&&(t=this._time),qb(this,wt(this,t))},e.previousLabel=function previousLabel(t){return void 0===t&&(t=this._time),qb(this,wt(this,t),1)},e.currentLabel=function currentLabel(t){return arguments.length?this.seek(t,!0):this.previousLabel(this._time+q)},e.shiftChildren=function shiftChildren(t,e,r){void 0===r&&(r=0);for(var i,n=this._first,a=this.labels;n;)n._start>=r&&(n._start+=t,n._end+=t),n=n._next;if(e)for(i in a)a[i]>=r&&(a[i]+=t);return za(this)},e.invalidate=function invalidate(){var t=this._first;for(this._lock=0;t;)t.invalidate(),t=t._next;return i.prototype.invalidate.call(this)},e.clear=function clear(t){void 0===t&&(t=!0);for(var e,r=this._first;r;)e=r._next,this.remove(r),r=e;return this._dp&&(this._time=this._tTime=this._pTime=0),t&&(this.labels={}),za(this)},e.totalDuration=function totalDuration(t){var e,r,i,n=0,a=this,s=a._last,o=N;if(arguments.length)return a.timeScale((a._repeat<0?a.duration():a.totalDuration())/(a.reversed()?-t:t));if(a._dirty){for(i=a.parent;s;)e=s._prev,s._dirty&&s.totalDuration(),o<(r=s._start)&&a._sort&&s._ts&&!a._lock?(a._lock=1,Ja(a,s,r-s._delay,1)._lock=0):o=r,r<0&&s._ts&&(n-=r,(!i&&!a._dp||i&&i.smoothChildTiming)&&(a._start+=r/a._ts,a._time-=r,a._tTime-=r),a.shiftChildren(-r,!1,-Infinity),o=0),s._end>n&&s._ts&&(n=s._end),s=e;Qa(a,a===B&&a._time>n?a._time:n,1,1),a._dirty=0}return a._tDur},Timeline.updateRoot=function updateRoot(t){if(B._ts&&(ma(B,Fa(t,B)),f=zt.frame),zt.frame>=_t){_t+=V.autoSleep||120;var e=B._first;if((!e||!e._ts)&&V.autoSleep&&zt._listeners.length<2){for(;e&&!e._ts;)e=e._next;e||zt.sleep()}}},Timeline}(Vt);pa(Qt.prototype,{_lock:0,_hasPause:0,_forcing:0});function $b(t,e,i,n,a,o){var u,h,l,f;if(dt[t]&&!1!==(u=new dt[t]).init(a,u.rawVars?e[t]:function _processVars(t,e,i,n,a){if(s(t)&&(t=Gt(t,a,e,i,n)),!v(t)||t.style&&t.nodeType||K(t)||Z(t))return r(t)?Gt(t,a,e,i,n):t;var o,u={};for(o in t)u[o]=Gt(t[o],a,e,i,n);return u}(e[t],n,a,o,i),i,n,o)&&(i._pt=h=new me(i._pt,a,t,0,1,u.render,u,0,u.priority),i!==c))for(l=i._ptLookup[i._targets.indexOf(a)],f=u._props.length;f--;)l[u._props[f]]=h;return u}function ec(t,r,e,i){var n,a,s=r.ease||i||"power1.inOut";if(K(r))a=e[t]||(e[t]=[]),r.forEach(function(t,e){return a.push({t:e/(r.length-1)*100,v:t,e:s})});else for(n in r)a=e[n]||(e[n]=[]),"ease"===n||a.push({t:parseFloat(t),v:r[n],e:s})}var Ut,Nt,qt=function _addPropTween(t,e,i,n,a,o,u,h,l,f){s(n)&&(n=n(a||0,t,o));var c,d=t[e],p="get"!==i?i:s(d)?l?t[e.indexOf("set")||!s(t["get"+e.substr(3)])?e:"get"+e.substr(3)](l):t[e]():d,_=s(d)?l?Kt:Zt:Wt;if(r(n)&&(~n.indexOf("random(")&&(n=nb(n)),"="===n.charAt(1)&&(!(c=ja(p,n)+(Xa(p)||0))&&0!==c||(n=c))),!f||p!==n||Nt)return isNaN(p*n)||""===n?(d||e in t||Q(e,n),function _addComplexStringPropTween(t,e,r,i,n,a,s){var o,u,h,l,f,c,d,p,_=new me(this._pt,t,e,0,1,oe,null,n),m=0,g=0;for(_.b=r,_.e=i,r+="",(d=~(i+="").indexOf("random("))&&(i=nb(i)),a&&(a(p=[r,i],t,e),r=p[0],i=p[1]),u=r.match(it)||[];o=it.exec(i);)l=o[0],f=i.substring(m,o.index),h?h=(h+1)%5:"rgba("===f.substr(-5)&&(h=1),l!==u[g++]&&(c=parseFloat(u[g-1])||0,_._pt={_next:_._pt,p:f||1===g?f:",",s:c,c:"="===l.charAt(1)?ja(c,l)-c:parseFloat(l)-c,m:h&&h<4?Math.round:0},m=it.lastIndex);return _.c=m")}),s.duration();else{for(l in u={},x)"ease"===l||"easeEach"===l||ec(l,x[l],u,x.easeEach);for(l in u)for(S=u[l].sort(function(t,e){return t.t-e.t}),o=z=0;o=t._tDur||e<0)&&t.ratio===u&&(u&&ya(t,1),r||I||(Pt(t,u?"onComplete":"onReverseComplete",!0),t._prom&&t._prom()))}else t._zTime||(t._zTime=e)}(this,t,e,r);return this},e.targets=function targets(){return this._targets},e.invalidate=function invalidate(){return this._pt=this._op=this._startAt=this._onUpdate=this._lazy=this.ratio=0,this._ptLookup=[],this.timeline&&this.timeline.invalidate(),E.prototype.invalidate.call(this)},e.resetTo=function resetTo(t,e,r,i){d||zt.wake(),this._ts||this.play();var n,a=Math.min(this._dur,(this._dp._time-this._start)*this._ts);return this._initted||jt(this,a),n=this._ease(a/this._dur),function _updatePropTweens(t,e,r,i,n,a,s){var o,u,h,l,f=(t._pt&&t._ptCache||(t._ptCache={}))[e];if(!f)for(f=t._ptCache[e]=[],h=t._ptLookup,l=t._targets.length;l--;){if((o=h[l][e])&&o.d&&o.d._pt)for(o=o.d._pt;o&&o.p!==e&&o.fp!==e;)o=o._next;if(!o)return Nt=1,t.vars[e]="+=0",jt(t,s),Nt=0,1;f.push(o)}for(l=f.length;l--;)(o=(u=f[l])._pt||u).s=!i&&0!==i||n?o.s+(i||0)+a*o.c:i,o.c=r-o.s,u.e&&(u.e=ha(r)+Xa(u.e)),u.b&&(u.b=o.s+Xa(u.b))}(this,t,e,r,i,n,a)?this.resetTo(t,e,r,i):(Ha(this,0),this.parent||wa(this._dp,this,"_first","_last",this._dp._sort?"_start":0),this.render(0))},e.kill=function kill(t,e){if(void 0===e&&(e="all"),!(t||e&&"all"!==e))return this._lazy=this._pt=0,this.parent?sb(this):this;if(this.timeline){var i=this.timeline.totalDuration();return this.timeline.killTweensOf(t,e,Ut&&!0!==Ut.vars.overwrite)._first||sb(this),this.parent&&i!==this.timeline.totalDuration()&&Qa(this,this._dur*this.timeline._tDur/i,0,1),this}var n,a,s,o,u,h,l,f=this._targets,c=t?Ot(t):f,d=this._ptLookup,p=this._pt;if((!e||"all"===e)&&function _arraysMatch(t,e){for(var r=t.length,i=r===e.length;i&&r--&&t[r]===e[r];);return r<0}(f,c))return"all"===e&&(this._pt=0),sb(this);for(n=this._op=this._op||[],"all"!==e&&(r(e)&&(u={},ga(e,function(t){return u[t]=1}),e=u),e=function _addAliasesToVars(t,e){var r,i,n,a,s=t[0]?ea(t[0]).harness:0,o=s&&s.aliases;if(!o)return e;for(i in r=vt({},e),o)if(i in r)for(n=(a=o[i].split(",")).length;n--;)r[a[n]]=r[i];return r}(f,e)),l=f.length;l--;)if(~c.indexOf(f[l]))for(u in a=d[l],"all"===e?(n[l]=e,o=a,s={}):(s=n[l]=n[l]||{},o=e),o)(h=a&&a[u])&&("kill"in h.d&&!0!==h.d.kill(u)||xa(this,h,"_pt"),delete a[u]),"all"!==s&&(s[u]=1);return this._initted&&!this._pt&&p&&sb(this),this},Tween.to=function to(t,e,r){return new Tween(t,e,r)},Tween.from=function from(t,e){return Ua(1,arguments)},Tween.delayedCall=function delayedCall(t,e,r,i){return new Tween(e,0,{immediateRender:!1,lazy:!1,overwrite:!1,delay:t,onComplete:e,onReverseComplete:e,onCompleteParams:r,onReverseCompleteParams:r,callbackScope:i})},Tween.fromTo=function fromTo(t,e,r){return Ua(2,arguments)},Tween.set=function set(t,e){return e.duration=0,e.repeatDelay||(e.repeat=0),new Tween(t,e)},Tween.killTweensOf=function killTweensOf(t,e,r){return B.killTweensOf(t,e,r)},Tween}(Vt);pa($t.prototype,{_targets:[],_lazy:0,_startAt:0,_op:0,_onInit:0}),ga("staggerTo,staggerFrom,staggerFromTo",function(r){$t[r]=function(){var t=new Qt,e=Mt.call(arguments,0);return e.splice("staggerFromTo"===r?5:4,0,0),t[r].apply(t,e)}});function mc(t,e,r){return t.setAttribute(e,r)}function uc(t,e,r,i){i.mSet(t,e,i.m.call(i.tween,r,i.mt),i)}var Wt=function _setterPlain(t,e,r){return t[e]=r},Zt=function _setterFunc(t,e,r){return t[e](r)},Kt=function _setterFuncWithParam(t,e,r,i){return t[e](i.fp,r)},ee=function _getSetter(t,e){return s(t[e])?Zt:u(t[e])&&t.setAttribute?mc:Wt},re=function _renderPlain(t,e){return e.set(e.t,e.p,Math.round(1e6*(e.s+e.c*t))/1e6,e)},ne=function _renderBoolean(t,e){return e.set(e.t,e.p,!!(e.s+e.c*t),e)},oe=function _renderComplexString(t,e){var r=e._pt,i="";if(!t&&e.b)i=e.b;else if(1===t&&e.e)i=e.e;else{for(;r;)i=r.p+(r.m?r.m(r.s+r.c*t):Math.round(1e4*(r.s+r.c*t))/1e4)+i,r=r._next;i+=e.c}e.set(e.t,e.p,i,e)},ce=function _renderPropTweens(t,e){for(var r=e._pt;r;)r.r(t,r.d),r=r._next},de=function _addPluginModifier(t,e,r,i){for(var n,a=this._pt;a;)n=a._next,a.p===i&&a.modifier(t,e,r),a=n},pe=function _killPropTweensOf(t){for(var e,r,i=this._pt;i;)r=i._next,i.p===t&&!i.op||i.op===t?xa(this,i,"_pt"):i.dep||(e=1),i=r;return!e},_e=function _sortPropTweensByPriority(t){for(var e,r,i,n,a=t._pt;a;){for(e=a._next,r=i;r&&r.pr>a.pr;)r=r._next;(a._prev=r?r._prev:n)?a._prev._next=a:i=a,(a._next=r)?r._prev=a:n=a,a=e}t._pt=i},me=(PropTween.prototype.modifier=function modifier(t,e,r){this.mSet=this.mSet||this.set,this.set=uc,this.m=t,this.mt=r,this.tween=e},PropTween);function PropTween(t,e,r,i,n,a,s,o,u){this.t=e,this.s=i,this.c=n,this.p=r,this.r=a||re,this.d=s||this,this.set=o||Wt,this.pr=u||0,(this._next=t)&&(t._prev=this)}ga(gt+"parent,duration,ease,delay,overwrite,runBackwards,startAt,yoyo,immediateRender,repeat,repeatDelay,data,paused,reversed,lazy,callbackScope,stringFilter,id,yoyoEase,stagger,inherit,repeatRefresh,keyframes,autoRevert,scrollTrigger",function(t){return lt[t]=1}),ot.TweenMax=ot.TweenLite=$t,ot.TimelineLite=ot.TimelineMax=Qt,B=new Qt({sortChildren:!1,defaults:U,autoRemoveChildren:!0,id:"root",smoothChildTiming:!0}),V.stringFilter=Db;function Bc(t){return(Te[t]||we).map(function(t){return t()})}function Cc(){var t=Date.now(),o=[];2