├── js ├── tmp └── index.js ├── css ├── tmp └── style.css ├── scss ├── tmp └── style.scss ├── .gitignore ├── favicon.ico ├── images └── header.webp ├── README.md ├── license.txt ├── ScrollMagic_2.0.3_plugins_animation.gsap.min.js ├── jquery.gsap.min.js ├── index.html ├── ScrollMagic_2.0.2_plugins_debug.addIndicators.min.js ├── necolas_emitter.js └── utils ├── SplitText.min.js ├── Draggable.min.js └── GSDevTools.min.js /js/tmp: -------------------------------------------------------------------------------- 1 | yo 2 | -------------------------------------------------------------------------------- /css/tmp: -------------------------------------------------------------------------------- 1 | yo 2 | -------------------------------------------------------------------------------- /scss/tmp: -------------------------------------------------------------------------------- 1 | yo 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | .DS_Store 3 | -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Kibibit/achievibit-demo/master/favicon.ico -------------------------------------------------------------------------------- /images/header.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Kibibit/achievibit-demo/master/images/header.webp -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # achievibit-demo 2 | - Trying to create a game-like animation for achievibit's homepage. 3 | - Trying to create a character that follows you on screen when you hit certain marks (it rushes to follow you) 4 | - This is a demo to test the animations and performance while working on this 5 | -------------------------------------------------------------------------------- /license.txt: -------------------------------------------------------------------------------- 1 | 2 | 3 | 17 | -------------------------------------------------------------------------------- /ScrollMagic_2.0.3_plugins_animation.gsap.min.js: -------------------------------------------------------------------------------- 1 | /*! ScrollMagic v2.0.3 | (c) 2015 Jan Paepke (@janpaepke) | license & info: http://janpaepke.github.io/ScrollMagic */ 2 | !function(e,n){"function"==typeof define&&define.amd?define(["ScrollMagic","TweenMax","TimelineMax"],n):"object"==typeof exports?(require("gsap"),n(require("scrollmagic"),TweenMax,TimelineMax)):n(e.ScrollMagic||e.jQuery&&e.jQuery.ScrollMagic,e.TweenMax||e.TweenLite,e.TimelineMax||e.TimelineLite)}(this,function(e,n,r){"use strict";e.Scene.addOption("tweenChanges",!1,function(e){return!!e}),e.Scene.extend(function(){var e,t=this;t.on("progress.plugin_gsap",function(){i()}),t.on("destroy.plugin_gsap",function(e){t.removeTween(e.reset)});var i=function(){if(e){var n=t.progress(),r=t.state();e.repeat&&-1===e.repeat()?"DURING"===r&&e.paused()?e.play():"DURING"===r||e.paused()||e.pause():n!=e.progress()&&(0===t.duration()?n>0?e.play():e.reverse():t.tweenChanges()&&e.tweenTo?e.tweenTo(n*e.duration()):e.progress(n).pause())}};t.setTween=function(o,a,s){var u;arguments.length>1&&(arguments.length<3&&(s=a,a=1),o=n.to(o,a,s));try{u=r?new r({smoothChildTiming:!0}).add(o):o,u.pause()}catch(p){return t}return e&&t.removeTween(),e=u,o.repeat&&-1===o.repeat()&&(e.repeat(-1),e.yoyo(o.yoyo())),i(),t},t.removeTween=function(n){return e&&(n&&e.progress(0).pause(),e.kill(),e=void 0),t}})}); -------------------------------------------------------------------------------- /jquery.gsap.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * VERSION: 0.1.12 3 | * DATE: 2018-02-15 4 | * UPDATES AND DOCS AT: http://greensock.com/jquery-gsap-plugin/ 5 | * 6 | * Requires TweenLite version 1.8.0 or higher and CSSPlugin. 7 | * 8 | * @license Copyright (c) 2013-2018, GreenSock. All rights reserved. 9 | * This work is subject to the terms at http://greensock.com/standard-license or for 10 | * Club GreenSock members, the software agreement that was issued with your membership. 11 | * 12 | * @author: Jack Doyle, jack@greensock.com 13 | */ 14 | !function(a){"use strict";var b,c,d,e=a.fn.animate,f=a.fn.stop,g=!0,h=function(a){var b,c={};for(b in a)c[b]=a[b];return c},i={overwrite:1,delay:1,useFrames:1,runBackwards:1,easeParams:1,yoyo:1,immediateRender:1,repeat:1,repeatDelay:1,autoCSS:1},j=",scrollTop,scrollLeft,show,hide,toggle,",k=j,l=function(a,b){for(var c in i)i[c]&&void 0!==a[c]&&(b[c]=a[c])},m=function(a){return function(b){return a.getRatio(b)}},n={},o=function(){var e,f,g,h=window.GreenSockGlobals||window;if(b=h.TweenMax||h.TweenLite,b&&(e=(b.version+".0.0").split("."),f=!(Number(e[0])>0&&Number(e[1])>7),h=h.com.greensock,c=h.plugins.CSSPlugin,n=h.easing.Ease.map||{}),!b||!c||f)return b=null,void(!d&&window.console&&(window.console.log("The jquery.gsap.js plugin requires the TweenMax (or at least TweenLite and CSSPlugin) JavaScript file(s)."+(f?" Version "+e.join(".")+" is too old.":"")),d=!0));if(a.easing){for(g in n)a.easing[g]=m(n[g]);o=!1}};a.fn.animate=function(d,f,i,j){if(d=d||{},o&&(o(),!b||!c))return e.call(this,d,f,i,j);if(!g||d.skipGSAP===!0||"object"==typeof f&&"function"==typeof f.step)return e.call(this,d,f,i,j);var m,p,q,r,s=a.speed(f,i,j),t={ease:n[s.easing]||(s.easing===!1?n.linear:n.swing)},u=this,v="object"==typeof f?f.specialEasing:null;for(p in d){if(m=d[p],m instanceof Array&&n[m[1]]&&(v=v||{},v[p]=m[1],m=m[0]),"show"===m||"hide"===m||"toggle"===m||-1!==k.indexOf(p)&&-1!==k.indexOf(","+p+","))return e.call(this,d,f,i,j);t[-1===p.indexOf("-")?p:a.camelCase(p)]=m}if(v){t=h(t),r=[];for(p in v)m=r[r.length]={},l(t,m),m.ease=n[v[p]]||t.ease,-1!==p.indexOf("-")&&(p=a.camelCase(p)),m[p]=t[p],delete t[p];0===r.length&&(r=null)}return q=function(c){var d,e=h(t);if(r)for(d=r.length;--d>-1;)b.to(this,a.fx.off?0:s.duration/1e3,r[d]);e.onComplete=function(){c?c():s.old&&a(this).each(s.old)},b.to(this,a.fx.off?0:s.duration/1e3,e)},s.queue!==!1?(u.queue(s.queue,q),"function"==typeof s.old&&a(u[u.length-1]).queue(s.queue,function(a){s.old.call(u),a()})):q.call(u),u},a.fn.stop=function(a,c){if(f.call(this,a,c),b){if(c)for(var d,e=b.getTweensOf(this),g=e.length;--g>-1;)d=e[g].totalTime()/e[g].totalDuration(),d>0&&1>d&&e[g].seek(e[g].totalDuration());b.killTweensOf(this)}return this},a.gsap={enabled:function(a){g=a},version:"0.1.12",legacyProps:function(a){k=j+a+","}}}(jQuery); -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | testing achievibit animation - with header 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
show marks
23 |
24 |
25 |
26 |
27 |
28 |
29 | 30 |
31 |
32 | 33 |
34 |
35 | menu 36 |
37 |
38 | 39 |
achievibit
40 |
41 |
42 | search 43 |
44 |
45 | 46 |
47 |
48 | more_vert 49 |
50 |
51 | 52 |
53 | 54 |
55 |
achievibit
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 | While the boy went down the road, he understood the meaning of being alone... 65 |
66 |
67 |
68 |
69 | He just started relazing that everything he knew was about to be destroyed... 70 |
71 |
72 |
73 |
74 | And that he'll have to protect his family with his own strength. 75 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
83 |
84 |
85 |
86 |
87 |
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
hero on hill
111 |
112 |
The End?
113 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | -------------------------------------------------------------------------------- /ScrollMagic_2.0.2_plugins_debug.addIndicators.min.js: -------------------------------------------------------------------------------- 1 | /*! ScrollMagic v2.0.2 | (c) 2015 Jan Paepke (@janpaepke) | license & info: http://janpaepke.github.io/ScrollMagic */ 2 | !function(e,r){"function"==typeof define&&define.amd?define(["ScrollMagic"],r):r("object"==typeof exports?require("scrollmagic"):e.ScrollMagic||e.jQuery&&e.jQuery.ScrollMagic)}(this,function(e){"use strict";var r="0.85em",t="9999",i=15,o=e._util,n=0;e.Scene.extend(function(){var e,r=this;r.addIndicators=function(t){if(!e){var i={name:"",indent:0,parent:void 0,colorStart:"green",colorEnd:"red",colorTrigger:"blue"};t=o.extend({},i,t),n++,e=new s(r,t),r.on("add.plugin_addIndicators",e.add),r.on("remove.plugin_addIndicators",e.remove),r.on("destroy.plugin_addIndicators",r.removeIndicators),r.controller()&&e.add()}return r},r.removeIndicators=function(){return e&&(e.remove(),this.off("*.plugin_addIndicators"),e=void 0),r}}),e.Controller.addOption("addIndicators",!1),e.Controller.extend(function(){var r=this,t=r.info(),n=t.container,s=t.isDocument,d=t.vertical,a={groups:[]};this._indicators=a;var g=function(){a.updateBoundsPositions()},p=function(){a.updateTriggerGroupPositions()};return n.addEventListener("resize",p),s||(window.addEventListener("resize",p),window.addEventListener("scroll",p)),n.addEventListener("resize",g),n.addEventListener("scroll",g),this._indicators.updateBoundsPositions=function(e){for(var r,t,s,g=e?[o.extend({},e.triggerGroup,{members:[e]})]:a.groups,p=g.length,u={},c=d?"left":"top",l=d?"width":"height",f=d?o.get.scrollLeft(n)+o.get.width(n)-i:o.get.scrollTop(n)+o.get.height(n)-i;p--;)for(s=g[p],r=s.members.length,t=o.get[l](s.element.firstChild);r--;)u[c]=f-t,o.css(s.members[r].bounds,u)},this._indicators.updateTriggerGroupPositions=function(e){for(var t,g,p,u,c,l=e?[e]:a.groups,f=l.length,m=s?document.body:n,h=s?{top:0,left:0}:o.get.offset(m,!0),v=d?o.get.width(n)-i:o.get.height(n)-i,b=d?"width":"height",G=d?"Y":"X";f--;)t=l[f],g=t.element,p=t.triggerHook*r.info("size"),u=o.get[b](g.firstChild.firstChild),c=p>u?"translate"+G+"(-100%)":"",o.css(g,{top:h.top+(d?p:v-t.members[0].options.indent),left:h.left+(d?v-t.members[0].options.indent:p)}),o.css(g.firstChild.firstChild,{"-ms-transform":c,"-webkit-transform":c,transform:c})},this._indicators.updateTriggerGroupLabel=function(e){var r="trigger"+(e.members.length>1?"":" "+e.members[0].options.name),t=e.element.firstChild.firstChild,i=t.textContent!==r;i&&(t.textContent=r,d&&a.updateBoundsPositions())},this.addScene=function(t){this._options.addIndicators&&t instanceof e.Scene&&t.controller()===r&&t.addIndicators(),this.$super.addScene.apply(this,arguments)},this.destroy=function(){n.removeEventListener("resize",p),s||(window.removeEventListener("resize",p),window.removeEventListener("scroll",p)),n.removeEventListener("resize",g),n.removeEventListener("scroll",g),this.$super.destroy.apply(this,arguments)},r});var s=function(e,r){var t,i,s=this,a=d.bounds(),g=d.start(r.colorStart),p=d.end(r.colorEnd),u=r.parent&&o.get.elements(r.parent)[0];r.name=r.name||n,g.firstChild.textContent+=" "+r.name,p.textContent+=" "+r.name,a.appendChild(g),a.appendChild(p),s.options=r,s.bounds=a,s.triggerGroup=void 0,this.add=function(){i=e.controller(),t=i.info("vertical");var r=i.info("isDocument");u||(u=r?document.body:i.info("container")),r||"static"!==o.css(u,"position")||o.css(u,{position:"relative"}),e.on("change.plugin_addIndicators",l),e.on("shift.plugin_addIndicators",c),G(),h(),setTimeout(function(){i._indicators.updateBoundsPositions(s)},0)},this.remove=function(){if(s.triggerGroup){if(e.off("change.plugin_addIndicators",l),e.off("shift.plugin_addIndicators",c),s.triggerGroup.members.length>1){var r=s.triggerGroup;r.members.splice(r.members.indexOf(s),1),i._indicators.updateTriggerGroupLabel(r),i._indicators.updateTriggerGroupPositions(r),s.triggerGroup=void 0}else b();m()}};var c=function(){h()},l=function(e){"triggerHook"===e.what&&G()},f=function(){var e=i.info("vertical");o.css(g.firstChild,{"border-bottom-width":e?1:0,"border-right-width":e?0:1,bottom:e?-1:r.indent,right:e?r.indent:-1,padding:e?"0 8px":"2px 4px"}),o.css(p,{"border-top-width":e?1:0,"border-left-width":e?0:1,top:e?"100%":"",right:e?r.indent:"",bottom:e?"":r.indent,left:e?"":"100%",padding:e?"0 8px":"2px 4px"}),u.appendChild(a)},m=function(){a.parentNode.removeChild(a)},h=function(){a.parentNode!==u&&f();var r={};r[t?"top":"left"]=e.triggerPosition(),r[t?"height":"width"]=e.duration(),o.css(a,r),o.css(p,{display:e.duration()>0?"":"none"})},v=function(){var n=d.trigger(r.colorTrigger),a={};a[t?"right":"bottom"]=0,a[t?"border-top-width":"border-left-width"]=1,o.css(n.firstChild,a),o.css(n.firstChild.firstChild,{padding:t?"0 8px 3px 8px":"3px 4px"}),document.body.appendChild(n);var g={triggerHook:e.triggerHook(),element:n,members:[s]};i._indicators.groups.push(g),s.triggerGroup=g,i._indicators.updateTriggerGroupLabel(g),i._indicators.updateTriggerGroupPositions(g)},b=function(){i._indicators.groups.splice(i._indicators.groups.indexOf(s.triggerGroup),1),s.triggerGroup.element.parentNode.removeChild(s.triggerGroup.element),s.triggerGroup=void 0},G=function(){var r=e.triggerHook(),t=1e-4;if(!(s.triggerGroup&&Math.abs(s.triggerGroup.triggerHook-r)b;b++)if(c=a[b],j(c))for(d=c.length,d=0;d":">")}},y=d.SplitText=b.SplitText=function(a,b){if("string"==typeof a&&(a=y.selector(a)),!a)throw"cannot split a null element.";this.elements=j(a)?k(a):[a],this.chars=[],this.words=[],this.lines=[],this._originals=[],this.vars=b||{},this.split(b)},z=function(a,b,c){var d=a.nodeType;if(1===d||9===d||11===d)for(a=a.firstChild;a;a=a.nextSibling)z(a,b,c);else(3===d||4===d)&&(a.nodeValue=a.nodeValue.split(b).join(c))},A=function(a,b){for(var c=b.length;--c>-1;)a.push(b[c])},B=function(a){var b,c=[],d=a.length;for(b=0;b!==d;c.push(a[b++]));return c},C=function(a,b,c){for(var d;a&&a!==b;){if(d=a._next||a.nextSibling)return d.textContent.charAt(0)===c;a=a.parentNode||a._parent}return!1},D=function(a){var b,c,d=B(a.childNodes),e=d.length;for(b=0;e>b;b++)c=d[b],c._isSplit?D(c):(b&&3===c.previousSibling.nodeType?c.previousSibling.nodeValue+=3===c.nodeType?c.nodeValue:c.firstChild.nodeValue:3!==c.nodeType&&a.insertBefore(c.firstChild,c),a.removeChild(c))},E=function(a,b,c,d,e,h,j){var k,l,m,n,o,p,q,r,s,t,u,v,w=g(a),x=i(a,"paddingLeft",w),y=-999,B=i(a,"borderBottomWidth",w)+i(a,"borderTopWidth",w),E=i(a,"borderLeftWidth",w)+i(a,"borderRightWidth",w),F=i(a,"paddingTop",w)+i(a,"paddingBottom",w),G=i(a,"paddingLeft",w)+i(a,"paddingRight",w),H=.2*i(a,"fontSize"),I=i(a,"textAlign",w,!0),J=[],K=[],L=[],M=b.wordDelimiter||" ",N=b.span?"span":"div",O=b.type||b.split||"chars,words,lines",P=e&&-1!==O.indexOf("lines")?[]:null,Q=-1!==O.indexOf("words"),R=-1!==O.indexOf("chars"),S="absolute"===b.position||b.absolute===!0,T=b.linesClass,U=-1!==(T||"").indexOf("++"),V=[];for(P&&1===a.children.length&&a.children[0]._isSplit&&(a=a.children[0]),U&&(T=T.split("++").join("")),l=a.getElementsByTagName("*"),m=l.length,o=[],k=0;m>k;k++)o[k]=l[k];if(P||S)for(k=0;m>k;k++)n=o[k],p=n.parentNode===a,(p||S||R&&!Q)&&(v=n.offsetTop,P&&p&&Math.abs(v-y)>H&&("BR"!==n.nodeName||0===k)&&(q=[],P.push(q),y=v),S&&(n._x=n.offsetLeft,n._y=v,n._w=n.offsetWidth,n._h=n.offsetHeight),P&&((n._isSplit&&p||!R&&p||Q&&p||!Q&&n.parentNode.parentNode===a&&!n.parentNode._isSplit)&&(q.push(n),n._x-=x,C(n,a,M)&&(n._wordEnd=!0)),"BR"===n.nodeName&&(n.nextSibling&&"BR"===n.nextSibling.nodeName||0===k)&&P.push([])));for(k=0;m>k;k++)n=o[k],p=n.parentNode===a,"BR"!==n.nodeName?(S&&(s=n.style,Q||p||(n._x+=n.parentNode._x,n._y+=n.parentNode._y),s.left=n._x+"px",s.top=n._y+"px",s.position="absolute",s.display="block",s.width=n._w+1+"px",s.height=n._h+"px"),!Q&&R?n._isSplit?(n._next=n.nextSibling,n.parentNode.appendChild(n)):n.parentNode._isSplit?(n._parent=n.parentNode,!n.previousSibling&&n.firstChild&&(n.firstChild._isFirst=!0),n.nextSibling&&" "===n.nextSibling.textContent&&!n.nextSibling.nextSibling&&V.push(n.nextSibling),n._next=n.nextSibling&&n.nextSibling._isFirst?null:n.nextSibling,n.parentNode.removeChild(n),o.splice(k--,1),m--):p||(v=!n.nextSibling&&C(n.parentNode,a,M),n.parentNode._parent&&n.parentNode._parent.appendChild(n),v&&n.parentNode.appendChild(f.createTextNode(" ")),b.span&&(n.style.display="inline"),J.push(n)):n.parentNode._isSplit&&!n._isSplit&&""!==n.innerHTML?K.push(n):R&&!n._isSplit&&(b.span&&(n.style.display="inline"),J.push(n))):P||S?(n.parentNode&&n.parentNode.removeChild(n),o.splice(k--,1),m--):Q||a.appendChild(n);for(k=V.length;--k>-1;)V[k].parentNode.removeChild(V[k]);if(P){for(S&&(t=f.createElement(N),a.appendChild(t),u=t.offsetWidth+"px",v=t.offsetParent===a?0:a.offsetLeft,a.removeChild(t)),s=a.style.cssText,a.style.cssText="display:none;";a.firstChild;)a.removeChild(a.firstChild);for(r=" "===M&&(!S||!Q&&!R),k=0;kl;l++)"BR"!==q[l].nodeName&&(n=q[l],t.appendChild(n),r&&n._wordEnd&&t.appendChild(f.createTextNode(" ")),S&&(0===l&&(t.style.top=n._y+"px",t.style.left=x+v+"px"),n.style.top="0px",v&&(n.style.left=n._x-v+"px")));0===m?t.innerHTML=" ":Q||R||(D(t),z(t,String.fromCharCode(160)," ")),S&&(t.style.width=u,t.style.height=n._h+"px"),a.appendChild(t)}a.style.cssText=s}S&&(j>a.clientHeight&&(a.style.height=j-F+"px",a.clientHeighta.clientWidth&&(a.style.width=h-G+"px",a.clientWidth":"",G=!0,H=f.createElement("div"),I=a.parentNode;for(I.insertBefore(H,a),H.textContent=a.nodeValue,I.removeChild(a),a=H,g=e(a),v=-1!==g.indexOf("<"),b.reduceWhiteSpace!==!1&&(g=g.replace(m," ").replace(l,"")),v&&(g=g.split("<").join("{{LT}}")),k=g.length,h=(" "===g.charAt(0)?E:"")+c(),i=0;k>i;i++)if(p=g.charAt(i),p===D&&g.charAt(i-1)!==D&&i){for(h+=G?F:"",G=!1;g.charAt(i+1)===D;)h+=E,i++;i===k-1?h+=E:")"!==g.charAt(i+1)&&(h+=E+c(),G=!0)}else"{"===p&&"{{LT}}"===g.substr(i,6)?(h+=B?d()+"{{LT}}":"{{LT}}",i+=5):p.charCodeAt(0)>=n&&p.charCodeAt(0)<=o||g.charCodeAt(i+1)>=65024&&g.charCodeAt(i+1)<=65039?(w=u(g.substr(i,2)),x=u(g.substr(i+2,2)),j=w>=q&&r>=w&&x>=q&&r>=x||x>=s&&t>=x?4:2,h+=B&&" "!==p?d()+g.substr(i,j)+"":g.substr(i,j),i+=j-1):h+=B&&" "!==p?d()+p+"":p;a.outerHTML=h+(G?F:""),v&&z(I,"{{LT}}","<")},G=function(a,b,c,d){var e,f,g=B(a.childNodes),h=g.length,j="absolute"===b.position||b.absolute===!0;if(3!==a.nodeType||h>1){for(b.absolute=!1,e=0;h>e;e++)f=g[e],(3!==f.nodeType||/\S+/.test(f.nodeValue))&&(j&&3!==f.nodeType&&"inline"===i(f,"display",null,!0)&&(f.style.display="inline-block",f.style.position="relative"),f._isSplit=!0,G(f,b,c,d));return b.absolute=j,void(a._isSplit=!0)}F(a,b,c,d)},H=y.prototype;H.split=function(a){this.isSplit&&this.revert(),this.vars=a=a||this.vars,this._originals.length=this.chars.length=this.words.length=this.lines.length=0;for(var b,c,d,e=this.elements.length,f=a.span?"span":"div",g=x(a.wordsClass,f),h=x(a.charsClass,f);--e>-1;)d=this.elements[e],this._originals[e]=d.innerHTML,b=d.clientHeight,c=d.clientWidth,G(d,a,g,h),E(d,a,this.chars,this.words,this.lines,c,b);return this.chars.reverse(),this.words.reverse(),this.lines.reverse(),this.isSplit=!0,this},H.revert=function(){if(!this._originals)throw"revert() call wasn't scoped properly.";for(var a=this._originals.length;--a>-1;)this.elements[a].innerHTML=this._originals[a];return this.chars=[],this.words=[],this.lines=[],this.isSplit=!1,this},y.selector=a.$||a.jQuery||function(b){var c=a.$||a.jQuery;return c?(y.selector=c,c(b)):"undefined"==typeof document?b:document.querySelectorAll?document.querySelectorAll(b):document.getElementById("#"===b.charAt(0)?b.substr(1):b)},y.version="0.5.8"}(_gsScope),function(a){"use strict";var b=function(){return(_gsScope.GreenSockGlobals||_gsScope)[a]};"undefined"!=typeof module&&module.exports?module.exports=b():"function"==typeof define&&define.amd&&define([],b)}("SplitText"); -------------------------------------------------------------------------------- /css/style.css: -------------------------------------------------------------------------------- 1 | .hud { 2 | background: rgba(0, 0, 0, 0.3); 3 | bottom: 0; 4 | font-family: 'Lucida Console', Monaco, monospace; 5 | font-size: 10px; 6 | left: 0; 7 | letter-spacing: 1px; 8 | line-height: 1.6; 9 | padding: 4px 8px; 10 | pointer-events: none; 11 | position: fixed; 12 | user-select: none; 13 | z-index: 5000; 14 | } 15 | 16 | .rpg-text-box.always-show div div { 17 | opacity: 1 !important; 18 | } 19 | 20 | .rpg-text-box { 21 | background: white; 22 | border: 1px solid white; 23 | border-radius: 0.2em; 24 | box-shadow: 0 1px 0 1px black, inset 0 1px 0 1px black, 0 0 0 1px black, inset 0 0 0 1px black, 3px 5px 0 1px rgba(0, 0, 0, 0.25); 25 | font-family: 'Press Start 2P', cursive; 26 | font-size: 0.7rem; 27 | left: 0; 28 | line-height: 1.5em; 29 | margin: auto; 30 | max-width: 35vw; 31 | opacity: 0; 32 | padding: 1em; 33 | position: absolute; 34 | top: 93%; 35 | transform: translate(0, 50px); 36 | transition: all 250ms; 37 | } 38 | 39 | .achievibit-logo { 40 | font-family: 'Press Start 2P', cursive; 41 | font-size: 14px; 42 | } 43 | 44 | footer.page-footer { 45 | background: url('http://yesofcorsa.com/wp-content/uploads/2016/12/Pixel-Wallpaper-Background.jpg'); 46 | background-size: contain; 47 | padding: 10px; 48 | } 49 | 50 | .end { 51 | display: flex; 52 | height: 300px; 53 | 54 | align-items: center; 55 | justify-content: center; 56 | } 57 | 58 | .hero-fight-parallax { 59 | background-color: grey; 60 | /* fight scene fills the screen when the parallax 61 | hits the sweet spot. */ 62 | height: 100vh; 63 | overflow: hidden; 64 | position: relative; 65 | z-index: 10; 66 | } 67 | 68 | .hero-fight-parallax .background { 69 | background: url('https://i.pinimg.com/originals/69/14/6e/69146e0d788557d18530d37e139999d7.gif'); 70 | background-position: bottom; 71 | background-size: cover; 72 | height: 100vh; 73 | position: absolute; 74 | top: 0; 75 | width: 100vw; 76 | z-index: 0; 77 | } 78 | 79 | .hero-fight-parallax .monster { 80 | background: url('https://vignette.wikia.nocookie.net/bloodbattaliongame/images/b/b7/Kraken_Figure.png/revision/latest?cb=20131002170845'); 81 | background-size: cover; 82 | bottom: 0; 83 | height: 70%; 84 | left: 0; 85 | margin: auto; 86 | position: absolute; 87 | right: 0; 88 | width: 475px; 89 | } 90 | 91 | .hero-fight-parallax .shadow-hero { 92 | background-color: black; 93 | bottom: 0; 94 | color: white; 95 | height: 40%; 96 | left: 0; 97 | margin: auto; 98 | position: absolute; 99 | right: 0; 100 | width: 200px; 101 | } 102 | 103 | .test-test-test { 104 | overflow: hidden; 105 | padding: 300px 100px 0; 106 | } 107 | 108 | .main { 109 | min-height: 100%; 110 | overflow-x: hidden; 111 | position: relative; 112 | width: 100vw; 113 | } 114 | 115 | .app-header { 116 | background: transparent; 117 | box-shadow: 0 2px 5px transparent; 118 | color: #FFFFFF; 119 | display: block; 120 | height: 300px; 121 | left: 0; 122 | position: fixed; 123 | top: 0; 124 | -webkit-transform: translateZ(0); 125 | width: 100%; 126 | z-index: 15; 127 | } 128 | 129 | .app-header .background-container { 130 | bottom: 0; 131 | left: 0; 132 | overflow: hidden; 133 | position: absolute; 134 | right: 0; 135 | top: 0; 136 | } 137 | 138 | .app-header .background { 139 | background-size: cover; 140 | bottom: -5px; 141 | left: -5px; 142 | pointer-events: none; 143 | position: absolute; 144 | right: -5px; 145 | top: -5px; 146 | 147 | will-change: transform, opacity; 148 | } 149 | 150 | .app-header #background-back { 151 | background: rgba(0, 0, 0, 0.5); 152 | background-position: left center; 153 | opacity: 0; 154 | 155 | -webkit-backdrop-filter: blur(5px); 156 | backdrop-filter: blur(5px); 157 | filter: blur(2px); 158 | } 159 | 160 | .app-header #background-front { 161 | background-image: url(../images/header.webp); 162 | background-position: left center; 163 | } 164 | 165 | .app-header .header-content { 166 | height: 100%; 167 | position: relative; 168 | width: 100%; 169 | } 170 | 171 | .app-header .header-content .app-toolbar { 172 | display: flex; 173 | flex-direction: row; 174 | font-size: 14px; 175 | height: 64px; 176 | padding: 0 16px; 177 | pointer-events: none; 178 | position: relative; 179 | 180 | align-items: center; 181 | } 182 | 183 | .app-header .header-content #large-toolbar { 184 | bottom: 0; 185 | margin-bottom: 24px; 186 | margin-bottom: 16px; 187 | position: absolute; 188 | transform-origin: left top; 189 | width: 100%; 190 | } 191 | 192 | .app-header .header-content .small-title, 193 | .app-header .header-content .large-title { 194 | font-family: 'Press Start 2P', cursive; 195 | font-weight: 400; 196 | line-height: 1.5; 197 | overflow: hidden; 198 | position: relative; 199 | transform-origin: left top; 200 | white-space: nowrap; 201 | 202 | flex: 1; 203 | flex-basis: 0.000000001px; 204 | } 205 | 206 | .app-header .header-content .small-title { 207 | margin-left: 14px; 208 | opacity: 0; 209 | } 210 | 211 | .app-header .header-content .large-title { 212 | font-size: 56px; 213 | font-size: 2em; 214 | margin-left: 64px; 215 | 216 | will-change: transform, opacity; 217 | } 218 | 219 | .app-header .header-content .icon-button { 220 | box-sizing: border-box !important; 221 | display: inline-block; 222 | font-size: 0; 223 | height: 40px; 224 | line-height: 1; 225 | outline: none; 226 | padding: 6px; 227 | position: relative; 228 | user-select: none; 229 | width: 40px; 230 | } 231 | 232 | .app-header .header-content .icon-button .icon { 233 | display: inline-flex; 234 | height: 100%; 235 | position: relative; 236 | vertical-align: middle; 237 | width: 100%; 238 | 239 | align-items: center; 240 | fill: currentcolor; 241 | justify-content: center; 242 | stroke: none; 243 | } 244 | 245 | .btn { 246 | background: black; 247 | color: white; 248 | cursor: pointer; 249 | display: none; 250 | padding: 10px; 251 | position: absolute; 252 | right: 0; 253 | text-transform: uppercase; 254 | top: 0; 255 | z-index: 500; 256 | 257 | text-weight: 700; 258 | } 259 | 260 | .debug .btn { 261 | display: block; 262 | } 263 | 264 | .debug .corner { 265 | background: #6B5428 !important; 266 | } 267 | 268 | .debug .mark { 269 | visibility: visible; 270 | } 271 | 272 | .house { 273 | background: url(https://orig00.deviantart.net/a07d/f/2015/051/9/c/pokemon_house_2__free__by_sallynyan-d8is9w6.png); 274 | height: 158px; 275 | left: 0; 276 | margin: 0 100px; 277 | position: absolute; 278 | top: 10px; 279 | width: 417px; 280 | } 281 | 282 | .house.pos2 { 283 | left: auto; 284 | right: 0; 285 | top: calc(300px + 50px); 286 | } 287 | 288 | .house.pos2 .rpg-text-box { 289 | left: auto; 290 | right: 0; 291 | } 292 | 293 | .house.pos3 { 294 | top: calc(300px + 50px + 300px + 50px); 295 | } 296 | 297 | .house.visible .rpg-text-box { 298 | opacity: 1; 299 | transform: translate(0, 0); 300 | } 301 | 302 | html { 303 | box-sizing: border-box; 304 | } 305 | 306 | *, 307 | *:before, 308 | *:after { 309 | box-sizing: inherit; 310 | 311 | -webkit-font-smoothing: antialiased; 312 | } 313 | 314 | body { 315 | background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/154887/Routetut.png); 316 | margin: 0; 317 | overflow-x: hidden; 318 | padding: 0; 319 | width: 100vw; 320 | } 321 | 322 | .container { 323 | margin: 0 auto; 324 | max-width: 1000px; 325 | position: relative; 326 | width: 100%; 327 | } 328 | 329 | .pre-road { 330 | background: #B69F66; 331 | height: 600px; 332 | margin-right: auto; 333 | position: absolute; 334 | top: -600px; 335 | width: 50px; 336 | } 337 | 338 | .road { 339 | background: #B69F66; 340 | height: 300px; 341 | margin-right: auto; 342 | position: relative; 343 | width: 50px; 344 | } 345 | 346 | .road.road-right { 347 | margin-left: auto; 348 | margin-right: 0; 349 | } 350 | 351 | .road .character { 352 | top: -43px; 353 | } 354 | 355 | .road .mark { 356 | background: red; 357 | height: 1px; 358 | position: absolute; 359 | top: 50%; 360 | visibility: hidden; 361 | width: 100%; 362 | } 363 | 364 | .road .mark:after { 365 | color: red; 366 | content: 'mark'; 367 | display: block; 368 | text-align: center; 369 | width: 100%; 370 | } 371 | 372 | .road .mark.mark-end { 373 | top: 100%; 374 | } 375 | 376 | .horizontal-part { 377 | display: inline-block; 378 | display: -webkit-box; 379 | display: -moz-box; 380 | display: -ms-flexbox; 381 | display: -webkit-flex; 382 | display: flex; 383 | height: 50px; 384 | position: relative; 385 | width: calc(100% - 50px); 386 | } 387 | 388 | .horizontal-part .character { 389 | background-position-y: -42px; 390 | } 391 | 392 | .horizontal-part .character.reverse { 393 | background-position-y: -124px; 394 | } 395 | 396 | .horizontal-part.left-to-right .corner { 397 | border-bottom-left-radius: 50%; 398 | } 399 | 400 | .horizontal-part.left-to-right .corner:last-of-type { 401 | border-bottom-left-radius: 0; 402 | border-top-right-radius: 50%; 403 | position: absolute; 404 | right: -50px; 405 | } 406 | 407 | .horizontal-part.right-to-left .character { 408 | background-position-y: -124px; 409 | left: auto; 410 | right: 9px; 411 | } 412 | 413 | .horizontal-part.right-to-left .character.reverse { 414 | background-position-y: -42px; 415 | } 416 | 417 | .horizontal-part.right-to-left .corner { 418 | border-top-left-radius: 50%; 419 | } 420 | 421 | .horizontal-part.right-to-left .corner:last-of-type { 422 | border-bottom-right-radius: 50%; 423 | border-top-left-radius: 0; 424 | position: absolute; 425 | right: -50px; 426 | } 427 | 428 | .horizontal-part .horizontal-road { 429 | background: #B69F66; 430 | height: 100%; 431 | width: calc(100% - 50px); 432 | } 433 | 434 | .horizontal-part .corner { 435 | background: #B69F66; 436 | height: 50px; 437 | width: 50px; 438 | } 439 | 440 | .crow { 441 | background: url(http://spritedatabase.net/files/ds/62/Sprite/Crow.PNG); 442 | background-position-y: -36px; 443 | height: 60px; 444 | opacity: 0; 445 | position: absolute; 446 | right: 200px; 447 | top: 600px; 448 | width: 40px; 449 | } 450 | 451 | .character { 452 | background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/154887/char-fixed.png); 453 | height: 40px; 454 | left: 9px; 455 | opacity: 0; 456 | position: absolute; 457 | top: 6px; 458 | width: 32px; 459 | z-index: 3; 460 | } 461 | 462 | .character.reverse { 463 | background-position-y: -82px; 464 | } 465 | 466 | .character.active { 467 | opacity: 1; 468 | } 469 | 470 | .character:after { 471 | background: black; 472 | border-radius: 50%; 473 | bottom: -2px; 474 | content: ''; 475 | height: 8px; 476 | left: 0; 477 | margin: auto; 478 | opacity: 0.2; 479 | position: absolute; 480 | right: 0; 481 | width: 90%; 482 | } 483 | -------------------------------------------------------------------------------- /scss/style.scss: -------------------------------------------------------------------------------- 1 | $margin: 100px; 2 | $headerHeight: 300px; 3 | $toolbarHeight: 64px; 4 | 5 | .rpg-text-box { 6 | position: absolute; 7 | top: 93%; 8 | line-height: 1.5em; 9 | margin: auto; 10 | background: white; 11 | border: 1px solid white; 12 | padding: 1em; 13 | font-size: 0.7rem; 14 | font-family: 'Press Start 2P', cursive; 15 | border-radius: 0.2em; 16 | box-shadow: 0 1px 0 1px black, 17 | inset 0 1px 0 1px black, 18 | 0 0 0 1px black, 19 | inset 0 0 0 1px black, 20 | 3px 5px 0px 1px rgba(0, 0, 0, 0.25); 21 | opacity: 0; 22 | transform: translate(0, 50px); 23 | transition: all 250ms; 24 | } 25 | 26 | .achievibit-logo { 27 | font-family: 'Press Start 2P', cursive; 28 | font-size: 14px; 29 | } 30 | 31 | footer.page-footer { 32 | background: url("http://yesofcorsa.com/wp-content/uploads/2016/12/Pixel-Wallpaper-Background.jpg"); 33 | background-size: contain; 34 | padding: 10px; 35 | } 36 | 37 | .end { 38 | display: flex; 39 | justify-content: center; 40 | align-items: center; 41 | height: $headerHeight; 42 | } 43 | 44 | .hero-fight-parallax { 45 | /* fight scene fills the screen when the parallax 46 | hits the sweet spot. */ 47 | height: 100vh; 48 | background-color: grey; 49 | position: relative; 50 | overflow: hidden; 51 | z-index: 10; 52 | 53 | .background { 54 | background: url("https://i.pinimg.com/originals/69/14/6e/69146e0d788557d18530d37e139999d7.gif"); 55 | width: 100vw; 56 | height: 100vh; 57 | background-size: cover; 58 | background-position: bottom; 59 | z-index: 0; 60 | position: absolute; 61 | top: 0; 62 | } 63 | 64 | .monster { 65 | width: 475px; 66 | height: 70%; 67 | background: url("https://vignette.wikia.nocookie.net/bloodbattaliongame/images/b/b7/Kraken_Figure.png/revision/latest?cb=20131002170845"); 68 | background-size: cover; 69 | position: absolute; 70 | bottom: 0; 71 | left: 0; 72 | right: 0; 73 | margin: auto; 74 | } 75 | 76 | .shadow-hero { 77 | background-color: black; 78 | width: 200px; 79 | height: 40%; 80 | position: absolute; 81 | bottom: 0; 82 | left: 0; 83 | right: 0; 84 | margin: auto; 85 | color: white; 86 | } 87 | } 88 | 89 | .main { 90 | padding: $headerHeight 100px 0; 91 | position: relative; 92 | width: 100vw; 93 | min-height: 100%; 94 | padding-top: $headerHeight; 95 | } 96 | 97 | .app-header { 98 | display: block; 99 | background: transparent; 100 | position: fixed; 101 | top: 0; 102 | left: 0; 103 | width: 100%; 104 | color: #fff; 105 | height: $headerHeight; 106 | box-shadow: 0 2px 5px rgba(0,0,0,0); 107 | z-index: 15; 108 | // a fix for mobile chrome header 109 | // bug? 110 | -webkit-transform: translateZ(0); 111 | 112 | .background-container { 113 | position: absolute; 114 | overflow: hidden; 115 | top: 0; 116 | left: 0; 117 | bottom: 0; 118 | right: 0; 119 | } 120 | 121 | .background { 122 | pointer-events: none; 123 | position: absolute; 124 | background-size: cover; 125 | // height: 100%; 126 | top: -5px; 127 | left: -5px; 128 | bottom: -5px; 129 | right: -5px; 130 | will-change: transform, opacity; 131 | } 132 | 133 | #background-back { 134 | // background: transparent; 135 | // background-image: url(http://yesofcorsa.com/wp-content/uploads/2016/12/Pixel-Wallpaper-Background.jpg); 136 | // background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/154887/Routetut.png); 137 | background: rgba(0, 0, 0, 0.5); 138 | -webkit-backdrop-filter: blur(5px); 139 | backdrop-filter: blur(5px); 140 | background-position: left center; 141 | filter: blur(2px); 142 | opacity: 0; 143 | // visibility: hidden; 144 | } 145 | 146 | #background-front { 147 | background-image: url(../images/header.webp); 148 | background-position: left center; 149 | } 150 | 151 | .header-content { 152 | position: relative; 153 | height: 100%; 154 | width: 100%; 155 | 156 | .app-toolbar { 157 | display: flex; 158 | flex-direction: row; 159 | align-items: center; 160 | position: relative; 161 | height: $toolbarHeight; 162 | padding: 0 16px; 163 | pointer-events: none; 164 | font-size: 14px; 165 | } 166 | 167 | #large-toolbar { 168 | position: absolute; 169 | bottom: 0; 170 | transform-origin: left top; 171 | margin-bottom: 24px; 172 | margin-bottom: 16px; 173 | width: 100%; 174 | } 175 | 176 | .small-title, 177 | .large-title { 178 | transform-origin: left top; 179 | white-space: nowrap; 180 | flex: 1; 181 | flex-basis: 0.000000001px; 182 | overflow: hidden; 183 | font-weight: 400; 184 | line-height: 1.5; 185 | position: relative; 186 | font-family: 'Press Start 2P', cursive; 187 | } 188 | 189 | .small-title { 190 | margin-left: 14px; 191 | // visibility: hidden; 192 | opacity: 0; 193 | } 194 | 195 | .large-title { 196 | will-change: transform, opacity; 197 | font-size: 56px; 198 | font-size: 2em; 199 | margin-left: 64px; 200 | } 201 | 202 | .icon-button { 203 | display: inline-block; 204 | position: relative; 205 | padding: 6px; 206 | outline: none; 207 | user-select: none; 208 | font-size: 0; 209 | line-height: 1; 210 | width: 40px; 211 | height: 40px; 212 | box-sizing: border-box !important; 213 | 214 | .icon { 215 | display: inline-flex; 216 | align-items: center; 217 | justify-content: center; 218 | position: relative; 219 | vertical-align: middle; 220 | fill: currentcolor; 221 | stroke: none; 222 | width: 100%; 223 | height: 100%; 224 | } 225 | } 226 | } 227 | } 228 | 229 | .btn { 230 | z-index: 500; 231 | padding: 10px; 232 | text-transform: uppercase; 233 | position: absolute; 234 | top: 0; 235 | right: 0; 236 | background: black; 237 | color: white; 238 | text-weight: 700; 239 | cursor: pointer; 240 | } 241 | 242 | .preview { 243 | .btn { 244 | display: none; 245 | } 246 | 247 | .corner { 248 | background: #B69F66 !important; 249 | } 250 | 251 | .mark { 252 | visibility: hidden; 253 | } 254 | } 255 | 256 | .house { 257 | position: absolute; 258 | top: calc(150px - 80px); 259 | left: 0; 260 | margin: 0 100px; 261 | background: url(https://orig00.deviantart.net/a07d/f/2015/051/9/c/pokemon_house_2__free__by_sallynyan-d8is9w6.png); 262 | height: 158px; 263 | width: 417px; 264 | // opacity: 0; 265 | // transform: translate(0, 50px); 266 | // transition: all 250ms; 267 | 268 | &.pos2 { 269 | top: calc(300px + 50px + 150px - 80px); 270 | left: auto; 271 | right: 0; 272 | } 273 | 274 | &.pos3 { 275 | top: calc(300px + 50px + 300px + 50px + 150px - 80px); 276 | } 277 | 278 | &.visible .rpg-text-box { 279 | opacity: 1; 280 | transform: translate(0, 0); 281 | } 282 | } 283 | 284 | html { 285 | box-sizing: border-box; 286 | } 287 | 288 | *, *:before, *:after { 289 | box-sizing: inherit; 290 | -webkit-font-smoothing: antialiased; 291 | } 292 | 293 | body { 294 | width: 100%; 295 | overflow-x: hidden; 296 | margin: 0; 297 | padding: 0; 298 | background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/154887/Routetut.png); 299 | } 300 | 301 | .container { 302 | margin: 0 auto; 303 | max-width: 1000px; 304 | position: relative; 305 | width: 100%; 306 | } 307 | 308 | .pre-road { 309 | width: 50px; 310 | height: 300px; 311 | margin-right: auto; 312 | background: #B69F66; 313 | position: absolute; 314 | top: -300px; 315 | } 316 | 317 | .road { 318 | width: 50px; 319 | height: 300px; 320 | margin-right: auto; 321 | background: #B69F66; 322 | position: relative; 323 | 324 | &.road-right { 325 | margin-right: 0; 326 | margin-left: auto; 327 | } 328 | 329 | .character { 330 | top: -43px; 331 | } 332 | 333 | .mark { 334 | position: absolute; 335 | width: 100%; 336 | top: 50%; 337 | background: red; 338 | height: 1px; 339 | 340 | &:after { 341 | content: "mark"; 342 | text-align: center; 343 | width: 100%; 344 | display: block; 345 | color: red; 346 | } 347 | 348 | &.mark-end { 349 | top: 100%; 350 | } 351 | } 352 | } 353 | 354 | .horizontal-part { 355 | height: 50px; 356 | width: calc(100% - 50px); 357 | display: inline-block; 358 | display: -webkit-box; 359 | display: -moz-box; 360 | display: -ms-flexbox; 361 | display: -webkit-flex; 362 | display: flex; 363 | position: relative; 364 | 365 | .character { 366 | background-position-y: -42px; 367 | 368 | &.reverse { 369 | background-position-y: -124px; 370 | } 371 | } 372 | 373 | &.left-to-right { 374 | .corner { 375 | border-bottom-left-radius: 50%; 376 | } 377 | 378 | .corner:last-of-type { 379 | border-top-right-radius: 50%; 380 | border-bottom-left-radius: 0; 381 | position: absolute; 382 | right: -50px; 383 | } 384 | } 385 | 386 | &.right-to-left { 387 | .character { 388 | left: auto; 389 | right: 9px; 390 | background-position-y: -124px; 391 | 392 | &.reverse { 393 | background-position-y: -42px; 394 | } 395 | } 396 | .corner { 397 | border-top-left-radius: 50%; 398 | } 399 | 400 | .corner:last-of-type { 401 | border-bottom-right-radius: 50%; 402 | border-top-left-radius: 0; 403 | position: absolute; 404 | right: -50px; 405 | } 406 | } 407 | 408 | .horizontal-road { 409 | background: #B69F66; 410 | height: 100%; 411 | width: calc(100% - 50px); 412 | } 413 | 414 | .corner { 415 | // background: #B69F66; 416 | background: #6B5428; 417 | height: 50px; 418 | width: 50px; 419 | } 420 | } 421 | 422 | .crow { 423 | background: url(http://spritedatabase.net/files/ds/62/Sprite/Crow.PNG); 424 | background-position-y: -36px; 425 | width: 40px; 426 | height: 60px; 427 | position: absolute; 428 | top: 600px; 429 | right: 200px; 430 | opacity: 0; 431 | } 432 | 433 | .character { 434 | background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/154887/char-fixed.png); 435 | width: 32px; height:40px; 436 | position: absolute; 437 | top: 6px; 438 | left: 9px; 439 | z-index: 3; 440 | opacity: 0; 441 | 442 | &.reverse { 443 | background-position-y: -82px; 444 | } 445 | 446 | &.active { 447 | opacity: 1; 448 | } 449 | 450 | &:after { 451 | content: ""; 452 | position: absolute; 453 | bottom: -2px; 454 | background: black; 455 | height: 8px; 456 | width: 90%; 457 | left: 0; 458 | right: 0; 459 | border-radius: 50%; 460 | margin: auto; 461 | opacity: 0.2 462 | } 463 | } -------------------------------------------------------------------------------- /js/index.js: -------------------------------------------------------------------------------- 1 | console.clear(); 2 | 3 | $(document).ready(function() { 4 | var ANIMATIONS = {}; 5 | 6 | var SCENES = {}; 7 | 8 | var SELECTORS = { 9 | DEBUG_BUTTON: '.btn', 10 | ANIMATION_CONTAINER: 'body', 11 | MARK_HEADER: '#mark-header', 12 | MARK_CHARACTER_FIRST: '#mark1', 13 | MARK_CHARACTER_SECOND: '#mark2', 14 | MARK_CHARACTER_THIRD: '#mark3', 15 | MARK_CHARACTER_END: '#mark4', 16 | MARK_FIGHT_SCENE_START: '#mark4', 17 | TEXT_BOX_1: '#text1', 18 | TEXT_BOX_2: '#text2', 19 | TEXT_BOX_3: '#text3' 20 | }; 21 | 22 | FPS(30 /* framesThreshold */ , 23 | 2 /* dropsThreshold */ , 24 | false /* alwaysTrigger */ , 25 | true /* showDebugBox */ ) 26 | .on('drops-limit', function(totalDrops) { 27 | console.log('~= Animation degradation triggered =~'); 28 | 29 | if (ANIMATIONS.text1) { 30 | ANIMATIONS.text1.seek(0).kill(); 31 | ANIMATIONS.text2.seek(0).kill(); 32 | ANIMATIONS.text3.seek(0).kill(); 33 | // don't play the fight scene 34 | SCENES.fightScene.destroy(true); 35 | ANIMATIONS.fight.seek('-=0').kill(); 36 | 37 | $('.rpg-text-box').addClass('always-show'); 38 | numberOfDrops = 0; 39 | 40 | ANIMATIONS.text1 = ANIMATIONS.text2 = ANIMATIONS.text3 = { 41 | play: function() {} 42 | }; 43 | } 44 | }); 45 | 46 | var $container = $(SELECTORS.ANIMATION_CONTAINER); 47 | var $debugButton = $(SELECTORS.DEBUG_BUTTON); 48 | 49 | // add preview class to animation container to hide the marks 50 | $container.toggleClass('preview'); 51 | 52 | /* make debug button toggle preview class on animation container. 53 | to show the button, remove the next class from inside the 54 | .preview class: 55 | .btn { 56 | display: none; 57 | } */ 58 | $debugButton.click(function() { 59 | $container.toggleClass('preview'); 60 | }); 61 | 62 | // create a scene controller, and add 3 scenees: 63 | // * header - make the header shrink along the scrollbar. 64 | // * character - handles all animation in the character section, 65 | // including the text and background animations. 66 | // * fight scene - makes the scroll `pause` for a moment 67 | // and play the hero \ monster fight scene in fullscreen. 68 | var controller = createSceneController(); 69 | addHeaderScene(controller); 70 | addCharacterScenes(controller); 71 | addFightScene(controller); 72 | 73 | /* ****** * 74 | * SCENES * 75 | * ****** */ 76 | 77 | function createSceneController() { 78 | return new ScrollMagic.Controller(); 79 | } 80 | 81 | function addHeaderScene(controller) { 82 | var headerAnimationObject = createHeaderAnimation(); 83 | 84 | ANIMATIONS.header = headerAnimationObject.header; 85 | 86 | var headerScene = new ScrollMagic.Scene({ 87 | triggerElement: SELECTORS.MARK_HEADER, 88 | duration: headerAnimationObject.duration, 89 | triggerHook: 0 90 | }) 91 | .setTween(headerAnimationObject.header) 92 | .addTo(controller); 93 | } 94 | 95 | function addCharacterScenes(controller) { 96 | var character = createCharacterAnimation(); 97 | 98 | // rpg text boxes 99 | var textAnimation1 = createTextAnimation(SELECTORS.TEXT_BOX_1); 100 | var textAnimation2 = createTextAnimation(SELECTORS.TEXT_BOX_2); 101 | var textAnimation3 = createTextAnimation(SELECTORS.TEXT_BOX_3); 102 | 103 | ANIMATIONS.text1 = textAnimation1; 104 | ANIMATIONS.text2 = textAnimation2; 105 | ANIMATIONS.text3 = textAnimation3; 106 | 107 | var characterScene1 = new ScrollMagic.Scene({ 108 | triggerElement: SELECTORS.MARK_CHARACTER_FIRST, 109 | triggerHook: 0.7 110 | }) 111 | .on('enter', function() { 112 | character.runToPoint(1, 0.4 /* specificTimeScale */ )(); 113 | textAnimation1.play(0); 114 | console.log('entered first char loc'); 115 | }) 116 | .on('leave', character.runToPoint(0)) 117 | .setClassToggle('#house1', 'visible') 118 | .addTo(controller); 119 | 120 | var characterScene2 = new ScrollMagic.Scene({ 121 | triggerElement: SELECTORS.MARK_CHARACTER_SECOND, 122 | triggerHook: 0.7 123 | }) 124 | .on('enter', function() { 125 | character.runToPoint(5)(); 126 | textAnimation2.play(0); 127 | console.log('entered second char loc'); 128 | }) 129 | .on('leave', character.runToPoint(1)) 130 | .setClassToggle('#house2', 'visible') 131 | .addTo(controller); 132 | 133 | var characterScene3 = new ScrollMagic.Scene({ 134 | triggerElement: SELECTORS.MARK_CHARACTER_THIRD, 135 | triggerHook: 0.7 136 | }) 137 | .on('enter', function() { 138 | character.runToPoint(9)(); 139 | textAnimation3.play(0); 140 | console.log('entered third char loc'); 141 | }) 142 | .on('leave', character.runToPoint(5)) 143 | .setClassToggle('#house3', 'visible') 144 | .addTo(controller); 145 | 146 | var characterScene4 = new ScrollMagic.Scene({ 147 | triggerElement: SELECTORS.MARK_CHARACTER_END, 148 | triggerHook: 'onCenter' 149 | }) 150 | .on('enter', character.runToPoint(10)) 151 | .on('leave', character.runToPoint(9)) 152 | .addTo(controller); 153 | } 154 | 155 | function addFightScene(controller) { 156 | ANIMATIONS.fight = createFightAnimation(); 157 | 158 | SCENES.fightScene = new ScrollMagic.Scene({ 159 | triggerElement: SELECTORS.MARK_FIGHT_SCENE_START, 160 | duration: "200%", // two times the height? 161 | triggerHook: 0 162 | }) 163 | .setPin(".hero-fight-parallax") 164 | .setTween(ANIMATIONS.fight) 165 | .on('enter', function() { 166 | console.log('fight scene!'); 167 | }) 168 | .addTo(controller); 169 | } 170 | 171 | /* ********** * 172 | * ANIMATIONS * 173 | * ********** */ 174 | 175 | function createTextAnimation(id) { 176 | if (!id) return; 177 | 178 | // if (lowestFrameRate < 40) return; 179 | 180 | var mySplitText = new SplitText(id, { 181 | type: 'words,chars' 182 | }); 183 | var chars = mySplitText.chars; 184 | 185 | var tl = new TimelineMax({ 186 | paused: true 187 | }); 188 | tl.staggerFrom(chars, 0.8, { 189 | opacity: 0, 190 | ease: SteppedEase.config(1) 191 | }, 0.1, "+=0"); 192 | 193 | return tl; 194 | } 195 | 196 | function createCrowAnimation() { 197 | var crowAnimation = new TimelineMax({ 198 | repeat: -1 199 | }); 200 | 201 | crowAnimation.set('#crow', { 202 | opacity: 1, 203 | backgroundPositionX: "-79px" 204 | }); 205 | crowAnimation.fromTo('#crow', 2, { 206 | backgroundPositionX: "-79px", 207 | }, { 208 | backgroundPositionX: "-374px", 209 | ease: SteppedEase.config(8) 210 | }, 3); 211 | crowAnimation.set('#crow', { 212 | opacity: 1, 213 | backgroundPositionX: "-79px" 214 | }); 215 | crowAnimation.fromTo('#crow', 2, { 216 | backgroundPositionX: "-79px", 217 | }, { 218 | backgroundPositionX: "0px", 219 | ease: SteppedEase.config(2) 220 | }); 221 | 222 | return crowAnimation; 223 | } 224 | 225 | function createCharacterAnimation() { 226 | var characterObject = {}; 227 | 228 | var characterAnimation = new TimelineMax({ 229 | paused: true 230 | }); 231 | 232 | characterAnimation.set('.road .character#char1', { 233 | opacity: 1 234 | }); 235 | characterAnimation.fromTo('.road .character#char1', 0.75, { 236 | backgroundPositionX: "0", 237 | immediateRender: false 238 | }, { 239 | repeat: -1, 240 | backgroundPositionX: "-96px", 241 | ease: SteppedEase.config(3) 242 | }, 0); 243 | characterAnimation.to('.road .character#char1', 2, { 244 | top: '100%', 245 | ease: Power0.easeNone 246 | }, 0); 247 | 248 | characterAnimation.set('.character#char1', { 249 | opacity: 0 250 | }, 2); 251 | 252 | characterAnimation.set('.character#char2', { 253 | opacity: 1 254 | }, 2); 255 | 256 | characterAnimation.fromTo('.character#char2', 0.75, { 257 | immediateRender: false, 258 | backgroundPositionX: "0", 259 | }, { 260 | repeat: -1, 261 | backgroundPositionX: "-96px", 262 | ease: SteppedEase.config(3) 263 | }, 2); 264 | 265 | characterAnimation.to('.character#char2', 2, { 266 | left: '100%', 267 | ease: Power0.easeNone 268 | }, 2); 269 | 270 | characterAnimation.set('.character#char2', { 271 | opacity: 0 272 | }, 4); 273 | 274 | characterAnimation.set('.character#char3', { 275 | opacity: 1 276 | }, 4); 277 | 278 | characterAnimation.fromTo('.character#char3', 0.75, { 279 | backgroundPositionX: "0", 280 | immediateRender: false 281 | }, { 282 | repeat: -1, 283 | backgroundPositionX: "-96px", 284 | ease: SteppedEase.config(3) 285 | }, 4); 286 | 287 | characterAnimation.to('.character#char3', 2, { 288 | top: '100%', 289 | ease: Power0.easeNone 290 | }, 4); 291 | 292 | characterAnimation.set('.character#char3', { 293 | opacity: 0 294 | }, 6); 295 | 296 | characterAnimation.set('.character#char4', { 297 | opacity: 1 298 | }, 6); 299 | 300 | characterAnimation.fromTo('.character#char4', 0.75, { 301 | backgroundPositionX: "0", 302 | immediateRender: false 303 | }, { 304 | repeat: -1, 305 | backgroundPositionX: "-96px", 306 | ease: SteppedEase.config(3) 307 | }, 6); 308 | 309 | characterAnimation.fromTo('.character#char4', 2, { 310 | left: '100%' 311 | }, { 312 | left: '0%', 313 | ease: Power0.easeNone 314 | }, 6); 315 | 316 | characterAnimation.set('.character#char4', { 317 | opacity: 0 318 | }, 8); 319 | 320 | characterAnimation.set('.character#char5', { 321 | opacity: 1 322 | }, 8); 323 | 324 | characterAnimation.fromTo('.character#char5', 0.75, { 325 | backgroundPositionX: "0", 326 | immediateRender: false 327 | }, { 328 | repeat: -1, 329 | backgroundPositionX: "-96px", 330 | ease: SteppedEase.config(3) 331 | }, 8); 332 | 333 | characterAnimation.to('.character#char5', 2, { 334 | top: '100%', 335 | ease: Power0.easeNone 336 | }, 8); 337 | 338 | characterObject.animation = characterAnimation; 339 | characterObject.runToPoint = runToPoint; 340 | 341 | return characterObject; 342 | 343 | function runToPoint(point, specificTimeScale) { 344 | return function() { 345 | var currLocation = 346 | characterObject.animation.duration() * 347 | characterObject.animation.progress(); 348 | var destination = point || 0; 349 | setDirection(currLocation, destination); 350 | 351 | characterObject.animation 352 | .tweenTo(destination, { 353 | ease: Power0.easeInOut 354 | }) 355 | .timeScale(specificTimeScale || 356 | getSpeed(currLocation, destination)); 357 | }; 358 | } 359 | 360 | function setDirection(currLocation, destination) { 361 | var isForward = destination - currLocation >= 0; 362 | 363 | isForward ? $('.character').removeClass('reverse') : $('.character').addClass('reverse'); 364 | } 365 | 366 | function getSpeed(currLocation, destination) { 367 | var speed = Math.abs(destination - currLocation) / 4; 368 | speed = speed < 0.4 ? 0.4 : speed; 369 | return speed; 370 | } 371 | } 372 | 373 | function createFightAnimation() { 374 | var monster = document.querySelector("#monster"); 375 | var hero = document.querySelector("#shadow-hero"); 376 | 377 | var _fightAnimation = new TimelineLite() 378 | .fromTo(monster, 3, { 379 | bottom: '-70%' 380 | }, { 381 | bottom: '0%' 382 | }, 1) 383 | .fromTo(hero, 4, { 384 | bottom: '0%' 385 | }, { 386 | bottom: '-10%' 387 | }, 0); 388 | 389 | return _fightAnimation; 390 | } 391 | 392 | function createHeaderAnimation() { 393 | var header = document.querySelector("#app-header"); 394 | var bgBack = document.querySelector("#background-back"); 395 | var bgFront = document.querySelector("#background-front"); 396 | var toolbar = document.querySelector("#small-toolbar"); 397 | var largeTitle = document.querySelector("#large-title"); 398 | var smallTitle = document.querySelector("#small-title"); 399 | 400 | var deltaHeight = header.offsetHeight - toolbar.offsetHeight; 401 | 402 | var rect1 = smallTitle.getBoundingClientRect(); 403 | var rect2 = largeTitle.getBoundingClientRect(); 404 | 405 | var scale = rect1.height / rect2.height; 406 | var x = rect1.left - rect2.left; 407 | var y = rect1.top - rect2.top; 408 | 409 | var headerAnimation = new TimelineLite() 410 | .to(largeTitle, 1, { 411 | scale: scale, 412 | x: x, 413 | y: deltaHeight + y 414 | }, 0) 415 | .to(header, 1, { 416 | y: -deltaHeight 417 | }, 0) 418 | .to(toolbar, 1, { 419 | y: deltaHeight 420 | }, 0) 421 | .to(bgBack, 1, { 422 | y: deltaHeight / 2 423 | }, 0) 424 | .to(bgFront, 1, { 425 | y: deltaHeight / 2 426 | }, 0) 427 | .to(bgBack, 1, { 428 | alpha: 1 429 | }, 0) 430 | .to(bgFront, 1, { 431 | alpha: 0 432 | }, 0) 433 | .set(smallTitle, { 434 | alpha: 1 435 | }, 1) 436 | .set(largeTitle, { 437 | alpha: 0 438 | }, 1) 439 | .to(header, 0.4, { 440 | boxShadow: "0 2px 5px rgba(0,0,0,0.2)", 441 | ease: Power1.easeOut 442 | }, 0.6); 443 | 444 | return { 445 | header: headerAnimation, 446 | duration: deltaHeight 447 | }; 448 | } 449 | 450 | function FPS(framesThreshold, dropsThreshold, alwaysTrigger, showDebugBox) { 451 | var self = {}; 452 | 453 | self.framesThreshold = framesThreshold || 30; 454 | self.dropsThreshold = dropsThreshold || 2; 455 | self.firstDropsTrigger = true; 456 | 457 | toEmitter(self); 458 | 459 | if (showDebugBox) { 460 | $('body').append([ 461 | '
', 462 | 'FPS: 0; ', 463 | 'lowest FPS: null; ', 464 | 'DROPS Below ', self.framesThreshold, 'FPS: 0', 465 | '
' 466 | ].join('')); 467 | } 468 | 469 | var $framerate = showDebugBox ? document.querySelector("#framerate") : {}; 470 | var $lowest = showDebugBox ? document.querySelector("#lowest") : {}; 471 | var $drops = showDebugBox ? document.querySelector("#drops") : {}; 472 | var prevTime = 0; 473 | var frames = 0; 474 | var ticker = TweenLite.ticker; 475 | 476 | var lowestFrameRate = -1; 477 | var numberOfDrops = 0; 478 | 479 | ticker.addEventListener("tick", update); 480 | 481 | return self; 482 | 483 | function update() { 484 | 485 | var current = ticker.time; 486 | 487 | frames++; 488 | 489 | if (current > prevTime + 1) { 490 | var fps = Math.round(frames / (current - prevTime)); 491 | $framerate.textContent = fps; 492 | prevTime = current; 493 | frames = 0; 494 | 495 | if (lowestFrameRate === -1) { 496 | lowestFrameRate = fps; 497 | $lowest.textContent = lowestFrameRate; 498 | 499 | self.trigger('lowest-initialized', lowestFrameRate); 500 | } 501 | 502 | if (fps < lowestFrameRate) { 503 | lowestFrameRate = fps; 504 | console.info('lowest framerate: ' + lowestFrameRate); 505 | $lowest.textContent = lowestFrameRate; 506 | 507 | self.trigger('lowest-updated', lowestFrameRate); 508 | } 509 | 510 | if (fps < self.framesThreshold) { 511 | numberOfDrops++; 512 | $drops.textContent = numberOfDrops; 513 | 514 | self.trigger('drops-updated', lowestFrameRate); 515 | } 516 | 517 | if ((alwaysTrigger || self.firstDropsTrigger) && numberOfDrops >= self.dropsThreshold) { 518 | self.trigger('drops-limit', numberOfDrops); 519 | self.firstDropsTrigger = false; 520 | $drops.textContent = numberOfDrops; 521 | } 522 | } 523 | } 524 | } 525 | 526 | }); 527 | 528 | function toEmitter(obj) { 529 | obj.eventHash = {}; 530 | 531 | obj.trigger = function() { 532 | var eventName = arguments[0]; 533 | var args = Array.prototype.slice.call(arguments, 1); 534 | 535 | if (obj.eventHash[eventName]) 536 | obj.eventHash[eventName].forEach(function(handler) { 537 | handler.apply(this, args); 538 | }); 539 | } 540 | 541 | obj.on = function(eventName, handler) { 542 | (obj.eventHash[eventName]) ? 543 | obj.eventHash[eventName].push(handler): 544 | obj.eventHash[eventName] = [handler]; 545 | } 546 | } 547 | -------------------------------------------------------------------------------- /utils/Draggable.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * VERSION: 0.16.2 3 | * DATE: 2018-02-15 4 | * UPDATES AND DOCS AT: http://greensock.com 5 | * 6 | * Requires TweenLite and CSSPlugin version 1.17.0 or later (TweenMax contains both TweenLite and CSSPlugin). ThrowPropsPlugin is required for momentum-based continuation of movement after the mouse/touch is released (ThrowPropsPlugin is a membership benefit of Club GreenSock - http://greensock.com/club/). 7 | * 8 | * @license Copyright (c) 2008-2018, GreenSock. All rights reserved. 9 | * This work is subject to the terms at http://greensock.com/standard-license or for 10 | * Club GreenSock members, the software agreement that was issued with your membership. 11 | * 12 | * @author: Jack Doyle, jack@greensock.com 13 | */ 14 | var _gsScope="undefined"!=typeof module&&module.exports&&"undefined"!=typeof global?global:this||window;(_gsScope._gsQueue||(_gsScope._gsQueue=[])).push(function(){"use strict";_gsScope._gsDefine("utils.Draggable",["events.EventDispatcher","TweenLite","plugins.CSSPlugin"],function(a,b,c){var d,e,f,g,h,i,j,k,l,m={css:{},data:"_draggable"},n={css:{},data:"_draggable"},o={css:{},data:"_draggable"},p={css:{}},q=_gsScope._gsDefine.globals,r={},s={style:{}},t=_gsScope.document||{createElement:function(){return s}},u=t.documentElement||{},v=function(a){return t.createElementNS?t.createElementNS("http://www.w3.org/1999/xhtml",a):t.createElement(a)},w=v("div"),x=[],y=function(){return!1},z=180/Math.PI,A=999999999999999,B=Date.now||function(){return(new Date).getTime()},C=!(t.addEventListener||!t.all),D=t.createElement("div"),E=[],F={},G=0,H=/^(?:a|input|textarea|button|select)$/i,I=0,J=_gsScope.navigator&&-1!==_gsScope.navigator.userAgent.toLowerCase().indexOf("android"),K=0,L={},M={},N=function(a){if("string"==typeof a&&(a=b.selector(a)),!a||a.nodeType)return[a];var c,d=[],e=a.length;for(c=0;c!==e;d.push(a[c++]));return d},O=function(a,b){var c,d={};if(b)for(c in a)d[c]=a[c]*b;else for(c in a)d[c]=a[c];return d},P=function(){for(var a=E.length;--a>-1;)E[a]()},Q=function(a){E.push(a),1===E.length&&b.ticker.addEventListener("tick",P,this,!1,1)},R=function(a){for(var c=E.length;--c>-1;)E[c]===a&&E.splice(c,1);b.to(S,0,{overwrite:"all",delay:15,onComplete:S,data:"_draggable"})},S=function(){E.length||b.ticker.removeEventListener("tick",P)},T=function(a,b){var c;for(c in b)void 0===a[c]&&(a[c]=b[c]);return a},U=function(){return null!=window.pageYOffset?window.pageYOffset:null!=t.scrollTop?t.scrollTop:u.scrollTop||t.body.scrollTop||0},V=function(){return null!=window.pageXOffset?window.pageXOffset:null!=t.scrollLeft?t.scrollLeft:u.scrollLeft||t.body.scrollLeft||0},W=function(a,b){Ja(a,"scroll",b),Y(a.parentNode)||W(a.parentNode,b)},X=function(a,b){Ka(a,"scroll",b),Y(a.parentNode)||X(a.parentNode,b)},Y=function(a){return!(a&&a!==u&&a!==t&&a!==t.body&&a!==window&&a.nodeType&&a.parentNode)},Z=function(a,b){var c="x"===b?"Width":"Height",d="scroll"+c,e="client"+c,f=t.body;return Math.max(0,Y(a)?Math.max(u[d],f[d])-(window["inner"+c]||u[e]||f[e]):a[d]-a[e])},$=function(a){var b=Y(a),c=Z(a,"x"),d=Z(a,"y");b?a=M:$(a.parentNode),a._gsMaxScrollX=c,a._gsMaxScrollY=d,a._gsScrollX=a.scrollLeft||0,a._gsScrollY=a.scrollTop||0},_=function(a,b){return a=a||window.event,r.pageX=a.clientX+t.body.scrollLeft+u.scrollLeft,r.pageY=a.clientY+t.body.scrollTop+u.scrollTop,b&&(a.returnValue=!1),r},aa=function(a){return a?("string"==typeof a&&(a=b.selector(a)),a.length&&a!==window&&a[0]&&a[0].style&&!a.nodeType&&(a=a[0]),a===window||a.nodeType&&a.style?a:null):a},ba=function(a,b){var c,e,f,g=a.style;if(void 0===g[b]){for(f=["O","Moz","ms","Ms","Webkit"],e=5,c=b.charAt(0).toUpperCase()+b.substr(1);--e>-1&&void 0===g[f[e]+c];);if(0>e)return"";d=3===e?"ms":f[e],b=d+c}return b},ca=function(a,b,c){var d=a.style;d&&(void 0===d[b]&&(b=ba(a,b)),null==c?d.removeProperty?d.removeProperty(b.replace(/([A-Z])/g,"-$1").toLowerCase()):d.removeAttribute(b):void 0!==d[b]&&(d[b]=c))},da=t.defaultView?t.defaultView.getComputedStyle:y,ea=/(?:Left|Right|Width)/i,fa=/(?:\d|\-|\+|=|#|\.)*/g,ga=function(a,b,c,d,e){if("px"===d||!d)return c;if("auto"===d||!c)return 0;var f,g=ea.test(b),h=a,i=w.style,j=0>c;return j&&(c=-c),"%"===d&&-1!==b.indexOf("border")?f=c/100*(g?a.clientWidth:a.clientHeight):(i.cssText="border:0 solid red;position:"+ia(a,"position",!0)+";line-height:0;","%"!==d&&h.appendChild?i[g?"borderLeftWidth":"borderTopWidth"]=c+d:(h=a.parentNode||t.body,i[g?"width":"height"]=c+d),h.appendChild(w),f=parseFloat(w[g?"offsetWidth":"offsetHeight"]),h.removeChild(w),0!==f||e||(f=ga(a,b,c,d,!0))),j?-f:f},ha=function(a,b){if("absolute"!==ia(a,"position",!0))return 0;var c="left"===b?"Left":"Top",d=ia(a,"margin"+c,!0);return a["offset"+c]-(ga(a,b,parseFloat(d),(d+"").replace(fa,""))||0)},ia=function(a,b,c){var d,e=(a._gsTransform||{})[b];return e||0===e?e:(a.style[b]?e=a.style[b]:(d=da(a))?(e=d.getPropertyValue(b.replace(/([A-Z])/g,"-$1").toLowerCase()),e=e||d.length?e:d[b]):a.currentStyle&&(e=a.currentStyle[b]),"auto"!==e||"top"!==b&&"left"!==b||(e=ha(a,b)),c?e:parseFloat(e)||0)},ja=function(a,b,c){var d=a.vars,e=d[c],f=a._listeners[b];"function"==typeof e&&e.apply(d[c+"Scope"]||d.callbackScope||a,d[c+"Params"]||[a.pointerEvent]),f&&a.dispatchEvent(b)},ka=function(a,b){var c,d,e,f=aa(a);return f?Ea(f,b):void 0!==a.left?(e=ya(b),{left:a.left-e.x,top:a.top-e.y,width:a.width,height:a.height}):(d=a.min||a.minX||a.minRotation||0,c=a.min||a.minY||0,{left:d,top:c,width:(a.max||a.maxX||a.maxRotation||0)-d,height:(a.max||a.maxY||0)-c})},la=function(){if(!t.createElementNS)return g=0,void(h=!1);var a,b,c,d,e=v("div"),f=t.createElementNS("http://www.w3.org/2000/svg","svg"),l=v("div"),m=e.style,n=t.body||u,o="flex"===ia(n,"display",!0);t.body&&oa&&(m.position="absolute",n.appendChild(l),l.appendChild(e),d=e.offsetParent,l.style[oa]="rotate(1deg)",k=e.offsetParent===d,l.style.position="absolute",m.height="10px",d=e.offsetTop,l.style.border="5px solid red",j=d!==e.offsetTop,n.removeChild(l)),m=f.style,f.setAttributeNS(null,"width","400px"),f.setAttributeNS(null,"height","400px"),f.setAttributeNS(null,"viewBox","0 0 400 400"),m.display="block",m.boxSizing="border-box",m.border="0px solid red",m.transform="none",e.style.cssText="width:100px;height:100px;overflow:scroll;-ms-overflow-style:none;",n.appendChild(e),e.appendChild(f),c=f.createSVGPoint().matrixTransform(f.getScreenCTM()),b=c.y,e.scrollTop=100,c.x=c.y=0,c=c.matrixTransform(f.getScreenCTM()),i=b-c.y<100.1?0:b-c.y-150,e.removeChild(f),n.removeChild(e),n.appendChild(f),o&&(n.style.display="block"),a=f.getScreenCTM(),b=a.e,m.border="50px solid red",a=f.getScreenCTM(),0===b&&0===a.e&&0===a.f&&1===a.a?(g=1,h=!0):(g=b!==a.e?1:0,h=1!==a.a),o&&(n.style.display="flex"),n.removeChild(f)},ma=""!==ba(w,"perspective"),na=ba(w,"transformOrigin").replace(/^ms/g,"Ms").replace(/([A-Z])/g,"-$1").toLowerCase(),oa=ba(w,"transform"),pa=oa.replace(/^ms/g,"Ms").replace(/([A-Z])/g,"-$1").toLowerCase(),qa={},ra={},sa=_gsScope.SVGElement,ta=function(a){return!!(sa&&"function"==typeof a.getBBox&&a.getCTM&&(!a.parentNode||a.parentNode.getBBox&&a.parentNode.getCTM))},ua=(/MSIE ([0-9]{1,}[\.0-9]{0,})/.exec(navigator.userAgent)||/Trident\/.*rv:([0-9]{1,}[\.0-9]{0,})/.exec(navigator.userAgent))&&parseFloat(RegExp.$1)<11,va=[],wa=[],xa=function(a){if(!a.getBoundingClientRect||!a.parentNode||!oa)return{offsetTop:0,offsetLeft:0,scaleX:1,scaleY:1,offsetParent:u};if(Ta.cacheSVGData!==!1&&a._dCache&&a._dCache.lastUpdate===b.ticker.frame)return a._dCache;var c,d,e,f,j,k,l,m,n,o,p,q,r=a,s=za(a);if(s.lastUpdate=b.ticker.frame,a.getBBox&&!s.isSVGRoot){for(r=a.parentNode,c=a.getBBox();r&&"svg"!==(r.nodeName+"").toLowerCase();)r=r.parentNode;return f=xa(r),s.offsetTop=c.y*f.scaleY,s.offsetLeft=c.x*f.scaleX,s.scaleX=f.scaleX,s.scaleY=f.scaleY,s.offsetParent=r||u,s}for(e=s.offsetParent,e===t.body&&(e=u),wa.length=va.length=0;r&&(j=ia(r,oa,!0),"matrix(1, 0, 0, 1, 0, 0)"!==j&&"none"!==j&&"translate3d(0px, 0px, 0px)"!==j&&(wa.push(r),va.push(r.style[oa]),r.style[oa]="none"),r!==e);)r=r.parentNode;for(d=e.getBoundingClientRect(),j=a.getScreenCTM(),m=a.createSVGPoint(),l=m.matrixTransform(j),m.x=m.y=10,m=m.matrixTransform(j),s.scaleX=(m.x-l.x)/10,s.scaleY=(m.y-l.y)/10,void 0===g&&la(),s.borderBox&&!h&&a.getAttribute("width")&&(f=da(a)||{},n=parseFloat(f.borderLeftWidth)+parseFloat(f.borderRightWidth)||0,o=parseFloat(f.borderTopWidth)+parseFloat(f.borderBottomWidth)||0,p=parseFloat(f.width)||0,q=parseFloat(f.height)||0,s.scaleX*=(p-n)/p,s.scaleY*=(q-o)/q),i?(c=a.getBoundingClientRect(),s.offsetLeft=c.left-d.left,s.offsetTop=c.top-d.top):(s.offsetLeft=l.x-d.left,s.offsetTop=l.y-d.top),s.offsetParent=e,k=wa.length;--k>-1;)wa[k].style[oa]=va[k];return s},ya=function(a,c){if(c=c||{},!a||a===u||!a.parentNode||a===window)return{x:0,y:0};var d=da(a),e=na&&d?d.getPropertyValue(na):"50% 50%",f=e.split(" "),g=-1!==e.indexOf("left")?"0%":-1!==e.indexOf("right")?"100%":f[0],h=-1!==e.indexOf("top")?"0%":-1!==e.indexOf("bottom")?"100%":f[1];return("center"===h||null==h)&&(h="50%"),("center"===g||isNaN(parseFloat(g)))&&(g="50%"),a.getBBox&&ta(a)?(a._gsTransform||(b.set(a,{x:"+=0",overwrite:!1}),void 0===a._gsTransform.xOrigin&&console.log("Draggable requires at least GSAP 1.17.0")),e=a.getBBox(),c.x=a._gsTransform.xOrigin-e.x,c.y=a._gsTransform.yOrigin-e.y):(a.getBBox&&-1!==(g+h).indexOf("%")&&(a=a.getBBox(),a={offsetWidth:a.width,offsetHeight:a.height}),c.x=-1!==g.indexOf("%")?a.offsetWidth*parseFloat(g)/100:parseFloat(g),c.y=-1!==h.indexOf("%")?a.offsetHeight*parseFloat(h)/100:parseFloat(h)),c},za=function(a){if(Ta.cacheSVGData!==!1&&a._dCache&&a._dCache.lastUpdate===b.ticker.frame)return a._dCache;var c,d=a._dCache=a._dCache||{},e=da(a),f=a.getBBox&&ta(a),g="svg"===(a.nodeName+"").toLowerCase();if(d.isSVG=f,d.isSVGRoot=g,d.borderBox="border-box"===e.boxSizing,d.computedStyle=e,g)c=a.parentNode||u,c.insertBefore(w,a),d.offsetParent=w.offsetParent||u,c.removeChild(w);else if(f){for(c=a.parentNode;c&&"svg"!==(c.nodeName+"").toLowerCase();)c=c.parentNode;d.offsetParent=c}else d.offsetParent=a.offsetParent;return d},Aa=function(a,b,c,d,e){if(a===window||!a||!a.style||!a.parentNode)return[1,0,0,1,0,0];var f,h,i,l,m,n,o,p,q,r,s,v,w,x,y=a._dCache||za(a),z=a.parentNode,A=z._dCache||za(z),B=y.computedStyle,C=y.isSVG?A.offsetParent:z.offsetParent;return f=y.isSVG&&-1!==(a.style[oa]+"").indexOf("matrix")?a.style[oa]:B?B.getPropertyValue(pa):a.currentStyle?a.currentStyle[oa]:"1,0,0,1,0,0",a.getBBox&&-1!==(a.getAttribute("transform")+"").indexOf("matrix")&&(f=a.getAttribute("transform")),f=(f+"").match(/(?:\-|\.|\b)(\d|\.|e\-)+/g)||[1,0,0,1,0,0],f.length>6&&(f=[f[0],f[1],f[4],f[5],f[12],f[13]]),d?f[4]=f[5]=0:y.isSVG&&(m=a._gsTransform)&&(m.xOrigin||m.yOrigin)&&(f[0]=parseFloat(f[0]),f[1]=parseFloat(f[1]),f[2]=parseFloat(f[2]),f[3]=parseFloat(f[3]),f[4]=parseFloat(f[4])-(m.xOrigin-(m.xOrigin*f[0]+m.yOrigin*f[2])),f[5]=parseFloat(f[5])-(m.yOrigin-(m.xOrigin*f[1]+m.yOrigin*f[3]))),b&&(void 0===g&&la(),i=y.isSVG||y.isSVGRoot?xa(a):a,y.isSVG?(l=a.getBBox(),r=A.isSVGRoot?{x:0,y:0}:z.getBBox(),i={offsetLeft:l.x-r.x,offsetTop:l.y-r.y,offsetParent:y.offsetParent}):y.isSVGRoot?(s=parseInt(B.borderTopWidth,10)||0,v=parseInt(B.borderLeftWidth,10)||0,w=(f[0]-g)*v+f[2]*s,x=f[1]*v+(f[3]-g)*s,n=b.x,o=b.y,p=n-(n*f[0]+o*f[2]),q=o-(n*f[1]+o*f[3]),f[4]=parseFloat(f[4])+p,f[5]=parseFloat(f[5])+q,b.x-=p,b.y-=q,n=i.scaleX,o=i.scaleY,e||(b.x*=n,b.y*=o),f[0]*=n,f[1]*=o,f[2]*=n,f[3]*=o,ua||(b.x+=w,b.y+=x),C===t.body&&i.offsetParent===u&&(C=u)):!j&&a.offsetParent&&(b.x+=parseInt(ia(a.offsetParent,"borderLeftWidth"),10)||0,b.y+=parseInt(ia(a.offsetParent,"borderTopWidth"),10)||0),h=z===u||z===t.body,f[4]=Number(f[4])+b.x+(i.offsetLeft||0)-c.x-(h?0:z.scrollLeft||0),f[5]=Number(f[5])+b.y+(i.offsetTop||0)-c.y-(h?0:z.scrollTop||0),z&&"fixed"===ia(a,"position",B)&&(f[4]+=V(),f[5]+=U()),!z||z===u||C!==i.offsetParent||A.isSVG||k&&"100100"!==Aa(z).join("")||(i=A.isSVGRoot?xa(z):z,f[4]-=i.offsetLeft||0,f[5]-=i.offsetTop||0,j||!A.offsetParent||y.isSVG||y.isSVGRoot||(f[4]-=parseInt(ia(A.offsetParent,"borderLeftWidth"),10)||0,f[5]-=parseInt(ia(A.offsetParent,"borderTopWidth"),10)||0))),f},Ba=function(a,b){if(!a||a===window||!a.parentNode)return[1,0,0,1,0,0];for(var c,d,e,f,g,h,i,j,k=ya(a,qa),l=ya(a.parentNode,ra),m=Aa(a,k,l,!1,!b);(a=a.parentNode)&&a.parentNode&&a!==u;)k=l,l=ya(a.parentNode,k===qa?ra:qa),i=Aa(a,k,l),c=m[0],d=m[1],e=m[2],f=m[3],g=m[4],h=m[5],m[0]=c*i[0]+d*i[2],m[1]=c*i[1]+d*i[3],m[2]=e*i[0]+f*i[2],m[3]=e*i[1]+f*i[3],m[4]=g*i[0]+h*i[2]+i[4],m[5]=g*i[1]+h*i[3]+i[5];return b&&(c=m[0],d=m[1],e=m[2],f=m[3],g=m[4],h=m[5],j=c*f-d*e,m[0]=f/j,m[1]=-d/j,m[2]=-e/j,m[3]=c/j,m[4]=(e*h-f*g)/j,m[5]=-(c*h-d*g)/j),m},Ca=function(a,b,c,d,e){a=aa(a);var f=Ba(a,!1,e),g=b.x,h=b.y;return c&&(ya(a,b),g-=b.x,h-=b.y),d=d===!0?b:d||{},d.x=g*f[0]+h*f[2]+f[4],d.y=g*f[1]+h*f[3]+f[5],d},Da=function(a,b,c){var d=a.x*b[0]+a.y*b[2]+b[4],e=a.x*b[1]+a.y*b[3]+b[5];return a.x=d*c[0]+e*c[2]+c[4],a.y=d*c[1]+e*c[3]+c[5],a},Ea=function(a,b,c){if(!(a=aa(a)))return null;b=aa(b);var d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,v,w,x,y,z,A,B=a.getBBox&&ta(a);if(a===window)g=U(),e=V(),f=e+(u.clientWidth||a.innerWidth||t.body.clientWidth||0),h=g+((a.innerHeight||0)-20b;b++)if(c=a[b],Fa(c))for(d=c.length,d=0;d-1;)d[b[e]]=c[e],d[c[e]]=b[e];return d}("touchstart,touchmove,touchend,touchcancel"),Ja=function(a,b,c,d){a.addEventListener?(a.addEventListener(Ia[b],c,d),b!==Ia[b]&&a.addEventListener(b,c,d)):a.attachEvent&&a.attachEvent("on"+b,c)},Ka=function(a,b,c){a.removeEventListener?(a.removeEventListener(Ia[b],c),b!==Ia[b]&&a.removeEventListener(b,c)):a.detachEvent&&a.detachEvent("on"+b,c)},La=function(a,b){for(var c=a.length;--c>-1;)if(a[c].identifier===b)return!0;return!1},Ma=function(a){e=a.touches&&Ih;h++)g[h]=O(b[h],e);else for(h=0;i>h;h++)g[h]=b[h]*e;c+=1.1,d-=1.1}else"function"==typeof b?j.end=function(c){var d,f,g=b.call(a,c);if(1!==e)if("object"==typeof g){d={};for(f in g)d[f]=g[f]*e;g=d}else g*=e;return g}:j.end=b;return(c||0===c)&&(j.max=c),(d||0===d)&&(j.min=d),f&&(j.velocity=0),j},Pa=function(a){var b;return a&&a.getAttribute&&"BODY"!==a.nodeName?"true"===(b=a.getAttribute("data-clickable"))||"false"!==b&&(a.onclick||H.test(a.nodeName+"")||"true"===a.getAttribute("contentEditable"))?!0:Pa(a.parentNode):!1},Qa=function(a,b){for(var c,d=a.length;--d>-1;)c=a[d],c.ondragstart=c.onselectstart=b?null:y,ca(c,"userSelect",b?"text":"none")},Ra=function(){var a,b=t.createElement("div"),c=t.createElement("div"),d=c.style,e=t.body||w;return d.display="inline-block",d.position="relative",b.style.cssText=c.innerHTML="width:90px; height:40px; padding:10px; overflow:auto; visibility: hidden",b.appendChild(c),e.appendChild(b),l=c.offsetHeight+18>b.scrollHeight,d.width="100%",oa||(d.paddingRight="500px",a=b.scrollLeft=b.scrollWidth-b.clientWidth,d.left="-90px",a=a!==b.scrollLeft),e.removeChild(b),a}(),Sa=function(a,c){a=aa(a),c=c||{};var d,e,f,g,h,i,j=t.createElement("div"),k=j.style,m=a.firstChild,n=0,o=0,p=a.scrollTop,q=a.scrollLeft,r=a.scrollWidth,s=a.scrollHeight,u=0,v=0,w=0;ma&&c.force3D!==!1?(h="translate3d(",i="px,0px)"):oa&&(h="translate(",i="px)"),this.scrollTop=function(a,b){return arguments.length?void this.top(-a,b):-this.top()},this.scrollLeft=function(a,b){return arguments.length?void this.left(-a,b):-this.left()},this.left=function(d,e){if(!arguments.length)return-(a.scrollLeft+o);var f=a.scrollLeft-q,g=o;return(f>2||-2>f)&&!e?(q=a.scrollLeft,b.killTweensOf(this,!0,{left:1,scrollLeft:1}),this.left(-q),void(c.onKill&&c.onKill())):(d=-d,0>d?(o=d-.5|0,d=0):d>v?(o=d-v|0,d=v):o=0,(o||g)&&(h?this._suspendTransforms||(k[oa]=h+-o+"px,"+-n+i):k.left=-o+"px",Ra&&o+u>=0&&(k.paddingRight=o+u+"px")),a.scrollLeft=0|d,void(q=a.scrollLeft))},this.top=function(d,e){if(!arguments.length)return-(a.scrollTop+n);var f=a.scrollTop-p,g=n;return(f>2||-2>f)&&!e?(p=a.scrollTop,b.killTweensOf(this,!0,{top:1,scrollTop:1}),this.top(-p),void(c.onKill&&c.onKill())):(d=-d,0>d?(n=d-.5|0,d=0):d>w?(n=d-w|0,d=w):n=0,(n||g)&&(h?this._suspendTransforms||(k[oa]=h+-o+"px,"+-n+i):k.top=-n+"px"),a.scrollTop=0|d,void(p=a.scrollTop))},this.maxScrollTop=function(){return w},this.maxScrollLeft=function(){return v},this.disable=function(){for(m=j.firstChild;m;)g=m.nextSibling,a.appendChild(m),m=g;a===j.parentNode&&a.removeChild(j)},this.enable=function(){if(m=a.firstChild,m!==j){for(;m;)g=m.nextSibling,j.appendChild(m),m=g;a.appendChild(j),this.calibrate()}},this.calibrate=function(b){var c,g,h=a.clientWidth===d;p=a.scrollTop,q=a.scrollLeft,(!h||a.clientHeight!==e||j.offsetHeight!==f||r!==a.scrollWidth||s!==a.scrollHeight||b)&&((n||o)&&(c=this.left(),g=this.top(),this.left(-a.scrollLeft),this.top(-a.scrollTop)),(!h||b)&&(k.display="block",k.width="auto",k.paddingRight="0px",u=Math.max(0,a.scrollWidth-a.clientWidth),u&&(u+=ia(a,"paddingLeft")+(l?ia(a,"paddingRight"):0))),k.display="inline-block",k.position="relative",k.overflow="visible",k.verticalAlign="top",k.width="100%",k.paddingRight=u+"px",l&&(k.paddingBottom=ia(a,"paddingBottom",!0)),C&&(k.zoom="1"),d=a.clientWidth,e=a.clientHeight,r=a.scrollWidth,s=a.scrollHeight,v=a.scrollWidth-d,w=a.scrollHeight-e,f=j.offsetHeight,k.display="block",(c||g)&&(this.left(c),this.top(g)))},this.content=j,this.element=a,this._suspendTransforms=!1,this.enable()},Ta=function(d,g){a.call(this,d),d=aa(d),f||(f=q.com.greensock.plugins.ThrowPropsPlugin),this.vars=g=O(g||{}),this.target=d,this.x=this.y=this.rotation=0,this.dragResistance=parseFloat(g.dragResistance)||0,this.edgeResistance=isNaN(g.edgeResistance)?1:parseFloat(g.edgeResistance)||0,this.lockAxis=g.lockAxis,this.autoScroll=g.autoScroll||0,this.lockedAxis=null,this.allowEventDefault=!!g.allowEventDefault;var h,i,j,k,l,r,s,v,w,y,E,H,P,S,U,V,Z,ba,da,ea,fa,ga,ha,la,ma,na,oa,pa,qa,ra,sa,ua,va,wa,xa=(g.type||(C?"top,left":"x,y")).toLowerCase(),ya=-1!==xa.indexOf("x")||-1!==xa.indexOf("y"),za=-1!==xa.indexOf("rotation"),Aa=za?"rotation":ya?"x":"left",Da=ya?"y":"top",Ea=-1!==xa.indexOf("x")||-1!==xa.indexOf("left")||"scroll"===xa,Fa=-1!==xa.indexOf("y")||-1!==xa.indexOf("top")||"scroll"===xa,Ga=g.minimumMovement||2,Ma=this,Ra=N(g.trigger||g.handle||d),Ua={},Va=0,Wa=!1,Ya=g.autoScrollMarginTop||40,Za=g.autoScrollMarginRight||40,$a=g.autoScrollMarginBottom||40,_a=g.autoScrollMarginLeft||40,ab=g.clickableTest||Pa,bb=0,cb=function(a){return Ma.isPressed&&a.which<2?void Ma.endDrag():(a.preventDefault(),a.stopPropagation(),!1)},db=function(a){if(Ma.autoScroll&&Ma.isDragging&&(Wa||ba)){var b,c,e,f,g,h,j,k,l=d,m=15*Ma.autoScroll;for(Wa=!1,M.scrollTop=null!=window.pageYOffset?window.pageYOffset:null!=u.scrollTop?u.scrollTop:t.body.scrollTop,M.scrollLeft=null!=window.pageXOffset?window.pageXOffset:null!=u.scrollLeft?u.scrollLeft:t.body.scrollLeft,f=Ma.pointerX-M.scrollLeft,g=Ma.pointerY-M.scrollTop;l&&!c;)c=Y(l.parentNode),b=c?M:l.parentNode,e=c?{bottom:Math.max(u.clientHeight,window.innerHeight||0),right:Math.max(u.clientWidth,window.innerWidth||0),left:0,top:0}:b.getBoundingClientRect(),h=j=0,Fa&&(k=b._gsMaxScrollY-b.scrollTop,0>k?j=k:g>e.bottom-$a&&k?(Wa=!0,j=Math.min(k,m*(1-Math.max(0,e.bottom-g)/$a)|0)):gk?h=k:f>e.right-Za&&k?(Wa=!0,h=Math.min(k,m*(1-Math.max(0,e.right-f)/Za)|0)):fn&&n>-p&&(n=0),p>o&&o>-p&&(o=0),za?(Ma.deltaX=n-qa.data.rotation,qa.data.rotation=Ma.rotation=n,qa.setRatio(1)):i?(Fa&&(Ma.deltaY=o-i.top(),i.top(o)),Ea&&(Ma.deltaX=n-i.left(),i.left(n))):ya?(Fa&&(Ma.deltaY=o-qa.data.y,qa.data.y=o),Ea&&(Ma.deltaX=n-qa.data.x,qa.data.x=n),qa.setRatio(1)):(Fa&&(Ma.deltaY=o-parseFloat(d.style.top||0),d.style.top=o+"px"),Ea&&(Ma.deltaY=n-parseFloat(d.style.left||0),d.style.left=n+"px")),!v||a||ua||(ua=!0,ja(Ma,"drag","onDrag"),ua=!1)}ba=!1},eb=function(a,c){var e,f=Ma.x,g=Ma.y;d._gsTransform||!ya&&!za||b.set(d,{x:"+=0",overwrite:!1,data:"_draggable"}),ya?(Ma.y=d._gsTransform.y,Ma.x=d._gsTransform.x):za?Ma.x=Ma.rotation=d._gsTransform.rotation:i?(Ma.y=i.top(),Ma.x=i.left()):(Ma.y=parseInt(d.style.top,10)||0,Ma.x=parseInt(d.style.left,10)||0),(ea||fa||ga)&&!c&&(Ma.isDragging||Ma.isThrowing)&&(ga&&(L.x=Ma.x,L.y=Ma.y,e=ga(L),e.x!==Ma.x&&(Ma.x=e.x,ba=!0),e.y!==Ma.y&&(Ma.y=e.y,ba=!0)),ea&&(e=ea(Ma.x),e!==Ma.x&&(Ma.x=e,za&&(Ma.rotation=e),ba=!0)),fa&&(e=fa(Ma.y),e!==Ma.y&&(Ma.y=e),ba=!0)),ba&&db(!0),a||(Ma.deltaX=Ma.x-f,Ma.deltaY=Ma.y-g,ja(Ma,"throwupdate","onThrowUpdate"))},fb=function(){var a,b,c,e;s=!1,i?(i.calibrate(),Ma.minX=y=-i.maxScrollLeft(),Ma.minY=H=-i.maxScrollTop(),Ma.maxX=w=Ma.maxY=E=0,s=!0):g.bounds&&(a=ka(g.bounds,d.parentNode),za?(Ma.minX=y=a.left,Ma.maxX=w=a.left+a.width,Ma.minY=H=Ma.maxY=E=0):void 0!==g.bounds.maxX||void 0!==g.bounds.maxY?(a=g.bounds,Ma.minX=y=a.minX,Ma.minY=H=a.minY,Ma.maxX=w=a.maxX,Ma.maxY=E=a.maxY):(b=ka(d,d.parentNode),Ma.minX=y=ia(d,Aa)+a.left-b.left,Ma.minY=H=ia(d,Da)+a.top-b.top,Ma.maxX=w=y+(a.width-b.width),Ma.maxY=E=H+(a.height-b.height)),y>w&&(Ma.minX=w,Ma.maxX=w=y,y=Ma.minX),H>E&&(Ma.minY=E,Ma.maxY=E=H,H=Ma.minY),za&&(Ma.minRotation=y,Ma.maxRotation=w),s=!0),g.liveSnap&&(c=g.liveSnap===!0?g.snap||{}:g.liveSnap,e=c instanceof Array||"function"==typeof c,za?(ea=nb(e?c:c.rotation,y,w,1),fa=null):c.points?ga=ob(e?c:c.points,y,w,H,E,c.radius,i?-1:1):(Ea&&(ea=nb(e?c:c.x||c.left||c.scrollLeft,y,w,i?-1:1)),Fa&&(fa=nb(e?c:c.y||c.top||c.scrollTop,H,E,i?-1:1))))},gb=function(){Ma.isThrowing=!1,ja(Ma,"throwcomplete","onThrowComplete")},hb=function(){Ma.isThrowing=!1},ib=function(a,b){var c,e,h,j;a&&f?(a===!0&&(c=g.snap||g.liveSnap||{},e=c instanceof Array||"function"==typeof c,a={resistance:(g.throwResistance||g.resistance||1e3)/(za?10:1)},za?a.rotation=Oa(Ma,e?c:c.rotation,w,y,1,b):(Ea&&(a[Aa]=Oa(Ma,e?c:c.points||c.x||c.left||c.scrollLeft,w,y,i?-1:1,b||"x"===Ma.lockedAxis)),Fa&&(a[Da]=Oa(Ma,e?c:c.points||c.y||c.top||c.scrollTop,E,H,i?-1:1,b||"y"===Ma.lockedAxis)),(c.points||c instanceof Array&&"object"==typeof c[0])&&(a.linkedProps=Aa+","+Da,a.radius=c.radius))),Ma.isThrowing=!0,j=isNaN(g.overshootTolerance)?1===g.edgeResistance?0:1-Ma.edgeResistance+.2:g.overshootTolerance,Ma.tween=h=f.to(i||d,{throwProps:a,data:"_draggable",ease:g.ease||q.Power3.easeOut,onComplete:gb,onOverwrite:hb,onUpdate:g.fastMode?ja:eb,onUpdateParams:g.fastMode?[Ma,"onthrowupdate","onThrowUpdate"]:c&&c.radius?[!1,!0]:x},isNaN(g.maxDuration)?2:g.maxDuration,isNaN(g.minDuration)?0===j||"object"==typeof a&&a.resistance>1e3?0:.5:g.minDuration,j),g.fastMode||(i&&(i._suspendTransforms=!0),h.render(h.duration(),!0,!0),eb(!0,!0),Ma.endX=Ma.x,Ma.endY=Ma.y,za&&(Ma.endRotation=Ma.x),h.play(0),eb(!0,!0),i&&(i._suspendTransforms=!1))):s&&Ma.applyBounds()},jb=function(a){var b,c,e,f,g,h,i,l,m,n=ma||[1,0,0,1,0,0];ma=Ba(d.parentNode,!0),a&&Ma.isPressed&&n.join(",")!==ma.join(",")&&(b=n[0],c=n[1],e=n[2],f=n[3],g=n[4],h=n[5],i=b*f-c*e,l=j*(f/i)+k*(-e/i)+(e*h-f*g)/i,m=j*(-c/i)+k*(b/i)+-(b*h-c*g)/i,k=l*ma[1]+m*ma[3]+ma[5],j=l*ma[0]+m*ma[2]+ma[4]),ma[1]||ma[2]||1!=ma[0]||1!=ma[3]||0!=ma[4]||0!=ma[5]||(ma=null)},kb=function(){var a=1-Ma.edgeResistance;jb(!1),ma&&(j=Ma.pointerX*ma[0]+Ma.pointerY*ma[2]+ma[4],k=Ma.pointerX*ma[1]+Ma.pointerY*ma[3]+ma[5]),ba&&(rb(Ma.pointerX,Ma.pointerY),db(!0)),i?(fb(),r=i.top(),l=i.left()):(lb()?(eb(!0,!0),fb()):Ma.applyBounds(),za?(Z=Ma.rotationOrigin=Ca(d,{x:0,y:0}),eb(!0,!0),l=Ma.x,r=Ma.y=Math.atan2(Z.y-Ma.pointerY,Ma.pointerX-Z.x)*z):(oa=d.parentNode?d.parentNode.scrollTop||0:0,pa=d.parentNode?d.parentNode.scrollLeft||0:0,r=ia(d,Da),l=ia(d,Aa))),s&&a&&(l>w?l=w+(l-w)/a:y>l&&(l=y-(y-l)/a),za||(r>E?r=E+(r-E)/a:H>r&&(r=H-(H-r)/a))),Ma.startX=l,Ma.startY=r},lb=function(){return Ma.tween&&Ma.tween.isActive()},mb=function(){!D.parentNode||lb()||Ma.isDragging||D.parentNode.removeChild(D)},nb=function(a,b,c,d){return"function"==typeof a?function(e){var f=Ma.isPressed?1-Ma.edgeResistance:1;return a.call(Ma,e>c?c+(e-c)*f:b>e?b+(e-b)*f:e)*d}:a instanceof Array?function(d){for(var e,f,g=a.length,h=0,i=A;--g>-1;)e=a[g],f=e-d,0>f&&(f=-f),i>f&&e>=b&&c>=e&&(h=g,i=f);return a[h]}:isNaN(a)?function(a){return a}:function(){return a*d}},ob=function(a,b,c,d,e,f,g){return f=f&&A>f?f*f:A,"function"==typeof a?function(h){var i,j,k,l=Ma.isPressed?1-Ma.edgeResistance:1,m=h.x,n=h.y;return h.x=m=m>c?c+(m-c)*l:b>m?b+(m-b)*l:m,h.y=n=n>e?e+(n-e)*l:d>n?d+(n-d)*l:n,i=a.call(Ma,h),i!==h&&(h.x=i.x,h.y=i.y),1!==g&&(h.x*=g,h.y*=g),A>f&&(j=h.x-m,k=h.y-n,j*j+k*k>f&&(h.x=m,h.y=n)),h}:a instanceof Array?function(b){for(var c,d,e,g,h=a.length,i=0,j=A;--h>-1;)e=a[h],c=e.x-b.x,d=e.y-b.y,g=c*c+d*d,j>g&&(i=h,j=g);return f>=j?a[i]:b}:function(a){return a}},pb=function(a,c){var e;if(h&&!Ma.isPressed&&a&&("mousedown"!==a.type&&"pointerdown"!==a.type||c||!(B()-bb<30)||!Ia[Ma.pointerEvent.type])){if(na=lb(),Ma.pointerEvent=a,Ia[a.type]?(la=-1!==a.type.indexOf("touch")?a.currentTarget||a.target:t,Ja(la,"touchend",sb),Ja(la,"touchmove",qb),Ja(la,"touchcancel",sb),Ja(t,"touchstart",Na)):(la=null,Ja(t,"mousemove",qb)),sa=null,Ja(t,"mouseup",sb),a&&a.target&&Ja(a.target,"mouseup",sb),ha=ab.call(Ma,a.target)&&!g.dragClickables&&!c)return Ja(a.target,"change",sb),ja(Ma,"press","onPress"),void Qa(Ra,!0);if(ra=la&&Ea!==Fa&&Ma.vars.allowNativeTouchScrolling!==!1?Ea?"y":"x":!1,C?a=_(a,!0):ra||Ma.allowEventDefault||(a.preventDefault(),a.preventManipulation&&a.preventManipulation()),a.changedTouches?(a=U=a.changedTouches[0],V=a.identifier):a.pointerId?V=a.pointerId:U=V=null,I++,Q(db),k=Ma.pointerY=a.pageY,j=Ma.pointerX=a.pageX,(ra||Ma.autoScroll)&&$(d.parentNode),!d.parentNode||!Ma.autoScroll||i||za||!d.parentNode._gsMaxScrollX||D.parentNode||d.getBBox||(D.style.width=d.parentNode.scrollWidth+"px",d.parentNode.appendChild(D)),kb(),Ma.tween&&Ma.tween.kill(),Ma.isThrowing=!1,b.killTweensOf(i||d,!0,Ua),i&&b.killTweensOf(d,!0,{scrollTo:1}),Ma.tween=Ma.lockedAxis=null,(g.zIndexBoost||!za&&!i&&g.zIndexBoost!==!1)&&(d.style.zIndex=Ta.zIndex++),Ma.isPressed=!0,v=!(!g.onDrag&&!Ma._listeners.drag),!za)for(e=Ra.length;--e>-1;)ca(Ra[e],"cursor",g.cursor||"move");ja(Ma,"press","onPress")}},qb=function(a){var b,c,d,f,g,i,l=a;if(h&&!e&&Ma.isPressed&&a){if(Ma.pointerEvent=a,b=a.changedTouches){if(a=b[0],a!==U&&a.identifier!==V){for(f=b.length;--f>-1&&(a=b[f]).identifier!==V;);if(0>f)return}}else if(a.pointerId&&V&&a.pointerId!==V)return;if(C)a=_(a,!0);else{if(la&&ra&&!sa&&(c=a.pageX,d=a.pageY,ma&&(f=c*ma[0]+d*ma[2]+ma[4],d=c*ma[1]+d*ma[3]+ma[5],c=f),g=Math.abs(c-j),i=Math.abs(d-k),(g!==i&&(g>Ga||i>Ga)||J&&ra===sa)&&(sa=g>i&&Ea?"x":"y",Ma.vars.lockAxisOnTouchScroll!==!1&&(Ma.lockedAxis="x"===sa?"y":"x","function"==typeof Ma.vars.onLockAxis&&Ma.vars.onLockAxis.call(Ma,l)),J&&ra===sa)))return void sb(l);Ma.allowEventDefault||ra&&(!sa||ra===sa)||l.cancelable===!1||(l.preventDefault(),l.preventManipulation&&l.preventManipulation())}Ma.autoScroll&&(Wa=!0),rb(a.pageX,a.pageY)}},rb=function(a,b){var c,d,e,f,g,h,i=1-Ma.dragResistance,m=1-Ma.edgeResistance;Ma.pointerX=a,Ma.pointerY=b,za?(f=Math.atan2(Z.y-b,a-Z.x)*z,g=Ma.y-f,g>180?(r-=360,Ma.y=f):-180>g&&(r+=360,Ma.y=f),Ma.x!==l||Math.abs(r-f)>Ga?(Ma.y=f,e=l+(r-f)*i):e=l):(ma&&(h=a*ma[0]+b*ma[2]+ma[4],b=a*ma[1]+b*ma[3]+ma[5],a=h),d=b-k,c=a-j,Ga>d&&d>-Ga&&(d=0),Ga>c&&c>-Ga&&(c=0),(Ma.lockAxis||Ma.lockedAxis)&&(c||d)&&(h=Ma.lockedAxis,h||(Ma.lockedAxis=h=Ea&&Math.abs(c)>Math.abs(d)?"y":Fa?"x":null,h&&"function"==typeof Ma.vars.onLockAxis&&Ma.vars.onLockAxis.call(Ma,Ma.pointerEvent)),"y"===h?d=0:"x"===h&&(c=0)),e=l+c*i,f=r+d*i),(ea||fa||ga)&&(Ma.x!==e||Ma.y!==f&&!za)?(ga&&(L.x=e,L.y=f,h=ga(L),e=h.x,f=h.y),ea&&(e=ea(e)),fa&&(f=fa(f))):s&&(e>w?e=w+(e-w)*m:y>e&&(e=y+(e-y)*m),za||(f>E?f=E+(f-E)*m:H>f&&(f=H+(f-H)*m))),za||ma||(e=Math.round(e),f=Math.round(f)),(Ma.x!==e||Ma.y!==f&&!za)&&(za?(Ma.endRotation=Ma.x=Ma.endX=e,ba=!0):(Fa&&(Ma.y=Ma.endY=f,ba=!0),Ea&&(Ma.x=Ma.endX=e,ba=!0)),!Ma.isDragging&&Ma.isPressed&&(Ma.isDragging=!0,ja(Ma,"dragstart","onDragStart")))},sb=function(a,c){if(h&&Ma.isPressed&&(!a||null==V||c||!(a.pointerId&&a.pointerId!==V||a.changedTouches&&!La(a.changedTouches,V)))){Ma.isPressed=!1;var e,f,i,j,k,l=a,m=Ma.isDragging,n=b.delayedCall(.001,mb);if(la?(Ka(la,"touchend",sb),Ka(la,"touchmove",qb),Ka(la,"touchcancel",sb),Ka(t,"touchstart",Na)):Ka(t,"mousemove",qb),Ka(t,"mouseup",sb),a&&a.target&&Ka(a.target,"mouseup",sb),ba=!1,ha)return a&&(Ka(a.target,"change",sb),Ma.pointerEvent=l),Qa(Ra,!1),ja(Ma,"release","onRelease"),ja(Ma,"click","onClick"),void(ha=!1);if(R(db),!za)for(f=Ra.length;--f>-1;)ca(Ra[f],"cursor",g.cursor||"move");if(m&&(Va=K=B(),Ma.isDragging=!1),I--,a){if(C&&(a=_(a,!1)),e=a.changedTouches,e&&(a=e[0],a!==U&&a.identifier!==V)){for(f=e.length;--f>-1&&(a=e[f]).identifier!==V;);if(0>f)return}Ma.pointerEvent=l,Ma.pointerX=a.pageX,Ma.pointerY=a.pageY}return l&&!m?(na&&(g.snap||g.bounds)&&ib(g.throwProps),ja(Ma,"release","onRelease"),J&&"touchmove"===l.type||-1!==l.type.indexOf("cancel")||(ja(Ma,"click","onClick"),B()-bb<300&&ja(Ma,"doubleclick","onDoubleClick"),j=l.target||l.srcElement||d,bb=B(),k=function(){bb!==va&&Ma.enabled()&&!Ma.isPressed&&(j.click?j.click():t.createEvent&&(i=t.createEvent("MouseEvents"),i.initMouseEvent("click",!0,!0,window,1,Ma.pointerEvent.screenX,Ma.pointerEvent.screenY,Ma.pointerX,Ma.pointerY,!1,!1,!1,!1,0,null),j.dispatchEvent(i)))},J||l.defaultPrevented||b.delayedCall(1e-5,k))):(ib(g.throwProps),C||Ma.allowEventDefault||!l||!g.dragClickables&&ab.call(Ma,l.target)||!m||ra&&(!sa||ra!==sa)||l.cancelable===!1||(l.preventDefault(),l.preventManipulation&&l.preventManipulation()),ja(Ma,"release","onRelease")),lb()&&n.duration(Ma.tween.duration()),m&&ja(Ma,"dragend","onDragEnd"),!0}},tb=function(a){if(a&&Ma.isDragging&&!i){var b=a.target||a.srcElement||d.parentNode,c=b.scrollLeft-b._gsScrollX,e=b.scrollTop-b._gsScrollY;(c||e)&&(ma?(j-=c*ma[0]+e*ma[2],k-=e*ma[3]+c*ma[1]):(j-=c,k-=e),b._gsScrollX+=c,b._gsScrollY+=e,rb(Ma.pointerX,Ma.pointerY))}},ub=function(a){var b=B(),c=40>b-bb,d=40>b-Va,e=c&&va===bb,f=!!a.preventDefault,g=Ma.pointerEvent&&Ma.pointerEvent.defaultPrevented,h=c&&wa===bb,i=a.isTrusted||null==a.isTrusted&&c&&e;return f&&(e||d&&Ma.vars.suppressClickOnDrag!==!1)&&a.stopImmediatePropagation(),!c||Ma.pointerEvent&&Ma.pointerEvent.defaultPrevented||e&&i===h?void((Ma.isPressed||d||c)&&(f?i&&a.detail&&c&&!g||(a.preventDefault(),a.preventManipulation&&a.preventManipulation()):a.returnValue=!1)):(i&&e&&(wa=bb),void(va=bb))},vb=function(a){return ma?{x:a.x*ma[0]+a.y*ma[2]+ma[4],y:a.x*ma[1]+a.y*ma[3]+ma[5]}:{x:a.x,y:a.y}};da=Ta.get(this.target),da&&da.kill(),this.startDrag=function(a,b){var c,e,f,g;pb(a||Ma.pointerEvent,!0),b&&!Ma.hitTest(a||Ma.pointerEvent)&&(c=Xa(a||Ma.pointerEvent),e=Xa(d),f=vb({x:c.left+c.width/2,y:c.top+c.height/2}),g=vb({x:e.left+e.width/2,y:e.top+e.height/2}),j-=f.x-g.x,k-=f.y-g.y),Ma.isDragging||(Ma.isDragging=!0, 15 | ja(Ma,"dragstart","onDragStart"))},this.drag=qb,this.endDrag=function(a){sb(a||Ma.pointerEvent,!0)},this.timeSinceDrag=function(){return Ma.isDragging?0:(B()-Va)/1e3},this.timeSinceClick=function(){return(B()-bb)/1e3},this.hitTest=function(a,b){return Ta.hitTest(Ma.target,a,b)},this.getDirection=function(a,b){var c,d,e,g,h,i,j="velocity"===a&&f?a:"object"!=typeof a||za?"start":"element";return"element"===j&&(h=Xa(Ma.target),i=Xa(a)),c="start"===j?Ma.x-l:"velocity"===j?f.getVelocity(this.target,Aa):h.left+h.width/2-(i.left+i.width/2),za?0>c?"counter-clockwise":"clockwise":(b=b||2,d="start"===j?Ma.y-r:"velocity"===j?f.getVelocity(this.target,Da):h.top+h.height/2-(i.top+i.height/2),e=Math.abs(c/d),g=1/b>e?"":0>c?"left":"right",b>e&&(""!==g&&(g+="-"),g+=0>d?"up":"down"),g)},this.applyBounds=function(a){var b,c,e,f,h,i;if(a&&g.bounds!==a)return g.bounds=a,Ma.update(!0);if(eb(!0),fb(),s){if(b=Ma.x,c=Ma.y,b>w?b=w:y>b&&(b=y),c>E?c=E:H>c&&(c=H),(Ma.x!==b||Ma.y!==c)&&(e=!0,Ma.x=Ma.endX=b,za?Ma.endRotation=b:Ma.y=Ma.endY=c,ba=!0,db(!0),Ma.autoScroll&&!Ma.isDragging))for($(d.parentNode),f=d,M.scrollTop=null!=window.pageYOffset?window.pageYOffset:null!=u.scrollTop?u.scrollTop:t.body.scrollTop,M.scrollLeft=null!=window.pageXOffset?window.pageXOffset:null!=u.scrollLeft?u.scrollLeft:t.body.scrollLeft;f&&!i;)i=Y(f.parentNode),h=i?M:f.parentNode,Fa&&h.scrollTop>h._gsMaxScrollY&&(h.scrollTop=h._gsMaxScrollY),Ea&&h.scrollLeft>h._gsMaxScrollX&&(h.scrollLeft=h._gsMaxScrollX),f=h;Ma.isThrowing&&(e||Ma.endX>w||Ma.endXE||Ma.endY.01||Fa&&Math.abs(f-Ma.y)>.01&&!za)&&kb(),Ma.autoScroll&&($(d.parentNode),Wa=Ma.isDragging,db(!0)),Ma.autoScroll&&(X(d,tb),W(d,tb)),Ma},this.enable=function(a){var e,j,k;if("soft"!==a){for(j=Ra.length;--j>-1;)k=Ra[j],Ja(k,"mousedown",pb),Ja(k,"touchstart",pb),Ja(k,"click",ub,!0),za||ca(k,"cursor",g.cursor||"move"),ca(k,"touchCallout","none"),ca(k,"touchAction",Ea===Fa?"none":Ea?"pan-y":"pan-x"),ta(k)&&ca(k.ownerSVGElement||k,"touchAction",Ea===Fa?"none":Ea?"pan-y":"pan-x"),this.vars.allowContextMenu||Ja(k,"contextmenu",cb);Qa(Ra,!1)}return W(d,tb),h=!0,f&&"soft"!==a&&f.track(i||d,ya?"x,y":za?"rotation":"top,left"),i&&i.enable(),d._gsDragID=e="d"+G++,F[e]=this,i&&(i.element._gsDragID=e),b.set(d,{x:"+=0",overwrite:!1,data:"_draggable"}),qa={t:d,data:C?S:d._gsTransform,tween:{},setRatio:C?function(){b.set(d,P)}:c._internals.setTransformRatio||c._internals.set3DTransformRatio},kb(),Ma.update(!0),Ma},this.disable=function(a){var b,c,e=Ma.isDragging;if(!za)for(b=Ra.length;--b>-1;)ca(Ra[b],"cursor",null);if("soft"!==a){for(b=Ra.length;--b>-1;)c=Ra[b],ca(c,"touchCallout",null),ca(c,"touchAction",null),Ka(c,"mousedown",pb),Ka(c,"touchstart",pb),Ka(c,"click",ub),Ka(c,"contextmenu",cb);Qa(Ra,!0),la&&(Ka(la,"touchcancel",sb),Ka(la,"touchend",sb),Ka(la,"touchmove",qb)),Ka(t,"mouseup",sb),Ka(t,"mousemove",qb)}return X(d,tb),h=!1,f&&"soft"!==a&&f.untrack(i||d,ya?"x,y":za?"rotation":"top,left"),i&&i.disable(),R(db),Ma.isDragging=Ma.isPressed=ha=!1,e&&ja(Ma,"dragend","onDragEnd"),Ma},this.enabled=function(a,b){return arguments.length?a?Ma.enable(b):Ma.disable(b):h},this.kill=function(){return Ma.isThrowing=!1,b.killTweensOf(i||d,!0,Ua),Ma.disable(),delete F[d._gsDragID],Ma},-1!==xa.indexOf("scroll")&&(i=this.scrollProxy=new Sa(d,T({onKill:function(){Ma.isPressed&&sb(null)}},g)),d.style.overflowY=Fa&&!Ha?"auto":"hidden",d.style.overflowX=Ea&&!Ha?"auto":"hidden",d=i.content),g.force3D!==!1&&b.set(d,{force3D:!0}),za?Ua.rotation=1:(Ea&&(Ua[Aa]=1),Fa&&(Ua[Da]=1)),za?(P=p,S=P.css,P.overwrite=!1):ya&&(P=Ea&&Fa?m:Ea?n:o,S=P.css,P.overwrite=!1),this.enable()},Ua=Ta.prototype=new a;Ua.constructor=Ta,Ua.pointerX=Ua.pointerY=Ua.startX=Ua.startY=Ua.deltaX=Ua.deltaY=0,Ua.isDragging=Ua.isPressed=!1,Ta.version="0.16.1",Ta.zIndex=1e3,Ja(t,"touchcancel",function(){}),Ja(t,"contextmenu",function(a){var b;for(b in F)F[b].isPressed&&F[b].endDrag()}),Ta.create=function(a,c){"string"==typeof a&&(a=b.selector(a));for(var d=a&&0!==a.length?Fa(a)?Ga(a):[a]:[],e=d.length;--e>-1;)d[e]=new Ta(d[e],c);return d},Ta.get=function(a){return F[(aa(a)||{})._gsDragID]},Ta.timeSinceDrag=function(){return(B()-K)/1e3};var Va={},Wa=function(a){var b,c,d=0,e=0;for(a=aa(a),b=a.offsetWidth,c=a.offsetHeight;a;)d+=a.offsetTop,e+=a.offsetLeft,a=a.offsetParent;return{top:d,left:e,width:b,height:c}},Xa=function(a,b){if(a===window)return Va.left=Va.top=0,Va.width=Va.right=u.clientWidth||a.innerWidth||t.body.clientWidth||0,Va.height=Va.bottom=(a.innerHeight||0)-20g.right||h.rightg.bottom||h.bottom=g.width*g.height*c||e>=h.width*h.height*c):d.width>c&&d.height>c)},D.style.cssText="visibility:hidden;height:1px;top:-1px;pointer-events:none;position:relative;clear:both;",Ta},!0)}),_gsScope._gsDefine&&_gsScope._gsQueue.pop()(),function(a){"use strict";var b=function(){return(_gsScope.GreenSockGlobals||_gsScope)[a]};"undefined"!=typeof module&&module.exports?(require("../TweenLite.min.js"),require("../plugins/CSSPlugin.min.js"),module.exports=b()):"function"==typeof define&&define.amd&&define(["TweenLite","CSSPlugin"],b)}("Draggable"); -------------------------------------------------------------------------------- /utils/GSDevTools.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * VERSION: 0.1.7 3 | * DATE: 2018-02-15 4 | * UPDATES AND DOCS AT: http://greensock.com 5 | * 6 | * @license Copyright (c) 2008-2018, GreenSock. All rights reserved. 7 | * GSDevTools is a Club GreenSock membership benefit; You must have a valid membership to use 8 | * this code without violating the terms of use. Visit http://greensock.com/club/ to sign up or get more details. 9 | * This work is subject to the software agreement that was issued with your membership. 10 | * 11 | * @author: Jack Doyle, jack@greensock.com 12 | **/ 13 | var _gsScope="undefined"!=typeof module&&module.exports&&"undefined"!=typeof global?global:this||window;(_gsScope._gsQueue||(_gsScope._gsQueue=[])).push(function(){"use strict";_gsScope._gsDefine("GSDevTools",["TweenLite","core.Animation","core.SimpleTimeline","TimelineLite","utils.Draggable","plugins.CSSPlugin"],function(a,b,c,d,e){var f,g,h,i,j,k=document,l=k.documentElement,m="http://www.w3.org/2000/svg",n="http://www.w3.org/1999/xhtml",o=0,p={},q=function(a,b,c){var d=k.createElementNS?k.createElementNS("svg"===a?m:n,a):k.createElement(a);return b&&("string"==typeof b&&(b=k.querySelector(b)),b.appendChild(d)),"svg"===a&&(d.setAttribute("xmlns",m),d.setAttribute("xmlns:xlink",n)),c&&(d.style.cssText=c),d},r=function(){k.selection?k.selection.empty():window.getSelection&&window.getSelection().removeAllRanges()},s=b._rootTimeline,t=function(b,c){for(var d=[],e=0,f=b._first;f;)f instanceof a?f.vars.id&&(d[e++]=f):(c&&f.vars.id&&(d[e++]=f),d=d.concat(t(f,c)),e=d.length),f=f._next;return d},u=function(a){var b=0,c=a._first;if(!c)return a.duration();for(;c;)b=Math.max(b,c.totalDuration()>999?c.endTime(!1):c._startTime+c._totalDuration/c._timeScale),c=c._next;return b},v=function(a){if(!a)return null;if(a instanceof b)return a;for(var c=t(s,!0),d=c.length;--d>-1;)if(c[d].vars.id===a)return c[d]},w=function(a,b,c,d){var e,f,g;return"string"==typeof a&&("="===a.charAt(1)?(e=parseInt(a.charAt(0)+"1",10)*parseFloat(a.substr(2)),0>e&&0===d&&(d=100),a=d/100*b.duration()+e):isNaN(a)&&b.getLabelTime&&-1!==b.getLabelTime(a)?a=b.getLabelTime(a):b===D&&(f=a.indexOf("="),f>0?(e=parseInt(a.charAt(f-1)+"1",10)*parseFloat(a.substr(f+1)),a=a.substr(0,f-1)):e=0,g=v(a),g&&(a=x(g,c/100*g.duration())+e))),a=isNaN(a)?c:parseFloat(a),Math.min(100,Math.max(0,a/b.duration()*100))},x=function(a,b){var c=a;if(b=b||0,c.timeline)for(;c.timeline.timeline;)b=b/c._timeScale+c._startTime,c=c.timeline;return b},y=function(b,c,d){f||(q("style",l).innerHTML=".gs-dev-tools{height:51px;bottom:0;left:0;right:0;display:block;position:fixed;overflow:visible;padding:0}.gs-dev-tools *{box-sizing:content-box;visibility:visible}.gs-dev-tools .gs-top{position:relative;z-index:499}.gs-dev-tools .gs-bottom{display:flex;align-items:center;justify-content:space-between;background-color:rgba(0,0,0,.6);height:42px;border-top:1px solid #999;position:relative}.gs-dev-tools .timeline{position:relative;height:8px;margin-left:15px;margin-right:15px;overflow:visible}.gs-dev-tools .progress-bar,.gs-dev-tools .timeline-track{height:8px;width:100%;position:absolute;top:0;left:0}.gs-dev-tools .timeline-track{background-color:#999;opacity:.6}.gs-dev-tools .progress-bar{background-color:#91e600;height:8px;top:0;width:0;pointer-events:none}.gs-dev-tools .seek-bar{width:100%;position:absolute;height:24px;top:-12px;left:0;background-color:transparent}.gs-dev-tools .in-point,.gs-dev-tools .out-point{width:15px;height:26px;position:absolute;top:-18px}.gs-dev-tools .in-point-shape{fill:#6d9900;stroke:rgba(0,0,0,.5);stroke-width:1}.gs-dev-tools .out-point-shape{fill:#994242;stroke:rgba(0,0,0,.5);stroke-width:1}.gs-dev-tools .in-point{transform:translateX(-100%)}.gs-dev-tools .out-point{left:100%}.gs-dev-tools .grab{stroke:rgba(255,255,255,.3);stroke-width:1}.gs-dev-tools .playhead{position:absolute;top:-5px;transform:translate(-50%,0);left:0;border-radius:50%;width:16px;height:16px;border:1px solid #6d9900;background-color:#91e600}.gs-dev-tools .gs-btn-white{fill:#fff}.gs-dev-tools .pause{opacity:0}.gs-dev-tools .select-animation{vertical-align:middle;position:relative;padding:6px 10px}.gs-dev-tools .select-animation-container{flex-grow:4;width:40%}.gs-dev-tools .select-arrow{display:inline-block;width:12px;height:7px;margin:0 7px;transform:translate(0,-2px)}.gs-dev-tools .select-arrow-shape{stroke:rgba(255,255,255,.6);stroke-width:2px;fill:none}.gs-dev-tools .rewind{height:16px;width:19px;padding:10px 4px;min-width:24px}.gs-dev-tools .rewind-path{opacity:.6}.gs-dev-tools .play-pause{width:24px;height:24px;padding:6px 10px;min-width:24px}.gs-dev-tools .ease{width:30px;height:30px;padding:10px;min-width:30px;display:none}.gs-dev-tools .ease-path{fill:none;stroke:rgba(255,255,255,.6);stroke-width:2px}.gs-dev-tools .ease-border{fill:rgba(255,255,255,.25)}.gs-dev-tools .time-scale{font-family:monospace;font-size:18px;text-align:center;color:rgba(255,255,255,.6);padding:4px 4px 4px 0;min-width:30px;margin-left:7px}.gs-dev-tools .loop{width:20px;padding:5px;min-width:20px}.gs-dev-tools .loop-path{fill:rgba(255,255,255,.6)}.gs-dev-tools label span{color:#fff;font-family:monospace;text-decoration:none;font-size:16px;line-height:18px}.gs-dev-tools .time-scale span{color:rgba(255,255,255,.6)}.gs-dev-tools button:focus,.gs-dev-tools select:focus{outline:0}.gs-dev-tools label{position:relative;cursor:pointer}.gs-dev-tools label.locked{text-decoration:none;cursor:auto}.gs-dev-tools label input,.gs-dev-tools label select{position:absolute;left:0;top:0;z-index:1;font:inherit;font-size:inherit;line-height:inherit;height:100%;width:100%;color:#000!important;opacity:0;background:0 0;border:none;padding:0;margin:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.gs-dev-tools label input+.display{position:relative;z-index:2}.gs-dev-tools .gs-bottom-right{vertical-align:middle;display:flex;align-items:center;flex-grow:4;width:40%;justify-content:flex-end}.gs-dev-tools .time-container{font-size:18px;font-family:monospace;color:rgba(255,255,255,.6);margin:0 5px}.gs-dev-tools .logo{width:32px;height:32px;position:relative;top:2px;margin:0 12px}.gs-dev-tools .gs-hit-area{background-color:transparent;width:100%;height:100%;top:0;position:absolute}.gs-dev-tools.minimal{height:auto;display:flex;align-items:stretch}.gs-dev-tools.minimal .gs-top{order:2;flex-grow:4;background-color:rgba(0,0,0,1)}.gs-dev-tools.minimal .gs-bottom{background-color:rgba(0,0,0,1);border-top:none}.gs-dev-tools.minimal .timeline{top:50%;transform:translate(0,-50%)}.gs-dev-tools.minimal .in-point,.gs-dev-tools.minimal .out-point{display:none}.gs-dev-tools.minimal .select-animation-container{display:none}.gs-dev-tools.minimal .rewind{display:none}.gs-dev-tools.minimal .play-pause{width:20px;height:20px;padding:4px 6px;margin-left:14px}.gs-dev-tools.minimal .time-scale{min-width:26px}.gs-dev-tools.minimal .loop{width:18px;min-width:18px;display:none}.gs-dev-tools.minimal .gs-bottom-right{display:none}@media only screen and (max-width:600px){.gs-dev-tools{height:auto;display:flex;align-items:stretch}.gs-dev-tools .gs-top{order:2;flex-grow:4;background-color:rgba(0,0,0,1);height:42px}.gs-dev-tools .gs-bottom{background-color:rgba(0,0,0,1);border-top:none}.gs-dev-tools .timeline{top:50%;transform:translate(0,-50%)}.gs-dev-tools .in-point,.gs-dev-tools .out-point{display:none}.gs-dev-tools .select-animation-container{display:none}.gs-dev-tools .rewind{display:none}.gs-dev-tools .play-pause{width:20px;height:20px;padding:4px 6px;margin-left:14px}.gs-dev-tools .time-scale{min-width:26px}.gs-dev-tools .loop{width:18px;min-width:18px;display:none}.gs-dev-tools .gs-bottom-right{display:none}}",f=!0),"string"==typeof b&&(b=document.querySelector(b));var e=q("div",b||l.getElementsByTagName("body")[0]||l);return e.setAttribute("class","gs-dev-tools"+(c?" minimal":"")),e.innerHTML='
0.00 / 0.00
',b&&(e.style.position="absolute",e.style.top=c?"calc(100% - 42px)":"calc(100% - 51px)"),d&&("string"==typeof d?e.style.cssText=d:"object"==typeof d&&(d.data="root",a.set(e,d).kill()),e.style.top&&(e.style.bottom="auto"),e.style.width&&a.set(e,{xPercent:-50,left:"50%",right:"auto",data:"root"}).kill()),!c&&e.offsetWidth<600&&(e.setAttribute("class","gs-dev-tools minimal"),b&&(e.style.top="calc(100% - 42px)")),e},z=function(a,b,c,d){var e,f;return("mousedown"===b||"mouseup"===b)&&(a.style.cursor="pointer"),"mousedown"===b&&(f=void 0!==a.onpointerdown?"pointerdown":void 0!==a.ontouchstart?"touchstart":null)?(e=function(b){"select"!==b.target.nodeName.toLowerCase()&&b.type===f?(b.stopPropagation(),g&&(b.preventDefault(),c.call(a,b))):b.type!==f&&c.call(a,b),g=!0},a.addEventListener(f,e,d),void a.addEventListener(b,e,d)):void a.addEventListener(b,c,d)},A=function(a,b,c){a.removeEventListener(b,c),b="mousedown"!==b?null:void 0!==a.onpointerdown?"pointerdown":void 0!==a.ontouchstart?"touchstart":null,b&&a.removeEventListener(b,c)},B=function(a,b,c,d){var e,f=a.options,g=f.length;for(b+="";--g>-1;)if(f[g].innerHTML===b||f[g].value===b)return a.selectedIndex=g,c.innerHTML=f[g].innerHTML,f[g];d&&(e=q("option",a),e.setAttribute("value",b),e.innerHTML=c.innerHTML="string"==typeof d?d:b,a.selectedIndex=f.length-1)},C=function(a,b,c){var d=a.options,e=Math.min(d.length-1,Math.max(0,a.selectedIndex+b));return a.selectedIndex=e,c&&(c.innerHTML=d[e].innerHTML),d[e].value},D=new d({data:"root",id:"Global Timeline",autoRemoveChildren:!1,smoothChildTiming:!0}),E=new d({data:"root",id:"Global Temp",autoRemoveChildren:!1,smoothChildTiming:!0}),F=a.to(D,1,{time:1,ease:Linear.easeNone,data:"root",id:"_rootTween",paused:!0,immediateRender:!1}),G=function(){var a,b,d=E._first;if(d){if(h&&h.animation()===D){for(a=D._duration;d;)b=d._next,"function"==typeof d.target&&d.target===d.vars.onComplete&&!d._duration||d.target&&d.target._gsIgnore?c.prototype.add.call(s,d,d._startTime-d._delay):D.add(d,d._startTime-d._delay),d=b;return a!==D.duration()}for(;d;)b=d._next,d._gc||d._totalTime===d._totalDuration?d.kill():c.prototype.add.call(s,d,d._startTime-d._delay),d=b}},H=function(){h&&(h.update(),i=!1),a.ticker.removeEventListener("tick",H)},I=function(a){var b=new d({data:"root",onComplete:function(){b.kill()}});return b.to(a.querySelector(".play-1"),.5,{attr:{d:"M5.75,3.13 C5.75,9.79 5.75,16.46 5.75,23.13 4.08,23.13 2.41,23.13 0.75,23.13 0.75,16.46 0.75,9.79 0.75,3.12 2.41,3.12 4.08,3.12 5.75,3.12"},ease:Power3.easeInOut,rotation:360,transformOrigin:"50% 50%"}).to(a.querySelector(".play-2"),.5,{attr:{d:"M16.38,3.13 C16.38,9.79 16.38,16.46 16.38,23.13 14.71,23.13 13.04,23.13 11.38,23.13 11.38,16.46 11.38,9.79 11.38,3.12 13.04,3.12 14.71,3.12 16.38,3.12"},ease:Power3.easeInOut,rotation:360,transformOrigin:"50% 50%"},.05),b},J=function(a){var b=new d({data:"root",paused:!0,onComplete:function(){b.kill()}});return b.to(a,.5,{rotation:360,ease:Power3.easeInOut,transformOrigin:"50% 50%"}).to(a.querySelectorAll(".loop-path"),.5,{fill:"#91e600",ease:Linear.easeNone},0),b},K=function(c){this.vars=c=c||{},c.id=c.id||("string"==typeof c.animation?c.animation:o++),p[c.id+""]=this;var d,f,g,i,k,m,n,s,x,E,H,K,L,N=this,P=y(c.container,c.minimal,c.css),Q=function(a){return P.querySelector(a)},R=function(a,b){return c.persist!==!1&&"undefined"!=typeof sessionStorage&&sessionStorage.setItem("gs-dev-"+a+c.id,b),b},S=function(a){var b;return c.persist!==!1&&"undefined"!=typeof sessionStorage?(b=sessionStorage.getItem("gs-dev-"+a+c.id),"animation"===a?b:"loop"===a?"true"===b:parseFloat(b)):void 0},T=Q(".playhead"),U=Q(".timeline-track"),V=Q(".progress-bar"),W=Q(".time"),X=Q(".duration"),Y=0,Z=function(a,b,c){return function(e){var h,j=U.getBoundingClientRect(),l=a.getBoundingClientRect(),m=l.width*b,n=a._gsTransform.x,o=j.left-l.left-m+n,p=j.right-l.right+(l.width-m)+n,q=o;c&&(a!==_&&(h=_.getBoundingClientRect(),h.left&&(o+=h.left+h.width-j.left)),a!==aa&&(h=aa.getBoundingClientRect(),h.left&&(p-=j.left+j.width-h.left))),k=ka,this.applyBounds({minX:o,maxX:p}),d=s.duration()/j.width,f=-q*d,i?s.pause():s.pause(f+d*this.x),this.target===T&&(this.activated&&(this.allowEventDefault=!1),this.activated=!0),g=!0}},$=e.create(T,{type:"x",cursor:"ew-resize",allowNativeTouchScrolling:!1,allowEventDefault:!0,onPress:Z(T,.5,!0),onDrag:function(){var a=f+d*this.x;0>a?a=0:a>s._duration&&(a=s._duration),i||s.time(a),V.style.width=Math.min(da-ca,Math.max(0,a/s._duration*100-ca))+"%",W.innerHTML=a.toFixed(2)},onRelease:function(a){ka||s.resume()}})[0],_=Q(".in-point"),aa=Q(".out-point"),ba=function(){ca=0,da=100,_.style.left="0%",aa.style.left="100%",R("in",ca),R("out",da),ga(!0)},ca=0,da=100,ea=e.create(_,{type:"x",cursor:"ew-resize",zIndexBoost:!1,allowNativeTouchScrolling:!1,allowEventDefault:!0,onPress:Z(_,1,!0),onDoubleClick:ba,onDrag:function(){ca=(f+d*this.x)/s.duration()*100,s.progress(ca/100),ga(!0)},onRelease:function(){0>ca&&(ca=0),r(),_.style.left=ca+"%",R("in",ca),a.set(_,{x:0,data:"root",display:"block"}),ka||s.resume()}})[0],fa=e.create(aa,{type:"x",cursor:"ew-resize",allowNativeTouchScrolling:!1,allowEventDefault:!0,zIndexBoost:!1,onPress:Z(aa,0,!0),onDoubleClick:ba,onDrag:function(){da=(f+d*this.x)/s.duration()*100,s.progress(da/100),ga(!0)},onRelease:function(){da>100&&(da=100),r(),aa.style.left=da+"%",R("out",da),a.set(aa,{x:0,data:"root",display:"block"}),k||(la(),s.resume())}})[0],ga=function(a){if(!$.isPressed||a){var b=100*s.progress()||0;b>100&&(b=100),b>=da?!m||s.paused()||$.isDragging?(b!==da&&(b=da,s.progress(b/100)),ka||ma()):(b=ca,s.target===n&&s.target.seek(E+(H-E)*ca/100),s.progress(b/100,!0).resume()):ca>b&&(b=ca,s.progress(b/100,!0)),b!==Y||a?(V.style.left=ca+"%",V.style.width=Math.max(0,b-ca)+"%",T.style.left=b+"%",W.innerHTML=s._time.toFixed(2),X.innerHTML=s._duration.toFixed(2),g&&(T.style.transform="translate(-50%,0)",T._gsTransform.x=0,T._gsTransform.xPercent=-50,g=!1),Y=b):s._paused!==ka&&na()}},ha=function(a){if(!$.isPressed){var b=a.target.getBoundingClientRect(),c=(a.changedTouches?a.changedTouches[0]:a).clientX,d=(c-b.left)/b.width*100;if(ca>d)return ca=d=Math.max(0,d),_.style.left=ca+"%",void ea.startDrag(a);if(d>da)return da=d=Math.min(100,d),aa.style.left=da+"%",void fa.startDrag(a);s.progress(d/100).pause(),ga(!0),$.startDrag(a)}},ia=Q(".play-pause"),ja=I(ia),ka=!1,la=function(){s.progress()>=da/100&&(s.target===n&&s.target.seek(E+(H-E)*ca/100),s.progress(ca/100,!0)),ja.play(),s.play(),ka&&N.update(),ka=!1},ma=function(){ja.reverse(),s&&s.pause(),ka=!0},na=function(){ka?la():ma()},oa=function(a){$.isPressed||(s.target===n&&s.target.seek(E+(H-E)*ca/100),s.progress(ca/100,!0),ka||s.resume())},pa=Q(".loop"),qa=J(pa),ra=function(a){m=a,R("loop",m),m?(qa.play(),s.progress()>=da/100&&(s.target===n&&s.target.seek(E+(H-E)*ca/100),s.progress(ca/100,!0).resume())):qa.reverse()},sa=function(){ra(!m)},ta=Q(".animation-list"),ua=Q(".animation-label"),va=function(){var a,b,d=t(x&&c.globalSync===!1?x:D,!0),e=ta.children,f=0;for(x&&c.globalSync===!1?d.unshift(x):c.hideGlobalTimeline||d.unshift(D),b=0;b99999999&&(H=e.duration());e.timeline.timeline;)E=E/e._timeScale+e._startTime,H=H/e._timeScale+e._startTime,e=e.timeline;else H=D.duration();H-E>f&&(H=E+f),D.pause(E),F.vars.time=H,F.invalidate(),F.duration(H-E).timeScale(g),ka?F.progress(1).pause(0):a.delayedCall(.01,function(){F.resume().progress(ca/100),ka&&la()})}else{if(h===N&&(h=null),n!==x&&x){for(e=n,H=e.totalDuration(),H>99999999&&(H=e.duration());e.timeline.timeline&&e!==x;)E=E/e._timeScale+e._startTime,H=H/e._timeScale+e._startTime,e=e.timeline;H-E>f&&(H=E+f),x.pause(E),s=a.to(x,H-E,{time:H,ease:Linear.easeNone,data:"root"}),s.timeScale(g)}else s=n;F.pause(),D.resume(),s.seek(0)}X.innerHTML=s.duration().toFixed(2),B(ta,n.vars.id,ua)}},xa=function(){var a,b,c;n===D&&(a=D._time,D.progress(1,!0).time(a,!0),a=(F._timeline._time-F._startTime)*F._timeScale,c=Math.min(1e3,D.duration()),1e3===c&&(c=Math.min(1e3,u(D))),b=F.duration()/c,1!==b&&c&&(ca*=b,100>da&&(da*=b),F.seek(0),F.vars.time=c,F.invalidate(),F.duration(c),F.time(a),X.innerHTML=c.toFixed(2),ga(!0)))},ya=function(a){wa(ta.options[ta.selectedIndex].animation),a.target&&a.target.blur&&a.target.blur(),ka&&la()},za=Q(".time-scale select"),Aa=Q(".time-scale-label"),Ba=function(b){var c=parseFloat(za.options[za.selectedIndex].value)||1;s.timeScale(c),R("timeScale",c),ka||(s.progress()>=da/100?(s.target===n&&s.target.seek(E+(H-E)*ca/100),s.progress(ca/100,!0).pause()):s.pause(),a.delayedCall(.01,function(){s.resume()})),Aa.innerHTML=c+"x",za.blur&&za.blur()},Ca=a.to([Q(".gs-bottom"),Q(".gs-top")],.3,{autoAlpha:0,y:50,ease:Power2.easeIn,data:"root",paused:!0}),Da=!1,Ea=function(a){e.hitTest(a,P)||$.isDragging||ea.isDragging||fa.isDragging||Ia.restart(!0)},Fa=function(){Da||(Ca.play(),Ia.pause(),Da=!0)},Ga=function(){Ia.pause(),Da&&(Ca.reverse(),Da=!1)},Ha=function(){Da?Ga():Fa()},Ia=a.delayedCall(1.3,Fa).pause(),Ja=function(a){M&&!O&&(O=D._startTime),K=!a,x=v(c.animation),x&&!x.vars.id&&(x.vars.id="[no id]"),va();var b=v(S("animation"));b&&(b._inProgress=S("in")||0,b._outProgress=S("out")||100),c.paused&&ma(),n=null,wa(x||b||D);var d=c.timeScale||S("timeScale"),e=b===n;d&&(B(za,d,Aa,d+"x"),F.timeScale(d)),ca=("inTime"in c?w(c.inTime,n,0,0):e?b._inProgress:0)||0,100===ca&&!c.animation&&b&&(wa(D),ca=w(c.inTime,n,0,0)||0),ca&&(_.style.left=ca+"%",_.style.display=aa.style.display="block"),da=("outTime"in c?w(c.outTime,n,100,ca):e?b._outProgress:0)||100,ca>da&&(da=100),100!==da&&(aa.style.left=da+"%",_.style.display=aa.style.display="block"),m="loop"in c?c.loop:S("loop"),m&&ra(!0),c.paused&&s.progress(ca/100,!0).pause(),M&&n===D&&O&&c.globalSync!==!1&&!ka&&s.time(-O,!0),ga(!0)};z(ta,"change",ya),z(ta,"mousedown",va),z(ia,"mousedown",na),z(Q(".seek-bar"),"mousedown",ha),z(Q(".rewind"),"mousedown",oa),z(pa,"mousedown",sa),z(za,"change",Ba),"auto"===c.visibility?(z(P,"mouseout",Ea),z(P,"mouseover",Ga)):"hidden"===c.visibility&&(Da=!0,Ca.progress(1)),c.keyboard!==!1&&(j&&c.keyboard?console.log("[GSDevTools warning] only one instance can be affected by keyboard shortcuts. There is already one active."):(j=N,L=function(a){var b,c=a.keyCode?a.keyCode:a.which;32===c?na():38===c?(b=parseFloat(C(za,-1,Aa)),s.timeScale(b),R("timeScale",b)):40===c?(b=parseFloat(C(za,1,Aa)),s.timeScale(b),R("timeScale",b)):37===c?oa(a):39===c?s.progress(da/100):76===c?sa():72===c?Ha():73===c?(ca=100*s.progress(),R("in",ca),_.style.left=ca+"%",ga(!0)):79===c&&(da=100*s.progress(),R("out",da),aa.style.left=da+"%",ga(!0))},z(l,"keydown",L))),a.set(T,{xPercent:-50,x:0,data:"root"}),a.set(_,{xPercent:-100,x:0,data:"root"}),_._gsIgnore=aa._gsIgnore=T._gsIgnore=ia._gsIgnore=pa._gsIgnore=!0,a.killTweensOf([_,aa,T]),Ja(M),M&&a.delayedCall(1e-4,Ja,[!1],this),a.ticker.addEventListener("tick",ga),this.update=function(a){h===N&&((!F._paused||a)&&G(),xa())},this.kill=function(){A(ta,"change",ya),A(ta,"mousedown",va),A(ia,"mousedown",na),A(Q(".seek-bar"),"mousedown",ha),A(Q(".rewind"),"mousedown",oa),A(pa,"mousedown",sa),A(za,"change",Ba),$.disable(),ea.disable(),fa.disable(),a.ticker.removeEventListener("tick",ga),A(P,"mouseout",Ea),A(P,"mouseover",Ga),A(l,"keydown",L),P.parentNode.removeChild(P),h===N&&(h=null),delete p[c.id+""]},this.minimal=function(a){var b,d=P.classList.contains("minimal");return arguments.length&&d!==a?(a?P.classList.add("minimal"):P.classList.remove("minimal"),c.container&&(P.style.top=a?"calc(100% - 42px)":"calc(100% - 51px)"),void($.isPressed&&(i=!0,$.endDrag($.pointerEvent),i=!1,b=100*s.progress(),V.style.width=Math.max(0,b-ca)+"%",T.style.left=b+"%",T.style.transform="translate(-50%,0)",T._gsTransform.x=0,T._gsTransform.xPercent=-50,$.startDrag($.pointerEvent,!0)))):d},this.animation=wa,this.updateList=va},L=!0,M=!0,N=a.onOverwrite,O=0;return K.version="0.1.7",K.logOverwrites=!1,K.globalRecordingTime=2,K.getById=function(a){return a?p[a]:h},s._startTime+=s._time,D._startTime=E._startTime=s._time=s._totalTime=0,a.delayedCall(.01,function(){h?h.update():G()}),a.delayedCall(2,function(){var b,d,e;if(!h)for(G(),b=D._first,e=D._startTime;b;)d=b._next,b._totalDuration!==b._totalTime||1!==b.ratio?c.prototype.add.call(s,b,b._startTime-b._delay+e):b.kill(),b=d;K.globalRecordingTime>2?a.delayedCall(K.globalRecordingTime-2,function(){h&&h.update(),L=!1}):L=!1,M=!1}),s.add=function(b,d,e,f){var g=b.data;if(L&&b.vars&&"root"!==g&&"ignore"!==g&&"isStart"!==g&&"isFromStart"!==g&&"_draggable"!==g&&!(M&&!b._duration&&b instanceof a)&&(!b.vars.onComplete||b.vars.onComplete!==b.vars.onReverseComplete)){var h=D;return F._time&&(F._paused?(h=E,b._recordedTime=D.rawTime()):(d=(s._time-F._startTime)*F._timeScale,i||(a.ticker.addEventListener("tick",H),i=!0))),h.add(b,d,e,f),b.vars.repeat&&(h._dirty=!0),this}return c.prototype.add.apply(this,arguments)},D._enabled=E._enabled=function(a,b){return c.prototype._enabled.apply(this,arguments)},d.prototype._remove=function(a,b){c.prototype._remove.apply(this,arguments);var d=this._last;return d?this._time>this.duration()&&(this._time=this._duration,this._totalTime=this._totalDuration):this._time=this._totalTime=this._duration=this._totalDuration=0,this},a.onOverwrite=function(a,b,c,d){K.logOverwrites&&(d?console.log("[Overwrite warning] the following properties were overwritten: ",d,"| target:",c,"| overwritten tween: ",a,"| overwriting tween:",b):console.log("[Overwrite warning] the following tween was overwritten:",a,"by",b)),"function"==typeof N&&N(a,b,c,d)},K.create=function(a){return new K(a)},K},!0)}),_gsScope._gsDefine&&_gsScope._gsQueue.pop()(),function(a){"use strict";var b=function(){return(_gsScope.GreenSockGlobals||_gsScope)[a]};"undefined"!=typeof module&&module.exports?(require("../TweenLite.min.js"),require("../TimelineLite.min.js"),require("../plugins/CSSPlugin.min.js"),module.exports=b()):"function"==typeof define&&define.amd&&define(["TweenLite","TimelineLite","CSSPlugin"],b)}("GSDevTools");/*! 15 | * VERSION: 0.16.2 16 | * DATE: 2018-01-31 17 | * UPDATES AND DOCS AT: http://greensock.com 18 | * 19 | * Requires TweenLite and CSSPlugin version 1.17.0 or later (TweenMax contains both TweenLite and CSSPlugin). ThrowPropsPlugin is required for momentum-based continuation of movement after the mouse/touch is released (ThrowPropsPlugin is a membership benefit of Club GreenSock - http://greensock.com/club/). 20 | * 21 | * @license Copyright (c) 2008-2018, GreenSock. All rights reserved. 22 | * This work is subject to the terms at http://greensock.com/standard-license or for 23 | * Club GreenSock members, the software agreement that was issued with your membership. 24 | * 25 | * @author: Jack Doyle, jack@greensock.com 26 | */ 27 | var _gsScope="undefined"!=typeof module&&module.exports&&"undefined"!=typeof global?global:this||window;(_gsScope._gsQueue||(_gsScope._gsQueue=[])).push(function(){"use strict";_gsScope._gsDefine("utils.Draggable",["events.EventDispatcher","TweenLite","plugins.CSSPlugin"],function(a,b,c){var d,e,f,g,h,i,j,k,l,m={css:{},data:"_draggable"},n={css:{},data:"_draggable"},o={css:{},data:"_draggable"},p={css:{}},q=_gsScope._gsDefine.globals,r={},s={style:{}},t=_gsScope.document||{createElement:function(){return s}},u=t.documentElement||{},v=function(a){return t.createElementNS?t.createElementNS("http://www.w3.org/1999/xhtml",a):t.createElement(a)},w=v("div"),x=[],y=function(){return!1},z=180/Math.PI,A=999999999999999,B=Date.now||function(){return(new Date).getTime()},C=!(t.addEventListener||!t.all),D=t.createElement("div"),E=[],F={},G=0,H=/^(?:a|input|textarea|button|select)$/i,I=0,J=_gsScope.navigator&&-1!==_gsScope.navigator.userAgent.toLowerCase().indexOf("android"),K=0,L={},M={},N=function(a){if("string"==typeof a&&(a=b.selector(a)),!a||a.nodeType)return[a];var c,d=[],e=a.length;for(c=0;c!==e;d.push(a[c++]));return d},O=function(a,b){var c,d={};if(b)for(c in a)d[c]=a[c]*b;else for(c in a)d[c]=a[c];return d},P=function(){for(var a=E.length;--a>-1;)E[a]()},Q=function(a){E.push(a),1===E.length&&b.ticker.addEventListener("tick",P,this,!1,1)},R=function(a){for(var c=E.length;--c>-1;)E[c]===a&&E.splice(c,1);b.to(S,0,{overwrite:"all",delay:15,onComplete:S,data:"_draggable"})},S=function(){E.length||b.ticker.removeEventListener("tick",P)},T=function(a,b){var c;for(c in b)void 0===a[c]&&(a[c]=b[c]);return a},U=function(){return null!=window.pageYOffset?window.pageYOffset:null!=t.scrollTop?t.scrollTop:u.scrollTop||t.body.scrollTop||0},V=function(){return null!=window.pageXOffset?window.pageXOffset:null!=t.scrollLeft?t.scrollLeft:u.scrollLeft||t.body.scrollLeft||0},W=function(a,b){Ja(a,"scroll",b),Y(a.parentNode)||W(a.parentNode,b)},X=function(a,b){Ka(a,"scroll",b),Y(a.parentNode)||X(a.parentNode,b)},Y=function(a){return!(a&&a!==u&&a!==t&&a!==t.body&&a!==window&&a.nodeType&&a.parentNode)},Z=function(a,b){var c="x"===b?"Width":"Height",d="scroll"+c,e="client"+c,f=t.body;return Math.max(0,Y(a)?Math.max(u[d],f[d])-(window["inner"+c]||u[e]||f[e]):a[d]-a[e])},$=function(a){var b=Y(a),c=Z(a,"x"),d=Z(a,"y");b?a=M:$(a.parentNode),a._gsMaxScrollX=c,a._gsMaxScrollY=d,a._gsScrollX=a.scrollLeft||0,a._gsScrollY=a.scrollTop||0},_=function(a,b){return a=a||window.event,r.pageX=a.clientX+t.body.scrollLeft+u.scrollLeft,r.pageY=a.clientY+t.body.scrollTop+u.scrollTop,b&&(a.returnValue=!1),r},aa=function(a){return a?("string"==typeof a&&(a=b.selector(a)),a.length&&a!==window&&a[0]&&a[0].style&&!a.nodeType&&(a=a[0]),a===window||a.nodeType&&a.style?a:null):a},ba=function(a,b){var c,e,f,g=a.style;if(void 0===g[b]){for(f=["O","Moz","ms","Ms","Webkit"],e=5,c=b.charAt(0).toUpperCase()+b.substr(1);--e>-1&&void 0===g[f[e]+c];);if(0>e)return"";d=3===e?"ms":f[e],b=d+c}return b},ca=function(a,b,c){var d=a.style;d&&(void 0===d[b]&&(b=ba(a,b)),null==c?d.removeProperty?d.removeProperty(b.replace(/([A-Z])/g,"-$1").toLowerCase()):d.removeAttribute(b):void 0!==d[b]&&(d[b]=c))},da=t.defaultView?t.defaultView.getComputedStyle:y,ea=/(?:Left|Right|Width)/i,fa=/(?:\d|\-|\+|=|#|\.)*/g,ga=function(a,b,c,d,e){if("px"===d||!d)return c;if("auto"===d||!c)return 0;var f,g=ea.test(b),h=a,i=w.style,j=0>c;return j&&(c=-c),"%"===d&&-1!==b.indexOf("border")?f=c/100*(g?a.clientWidth:a.clientHeight):(i.cssText="border:0 solid red;position:"+ia(a,"position",!0)+";line-height:0;","%"!==d&&h.appendChild?i[g?"borderLeftWidth":"borderTopWidth"]=c+d:(h=a.parentNode||t.body,i[g?"width":"height"]=c+d),h.appendChild(w),f=parseFloat(w[g?"offsetWidth":"offsetHeight"]),h.removeChild(w),0!==f||e||(f=ga(a,b,c,d,!0))),j?-f:f},ha=function(a,b){if("absolute"!==ia(a,"position",!0))return 0;var c="left"===b?"Left":"Top",d=ia(a,"margin"+c,!0);return a["offset"+c]-(ga(a,b,parseFloat(d),(d+"").replace(fa,""))||0)},ia=function(a,b,c){var d,e=(a._gsTransform||{})[b];return e||0===e?e:(a.style[b]?e=a.style[b]:(d=da(a))?(e=d.getPropertyValue(b.replace(/([A-Z])/g,"-$1").toLowerCase()),e=e||d.length?e:d[b]):a.currentStyle&&(e=a.currentStyle[b]),"auto"!==e||"top"!==b&&"left"!==b||(e=ha(a,b)),c?e:parseFloat(e)||0)},ja=function(a,b,c){var d=a.vars,e=d[c],f=a._listeners[b];"function"==typeof e&&e.apply(d[c+"Scope"]||d.callbackScope||a,d[c+"Params"]||[a.pointerEvent]),f&&a.dispatchEvent(b)},ka=function(a,b){var c,d,e,f=aa(a);return f?Ea(f,b):void 0!==a.left?(e=ya(b),{left:a.left-e.x,top:a.top-e.y,width:a.width,height:a.height}):(d=a.min||a.minX||a.minRotation||0,c=a.min||a.minY||0,{left:d,top:c,width:(a.max||a.maxX||a.maxRotation||0)-d,height:(a.max||a.maxY||0)-c})},la=function(){if(!t.createElementNS)return g=0,void(h=!1);var a,b,c,d,e=v("div"),f=t.createElementNS("http://www.w3.org/2000/svg","svg"),l=v("div"),m=e.style,n=t.body||u,o="flex"===ia(n,"display",!0);t.body&&oa&&(m.position="absolute",n.appendChild(l),l.appendChild(e),d=e.offsetParent,l.style[oa]="rotate(1deg)",k=e.offsetParent===d,l.style.position="absolute",m.height="10px",d=e.offsetTop,l.style.border="5px solid red",j=d!==e.offsetTop,n.removeChild(l)),m=f.style,f.setAttributeNS(null,"width","400px"),f.setAttributeNS(null,"height","400px"),f.setAttributeNS(null,"viewBox","0 0 400 400"),m.display="block",m.boxSizing="border-box",m.border="0px solid red",m.transform="none",e.style.cssText="width:100px;height:100px;overflow:scroll;-ms-overflow-style:none;",n.appendChild(e),e.appendChild(f),c=f.createSVGPoint().matrixTransform(f.getScreenCTM()),b=c.y,e.scrollTop=100,c.x=c.y=0,c=c.matrixTransform(f.getScreenCTM()),i=b-c.y<100.1?0:b-c.y-150,e.removeChild(f),n.removeChild(e),n.appendChild(f),o&&(n.style.display="block"),a=f.getScreenCTM(),b=a.e,m.border="50px solid red",a=f.getScreenCTM(),0===b&&0===a.e&&0===a.f&&1===a.a?(g=1,h=!0):(g=b!==a.e?1:0,h=1!==a.a),o&&(n.style.display="flex"),n.removeChild(f)},ma=""!==ba(w,"perspective"),na=ba(w,"transformOrigin").replace(/^ms/g,"Ms").replace(/([A-Z])/g,"-$1").toLowerCase(),oa=ba(w,"transform"),pa=oa.replace(/^ms/g,"Ms").replace(/([A-Z])/g,"-$1").toLowerCase(),qa={},ra={},sa=_gsScope.SVGElement,ta=function(a){return!!(sa&&"function"==typeof a.getBBox&&a.getCTM&&(!a.parentNode||a.parentNode.getBBox&&a.parentNode.getCTM))},ua=(/MSIE ([0-9]{1,}[\.0-9]{0,})/.exec(navigator.userAgent)||/Trident\/.*rv:([0-9]{1,}[\.0-9]{0,})/.exec(navigator.userAgent))&&parseFloat(RegExp.$1)<11,va=[],wa=[],xa=function(a){if(!a.getBoundingClientRect||!a.parentNode||!oa)return{offsetTop:0,offsetLeft:0,scaleX:1,scaleY:1,offsetParent:u};if(Ta.cacheSVGData!==!1&&a._dCache&&a._dCache.lastUpdate===b.ticker.frame)return a._dCache;var c,d,e,f,j,k,l,m,n,o,p,q,r=a,s=za(a);if(s.lastUpdate=b.ticker.frame,a.getBBox&&!s.isSVGRoot){for(r=a.parentNode,c=a.getBBox();r&&"svg"!==(r.nodeName+"").toLowerCase();)r=r.parentNode;return f=xa(r),s.offsetTop=c.y*f.scaleY,s.offsetLeft=c.x*f.scaleX,s.scaleX=f.scaleX,s.scaleY=f.scaleY,s.offsetParent=r||u,s}for(e=s.offsetParent,e===t.body&&(e=u),wa.length=va.length=0;r&&(j=ia(r,oa,!0),"matrix(1, 0, 0, 1, 0, 0)"!==j&&"none"!==j&&"translate3d(0px, 0px, 0px)"!==j&&(wa.push(r),va.push(r.style[oa]),r.style[oa]="none"),r!==e);)r=r.parentNode;for(d=e.getBoundingClientRect(),j=a.getScreenCTM(),m=a.createSVGPoint(),l=m.matrixTransform(j),m.x=m.y=10,m=m.matrixTransform(j),s.scaleX=(m.x-l.x)/10,s.scaleY=(m.y-l.y)/10,void 0===g&&la(),s.borderBox&&!h&&a.getAttribute("width")&&(f=da(a)||{},n=parseFloat(f.borderLeftWidth)+parseFloat(f.borderRightWidth)||0,o=parseFloat(f.borderTopWidth)+parseFloat(f.borderBottomWidth)||0,p=parseFloat(f.width)||0,q=parseFloat(f.height)||0,s.scaleX*=(p-n)/p,s.scaleY*=(q-o)/q),i?(c=a.getBoundingClientRect(),s.offsetLeft=c.left-d.left,s.offsetTop=c.top-d.top):(s.offsetLeft=l.x-d.left,s.offsetTop=l.y-d.top),s.offsetParent=e,k=wa.length;--k>-1;)wa[k].style[oa]=va[k];return s},ya=function(a,c){if(c=c||{},!a||a===u||!a.parentNode||a===window)return{x:0,y:0};var d=da(a),e=na&&d?d.getPropertyValue(na):"50% 50%",f=e.split(" "),g=-1!==e.indexOf("left")?"0%":-1!==e.indexOf("right")?"100%":f[0],h=-1!==e.indexOf("top")?"0%":-1!==e.indexOf("bottom")?"100%":f[1];return("center"===h||null==h)&&(h="50%"),("center"===g||isNaN(parseFloat(g)))&&(g="50%"),a.getBBox&&ta(a)?(a._gsTransform||(b.set(a,{x:"+=0",overwrite:!1}),void 0===a._gsTransform.xOrigin&&console.log("Draggable requires at least GSAP 1.17.0")),e=a.getBBox(),c.x=a._gsTransform.xOrigin-e.x,c.y=a._gsTransform.yOrigin-e.y):(a.getBBox&&-1!==(g+h).indexOf("%")&&(a=a.getBBox(),a={offsetWidth:a.width,offsetHeight:a.height}),c.x=-1!==g.indexOf("%")?a.offsetWidth*parseFloat(g)/100:parseFloat(g),c.y=-1!==h.indexOf("%")?a.offsetHeight*parseFloat(h)/100:parseFloat(h)),c},za=function(a){if(Ta.cacheSVGData!==!1&&a._dCache&&a._dCache.lastUpdate===b.ticker.frame)return a._dCache;var c,d=a._dCache=a._dCache||{},e=da(a),f=a.getBBox&&ta(a),g="svg"===(a.nodeName+"").toLowerCase();if(d.isSVG=f,d.isSVGRoot=g,d.borderBox="border-box"===e.boxSizing,d.computedStyle=e,g)c=a.parentNode||u,c.insertBefore(w,a),d.offsetParent=w.offsetParent||u,c.removeChild(w);else if(f){for(c=a.parentNode;c&&"svg"!==(c.nodeName+"").toLowerCase();)c=c.parentNode;d.offsetParent=c}else d.offsetParent=a.offsetParent;return d},Aa=function(a,b,c,d,e){if(a===window||!a||!a.style||!a.parentNode)return[1,0,0,1,0,0];var f,h,i,l,m,n,o,p,q,r,s,v,w,x,y=a._dCache||za(a),z=a.parentNode,A=z._dCache||za(z),B=y.computedStyle,C=y.isSVG?A.offsetParent:z.offsetParent;return f=y.isSVG&&-1!==(a.style[oa]+"").indexOf("matrix")?a.style[oa]:B?B.getPropertyValue(pa):a.currentStyle?a.currentStyle[oa]:"1,0,0,1,0,0",a.getBBox&&-1!==(a.getAttribute("transform")+"").indexOf("matrix")&&(f=a.getAttribute("transform")),f=(f+"").match(/(?:\-|\.|\b)(\d|\.|e\-)+/g)||[1,0,0,1,0,0],f.length>6&&(f=[f[0],f[1],f[4],f[5],f[12],f[13]]),d?f[4]=f[5]=0:y.isSVG&&(m=a._gsTransform)&&(m.xOrigin||m.yOrigin)&&(f[0]=parseFloat(f[0]),f[1]=parseFloat(f[1]),f[2]=parseFloat(f[2]),f[3]=parseFloat(f[3]),f[4]=parseFloat(f[4])-(m.xOrigin-(m.xOrigin*f[0]+m.yOrigin*f[2])),f[5]=parseFloat(f[5])-(m.yOrigin-(m.xOrigin*f[1]+m.yOrigin*f[3]))),b&&(void 0===g&&la(),i=y.isSVG||y.isSVGRoot?xa(a):a,y.isSVG?(l=a.getBBox(),r=A.isSVGRoot?{x:0,y:0}:z.getBBox(),i={offsetLeft:l.x-r.x,offsetTop:l.y-r.y,offsetParent:y.offsetParent}):y.isSVGRoot?(s=parseInt(B.borderTopWidth,10)||0,v=parseInt(B.borderLeftWidth,10)||0,w=(f[0]-g)*v+f[2]*s,x=f[1]*v+(f[3]-g)*s,n=b.x,o=b.y,p=n-(n*f[0]+o*f[2]),q=o-(n*f[1]+o*f[3]),f[4]=parseFloat(f[4])+p,f[5]=parseFloat(f[5])+q,b.x-=p,b.y-=q,n=i.scaleX,o=i.scaleY,e||(b.x*=n,b.y*=o),f[0]*=n,f[1]*=o,f[2]*=n,f[3]*=o,ua||(b.x+=w,b.y+=x),C===t.body&&i.offsetParent===u&&(C=u)):!j&&a.offsetParent&&(b.x+=parseInt(ia(a.offsetParent,"borderLeftWidth"),10)||0,b.y+=parseInt(ia(a.offsetParent,"borderTopWidth"),10)||0),h=z===u||z===t.body,f[4]=Number(f[4])+b.x+(i.offsetLeft||0)-c.x-(h?0:z.scrollLeft||0),f[5]=Number(f[5])+b.y+(i.offsetTop||0)-c.y-(h?0:z.scrollTop||0),z&&"fixed"===ia(a,"position",B)&&(f[4]+=V(),f[5]+=U()),!z||z===u||C!==i.offsetParent||A.isSVG||k&&"100100"!==Aa(z).join("")||(i=A.isSVGRoot?xa(z):z,f[4]-=i.offsetLeft||0,f[5]-=i.offsetTop||0,j||!A.offsetParent||y.isSVG||y.isSVGRoot||(f[4]-=parseInt(ia(A.offsetParent,"borderLeftWidth"),10)||0,f[5]-=parseInt(ia(A.offsetParent,"borderTopWidth"),10)||0))),f},Ba=function(a,b){if(!a||a===window||!a.parentNode)return[1,0,0,1,0,0];for(var c,d,e,f,g,h,i,j,k=ya(a,qa),l=ya(a.parentNode,ra),m=Aa(a,k,l,!1,!b);(a=a.parentNode)&&a.parentNode&&a!==u;)k=l,l=ya(a.parentNode,k===qa?ra:qa),i=Aa(a,k,l),c=m[0],d=m[1],e=m[2],f=m[3],g=m[4],h=m[5],m[0]=c*i[0]+d*i[2],m[1]=c*i[1]+d*i[3],m[2]=e*i[0]+f*i[2],m[3]=e*i[1]+f*i[3],m[4]=g*i[0]+h*i[2]+i[4],m[5]=g*i[1]+h*i[3]+i[5];return b&&(c=m[0],d=m[1],e=m[2],f=m[3],g=m[4],h=m[5],j=c*f-d*e,m[0]=f/j,m[1]=-d/j,m[2]=-e/j,m[3]=c/j,m[4]=(e*h-f*g)/j,m[5]=-(c*h-d*g)/j),m},Ca=function(a,b,c,d,e){a=aa(a);var f=Ba(a,!1,e),g=b.x,h=b.y;return c&&(ya(a,b),g-=b.x,h-=b.y),d=d===!0?b:d||{},d.x=g*f[0]+h*f[2]+f[4],d.y=g*f[1]+h*f[3]+f[5],d},Da=function(a,b,c){var d=a.x*b[0]+a.y*b[2]+b[4],e=a.x*b[1]+a.y*b[3]+b[5];return a.x=d*c[0]+e*c[2]+c[4],a.y=d*c[1]+e*c[3]+c[5],a},Ea=function(a,b,c){if(!(a=aa(a)))return null;b=aa(b);var d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,v,w,x,y,z,A,B=a.getBBox&&ta(a);if(a===window)g=U(),e=V(),f=e+(u.clientWidth||a.innerWidth||t.body.clientWidth||0),h=g+((a.innerHeight||0)-20b;b++)if(c=a[b],Fa(c))for(d=c.length,d=0;d-1;)d[b[e]]=c[e],d[c[e]]=b[e];return d}("touchstart,touchmove,touchend,touchcancel"),Ja=function(a,b,c,d){a.addEventListener?(a.addEventListener(Ia[b],c,d),b!==Ia[b]&&a.addEventListener(b,c,d)):a.attachEvent&&a.attachEvent("on"+b,c)},Ka=function(a,b,c){a.removeEventListener?(a.removeEventListener(Ia[b],c),b!==Ia[b]&&a.removeEventListener(b,c)):a.detachEvent&&a.detachEvent("on"+b,c)},La=function(a,b){for(var c=a.length;--c>-1;)if(a[c].identifier===b)return!0;return!1},Ma=function(a){e=a.touches&&Ih;h++)g[h]=O(b[h],e);else for(h=0;i>h;h++)g[h]=b[h]*e;c+=1.1,d-=1.1}else"function"==typeof b?j.end=function(c){var d,f,g=b.call(a,c);if(1!==e)if("object"==typeof g){d={};for(f in g)d[f]=g[f]*e;g=d}else g*=e;return g}:j.end=b;return(c||0===c)&&(j.max=c),(d||0===d)&&(j.min=d),f&&(j.velocity=0),j},Pa=function(a){var b;return a&&a.getAttribute&&"BODY"!==a.nodeName?"true"===(b=a.getAttribute("data-clickable"))||"false"!==b&&(a.onclick||H.test(a.nodeName+"")||"true"===a.getAttribute("contentEditable"))?!0:Pa(a.parentNode):!1},Qa=function(a,b){for(var c,d=a.length;--d>-1;)c=a[d],c.ondragstart=c.onselectstart=b?null:y,ca(c,"userSelect",b?"text":"none")},Ra=function(){var a,b=t.createElement("div"),c=t.createElement("div"),d=c.style,e=t.body||w;return d.display="inline-block",d.position="relative",b.style.cssText=c.innerHTML="width:90px; height:40px; padding:10px; overflow:auto; visibility: hidden",b.appendChild(c),e.appendChild(b),l=c.offsetHeight+18>b.scrollHeight,d.width="100%",oa||(d.paddingRight="500px",a=b.scrollLeft=b.scrollWidth-b.clientWidth,d.left="-90px",a=a!==b.scrollLeft),e.removeChild(b),a}(),Sa=function(a,c){a=aa(a),c=c||{};var d,e,f,g,h,i,j=t.createElement("div"),k=j.style,m=a.firstChild,n=0,o=0,p=a.scrollTop,q=a.scrollLeft,r=a.scrollWidth,s=a.scrollHeight,u=0,v=0,w=0;ma&&c.force3D!==!1?(h="translate3d(",i="px,0px)"):oa&&(h="translate(",i="px)"),this.scrollTop=function(a,b){return arguments.length?void this.top(-a,b):-this.top()},this.scrollLeft=function(a,b){return arguments.length?void this.left(-a,b):-this.left()},this.left=function(d,e){if(!arguments.length)return-(a.scrollLeft+o);var f=a.scrollLeft-q,g=o;return(f>2||-2>f)&&!e?(q=a.scrollLeft,b.killTweensOf(this,!0,{left:1,scrollLeft:1}),this.left(-q),void(c.onKill&&c.onKill())):(d=-d,0>d?(o=d-.5|0,d=0):d>v?(o=d-v|0,d=v):o=0,(o||g)&&(h?this._suspendTransforms||(k[oa]=h+-o+"px,"+-n+i):k.left=-o+"px",Ra&&o+u>=0&&(k.paddingRight=o+u+"px")),a.scrollLeft=0|d,void(q=a.scrollLeft))},this.top=function(d,e){if(!arguments.length)return-(a.scrollTop+n);var f=a.scrollTop-p,g=n;return(f>2||-2>f)&&!e?(p=a.scrollTop,b.killTweensOf(this,!0,{top:1,scrollTop:1}),this.top(-p),void(c.onKill&&c.onKill())):(d=-d,0>d?(n=d-.5|0,d=0):d>w?(n=d-w|0,d=w):n=0,(n||g)&&(h?this._suspendTransforms||(k[oa]=h+-o+"px,"+-n+i):k.top=-n+"px"),a.scrollTop=0|d,void(p=a.scrollTop))},this.maxScrollTop=function(){return w},this.maxScrollLeft=function(){return v},this.disable=function(){for(m=j.firstChild;m;)g=m.nextSibling,a.appendChild(m),m=g;a===j.parentNode&&a.removeChild(j)},this.enable=function(){if(m=a.firstChild,m!==j){for(;m;)g=m.nextSibling,j.appendChild(m),m=g;a.appendChild(j),this.calibrate()}},this.calibrate=function(b){var c,g,h=a.clientWidth===d;p=a.scrollTop,q=a.scrollLeft,(!h||a.clientHeight!==e||j.offsetHeight!==f||r!==a.scrollWidth||s!==a.scrollHeight||b)&&((n||o)&&(c=this.left(),g=this.top(),this.left(-a.scrollLeft),this.top(-a.scrollTop)),(!h||b)&&(k.display="block",k.width="auto",k.paddingRight="0px",u=Math.max(0,a.scrollWidth-a.clientWidth),u&&(u+=ia(a,"paddingLeft")+(l?ia(a,"paddingRight"):0))),k.display="inline-block",k.position="relative",k.overflow="visible",k.verticalAlign="top",k.width="100%",k.paddingRight=u+"px",l&&(k.paddingBottom=ia(a,"paddingBottom",!0)),C&&(k.zoom="1"),d=a.clientWidth,e=a.clientHeight,r=a.scrollWidth,s=a.scrollHeight,v=a.scrollWidth-d,w=a.scrollHeight-e,f=j.offsetHeight,k.display="block",(c||g)&&(this.left(c),this.top(g)))},this.content=j,this.element=a,this._suspendTransforms=!1,this.enable()},Ta=function(d,g){a.call(this,d),d=aa(d),f||(f=q.com.greensock.plugins.ThrowPropsPlugin),this.vars=g=O(g||{}),this.target=d,this.x=this.y=this.rotation=0,this.dragResistance=parseFloat(g.dragResistance)||0,this.edgeResistance=isNaN(g.edgeResistance)?1:parseFloat(g.edgeResistance)||0,this.lockAxis=g.lockAxis,this.autoScroll=g.autoScroll||0,this.lockedAxis=null,this.allowEventDefault=!!g.allowEventDefault;var h,i,j,k,l,r,s,v,w,y,E,H,P,S,U,V,Z,ba,da,ea,fa,ga,ha,la,ma,na,oa,pa,qa,ra,sa,ua,va,wa,xa=(g.type||(C?"top,left":"x,y")).toLowerCase(),ya=-1!==xa.indexOf("x")||-1!==xa.indexOf("y"),za=-1!==xa.indexOf("rotation"),Aa=za?"rotation":ya?"x":"left",Da=ya?"y":"top",Ea=-1!==xa.indexOf("x")||-1!==xa.indexOf("left")||"scroll"===xa,Fa=-1!==xa.indexOf("y")||-1!==xa.indexOf("top")||"scroll"===xa,Ga=g.minimumMovement||2,Ma=this,Ra=N(g.trigger||g.handle||d),Ua={},Va=0,Wa=!1,Ya=g.autoScrollMarginTop||40,Za=g.autoScrollMarginRight||40,$a=g.autoScrollMarginBottom||40,_a=g.autoScrollMarginLeft||40,ab=g.clickableTest||Pa,bb=0,cb=function(a){return Ma.isPressed&&a.which<2?void Ma.endDrag():(a.preventDefault(),a.stopPropagation(),!1)},db=function(a){if(Ma.autoScroll&&Ma.isDragging&&(Wa||ba)){var b,c,e,f,g,h,j,k,l=d,m=15*Ma.autoScroll;for(Wa=!1,M.scrollTop=null!=window.pageYOffset?window.pageYOffset:null!=u.scrollTop?u.scrollTop:t.body.scrollTop,M.scrollLeft=null!=window.pageXOffset?window.pageXOffset:null!=u.scrollLeft?u.scrollLeft:t.body.scrollLeft,f=Ma.pointerX-M.scrollLeft,g=Ma.pointerY-M.scrollTop;l&&!c;)c=Y(l.parentNode),b=c?M:l.parentNode,e=c?{bottom:Math.max(u.clientHeight,window.innerHeight||0),right:Math.max(u.clientWidth,window.innerWidth||0),left:0,top:0}:b.getBoundingClientRect(),h=j=0,Fa&&(k=b._gsMaxScrollY-b.scrollTop,0>k?j=k:g>e.bottom-$a&&k?(Wa=!0,j=Math.min(k,m*(1-Math.max(0,e.bottom-g)/$a)|0)):gk?h=k:f>e.right-Za&&k?(Wa=!0,h=Math.min(k,m*(1-Math.max(0,e.right-f)/Za)|0)):fn&&n>-p&&(n=0),p>o&&o>-p&&(o=0),za?(Ma.deltaX=n-qa.data.rotation,qa.data.rotation=Ma.rotation=n,qa.setRatio(1)):i?(Fa&&(Ma.deltaY=o-i.top(),i.top(o)),Ea&&(Ma.deltaX=n-i.left(),i.left(n))):ya?(Fa&&(Ma.deltaY=o-qa.data.y,qa.data.y=o),Ea&&(Ma.deltaX=n-qa.data.x,qa.data.x=n),qa.setRatio(1)):(Fa&&(Ma.deltaY=o-parseFloat(d.style.top||0),d.style.top=o+"px"),Ea&&(Ma.deltaY=n-parseFloat(d.style.left||0),d.style.left=n+"px")),!v||a||ua||(ua=!0,ja(Ma,"drag","onDrag"),ua=!1)}ba=!1},eb=function(a,c){var e,f=Ma.x,g=Ma.y;d._gsTransform||!ya&&!za||b.set(d,{x:"+=0",overwrite:!1,data:"_draggable"}),ya?(Ma.y=d._gsTransform.y,Ma.x=d._gsTransform.x):za?Ma.x=Ma.rotation=d._gsTransform.rotation:i?(Ma.y=i.top(),Ma.x=i.left()):(Ma.y=parseInt(d.style.top,10)||0,Ma.x=parseInt(d.style.left,10)||0),(ea||fa||ga)&&!c&&(Ma.isDragging||Ma.isThrowing)&&(ga&&(L.x=Ma.x,L.y=Ma.y,e=ga(L),e.x!==Ma.x&&(Ma.x=e.x,ba=!0),e.y!==Ma.y&&(Ma.y=e.y,ba=!0)),ea&&(e=ea(Ma.x),e!==Ma.x&&(Ma.x=e,za&&(Ma.rotation=e),ba=!0)),fa&&(e=fa(Ma.y),e!==Ma.y&&(Ma.y=e),ba=!0)),ba&&db(!0),a||(Ma.deltaX=Ma.x-f,Ma.deltaY=Ma.y-g,ja(Ma,"throwupdate","onThrowUpdate"))},fb=function(){var a,b,c,e;s=!1,i?(i.calibrate(),Ma.minX=y=-i.maxScrollLeft(),Ma.minY=H=-i.maxScrollTop(),Ma.maxX=w=Ma.maxY=E=0,s=!0):g.bounds&&(a=ka(g.bounds,d.parentNode),za?(Ma.minX=y=a.left,Ma.maxX=w=a.left+a.width,Ma.minY=H=Ma.maxY=E=0):void 0!==g.bounds.maxX||void 0!==g.bounds.maxY?(a=g.bounds,Ma.minX=y=a.minX,Ma.minY=H=a.minY,Ma.maxX=w=a.maxX,Ma.maxY=E=a.maxY):(b=ka(d,d.parentNode),Ma.minX=y=ia(d,Aa)+a.left-b.left,Ma.minY=H=ia(d,Da)+a.top-b.top,Ma.maxX=w=y+(a.width-b.width),Ma.maxY=E=H+(a.height-b.height)),y>w&&(Ma.minX=w,Ma.maxX=w=y,y=Ma.minX),H>E&&(Ma.minY=E,Ma.maxY=E=H,H=Ma.minY),za&&(Ma.minRotation=y,Ma.maxRotation=w),s=!0),g.liveSnap&&(c=g.liveSnap===!0?g.snap||{}:g.liveSnap,e=c instanceof Array||"function"==typeof c,za?(ea=nb(e?c:c.rotation,y,w,1),fa=null):c.points?ga=ob(e?c:c.points,y,w,H,E,c.radius,i?-1:1):(Ea&&(ea=nb(e?c:c.x||c.left||c.scrollLeft,y,w,i?-1:1)),Fa&&(fa=nb(e?c:c.y||c.top||c.scrollTop,H,E,i?-1:1))))},gb=function(){Ma.isThrowing=!1,ja(Ma,"throwcomplete","onThrowComplete")},hb=function(){Ma.isThrowing=!1},ib=function(a,b){var c,e,h,j;a&&f?(a===!0&&(c=g.snap||g.liveSnap||{},e=c instanceof Array||"function"==typeof c,a={resistance:(g.throwResistance||g.resistance||1e3)/(za?10:1)},za?a.rotation=Oa(Ma,e?c:c.rotation,w,y,1,b):(Ea&&(a[Aa]=Oa(Ma,e?c:c.points||c.x||c.left||c.scrollLeft,w,y,i?-1:1,b||"x"===Ma.lockedAxis)),Fa&&(a[Da]=Oa(Ma,e?c:c.points||c.y||c.top||c.scrollTop,E,H,i?-1:1,b||"y"===Ma.lockedAxis)),(c.points||c instanceof Array&&"object"==typeof c[0])&&(a.linkedProps=Aa+","+Da,a.radius=c.radius))),Ma.isThrowing=!0,j=isNaN(g.overshootTolerance)?1===g.edgeResistance?0:1-Ma.edgeResistance+.2:g.overshootTolerance,Ma.tween=h=f.to(i||d,{throwProps:a,data:"_draggable",ease:g.ease||q.Power3.easeOut,onComplete:gb,onOverwrite:hb,onUpdate:g.fastMode?ja:eb,onUpdateParams:g.fastMode?[Ma,"onthrowupdate","onThrowUpdate"]:c&&c.radius?[!1,!0]:x},isNaN(g.maxDuration)?2:g.maxDuration,isNaN(g.minDuration)?0===j||"object"==typeof a&&a.resistance>1e3?0:.5:g.minDuration,j),g.fastMode||(i&&(i._suspendTransforms=!0),h.render(h.duration(),!0,!0),eb(!0,!0),Ma.endX=Ma.x,Ma.endY=Ma.y,za&&(Ma.endRotation=Ma.x),h.play(0),eb(!0,!0),i&&(i._suspendTransforms=!1))):s&&Ma.applyBounds()},jb=function(a){var b,c,e,f,g,h,i,l,m,n=ma||[1,0,0,1,0,0];ma=Ba(d.parentNode,!0),a&&Ma.isPressed&&n.join(",")!==ma.join(",")&&(b=n[0],c=n[1],e=n[2],f=n[3],g=n[4],h=n[5],i=b*f-c*e,l=j*(f/i)+k*(-e/i)+(e*h-f*g)/i,m=j*(-c/i)+k*(b/i)+-(b*h-c*g)/i,k=l*ma[1]+m*ma[3]+ma[5],j=l*ma[0]+m*ma[2]+ma[4]),ma[1]||ma[2]||1!=ma[0]||1!=ma[3]||0!=ma[4]||0!=ma[5]||(ma=null)},kb=function(){var a=1-Ma.edgeResistance;jb(!1),ma&&(j=Ma.pointerX*ma[0]+Ma.pointerY*ma[2]+ma[4],k=Ma.pointerX*ma[1]+Ma.pointerY*ma[3]+ma[5]),ba&&(rb(Ma.pointerX,Ma.pointerY),db(!0)),i?(fb(),r=i.top(),l=i.left()):(lb()?(eb(!0,!0),fb()):Ma.applyBounds(),za?(Z=Ma.rotationOrigin=Ca(d,{x:0,y:0}),eb(!0,!0),l=Ma.x,r=Ma.y=Math.atan2(Z.y-Ma.pointerY,Ma.pointerX-Z.x)*z):(oa=d.parentNode?d.parentNode.scrollTop||0:0,pa=d.parentNode?d.parentNode.scrollLeft||0:0,r=ia(d,Da),l=ia(d,Aa))),s&&a&&(l>w?l=w+(l-w)/a:y>l&&(l=y-(y-l)/a),za||(r>E?r=E+(r-E)/a:H>r&&(r=H-(H-r)/a))),Ma.startX=l,Ma.startY=r},lb=function(){return Ma.tween&&Ma.tween.isActive()},mb=function(){!D.parentNode||lb()||Ma.isDragging||D.parentNode.removeChild(D)},nb=function(a,b,c,d){return"function"==typeof a?function(e){var f=Ma.isPressed?1-Ma.edgeResistance:1;return a.call(Ma,e>c?c+(e-c)*f:b>e?b+(e-b)*f:e)*d}:a instanceof Array?function(d){for(var e,f,g=a.length,h=0,i=A;--g>-1;)e=a[g],f=e-d,0>f&&(f=-f),i>f&&e>=b&&c>=e&&(h=g,i=f);return a[h]}:isNaN(a)?function(a){return a}:function(){return a*d}},ob=function(a,b,c,d,e,f,g){return f=f&&A>f?f*f:A,"function"==typeof a?function(h){var i,j,k,l=Ma.isPressed?1-Ma.edgeResistance:1,m=h.x,n=h.y;return h.x=m=m>c?c+(m-c)*l:b>m?b+(m-b)*l:m,h.y=n=n>e?e+(n-e)*l:d>n?d+(n-d)*l:n,i=a.call(Ma,h),i!==h&&(h.x=i.x,h.y=i.y),1!==g&&(h.x*=g,h.y*=g),A>f&&(j=h.x-m,k=h.y-n,j*j+k*k>f&&(h.x=m,h.y=n)),h}:a instanceof Array?function(b){for(var c,d,e,g,h=a.length,i=0,j=A;--h>-1;)e=a[h],c=e.x-b.x,d=e.y-b.y,g=c*c+d*d,j>g&&(i=h,j=g);return f>=j?a[i]:b}:function(a){return a}},pb=function(a,c){var e;if(h&&!Ma.isPressed&&a&&("mousedown"!==a.type&&"pointerdown"!==a.type||c||!(B()-bb<30)||!Ia[Ma.pointerEvent.type])){if(na=lb(),Ma.pointerEvent=a,Ia[a.type]?(la=-1!==a.type.indexOf("touch")?a.currentTarget||a.target:t,Ja(la,"touchend",sb),Ja(la,"touchmove",qb),Ja(la,"touchcancel",sb),Ja(t,"touchstart",Na)):(la=null,Ja(t,"mousemove",qb)),sa=null,Ja(t,"mouseup",sb),a&&a.target&&Ja(a.target,"mouseup",sb),ha=ab.call(Ma,a.target)&&!g.dragClickables&&!c)return Ja(a.target,"change",sb),ja(Ma,"press","onPress"),void Qa(Ra,!0);if(ra=la&&Ea!==Fa&&Ma.vars.allowNativeTouchScrolling!==!1?Ea?"y":"x":!1,C?a=_(a,!0):ra||Ma.allowEventDefault||(a.preventDefault(),a.preventManipulation&&a.preventManipulation()),a.changedTouches?(a=U=a.changedTouches[0],V=a.identifier):a.pointerId?V=a.pointerId:U=V=null,I++,Q(db),k=Ma.pointerY=a.pageY,j=Ma.pointerX=a.pageX,(ra||Ma.autoScroll)&&$(d.parentNode),!d.parentNode||!Ma.autoScroll||i||za||!d.parentNode._gsMaxScrollX||D.parentNode||d.getBBox||(D.style.width=d.parentNode.scrollWidth+"px",d.parentNode.appendChild(D)),kb(),Ma.tween&&Ma.tween.kill(),Ma.isThrowing=!1,b.killTweensOf(i||d,!0,Ua),i&&b.killTweensOf(d,!0,{scrollTo:1}),Ma.tween=Ma.lockedAxis=null,(g.zIndexBoost||!za&&!i&&g.zIndexBoost!==!1)&&(d.style.zIndex=Ta.zIndex++),Ma.isPressed=!0,v=!(!g.onDrag&&!Ma._listeners.drag),!za)for(e=Ra.length;--e>-1;)ca(Ra[e],"cursor",g.cursor||"move");ja(Ma,"press","onPress")}},qb=function(a){var b,c,d,f,g,i,l=a;if(h&&!e&&Ma.isPressed&&a){if(Ma.pointerEvent=a,b=a.changedTouches){if(a=b[0],a!==U&&a.identifier!==V){for(f=b.length;--f>-1&&(a=b[f]).identifier!==V;);if(0>f)return}}else if(a.pointerId&&V&&a.pointerId!==V)return;if(C)a=_(a,!0);else{if(la&&ra&&!sa&&(c=a.pageX,d=a.pageY,ma&&(f=c*ma[0]+d*ma[2]+ma[4],d=c*ma[1]+d*ma[3]+ma[5],c=f),g=Math.abs(c-j),i=Math.abs(d-k),(g!==i&&(g>Ga||i>Ga)||J&&ra===sa)&&(sa=g>i&&Ea?"x":"y",Ma.vars.lockAxisOnTouchScroll!==!1&&(Ma.lockedAxis="x"===sa?"y":"x","function"==typeof Ma.vars.onLockAxis&&Ma.vars.onLockAxis.call(Ma,l)),J&&ra===sa)))return void sb(l);Ma.allowEventDefault||ra&&(!sa||ra===sa)||l.cancelable===!1||(l.preventDefault(),l.preventManipulation&&l.preventManipulation())}Ma.autoScroll&&(Wa=!0),rb(a.pageX,a.pageY)}},rb=function(a,b){var c,d,e,f,g,h,i=1-Ma.dragResistance,m=1-Ma.edgeResistance;Ma.pointerX=a,Ma.pointerY=b,za?(f=Math.atan2(Z.y-b,a-Z.x)*z,g=Ma.y-f,g>180?(r-=360,Ma.y=f):-180>g&&(r+=360,Ma.y=f),Ma.x!==l||Math.abs(r-f)>Ga?(Ma.y=f,e=l+(r-f)*i):e=l):(ma&&(h=a*ma[0]+b*ma[2]+ma[4],b=a*ma[1]+b*ma[3]+ma[5],a=h),d=b-k,c=a-j,Ga>d&&d>-Ga&&(d=0),Ga>c&&c>-Ga&&(c=0),(Ma.lockAxis||Ma.lockedAxis)&&(c||d)&&(h=Ma.lockedAxis,h||(Ma.lockedAxis=h=Ea&&Math.abs(c)>Math.abs(d)?"y":Fa?"x":null,h&&"function"==typeof Ma.vars.onLockAxis&&Ma.vars.onLockAxis.call(Ma,Ma.pointerEvent)),"y"===h?d=0:"x"===h&&(c=0)),e=l+c*i,f=r+d*i),(ea||fa||ga)&&(Ma.x!==e||Ma.y!==f&&!za)?(ga&&(L.x=e,L.y=f,h=ga(L),e=h.x,f=h.y),ea&&(e=ea(e)),fa&&(f=fa(f))):s&&(e>w?e=w+(e-w)*m:y>e&&(e=y+(e-y)*m),za||(f>E?f=E+(f-E)*m:H>f&&(f=H+(f-H)*m))),za||ma||(e=Math.round(e),f=Math.round(f)),(Ma.x!==e||Ma.y!==f&&!za)&&(za?(Ma.endRotation=Ma.x=Ma.endX=e,ba=!0):(Fa&&(Ma.y=Ma.endY=f,ba=!0),Ea&&(Ma.x=Ma.endX=e,ba=!0)),!Ma.isDragging&&Ma.isPressed&&(Ma.isDragging=!0,ja(Ma,"dragstart","onDragStart")))},sb=function(a,c){if(h&&Ma.isPressed&&(!a||null==V||c||!(a.pointerId&&a.pointerId!==V||a.changedTouches&&!La(a.changedTouches,V)))){Ma.isPressed=!1;var e,f,i,j,k,l=a,m=Ma.isDragging,n=b.delayedCall(.001,mb);if(la?(Ka(la,"touchend",sb),Ka(la,"touchmove",qb),Ka(la,"touchcancel",sb),Ka(t,"touchstart",Na)):Ka(t,"mousemove",qb),Ka(t,"mouseup",sb),a&&a.target&&Ka(a.target,"mouseup",sb),ba=!1,ha)return a&&(Ka(a.target,"change",sb),Ma.pointerEvent=l),Qa(Ra,!1),ja(Ma,"release","onRelease"),ja(Ma,"click","onClick"),void(ha=!1);if(R(db),!za)for(f=Ra.length;--f>-1;)ca(Ra[f],"cursor",g.cursor||"move");if(m&&(Va=K=B(),Ma.isDragging=!1),I--,a){if(C&&(a=_(a,!1)),e=a.changedTouches,e&&(a=e[0],a!==U&&a.identifier!==V)){for(f=e.length;--f>-1&&(a=e[f]).identifier!==V;);if(0>f)return}Ma.pointerEvent=l,Ma.pointerX=a.pageX,Ma.pointerY=a.pageY}return l&&!m?(na&&(g.snap||g.bounds)&&ib(g.throwProps),ja(Ma,"release","onRelease"),J&&"touchmove"===l.type||-1!==l.type.indexOf("cancel")||(ja(Ma,"click","onClick"),B()-bb<300&&ja(Ma,"doubleclick","onDoubleClick"),j=l.target||l.srcElement||d,bb=B(),k=function(){bb!==va&&Ma.enabled()&&!Ma.isPressed&&(j.click?j.click():t.createEvent&&(i=t.createEvent("MouseEvents"),i.initMouseEvent("click",!0,!0,window,1,Ma.pointerEvent.screenX,Ma.pointerEvent.screenY,Ma.pointerX,Ma.pointerY,!1,!1,!1,!1,0,null),j.dispatchEvent(i)))},J||l.defaultPrevented||b.delayedCall(1e-5,k))):(ib(g.throwProps),C||Ma.allowEventDefault||!l||!g.dragClickables&&ab.call(Ma,l.target)||!m||ra&&(!sa||ra!==sa)||l.cancelable===!1||(l.preventDefault(),l.preventManipulation&&l.preventManipulation()),ja(Ma,"release","onRelease")),lb()&&n.duration(Ma.tween.duration()),m&&ja(Ma,"dragend","onDragEnd"),!0}},tb=function(a){if(a&&Ma.isDragging&&!i){var b=a.target||a.srcElement||d.parentNode,c=b.scrollLeft-b._gsScrollX,e=b.scrollTop-b._gsScrollY;(c||e)&&(ma?(j-=c*ma[0]+e*ma[2],k-=e*ma[3]+c*ma[1]):(j-=c,k-=e),b._gsScrollX+=c,b._gsScrollY+=e,rb(Ma.pointerX,Ma.pointerY))}},ub=function(a){var b=B(),c=40>b-bb,d=40>b-Va,e=c&&va===bb,f=!!a.preventDefault,g=Ma.pointerEvent&&Ma.pointerEvent.defaultPrevented,h=c&&wa===bb,i=a.isTrusted||null==a.isTrusted&&c&&e;return f&&(e||d&&Ma.vars.suppressClickOnDrag!==!1)&&a.stopImmediatePropagation(),!c||Ma.pointerEvent&&Ma.pointerEvent.defaultPrevented||e&&i===h?void((Ma.isPressed||d||c)&&(f?i&&a.detail&&c&&!g||(a.preventDefault(),a.preventManipulation&&a.preventManipulation()):a.returnValue=!1)):(i&&e&&(wa=bb),void(va=bb))},vb=function(a){return ma?{x:a.x*ma[0]+a.y*ma[2]+ma[4],y:a.x*ma[1]+a.y*ma[3]+ma[5]}:{x:a.x,y:a.y}};da=Ta.get(this.target),da&&da.kill(),this.startDrag=function(a,b){var c,e,f,g;pb(a||Ma.pointerEvent,!0),b&&!Ma.hitTest(a||Ma.pointerEvent)&&(c=Xa(a||Ma.pointerEvent),e=Xa(d),f=vb({x:c.left+c.width/2,y:c.top+c.height/2}),g=vb({x:e.left+e.width/2,y:e.top+e.height/2}),j-=f.x-g.x,k-=f.y-g.y),Ma.isDragging||(Ma.isDragging=!0, 28 | ja(Ma,"dragstart","onDragStart"))},this.drag=qb,this.endDrag=function(a){sb(a||Ma.pointerEvent,!0)},this.timeSinceDrag=function(){return Ma.isDragging?0:(B()-Va)/1e3},this.timeSinceClick=function(){return(B()-bb)/1e3},this.hitTest=function(a,b){return Ta.hitTest(Ma.target,a,b)},this.getDirection=function(a,b){var c,d,e,g,h,i,j="velocity"===a&&f?a:"object"!=typeof a||za?"start":"element";return"element"===j&&(h=Xa(Ma.target),i=Xa(a)),c="start"===j?Ma.x-l:"velocity"===j?f.getVelocity(this.target,Aa):h.left+h.width/2-(i.left+i.width/2),za?0>c?"counter-clockwise":"clockwise":(b=b||2,d="start"===j?Ma.y-r:"velocity"===j?f.getVelocity(this.target,Da):h.top+h.height/2-(i.top+i.height/2),e=Math.abs(c/d),g=1/b>e?"":0>c?"left":"right",b>e&&(""!==g&&(g+="-"),g+=0>d?"up":"down"),g)},this.applyBounds=function(a){var b,c,e,f,h,i;if(a&&g.bounds!==a)return g.bounds=a,Ma.update(!0);if(eb(!0),fb(),s){if(b=Ma.x,c=Ma.y,b>w?b=w:y>b&&(b=y),c>E?c=E:H>c&&(c=H),(Ma.x!==b||Ma.y!==c)&&(e=!0,Ma.x=Ma.endX=b,za?Ma.endRotation=b:Ma.y=Ma.endY=c,ba=!0,db(!0),Ma.autoScroll&&!Ma.isDragging))for($(d.parentNode),f=d,M.scrollTop=null!=window.pageYOffset?window.pageYOffset:null!=u.scrollTop?u.scrollTop:t.body.scrollTop,M.scrollLeft=null!=window.pageXOffset?window.pageXOffset:null!=u.scrollLeft?u.scrollLeft:t.body.scrollLeft;f&&!i;)i=Y(f.parentNode),h=i?M:f.parentNode,Fa&&h.scrollTop>h._gsMaxScrollY&&(h.scrollTop=h._gsMaxScrollY),Ea&&h.scrollLeft>h._gsMaxScrollX&&(h.scrollLeft=h._gsMaxScrollX),f=h;Ma.isThrowing&&(e||Ma.endX>w||Ma.endXE||Ma.endY.01||Fa&&Math.abs(f-Ma.y)>.01&&!za)&&kb(),Ma.autoScroll&&($(d.parentNode),Wa=Ma.isDragging,db(!0)),Ma.autoScroll&&(X(d,tb),W(d,tb)),Ma},this.enable=function(a){var e,j,k;if("soft"!==a){for(j=Ra.length;--j>-1;)k=Ra[j],Ja(k,"mousedown",pb),Ja(k,"touchstart",pb),Ja(k,"click",ub,!0),za||ca(k,"cursor",g.cursor||"move"),ca(k,"touchCallout","none"),ca(k,"touchAction",Ea===Fa?"none":Ea?"pan-y":"pan-x"),ta(k)&&ca(k.ownerSVGElement||k,"touchAction",Ea===Fa?"none":Ea?"pan-y":"pan-x"),this.vars.allowContextMenu||Ja(k,"contextmenu",cb);Qa(Ra,!1)}return W(d,tb),h=!0,f&&"soft"!==a&&f.track(i||d,ya?"x,y":za?"rotation":"top,left"),i&&i.enable(),d._gsDragID=e="d"+G++,F[e]=this,i&&(i.element._gsDragID=e),b.set(d,{x:"+=0",overwrite:!1,data:"_draggable"}),qa={t:d,data:C?S:d._gsTransform,tween:{},setRatio:C?function(){b.set(d,P)}:c._internals.setTransformRatio||c._internals.set3DTransformRatio},kb(),Ma.update(!0),Ma},this.disable=function(a){var b,c,e=Ma.isDragging;if(!za)for(b=Ra.length;--b>-1;)ca(Ra[b],"cursor",null);if("soft"!==a){for(b=Ra.length;--b>-1;)c=Ra[b],ca(c,"touchCallout",null),ca(c,"touchAction",null),Ka(c,"mousedown",pb),Ka(c,"touchstart",pb),Ka(c,"click",ub),Ka(c,"contextmenu",cb);Qa(Ra,!0),la&&(Ka(la,"touchcancel",sb),Ka(la,"touchend",sb),Ka(la,"touchmove",qb)),Ka(t,"mouseup",sb),Ka(t,"mousemove",qb)}return X(d,tb),h=!1,f&&"soft"!==a&&f.untrack(i||d,ya?"x,y":za?"rotation":"top,left"),i&&i.disable(),R(db),Ma.isDragging=Ma.isPressed=ha=!1,e&&ja(Ma,"dragend","onDragEnd"),Ma},this.enabled=function(a,b){return arguments.length?a?Ma.enable(b):Ma.disable(b):h},this.kill=function(){return Ma.isThrowing=!1,b.killTweensOf(i||d,!0,Ua),Ma.disable(),delete F[d._gsDragID],Ma},-1!==xa.indexOf("scroll")&&(i=this.scrollProxy=new Sa(d,T({onKill:function(){Ma.isPressed&&sb(null)}},g)),d.style.overflowY=Fa&&!Ha?"auto":"hidden",d.style.overflowX=Ea&&!Ha?"auto":"hidden",d=i.content),g.force3D!==!1&&b.set(d,{force3D:!0}),za?Ua.rotation=1:(Ea&&(Ua[Aa]=1),Fa&&(Ua[Da]=1)),za?(P=p,S=P.css,P.overwrite=!1):ya&&(P=Ea&&Fa?m:Ea?n:o,S=P.css,P.overwrite=!1),this.enable()},Ua=Ta.prototype=new a;Ua.constructor=Ta,Ua.pointerX=Ua.pointerY=Ua.startX=Ua.startY=Ua.deltaX=Ua.deltaY=0,Ua.isDragging=Ua.isPressed=!1,Ta.version="0.16.1",Ta.zIndex=1e3,Ja(t,"touchcancel",function(){}),Ja(t,"contextmenu",function(a){var b;for(b in F)F[b].isPressed&&F[b].endDrag()}),Ta.create=function(a,c){"string"==typeof a&&(a=b.selector(a));for(var d=a&&0!==a.length?Fa(a)?Ga(a):[a]:[],e=d.length;--e>-1;)d[e]=new Ta(d[e],c);return d},Ta.get=function(a){return F[(aa(a)||{})._gsDragID]},Ta.timeSinceDrag=function(){return(B()-K)/1e3};var Va={},Wa=function(a){var b,c,d=0,e=0;for(a=aa(a),b=a.offsetWidth,c=a.offsetHeight;a;)d+=a.offsetTop,e+=a.offsetLeft,a=a.offsetParent;return{top:d,left:e,width:b,height:c}},Xa=function(a,b){if(a===window)return Va.left=Va.top=0,Va.width=Va.right=u.clientWidth||a.innerWidth||t.body.clientWidth||0,Va.height=Va.bottom=(a.innerHeight||0)-20g.right||h.rightg.bottom||h.bottom=g.width*g.height*c||e>=h.width*h.height*c):d.width>c&&d.height>c)},D.style.cssText="visibility:hidden;height:1px;top:-1px;pointer-events:none;position:relative;clear:both;",Ta},!0)}),_gsScope._gsDefine&&_gsScope._gsQueue.pop()(); --------------------------------------------------------------------------------