1function checkEmailSyntax(value) { 2 if (/\S+@\S+\.\S+/.test(value)) { 3 return (true) 4 } 5 return (false) 6} 7 8function warnEmail(inputField) { 9 $(inputField).parent().removeClass('correct') 10 $(inputField).parent().addClass('error') 11 12 if (checkEmailSyntax(inputField.value)) { 13 $(inputField).parent().removeClass('error') 14 $(inputField).parent().addClass('correct') 15 return (true) 16 } 17 //console.log(inputField.value) 18} 19 20// not firing this can be used in submit scripts though 21function validateEmail(value) { 22 if (checkEmailSyntax(value)) { 23 return true 24 } 25 alert("Check that email, I think there's something wrong with it!") 26 return (false) 27} 28 29 30var currentTier = "" 31var currentPrices = [0,0,0] 32var currentStripePrice = "" 33 34var pricing = { 35"pro": [299,269,239], 36"codeplus": [199,179,159], 37"media": [99,89,79] 38} 39 40/* 41// PROD 42var stripePrices = { 43"pro": "price_1IVS6fJaG4we4cXKvg05aW3J", 44"code": "price_1IVS47JaG4we4cXKiR3FOJEM", 45"media": "price_1I3l6PJaG4we4cXKAHVG0fyi" 46} 47*/ 48 49// TESTING 50var stripePrices = { 51 "pro": "price_1IVSOVJaG4we4cXKaem2hwvG", 52 "codeplus": "price_1IVSOVJaG4we4cXK1CwnbSsi", 53 "media": "price_1IVSOVJaG4we4cXK65Nvx3vR" 54} 55 56function isInt(value) { 57 return !isNaN(value) && parseInt(Number(value)) == value && !isNaN(parseInt(value, 10)); 58} 59 60function checkSeatCount(input) { 61 if (!isInt(input.value)) { 62 input.value = input.defaultValue 63 } 64 65 updatePriceVariables() 66 updatePrice() 67} 68 69function updatePriceVariables() { 70 currentTier = getTier() 71 currentPrices = pricing[currentTier] 72 currentStripePrice = stripePrices[currentTier] 73} 74 75function getTier() { 76 let elements = document.getElementsByClassName("get-pro") 77 if (elements.length > 0) { 78 return "pro" 79 } 80 elements = document.getElementsByClassName("get-codeplus") 81 if (elements.length > 0) { 82 return "codeplus" 83 } 84 elements = document.getElementsByClassName("get-media") 85 if (elements.length > 0) { 86 return "media" 87 } 88} 89 90function updatePrice() { 91 let seatCount = document.getElementById("seatcount").value 92 let priceElement = document.getElementById("price") 93 console.log(seatCount) 94 console.log(priceElement.innerHTML) 95 if (seatCount == 1) { 96 priceElement.innerHTML = "$"+currentPrices[0] 97 currentStripePrice = stripePrices[0] 98 } else if ((seatCount >= 2) && (seatCount <= 10)) { 99 priceElement.innerHTML = "$"+currentPrices[1] 100 currentStripePrice = stripePrices[1] 101 } else if (seatCount >= 10) { 102 priceElement.innerHTML = "$"+currentPrices[2] 103 currentStripePrice = stripePrices[2] 104 } 105} 106/** 107 * slideToAnchor.js 108 */ 109 110 111 112 113$('a[href^="#"]').on('click', function(event) { 114 if(isAPIDocURL()) return; 115 var target = $(this.getAttribute('href')); 116 117 if( target.length ) { 118 event.preventDefault(); 119 $('html, body').stop().animate({ 120 scrollTop: target.offset().top 121 }, 1000); 122 } 123}); 124 125function isAPIDocURL() { 126 let modules = ["flow", "flood", "math", "json", "foundation", "system"] 127 let currentUrl = window.location.href; 128 const isAPIUrl = (module) => currentUrl.includes(`api/${module}`) 129 return modules.some(isAPIUrl) 130} 131 132// Copyright 2014 Google Inc. All rights reserved. 133// 134// Licensed under the Apache License, Version 2.0 (the "License"); 135// you may not use this file except in compliance with the License. 136// You may obtain a copy of the License at 137// 138// http://www.apache.org/licenses/LICENSE-2.0 139// 140// Unless required by applicable law or agreed to in writing, software 141// distributed under the License is distributed on an "AS IS" BASIS, 142// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 143// See the License for the specific language governing permissions and 144// limitations under the License. 145 146!function(a,b){var c={},d={};!function(a,b){function c(a){if("number"==typeof a)return a;var b={};for(var c in a)b[c]=a[c];return b}function d(){this._delay=0,this._endDelay=0,this._fill="none",this._iterationStart=0,this._iterations=1,this._duration=0,this._playbackRate=1,this._direction="normal",this._easing="linear",this._easingFunction=x}function e(){return a.isDeprecated("Invalid timing inputs","2016-03-02","TypeError exceptions will be thrown instead.",!0)}function f(b,c,e){var f=new d;return c&&(f.fill="both",f.duration="auto"),"number"!=typeof b||isNaN(b)?void 0!==b&&Object.getOwnPropertyNames(b).forEach(function(c){if("auto"!=b[c]){if(("number"==typeof f[c]||"duration"==c)&&("number"!=typeof b[c]||isNaN(b[c])))return;if("fill"==c&&-1==v.indexOf(b[c]))return;if("direction"==c&&-1==w.indexOf(b[c]))return;if("playbackRate"==c&&1!==b[c]&&a.isDeprecated("AnimationEffectTiming.playbackRate","2014-11-28","Use Animation.playbackRate instead."))return;f[c]=b[c]}}):f.duration=b,f}
vendor: 5,896 bytes, line 146
146function g(a){return"number"==typeof a&&(a=isNaN(a)?{duration:0}:{duration:a}),a}function h(b,c){return b=a.numericTimingToObject(b),f(b,c)}function i(a,b,c,d){return a<0||a>1||c<0||c>1?x:function(e){function f(a,b,c){return 3*a*(1-c)*(1-c)*c+3*b*(1-c)*c*c+c*c*c}if(e<=0){var g=0;return a>0?g=b/a:!b&&c>0&&(g=d/c),g*e}if(e>=1){var h=0;return c<1?h=(d-1)/(c-1):1==c&&a<1&&(h=(b-1)/(a-1)),1+h*(e-1)}for(var i=0,j=1;i<j;){var k=(i+j)/2,l=f(a,c,k);if(Math.abs(e-l)<1e-5)return f(b,d,k);l<e?i=k:j=k}return f(b,d,k)}}function j(a,b){return function(c){if(c>=1)return 1;var d=1/a;return(c+=b*d)-c%d}}function k(a){C||(C=document.createElement("div").style),C.animationTimingFunction="",C.animationTimingFunction=a;var b=C.animationTimingFunction;if(""==b&&e())throw new TypeError(a+" is not a valid value for easing");return b}function l(a){if("linear"==a)return x;var b=E.exec(a);if(b)return i.apply(this,b.slice(1).map(Number));var c=F.exec(a);return c?j(Number(c[1]),{start:y,middle:z,end:A}[c[2]]):B[a]||x}function m(a){return Math.abs(n(a)/a.playbackRate)}function n(a){return 0===a.duration||0===a.iterations?0:a.duration*a.iterations}function o(a,b,c){if(null==b)return G;var d=c.delay+a+c.endDelay;return b<Math.min(c.delay,d)?H:b>=Math.min(c.delay+a,d)?I:J}function p(a,b,c,d,e){switch(d){case H:return"backwards"==b||"both"==b?0:null;case J:return c-e;case I:return"forwards"==b||"both"==b?a:null;case G:return null}}function q(a,b,c,d,e){var f=e;return 0===a?b!==H&&(f+=c):f+=d/a,f}function r(a,b,c,d,e,f){var g=a===1/0?b%1:a%1;return 0!==g||c!==I||0===d||0===e&&0!==f||(g=1),g}function s(a,b,c,d){return a===I&&b===1/0?1/0:1===c?Math.floor(d)-1:Math.floor(d)}function t(a,b,c){var d=a;if("normal"!==a&&"reverse"!==a){var e=b;"alternate-reverse"===a&&(e+=1),d="normal",e!==1/0&&e%2!=0&&(d="reverse")}return"normal"===d?c:1-c}function u(a,b,c){var d=o(a,b,c),e=p(a,c.fill,b,d,c.delay);if(null===e)return null;var f=q(c.duration,d,c.iterations,e,c.iterationStart),g=r(f,c.iterationStart,d,c.iterations,e,c.duration),h=s(d,c.iterations,g,f),i=t(c.direction,h,g);return c._easingFunction(i)}var v="backwards|forwards|both|none".split("|"),w="reverse|alternate|alternate-reverse".split("|"),x=function(a){return a};d.prototype={_setMember:function(b,c){this["_"+b]=c,this._effect&&(this._effect._timingInput[b]=c,this._effect._timing=a.normalizeTimingInput(this._effect._timingInput),this._effect.activeDuration=a.calculateActiveDuration(this._effect._timing),this._effect._animation&&this._effect._animation._rebuildUnderlyingAnimation())},get playbackRate(){return this._playbackRate},set delay(a){this._setMember("delay",a)},get delay(){return this._delay},set endDelay(a){this._setMember("endDelay",a)},get endDelay(){return this._endDelay},set fill(a){this._setMember("fill",a)},get fill(){return this._fill},set iterationStart(a){if((isNaN(a)||a<0)&&e())throw new TypeError("iterationStart must be a non-negative number, received: "+timing.iterationStart);this._setMember("iterationStart",a)},get iterationStart(){return this._iterationStart},set duration(a){if("auto"!=a&&(isNaN(a)||a<0)&&e())throw new TypeError("duration must be non-negative or auto, received: "+a);this._setMember("duration",a)},get duration(){return this._duration},set direction(a){this._setMember("direction",a)},get direction(){return this._direction},set easing(a){this._easingFunction=l(k(a)),this._setMember("easing",a)},get easing(){return this._easing},set iterations(a){if((isNaN(a)||a<0)&&e())throw new TypeError("iterations must be non-negative, received: "+a);this._setMember("iterations",a)},get iterations(){return this._iterations}};var y=1,z=.5,A=0,B={ease:i(.25,.1,.25,1),"ease-in":i(.42,0,1,1),"ease-out":i(0,0,.58,1),"ease-in-out":i(.42,0,.58,1),"step-start":j(1,y),"step-middle":j(1,z),"step-end":j(1,A)},C=null,D="\\s*(-?\\d+\\.?\\d*|-?\\.\\d+)\\s*",E=new RegExp("cubic-bezier\\("+D+","+D+","+D+","+D+"\\)"),F=/steps\(\s*(\d+)\s*,\s*(start|middle|end)\s*\)/,G=0,H=1,I=2,J=3;a.cloneTimingInput=c,a.makeTiming=f,a.numericTimingToObject=g,a.normalizeTimingInput=h,a.calculateActiveDuration=m,a.calculateIterationProgress=u,a.calculatePhase=o,a.normalizeEasing=k,a.parseEasingFunction=l}(c),function(a,b){function c(a,b){return a in k?k[a][b]||b:b}function d(a){return"display"===a||0===a.lastIndexOf("animation",0)||0===a.lastIndexOf("transition",0)}function e(a,b,e){if(!d(a)){var f=h[a];if(f){i.style[a]=b;for(var g in f){var j=f[g],k=i.style[j];e[j]=c(j,k)}}else e[a]=c(a,b)}}function f(a){var b=[];for(var c in a)if(!(c in["easing","offset","composite"])){var d=a[c];Array.isArray(d)||(d=[d]);for(var e,f=d.length,g=0;g<f;g++)e={},e.offset="offset"in a?a.offset:1==f?1:g/(f-1),"easing"in a&&(e.easing=a.easing),"composite"in a&&(e.composite=a.composite),e[c]=d[g],b.push(e)}return b.sort(function(a,b){return a.offset-b.offset}),b}function g(b){function c(){var a=d.length;null==d[a-1].offset&&(d[a-1].offset=1),a>1&&null==d[0].offset&&(d[0].offset=0);for(var b=0,c=d[0].offset,e=1;e<a;e++){var f=d[e].offset;if(null!=f){for(var g=1;g<e-b;g++)d[b+g].offset=c+(f-c)*g/(e-b);b=e,c=f}}}if(null==b)return[];window.Symbol&&Symbol.iterator&&Array.prototype.from&&b[Symbol.iterator]&&(b=Array.from(b)),Array.isArray(b)||(b=f(b));for(var d=b.map(function(b){var c={};for(var d in b){var f=b[d];if("offset"==d){if(null!=f){if(f=Number(f),!isFinite(f))throw new TypeError("Keyframe offsets must be numbers.");if(f<0||f>1)throw new TypeError("Keyframe offsets must be between 0 and 1.")}}else if("composite"==d){if("add"==f||"accumulate"==f)throw{type:DOMException.NOT_SUPPORTED_ERR,name:"NotSupportedError",message:"add compositing is not supported"};if("replace"!=f)throw new TypeError("Invalid composite mode "+f+".")}else f="easing"==d?a.normalizeEasing(f):""+f;e(d,f,c)}return void 0==c.offset&&(c.offset=null),void 0==c.easing&&(c.easing="linear"),c}),g=!0,h=-1/0,i=0;i<d.length;i++){var j=d[i].offset;
vendor: 24,837 bytes, line 146
146if(null!=j){if(j<h)throw new TypeError("Keyframes are not loosely sorted by offset. Sort or specify offsets.");h=j}else g=!1}return d=d.filter(function(a){return a.offset>=0&&a.offset<=1}),g||c(),d}var h={background:["backgroundImage","backgroundPosition","backgroundSize","backgroundRepeat","backgroundAttachment","backgroundOrigin","backgroundClip","backgroundColor"],border:["borderTopColor","borderTopStyle","borderTopWidth","borderRightColor","borderRightStyle","borderRightWidth","borderBottomColor","borderBottomStyle","borderBottomWidth","borderLeftColor","borderLeftStyle","borderLeftWidth"],borderBottom:["borderBottomWidth","borderBottomStyle","borderBottomColor"],borderColor:["borderTopColor","borderRightColor","borderBottomColor","borderLeftColor"],borderLeft:["borderLeftWidth","borderLeftStyle","borderLeftColor"],borderRadius:["borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius"],borderRight:["borderRightWidth","borderRightStyle","borderRightColor"],borderTop:["borderTopWidth","borderTopStyle","borderTopColor"],borderWidth:["borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth"],flex:["flexGrow","flexShrink","flexBasis"],font:["fontFamily","fontSize","fontStyle","fontVariant","fontWeight","lineHeight"],margin:["marginTop","marginRight","marginBottom","marginLeft"],outline:["outlineColor","outlineStyle","outlineWidth"],padding:["paddingTop","paddingRight","paddingBottom","paddingLeft"]},i=document.createElementNS("http://www.w3.org/1999/xhtml","div"),j={thin:"1px",medium:"3px",thick:"5px"},k={borderBottomWidth:j,borderLeftWidth:j,borderRightWidth:j,borderTopWidth:j,fontSize:{"xx-small":"60%","x-small":"75%",small:"89%",medium:"100%",large:"120%","x-large":"150%","xx-large":"200%"},fontWeight:{normal:"400",bold:"700"},outlineWidth:j,textShadow:{none:"0px 0px 0px transparent"},boxShadow:{none:"0px 0px 0px 0px transparent"}};a.convertToArrayForm=f,a.normalizeKeyframes=g}(c),function(a){var b={};a.isDeprecated=function(a,c,d,e){var f=e?"are":"is",g=new Date,h=new Date(c);return h.setMonth(h.getMonth()+3),!(g<h&&(a in b||console.warn("Web Animations: "+a+" "+f+" deprecated and will stop working on "+h.toDateString()+". "+d),b[a]=!0,1))},a.deprecated=function(b,c,d,e){var f=e?"are":"is";if(a.isDeprecated(b,c,d,e))throw new Error(b+" "+f+" no longer supported. "+d)}}(c),function(){if(document.documentElement.animate){var a=document.documentElement.animate([],0),b=!0;if(a&&(b=!1,"play|currentTime|pause|reverse|playbackRate|cancel|finish|startTime|playState".split("|").forEach(function(c){void 0===a[c]&&(b=!0)})),!b)return}!function(a,b,c){function d(a){for(var b={},c=0;c<a.length;c++)for(var d in a[c])if("offset"!=d&&"easing"!=d&&"composite"!=d){var e={offset:a[c].offset,easing:a[c].easing,value:a[c][d]};b[d]=b[d]||[],b[d].push(e)}for(var f in b){var g=b[f];if(0!=g[0].offset||1!=g[g.length-1].offset)throw{type:DOMException.NOT_SUPPORTED_ERR,name:"NotSupportedError",message:"Partial keyframes are not supported"}}return b}function e(c){var d=[];for(var e in c)for(var f=c[e],g=0;g<f.length-1;g++){var h=g,i=g+1,j=f[h].offset,k=f[i].offset,l=j,m=k;0==g&&(l=-1/0,0==k&&(i=h)),g==f.length-2&&(m=1/0,1==j&&(h=i)),d.push({applyFrom:l,applyTo:m,startOffset:f[h].offset,endOffset:f[i].offset,easingFunction:a.parseEasingFunction(f[h].easing),property:e,interpolation:b.propertyInterpolation(e,f[h].value,f[i].value)})}return d.sort(function(a,b){return a.startOffset-b.startOffset}),d}b.convertEffectInput=function(c){var f=a.normalizeKeyframes(c),g=d(f),h=e(g);return function(a,c){if(null!=c)h.filter(function(a){return c>=a.applyFrom&&c<a.applyTo}).forEach(function(d){var e=c-d.startOffset,f=d.endOffset-d.startOffset,g=0==f?0:d.easingFunction(e/f);b.apply(a,d.property,d.interpolation(g))});else for(var d in g)"offset"!=d&&"easing"!=d&&"composite"!=d&&b.clear(a,d)}}}(c,d),function(a,b,c){function d(a){return a.replace(/-(.)/g,function(a,b){return b.toUpperCase()})}function e(a,b,c){h[c]=h[c]||[],h[c].push([a,b])}function f(a,b,c){for(var f=0;f<c.length;f++){e(a,b,d(c[f]))}}function g(c,e,f){var g=c;/-/.test(c)&&!a.isDeprecated("Hyphenated property names","2016-03-22","Use camelCase instead.",!0)&&(g=d(c)),"initial"!=e&&"initial"!=f||("initial"==e&&(e=i[g]),"initial"==f&&(f=i[g]));for(var j=e==f?[]:h[g],k=0;j&&k<j.length;k++){var l=j[k][0](e),m=j[k][0](f);if(void 0!==l&&void 0!==m){var n=j[k][1](l,m);if(n){var o=b.Interpolation.apply(null,n);return function(a){return 0==a?e:1==a?f:o(a)}}}}return b.Interpolation(!1,!0,function(a){return a?f:e})}var h={};b.addPropertiesHandler=f;var i={backgroundColor:"transparent",backgroundPosition:"0% 0%",borderBottomColor:"currentColor",borderBottomLeftRadius:"0px",borderBottomRightRadius:"0px",borderBottomWidth:"3px",borderLeftColor:"currentColor",borderLeftWidth:"3px",borderRightColor:"currentColor",borderRightWidth:"3px",borderSpacing:"2px",borderTopColor:"currentColor",borderTopLeftRadius:"0px",borderTopRightRadius:"0px",borderTopWidth:"3px",bottom:"auto",clip:"rect(0px, 0px, 0px, 0px)",color:"black",fontSize:"100%",fontWeight:"400",height:"auto",left:"auto",letterSpacing:"normal",lineHeight:"120%",marginBottom:"0px",marginLeft:"0px",marginRight:"0px",marginTop:"0px",maxHeight:"none",maxWidth:"none",minHeight:"0px",minWidth:"0px",opacity:"1.0",outlineColor:"invert",outlineOffset:"0px",outlineWidth:"3px",paddingBottom:"0px",paddingLeft:"0px",paddingRight:"0px",paddingTop:"0px",right:"auto",strokeDasharray:"none",strokeDashoffset:"0px",textIndent:"0px",textShadow:"0px 0px 0px transparent",top:"auto",transform:"",verticalAlign:"0px",visibility:"visible",width:"auto",wordSpacing:"normal",zIndex:"auto"};b.propertyInterpolation=g}(c,d),function(a,b,c){function d(b){var c=a.calculateActiveDuration(b),d=function(d){return a.calculateIterationProgress(c,d,b)};return d._totalDuration=b.delay+c+b.endDelay,d}b.KeyframeEffect=function(c,e,f,g){var h,i=d(a.normalizeTimingInput(f)),j=b.convertEffectInput(e),k=function(){j(c,h)};return k._update=function(a){return null!==(h=i(a))},k._clear=function(){j(c,null)},k._hasSameTarget=function(a){return c===a},k._target=c,k._totalDuration=i._totalDuration,k._id=g,k}}(c,d),function(a,b){function c(a,b){return!(!b.namespaceURI||-1==b.namespaceURI.indexOf("/svg"))&&(g in a||(a[g]=/Trident|MSIE|IEMobile|Edge|Android 4/i.test(a.navigator.userAgent)),a[g])}function d(a,b,c){c.enumerable=!0,c.configurable=!0,Object.defineProperty(a,b,c)}function e(a){this._element=a,this._surrogateStyle=document.createElementNS("http://www.w3.org/1999/xhtml","div").style,this._style=a.style,this._length=0,this._isAnimatedProperty={},this._updateSvgTransformAttr=c(window,a),this._savedTransformAttr=null;for(var b=0;b<this._style.length;b++){var d=this._style[b];this._surrogateStyle[d]=this._style[d]}this._updateIndices()}function f(a){if(!a._webAnimationsPatchedStyle){var b=new e(a);try{d(a,"style",{get:function(){return b}})}catch(b){a.style._set=function(b,c){a.style[b]=c},a.style._clear=function(b){a.style[b]=""}}a._webAnimationsPatchedStyle=a.style}}var g="_webAnimationsUpdateSvgTransformAttr",h={cssText:1,length:1,parentRule:1},i={getPropertyCSSValue:1,getPropertyPriority:1,getPropertyValue:1,item:1,removeProperty:1,setProperty:1},j={removeProperty:1,setProperty:1};e.prototype={get cssText(){return this._surrogateStyle.cssText},set cssText(a){for(var b={},c=0;c<this._surrogateStyle.length;c++)b[this._surrogateStyle[c]]=!0;this._surrogateStyle.cssText=a,this._updateIndices();for(var c=0;c<this._surrogateStyle.length;c++)b[this._surrogateStyle[c]]=!0;for(var d in b)this._isAnimatedProperty[d]||this._style.setProperty(d,this._surrogateStyle.getPropertyValue(d))},get length(){return this._surrogateStyle.length},get parentRule(){return this._style.parentRule},_updateIndices:function(){for(;this._length<this._surrogateStyle.length;)Object.defineProperty(this,this._length,{configurable:!0,enumerable:!1,get:function(a){return function(){return this._surrogateStyle[a]}}(this._length)}),this._length++;for(;this._length>this._surrogateStyle.length;)this._length--,Object.defineProperty(this,this._length,{configurable:!0,enumerable:!1,value:void 0})},_set:function(b,c){this._style[b]=c,this._isAnimatedProperty[b]=!0,this._updateSvgTransformAttr&&"transform"==a.unprefixedPropertyName(b)&&(null==this._savedTransformAttr&&(this._savedTransformAttr=this._element.getAttribute("transform")),this._element.setAttribute("transform",a.transformToSvgMatrix(c)))},_clear:function(b){this._style[b]=this._surrogateStyle[b],this._updateSvgTransformAttr&&"transform"==a.unprefixedPropertyName(b)&&(this._savedTransformAttr?this._element.setAttribute("transform",this._savedTransformAttr):this._element.removeAttribute("transform"),this._savedTransformAttr=null),delete this._isAnimatedProperty[b]}};for(var k in i)e.prototype[k]=function(a,b){return function(){var c=this._surrogateStyle[a].apply(this._surrogateStyle,arguments);return b&&(this._isAnimatedProperty[arguments[0]]||this._style[a].apply(this._style,arguments),this._updateIndices()),c}}(k,k in j);for(var l in document.documentElement.style)l in h||l in i||function(a){d(e.prototype,a,{get:function(){return this._surrogateStyle[a]},set:function(b){this._surrogateStyle[a]=b,this._updateIndices(),this._isAnimatedProperty[a]||(this._style[a]=b)}})}(l);a.apply=function(b,c,d){f(b),b.style._set(a.propertyName(c),d)},a.clear=function(b,c){b._webAnimationsPatchedStyle&&b.style._clear(a.propertyName(c))}}(d),function(a){window.Element.prototype.animate=function(b,c){var d="";return c&&c.id&&(d=c.id),a.timeline._play(a.KeyframeEffect(this,b,c,d))}}(d),function(a,b){function c(a,b,d){if("number"==typeof a&&"number"==typeof b)return a*(1-d)+b*d;if("boolean"==typeof a&&"boolean"==typeof b)return d<.5?a:b;if(a.length==b.length){for(var e=[],f=0;f<a.length;f++)e.push(c(a[f],b[f],d));return e}throw"Mismatched interpolation arguments "+a+":"+b}a.Interpolation=function(a,b,d){return function(e){return d(c(a,b,e))}}}(d),function(a,b){function c(a,b,c){return Math.max(Math.min(a,c),b)}function d(b,d,e){var f=a.dot(b,d);f=c(f,-1,1);var g=[];if(1===f)g=b;else for(var h=Math.acos(f),i=1*Math.sin(e*h)/Math.sqrt(1-f*f),j=0;j<4;j++)g.push(b[j]*(Math.cos(e*h)-f*i)+d[j]*i);return g}var e=function(){function a(a,b){for(var c=[[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0]],d=0;d<4;d++)for(var e=0;e<4;e++)for(var f=0;f<4;f++)c[d][e]+=b[d][f]*a[f][e];return c}function b(a){return 0==a[0][2]&&0==a[0][3]&&0==a[1][2]&&0==a[1][3]&&0==a[2][0]&&0==a[2][1]&&1==a[2][2]&&0==a[2][3]&&0==a[3][2]&&1==a[3][3]}function c(c,d,e,f,g){for(var h=[[1,0,0,0],[0,1,0,0],[0,0,1,0],[0,0,0,1]],i=0;i<4;i++)h[i][3]=g[i];for(var i=0;i<3;i++)for(var j=0;j<3;j++)h[3][i]+=c[j]*h[j][i];var k=f[0],l=f[1],m=f[2],n=f[3],o=[[1,0,0,0],[0,1,0,0],[0,0,1,0],[0,0,0,1]];o[0][0]=1-2*(l*l+m*m),o[0][1]=2*(k*l-m*n),o[0][2]=2*(k*m+l*n),o[1][0]=2*(k*l+m*n),o[1][1]=1-2*(k*k+m*m),o[1][2]=2*(l*m-k*n),o[2][0]=2*(k*m-l*n),o[2][1]=2*(l*m+k*n),o[2][2]=1-2*(k*k+l*l),h=a(h,o);var p=[[1,0,0,0],[0,1,0,0],[0,0,1,0],[0,0,0,1]];e[2]&&(p[2][1]=e[2],h=a(h,p)),e[1]&&(p[2][1]=0,p[2][0]=e[0],h=a(h,p)),e[0]&&(p[2][0]=0,p[1][0]=e[0],h=a(h,p));for(var i=0;i<3;i++)for(var j=0;j<3;j++)h[i][j]*=d[i];return b(h)?[h[0][0],h[0][1],h[1][0],h[1][1],h[3][0],h[3][1]]:h[0].concat(h[1],h[2],h[3])}return c}();a.composeMatrix=e,a.quat=d}(d),function(a,b,c){a.sequenceNumber=0;var d=function(a,b,c){this.target=a,this.currentTime=b,this.timelineTime=c,this.type="finish",this.bubbles=!1,this.cancelable=!1,this.currentTarget=a,this.defaultPrevented=!1,this.eventPhase=Event.AT_TARGET,this.timeStamp=Date.now()};b.Animation=function(b){this.id="",b&&b._id&&(this.id=b._id),this._sequenceNumber=a.sequenceNumber++,this._currentTime=0,this._startTime=null,this._paused=!1,this._playbackRate=1,this._inTimeline=!0,this._finishedFlag=!0,this.onfinish=null,this._finishHandlers=[],this._effect=b,this._inEffect=this._effect._update(0),this._idle=!0,this._currentTimePending=!1},b.Animation.prototype={_ensureAlive:function(){this.playbackRate<0&&0===this.currentTime?this._inEffect=this._effect._update(-1):this._inEffect=this._effect._update(this.currentTime),this._inTimeline||!this._inEffect&&this._finishedFlag||(this._inTimeline=!0,b.timeline._animations.push(this))},_tickCurrentTime:function(a,b){a!=this._currentTime&&(this._currentTime=a,this._isFinished&&!b&&(this._currentTime=this._playbackRate>0?this._totalDuration:0),this._ensureAlive())},get currentTime(){return this._idle||this._currentTimePending?null:this._currentTime},set currentTime(a){a=+a,isNaN(a)||(b.restart(),this._paused||null==this._startTime||(this._startTime=this._timeline.currentTime-a/this._playbackRate),this._currentTimePending=!1,this._currentTime!=a&&(this._idle&&(this._idle=!1,this._paused=!0),this._tickCurrentTime(a,!0),b.applyDirtiedAnimation(this)))},get startTime(){return this._startTime},set startTime(a){a=+a,isNaN(a)||this._paused||this._idle||(this._startTime=a,this._tickCurrentTime((this._timeline.currentTime-this._startTime)*this.playbackRate),b.applyDirtiedAnimation(this))},get playbackRate(){return this._playbackRate},set playbackRate(a){if(a!=this._playbackRate){var c=this.currentTime;this._playbackRate=a,this._startTime=null,"paused"!=this.playState&&"idle"!=this.playState&&(this._finishedFlag=!1,this._idle=!1,this._ensureAlive(),b.applyDirtiedAnimation(this)),null!=c&&(this.currentTime=c)}},get _isFinished(){return!this._idle&&(this._playbackRate>0&&this._currentTime>=this._totalDuration||this._playbackRate<0&&this._currentTime<=0)},get _totalDuration(){return this._effect._totalDuration},get playState(){return this._idle?"idle":null==this._startTime&&!this._paused&&0!=this.playbackRate||this._currentTimePending?"pending":this._paused?"paused":this._isFinished?"finished":"running"},_rewind:function(){if(this._playbackRate>=0)this._currentTime=0;else{if(!(this._totalDuration<1/0))throw new DOMException("Unable to rewind negative playback rate animation with infinite duration","InvalidStateError");this._currentTime=this._totalDuration}},play:function(){this._paused=!1,(this._isFinished||this._idle)&&(this._rewind(),this._startTime=null),this._finishedFlag=!1,this._idle=!1,this._ensureAlive(),b.applyDirtiedAnimation(this)},pause:function(){this._isFinished||this._paused||this._idle?this._idle&&(this._rewind(),this._idle=!1):this._currentTimePending=!0,this._startTime=null,this._paused=!0},finish:function(){this._idle||(this.currentTime=this._playbackRate>0?this._totalDuration:0,this._startTime=this._totalDuration-this.currentTime,this._currentTimePending=!1,b.applyDirtiedAnimation(this))},cancel:function(){this._inEffect&&(this._inEffect=!1,this._idle=!0,this._paused=!1,this._isFinished=!0,this._finishedFlag=!0,this._currentTime=0,this._startTime=null,this._effect._update(null),b.applyDirtiedAnimation(this))},reverse:function(){this.playbackRate*=-1,this.play()},addEventListener:function(a,b){"function"==typeof b&&"finish"==a&&this._finishHandlers.push(b)},removeEventListener:function(a,b){if("finish"==a){var c=this._finishHandlers.indexOf(b);c>=0&&this._finishHandlers.splice(c,1)}},_fireEvents:function(a){if(this._isFinished){if(!this._finishedFlag){var b=new d(this,this._currentTime,a),c=this._finishHandlers.concat(this.onfinish?[this.onfinish]:[]);setTimeout(function(){c.forEach(function(a){a.call(b.target,b)})},0),this._finishedFlag=!0}}else this._finishedFlag=!1},_tick:function(a,b){this._idle||this._paused||(null==this._startTime?b&&(this.startTime=a-this._currentTime/this.playbackRate):this._isFinished||this._tickCurrentTime((a-this._startTime)*this.playbackRate)),b&&(this._currentTimePending=!1,this._fireEvents(a))},get _needsTick(){return this.playState in{pending:1,running:1}||!this._finishedFlag},_targetAnimations:function(){var a=this._effect._target;return a._activeAnimations||(a._activeAnimations=[]),a._activeAnimations},_markTarget:function(){var a=this._targetAnimations();-1===a.indexOf(this)&&a.push(this)},_unmarkTarget:function(){var a=this._targetAnimations(),b=a.indexOf(this);-1!==b&&a.splice(b,1)}}}(c,d),function(a,b,c){function d(a){var b=j;j=[],a<q.currentTime&&(a=q.currentTime),q._animations.sort(e),q._animations=h(a,!0,q._animations)[0],b.forEach(function(b){b[1](a)}),g(),l=void 0}function e(a,b){return a._sequenceNumber-b._sequenceNumber}function f(){this._animations=[],this.currentTime=window.performance&&performance.now?performance.now():0}function g(){o.forEach(function(a){a()}),o.length=0}function h(a,c,d){p=!0,n=!1,b.timeline.currentTime=a,m=!1;var e=[],f=[],g=[],h=[];return d.forEach(function(b){b._tick(a,c),b._inEffect?(f.push(b._effect),b._markTarget()):(e.push(b._effect),b._unmarkTarget()),b._needsTick&&(m=!0);var d=b._inEffect||b._needsTick;b._inTimeline=d,d?g.push(b):h.push(b)}),o.push.apply(o,e),o.push.apply(o,f),m&&requestAnimationFrame(function(){}),p=!1,[g,h]}var i=window.requestAnimationFrame,j=[],k=0;window.requestAnimationFrame=function(a){var b=k++;return 0==j.length&&i(d),j.push([b,a]),b},window.cancelAnimationFrame=function(a){j.forEach(function(b){b[0]==a&&(b[1]=function(){})})},f.prototype={_play:function(c){c._timing=a.normalizeTimingInput(c.timing);var d=new b.Animation(c);return d._idle=!1,d._timeline=this,this._animations.push(d),b.restart(),b.applyDirtiedAnimation(d),d}};var l=void 0,m=!1,n=!1;b.restart=function(){return m||(m=!0,requestAnimationFrame(function(){}),n=!0),n},b.applyDirtiedAnimation=function(a){if(!p){a._markTarget();var c=a._targetAnimations();c.sort(e),h(b.timeline.currentTime,!1,c.slice())[1].forEach(function(a){var b=q._animations.indexOf(a);-1!==b&&q._animations.splice(b,1)}),g()}};var o=[],p=!1,q=new f;b.timeline=q}(c,d),function(a,b){function c(a,b){for(var c=0,d=0;d<a.length;d++)c+=a[d]*b[d];return c}function d(a,b){return[a[0]*b[0]+a[4]*b[1]+a[8]*b[2]+a[12]*b[3],a[1]*b[0]+a[5]*b[1]+a[9]*b[2]+a[13]*b[3],a[2]*b[0]+a[6]*b[1]+a[10]*b[2]+a[14]*b[3],a[3]*b[0]+a[7]*b[1]+a[11]*b[2]+a[15]*b[3],a[0]*b[4]+a[4]*b[5]+a[8]*b[6]+a[12]*b[7],a[1]*b[4]+a[5]*b[5]+a[9]*b[6]+a[13]*b[7],a[2]*b[4]+a[6]*b[5]+a[10]*b[6]+a[14]*b[7],a[3]*b[4]+a[7]*b[5]+a[11]*b[6]+a[15]*b[7],a[0]*b[8]+a[4]*b[9]+a[8]*b[10]+a[12]*b[11],a[1]*b[8]+a[5]*b[9]+a[9]*b[10]+a[13]*b[11],a[2]*b[8]+a[6]*b[9]+a[10]*b[10]+a[14]*b[11],a[3]*b[8]+a[7]*b[9]+a[11]*b[10]+a[15]*b[11],a[0]*b[12]+a[4]*b[13]+a[8]*b[14]+a[12]*b[15],a[1]*b[12]+a[5]*b[13]+a[9]*b[14]+a[13]*b[15],a[2]*b[12]+a[6]*b[13]+a[10]*b[14]+a[14]*b[15],a[3]*b[12]+a[7]*b[13]+a[11]*b[14]+a[15]*b[15]]}function e(a){var b=a.rad||0;return((a.deg||0)/360+(a.grad||0)/400+(a.turn||0))*(2*Math.PI)+b}function f(a){switch(a.t){case"rotatex":var b=e(a.d[0]);return[1,0,0,0,0,Math.cos(b),Math.sin(b),0,0,-Math.sin(b),Math.cos(b),0,0,0,0,1];case"rotatey":var b=e(a.d[0]);return[Math.cos(b),0,-Math.sin(b),0,0,1,0,0,Math.sin(b),0,Math.cos(b),0,0,0,0,1];case"rotate":case"rotatez":var b=e(a.d[0]);return[Math.cos(b),Math.sin(b),0,0,-Math.sin(b),Math.cos(b),0,0,0,0,1,0,0,0,0,1];case"rotate3d":var c=a.d[0],d=a.d[1],f=a.d[2],b=e(a.d[3]),g=c*c+d*d+f*f;if(0===g)c=1,d=0,f=0;else if(1!==g){var h=Math.sqrt(g);c/=h,d/=h,f/=h}var i=Math.sin(b/2),j=i*Math.cos(b/2),k=i*i;return[1-2*(d*d+f*f)*k,2*(c*d*k+f*j),2*(c*f*k-d*j),0,2*(c*d*k-f*j),1-2*(c*c+f*f)*k,2*(d*f*k+c*j),0,2*(c*f*k+d*j),2*(d*f*k-c*j),1-2*(c*c+d*d)*k,0,0,0,0,1];case"scale":return[a.d[0],0,0,0,0,a.d[1],0,0,0,0,1,0,0,0,0,1];case"scalex":return[a.d[0],0,0,0,0,1,0,0,0,0,1,0,0,0,0,1];case"scaley":return[1,0,0,0,0,a.d[0],0,0,0,0,1,0,0,0,0,1];case"scalez":return[1,0,0,0,0,1,0,0,0,0,a.d[0],0,0,0,0,1];case"scale3d":return[a.d[0],0,0,0,0,a.d[1],0,0,0,0,a.d[2],0,0,0,0,1];case"skew":var l=e(a.d[0]),m=e(a.d[1]);return[1,Math.tan(m),0,0,Math.tan(l),1,0,0,0,0,1,0,0,0,0,1];case"skewx":var b=e(a.d[0]);return[1,0,0,0,Math.tan(b),1,0,0,0,0,1,0,0,0,0,1];case"skewy":var b=e(a.d[0]);return[1,Math.tan(b),0,0,0,1,0,0,0,0,1,0,0,0,0,1];case"translate":var c=a.d[0].px||0,d=a.d[1].px||0;return[1,0,0,0,0,1,0,0,0,0,1,0,c,d,0,1];case"translatex":var c=a.d[0].px||0;return[1,0,0,0,0,1,0,0,0,0,1,0,c,0,0,1];case"translatey":var d=a.d[0].px||0;return[1,0,0,0,0,1,0,0,0,0,1,0,0,d,0,1];case"translatez":var f=a.d[0].px||0;return[1,0,0,0,0,1,0,0,0,0,1,0,0,0,f,1];case"translate3d":var c=a.d[0].px||0,d=a.d[1].px||0,f=a.d[2].px||0;return[1,0,0,0,0,1,0,0,0,0,1,0,c,d,f,1];case"perspective":return[1,0,0,0,0,1,0,0,0,0,1,a.d[0].px?-1/a.d[0].px:0,0,0,0,1];case"matrix":return[a.d[0],a.d[1],0,0,a.d[2],a.d[3],0,0,0,0,1,0,a.d[4],a.d[5],0,1];case"matrix3d":return a.d}}function g(a){return 0===a.length?[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]:a.map(f).reduce(d)}function h(a){return[i(g(a))]}var i=function(){function a(a){return a[0][0]*a[1][1]*a[2][2]+a[1][0]*a[2][1]*a[0][2]+a[2][0]*a[0][1]*a[1][2]-a[0][2]*a[1][1]*a[2][0]-a[1][2]*a[2][1]*a[0][0]-a[2][2]*a[0][1]*a[1][0]}function b(b){for(var c=1/a(b),d=b[0][0],e=b[0][1],f=b[0][2],g=b[1][0],h=b[1][1],i=b[1][2],j=b[2][0],k=b[2][1],l=b[2][2],m=[[(h*l-i*k)*c,(f*k-e*l)*c,(e*i-f*h)*c,0],[(i*j-g*l)*c,(d*l-f*j)*c,(f*g-d*i)*c,0],[(g*k-h*j)*c,(j*e-d*k)*c,(d*h-e*g)*c,0]],n=[],o=0;o<3;o++){for(var p=0,q=0;q<3;q++)p+=b[3][q]*m[q][o];n.push(p)}return n.push(1),m.push(n),m}function d(a){return[[a[0][0],a[1][0],a[2][0],a[3][0]],[a[0][1],a[1][1],a[2][1],a[3][1]],[a[0][2],a[1][2],a[2][2],a[3][2]],[a[0][3],a[1][3],a[2][3],a[3][3]]]}function e(a,b){for(var c=[],d=0;d<4;d++){for(var e=0,f=0;f<4;f++)e+=a[f]*b[f][d];c.push(e)}return c}function f(a){var b=g(a);return[a[0]/b,a[1]/b,a[2]/b]}function g(a){return Math.sqrt(a[0]*a[0]+a[1]*a[1]+a[2]*a[2])}function h(a,b,c,d){return[c*a[0]+d*b[0],c*a[1]+d*b[1],c*a[2]+d*b[2]]}function i(a,b){return[a[1]*b[2]-a[2]*b[1],a[2]*b[0]-a[0]*b[2],a[0]*b[1]-a[1]*b[0]]}function j(j){var k=[j.slice(0,4),j.slice(4,8),j.slice(8,12),j.slice(12,16)];if(1!==k[3][3])return null;for(var l=[],m=0;m<4;m++)l.push(k[m].slice());for(var m=0;m<3;m++)l[m][3]=0;if(0===a(l))return null;var n,o=[];k[0][3]||k[1][3]||k[2][3]?(o.push(k[0][3]),o.push(k[1][3]),o.push(k[2][3]),o.push(k[3][3]),n=e(o,d(b(l)))):n=[0,0,0,1];var p=k[3].slice(0,3),q=[];q.push(k[0].slice(0,3));var r=[];r.push(g(q[0])),q[0]=f(q[0]);var s=[];q.push(k[1].slice(0,3)),s.push(c(q[0],q[1])),q[1]=h(q[1],q[0],1,-s[0]),r.push(g(q[1])),q[1]=f(q[1]),s[0]/=r[1],q.push(k[2].slice(0,3)),s.push(c(q[0],q[2])),q[2]=h(q[2],q[0],1,-s[1]),s.push(c(q[1],q[2])),q[2]=h(q[2],q[1],1,-s[2]),r.push(g(q[2])),q[2]=f(q[2]),s[1]/=r[2],s[2]/=r[2];var t=i(q[1],q[2]);if(c(q[0],t)<0)for(var m=0;m<3;m++)r[m]*=-1,q[m][0]*=-1,q[m][1]*=-1,q[m][2]*=-1;var u,v,w=q[0][0]+q[1][1]+q[2][2]+1;return w>1e-4?(u=.5/Math.sqrt(w),v=[(q[2][1]-q[1][2])*u,(q[0][2]-q[2][0])*u,(q[1][0]-q[0][1])*u,.25/u]):q[0][0]>q[1][1]&&q[0][0]>q[2][2]?(u=2*Math.sqrt(1+q[0][0]-q[1][1]-q[2][2]),v=[.25*u,(q[0][1]+q[1][0])/u,(q[0][2]+q[2][0])/u,(q[2][1]-q[1][2])/u]):q[1][1]>q[2][2]?(u=2*Math.sqrt(1+q[1][1]-q[0][0]-q[2][2]),v=[(q[0][1]+q[1][0])/u,.25*u,(q[1][2]+q[2][1])/u,(q[0][2]-q[2][0])/u]):(u=2*Math.sqrt(1+q[2][2]-q[0][0]-q[1][1]),v=[(q[0][2]+q[2][0])/u,(q[1][2]+q[2][1])/u,.25*u,(q[1][0]-q[0][1])/u]),[p,r,s,v,n]}return j}();a.dot=c,a.makeMatrixDecomposition=h,a.transformListToMatrix=g}(d),function(a){function b(a,b){var c=a.exec(b);if(c)return c=a.ignoreCase?c[0].toLowerCase():c[0],[c,b.substr(c.length)]}function c(a,b){b=b.replace(/^\s*/,"");var c=a(b);if(c)return[c[0],c[1].replace(/^\s*/,"")]}function d(a,d,e){a=c.bind(null,a);for(var f=[];;){var g=a(e);if(!g)return[f,e];if(f.push(g[0]),e=g[1],!(g=b(d,e))||""==g[1])return[f,e];e=g[1]}}function e(a,b){for(var c=0,d=0;d<b.length&&(!/\s|,/.test(b[d])||0!=c);d++)if("("==b[d])c++;else if(")"==b[d]&&(c--,0==c&&d++,c<=0))break;var e=a(b.substr(0,d));return void 0==e?void 0:[e,b.substr(d)]}function f(a,b){for(var c=a,d=b;c&&d;)c>d?c%=d:d%=c;return c=a*b/(c+d)}function g(a){return function(b){var c=a(b);return c&&(c[0]=void 0),c}}function h(a,b){return function(c){return a(c)||[b,c]}}function i(b,c){for(var d=[],e=0;e<b.length;e++){var f=a.consumeTrimmed(b[e],c);if(!f||""==f[0])return;void 0!==f[0]&&d.push(f[0]),c=f[1]}if(""==c)return d}function j(a,b,c,d,e){for(var g=[],h=[],i=[],j=f(d.length,e.length),k=0;k<j;k++){var l=b(d[k%d.length],e[k%e.length]);if(!l)return;g.push(l[0]),h.push(l[1]),i.push(l[2])}return[g,h,function(b){var d=b.map(function(a,b){return i[b](a)}).join(c);return a?a(d):d}]}function k(a,b,c){for(var d=[],e=[],f=[],g=0,h=0;h<c.length;h++)if("function"==typeof c[h]){var i=c[h](a[g],b[g++]);d.push(i[0]),e.push(i[1]),f.push(i[2])}else!function(a){d.push(!1),e.push(!1),f.push(function(){return c[a]})}(h);return[d,e,function(a){for(var b="",c=0;c<a.length;c++)b+=f[c](a[c]);return b}]}a.consumeToken=b,a.consumeTrimmed=c,a.consumeRepeated=d,a.consumeParenthesised=e,a.ignore=g,a.optional=h,a.consumeList=i,a.mergeNestedRepeated=j.bind(null,null),a.mergeWrappedNestedRepeated=j,a.mergeList=k}(d),function(a){function b(b){function c(b){var c=a.consumeToken(/^inset/i,b);
vendor: 7,209 bytes, line 146
146if(c)return d.inset=!0,c;var c=a.consumeLengthOrPercent(b);if(c)return d.lengths.push(c[0]),c;var c=a.consumeColor(b);return c?(d.color=c[0],c):void 0}var d={inset:!1,lengths:[],color:null},e=a.consumeRepeated(c,/^/,b);if(e&&e[0].length)return[d,e[1]]}function c(c){var d=a.consumeRepeated(b,/^,/,c);if(d&&""==d[1])return d[0]}function d(b,c){for(;b.lengths.length<Math.max(b.lengths.length,c.lengths.length);)b.lengths.push({px:0});for(;c.lengths.length<Math.max(b.lengths.length,c.lengths.length);)c.lengths.push({px:0});if(b.inset==c.inset&&!!b.color==!!c.color){for(var d,e=[],f=[[],0],g=[[],0],h=0;h<b.lengths.length;h++){var i=a.mergeDimensions(b.lengths[h],c.lengths[h],2==h);f[0].push(i[0]),g[0].push(i[1]),e.push(i[2])}if(b.color&&c.color){var j=a.mergeColors(b.color,c.color);f[1]=j[0],g[1]=j[1],d=j[2]}return[f,g,function(a){for(var c=b.inset?"inset ":" ",f=0;f<e.length;f++)c+=e[f](a[0][f])+" ";return d&&(c+=d(a[1])),c}]}}function e(b,c,d,e){function f(a){return{inset:a,color:[0,0,0,0],lengths:[{px:0},{px:0},{px:0},{px:0}]}}for(var g=[],h=[],i=0;i<d.length||i<e.length;i++){var j=d[i]||f(e[i].inset),k=e[i]||f(d[i].inset);g.push(j),h.push(k)}return a.mergeNestedRepeated(b,c,g,h)}var f=e.bind(null,d,", ");a.addPropertiesHandler(c,f,["box-shadow","text-shadow"])}(d),function(a,b){function c(a){return a.toFixed(3).replace(/0+$/,"").replace(/\.$/,"")}function d(a,b,c){return Math.min(b,Math.max(a,c))}function e(a){if(/^\s*[-+]?(\d*\.)?\d+\s*$/.test(a))return Number(a)}function f(a,b){return[a,b,c]}function g(a,b){if(0!=a)return i(0,1/0)(a,b)}function h(a,b){return[a,b,function(a){return Math.round(d(1,1/0,a))}]}function i(a,b){return function(e,f){return[e,f,function(e){return c(d(a,b,e))}]}}function j(a){var b=a.trim().split(/\s*[\s,]\s*/);if(0!==b.length){for(var c=[],d=0;d<b.length;d++){var f=e(b[d]);if(void 0===f)return;c.push(f)}return c}}function k(a,b){if(a.length==b.length)return[a,b,function(a){return a.map(c).join(" ")}]}function l(a,b){return[a,b,Math.round]}a.clamp=d,a.addPropertiesHandler(j,k,["stroke-dasharray"]),a.addPropertiesHandler(e,i(0,1/0),["border-image-width","line-height"]),a.addPropertiesHandler(e,i(0,1),["opacity","shape-image-threshold"]),a.addPropertiesHandler(e,g,["flex-grow","flex-shrink"]),a.addPropertiesHandler(e,h,["orphans","widows"]),a.addPropertiesHandler(e,l,["z-index"]),a.parseNumber=e,a.parseNumberList=j,a.mergeNumbers=f,a.numberToString=c}(d),function(a,b){function c(a,b){if("visible"==a||"visible"==b)return[0,1,function(c){return c<=0?a:c>=1?b:"visible"}]}a.addPropertiesHandler(String,c,["visibility"])}(d),function(a,b){function c(a){a=a.trim(),f.fillStyle="#000",f.fillStyle=a;var b=f.fillStyle;if(f.fillStyle="#fff",f.fillStyle=a,b==f.fillStyle){f.fillRect(0,0,1,1);var c=f.getImageData(0,0,1,1).data;f.clearRect(0,0,1,1);var d=c[3]/255;return[c[0]*d,c[1]*d,c[2]*d,d]}}function d(b,c){return[b,c,function(b){function c(a){return Math.max(0,Math.min(255,a))}if(b[3])for(var d=0;d<3;d++)b[d]=Math.round(c(b[d]/b[3]));return b[3]=a.numberToString(a.clamp(0,1,b[3])),"rgba("+b.join(",")+")"}]}var e=document.createElementNS("http://www.w3.org/1999/xhtml","canvas");e.width=e.height=1;var f=e.getContext("2d");a.addPropertiesHandler(c,d,["background-color","border-bottom-color","border-left-color","border-right-color","border-top-color","color","fill","flood-color","lighting-color","outline-color","stop-color","stroke","text-decoration-color"]),a.consumeColor=a.consumeParenthesised.bind(null,c),a.mergeColors=d}(d),function(a,b){function c(a){function b(){var b=h.exec(a);g=b?b[0]:void 0}function c(){var a=Number(g);return b(),a}function d(){if("("!==g)return c();b();var a=f();return")"!==g?NaN:(b(),a)}function e(){for(var a=d();"*"===g||"/"===g;){var c=g;b();var e=d();"*"===c?a*=e:a/=e}return a}function f(){for(var a=e();"+"===g||"-"===g;){var c=g;b();var d=e();"+"===c?a+=d:a-=d}return a}var g,h=/([\+\-\w\.]+|[\(\)\*\/])/g;return b(),f()}function d(a,b){if("0"==(b=b.trim().toLowerCase())&&"px".search(a)>=0)return{px:0};if(/^[^(]*$|^calc/.test(b)){b=b.replace(/calc\(/g,"(");var d={};b=b.replace(a,function(a){return d[a]=null,"U"+a});for(var e="U("+a.source+")",f=b.replace(/[-+]?(\d*\.)?\d+([Ee][-+]?\d+)?/g,"N").replace(new RegExp("N"+e,"g"),"D").replace(/\s[+-]\s/g,"O").replace(/\s/g,""),g=[/N\*(D)/g,/(N|D)[*\/]N/g,/(N|D)O\1/g,/\((N|D)\)/g],h=0;h<g.length;)g[h].test(f)?(f=f.replace(g[h],"$1"),h=0):h++;if("D"==f){for(var i in d){var j=c(b.replace(new RegExp("U"+i,"g"),"").replace(new RegExp(e,"g"),"*0"));if(!isFinite(j))return;d[i]=j}return d}}}function e(a,b){return f(a,b,!0)}function f(b,c,d){var e,f=[];for(e in b)f.push(e);for(e in c)f.indexOf(e)<0&&f.push(e);return b=f.map(function(a){return b[a]||0}),c=f.map(function(a){return c[a]||0}),[b,c,function(b){var c=b.map(function(c,e){return 1==b.length&&d&&(c=Math.max(c,0)),a.numberToString(c)+f[e]}).join(" + ");return b.length>1?"calc("+c+")":c}]}var g="px|em|ex|ch|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc",h=d.bind(null,new RegExp(g,"g")),i=d.bind(null,new RegExp(g+"|%","g")),j=d.bind(null,/deg|rad|grad|turn/g);a.parseLength=h,a.parseLengthOrPercent=i,a.consumeLengthOrPercent=a.consumeParenthesised.bind(null,i),a.parseAngle=j,a.mergeDimensions=f;var k=a.consumeParenthesised.bind(null,h),l=a.consumeRepeated.bind(void 0,k,/^/),m=a.consumeRepeated.bind(void 0,l,/^,/);a.consumeSizePairList=m;var n=function(a){var b=m(a);if(b&&""==b[1])return b[0]},o=a.mergeNestedRepeated.bind(void 0,e," "),p=a.mergeNestedRepeated.bind(void 0,o,",");a.mergeNonNegativeSizePair=o,a.addPropertiesHandler(n,p,["background-size"]),a.addPropertiesHandler(i,e,["border-bottom-width","border-image-width","border-left-width","border-right-width","border-top-width","flex-basis","font-size","height","line-height","max-height","max-width","outline-width","width"]),a.addPropertiesHandler(i,f,["border-bottom-left-radius","border-bottom-right-radius","border-top-left-radius","border-top-right-radius","bottom","left","letter-spacing","margin-bottom","margin-left","margin-right","margin-top","min-height","min-width","outline-offset","padding-bottom","padding-left","padding-right","padding-top","perspective","right","shape-margin","stroke-dashoffset","text-indent","top","vertical-align","word-spacing"])}(d),function(a,b){function c(b){return a.consumeLengthOrPercent(b)||a.consumeToken(/^auto/,b)}function d(b){var d=a.consumeList([a.ignore(a.consumeToken.bind(null,/^rect/)),a.ignore(a.consumeToken.bind(null,/^\(/)),a.consumeRepeated.bind(null,c,/^,/),a.ignore(a.consumeToken.bind(null,/^\)/))],b);if(d&&4==d[0].length)return d[0]}function e(b,c){return"auto"==b||"auto"==c?[!0,!1,function(d){var e=d?b:c;if("auto"==e)return"auto";var f=a.mergeDimensions(e,e);return f[2](f[0])}]:a.mergeDimensions(b,c)}function f(a){return"rect("+a+")"}var g=a.mergeWrappedNestedRepeated.bind(null,f,e,", ");a.parseBox=d,a.mergeBoxes=g,a.addPropertiesHandler(d,g,["clip"])}(d),function(a,b){function c(a){return function(b){var c=0;return a.map(function(a){return a===k?b[c++]:a})}}function d(a){return a}function e(b){if("none"==(b=b.toLowerCase().trim()))return[];for(var c,d=/\s*(\w+)\(([^)]*)\)/g,e=[],f=0;c=d.exec(b);){if(c.index!=f)return;f=c.index+c[0].length;var g=c[1],h=n[g];
vendor: 4,235 bytes, line 146
146if(!h)return;var i=c[2].split(","),j=h[0];if(j.length<i.length)return;for(var k=[],o=0;o<j.length;o++){var p,q=i[o],r=j[o];if(void 0===(p=q?{A:function(b){return"0"==b.trim()?m:a.parseAngle(b)},N:a.parseNumber,T:a.parseLengthOrPercent,L:a.parseLength}[r.toUpperCase()](q):{a:m,n:k[0],t:l}[r]))return;k.push(p)}if(e.push({t:g,d:k}),d.lastIndex==b.length)return e}}function f(a){return a.toFixed(6).replace(".000000","")}function g(b,c){if(b.decompositionPair!==c){b.decompositionPair=c;var d=a.makeMatrixDecomposition(b)}if(c.decompositionPair!==b){c.decompositionPair=b;var e=a.makeMatrixDecomposition(c)}return null==d[0]||null==e[0]?[[!1],[!0],function(a){return a?c[0].d:b[0].d}]:(d[0].push(0),e[0].push(1),[d,e,function(b){var c=a.quat(d[0][3],e[0][3],b[5]);return a.composeMatrix(b[0],b[1],b[2],c,b[4]).map(f).join(",")}])}function h(a){return a.replace(/[xy]/,"")}function i(a){return a.replace(/(x|y|z|3d)?$/,"3d")}function j(b,c){var d=a.makeMatrixDecomposition&&!0,e=!1;if(!b.length||!c.length){b.length||(e=!0,b=c,c=[]);for(var f=0;f<b.length;f++){var j=b[f].t,k=b[f].d,l="scale"==j.substr(0,5)?1:0;c.push({t:j,d:k.map(function(a){if("number"==typeof a)return l;var b={};for(var c in a)b[c]=l;return b})})}}var m=function(a,b){return"perspective"==a&&"perspective"==b||("matrix"==a||"matrix3d"==a)&&("matrix"==b||"matrix3d"==b)},o=[],p=[],q=[];if(b.length!=c.length){if(!d)return;var r=g(b,c);o=[r[0]],p=[r[1]],q=[["matrix",[r[2]]]]}else for(var f=0;f<b.length;f++){var j,s=b[f].t,t=c[f].t,u=b[f].d,v=c[f].d,w=n[s],x=n[t];if(m(s,t)){if(!d)return;var r=g([b[f]],[c[f]]);o.push(r[0]),p.push(r[1]),q.push(["matrix",[r[2]]])}else{if(s==t)j=s;else if(w[2]&&x[2]&&h(s)==h(t))j=h(s),u=w[2](u),v=x[2](v);else{if(!w[1]||!x[1]||i(s)!=i(t)){if(!d)return;var r=g(b,c);o=[r[0]],p=[r[1]],q=[["matrix",[r[2]]]];break}j=i(s),u=w[1](u),v=x[1](v)}for(var y=[],z=[],A=[],B=0;B<u.length;B++){var C="number"==typeof u[B]?a.mergeNumbers:a.mergeDimensions,r=C(u[B],v[B]);y[B]=r[0],z[B]=r[1],A.push(r[2])}o.push(y),p.push(z),q.push([j,A])}}if(e){var D=o;o=p,p=D}return[o,p,function(a){return a.map(function(a,b){var c=a.map(function(a,c){return q[b][1][c](a)}).join(",");return"matrix"==q[b][0]&&16==c.split(",").length&&(q[b][0]="matrix3d"),q[b][0]+"("+c+")"}).join(" ")}]}var k=null,l={px:0},m={deg:0},n={matrix:["NNNNNN",[k,k,0,0,k,k,0,0,0,0,1,0,k,k,0,1],d],matrix3d:["NNNNNNNNNNNNNNNN",d],rotate:["A"],rotatex:["A"],rotatey:["A"],rotatez:["A"],rotate3d:["NNNA"],perspective:["L"],scale:["Nn",c([k,k,1]),d],scalex:["N",c([k,1,1]),c([k,1])],scaley:["N",c([1,k,1]),c([1,k])],scalez:["N",c([1,1,k])],scale3d:["NNN",d],skew:["Aa",null,d],skewx:["A",null,c([k,m])],skewy:["A",null,c([m,k])],translate:["Tt",c([k,k,l]),d],translatex:["T",c([k,l,l]),c([k,l])],translatey:["T",c([l,k,l]),c([l,k])],translatez:["L",c([l,l,k])],translate3d:["TTL",d]};a.addPropertiesHandler(e,j,["transform"]),a.transformToSvgMatrix=function(b){var c=a.transformListToMatrix(e(b));return"matrix("+f(c[0])+" "+f(c[1])+" "+f(c[4])+" "+f(c[5])+" "+f(c[12])+" "+f(c[13])+")"}}(d),function(a){function b(a){var b=Number(a);if(!(isNaN(b)||b<100||b>900||b%100!=0))return b}function c(b){return b=100*Math.round(b/100),b=a.clamp(100,900,b),400===b?"normal":700===b?"bold":String(b)}function d(a,b){return[a,b,c]}a.addPropertiesHandler(b,d,["font-weight"])}(d),function(a){function b(a){var b={};for(var c in a)b[c]=-a[c];return b}function c(b){return a.consumeToken(/^(left|center|right|top|bottom)\b/i,b)||a.consumeLengthOrPercent(b)}function d(b,d){var e=a.consumeRepeated(c,/^/,d);if(e&&""==e[1]){var f=e[0];if(f[0]=f[0]||"center",f[1]=f[1]||"center",3==b&&(f[2]=f[2]||{px:0}),f.length==b){if(/top|bottom/.test(f[0])||/left|right/.test(f[1])){var h=f[0];f[0]=f[1],f[1]=h}if(/left|right|center|Object/.test(f[0])&&/top|bottom|center|Object/.test(f[1]))return f.map(function(a){return"object"==typeof a?a:g[a]})}}}function e(d){var e=a.consumeRepeated(c,/^/,d);if(e){for(var f=e[0],h=[{"%":50},{"%":50}],i=0,j=!1,k=0;k<f.length;k++){var l=f[k];"string"==typeof l?(j=/bottom|right/.test(l),i={left:0,right:0,center:i,top:1,bottom:1}[l],h[i]=g[l],"center"==l&&i++):(j&&(l=b(l),l["%"]=(l["%"]||0)+100),h[i]=l,i++,j=!1)}return[h,e[1]]}}function f(b){var c=a.consumeRepeated(e,/^,/,b);
146if(c&&""==c[1])return c[0]}var g={left:{"%":0},center:{"%":50},right:{"%":100},top:{"%":0},bottom:{"%":100}},h=a.mergeNestedRepeated.bind(null,a.mergeDimensions," ");a.addPropertiesHandler(d.bind(null,3),h,["transform-origin"]),a.addPropertiesHandler(d.bind(null,2),h,["perspective-origin"]),a.consumePosition=e,a.mergeOffsetList=h;var i=a.mergeNestedRepeated.bind(null,h,", ");a.addPropertiesHandler(f,i,["background-position","object-position"])}(d),function(a){function b(b){var c=a.consumeToken(/^circle/,b);if(c&&c[0])return["circle"].concat(a.consumeList([a.ignore(a.consumeToken.bind(void 0,/^\(/)),d,a.ignore(a.consumeToken.bind(void 0,/^at/)),a.consumePosition,a.ignore(a.consumeToken.bind(void 0,/^\)/))],c[1]));var f=a.consumeToken(/^ellipse/,b);if(f&&f[0])return["ellipse"].concat(a.consumeList([a.ignore(a.consumeToken.bind(void 0,/^\(/)),e,a.ignore(a.consumeToken.bind(void 0,/^at/)),a.consumePosition,a.ignore(a.consumeToken.bind(void 0,/^\)/))],f[1]));var g=a.consumeToken(/^polygon/,b);return g&&g[0]?["polygon"].concat(a.consumeList([a.ignore(a.consumeToken.bind(void 0,/^\(/)),a.optional(a.consumeToken.bind(void 0,/^nonzero\s*,|^evenodd\s*,/),"nonzero,"),a.consumeSizePairList,a.ignore(a.consumeToken.bind(void 0,/^\)/))],g[1])):void 0}function c(b,c){if(b[0]===c[0])return"circle"==b[0]?a.mergeList(b.slice(1),c.slice(1),["circle(",a.mergeDimensions," at ",a.mergeOffsetList,")"]):"ellipse"==b[0]?a.mergeList(b.slice(1),c.slice(1),["ellipse(",a.mergeNonNegativeSizePair," at ",a.mergeOffsetList,")"]):"polygon"==b[0]&&b[1]==c[1]?a.mergeList(b.slice(2),c.slice(2),["polygon(",b[1],g,")"]):void 0}var d=a.consumeParenthesised.bind(null,a.parseLengthOrPercent),e=a.consumeRepeated.bind(void 0,d,/^/),f=a.mergeNestedRepeated.bind(void 0,a.mergeDimensions," "),g=a.mergeNestedRepeated.bind(void 0,f,",");a.addPropertiesHandler(b,c,["shape-outside"])}(d),function(a,b){function c(a,b){b.concat([a]).forEach(function(b){b in document.documentElement.style&&(d[a]=b),e[b]=a})}var d={},e={};c("transform",["webkitTransform","msTransform"]),c("transformOrigin",["webkitTransformOrigin"]),c("perspective",["webkitPerspective"]),c("perspectiveOrigin",["webkitPerspectiveOrigin"]),a.propertyName=function(a){return d[a]||a},a.unprefixedPropertyName=function(a){return e[a]||a}}(d)}(),function(){if(void 0===document.createElement("div").animate([]).oncancel){var a;if(window.performance&&performance.now)var a=function(){return performance.now()};else var a=function(){return Date.now()};var b=function(a,b,c){this.target=a,this.currentTime=b,this.timelineTime=c,this.type="cancel",this.bubbles=!1,this.cancelable=!1,this.currentTarget=a,this.defaultPrevented=!1,this.eventPhase=Event.AT_TARGET,this.timeStamp=Date.now()},c=window.Element.prototype.animate;window.Element.prototype.animate=function(d,e){var f=c.call(this,d,e);f._cancelHandlers=[],f.oncancel=null;var g=f.cancel;f.cancel=function(){g.call(this);var c=new b(this,null,a()),d=this._cancelHandlers.concat(this.oncancel?[this.oncancel]:[]);setTimeout(function(){d.forEach(function(a){a.call(c.target,c)})},0)};var h=f.addEventListener;f.addEventListener=function(a,b){"function"==typeof b&&"cancel"==a?this._cancelHandlers.push(b):h.call(this,a,b)};var i=f.removeEventListener;return f.removeEventListener=function(a,b){if("cancel"==a){var c=this._cancelHandlers.indexOf(b);c>=0&&this._cancelHandlers.splice(c,1)}else i.call(this,a,b)},f}}}(),function(a){var b=document.documentElement,c=null,d=!1;try{var e=getComputedStyle(b).getPropertyValue("opacity"),f="0"==e?"1":"0";c=b.animate({opacity:[f,f]},{duration:1}),c.currentTime=0,d=getComputedStyle(b).getPropertyValue("opacity")==f}catch(a){}finally{c&&c.cancel()}if(!d){var g=window.Element.prototype.animate;window.Element.prototype.animate=function(b,c){return window.Symbol&&Symbol.iterator&&Array.prototype.from&&b[Symbol.iterator]&&(b=Array.from(b)),Array.isArray(b)||null===b||(b=a.convertToArrayForm(b)),g.call(this,b,c)}}}(c),b.true=a}({},function(){return this}()); 147//# sourceMappingURL=web-animations.min.js.map 148/** 149 * AnimationDriver.js 150 * Class used for driving animations. 151 */ 152class AnimationDriver { 153 constructor(timeline, loopID, playPauseID, sliderID, timeLabelID, timerID) { 154 this.timerID = timerID 155 this.timeline = timeline 156 157 // Driver controls 158 this.slider = document.getElementById(sliderID) 159 this.animationTime = document.getElementById(timeLabelID) 160 this.playPauseButton = document.getElementById(playPauseID) 161 this.loopButton = document.getElementById(loopID) 162 this.interval = setInterval(() => { this.updateSliderIfAnimating() }, 100/3) 163 this.createControlFunctions() 164 } 165 166 get timeline() { 167 return this._timeline 168 } 169 170 set timeline(timeline) { 171 if (this._timeline != null) { 172 this.pause() 173 } 174 this._timeline = timeline 175 176 this.timingAnimation = document.getElementById(this.timerID).animate({}, timeline.duration) 177 this.timingAnimation.currentTime = 0 178 this.timingAnimation.pause() 179 180 this.animations = timeline.createAllAnimations() 181 this.shouldPlay = true 182 this.pause() 183 } 184 185 get duration() { 186 return this.timeline.duration 187 } 188 189 get currentTime() { 190 return this.timingAnimation.currentTime 191 } 192 193 set currentTime(time) { 194 for (const animation of this.animations) { 195 animation.currentTime = time 196 } 197 for (const shape of this.timeline.allShapes) { 198 shape.setCurrentTime(time / 1000) 199 } 200 this.timingAnimation.currentTime = time 201 } 202 203 updateSliderIfAnimating() { 204 if (this.timingAnimation.playState != "paused") { 205 this.sliderValue = this.currentTime / this.timeline.duration 206 this.setAnimationTimeLabels(this.currentTime) 207 } 208 } 209 210 play() { 211 this.interval = setInterval(() => { this.updateSliderIfAnimating() }, 100/3) 212 this.timingAnimation.play() 213 for (const animation of this.animations) { 214 animation.play() 215 } 216 for (const shape of this.timeline.allShapes) { 217 var t = shape.getCurrentTime() % this.timeline.duration 218 shape.setCurrentTime(t) 219 shape.unpauseAnimations() 220 } 221 } 222 223 isPlaying() { 224 if (this.timingAnimation == null) { 225 return false 226 } 227 return (this.timingAnimation.playState == "running") 228 } 229 230 pause() { 231 clearInterval(this.interval) 232 this.timingAnimation.pause() 233 for (const animation of this.animations) { 234 animation.pause() 235 } 236 for (const shape of this.timeline.allShapes) { 237 shape.pauseAnimations() 238 } 239 } 240 241 stop() { 242 this.playPauseButton.checked = false 243 this.shouldPlay = false 244 this.pause() 245 246 let d = this.duration 247 this.setAnimationTimeLabels(d) 248 this.sliderValue = d / this.timeline.duration - 0.001 249 } 250 251 togglePlayback() { 252 if (this.playPauseButton.checked) { 253 this.shouldPlay = true 254 if (this.timingAnimation.playState == "finished" || 255 this.currentTime == this.timeline.duration) { 256 this.currentTime = 0 257 } 258 this.play() 259 } else { 260 this.shouldPlay = false 261 this.pause() 262 } 263 } 264 265 //------------------ 266 // interface updates 267 //------------------ 268 269 createControlFunctions() { 270 this.playPauseButton.onchange = () => { 271 this.togglePlayback() 272 } 273 274 this.slider.onchange = () => { 275 if (this.shouldPlay) { 276 this.play() 277 } 278 } 279 280 this.timingAnimation.onfinish = () => { 281 if (this.loopButton.checked) { 282 this.currentTime = 0 283 } else { 284 this.stop() 285 } 286 } 287 288 this.slider.oninput = () => { 289 this.pause() 290 291 var newTime = this.slider.value * this.duration 292 this.setAnimationTimeLabels(newTime) 293 294 var newTime = Math.min(newTime, this.duration - 1) 295 this.currentTime = newTime 296 } 297 298 this.slider.onchange = () => { 299 if (this.shouldPlay == true) { 300 this.play() 301 } 302 } 303 } 304 305 setAnimationTimeLabels(value) { 306 this.animationTime.innerHTML = AnimationDriver.convertTimeToString(value) 307 } 308 309 get sliderValue() { 310 return this.slider.value 311 } 312 313 set sliderValue(value) { 314 this.slider.value = value 315 } 316 317 318 //--------------- 319 // helper methods 320 //--------------- 321 322 static convertTimeToString(milliseconds) { 323 var truncatedMilliseconds = Math.floor(Math.floor(milliseconds % 1000, 0) / 10, 2) 324 var seconds = Math.floor(milliseconds / 1000, 0) 325 var timeString = seconds+"" 326 if (truncatedMilliseconds != 0) { 327 timeString += "." 328 if (truncatedMilliseconds < 10) { 329 timeString += "0" 330 } 331 timeString += truncatedMilliseconds 332 }
333 return timeString+" s" 334 } 335} 336 337/** 338 * Driver.js 339 * Class used for driving animations. 340 */ 341class Driver { 342 constructor(timeline, loopID, playPauseID, sliderID, timeLabelID, timerID) { 343 // Driver controls 344 this.slider = document.getElementById(sliderID) 345 this.animationTime = document.getElementById(timeLabelID) 346 this.playPauseButton = document.getElementById(playPauseID) 347 this.loopButton = document.getElementById(loopID) 348 this.timerID = timerID 349 350 this.player = new Player(timeline, timerID, false, 0) 351 this.interval = setInterval(() => { this.updateSliderIfAnimating() }, 100/3) 352 this.createControlFunctions() 353 } 354 355 get timeline() { 356 return this.player.timeline 357 } 358 359 set timeline(timeline) { 360 this.player.timeline = timeline 361 } 362 363 get duration() { 364 return this.player.duration 365 } 366 367 get currentTime() { 368 return this.player.currentTime 369 } 370 371 set currentTime(time) { 372 this.slider.value = time / this.duration 373 this.player.currentTime = time 374 } 375 376 updateSliderIfAnimating() { 377 if (this.player.timingAnimation.playState != "paused") { 378 this.sliderValue = this.currentTime / this.timeline.duration 379 this.setAnimationTimeLabels(this.currentTime) 380 } 381 } 382 383 play() { 384 this.interval = setInterval(() => { this.updateSliderIfAnimating() }, 100/3) 385 this.player.play() 386 } 387 388 isPlaying() { 389 return this.player.isPlaying() 390 } 391 392 pause() { 393 clearInterval(this.interval) 394 this.player.pause() 395 } 396 397 stop() { 398 this.playPauseButton.checked = false 399 this.shouldPlay = false 400 this.pause() 401 402 let d = this.duration 403 this.setAnimationTimeLabels(d) 404 this.sliderValue = d / this.timeline.duration - 0.001 405 } 406 407 togglePlayback() { 408 if (this.playPauseButton.checked) { 409 this.shouldPlay = true 410 if (this.player.timingAnimation.playState == "finished" || 411 this.currentTime == this.timeline.duration) { 412 this.currentTime = 0 413 } 414 this.play() 415 } else { 416 this.shouldPlay = false 417 this.pause() 418 } 419 } 420 421 //------------------ 422 // interface updates 423 //------------------ 424 425 createControlFunctions() { 426 this.playPauseButton.onchange = () => { 427 this.togglePlayback() 428 } 429 430 this.slider.onchange = () => { 431 if (this.shouldPlay) { 432 this.play() 433 } 434 } 435 436 this.player.timingAnimation.onfinish = () => { 437 if (this.loopButton.checked) { 438 this.currentTime = 0 439 } else { 440 this.stop() 441 } 442 } 443 444 this.slider.oninput = () => { 445 this.pause() 446 447 var newTime = this.slider.value * this.duration 448 this.setAnimationTimeLabels(newTime) 449 450 var newTime = Math.min(newTime, this.duration - 1) 451 this.currentTime = newTime 452 } 453 454 this.slider.onchange = () => { 455 if (this.shouldPlay == true) { 456 this.play() 457 } 458 } 459 } 460 461 setAnimationTimeLabels(value) { 462 this.animationTime.innerHTML = Driver.convertTimeToString(value) 463 } 464 465 get sliderValue() { 466 return this.slider.value 467 } 468 469 set sliderValue(value) { 470 this.slider.value = value 471 } 472 473 474 //--------------- 475 // helper methods 476 //--------------- 477 478 static convertTimeToString(milliseconds) { 479 var truncatedMilliseconds = Math.floor(Math.floor(milliseconds % 1000, 0) / 10, 2) 480 var seconds = Math.floor(milliseconds / 1000, 0) 481 var timeString = seconds+"" 482 if (truncatedMilliseconds != 0) { 483 timeString += "." 484 if (truncatedMilliseconds < 10) { 485 timeString += "0" 486 } 487 timeString += truncatedMilliseconds 488 } 489 return timeString+" s" 490 } 491} 492 493/** 494 * Class used for driving animations. 495 */ 496class Player { 497 /** 498 * @constructor 499 * 500 * @param {Timeline} timeline 501 * Animation played when the transition is triggered. 502 * 503 * @param {String} timer 504 * The HTML Element or the HTML Element ID for the Timer. 505 * 506 * @param {Boolean} loop 507 * True if the animation should restart upon completion false otherwise. 508 * 509 * @param {Boolean} delay 510 * The time in milliseconds before the animation starts. 511 * 512 * @param {function: () -> Void} callback 513 * A callback function passed to the player that runs upon animation completion. 514 * This callback does not take in any parameters. 515 */ 516 constructor(timeline, timer, loop, delay, callback) { 517 this.delay = delay; 518 if (typeof timer === "string" || timer instanceof String) { 519 this.timer = document.getElementById(timer); 520 } else { 521 this.timer = timer; 522 } 523 this.loop = loop; 524 this.timeline = timeline; 525 this.callback = callback; 526 this.setOnFinishCallback(); 527 } 528 529 /** 530 * @return 531 * Returns the value of timeline for `self`. 532 */ 533 get timeline() { 534 return this._timeline; 535 } 536 537 /** 538 * @set 539 * Sets the timeline of self to timeline, pauses the playback and sets the current time to zero. 540 * 541 * @param timeline 542 * Animation to be played. 543 * 544 */ 545 set timeline(timeline) { 546 if (this._timeline != null) { 547 this.pause(); 548 } 549 this._timeline = timeline; 550 551 if (this._timeline === null) { 552 this.timingAnimation = null; 553 this.currentTime = 0; 554 this.shouldPlay = false;
555 } else { 556 this.timingAnimation = this.timer.animate( 557 {}, 558 this.timeline.duration + this.delay 559 ); 560 this.timeline.loadSVGAnimations(); 561 this.timingAnimation.currentTime = 0; 562 this.timingAnimation.pause(); 563 564 this.animations = this.timeline.createAllAnimations(); 565 this.shouldPlay = true; 566 this.pause(); 567 this.setOnFinishCallback(); 568 } 569 } 570 571 /** 572 * @return 573 * Returns the duration of the timeline of self, or 0 if timeline is null. 574 */ 575 get duration() { 576 return this.timeline === null ? 0 : this.timeline.duration; 577 } 578 579 /** 580 * @return 581 * Returns the currentTime of self, or null if timeline is null. 582 */ 583 get currentTime() { 584 return this.timingAnimation === null ? 0 : this.timingAnimation.currentTime; 585 } 586 587 /** 588 * @set 589 * Sets the currentTime of self. 590 * 591 * @param time 592 * A numeric value representing time in milliseconds. 593 */ 594 set currentTime(time) { 595 if (this.timeline === null || this.timingAnimation === null) { 596 return; 597 } 598 599 for (const animation of this.animations) { 600 animation.currentTime = time; 601 } 602 for (const shape of this.timeline.allShapes) { 603 shape.setCurrentTime(time / 1000); 604 } 605 this.timingAnimation.currentTime = time; 606 } 607 608 /** 609 * Plays the animation if the timeline that belongs to `self` is not null 610 * and the animation is not currently playing. 611 */ 612 play() { 613 if (this.timeline === null || this.isPlaying() == true) { 614 return; 615 } 616 617 this.timingAnimation.play(); 618 for (const animation of this.animations) { 619 animation.play(); 620 } 621 for (const shape of this.timeline.allShapes) { 622 var t = shape.getCurrentTime() % this.timeline.duration; 623 shape.setCurrentTime(t); 624 shape.unpauseAnimations(); 625 } 626 } 627 628 /** 629 * @return 630 * Returns true if self is currently playing an animation and false otherwise. 631 */ 632 isPlaying() { 633 if (this.timingAnimation == null) { 634 return false; 635 } 636 return this.timingAnimation.playState == "running"; 637 } 638 639 /** 640 * Pauses the animation being played by self. 641 */ 642 pause() { 643 if (this.timeline === null || this.timingAnimation === null) { 644 return; 645 } 646 647 this.timingAnimation.pause(); 648 for (const animation of this.animations) { 649 animation.pause(); 650 } 651 for (const shape of this.timeline.allShapes) { 652 shape.pauseAnimations(); 653 } 654 } 655 656 /** 657 * Stops the animation. 658 */ 659 stop() { 660 this.shouldPlay = false; 661 this.pause(); 662 this.currentTime = 0; 663 } 664 665 //------------------ 666 // interface updates 667 //------------------ 668 669 /** 670 * Sets the callback function that will be run at the end of each animation. 671 */ 672 setOnFinishCallback() { 673 if (this.timingAnimation == null) { 674 return; 675 } 676 this.timingAnimation.onfinish = () => { 677 if (this.loop == true) { 678 this.currentTime = 0; 679 } else { 680 this.pause(); 681 } 682 if (this.callback !== null) this.callback(); 683 }; 684 } 685 686 //--------------- 687 // helper methods 688 //--------------- 689 690 /** 691 * Converts a numeric value representing a time in milliseconds into a string. 692 */ 693 static convertTimeToString(milliseconds) { 694 var date = new Date(null); 695 date.setMilliseconds(milliseconds); 696 return date.toISOString().substr(14, 8); 697 } 698} 699 700function createPlayer( 701 timeline, 702 timerID, 703 loop, 704 delay, 705 callback, 706 rootID, 707 resourcesPath 708) { 709 let shadowDomContainer = document.getElementById(rootID); 710 let shadowRoot = shadowDomContainer.shadowRoot; 711 let timer = shadowRoot.getElementById(timerID); 712 let forwardTimeline = new timeline(shadowRoot, resourcesPath); 713 return new Player(forwardTimeline, timer, loop, delay, callback); 714} 715 716/** 717 * flowWebAnimationToggleViewport.js 718 */ 719function isLocationInViewport(location) { 720 var viewportTop = $(window).scrollTop() 721 var viewportBottom = viewportTop + $(window).height(); 722 /* console.log("l: "+ location + " t: "+ viewportTop + " b: " + viewportBottom) */ 723 return (location > viewportTop) && (location < viewportBottom) 724}; 725 726$.fn.isInViewport = function() { 727 var padding = 10 728 var top = $(this).offset().top + padding; 729 var topInViewport = isLocationInViewport(top) 730 731 var bottom = $(this).offset().top + $(this).outerHeight() - padding; 732 var bottomInViewport = isLocationInViewport(bottom) 733 734/* 735 console.log("t: " + topInViewport + " b: " + bottomInViewport) 736 console.log("t: " + topInViewport + " b: " + bottomInViewport) 737*/ 738 return (topInViewport || bottomInViewport); 739}; 740 741$(window).on('scroll load resize', function() { 742 $('.flowWebAnimation .flow-artboard').each(function() { 743 var theID = $(this).attr('id'); 744 var functionName = theID.toLowerCase() + "Player"; 745 if ($(this).isInViewport()) {
746 try { 747 eval(functionName).play(); 748 } catch(e) { 749 } 750 } else { 751 try { 752 eval(functionName).stop(); 753 } catch(e) { 754 } 755 } 756 }); 757}); 758 759 760 761/** 762 * A button that can be toggled on and off with 763 * forward and reverse animations. The forward and reverse animations are triggered when 764 * transitioning from the off -> on and on -> off states respectively. 765 */ 766class ToggleButton { 767 /** 768 * @constructor 769 * 770 * @param {Timeline} forwardTimeline 771 * Animation played when button transitions from off to on. 772 * 773 * @param {Timeline} reverseTimeline 774 * Animation played when button transitions from on to off. 775 * 776 * @param {String} timer 777 * The HTML Element for the Timer. 778 * 779 * @param {Boolean} loop 780 * True if the animation should restart upon completion false otherwise. 781 * 782 * @param {Boolean} state 783 * The initial state of the button. 784 * 785 * @param {function: () -> Void} callback 786 * A callback function passed to the player that runs upon animation completion. 787 * This callback does not take in any parameters. 788 */ 789 constructor(forwardTimeline, reverseTimeline, timer, loop, state, callback) { 790 this.callback = callback; 791 this.state = state; 792 this.timer = timer; 793 this.forwardTimeline = forwardTimeline; 794 this.reverseTimeline = reverseTimeline; 795 this.player = new Player(forwardTimeline, timer, loop, 0, callback); 796 this.setState(this.state); 797 } 798 799 /** 800 * @return 801 * Returns true if the `self` is currently being animated, otherwise returns false. 802 */ 803 isAnimating() { 804 return this.player.isPlaying(); 805 } 806 807 /** 808 * Sets the state of the `self` to `state`. 809 * 810 * @param {Boolean} state 811 * The new state of `self`. 812 * 813 */ 814 setState(state) { 815 this.player.timeline = this.state 816 ? this.reverseTimeline 817 : this.forwardTimeline; 818 this.state = state; 819 this.player.currentTime = 0; 820 } 821 822 /** 823 * Toggles the state of `self` and animates the state transition if `animated` is true. Then calls the player's call back function. 824 * 825 * @param {Boolean} animated 826 * Determines whether or not to animate the state transtion of `self`. 827 */ 828 toggle(amimated) { 829 this.setState(!this.state); 830 831 if (amimated) { 832 this.player.play(); 833 } 834 } 835} 836 837/** 838 * The function used to create new instances of `ToggleButton`. 839 * 840 * @param {String} rootID 841 * The id of the element for which the new instance of ToggleButton is created. 842 * 843 * @param {function: () -> Void} callback 844 * A callback function which is executed when the toggle button is clicked. 845 * 846 * @param {String} resourcesPath 847 * The path pointing to the root of the Timeline folder. 848 * 849 * @return 850 * A callback function which is executed when the toggle button is clicked. 851 */ 852 853function createToggleButton(rootID, callback, resourcesPath, ForwardTimeline, ReverseTimeline) { 854 let shadowDomContainer = document.getElementById(rootID); 855 let shadowRoot = shadowDomContainer.shadowRoot; 856 let timer = shadowRoot.getElementById("timerID"); 857 let forwardTimeline = new ForwardTimeline(shadowRoot, resourcesPath); 858 let reverseTimeline = new ReverseTimeline(shadowRoot, resourcesPath); 859 return new ToggleButton( 860 forwardTimeline, 861 reverseTimeline, 862 timer, 863 false, 864 false, 865 callback 866 ); 867} 868 869 870/** 871 * search.js 872 * A simple JSON search 873 * Requires jQuery (v 1.7+) 874 * 875 * @author Mat Hayward - Erskine Design 876 * @version 0.1 877 */ 878/* ========================================================================== 879 Initialisation 880 ========================================================================== */ 881var q, jsonFeedUrl = "/feeds/feed.json", $searchForm = $("[data-search-form]"), $searchInput = $("[data-search-input]"), $resultTemplate = $("#search-result"), $resultsPlaceholder = $("[data-search-results]"), $foundContainer = $("[data-search-found]"), $foundTerm = $("[data-search-found-term]"), $foundCount = $("[data-search-found-count]"), allowEmpty = true, showLoader = true, loadingClass = "is--loading"; 882var touching = "no"; 883var visible = false; 884 885 886let resultsHolder = document.getElementById('resultsholder') 887let inputField = document.getElementById('inputField') 888 889$(document).ready(function() { 890 // hide items found string 891 $foundContainer.hide(); 892 //detect screen touch and disable the autohide of the div / affects phones 893 window.addEventListener("touchstart", function onFirstTouch() { 894 touching = "yes"; 895 // we only need to know once that a human touched the screen, so we can stop listening now 896 window.removeEventListener("touchstart", onFirstTouch, false); 897 }, false); 898 // initiate search functionality 899 initSearch();
900 $("#searchtoggle").click(function() { 901 // $("#searchform").toggleClass("showme"); 902 // if search is open and you press toggle button hide results 903 // hide(resultsHolder) 904 }); 905 $("#inputField").on("input", function(e) { 906 if ($("#inputField").val() != "") { 907 reveal(resultsHolder) 908 enableInteraction(resultsHolder) 909 $("#searchsubmit").click(); 910 } else { 911 hide(resultsHolder) 912 disableInteraction(resultsHolder) 913 } 914 if ($("#inputField").val() == "Jeff") { 915 alert("I can hardly blame you for searching for Jeff. We are all searching for a Jeff in this world.... Good luck on your search"); 916 } 917 }); 918 919 $("#inputField").on("focusin", function(e) { 920 if ($("#inputField").val() != "") { 921 reveal(resultsHolder) 922 enableInteraction(resultsHolder) 923 $("#searchsubmit").click(); 924 } 925 }); 926 927 // $("#inputField").on("focusout", function(e) { 928 // hide(resultsHolder) 929 // disableInteraction(resultsHolder) 930 931 // hide(inputField) 932 // disable(inputField) 933 // toggle() 934 // visible = false 935 // }); 936}); 937 938// close window if focus is away from the search / or results 939var testholder = "out"; 940 941var testinput = "out"; 942 943$("#inputField").focusout(function() { 944 testinput = "out"; 945 if (testholder == "out") { 946 if (touching == "no") { 947 $("#resultsholder").removeClass("open"); 948 } 949 } 950}); 951 952$("#inputField").focusin(function() { 953 testinput = "in"; 954}); 955 956$("#resultsholder").mouseover(function() { 957 testholder = "in"; 958}); 959 960$("#resultsholder").mouseout(function() { 961 testholder = "out"; 962 if (testinput == "out") { 963 $("#resultsholder").removeClass("open"); 964 } 965}); 966 967// trying to stop it from closing / i think i 968$("#resultsholder").on("tap", function() { 969 $("#resultsholder").focus(); 970}); 971 972$("#resultsholder").on("swipe", function() { 973 $("#resultsholder").focus(); 974}); 975 976$("#resultsholder").on("taphold", function() { 977 $("#resultsholder").focus(); 978}); 979 980var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform); 981 982if (iOS == "True") { 983 $("#resultsholder").css("overflow", "scroll"); 984} 985 986function hide(element) { 987 element.style.opacity = 0.0; 988} 989 990function reveal(element) { 991 element.style.opacity = 1.0; 992} 993 994function disable(inputElement) { 995 inputElement.disabled = true; 996} 997 998function enable(inputElement) { 999 inputElement.disabled = false; 1000} 1001 1002function disableInteraction(divElement) { 1003 divElement.style.pointerEvents = 'none'; 1004 divElement.style.userSelect = 'none'; 1005} 1006 1007function enableInteraction(divElement) { 1008 divElement.style.pointerEvents = 'auto'; 1009 divElement.style.userSelect = 'auto'; 1010} 1011/* ========================================================================== 1012 Search functions 1013 ========================================================================== */ 1014/** 1015 * Initiate search functionality. 1016 * Shows results based on querystring if present. 1017 * Binds search function to form submission. 1018 */ 1019function initSearch() { 1020 // Get search results if q parameter is set in querystring 1021 if (getParameterByName("q")) { 1022 q = decodeURIComponent(getParameterByName("q")); 1023 $searchInput.val(q); 1024 execSearch(q); 1025 } 1026 // Get search results on submission of form 1027 $(document).on("submit", $searchForm, function(e) { 1028 e.preventDefault(); 1029 q = $searchInput.val(); 1030 execSearch(q); 1031 }); 1032} 1033 1034/** 1035 * Executes search 1036 * @param {String} q 1037 * @return null 1038 */ function execSearch(q) { 1039 if (q != "" || allowEmpty) { 1040 if (showLoader) { 1041 toggleLoadingClass(); 1042 } 1043 getSearchResults(processData()); 1044 } 1045} 1046 1047/** 1048 * Toggles loading class on results and found string 1049 * @return null 1050 */ function toggleLoadingClass() { 1051 $resultsPlaceholder.toggleClass(loadingClass); 1052 $foundContainer.toggleClass(loadingClass); 1053} 1054 1055/** 1056 * Get Search results from JSON 1057 * @param {Function} callbackFunction 1058 * @return null 1059 */ function getSearchResults(callbackFunction) { 1060 $.get(jsonFeedUrl, callbackFunction, "json"); 1061 1062} 1063 1064/** 1065 * Process search result data 1066 * @return null 1067 */ function processData() { 1068 $results = []; 1069 return function(data) { 1070 // data = d.replace(/\\/g, ""); 1071 var resultsCount = 0, results = ""; 1072 //first add count- then sort count then output like originally 1073 $.each(data, function(index, item) { 1074 // check if search term is in content or title 1075 String.prototype.countnumberof = function(s1) { 1076 return (this.length - this.replace(new RegExp(s1, "g"), "").length) / s1.length; 1077 }; 1078 contentfinds = item.content.toLowerCase().countnumberof(q.toLowerCase()); 1079 titlefinds = item.title.toLowerCase().countnumberof(q.toLowerCase()); 1080 //item.content.toLowerCase().indexOf(q.toLowerCase()) 1081 // titlefinds = item.title.toLowerCase().indexOf(q.toLowerCase()) 1082 if (item.search_omit != "true" && (contentfinds > 0 || titlefinds > 0)) { 1083 totalfinds = titlefinds + contentfinds; 1084 item.count = totalfinds; 1085 var result = populateResultContent($resultTemplate.html(), item, item.count); 1086 resultsCount++; 1087 results += result; 1088 } 1089 }); 1090 if (showLoader) { 1091 toggleLoadingClass(); 1092 } 1093 populateResultsString(resultsCount); 1094 showSearchResults(results); 1095 sortResults(); 1096 }; 1097} 1098 1099function sortResults() { 1100 var $wrapper = $("#results"); 1101 $wrapper.find(".searchresult").sort(function(a, b) { 1102 return +b.dataset.name - +a.dataset.name; 1103 }).appendTo($wrapper); 1104} 1105 1106/** 1107 * Add search results to placeholder 1108 * @param {String} results 1109 * @return null 1110 */ function showSearchResults(results) { 1111 // Add results HTML to placeholder 1112 $resultsPlaceholder.html(results); 1113} 1114 1115/** 1116 * Add results content to item template 1117 * @param {String} html 1118 * @param {object} item 1119 * @return {String} Populated HTML 1120 */ function populateResultContent(html, item, thefinds) { 1121 html = injectContent(html, item.title, "##Title##"); 1122 html = injectContent(html, item.link, "##Url##"); 1123 html = injectContent(html, item.excerpt, "##Excerpt##"); 1124 html = injectContent(html, item.date, "##Date##"); 1125 html = injectContent(html, item.type, "##Type##"); 1126 html = injectContent(html, thefinds, "##Finds##"); 1127 return html; 1128} 1129 1130/** 1131 * Populates results string 1132 * @param {String} count 1133 * @return null 1134 */ function populateResultsString(count) { 1135 $foundTerm.text(q); 1136 $foundCount.text(count); 1137 $foundContainer.show(); 1138} 1139 1140/* ========================================================================== 1141 Helper functions 1142 ========================================================================== */ 1143/** 1144 * Gets query string parameter - taken from http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript 1145 * @param {String} name 1146 * @return {String} parameter value 1147 */ function getParameterByName(name) { 1148 var match = RegExp("[?&]" + name + "=([^&]*)").exec(window.location.search); 1149 return match && decodeURIComponent(match[1].replace(/\+/g, " ")); 1150} 1151 1152/** 1153 * Injects content into template using placeholder 1154 * @param {String} originalContent 1155 * @param {String} injection 1156 * @param {String} placeholder 1157 * @return {String} injected content 1158 */ function injectContent(originalContent, injection, placeholder) { 1159 var regex = new RegExp(placeholder, "g"); 1160 return originalContent.replace(regex, injection); 1161} 1162/** 1163 * Class representing the ShowSearchBar timeline. 1164 * 1165 * Made with Flow 1166 */ 1167 1168class ShowSearchBar { 1169 /** 1170 * @constructor 1171 * 1172 * @param {HTMLElement} rootElement 1173 * Root Element of the DOM containing the elements that will be animated in this timeline. 1174 * 1175 * @param {String} resourcesPath 1176 * The path pointing to the root of the Timeline folder. 1177 */ 1178 constructor(rootElement, resourcesPath) { 1179 this.rootElement = rootElement; 1180 this.resourcesPath = resourcesPath; 1181 this.imagesFolderPath = resourcesPath + "/img"; 1182 this.loadFillImages(); 1183 } 1184 1185 /** 1186 * Returns the timeline's duration in milliseconds. 1187 */ 1188 get duration() { 1189 return 500; 1190 } 1191 1192 loadFillImages() { 1193 let pattern; 1194 } 1195 1196 loadSVGAnimations() { 1197 this.loadSVGShapeAnimations();
1198 this.loadSVGShapeMaskAnimations(); 1199 } 1200 1201 loadSVGShapeAnimations() { 1202 // Path Animations 1203 let path; 1204 path = this.rootElement.getElementById("background-path"); 1205 path.d = 1206 "M0,0c0,0,50,0,50,0 0,0,0,50,0,50 0,0,-50,0,-50,0 0,0,0,-50,0,-50zM0,0"; 1207 1208 path = this.rootElement.getElementById("underscore-path"); 1209 path.d = "M0,0.5c0,0,234.93,0,234.93,0"; 1210 1211 path = this.rootElement.getElementById("line2-path"); 1212 path.d = "M17.68,0c0,0,-17.68,17.68,-17.68,17.68"; 1213 path = this.rootElement.getElementById("line1-path"); 1214 path.d = "M17.678,17.678c0,0,-17.678,-17.678,-17.678,-17.678"; 1215 1216 path = this.rootElement.getElementById("circle-path"); 1217 path.d = 1218 "M6.75,13.5c3.728,0,6.75,-3.022,6.75,-6.75 0,-3.728,-3.022,-6.75,-6.75,-6.75 -3.728,0,-6.75,3.022,-6.75,6.75 0,3.728,3.022,6.75,6.75,6.75zM6.75,13.5"; 1219 1220 path = this.rootElement.getElementById("hit-path"); 1221 path.d = 1222 "M0,0c0,0,50,0,50,0 0,0,0,50,0,50 0,0,-50,0,-50,0 0,0,0,-50,0,-50zM0,0"; 1223 1224 // Gradient Animations 1225 let defs; 1226 } 1227
1228 loadSVGShapeMaskAnimations() { } 1229 1230 /** 1231 * @return 1232 * Returns the list of svg shapes that are animated in this timeline. 1233 */ 1234 get allShapes() { 1235 return [ 1236 this.rootElement.querySelector("#ShowSearchBar .background-svg"), 1237 this.rootElement.querySelector("#ShowSearchBar .underscore-svg"), 1238 this.rootElement.querySelector("#ShowSearchBar .line2-svg"), 1239 this.rootElement.querySelector("#ShowSearchBar .line1-svg"), 1240 this.rootElement.querySelector("#ShowSearchBar .circle-svg"), 1241 this.rootElement.querySelector("#ShowSearchBar .hit-svg") 1242 ]; 1243 } 1244 1245 artboardAnimation() { 1246 // Workaround for Safari bug 1247 return this.rootElement 1248 .querySelector("#ShowSearchBar.flow-artboard") 1249 .animate( 1250 { 1251 backgroundPosition: ["0px", "1px"] 1252 }, 1253 { 1254 delay: 0, 1255 duration: 500 1256 } 1257 ); 1258 } 1259 backgroundAnimation0() { 1260 return this.rootElement.querySelector("#ShowSearchBar .background").animate( 1261 { 1262 width: ["50px", "300px"], 1263 left: ["25.03px", "-99.97px"] 1264 }, 1265 { 1266 delay: 0, 1267 duration: 400, 1268 easing: "ease-in-out", 1269 composite: "replace", 1270 fill: "forwards" 1271 } 1272 ); 1273 } 1274 underscoreShapeAnimation0() { 1275 return this.rootElement 1276 .querySelector("#ShowSearchBar .underscore-svg") 1277 .animate( 1278 { 1279 strokeDashoffset: ["250px", "500px"] 1280 }, 1281 { 1282 delay: 230, 1283 duration: 270, 1284 easing: "ease-in-out", 1285 composite: "replace", 1286 fill: "forwards" 1287 } 1288 ); 1289 } 1290 line2ShapeAnimation0() { 1291 return this.rootElement.querySelector("#ShowSearchBar .line2-svg").animate( 1292 { 1293 strokeDashoffset: ["25px", "50px"] 1294 }, 1295 { 1296 delay: 230, 1297 duration: 270, 1298 easing: "ease-in-out", 1299 composite: "replace", 1300 fill: "forwards" 1301 } 1302 ); 1303 } 1304 line1ShapeAnimation0() { 1305 return this.rootElement.querySelector("#ShowSearchBar .line1-svg").animate( 1306 { 1307 strokeDashoffset: ["68px", "50px"] 1308 }, 1309 { 1310 delay: 230, 1311 duration: 270, 1312 easing: "ease-in-out", 1313 composite: "replace", 1314 fill: "forwards" 1315 } 1316 ); 1317 } 1318 circleShapeAnimation0() { 1319 return this.rootElement.querySelector("#ShowSearchBar .circle-svg").animate( 1320 { 1321 strokeDashoffset: ["84.4px", "42.2px"] 1322 }, 1323 { 1324 delay: 0, 1325 duration: 230, 1326 easing: "ease-in-out", 1327 composite: "replace", 1328 fill: "forwards" 1329 } 1330 ); 1331 } 1332 1333 /** 1334 * Creates and returns all animations for this timeline. 1335 */ 1336 createAllAnimations() { 1337 return [ 1338 this.artboardAnimation(), 1339 this.backgroundAnimation0(), 1340 this.underscoreShapeAnimation0(), 1341 this.line2ShapeAnimation0(), 1342 this.line1ShapeAnimation0(), 1343 this.circleShapeAnimation0() 1344 ]; 1345 } 1346} 1347 1348Object.freeze(ShowSearchBar); 1349 1350/** 1351 * Class representing the HideSearchBar timeline. 1352 * 1353 * Made with Flow 1354 */ 1355 1356class HideSearchBar { 1357 /** 1358 * @constructor 1359 * 1360 * @param {HTMLElement} rootElementhttps://github.com/SlantDesign/Flow-Website/pull/244 1361 * Root Element of the DOM containing the elements that will be animated in this timeline. 1362 * 1363 * @param {String} resourcesPath 1364 * The path pointing to the root of the Timeline folder. 1365 */ 1366 constructor(rootElement, resourcesPath) { 1367 this.rootElement = rootElement; 1368 this.resourcesPath = resourcesPath; 1369 this.imagesFolderPath = resourcesPath + "/img"; 1370 this.loadFillImages(); 1371 } 1372 1373 /** 1374 * Returns the timeline's duration in milliseconds. 1375 */ 1376 get duration() { 1377 return 500; 1378 } 1379 1380 loadFillImages() { 1381 let pattern; 1382 } 1383 1384 loadSVGAnimations() { 1385 this.loadSVGShapeAnimations();
1386 this.loadSVGShapeMaskAnimations(); 1387 } 1388 1389 loadSVGShapeAnimations() { 1390 // Path Animations 1391 let path; 1392 path = this.rootElement.getElementById("background-path"); 1393 path.d = 1394 "M0,0c0,0,300,0,300,0 0,0,0,50,0,50 0,0,-300,0,-300,0 0,0,0,-50,0,-50zM0,0"; 1395 1396 path = this.rootElement.getElementById("underscore-path"); 1397 path.d = "M0,0.5c0,0,234.93,0,234.93,0"; 1398 1399 path = this.rootElement.getElementById("line2-path"); 1400 path.d = "M17.68,0c0,0,-17.68,17.68,-17.68,17.68"; 1401 1402 path = this.rootElement.getElementById("line1-path"); 1403 path.d = "M17.678,17.678c0,0,-17.678,-17.678,-17.678,-17.678"; 1404 1405 path = this.rootElement.getElementById("circle-path"); 1406 path.d = 1407 "M6.75,13.5c3.728,0,6.75,-3.022,6.75,-6.75 0,-3.728,-3.022,-6.75,-6.75,-6.75 -3.728,0,-6.75,3.022,-6.75,6.75 0,3.728,3.022,6.75,6.75,6.75zM6.75,13.5"; 1408 1409 path = this.rootElement.getElementById("hit-path"); 1410 path.d = 1411 "M0,0c0,0,50,0,50,0 0,0,0,50,0,50 0,0,-50,0,-50,0 0,0,0,-50,0,-50zM0,0"; 1412 1413 // Gradient Animations 1414 let defs; 1415 } 1416
1417 loadSVGShapeMaskAnimations() { } 1418 1419 /** 1420 * @return 1421 * Returns the list of svg shapes that are animated in this timeline. 1422 */ 1423 get allShapes() { 1424 return [ 1425 this.rootElement.querySelector("#ShowSearchBar .background-svg"), 1426 this.rootElement.querySelector("#ShowSearchBar .underscore-svg"), 1427 this.rootElement.querySelector("#ShowSearchBar .line2-svg"), 1428 this.rootElement.querySelector("#ShowSearchBar .line1-svg"), 1429 this.rootElement.querySelector("#ShowSearchBar .circle-svg"), 1430 this.rootElement.querySelector("#ShowSearchBar .hit-svg") 1431 ]; 1432 } 1433 1434 artboardAnimation() { 1435 // Workaround for Safari bug 1436 return this.rootElement 1437 .querySelector("#ShowSearchBar.flow-artboard") 1438 .animate( 1439 { 1440 backgroundPosition: ["0px", "1px"] 1441 }, 1442 { 1443 delay: 0, 1444 duration: 500 1445 } 1446 ); 1447 } 1448 backgroundAnimation0() { 1449 return this.rootElement.querySelector("#ShowSearchBar .background").animate( 1450 { 1451 left: ["-99.97px", "25.03px"], 1452 width: ["300px", "50px"] 1453 }, 1454 { 1455 delay: 100, 1456 duration: 400, 1457 easing: "ease-in-out", 1458 composite: "replace", 1459 fill: "forwards" 1460 } 1461 ); 1462 } 1463 underscoreShapeAnimation0() { 1464 return this.rootElement 1465 .querySelector("#ShowSearchBar .underscore-svg") 1466 .animate( 1467 { 1468 strokeDashoffset: ["500px", "250px"] 1469 }, 1470 { 1471 delay: 0, 1472 duration: 270, 1473 easing: "ease-in-out", 1474 composite: "replace", 1475 fill: "forwards" 1476 } 1477 ); 1478 } 1479 line2ShapeAnimation0() { 1480 return this.rootElement.querySelector("#ShowSearchBar .line2-svg").animate( 1481 { 1482 strokeDashoffset: ["50px", "25px"] 1483 }, 1484 { 1485 delay: 0, 1486 duration: 270, 1487 easing: "ease-in-out", 1488 composite: "replace", 1489 fill: "forwards" 1490 } 1491 ); 1492 } 1493 line1ShapeAnimation0() { 1494 return this.rootElement.querySelector("#ShowSearchBar .line1-svg").animate( 1495 { 1496 strokeDashoffset: ["0px", "18px"] 1497 }, 1498 { 1499 delay: 0, 1500 duration: 270, 1501 easing: "ease-in-out", 1502 composite: "replace", 1503 fill: "forwards" 1504 } 1505 ); 1506 } 1507 circleShapeAnimation0() { 1508 return this.rootElement.querySelector("#ShowSearchBar .circle-svg").animate( 1509 { 1510 strokeDashoffset: ["42.2px", "84.4px"] 1511 }, 1512 { 1513 delay: 270, 1514 duration: 230, 1515 easing: "ease-in-out", 1516 composite: "replace", 1517 fill: "forwards" 1518 } 1519 ); 1520 } 1521 1522 /** 1523 * Creates and returns all animations for this timeline. 1524 */ 1525 createAllAnimations() { 1526 return [ 1527 this.artboardAnimation(), 1528 this.backgroundAnimation0(), 1529 this.underscoreShapeAnimation0(), 1530 this.line2ShapeAnimation0(), 1531 this.line1ShapeAnimation0(), 1532 this.circleShapeAnimation0() 1533 ]; 1534 } 1535} 1536 1537Object.freeze(HideSearchBar); 1538 1539/** 1540 * search-activation.js 1541 */ 1542let hideSearchBar = new HideSearchBar(document, "."); 1543let showSearchBar = new ShowSearchBar(document, "."); 1544document.searchPlayer = new Player( 1545 hideSearchBar, 1546 "search-timer", 1547 false, 1548 0, 1549 null 1550); 1551document.searchPlayer.currentTime = 500; 1552var shouldOpen = true; 1553 1554function toggle() { 1555 if (!document.searchPlayer.isPlaying()) { 1556 setTimeout( 1557 function () { 1558 shouldOpen ? hideInputField() : revealInputField(); 1559 }, 1560 shouldOpen ? 500 : 0 1561 ); 1562 if (!document.shouldOpen) { 1563 hide(resultsHolder); 1564 disableInteraction(resultsHolder); 1565 } 1566 document.searchPlayer.timeline = shouldOpen ? showSearchBar : hide
1566SearchBar; 1567 document.searchPlayer.play(); 1568 shouldOpen = !shouldOpen; 1569 } 1570} 1571 1572function revealInputField() { 1573 reveal(inputField); 1574 enable(inputField); 1575 enableInteraction(searchform); 1576 inputField.focus(); 1577} 1578 1579function hideInputField() { 1580 hide(inputField); 1581 disable(inputField); 1582 disableInteraction(searchform); 1583} 1584 1585 1586/** 1587 * vimeo.js 1588 */ 1589 1590var i = 0; 1591 1592function autoplayVimeo(player, id) { 1593 window.addEventListener('scroll', function (){ 1594 var top = $('#c'+id).offset().top; 1595 var bottom = $('#c'+id).offset().top + $('#c'+id).outerHeight(); 1596 var screenBottom = window.scrollY + $(window).innerHeight(); 1597 var screenTop = window.scrollY; 1598 1599 if ((screenBottom > top) && (screenTop < bottom)) { 1600 player.getPaused().then(function(paused) { 1601 if (paused == true) { 1602 $("div#scroll").text("play()"); 1603 player.play().then(function() { 1604 $("div#scroll").text("fired play()"); 1605 }); 1606 } 1607 }); 1608 } else { 1609 player.getPaused().then(function(paused) { 1610 $("div#scroll").text("pause()"); 1611 if (paused == false) { player.pause() } 1612 }); 1613 } 1614 }, false); 1615} 1616 1617function createVimeoPlayer(id, options) { 1618 var player = new Vimeo.Player('v'+id, options); 1619} 1620 1621function createBackgroundVimeoPlayer(id, options) { 1622 var player = new Vimeo.Player('v'+id, options); 1623 player.setCurrentTime(1); 1624 autoplayVimeo(player, id) 1625} 1626function createBackgroundVimeoVideos() { 1627 var ids = $('.vimeo.background').map(function(){ 1628 return $(this).attr('id'); 1629 }).get(); 1630 1631 for (i = 0; i < ids.length; i++) { 1632 var dirtyID = ids[i]; 1633 var id = dirtyID.substr(1,dirtyID.length) 1634 this.createBackgroundVimeoPlayer(id, { id: id, loop: true, background: true}) 1635 } 1636} 1637 1638function createPlayableVimeoVideos() { 1639 var ids = $('.vimeo.playable').map(function(){ 1640 return $(this).attr('id'); 1641 }).get(); 1642 1643 for (i = 0; i < ids.length; i++) { 1644 var dirtyID = ids[i]; 1645 var id = dirtyID.substr(1,dirtyID.length) 1646 this.createVimeoPlayer(id, { id: id, playsinline: true}) 1647 } 1648} 1649 1650createBackgroundVimeoVideos() 1651createPlayableVimeoVideos() 1652 1653/** 1654* Class representing the MenuToggleTimeline timeline. 1655* 1656* Made with Flow 1657*/ 1658 1659class MenuToggleTimeline { 1660 /** 1661 * @constructor 1662 * 1663 * @param {HTMLElement} rootElement 1664 * Root Element of the DOM containing the elements that will be animated in this timeline. 1665 * 1666 * @param {String} resourcesPath 1667 * The path pointing to the root of the Timeline folder. 1668 */ 1669 constructor(rootElement, elementID, resourcesPath) { 1670 this.rootElement = rootElement; 1671 this.elementID = elementID; 1672 this.resourcesPath = resourcesPath; 1673 this.imagesFolderPath = resourcesPath + "/img"; 1674 this.loadFillImages(); 1675 } 1676 1677 /** 1678 * Returns the timeline's duration in milliseconds. 1679 */ 1680 get duration() { return 330 } 1681 1682 loadFillImages() { 1683 let pattern; 1684 } 1685 1686 loadSVGAnimations() { 1687 this.loadSVGShapeAnimations()
1688 this.loadSVGShapeMaskAnimations() 1689 } 1690 1691 loadSVGShapeAnimations() { 1692 // Path Animations 1693 let path; 1694 // Gradient Animations 1695 let defs; 1696 } 1697 1698 loadSVGShapeMaskAnimations() { } 1699 1700 /** 1701 * @return 1702 * Returns the list of svg shapes that are animated in this timeline. 1703 */ 1704 get allShapes() { 1705 return [ 1706 this.rootElement.querySelector(`${this.elementID} .group-svg`), 1707 this.rootElement.querySelector(`${this.elementID} .ringmask-svg`), 1708 this.rootElement.querySelector(`${this.elementID} .downarrow-svg`), 1709 this.rootElement.querySelector(`${this.elementID} .uparrow-svg`), 1710 this.rootElement.querySelector(`${this.elementID} .ring-svg`), 1711 ] 1712 } 1713 1714 artboardAnimation() { 1715 // Workaround for Safari bug 1716 return this.rootElement.querySelector(`${this.elementID}.flow-artboard`).animate({ 1717 backgroundPosition: ['0px', '1px'], 1718 }, { 1719 delay: 0, 1720 duration: 330, 1721 }); 1722 } 1723 downarrow_topTrack() { 1724 const element = this.rootElement.querySelector(`${this.elementID} .downarrow`); 1725 return element.animate({ 1726 top: ['15px', '35px'], 1727 easing: ["ease-in-out"], 1728 offset: [0, 1], 1729 }, 1730 { 1731 duration: this.duration, 1732 composite: MenuToggleTimeline.composite.REPLACE, 1733 fill: MenuToggleTimeline.fill.FORWARDS 1734 } 1735 ) 1736 }uparrow_topTrack() { 1737 const element = this.rootElement.querySelector(`${this.elementID} .uparrow`); 1738 return element.animate({ 1739 top: ['-7px', '13px'], 1740 easing: ["ease-in-out"], 1741 offset: [0, 1], 1742 }, 1743 { 1744 duration: this.duration, 1745 composite: MenuToggleTimeline.composite.REPLACE, 1746 fill: MenuToggleTimeline.fill.FORWARDS 1747 } 1748 ) 1749 } 1750 /** 1751 * Creates and returns all animations for this timeline. 1752 */ 1753 createAllAnimations() { 1754 return [ 1755 this.artboardAnimation(), 1756 this.downarrow_topTrack(), 1757 this.uparrow_topTrack(), 1758 ].flat() 1759 } 1760} 1761 1762// https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/composite 1763 MenuToggleTimeline.composite = { 1764 ADD: 'add', 1765 REPLACE: 'replace', 1766 ACCUMULATE: 'accumulate', 1767 } 1768 1769// https://developer.mozilla.org/en-US/docs/Web/API/EffectTiming/fill 1770 MenuToggleTimeline.fill = { 1771 NONE: 'none', 1772 FORWARDS: 'forwards', 1773 BACKWARDS: 'backwards', 1774 BOTH: 'both', 1775 AUTO: 'auto', 1776 } 1777 1778Object.freeze(MenuToggleTimeline) 1779 1780/** 1781* Class representing the MenuToggleReverseTimeline timeline. 1782* 1783* Made with Flow 1784*/ 1785 1786class MenuToggleReverseTimeline { 1787 /** 1788 * @constructor 1789 * 1790 * @param {HTMLElement} rootElement 1791 * Root Element of the DOM containing the elements that will be animated in this timeline. 1792 * 1793 * @param {String} resourcesPath 1794 * The path pointing to the root of the Timeline folder. 1795 */ 1796 constructor(rootElement, elementID, resourcesPath) { 1797 this.rootElement = rootElement; 1798 this.elementID = elementID; 1799 this.resourcesPath = resourcesPath; 1800 this.imagesFolderPath = resourcesPath + "/img"; 1801 this.loadFillImages(); 1802 } 1803 1804 /** 1805 * Returns the timeline's duration in milliseconds. 1806 */ 1807 get duration() { return 330 } 1808 1809 loadFillImages() { 1810 let pattern; 1811 } 1812 1813 loadSVGAnimations() { 1814 this.loadSVGShapeAnimations()
1815 this.loadSVGShapeMaskAnimations() 1816 } 1817 1818 loadSVGShapeAnimations() { 1819 // Path Animations 1820 let path; 1821 // Gradient Animations 1822 let defs; 1823 } 1824 1825 loadSVGShapeMaskAnimations() { } 1826 1827 /** 1828 * @return 1829 * Returns the list of svg shapes that are animated in this timeline. 1830 */ 1831 get allShapes() { 1832 return [ 1833 this.rootElement.querySelector(`${this.elementID} .group-svg`), 1834 this.rootElement.querySelector(`${this.elementID} .ringmask-svg`), 1835 this.rootElement.querySelector(`${this.elementID} .downarrow-svg`), 1836 this.rootElement.querySelector(`${this.elementID} .uparrow-svg`), 1837 this.rootElement.querySelector(`${this.elementID} .ring-svg`), 1838 ] 1839 } 1840 1841 artboardAnimation() { 1842 // Workaround for Safari bug 1843 return this.rootElement.querySelector(`${this.elementID}.flow-artboard`).animate({ 1844 backgroundPosition: ['0px', '1px'], 1845 }, { 1846 delay: 0, 1847 duration: 330, 1848 }); 1849 } 1850 downarrow_topTrack() { 1851 const element = this.rootElement.querySelector(`${this.elementID} .downarrow`); 1852 return element.animate({ 1853 top: ['35px', '15px'], 1854 easing: ["ease-in-out"], 1855 offset: [0, 1], 1856 }, 1857 { 1858 duration: this.duration, 1859 composite: MenuToggleReverseTimeline.composite.REPLACE, 1860 fill: MenuToggleReverseTimeline.fill.FORWARDS 1861 } 1862 ) 1863 }uparrow_topTrack() { 1864 const element = this.rootElement.querySelector(`${this.elementID} .uparrow`); 1865 return element.animate({ 1866 top: ['13px', '-7px'], 1867 easing: ["ease-in-out"], 1868 offset: [0, 1], 1869 }, 1870 { 1871 duration: this.duration, 1872 composite: MenuToggleReverseTimeline.composite.REPLACE, 1873 fill: MenuToggleReverseTimeline.fill.FORWARDS 1874 } 1875 ) 1876 } 1877 /** 1878 * Creates and returns all animations for this timeline. 1879 */ 1880 createAllAnimations() { 1881 return [ 1882 this.artboardAnimation(), 1883 this.downarrow_topTrack(), 1884 this.uparrow_topTrack(), 1885 ].flat() 1886 } 1887} 1888 1889// https://developer.mozilla.org/en-US/docs/Web/API/KeyframeEffect/composite 1890 MenuToggleReverseTimeline.composite = { 1891 ADD: 'add', 1892 REPLACE: 'replace', 1893 ACCUMULATE: 'accumulate', 1894 } 1895 1896// https://developer.mozilla.org/en-US/docs/Web/API/EffectTiming/fill 1897 MenuToggleReverseTimeline.fill = { 1898 NONE: 'none', 1899 FORWARDS: 'forwards', 1900 BACKWARDS: 'backwards', 1901 BOTH: 'both', 1902 AUTO: 'auto', 1903 } 1904 1905Object.freeze(MenuToggleReverseTimeline) 1906 1907let timermenutoggle = document.getElementById('timer-menutoggle') 1908let menutoggleResourcesPath = "." 1909let menutoggletimeline = new MenuToggleTimeline(document, "#MenuToggle", menutoggleResourcesPath) 1910let menuToggleReverseTimeline = new MenuToggleReverseTimeline(document, "#MenuToggle", menutoggleResourcesPath) 1911buttonMenuToggle = new ToggleButton(menutoggletimeline, menuToggleReverseTimeline, timermenutoggle, false, null) 1912 1913let menu = document.getElementById('menu') 1914let nav = document.getElementById('nav') 1915let menumobileRow = document.getElementById('menumobile-row') 1916let menumobileDiv = document.getElementById('menumobile-div') 1917 1918function hideMenuMobileRow() { 1919 menumobileRow.classList.add("displaynone") 1920} 1921 1922function showMenuMobileDiv() { 1923 menumobileDiv.classList.remove("hidden") 1924} 1925 1926function closeMenu() { 1927 nav.classList.remove("open") 1928 setTimeout(this.hideMenuMobileRow, 250) 1929 menumobileDiv.classList.add("hidden") 1930} 1931 1932function openMenu() { 1933 nav.classList.add("open") 1934 menumobileRow.classList.remove("displaynone") 1935 setTimeout(this.showMenuMobileDiv, 250) 1936} 1937 1938function toggleMenu() { 1939 buttonMenuToggle.toggle(true) 1940 if (nav.classList.contains("open")) { 1941 closeMenu() 1942 } else { 1943 openMenu() 1944 } 1945} 1946 1947function catchOpenMenu() { 1948 var w = $(this).width() 1949 if (w >= 768 && nav.classList.contains("open")) { 1950 buttonMenuToggle.setState(true, 0) 1951 closeMenu() 1952 } 1953}
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.