From fe3603bb797939af0eac77e8e86f7a601929e770 Mon Sep 17 00:00:00 2001 From: Thomas Wilkerling Date: Sun, 20 Jan 2019 22:48:06 +0100 Subject: [PATCH] v0.6.6: Minor Optimizations, Refactoring, Cleanup --- README.md | 107 ++++- compile.js | 26 +- dist/0.6.4/fat.compact.js | 26 -- dist/0.6.4/fat.custom.42867.js | 22 - dist/0.6.4/fat.light.js | 14 - dist/0.6.4/fat.min.js | 38 -- dist/0.6.5/fat.compact.js | 26 -- dist/0.6.5/fat.custom.42867.js | 21 - dist/0.6.5/fat.light.js | 14 - dist/0.6.5/fat.min.js | 38 -- dist/latest/fat.compact.js | 26 -- dist/latest/fat.custom.42867.js | 21 - dist/latest/fat.light.js | 14 - dist/latest/fat.min.js | 38 -- docs/fat.custom.6eb25.js | 24 + docs/index.html | 2 +- docs/main.js | 186 ++++---- fat.compact.js | 40 +- fat.js | 668 +++++++++++++++------------- fat.light.js | 16 +- fat.min.js | 64 +-- package-lock.json | 40 +- package.json | 7 +- test/concurrency.html | 14 +- test/control.html | 19 +- test/{effects.html => presets.html} | 14 +- test/sequence.html | 5 +- test/transform.html | 9 +- test/update.html | 4 +- 29 files changed, 713 insertions(+), 830 deletions(-) delete mode 100644 dist/0.6.4/fat.compact.js delete mode 100644 dist/0.6.4/fat.custom.42867.js delete mode 100644 dist/0.6.4/fat.light.js delete mode 100644 dist/0.6.4/fat.min.js delete mode 100644 dist/0.6.5/fat.compact.js delete mode 100644 dist/0.6.5/fat.custom.42867.js delete mode 100644 dist/0.6.5/fat.light.js delete mode 100644 dist/0.6.5/fat.min.js delete mode 100644 dist/latest/fat.compact.js delete mode 100644 dist/latest/fat.custom.42867.js delete mode 100644 dist/latest/fat.light.js delete mode 100644 dist/latest/fat.min.js create mode 100644 docs/fat.custom.6eb25.js rename test/{effects.html => presets.html} (72%) diff --git a/README.md b/README.md index 46023db..8dc71d0 100644 --- a/README.md +++ b/README.md @@ -229,7 +229,7 @@ __"Animate" (2000 Bouncing Balls)__ 1 FAT - 0.6.5 + 0.6.6 1.9 kb 0.85 Mb 0.15 Mb @@ -428,7 +428,7 @@ __"Transforms" (2000 Bouncing Balls)__ 1 FAT - 0.6.5 + 0.6.6 91960 46.1 @@ -528,7 +528,7 @@ __"Colors" (2000 Flashing Balls)__ 1 FAT - 0.6.5 + 0.6.6 113950 57 @@ -715,6 +715,7 @@ Global methods / Scene methods: Control methods: - Scene.__set__(selector | elements, styles, force?) - Scene.__set__(selector | elements, style, value, force?) +- Scene.__remove__(selector | elements, styles) - Scene.__pause__(boolean: toggle) - Scene.__reverse__(boolean: toggle) - Scene.__start__(boolean: toggle) @@ -737,7 +738,7 @@ Control methods: Description - play + start Boolean true Enable/Disable autoplay when an animation call was performed @@ -914,7 +915,7 @@ Fat.animate("#mydiv", { top: "100px" }, function(){ ``` ```js -Fat.animate("#mydiv", "slideIn", function(){ +Fat.animate("#mydiv", "slideInTop", function(){ // done }); ``` @@ -1334,13 +1335,13 @@ Fat.animate("#mydiv", "fadeOut"); Combine multiple presets (ordered): ```js -Fat.animate("#mydiv", "fadeOut zoomOut rollOut"); +Fat.animate("#mydiv", "fadeOut zoomOut rollOutRight"); ``` Also usable with sequences: ```js -Fat.animate("#mydiv", ["slideUp", "zoomIn"]); +Fat.animate("#mydiv", ["slideInTop", "zoomIn"]); ``` Define custom preset: @@ -1358,13 +1359,13 @@ Fat.animate("#mydiv", "fade-out-down"); __Builtin Presets:__ - fadeIn, fadeOut, fadeToggle -- slideUp, slideDown, slideIn - slideInLeft, slideOutLeft, slideToggleLeft - slideInRight, slideOutRight, slideToggleRight - slideInTop, slideOutTop, slideToggleTop - slideInBottom, slideOutBottom, slideToggleBottom - zoomIn, zoomOut, zoomToggle -- rollIn, rollOut, rollToggle +- rollOutRight (clockwise), rollInRight, rollToggleRight +- rollOutLeft (opposite), rollInLeft, rollToggleLeft - blurIn, blurOut, blurToggle - scrollUp, scrollDown, scrollLeft, scrollRight @@ -1431,10 +1432,33 @@ scene_1.destroy(); ## Controls -Update current animation styles: +> _Fat_ internally points to default global scene, so you can use all scene methods on _Fat_ accordingly. + +Update single style: ```js -scene.set("#mydiv", { left: "0%" }); +scene.set("#mydiv", "left", "0%"); +``` + +Update multiple styles: +```js +scene.set("#mydiv", { top: 0, left: 0 }); +``` + +Remove all animations from an object: + +```js +scene.remove("#mydiv"); +``` + +Remove a specific animation from an object: +```js +scene.remove("#mydiv", "left"); +``` + +Remove a list of specific animations from an object: +```js +scene.remove("#mydiv", ["top", "left"]); ``` Pause a scene: @@ -1444,7 +1468,7 @@ scene.pause(); ``` alternatively: - + ```js scene.start(false); ``` @@ -1506,6 +1530,49 @@ scene.shift(2000); // current + 2000 ms scene.shift(-500); // current - 500 ms ``` +__Looping Sequences & Reversed Direction__ + +When looping sequences and also have reversed animation direction (e.g. by setting speed < 0) you have to pass a from-to declaration pair for each style, otherwise the from-value gets lost when looping back from reversed direction. +```js +var scene = Fat.animate(element, [{ + left: { from: "0%", to: "50%" } +},{ + left: { from: "50%", to: "0%" } +}],{ + loop: -1 +}); + +scene.reverse(); +``` + +alternatively use from-to-unit shorthand: + +```js +var scene = Fat.animate(element, [{ + left: [0, 50, "%"] +},{ + left: [50, 0, "%"] +}],{ + loop: -1 +}); + +scene.reverse(); +``` + +alternatively use relative toggle: + +```js +var scene = Fat.animate(element, [{ + left: "!=50%" +},{ + left: "!=0%" +}],{ + loop: -1 +}); + +scene.reverse(); +``` + ## Scroll @@ -1608,13 +1675,23 @@ Fat.animate(element, { top: "100%" }, function(){ }); ``` -This is called animation loop, the callback creates a new animation on the __same__ objects style property. Technically the callback executes during the last frame of the first animation. So there is still running an animation on this property and will be inherited by the animation within the callback. During the callback manual changes on the __same__ style property which is going to be animated will be shadowed by the animation loop inheritance. +This is called animation loop, the callback creates a new animation on the __same__ objects style property. Technically the callback executes during the last frame of the first animation. So there is still running an animation on this property and will be inherited by the next animation loop. + +> During the callback, external changes on the __same__ style property which is going to be animated will be shadowed by the animation loop inheritance. + +When the style change did not happened externally (e.g. by a different tool) use _set_ method to get best performance: +```js +Fat.animate(element, { top: "100%" }, function(){ + + Fat.set(this, "top", 0).animate(this, { top: "100%" }); +}); +``` -To solve this situation you have to add the _init_ option: +Otherwise, to solve this situation you have to add the _init_ option: ```js Fat.animate(element, { top: "100%" }, function(){ - this.style.top = 0; + this.style.top = 0; // external change somewhere happens Fat.animate(this, { top: "100%" }, { init: true }); }); diff --git a/compile.js b/compile.js index 70261fa..20b8390 100644 --- a/compile.js +++ b/compile.js @@ -1,11 +1,11 @@ var child_process = require("child_process"); var fs = require("fs"); -var { version } = require("./package.json"); +//var { version } = require("./package.json"); console.log("Start build ....."); fs.existsSync("log") || fs.mkdirSync("log"); -fs.existsSync("dist") || fs.mkdirSync("dist"); +//fs.existsSync("dist") || fs.mkdirSync("dist"); var flag_str = ""; @@ -72,6 +72,13 @@ var parameter = (function(opt){ //formatting: "PRETTY_PRINT" }); +var release = options['RELEASE']; + +if(release === "demo"){ + + options['RELEASE'] = "custom"; +} + var custom = (!options['RELEASE'] || (options['RELEASE'] === "custom")); if(custom){ @@ -85,14 +92,13 @@ exec("java -jar node_modules/google-closure-compiler-java/compiler.jar" + parame console.log("Build Complete: " + filename); - fs.existsSync("dist/" + version) || fs.mkdirSync("dist/" + version); - fs.existsSync("dist/latest") || fs.mkdirSync("dist/latest"); - - fs.copyFileSync(filename, "dist/" + version + "/" + filename); - fs.copyFileSync(filename, "dist/latest/" + filename); + if(release === "demo"){ - if(custom){ + //fs.existsSync("dist/") || fs.mkdirSync("dist/"); + //fs.existsSync("dist/latest") || fs.mkdirSync("dist/latest"); + fs.copyFileSync(filename, "docs/" + filename); + //fs.copyFileSync(filename, "dist/latest/" + filename); fs.unlinkSync(filename); } }); @@ -109,9 +115,11 @@ function hashCode(str) { for(i = 0; i < str.length; i++){ chr = str.charCodeAt(i); - hash = ((hash << 5) - hash) + chr; + hash = (hash << 5) - hash + chr; } + hash = Math.abs(hash) >> 0; + return hash.toString(16).substring(0, 5); } diff --git a/dist/0.6.4/fat.compact.js b/dist/0.6.4/fat.compact.js deleted file mode 100644 index 16b812f..0000000 --- a/dist/0.6.4/fat.compact.js +++ /dev/null @@ -1,26 +0,0 @@ -/* - FAT v0.6.4 - Copyright 2019 Nextapps GmbH - Author: Thomas Wilkerling - Released under the Apache 2.0 Licence - https://github.com/nextapps-de/fat -*/ -'use strict';(function(z,E,x){var p;(p=x.define)&&p.amd?p([],function(){return E}):(p=x.modules)?p[z.toLowerCase()]=E:"object"===typeof exports?module.exports=E:x[z]=E})("Fat",function(){function z(a,b,c,d,e,g,f,h,m,X,k,Q,r,p,D,t,l,q,n){this.c=a;this.u=a.D;this.style=b;this.J=b.replace(/([A-Z])/g,"-$1").toLowerCase();this.b=d;this.f=e;this.m=d;this.C=g;this.i=f;this.duration=h;this.g=m;this.ease=L(m);this.time=0;this.s=X;this.o=k;this.I=c;this.a=Q;this.H=q?"%"===g||-1!==b.indexOf("A"):"px"!==g;q&& -(this.l=q,this.B=n);t&&(this.transform=t)}function E(a,b,c){var d=c||-1,e;if("#"===a[0])if(a=a.toLowerCase(),4===a.length){c=y[(e=a[1])+e];var g=y[(e=a[2])+e];var f=y[(e=a[3])+e]}else c=y[a[1]+a[2]],g=y[a[3]+a[4]],f=y[a[5]+a[6]];else e=M(a,"(",")").split(","),c=parseInt(e[0],10),g=parseInt(e[1],10),f=parseInt(e[2],10),3f?f*(1+g):f+g-f*g,e=2*f-a,g=x(e,a,c+1/3),f=x(e,a,c),a=x(e,a,c-1/3)),c=255*g+.5>>0,g=255*f+.5>>0,f=255*a+.5>>0);a= -{};a[b+"R"]=c;a[b+"G"]=g;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function x(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function p(){this.id=++Y;this.stack=[];this.A=Z.bind(this);this.exec=this.j=0;this.h=[]}function L(a){if(K(a))if(a){var b;if(!(b=R[a])){if(b=N[a]||(N[a]=P.apply(P,aa[a]))){for(var c=new (Int16Array||Array)(w),d=0;d>0;b=c}else b=[];b=R[a]=b}a=b}else a=[];else a=null;return a}function Z(a){var b=this.stack.length,c= -this.h.length;if(b||c){this.exec=requestAnimationFrame(this.A);this.j||(this.j=a);var d=!1;if(b)for(var e=0;e=(e.w-=a-this.j))e(a)||(this.h[b]=null);this.j=a;d||this.destroy()}}function K(a){return"string"===typeof a}function G(a){return"undefined"===typeof a}function S(a,b,c){b=v(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function H(a, -b,c){if("custom"===b)return c||0;var d=a.D||(a.D=a.style);return(c=G(c)?d[b]:c)?c:(a.F||(a.F=getComputedStyle(a)))[b]}function T(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"===b?1:0,d&&(d[d.length]=b),c;-1!==b.indexOf("matrix")&&(b=M(b,"(",")").split(","),b=a+"("+(parseFloat(b[ba[a]])||"")+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,g=0;gd;++d){var e=this.o(b,this.a,this.b);if(0===e)break;b-=(this.i(b,this.a,this.b)-a)/e}return b};a.prototype.u=function(a){return 0=== -a||1===a||this.a===this.l&&this.b===this.m?a:this.i(this.s(a),this.l,this.m)};return function(b,c,d,e){b=new a(b,c,d,e);return b.u.bind(b)}}();r=z.prototype;r.animate=function(a,b){var c=this.b===this.f||!1,d=this.c;a=this.time+=a-(b||a);b=a>=this.duration;if(!c)if(b)var e=this.f;else this.ease?e=this.ease.length?(this.f-this.b)*this.ease[w/this.duration*a+.5>>0]/1E4:(this.f-this.b)*a/this.duration:e=1===this.g.length?this.g(a/this.duration):this.g(a,this.b,this.f,this.duration),e=this.b+e,e=this.H? -(e*w+.5>>0)/w:e+.5>>0;var g=this.style;c||this.m===e||(this.m=e,this.transform?d.v[g]=e+this.C:this.l?d["_"+this.B][g]=e:(e+=this.C,"custom"!==g&&this.O(e)));g===this.transform?e=this.K():g===this.l&&(e=this.P(this.B));this.o&&this.o.call(d,b?1:a/this.duration,e);b&&(this.time=-1,this.s&&this.s.call(d))};r.N=function(a,b){if(-1===this.time)this.c[this.I]=null;else{var c=b-a.j;if(this.a)if("view"===this.a)if(c=this.c.getBoundingClientRect(),0<=c.top&&c.bottom<=window.innerHeight)this.a=0;else return!0; -else{if(0<(this.a-=c))return!0;this.a=0}this.animate(b,a.j);return!0}};r.O=function(a){O(this.u,this.J,a,this.i)};var V=function(a){function b(b,d){a[b]=-d;a[b+"R"]=d;a[b+"G"]=d;a[b+"B"]=d;a[b+"A"]=d}b("color",1);b("backgroundColor",2);b("borderColor",3);return a}({}),W=function(a){function b(b,d){a[b]=d;a[b+"X"]=d;a[b+"Y"]=d;a[b+"Z"]=d;a[b+"3d"]=d}b("translate",1);b("scale",2);b("rotate",3);b("skew",4);return a}({}),ba={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var y={};var I= -Array(255);for(var k=0;256>k;k++){var C=k.toString(16);C.length%2&&(C="0"+C);y[C]=k;I[k]=C}r.K=function(){for(var a=this.c.v,b=this.u,c=this.c.G,d="",e=0,g=c.length;e>0,g=2.55*g+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));O(c,d,1===a||G(a)?"#"+I[e]+I[g]+I[f]:"rgba("+e+","+g+","+f+","+a+")",this.i);return b};k=p.prototype;k.M=function(a,b,c,d,e,g,f,h,m,k,F,Q,r,p,D){var t=""+(r?ca:p?da:H)(a,b,d,D);"auto"===t&&(t="0");d=v(t);if(K(e)){var l=e;e="="===e[1]?S(d,l=e.substring(2),e[0]):v(e);g||(g=l.substring((""+e).length))}g||(g=t.substring((""+d).length)|| -"");b=new z(a,b,c,d,e,g,f,h,m,k,F,Q,!1,!1,!1,r,void 0,p,D);this.stack[this.stack.length]=b;a[c]=b};k.animate=function(a,b,c,d){if(a&&b){c?"function"===typeof c&&(d=c,c={}):c={};K(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=c.delay,g=c.duration||400,f=c.ease;if(f){var h;if(K(f)){if(h=M(f,"bezier(",")")){h=h.replace(/ /g,"");var m=h.split(",")}}else f.constructor===Array&&(h=f.join(","),m=f);h&&(N[h]||(N[h]=P.apply(P,m)),f=h)}h=f||"";m=Object.keys(b);f=m.length;d=d||c.callback||!1;var k= -c.step,r=c.force;c=c.init;for(var p,x,y,D,t=f;0q){n=b[l];"object"===typeof n&&(n=n.to);var A=E(n,l);m[f++]=n=l+"R";b[n]=A[n];m[f++]=n=l+"G";b[n]=A[n];m[f++]=n=l+"B";b[n]=A[n];G(A=A[n=l+"A"])?l+="B":(m[f++]=n,b[n]=A,l=n);q*=-1}x||1!==q?y||2!==q?D||3!==q||(D=l):y=l:x=l}}for(t=0;tB)continue;1===B?(q=x,v="color"):2===B?(n=y,v="backgroundColor"):3===B&&(A=D,v="borderColor")}u.constructor===Array&&(z=u[0],C=u[2],u=u[1]);B=t===f-1;for(var I="_fat_"+w+this.id,H=0,O=a.length;Hf?f*(1+g):f+g-f*g,e=2*f-a,g=v(e,a,c+1/3),f=v(e,a,c),a=v(e,a,c-1/3)),c=255*g+.5>>0,g=255*f+.5>>0,f=255*a+.5>> -0);a={};a[b+"R"]=c;a[b+"G"]=g;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function v(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function p(){this.id=++T;this.stack=[];this.D=U.bind(this);this.exec=this.g=0}function U(a){var b=this.stack.length;if(b){this.exec=requestAnimationFrame(this.D);this.g||(this.g=a);var c=!1;if(b)for(var d=0;d=this.duration;if(!c)if(b)var e= -this.f;else this.ease?e=this.ease.length?(this.f-this.b)*this.ease[N/this.duration*a+.5>>0]/1E4:(this.f-this.b)*a/this.duration:e=1===this.h.length?this.h(a/this.duration):this.h(a,this.b,this.f,this.duration),e=this.b+e,e=this.F?(e*N+.5>>0)/N:e+.5>>0;var g=this.style;c||this.m===e||(this.m=e,this.transform?d.i[g]=e+this.w:this.l?d["_"+this.v][g]=e:(e+=this.w,"custom"!==g&&this.M(e)));g===this.transform?e=this.I():g===this.l&&(e=this.N(this.v));this.o&&this.o.call(d,b?1:a/this.duration,e);b&&(this.time= --1,this.s&&this.s.call(d))};r.L=function(a,b){if(-1===this.time)this.c[this.G]=null;else{var c=b-a.g;if(this.a)if("view"===this.a)if(c=this.c.getBoundingClientRect(),0<=c.top&&c.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=c))return!0;this.a=0}this.animate(b,a.g);return!0}};r.M=function(a){K(this.u,this.H,a,this.j)};var Q=function(a){function b(b,d){a[b]=-d;a[b+"R"]=d;a[b+"G"]=d;a[b+"B"]=d;a[b+"A"]=d}b("color",1);b("backgroundColor",2);b("borderColor",3);return a}({}),R=function(a){function b(b, -d){a[b]=d;a[b+"X"]=d;a[b+"Y"]=d;a[b+"Z"]=d;a[b+"3d"]=d}b("translate",1);b("scale",2);b("rotate",3);b("skew",4);return a}({}),V={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var x={};var F=Array(255);for(var m=0;256>m;m++){var E=m.toString(16);E.length%2&&(E="0"+E);x[E]=m;F[m]=E}r.I=function(){for(var a=this.c.i,b=this.u,c=this.c.C,d="",e=0,g=c.length;e>0,g=2.55*g+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));K(c,d,1===a||H(a)?"#"+F[e]+F[g]+F[f]:"rgba("+e+","+g+","+f+","+a+")",this.j);return b};m=p.prototype;m.K=function(a, -b,c,d,e,g,f,h,n,w,D,m,r,p,A){var t=""+(r?W:p?X:M)(a,b,d,A);"auto"===t&&(t="0");d=y(t);if(J(e)){var k=e;e=y(e);g||(g=k.substring((""+e).length))}g||(g=t.substring((""+d).length)||"");b=new z(a,b,c,d,e,g,f,h,n,w,D,m,!1,!1,!1,r,void 0,p,A);this.stack[this.stack.length]=b;a[c]=b};m.animate=function(a,b,c,d){if(a&&b){c?"function"===typeof c&&(d=c,c={}):c={};J(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=c.delay,g=c.duration||400,f=c.ease||"",h=Object.keys(b),n=h.length;d=d||c.callback||!1; -var w=c.step,r=c.force;c=c.init;for(var m,p,v,x,t=n;0q){l=b[k];"object"===typeof l&&(l=l.to);var B=A(l,k);h[n++]=l=k+"R";b[l]=B[l];h[n++]=l=k+"G";b[l]=B[l];h[n++]=l=k+"B";b[l]=B[l];H(B=B[l=k+"A"])?k+="B":(h[n++]=l,b[l]=B,k=l);q*=-1}p||1!==q?v||2!==q?x||3!==q||(x=k):v=k:p=k}}for(t=0;tC)continue;1===C?(q=p,y="color"):2===C?(l=v,y="backgroundColor"):3===C&&(B=x,y="borderColor")}u.constructor===Array&&(z=u[0],E=u[2],u=u[1]);C=t===n-1;for(var G="_fat_"+L+this.id,F=0,M=a.length;F=this.duration;if(!b)if(c)var d=this.c; -else this.ease?d=this.ease.length?(this.c-this.b)*this.ease[x/this.duration*a+.5>>0]/1E4:(this.c-this.b)*a/this.duration:d=1===this.g.length?this.g(a/this.duration):this.g(a,this.b,this.c,this.duration),d=this.b+d,d=this.D?(d*x+.5>>0)/x:d+.5>>0;var h=this.style;b||this.h===d||(this.h=d,d+=this.H,"custom"!==h&&this.A(d));this.i&&this.i.call(e,c?1:a/this.duration,d);c&&(this.time=-1,this.j&&this.j.call(e))};u.C=function(a,c){if(-1===this.time)this.l[this.F]=null;else{var b=c-a.f;if(this.a)if("view"=== -this.a)if(b=this.l.getBoundingClientRect(),0<=b.top&&b.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=b))return!0;this.a=0}this.animate(c,a.f);return!0}};u.A=function(a){var c=this.B,b=this.G;this.s?c.setProperty(b,a,"important"):c.setProperty(b,a)};var r=f.prototype;r.w=function(a,c,b,e,d,h,f,y,t,v,w,p){if("custom"===c)e=e||0;else{var n=a.m||(a.m=a.style);e=(e="undefined"===typeof e?n[c]:e)?e:(a.o||(a.o=getComputedStyle(a)))[c]}n=""+e;"auto"===n&&(n="0");e=q(n);if(m(d)){var g= -d;d=q(d);h||(h=g.substring((""+d).length))}h||(h=n.substring((""+e).length)||"");c=new k(a,c,b,e,d,h,f,y,t,v,w,p,!1,!1,!1);this.stack[this.stack.length]=c;a[b]=c};r.animate=function(a,c,b,e){if(a&&c){b?"function"===typeof b&&(e=b,b={}):b={};m(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var d=b.delay,h=b.duration||400,f=b.ease||"",y=Object.keys(c),t=y.length;e=e||b.callback||!1;var v=b.step,w=b.force;b=b.init;for(var p=0;pf?f*(1+h):f+h-f*h,e=2*f-a,h=B(e,a,c+1/3),f=B(e,a,c),a=B(e,a,c-1/3)),c=255*h+.5>>0,h=255*f+ -.5>>0,f=255*a+.5>>0);a={};a[b+"R"]=c;a[b+"G"]=h;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function B(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function z(a){this.id=++ka;this.stack=[];this.H=la.bind(this);this.exec=this.g=0;this.s=[];this.R=a&&a.fps;this.G=!a||!1!==a.play;this.direction=!0;this.ratio=1}function V(a){M(a)?a=document.querySelectorAll(a):a.length||(a=[a]);return a}function ba(a){if(M(a))if(a){var b;if(!(b=ca[a])){if(b=O[a]||(O[a]=W.apply(W,ma[a]))){for(var c= -new (Int16Array||Array)(E),d=0;d>0;b=c}else b=[];b=ca[a]=b}a=b}else a=[];else a=null;return a}function la(a){var b=this.stack.length,c=this.s.length;if(b||c)if(this.exec=requestAnimationFrame(this.H),this.g||(this.g=a),!(this.R&&a-this.g+1<1E3/this.R)){var d=!1;if(b){Z&&(T?T===this.id&&(X={}):(X={},T=this.id));for(var e=0;e=(e.F-=a-this.g))e(a)||(this.s[b]= -null);this.g=a;d||this.destroy()}}function M(a){return"string"===typeof a}function v(a){return"undefined"===typeof a}function da(a,b,c){b=D(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function J(a,b,c){if("scrollTop"===b||"scrollLeft"===b)return v(c)?a[b]:c;if("custom"===b)return c||0;var d=a.v||(a.v=a.style);return(c=v(c)?d[b]:c)?c:(a.N||(a.N=getComputedStyle(a)))[b]}function ea(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"=== -b?1:0,d&&(d[d.length]=b),c;-1!==b.indexOf("matrix")&&(b=I(b,"(",")").split(","),b=a+"("+(parseFloat(b[na[a]])||"")+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,h=0;h(""+b).length)return c[a]= -b,d&&(d[d.length]=a),c;a=b.split(" ");b={};for(var e=0,h=0;h>0}e[h]=f}return e}function P(a){return a.replace(/([A-Z])/g,"-$1").toLowerCase()}function A(a,b,c,d){d?a.setProperty(b,c,"important"):a.setProperty(b,c)}var E=Math.max(screen.width,screen.height),ca={},O={},X,p=function(){var a=getComputedStyle(document.body);if(v(a.transform))for(var b=["webkit","moz","ms","o"],c=0,d;cd;++d){var e=this.w(b,this.a,this.b);if(0===e)break;b-=(this.j(b,this.a,this.b)-a)/e}return b};a.prototype.B=function(a){return 0===a||1===a||this.a===this.m&&this.b===this.o?a:this.j(this.A(a),this.m,this.o)};return function(b,c,d,e){b=new a(b,c,d,e);return b.B.bind(b)}}(),q={fadeIn:{opacity:1},fadeOut:{opacity:0},fadeToggle:{opacity:"!=1"},slideInLeft:{translateX:0},slideOutLeft:{translateX:"-100%"}, -slideToggleLeft:{translateX:"!=-100%"},slideOutRight:{translateX:"100%"},slideToggleRight:{translateX:"!=100%"},slideInTop:{translateY:0},slideOutTop:{translateY:"-100%"},slideToggleTop:{translateY:"!=-100%"},slideOutBottom:{translateY:"100%"},slideToggleBottom:{translateY:"!=100%"},zoomIn:{scaleX:1,scaleY:1},zoomOut:{scaleX:0,scaleY:0},zoomToggle:{scaleX:"!=1",scaleY:"!=1"}};q.slideUp=q.slideOutTop;q.slideDown=q.slideOutBottom;q.slideIn=q.slideInBottom=q.slideInTop;q.slideInRight=q.slideInLeft;q.rollIn= -{rotateZ:"0deg"};q.rollOut={rotateZ:"720deg"};q.rollToggle={rotateZ:"!=720deg"};q.blurIn={blur:"0em"};q.blurOut={blur:"5em"};q.blurToggle={blur:"!=5em"};q.scrollUp={scrollTop:0};q.scrollDown={scrollTop:"100%"};q.scrollLeft={scrollLeft:0};q.scrollRight={scrollLeft:"100%"};p=N.prototype;p.animate=function(a,b,c,d){var e=this.L,h=this.b===this.i||e&&X[e],f=this.a;d=c*(d?1:-1);(c=0>d)&&0===this.time&&(this.time=this.duration);a=this.time+=(a-(b||a))*d;b=c?0>=a:a>=this.duration;if(!h)if(e&&(X[e]=1),b)var g= -c?this.b:this.i;else this.ease?g=this.ease.length?(this.i-this.b)*this.ease[E/this.duration*a+.5>>0]/1E4:(this.i-this.b)*a/this.duration:g=1===this.h.length?this.h(a/this.duration):this.h(a,this.b,this.i,this.duration),g=this.b+g,g=this.W?(g*E+.5>>0)/E:g+.5>>0;e=this.style;h||this.m===g||(this.m=g,this.transform?f.D[e]=g+this.j:this.filter?f.C[e]=g+this.j:this.I?f["_"+this.K][e]=g:(g+=this.j,"custom"!==e&&this.T(e,g)));e===this.transform?g=this.Z():e===this.filter?g=this.V():e===this.I&&(g=this.U(this.K)); -this.w&&this.w.call(f,b?c?0:1:a/this.duration,g);if(b&&(this.time=-1,this.o)){if(h=f[this.J])if(this.S--){if(g=c?--f[this.B]:++f[this.B],0>g||g>=h.length)if(f[this.B]=g=c?h.length-1:0,gk;k++){var R=k.toString(16); -R.length%2&&(R="0"+R);H[R]=k;Y[k]=R}p.Z=function(){for(var a=this.a.D,b=this.A,c=this.a.O,d="",e=0,h=c.length;e>0,h=2.55*h+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));A(c,d,1===a||v(a)?"#"+Y[e]+Y[h]+Y[f]:"rgba("+e+","+h+","+f+","+a+")",this.f);return b};k=z.prototype;k.aa=function(a,b,c,d,e,h,f,g,m,r,l,k,q,p,w,y,L,v,z){var C=""+(y?oa:L?pa:v?qa:J)(a,b,d,z);"auto"=== -C&&(C="0");d=D(C);if(M(e)){var n=e;e="="===e[1]?da(d,n=e.substring(2),e[0]):D(e);h||(h=n.substring((""+e).length));"%"===h&&("scrollTop"===b?(e*=(a.scrollHeight-a.clientHeight)/100,h=""):"scrollLeft"===b&&(e*=(a.scrollWidth-a.clientWidth)/100,h=""))}h||(h=C.substring((""+d).length)||"");b=new N(a,b,c,d,e,h,f,g,m,r,l,k,q,p,w,y,L,v,z);this.stack[this.stack.length]=b;p||(a[c]=b)};k.animate=function(a,b,c,d){if(a&&b){if(b.constructor===Array){var e=b;b=b[0]}if(M(b))if(-1===b.indexOf(" "))b=q[b];else{b= -b.split(" ");for(var h={},f=0,g=b.length;ft){u=b[n];"object"===typeof u&&(u=u.to);u=S(u,n);var x=void 0,B=void 0;m[r++]=x=n+"R";b[x]= -u[x];m[r++]=x=n+"G";b[x]=u[x];m[r++]=x=n+"B";b[x]=u[x];v(B=u[x=n+"A"])?n+="B":(m[r++]=x,b[x]=B,n=x);t*=-1}L||1!==t?C||2!==t?D||3!==t||(D=n):C=n:L=n}}A="_seq_"+this.id;for(n=0;nK)continue;1===K?(B=L,E="color"):2===K?(H=C,E="backgroundColor"): -3===K&&(I=D,E="borderColor")}if("scroll"===F)u=void 0,m[r++]=u="scrollLeft",b[u]=t[0],m[r++]=u="scrollTop",b[u]=t[1];else{t.constructor===Array&&(J=t[0],N=t[2],t=t[1]);K=n===r-1;for(var P="_fat_"+F+this.id,O=0,T=a.length;Of?f*(1+h):f+h-f*h,e=2*f-a,h=y(e,a,c+1/3),f=y(e,a,c),a=y(e,a,c-1/3)),c=255*h+.5>>0,h=255*f+.5>>0,f=255*a+.5>>0);a= -{};a[b+"R"]=c;a[b+"G"]=h;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function y(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function p(){this.id=++Y;this.stack=[];this.A=Z.bind(this);this.exec=this.g=0;this.c=[]}function L(a){if(K(a))if(a){var b;if(!(b=R[a])){if(b=N[a]||(N[a]=P.apply(P,aa[a]))){for(var c=new (Int16Array||Array)(x),d=0;d>0;b=c}else b=[];b=R[a]=b}a=b}else a=[];else a=null;return a}function Z(a){var b=this.stack.length,c= -this.c.length;if(b||c){this.exec=requestAnimationFrame(this.A);this.g||(this.g=a);var d=!1;if(b)for(var e=0;e=(e.w-=a-this.g))e(a)||(this.c[b]=null);this.g=a;d||this.destroy()}}function K(a){return"string"===typeof a}function G(a){return"undefined"===typeof a}function S(a,b,c){b=w(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function H(a, -b,c){if("custom"===b)return c||0;var d=a.B||(a.B=a.style);return(c=G(c)?d[b]:c)?c:(a.C||(a.C=getComputedStyle(a)))[b]}function T(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"===b?1:0,d&&(d[d.length]=b),c;-1!==b.indexOf("matrix")&&(b=M(b,"(",")").split(","),b=a+"("+(parseFloat(b[ba[a]])||"")+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,h=0;hd;++d){var e=this.o(b,this.a,this.b);if(0===e)break;b-=(this.j(b,this.a,this.b)-a)/e}return b};a.prototype.u=function(a){return 0=== -a||1===a||this.a===this.l&&this.b===this.m?a:this.j(this.s(a),this.l,this.m)};return function(b,c,d,e){b=new a(b,c,d,e);return b.u.bind(b)}}();r=A.prototype;r.animate=function(a,b){var c=this.F,d=this.G,e=this.duration,h=this.b,f=c===d||!1;a=this.time+=a-(b||a);b=a>=e;if(!f)if(b)var g=d;else{var k;if(k=this.ease)g=k.length?(d-c)*k[x/e*a+.5>>0]/1E4:(d-c)*a/e;else if(k=this.o)g=1===k.length?k(a/e):k(a,c,d,e);g=c+g;g=this.H?(g*x+.5>>0)/x:g+.5>>0}c=this.style;f||this.i===g||(this.i=g,this.transform?h.v[c]= -g+this.u:this.h?h["_"+this.s][c]=g:"custom"!==c&&this.O(g+=this.u));c===this.transform?g=this.K():c===this.h&&(g=this.P(this.s));this.j&&this.j.call(h,b?1:a/e,g);b&&(this.time=-1,this.l&&this.l.call(h))};r.N=function(a,b){if(-1===this.time)this.b[this.I]=null;else{var c=b-a.g;if(this.a)if("view"===this.a)if(c=this.b.getBoundingClientRect(),0<=c.top&&c.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=c))return!0;this.a=0}this.animate(b,a.g);return!0}};r.O=function(a){O(this.m,this.J, -a,this.f)};var V=function(a){function b(b,d){a[b]=-d;a[b+"R"]=d;a[b+"G"]=d;a[b+"B"]=d;a[b+"A"]=d}b("color",1);b("backgroundColor",2);b("borderColor",3);return a}({}),W=function(a){function b(b,d){a[b]=d;a[b+"X"]=d;a[b+"Y"]=d;a[b+"Z"]=d;a[b+"3d"]=d}b("translate",1);b("scale",2);b("rotate",3);b("skew",4);return a}({}),ba={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var z={};var I=Array(255);for(var l=0;256>l;l++){var C=l.toString(16);C.length%2&&(C="0"+C);z[C]=l;I[l]=C}r.K=function(){for(var a= -this.b.v,b=this.m,c=this.b.D,d="",e=0,h=c.length;e>0,h=2.55*h+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));O(c,d,1===a||G(a)?"#"+I[e]+I[h]+I[f]:"rgba("+e+","+h+","+f+","+a+")",this.f);return b};l=p.prototype;l.M=function(a,b,c,d,e,h,f,g,k,l,F,Q,r,p,D){var t=""+(r?ca:p?da:H)(a,b,d,D);"auto"===t&&(t="0");d=w(t);if(K(e)){var m=e;e="="===e[1]?S(d,m=e.substring(2),e[0]):w(e);h||(h=m.substring((""+e).length))}h||(h=t.substring((""+d).length)||"");b=new A(a,b,c,d,e,h,f,g,k,l,F,Q,!1,!1,!1,r,void 0,p,D);this.stack[this.stack.length]=b;a[c]=b};l.animate= -function(a,b,c,d){c?"function"===typeof c&&(d=c,c={}):c={};K(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=c.delay,h=c.duration||400,f=c.ease;if(f){var g;if(K(f)){if(g=M(f,"bezier(",")")){g=g.replace(/ /g,"");var k=g.split(",")}}else f.constructor===Array&&(g=f.join(","),k=f);g&&(N[g]||(N[g]=P.apply(P,k)),f=g)}g=f||"";k=Object.keys(b);f=k.length;d=d||c.callback||!1;var l=c.step,r=c.force;c=c.init;for(var p,y,z,D,t=f;0q&&(n=b[m],"object"===typeof n&&(n=n.to),v=E(n,m),k[f++]=n=m+"R",b[n]=v[n],k[f++]=n=m+"G",b[n]=v[n],k[f++]=n=m+"B",b[n]=v[n],G(v=v[n=m+"A"])?m+="B":(k[f++]=n,b[n]=v,m=n),q*=-1),y||1!==q?z||2!==q?D||3!==q||(D=m):z=m:y=m}for(t=0;tB)continue;1===B?(q=y,w="color"):2===B?(n=z,w="backgroundColor"):3===B&&(v=D,w="borderColor")}u.constructor===Array&&(A=u[0],C=u[2],u=u[1]);B=t===f-1;for(var I="_fat_"+x+this.id,H=0,O=a.length;Hf?f*(1+h):f+h-f*h,e=2*f-a,h=w(e,a,c+1/3),f=w(e,a,c),a=w(e,a,c-1/3)),c=255*h+.5>>0,h=255*f+.5>>0,f=255*a+.5>> -0);a={};a[b+"R"]=c;a[b+"G"]=h;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function w(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function p(){this.id=++T;this.stack=[];this.B=U.bind(this);this.exec=this.c=0}function U(a){var b=this.stack.length;if(b){this.exec=requestAnimationFrame(this.B);this.c||(this.c=a);var c=!1;if(b)for(var d=0;d=e;if(!f)if(b)var g= -d;else{var k;if(k=this.ease)g=k.length?(d-c)*k[N/e*a+.5>>0]/1E4:(d-c)*a/e;else if(k=this.o)g=1===k.length?k(a/e):k(a,c,d,e);g=c+g;g=this.F?(g*N+.5>>0)/N:g+.5>>0}c=this.style;f||this.i===g||(this.i=g,this.transform?h.f[c]=g+this.u:this.h?h["_"+this.s][c]=g:"custom"!==c&&this.M(g+=this.u));c===this.transform?g=this.I():c===this.h&&(g=this.N(this.s));this.j&&this.j.call(h,b?1:a/e,g);b&&(this.time=-1,this.l&&this.l.call(h))};r.L=function(a,b){if(-1===this.time)this.b[this.G]=null;else{var c=b-a.c;if(this.a)if("view"=== -this.a)if(c=this.b.getBoundingClientRect(),0<=c.top&&c.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=c))return!0;this.a=0}this.animate(b,a.c);return!0}};r.M=function(a){K(this.m,this.H,a,this.g)};var Q=function(a){function b(c,b){a[c]=-b;a[c+"R"]=b;a[c+"G"]=b;a[c+"B"]=b;a[c+"A"]=b}b("color",1);b("backgroundColor",2);b("borderColor",3);return a}({}),R=function(a){function b(c,b){a[c]=b;a[c+"X"]=b;a[c+"Y"]=b;a[c+"Z"]=b;a[c+"3d"]=b}b("translate",1);b("scale",2);b("rotate",3);b("skew", -4);return a}({}),V={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var y={};var F=Array(255);for(var m=0;256>m;m++){var E=m.toString(16);E.length%2&&(E="0"+E);y[E]=m;F[m]=E}r.I=function(){for(var a=this.b.f,b=this.m,c=this.b.A,d="",e=0,h=c.length;e>0,h=2.55*h+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));K(c,d,1===a||H(a)?"#"+F[e]+F[h]+F[f]:"rgba("+e+","+h+","+f+","+a+")",this.g);return b};m=p.prototype;m.K=function(a,b,c,d,e,h,f,g,k,x,D,m,r,p,B){var t=""+(r?W:p?X:M)(a,b,d,B);"auto"===t&&(t="0");d=z(t);if(J(e)){var l=e;e= -z(e);h||(h=l.substring((""+e).length))}h||(h=t.substring((""+d).length)||"");b=new A(a,b,c,d,e,h,f,g,k,x,D,m,!1,!1,!1,r,void 0,p,B);this.stack[this.stack.length]=b;a[c]=b};m.animate=function(a,b,c,d){c?"function"===typeof c&&(d=c,c={}):c={};J(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=c.delay,h=c.duration||400,f=c.ease||"",g=Object.keys(b),k=g.length;d=d||c.callback||!1;var x=c.step,r=c.force;c=c.init;for(var m,p,w,y,t=k;0q&&(n=b[l],"object"===typeof n&&(n=n.to),v=B(n,l),g[k++]=n=l+"R",b[n]=v[n],g[k++]=n=l+"G",b[n]=v[n],g[k++]=n=l+"B",b[n]=v[n],H(v=v[n=l+"A"])?l+="B":(g[k++]=n,b[n]=v,l=n),q*=-1),p||1!==q?w||2!==q?y||3!==q||(y=l):w=l:p=l}for(t=0;tC)continue;1===C?(q=p,z="color"):2===C?(n=w,z="backgroundColor"):3===C&&(v=y,z="borderColor")}u.constructor===Array&&(A=u[0],E=u[2],u=u[1]);C=t===k-1;for(var G="_fat_"+L+this.id,F=0,M=a.length;F=e;if(!n)if(c)var f= -d;else{var l;if(l=this.ease)f=l.length?(d-b)*l[y/e*a+.5>>0]/1E4:(d-b)*a/e;else if(l=this.h)f=1===l.length?l(a/e):l(a,b,d,e);f=b+f;f=this.D?(f*y+.5>>0)/y:f+.5>>0}b=this.style;n||this.c===f||(this.c=f,"custom"!==b&&this.A(f+=this.H));this.f&&this.f.call(g,c?1:a/e,f);c&&(this.time=-1,this.g&&this.g.call(g))};w.C=function(a,c){if(-1===this.time)this.i[this.F]=null;else{var b=c-a.b;if(this.a)if("view"===this.a)if(b=this.i.getBoundingClientRect(),0<=b.top&&b.bottom<=window.innerHeight)this.a=0;else return!0; -else{if(0<(this.a-=b))return!0;this.a=0}this.animate(c,a.b);return!0}};w.A=function(a){var c=this.B,b=this.G;this.m?c.setProperty(b,a,"important"):c.setProperty(b,a)};var v=h.prototype;v.w=function(a,c,b,d,e,g,n,f,l,h,x,t){if("custom"===c)d=d||0;else{var q=a.j||(a.j=a.style);d=(d="undefined"===typeof d?q[c]:d)?d:(a.l||(a.l=getComputedStyle(a)))[c]}q=""+d;"auto"===q&&(q="0");d=u(q);if(m(e)){var k=e;e=u(e);g||(g=k.substring((""+e).length))}g||(g=q.substring((""+d).length)||"");c=new p(a,c,b,d,e,g,n, -f,l,h,x,t,!1,!1,!1);this.stack[this.stack.length]=c;a[b]=c};v.animate=function(a,c,b,d){b?"function"===typeof b&&(d=b,b={}):b={};m(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=b.delay,g=b.duration||400,n=b.ease||"",f=Object.keys(c),l=f.length;d=d||b.callback||!1;var h=b.step,x=b.force;b=b.init;for(var t=0;tf?f*(1+g):f+g-f*g,e=2*f-a,g=A(e,a,c+1/3),f=A(e,a,c),a=A(e,a,c-1/3)),c=255*g+.5>>0,g=255*f+ -.5>>0,f=255*a+.5>>0);a={};a[b+"R"]=c;a[b+"G"]=g;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function A(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function y(a){this.id=++ka;this.stack=[];this.H=la.bind(this);this.exec=this.f=0;this.l=[];this.P=a&&a.fps;this.G=!a||!1!==a.play;this.direction=!0;this.ratio=1}function V(a){M(a)?a=document.querySelectorAll(a):a.length||(a=[a]);return a}function ba(a){if(M(a))if(a){var b;if(!(b=ca[a])){if(b=O[a]||(O[a]=W.apply(W,ma[a]))){for(var c= -new (Int16Array||Array)(E),d=0;d>0;b=c}else b=[];b=ca[a]=b}a=b}else a=[];else a=null;return a}function la(a){var b=this.stack.length,c=this.l.length;if(b||c)if(this.exec=requestAnimationFrame(this.H),this.f||(this.f=a),!(this.P&&a-this.f+1<1E3/this.P)){var d=!1;if(b){Z&&(T?T===this.id&&(X={}):(X={},T=this.id));for(var e=0;e=(e.F-=a-this.f))e(a)||(this.l[b]= -null);this.f=a;d||this.destroy()}}function M(a){return"string"===typeof a}function u(a){return"undefined"===typeof a}function da(a,b,c){b=D(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function J(a,b,c){if("scrollTop"===b||"scrollLeft"===b)return u(c)?a[b]:c;if("custom"===b)return c||0;var d=a.o||(a.o=a.style);return(c=u(c)?d[b]:c)?c:(a.M||(a.M=getComputedStyle(a)))[b]}function ea(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"=== -b?1:0,d&&(d[d.length]=b),c;-1!==b.indexOf("matrix")&&(b=I(b,"(",")").split(","),b=a+"("+(parseFloat(b[na[a]])||"")+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,g=0;g(""+b).length)return c[a]= -b,d&&(d[d.length]=a),c;a=b.split(" ");b={};for(var e=0,g=0;g>0}e[g]=f}return e}function P(a){return a.replace(/([A-Z])/g,"-$1").toLowerCase()}function z(a,b,c,d){d?a.setProperty(b,c,"important"):a.setProperty(b,c)}var E=Math.max(screen.width,screen.height),ca={},O={},X,r=function(){var a=getComputedStyle(document.body);if(u(a.transform))for(var b=["webkit","moz","ms","o"],c=0,d;cd;++d){var e=this.w(b,this.a,this.b);if(0===e)break;b-=(this.s(b,this.a,this.b)-a)/e}return b};a.prototype.B=function(a){return 0===a||1===a||this.a===this.u&&this.b===this.v?a:this.s(this.A(a),this.u,this.v)};return function(b,c,d,e){b=new a(b,c,d,e);return b.B.bind(b)}}(),q={fadeIn:{opacity:1},fadeOut:{opacity:0},fadeToggle:{opacity:"!=1"},slideInLeft:{translateX:0},slideOutLeft:{translateX:"-100%"}, -slideToggleLeft:{translateX:"!=-100%"},slideOutRight:{translateX:"100%"},slideToggleRight:{translateX:"!=100%"},slideInTop:{translateY:0},slideOutTop:{translateY:"-100%"},slideToggleTop:{translateY:"!=-100%"},slideOutBottom:{translateY:"100%"},slideToggleBottom:{translateY:"!=100%"},zoomIn:{scaleX:1,scaleY:1},zoomOut:{scaleX:0,scaleY:0},zoomToggle:{scaleX:"!=1",scaleY:"!=1"}};q.slideUp=q.slideOutTop;q.slideDown=q.slideOutBottom;q.slideIn=q.slideInBottom=q.slideInTop;q.slideInRight=q.slideInLeft;q.rollIn= -{rotateZ:"0deg"};q.rollOut={rotateZ:"720deg"};q.rollToggle={rotateZ:"!=720deg"};q.blurIn={blur:"0em"};q.blurOut={blur:"5em"};q.blurToggle={blur:"!=5em"};q.scrollUp={scrollTop:0};q.scrollDown={scrollTop:"100%"};q.scrollLeft={scrollLeft:0};q.scrollRight={scrollLeft:"100%"};r=N.prototype;r.animate=function(a,b,c,d){var e=this.s,g=this.K,f=this.duration,h=this.a,l=this.S,m=e===g||l&&X[l];d=c*(d?1:-1);(c=0>d)&&0===this.time&&(this.time=f);a=this.time+=(a-(b||a))*d;b=c?0>=a:a>=f;if(!m)if(l&&(X[l]=1),b)var k= -c?e:g;else{if(l=this.ease)k=l.length?(g-e)*l[E/f*a+.5>>0]/1E4:(g-e)*a/f;else if(l=this.w)k=1===l.length?l(a/f):l(a,e,g,f);k=e+k;k=this.W?(k*E+.5>>0)/E:k+.5>>0}e=this.style;m||this.i===k||(this.i=k,this.transform?h.D[e]=k+this.g:this.filter?h.C[e]=k+this.g:this.B?h["_"+this.J][e]=k:"custom"!==e&&this.T(e,k+=this.g));e===this.transform?k=this.Z():e===this.filter?k=this.V():e===this.B&&(k=this.U(this.J));this.u&&this.u.call(h,b?c?0:1:a/f,k);if(b&&(this.time=-1,this.j)){if(f=h[this.I])if(this.R--){if(m= -c?--h[this.A]:++h[this.A],0>m||m>=f.length)if(h[this.A]=m=c?f.length-1:0,mn;n++){var R=n.toString(16);R.length%2&&(R="0"+R);H[R]=n;Y[n]=R}r.Z=function(){for(var a=this.a.D,b=this.v,c=this.a.N,d="",e=0,g=c.length;e< -g;e++){var f=c[e],h="scale"===f?1:0,l=a[f+"X"],m=a[f+"Y"],k=a[f+"Z"];if(l||m||k)"rotate"===f&&(l&&(d+=f+"X("+(l||h)+") "),m&&(d+=f+"Y("+(m||h)+") ")),k&&D(k)!==h?d="rotate"===f?d+(f+"Z("+(k||h)+") "):d+(f+"3d("+(l||h)+","+(m||h)+","+k+") "):"rotate"!==f&&(d+=f+"("+(l||h)+","+(m||h)+") ")}z(b,ta||"transform",d,this.b);return a};r.V=function(){for(var a=this.a.C,b=this.a.L,c="",d=0,e=b.length;d>0,g=2.55*g+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));z(c,d,1===a||u(a)?"#"+Y[e]+Y[g]+Y[f]:"rgba("+e+","+g+","+f+","+a+")",this.b);return b};n=y.prototype;n.aa=function(a,b,c,d,e,g,f,h,l,m,k,n,q,r,B,x,L,u,y){var C=""+(x?oa:L?pa:u?qa:J)(a,b,d,y);"auto"===C&&(C="0");d=D(C);if(M(e)){var p=e;e="="===e[1]?da(d,p=e.substring(2),e[0]):D(e);g||(g=p.substring((""+e).length)); -"%"===g&&("scrollTop"===b?(e*=(a.scrollHeight-a.clientHeight)/100,g=""):"scrollLeft"===b&&(e*=(a.scrollWidth-a.clientWidth)/100,g=""))}g||(g=C.substring((""+d).length)||"");b=new N(a,b,c,d,e,g,f,h,l,m,k,n,q,r,B,x,L,u,y);this.stack[this.stack.length]=b;r||(a[c]=b)};n.animate=function(a,b,c,d){if(b.constructor===Array){var e=b;b=b[0]}if(M(b))if(-1===b.indexOf(" "))b=q[b];else{b=b.split(" ");for(var g={},f=0,h=b.length;ft){v=b[p];"object"===typeof v&&(v=v.to);v=S(v,p);var A=w=void 0;l[m++]=w=p+"R";b[w]=v[w];l[m++]=w=p+"G";b[w]=v[w];l[m++]=w=p+"B";b[w]=v[w];u(A=v[w=p+"A"])?p+="B":(l[m++]=w,b[w]=A,p=w);t*=-1}L||1!==t?C||2!==t?D||3!==t||(D=p):C=p:L=p}}z="_seq_"+ -this.id;for(p=0;pK)continue;1===K?(A=L,E="color"):2===K?(H=C,E="backgroundColor"):3===K&&(I=D,E="borderColor")}if("scroll"===F)v=void 0,l[m++]=v="scrollLeft",b[v]=t[0],l[m++]=v="scrollTop",b[v]=t[1];else{t.constructor===Array&& -(J=t[0],N=t[2],t=t[1]);K=p===m-1;for(var P="_fat_"+F+this.id,O=0,T=a.length;Of?f*(1+h):f+h-f*h,e=2*f-a,h=y(e,a,c+1/3),f=y(e,a,c),a=y(e,a,c-1/3)),c=255*h+.5>>0,h=255*f+.5>>0,f=255*a+.5>>0);a= -{};a[b+"R"]=c;a[b+"G"]=h;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function y(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function p(){this.id=++Y;this.stack=[];this.A=Z.bind(this);this.exec=this.g=0;this.c=[]}function L(a){if(K(a))if(a){var b;if(!(b=R[a])){if(b=N[a]||(N[a]=P.apply(P,aa[a]))){for(var c=new (Int16Array||Array)(x),d=0;d>0;b=c}else b=[];b=R[a]=b}a=b}else a=[];else a=null;return a}function Z(a){var b=this.stack.length,c= -this.c.length;if(b||c){this.exec=requestAnimationFrame(this.A);this.g||(this.g=a);var d=!1;if(b)for(var e=0;e=(e.w-=a-this.g))e(a)||(this.c[b]=null);this.g=a;d||this.destroy()}}function K(a){return"string"===typeof a}function G(a){return"undefined"===typeof a}function S(a,b,c){b=w(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function H(a, -b,c){if("custom"===b)return c||0;var d=a.B||(a.B=a.style);return(c=G(c)?d[b]:c)?c:(a.C||(a.C=getComputedStyle(a)))[b]}function T(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"===b?1:0,d&&(d[d.length]=b),c;-1!==b.indexOf("matrix")&&(b=M(b,"(",")").split(","),b=a+"("+(parseFloat(b[ba[a]])||"")+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,h=0;hd;++d){var e=this.o(b,this.a,this.b);if(0===e)break;b-=(this.j(b,this.a,this.b)-a)/e}return b};a.prototype.u=function(a){return 0=== -a||1===a||this.a===this.l&&this.b===this.m?a:this.j(this.s(a),this.l,this.m)};return function(b,c,d,e){b=new a(b,c,d,e);return b.u.bind(b)}}();r=A.prototype;r.animate=function(a,b){var c=this.F,d=this.G,e=this.duration,h=this.b,f=c===d||!1;a=this.time+=a-(b||a);b=a>=e;if(!f)if(b)var g=d;else{var k;if(k=this.ease)g=k.length?(d-c)*k[x/e*a+.5>>0]/1E4:(d-c)*a/e;else if(k=this.o)g=1===k.length?k(a/e):k(a,c,d,e);g=c+g;g=this.H?(g*x+.5>>0)/x:g+.5>>0}c=this.style;f||this.i===g||(this.i=g,this.transform?h.v[c]= -g+this.u:this.h?h["_"+this.s][c]=g:"custom"!==c&&this.O(g+=this.u));c===this.transform?g=this.K():c===this.h&&(g=this.P(this.s));this.j&&this.j.call(h,b?1:a/e,g);b&&(this.time=-1,this.l&&this.l.call(h))};r.N=function(a,b){if(-1===this.time)this.b[this.I]=null;else{var c=b-a.g;if(this.a)if("view"===this.a)if(c=this.b.getBoundingClientRect(),0<=c.top&&c.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=c))return!0;this.a=0}this.animate(b,a.g);return!0}};r.O=function(a){O(this.m,this.J, -a,this.f)};var V=function(a){function b(b,d){a[b]=-d;a[b+"R"]=d;a[b+"G"]=d;a[b+"B"]=d;a[b+"A"]=d}b("color",1);b("backgroundColor",2);b("borderColor",3);return a}({}),W=function(a){function b(b,d){a[b]=d;a[b+"X"]=d;a[b+"Y"]=d;a[b+"Z"]=d;a[b+"3d"]=d}b("translate",1);b("scale",2);b("rotate",3);b("skew",4);return a}({}),ba={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var z={};var I=Array(255);for(var l=0;256>l;l++){var C=l.toString(16);C.length%2&&(C="0"+C);z[C]=l;I[l]=C}r.K=function(){for(var a= -this.b.v,b=this.m,c=this.b.D,d="",e=0,h=c.length;e>0,h=2.55*h+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));O(c,d,1===a||G(a)?"#"+I[e]+I[h]+I[f]:"rgba("+e+","+h+","+f+","+a+")",this.f);return b};l=p.prototype;l.M=function(a,b,c,d,e,h,f,g,k,l,F,Q,r,p,D){var t=""+(r?ca:p?da:H)(a,b,d,D);"auto"===t&&(t="0");d=w(t);if(K(e)){var m=e;e="="===e[1]?S(d,m=e.substring(2),e[0]):w(e);h||(h=m.substring((""+e).length))}h||(h=t.substring((""+d).length)||"");b=new A(a,b,c,d,e,h,f,g,k,l,F,Q,!1,!1,!1,r,void 0,p,D);this.stack[this.stack.length]=b;a[c]=b};l.animate= -function(a,b,c,d){c?"function"===typeof c&&(d=c,c={}):c={};K(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=c.delay,h=c.duration||400,f=c.ease;if(f){var g;if(K(f)){if(g=M(f,"bezier(",")")){g=g.replace(/ /g,"");var k=g.split(",")}}else f.constructor===Array&&(g=f.join(","),k=f);g&&(N[g]||(N[g]=P.apply(P,k)),f=g)}g=f||"";k=Object.keys(b);f=k.length;d=d||c.callback||!1;var l=c.step,r=c.force;c=c.init;for(var p,y,z,D,t=f;0q&&(n=b[m],"object"===typeof n&&(n=n.to),v=E(n,m),k[f++]=n=m+"R",b[n]=v[n],k[f++]=n=m+"G",b[n]=v[n],k[f++]=n=m+"B",b[n]=v[n],G(v=v[n=m+"A"])?m+="B":(k[f++]=n,b[n]=v,m=n),q*=-1),y||1!==q?z||2!==q?D||3!==q||(D=m):z=m:y=m}for(t=0;tB)continue;1===B?(q=y,w="color"):2===B?(n=z,w="backgroundColor"):3===B&&(v=D,w="borderColor")}u.constructor===Array&&(A=u[0],C=u[2],u=u[1]);B=t===f-1;for(var I="_fat_"+x+this.id,H=0,O=a.length;Hf?f*(1+h):f+h-f*h,e=2*f-a,h=w(e,a,c+1/3),f=w(e,a,c),a=w(e,a,c-1/3)),c=255*h+.5>>0,h=255*f+.5>>0,f=255*a+.5>> -0);a={};a[b+"R"]=c;a[b+"G"]=h;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function w(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function p(){this.id=++T;this.stack=[];this.B=U.bind(this);this.exec=this.c=0}function U(a){var b=this.stack.length;if(b){this.exec=requestAnimationFrame(this.B);this.c||(this.c=a);var c=!1;if(b)for(var d=0;d=e;if(!f)if(b)var g= -d;else{var k;if(k=this.ease)g=k.length?(d-c)*k[N/e*a+.5>>0]/1E4:(d-c)*a/e;else if(k=this.o)g=1===k.length?k(a/e):k(a,c,d,e);g=c+g;g=this.F?(g*N+.5>>0)/N:g+.5>>0}c=this.style;f||this.i===g||(this.i=g,this.transform?h.f[c]=g+this.u:this.h?h["_"+this.s][c]=g:"custom"!==c&&this.M(g+=this.u));c===this.transform?g=this.I():c===this.h&&(g=this.N(this.s));this.j&&this.j.call(h,b?1:a/e,g);b&&(this.time=-1,this.l&&this.l.call(h))};r.L=function(a,b){if(-1===this.time)this.b[this.G]=null;else{var c=b-a.c;if(this.a)if("view"=== -this.a)if(c=this.b.getBoundingClientRect(),0<=c.top&&c.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=c))return!0;this.a=0}this.animate(b,a.c);return!0}};r.M=function(a){K(this.m,this.H,a,this.g)};var Q=function(a){function b(c,b){a[c]=-b;a[c+"R"]=b;a[c+"G"]=b;a[c+"B"]=b;a[c+"A"]=b}b("color",1);b("backgroundColor",2);b("borderColor",3);return a}({}),R=function(a){function b(c,b){a[c]=b;a[c+"X"]=b;a[c+"Y"]=b;a[c+"Z"]=b;a[c+"3d"]=b}b("translate",1);b("scale",2);b("rotate",3);b("skew", -4);return a}({}),V={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var y={};var F=Array(255);for(var m=0;256>m;m++){var E=m.toString(16);E.length%2&&(E="0"+E);y[E]=m;F[m]=E}r.I=function(){for(var a=this.b.f,b=this.m,c=this.b.A,d="",e=0,h=c.length;e>0,h=2.55*h+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));K(c,d,1===a||H(a)?"#"+F[e]+F[h]+F[f]:"rgba("+e+","+h+","+f+","+a+")",this.g);return b};m=p.prototype;m.K=function(a,b,c,d,e,h,f,g,k,x,D,m,r,p,B){var t=""+(r?W:p?X:M)(a,b,d,B);"auto"===t&&(t="0");d=z(t);if(J(e)){var l=e;e= -z(e);h||(h=l.substring((""+e).length))}h||(h=t.substring((""+d).length)||"");b=new A(a,b,c,d,e,h,f,g,k,x,D,m,!1,!1,!1,r,void 0,p,B);this.stack[this.stack.length]=b;a[c]=b};m.animate=function(a,b,c,d){c?"function"===typeof c&&(d=c,c={}):c={};J(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=c.delay,h=c.duration||400,f=c.ease||"",g=Object.keys(b),k=g.length;d=d||c.callback||!1;var x=c.step,r=c.force;c=c.init;for(var m,p,w,y,t=k;0q&&(n=b[l],"object"===typeof n&&(n=n.to),v=B(n,l),g[k++]=n=l+"R",b[n]=v[n],g[k++]=n=l+"G",b[n]=v[n],g[k++]=n=l+"B",b[n]=v[n],H(v=v[n=l+"A"])?l+="B":(g[k++]=n,b[n]=v,l=n),q*=-1),p||1!==q?w||2!==q?y||3!==q||(y=l):w=l:p=l}for(t=0;tC)continue;1===C?(q=p,z="color"):2===C?(n=w,z="backgroundColor"):3===C&&(v=y,z="borderColor")}u.constructor===Array&&(A=u[0],E=u[2],u=u[1]);C=t===k-1;for(var G="_fat_"+L+this.id,F=0,M=a.length;F=e;if(!n)if(c)var f= -d;else{var l;if(l=this.ease)f=l.length?(d-b)*l[y/e*a+.5>>0]/1E4:(d-b)*a/e;else if(l=this.h)f=1===l.length?l(a/e):l(a,b,d,e);f=b+f;f=this.D?(f*y+.5>>0)/y:f+.5>>0}b=this.style;n||this.c===f||(this.c=f,"custom"!==b&&this.A(f+=this.H));this.f&&this.f.call(g,c?1:a/e,f);c&&(this.time=-1,this.g&&this.g.call(g))};w.C=function(a,c){if(-1===this.time)this.i[this.F]=null;else{var b=c-a.b;if(this.a)if("view"===this.a)if(b=this.i.getBoundingClientRect(),0<=b.top&&b.bottom<=window.innerHeight)this.a=0;else return!0; -else{if(0<(this.a-=b))return!0;this.a=0}this.animate(c,a.b);return!0}};w.A=function(a){var c=this.B,b=this.G;this.m?c.setProperty(b,a,"important"):c.setProperty(b,a)};var v=h.prototype;v.w=function(a,c,b,d,e,g,n,f,l,h,x,t){if("custom"===c)d=d||0;else{var q=a.j||(a.j=a.style);d=(d="undefined"===typeof d?q[c]:d)?d:(a.l||(a.l=getComputedStyle(a)))[c]}q=""+d;"auto"===q&&(q="0");d=u(q);if(m(e)){var k=e;e=u(e);g||(g=k.substring((""+e).length))}g||(g=q.substring((""+d).length)||"");c=new p(a,c,b,d,e,g,n, -f,l,h,x,t,!1,!1,!1);this.stack[this.stack.length]=c;a[b]=c};v.animate=function(a,c,b,d){b?"function"===typeof b&&(d=b,b={}):b={};m(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=b.delay,g=b.duration||400,n=b.ease||"",f=Object.keys(c),l=f.length;d=d||b.callback||!1;var h=b.step,x=b.force;b=b.init;for(var t=0;tf?f*(1+g):f+g-f*g,e=2*f-a,g=A(e,a,c+1/3),f=A(e,a,c),a=A(e,a,c-1/3)),c=255*g+.5>>0,g=255*f+ -.5>>0,f=255*a+.5>>0);a={};a[b+"R"]=c;a[b+"G"]=g;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function A(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function y(a){this.id=++ka;this.stack=[];this.H=la.bind(this);this.exec=this.f=0;this.l=[];this.P=a&&a.fps;this.G=!a||!1!==a.play;this.direction=!0;this.ratio=1}function V(a){M(a)?a=document.querySelectorAll(a):a.length||(a=[a]);return a}function ba(a){if(M(a))if(a){var b;if(!(b=ca[a])){if(b=O[a]||(O[a]=W.apply(W,ma[a]))){for(var c= -new (Int16Array||Array)(E),d=0;d>0;b=c}else b=[];b=ca[a]=b}a=b}else a=[];else a=null;return a}function la(a){var b=this.stack.length,c=this.l.length;if(b||c)if(this.exec=requestAnimationFrame(this.H),this.f||(this.f=a),!(this.P&&a-this.f+1<1E3/this.P)){var d=!1;if(b){Z&&(T?T===this.id&&(X={}):(X={},T=this.id));for(var e=0;e=(e.F-=a-this.f))e(a)||(this.l[b]= -null);this.f=a;d||this.destroy()}}function M(a){return"string"===typeof a}function u(a){return"undefined"===typeof a}function da(a,b,c){b=D(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function J(a,b,c){if("scrollTop"===b||"scrollLeft"===b)return u(c)?a[b]:c;if("custom"===b)return c||0;var d=a.o||(a.o=a.style);return(c=u(c)?d[b]:c)?c:(a.M||(a.M=getComputedStyle(a)))[b]}function ea(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"=== -b?1:0,d&&(d[d.length]=b),c;-1!==b.indexOf("matrix")&&(b=I(b,"(",")").split(","),b=a+"("+(parseFloat(b[na[a]])||"")+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,g=0;g(""+b).length)return c[a]= -b,d&&(d[d.length]=a),c;a=b.split(" ");b={};for(var e=0,g=0;g>0}e[g]=f}return e}function P(a){return a.replace(/([A-Z])/g,"-$1").toLowerCase()}function z(a,b,c,d){d?a.setProperty(b,c,"important"):a.setProperty(b,c)}var E=Math.max(screen.width,screen.height),ca={},O={},X,r=function(){var a=getComputedStyle(document.body);if(u(a.transform))for(var b=["webkit","moz","ms","o"],c=0,d;cd;++d){var e=this.w(b,this.a,this.b);if(0===e)break;b-=(this.s(b,this.a,this.b)-a)/e}return b};a.prototype.B=function(a){return 0===a||1===a||this.a===this.u&&this.b===this.v?a:this.s(this.A(a),this.u,this.v)};return function(b,c,d,e){b=new a(b,c,d,e);return b.B.bind(b)}}(),q={fadeIn:{opacity:1},fadeOut:{opacity:0},fadeToggle:{opacity:"!=1"},slideInLeft:{translateX:0},slideOutLeft:{translateX:"-100%"}, -slideToggleLeft:{translateX:"!=-100%"},slideOutRight:{translateX:"100%"},slideToggleRight:{translateX:"!=100%"},slideInTop:{translateY:0},slideOutTop:{translateY:"-100%"},slideToggleTop:{translateY:"!=-100%"},slideOutBottom:{translateY:"100%"},slideToggleBottom:{translateY:"!=100%"},zoomIn:{scaleX:1,scaleY:1},zoomOut:{scaleX:0,scaleY:0},zoomToggle:{scaleX:"!=1",scaleY:"!=1"}};q.slideUp=q.slideOutTop;q.slideDown=q.slideOutBottom;q.slideIn=q.slideInBottom=q.slideInTop;q.slideInRight=q.slideInLeft;q.rollIn= -{rotateZ:"0deg"};q.rollOut={rotateZ:"720deg"};q.rollToggle={rotateZ:"!=720deg"};q.blurIn={blur:"0em"};q.blurOut={blur:"5em"};q.blurToggle={blur:"!=5em"};q.scrollUp={scrollTop:0};q.scrollDown={scrollTop:"100%"};q.scrollLeft={scrollLeft:0};q.scrollRight={scrollLeft:"100%"};r=N.prototype;r.animate=function(a,b,c,d){var e=this.s,g=this.K,f=this.duration,h=this.a,l=this.S,m=e===g||l&&X[l];d=c*(d?1:-1);(c=0>d)&&0===this.time&&(this.time=f);a=this.time+=(a-(b||a))*d;b=c?0>=a:a>=f;if(!m)if(l&&(X[l]=1),b)var k= -c?e:g;else{if(l=this.ease)k=l.length?(g-e)*l[E/f*a+.5>>0]/1E4:(g-e)*a/f;else if(l=this.w)k=1===l.length?l(a/f):l(a,e,g,f);k=e+k;k=this.W?(k*E+.5>>0)/E:k+.5>>0}e=this.style;m||this.i===k||(this.i=k,this.transform?h.D[e]=k+this.g:this.filter?h.C[e]=k+this.g:this.B?h["_"+this.J][e]=k:"custom"!==e&&this.T(e,k+=this.g));e===this.transform?k=this.Z():e===this.filter?k=this.V():e===this.B&&(k=this.U(this.J));this.u&&this.u.call(h,b?c?0:1:a/f,k);if(b&&(this.time=-1,this.j)){if(f=h[this.I])if(this.R--){if(m= -c?--h[this.A]:++h[this.A],0>m||m>=f.length)if(h[this.A]=m=c?f.length-1:0,mn;n++){var R=n.toString(16);R.length%2&&(R="0"+R);H[R]=n;Y[n]=R}r.Z=function(){for(var a=this.a.D,b=this.v,c=this.a.N,d="",e=0,g=c.length;e< -g;e++){var f=c[e],h="scale"===f?1:0,l=a[f+"X"],m=a[f+"Y"],k=a[f+"Z"];if(l||m||k)"rotate"===f&&(l&&(d+=f+"X("+(l||h)+") "),m&&(d+=f+"Y("+(m||h)+") ")),k&&D(k)!==h?d="rotate"===f?d+(f+"Z("+(k||h)+") "):d+(f+"3d("+(l||h)+","+(m||h)+","+k+") "):"rotate"!==f&&(d+=f+"("+(l||h)+","+(m||h)+") ")}z(b,ta||"transform",d,this.b);return a};r.V=function(){for(var a=this.a.C,b=this.a.L,c="",d=0,e=b.length;d>0,g=2.55*g+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));z(c,d,1===a||u(a)?"#"+Y[e]+Y[g]+Y[f]:"rgba("+e+","+g+","+f+","+a+")",this.b);return b};n=y.prototype;n.aa=function(a,b,c,d,e,g,f,h,l,m,k,n,q,r,B,x,L,u,y){var C=""+(x?oa:L?pa:u?qa:J)(a,b,d,y);"auto"===C&&(C="0");d=D(C);if(M(e)){var p=e;e="="===e[1]?da(d,p=e.substring(2),e[0]):D(e);g||(g=p.substring((""+e).length)); -"%"===g&&("scrollTop"===b?(e*=(a.scrollHeight-a.clientHeight)/100,g=""):"scrollLeft"===b&&(e*=(a.scrollWidth-a.clientWidth)/100,g=""))}g||(g=C.substring((""+d).length)||"");b=new N(a,b,c,d,e,g,f,h,l,m,k,n,q,r,B,x,L,u,y);this.stack[this.stack.length]=b;r||(a[c]=b)};n.animate=function(a,b,c,d){if(b.constructor===Array){var e=b;b=b[0]}if(M(b))if(-1===b.indexOf(" "))b=q[b];else{b=b.split(" ");for(var g={},f=0,h=b.length;ft){v=b[p];"object"===typeof v&&(v=v.to);v=S(v,p);var A=w=void 0;l[m++]=w=p+"R";b[w]=v[w];l[m++]=w=p+"G";b[w]=v[w];l[m++]=w=p+"B";b[w]=v[w];u(A=v[w=p+"A"])?p+="B":(l[m++]=w,b[w]=A,p=w);t*=-1}L||1!==t?C||2!==t?D||3!==t||(D=p):C=p:L=p}}z="_seq_"+ -this.id;for(p=0;pK)continue;1===K?(A=L,E="color"):2===K?(H=C,E="backgroundColor"):3===K&&(I=D,E="borderColor")}if("scroll"===F)v=void 0,l[m++]=v="scrollLeft",b[v]=t[0],l[m++]=v="scrollTop",b[v]=t[1];else{t.constructor===Array&& -(J=t[0],N=t[2],t=t[1]);K=p===m-1;for(var P="_fat_"+F+this.id,O=0,T=a.length;Og?g*(1+h):g+h-g*h,e=2*g-a,h=x(e,a,b+1/3),g=x(e,a,b),a=x(e,a,b-1/3)),b=255*h+.5>>0,h=255*g+.5>>0,g=255*a+.5>>0);a={};a[c+"R"]=b;a[c+"G"]=h;a[c+"B"]=g;-1!== +d&&(a[c+"A"]=d);return a}function x(a,c,b){0>b?b+=1:1b?c:b<2/3?a+(c-a)*(2/3-b)*6:a}function r(){this.id=++Y;this.stack=[];this.G=Z.bind(this);this.exec=this.f=0}function C(a,c,b,d){d?a.setProperty(c,b,"important"):a.setProperty(c,b)}function N(a){return a.replace(/([A-Z])/g,"-$1").toLowerCase()}function R(a){B(a)?a=document.querySelectorAll(a):a.length||(a=[a]);return a}function Z(a){var c=this.stack,b=c.length;if(b){this.exec=requestAnimationFrame(this.G);this.f|| +(this.f=a);var d=!1;if(b)for(var e=0;e=e;if(!g)if(c)var f=d;else{var l;if(l=this.ease)f=l.length?(d-b)*l[S/e*a+.5>>0]/1E4:(d-b)*a/e;else if(l=this.v)f=1===l.length?l(a/e):l(a,b,d,e);f=b+f;f=this.R?(f*S+.5>>0)/S:f+.5>>0}b=this.style;g||this.m===f||(this.m=f,this.transform?h.i[b]=f+this.A:this.l?h["_"+this.w][b]=f:(f+=this.A,"custom"!==b&&this.O(f)));b===this.transform?f=this.K():b===this.l&&(f=this.P(this.w));this.o&&this.o.call(h,c?1:a/e,f);c&&(this.time= +-1,this.s&&this.s.call(h))};k.N=function(a,c){if(-1===this.time)this.c[this.I]=null;else{var b=c-a.f;if(this.a)if("view"===this.a)if(b=this.c.getBoundingClientRect(),0<=b.top&&b.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=b))return!0;this.a=0}this.animate(c,a.f);return!0}};k.O=function(a){C(this.u,this.J,a,this.j)};var V=function(a){function c(b,c){a[b]=-c;a[b+"R"]=c;a[b+"G"]=c;a[b+"B"]=c;a[b+"A"]=c}c("color",1);c("backgroundColor",2);c("borderColor",3);return a}({}),W=function(a){function c(b, +c){a[b]=c;a[b+"X"]=c;a[b+"Y"]=c;a[b+"Z"]=c;a[b+"3d"]=c}c("translate",1);c("scale",2);c("rotate",3);c("skew",4);return a}({}),aa={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var A={};var Q=Array(255);for(var L=0;256>L;L++){var M=L.toString(16);M.length%2&&(M="0"+M);A[M]=L;Q[L]=M}k.K=function(){for(var a=this.c.i,c=this.u,b=this.c.C,d="",e=0,h=b.length;e>0,h=2.55*h+.5>>0,g=2.55*g+.5>>0,a&&(a/=100));C(b,d,1===a||J(a)?"#"+Q[e]+Q[h]+Q[g]:"rgba("+e+","+h+","+g+","+a+")",this.j);return c};k.L=function(a,c,b,d, +e,h,g,f,l,k,n){J(a)?a=this.m:a=E(a);B(c)&&(c=E(c));this.F=a;this.H=c;this.duration=d;this.time=0;this.j=b;this.v!==e&&(this.ease=B(e)?[]:null,this.v=e);this.s=h;this.o=g;this.a=f;l&&(this.transform=l);k&&(this.l=k,this.w=n)};k=r.prototype;k.M=function(a,c,b,d,e,h,g,f,l,k,n,q,I,t,z){var u=""+(I?ba:t?ca:P)(a,c,d,z);"auto"===u&&(u="0");d=E(u);if(B(e)){var m=e;e=E(e);h||(h=m.substring((""+e).length))}h||(h=u.substring((""+d).length));c=new G(a,c,b,d,e,h,g,f,l,k,n,q,!1,!1,!1,I,void 0,t,z);this.stack[this.stack.length]= +c;a[b]=c};k.animate=function(a,c,b,d){if(b)if("function"===typeof b)d=b,b={};else{var e=b.engine;if("css"===e)return this.transition(a,c,b);if("native"===e)return this.native(a,c,b)}else b={};a=R(a);e=b.delay;var h=b.duration||400,g=b.ease||"",f=Object.keys(c),l=f.length;d=d||b.callback||!1;var k=b.step,n=b.force;b=b.init;for(var q,I,t,z,u=l;0v&&(p=c[m],"object"===typeof p&&(p=p.to),y=H(p,m),f[l++]=p=m+"R",c[p]=y[p],f[l++]=p=m+"G",c[p]=y[p],f[l++]=p=m+"B",c[p]=y[p],J(y=y[p=m+"A"])?m+="B":(f[l++]=p,c[p]=y,m=p),v*=-1),I||1!==v?t||2!==v?z||3!==v||(z=m):t=m:I=m}for(u=0;uD)continue;1===D?(v=I,r="color"):2===D?(p=t,r="backgroundColor"):3===D&&(y=z,r="borderColor")}w.constructor===Array?(A=w[0],B=w[2],w=w[1]): +"object"===typeof w&&(e=w.delay||e,h=w.duration||h,g=w.ease||g,A=w.from,B=w.unit,w=w.to);D=u===l-1;for(var E="_fat_"+x+this.id,C=0,G=a.length;C     - + diff --git a/docs/main.js b/docs/main.js index dad02ad..8492333 100644 --- a/docs/main.js +++ b/docs/main.js @@ -35,9 +35,9 @@ direction ? [ Math.random() > 0.5 ? 0 : MAX_W, - Math.random() * MAX_H | 0] + (Math.random() * MAX_H) >> 0 ] : - [ Math.random() * MAX_W | 0, + [ (Math.random() * MAX_W) >> 0, Math.random() > 0.5 ? 0 : MAX_H ] ) } @@ -54,6 +54,11 @@ return color; } + + function getRandomDuration(x){ + + return (Math.random() * (x || 1000) + (x || 1000)) >> 0; + } function getNextColorRGB(){ @@ -75,15 +80,18 @@ Fat.animate(this, { - left: coords[0], - top: coords[1] + left: { + to: coords[0], + unit: "px" + }, + top: { + to: coords[1], + unit: "px" + } },{ - duration: (Math.random() * 1000 + 1000) >> 0, + duration: getRandomDuration(), callback: animateBall.FAT, - step: function(){ - - fps_val++; - } + step: function(){ fps_val++ } }); } }; @@ -102,12 +110,9 @@ backgroundColor: getNextColor() },{ - "duration": (Math.random() * 200 + 200) >> 0, - "callback": colorBall.FAT, - "step": function(){ - - fps_val++; - } + duration: getRandomDuration(200), + callback: colorBall.FAT, + step: function(){ fps_val++ } }); } }; @@ -120,15 +125,18 @@ Fat.transform(this, { - translateX: coords[0], - translateY: coords[1] - },{ - "duration": (Math.random() * 1000 + 1000) >> 0, - "callback": transformBall.FAT, - "step": function(){ - - fps_val++; + translateX: { + to: coords[0], + unit: "px" + }, + translateY: { + to: coords[1], + unit: "px" } + },{ + duration: getRandomDuration(), + callback: transformBall.FAT, + step: function(){ fps_val++ } }); } }; @@ -146,12 +154,9 @@ left: coords[0] + "px", top: coords[1] + "px" },{ - "duration": (Math.random() * 1000 + 1000) >> 0, - "callback": animateBall.FAT_CSS3, - "step": function(){ - - fps_val++; - } + duration: getRandomDuration(), + callback: animateBall.FAT_CSS3, + step: function(){ fps_val++ } }); } }; @@ -164,12 +169,9 @@ backgroundColor: getNextColor() },{ - "duration": (Math.random() * 200 + 200) >> 0, - "callback": colorBall.FAT_CSS3, - "step": function(){ - - fps_val++; - } + duration: getRandomDuration(200), + callback: colorBall.FAT_CSS3, + step: function(){ fps_val++ } }); } }; @@ -184,12 +186,9 @@ transform: "translate(" + coords[0] + "px," + coords[1] + "px)" },{ - "duration": (Math.random() * 1000 + 1000) >> 0, - "callback": transformBall.FAT_CSS3, - "step": function(){ - - fps_val++; - } + duration: getRandomDuration(), + callback: transformBall.FAT_CSS3, + step: function(){ fps_val++ } }); } }; @@ -207,12 +206,9 @@ left: coords[0] + "px", top: coords[1] + "px" },{ - "duration": (Math.random() * 1000 + 1000) >> 0, - "callback": animateBall.FAT_NATIVE, - "step": function(){ - - fps_val++; - } + duration: getRandomDuration(), + callback: animateBall.FAT_NATIVE, + step: function(){ fps_val++ } }); } }; @@ -227,12 +223,9 @@ transform: "translate(" + coords[0] + "px," + coords[1] + "px)" },{ - "duration": (Math.random() * 1000 + 1000) >> 0, - "callback": transformBall.FAT_NATIVE, - "step": function(){ - - fps_val++; - } + duration: getRandomDuration(), + callback: transformBall.FAT_NATIVE, + step: function(){ fps_val++ } }); } }; @@ -245,12 +238,9 @@ "backgroundColor": getNextColor() },{ - "duration": (Math.random() * 200 + 200) >> 0, - "callback": colorBall.FAT_NATIVE, - "step": function(){ - - fps_val++; - } + duration: getRandomDuration(200), + callback: colorBall.FAT_NATIVE, + step: function(){ fps_val++ } }); } }; @@ -295,7 +285,7 @@ left: coords[0], top: coords[1] },{ - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), progress: function(){ fps_val++; }, easing: "linear", complete: function(){ @@ -338,7 +328,7 @@ translateX: coords[0], translateY: coords[1] },{ - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), easing: "linear", step: function(now, tween){ @@ -363,7 +353,7 @@ backgroundColor: getNextColor() },{ - duration: (Math.random() * 200 + 200) | 0, + duration: getRandomDuration(200), progress: function(){ fps_val++; }, easing: "linear", complete: function(){ @@ -388,7 +378,7 @@ left: [coords[0], 'linear'], top: [coords[1], 'linear'] },{ - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), progress: function(){ fps_val++; }, complete: function(){ animateBall.VELOCITY.call(_this) }, easing: 'linear' @@ -408,7 +398,7 @@ translateX: [coords[0], 'linear'], translateY: [coords[1], 'linear'] },{ - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), progress: function(){ fps_val++; }, complete: function(){ transformBall.VELOCITY.call(_this) }, easing: 'linear' @@ -426,7 +416,7 @@ backgroundColor: [getNextColor(), 'linear'] },{ - duration: (Math.random() * 200 + 200) | 0, + duration: getRandomDuration(200), progress: function(){ fps_val++; }, complete: function(){ colorBall.VELOCITY.call(_this) }, easing: 'linear' @@ -443,7 +433,7 @@ var coords = getNextCoords(this.direction = !this.direction); var _this = this; - TweenLite.to(this, (Math.random() * 1000 + 1000) / 1000, { + TweenLite.to(this, getRandomDuration() / 1000, { left: coords[0], top: coords[1], @@ -461,7 +451,7 @@ var coords = getNextCoords(this.direction = !this.direction); var _this = this; - TweenLite.to(this, (Math.random() * 1000 + 1000) / 1000, { + TweenLite.to(this, getRandomDuration() / 1000, { x: coords[0], y: coords[1], @@ -478,7 +468,7 @@ var _this = this; - TweenLite.to(this, (Math.random() * 200 + 200) / 1000, { + TweenLite.to(this, getRandomDuration(200) / 1000, { backgroundColor: getNextColor(), onComplete: function(){ colorBall.GSAP.call(_this); }, @@ -502,7 +492,7 @@ left: coords[0], top: coords[1] },{ - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), easing: "linear", complete: function(){ @@ -522,7 +512,7 @@ backgroundColor: getNextColor() },{ - duration: (Math.random() * 200 + 200) | 0, + duration: getRandomDuration(200), easing: "linear", complete: function(){ @@ -543,7 +533,7 @@ translate: coords[0] + "px," + coords[1] + "px" },{ - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), easing: "linear", complete: function(){ @@ -567,7 +557,7 @@ targets: this, left: coords[0], top: coords[1], - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), easing: "linear", complete: function(){ animateBall.ANIMEJS.call(_this); }, update: function(){ fps_val++; } @@ -607,7 +597,7 @@ targets: this, translateX: coords[0] + "px", translateY: coords[1] + "px", - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), easing: "linear", complete: function(){ transformBall.ANIMEJS.call(_this); }, update: function(){ fps_val++; } @@ -625,7 +615,7 @@ targets: this, backgroundColor: getNextColor(), - duration: (Math.random() * 200 + 200) | 0, + duration: getRandomDuration(200), easing: "linear", complete: function(){ colorBall.ANIMEJS.call(_this); }, update: function(){ fps_val++; } @@ -688,7 +678,7 @@ bajs.a(this, { "curve": "linear", - "duration": ((Math.random() * 1000 + 1000) | 0) + "ms", + "duration": getRandomDuration() + "ms", "0%": { left: this._x, top: this._y @@ -726,7 +716,7 @@ bajs.a(this, { "curve": "linear", - "duration": ((Math.random() * 1000 + 1000) | 0) + "ms", + "duration": getRandomDuration() + "ms", "0%": { transform: "translateX(" + this._x + "px) translateY(" + this._y + "px)" }, @@ -751,7 +741,7 @@ bajs.a(this, { "curve": "linear", - "duration": ((Math.random() * 200 + 200) | 0) + "ms", + "duration": getRandomDuration(200) + "ms", "0%": { "background-color": this._color }, @@ -791,7 +781,7 @@ this._x = coords[0]; this._y = coords[1]; - var duration = ((Math.random() * 1000 + 1000) | 0); + var duration = getRandomDuration(); TinyAnimate.animateCSS(this, "left", "px", from_x, this._x, duration, "linear"); TinyAnimate.animateCSS(this, "top", "px", from_y, this._y, duration, ease_linear_fps, function(){ @@ -836,7 +826,7 @@ left: coords[0] + "px", top: coords[1] + "px", - duration: ((Math.random() * 1000 + 1000) | 0), + duration: getRandomDuration(), easing: function(t){ fps_val++; @@ -860,7 +850,7 @@ morpheus(this, { transform: "translate(" + (coords[0]) + "px," + (coords[1]) + "px)", - duration: ((Math.random() * 1000 + 1000) | 0), + duration: getRandomDuration(), easing: function(t){ fps_val++; @@ -883,7 +873,7 @@ morpheus(this, { backgroundColor: getNextColor(), - duration: ((Math.random() * 200 + 200) | 0), + duration: getRandomDuration(200), easing: function(t){ fps_val++; @@ -1016,7 +1006,7 @@ left: coords[0], top: coords[1] }, - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), easing: function(n){ fps_val++; return n; }, onEnd: function(){ animateBall.DOJO.call(_this); } @@ -1036,7 +1026,7 @@ properties: { backgroundColor: getNextColor() }, - duration: (Math.random() * 200 + 200) | 0, + duration: getRandomDuration(200), easing: function(n){ fps_val++; return n; }, onEnd: function(){ colorBall.DOJO.call(_this); } @@ -1062,7 +1052,7 @@ coords[1] ] }, - duration: ((Math.random() * 1000 + 1000) | 0) / 1000, + duration: getRandomDuration() / 1000, easing: function(e,t,n,r){fps_val++; return n*e/r+t} }); @@ -1083,7 +1073,7 @@ to: { backgroundColor: getNextColor() }, - duration: ((Math.random() * 200 + 200) | 0) / 1000, + duration: getRandomDuration(200) / 1000, easing: function(e,t,n,r){fps_val++; return n*e/r+t} }); @@ -1103,7 +1093,7 @@ var myFx = new Fx.Morph(_this, { - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), transition: function(t){fps_val++; return t}, onComplete: function(){ animateBall.MOOTOOLS.call(_this); } }); @@ -1123,7 +1113,7 @@ var myFx = new Fx.Morph(_this, { - duration: (Math.random() * 200 + 200) | 0, + duration: getRandomDuration(200), transition: function(t){fps_val++; return t}, onComplete: function(){ colorBall.MOOTOOLS.call(_this); } }); @@ -1154,7 +1144,7 @@ 'left': coords[0], 'top': coords[1] - }, (Math.random() * 1000 + 1000) | 0, createjs.Ease.linear).call(function(){ animateBall.TWEENJS.call(_this); }); + }, getRandomDuration(), createjs.Ease.linear).call(function(){ animateBall.TWEENJS.call(_this); }); } }; @@ -1170,7 +1160,7 @@ transform: "translate(" + (coords[0]) + "px," + (coords[1]) + "px)" - }, (Math.random() * 1000 + 1000) | 0, createjs.Ease.linear).call(function(){ transformBall.TWEENJS.call(_this); }); + }, getRandomDuration(), createjs.Ease.linear).call(function(){ transformBall.TWEENJS.call(_this); }); } }; @@ -1184,7 +1174,7 @@ backgroundColor: getNextColor() - }, (Math.random() * 200 + 200) | 0, createjs.Ease.linear).call(function(){ colorBall.TWEENJS.call(_this); }); + }, getRandomDuration(200), createjs.Ease.linear).call(function(){ colorBall.TWEENJS.call(_this); }); } }; @@ -1200,7 +1190,7 @@ just.animate({ targets: _this, - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), web: { 'left': coords[0], 'top': coords[1] @@ -1229,7 +1219,7 @@ just.animate({ targets: _this, - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), web: { transform: 'translate(' + coords[0] + 'px,' + coords[1] + 'px)' }, @@ -1256,7 +1246,7 @@ just.animate({ targets: _this, - duration: (Math.random() * 200 + 200) | 0, + duration: getRandomDuration(200), web: { backgroundColor: getNextColor() }, @@ -1296,7 +1286,7 @@ "left": [this._x, this._x = coords[0] + "px"], "top": [this._y, this._y = coords[1] + "px"] },{ - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), easing: "linear" }); @@ -1332,7 +1322,7 @@ transform: ['translate(' + (this._x) + 'px,' + (this._y) + 'px)', 'translate(' + (this._x = coords[0]) + 'px,' + (this._y = coords[1]) + 'px)'] },{ - duration: (Math.random() * 1000 + 1000) | 0, + duration: getRandomDuration(), easing: "linear" }); @@ -1363,7 +1353,7 @@ "backgroundColor": [this._c, this._c = getNextColor()] },{ - duration: (Math.random() * 200 + 200) | 0, + duration: getRandomDuration(200), easing: "linear" }); @@ -1597,8 +1587,8 @@ if(test === "color"){ - ball.style.left = (Math.random() * MAX_W) + "px"; - ball.style.top = (Math.random() * MAX_H) + "px"; + ball.style.left = ((Math.random() * MAX_W + 0.5) >> 0) + "px"; + ball.style.top = ((Math.random() * MAX_H + 0.5) >> 0) + "px"; } else{ diff --git a/fat.compact.js b/fat.compact.js index 16c568b..a08529e 100644 --- a/fat.compact.js +++ b/fat.compact.js @@ -1,26 +1,26 @@ /* - FAT v0.6.5 + FAT v0.6.6 Copyright 2019 Nextapps GmbH Author: Thomas Wilkerling Released under the Apache 2.0 Licence https://github.com/nextapps-de/fat */ -'use strict';(function(A,E,y){var p;(p=y.define)&&p.amd?p([],function(){return E}):(p=y.modules)?p[A.toLowerCase()]=E:"object"===typeof exports?module.exports=E:y[A]=E})("Fat",function(){function A(a,b,c,d,e,h,f,g,k,X,l,Q,r,p,D,t,m,q,n){this.b=a;this.m=a.B;this.style=b;this.J=b.replace(/([A-Z])/g,"-$1").toLowerCase();this.F=d;this.G=e;this.i=d;this.u=h;this.f=f;this.duration=g;this.o=k;this.ease=L(k);this.time=0;this.l=X;this.j=l;this.I=c;this.a=Q;this.H=q?"%"===h||-1!==b.indexOf("A"):"px"!==h;q&& -(this.h=q,this.s=n);t&&(this.transform=t)}function E(a,b,c){var d=c||-1,e;if("#"===a[0])if(a=a.toLowerCase(),4===a.length){c=z[(e=a[1])+e];var h=z[(e=a[2])+e];var f=z[(e=a[3])+e]}else c=z[a[1]+a[2]],h=z[a[3]+a[4]],f=z[a[5]+a[6]];else e=M(a,"(",")").split(","),c=parseInt(e[0],10),h=parseInt(e[1],10),f=parseInt(e[2],10),3f?f*(1+h):f+h-f*h,e=2*f-a,h=y(e,a,c+1/3),f=y(e,a,c),a=y(e,a,c-1/3)),c=255*h+.5>>0,h=255*f+.5>>0,f=255*a+.5>>0);a= -{};a[b+"R"]=c;a[b+"G"]=h;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function y(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function p(){this.id=++Y;this.stack=[];this.A=Z.bind(this);this.exec=this.g=0;this.c=[]}function L(a){if(K(a))if(a){var b;if(!(b=R[a])){if(b=N[a]||(N[a]=P.apply(P,aa[a]))){for(var c=new (Int16Array||Array)(x),d=0;d>0;b=c}else b=[];b=R[a]=b}a=b}else a=[];else a=null;return a}function Z(a){var b=this.stack.length,c= -this.c.length;if(b||c){this.exec=requestAnimationFrame(this.A);this.g||(this.g=a);var d=!1;if(b)for(var e=0;e=(e.w-=a-this.g))e(a)||(this.c[b]=null);this.g=a;d||this.destroy()}}function K(a){return"string"===typeof a}function G(a){return"undefined"===typeof a}function S(a,b,c){b=w(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function H(a, -b,c){if("custom"===b)return c||0;var d=a.B||(a.B=a.style);return(c=G(c)?d[b]:c)?c:(a.C||(a.C=getComputedStyle(a)))[b]}function T(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"===b?1:0,d&&(d[d.length]=b),c;-1!==b.indexOf("matrix")&&(b=M(b,"(",")").split(","),b=a+"("+(parseFloat(b[ba[a]])||"")+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,h=0;hd;++d){var e=this.o(b,this.a,this.b);if(0===e)break;b-=(this.j(b,this.a,this.b)-a)/e}return b};a.prototype.u=function(a){return 0=== -a||1===a||this.a===this.l&&this.b===this.m?a:this.j(this.s(a),this.l,this.m)};return function(b,c,d,e){b=new a(b,c,d,e);return b.u.bind(b)}}();r=A.prototype;r.animate=function(a,b){var c=this.F,d=this.G,e=this.duration,h=this.b,f=c===d||!1;a=this.time+=a-(b||a);b=a>=e;if(!f)if(b)var g=d;else{var k;if(k=this.ease)g=k.length?(d-c)*k[x/e*a+.5>>0]/1E4:(d-c)*a/e;else if(k=this.o)g=1===k.length?k(a/e):k(a,c,d,e);g=c+g;g=this.H?(g*x+.5>>0)/x:g+.5>>0}c=this.style;f||this.i===g||(this.i=g,this.transform?h.v[c]= -g+this.u:this.h?h["_"+this.s][c]=g:"custom"!==c&&this.O(g+=this.u));c===this.transform?g=this.K():c===this.h&&(g=this.P(this.s));this.j&&this.j.call(h,b?1:a/e,g);b&&(this.time=-1,this.l&&this.l.call(h))};r.N=function(a,b){if(-1===this.time)this.b[this.I]=null;else{var c=b-a.g;if(this.a)if("view"===this.a)if(c=this.b.getBoundingClientRect(),0<=c.top&&c.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=c))return!0;this.a=0}this.animate(b,a.g);return!0}};r.O=function(a){O(this.m,this.J, -a,this.f)};var V=function(a){function b(b,d){a[b]=-d;a[b+"R"]=d;a[b+"G"]=d;a[b+"B"]=d;a[b+"A"]=d}b("color",1);b("backgroundColor",2);b("borderColor",3);return a}({}),W=function(a){function b(b,d){a[b]=d;a[b+"X"]=d;a[b+"Y"]=d;a[b+"Z"]=d;a[b+"3d"]=d}b("translate",1);b("scale",2);b("rotate",3);b("skew",4);return a}({}),ba={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var z={};var I=Array(255);for(var l=0;256>l;l++){var C=l.toString(16);C.length%2&&(C="0"+C);z[C]=l;I[l]=C}r.K=function(){for(var a= -this.b.v,b=this.m,c=this.b.D,d="",e=0,h=c.length;e>0,h=2.55*h+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));O(c,d,1===a||G(a)?"#"+I[e]+I[h]+I[f]:"rgba("+e+","+h+","+f+","+a+")",this.f);return b};l=p.prototype;l.M=function(a,b,c,d,e,h,f,g,k,l,F,Q,r,p,D){var t=""+(r?ca:p?da:H)(a,b,d,D);"auto"===t&&(t="0");d=w(t);if(K(e)){var m=e;e="="===e[1]?S(d,m=e.substring(2),e[0]):w(e);h||(h=m.substring((""+e).length))}h||(h=t.substring((""+d).length)||"");b=new A(a,b,c,d,e,h,f,g,k,l,F,Q,!1,!1,!1,r,void 0,p,D);this.stack[this.stack.length]=b;a[c]=b};l.animate= -function(a,b,c,d){c?"function"===typeof c&&(d=c,c={}):c={};K(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=c.delay,h=c.duration||400,f=c.ease;if(f){var g;if(K(f)){if(g=M(f,"bezier(",")")){g=g.replace(/ /g,"");var k=g.split(",")}}else f.constructor===Array&&(g=f.join(","),k=f);g&&(N[g]||(N[g]=P.apply(P,k)),f=g)}g=f||"";k=Object.keys(b);f=k.length;d=d||c.callback||!1;var l=c.step,r=c.force;c=c.init;for(var p,y,z,D,t=f;0q&&(n=b[m],"object"===typeof n&&(n=n.to),v=E(n,m),k[f++]=n=m+"R",b[n]=v[n],k[f++]=n=m+"G",b[n]=v[n],k[f++]=n=m+"B",b[n]=v[n],G(v=v[n=m+"A"])?m+="B":(k[f++]=n,b[n]=v,m=n),q*=-1),y||1!==q?z||2!==q?D||3!==q||(D=m):z=m:y=m}for(t=0;tB)continue;1===B?(q=y,w="color"):2===B?(n=z,w="backgroundColor"):3===B&&(v=D,w="borderColor")}u.constructor===Array&&(A=u[0],C=u[2],u=u[1]);B=t===f-1;for(var I="_fat_"+x+this.id,H=0,O=a.length;Hf?f*(1+h):f+h-f*h,e=2*f-a,h=y(e,a,c+1/3),f=y(e,a,c),a=y(e,a,c-1/3)),c=255*h+.5>>0,h=255*f+.5>>0,f=255*a+.5>>0);a= +{};a[b+"R"]=c;a[b+"G"]=h;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function y(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function p(){this.id=++Y;this.stack=[];this.A=Z.bind(this);this.exec=this.l=0;this.u=[]}function J(a,b,c,d){d?a.setProperty(b,c,"important"):a.setProperty(b,c)}function R(a){if(K(a))if(a){var b;if(!(b=S[a])){if(b=N[a]||(N[a]=O.apply(O,aa[a]))){for(var c=new (Int16Array||Array)(z),d=0;d>0;b=c}else b=[];b=S[a]=b}a=b}else a= +[];else a=null;return a}function Z(a){var b=this.stack,c=this.u,d=b.length,e=c.length;if(d||e){this.exec=requestAnimationFrame(this.A);var h=this.l||(this.l=a),f=!1;if(d)for(var g=0;g=(d.w-=a-h))d(a)||(c[b]=null);this.l=a;f||this.destroy()}}function K(a){return"string"===typeof a}function H(a){return"undefined"===typeof a}function T(a,b,c){b=v(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b= +a/b:"!"===c&&(b=a===b?0:b);return b}function Q(a,b,c){if("custom"===b)return c||0;var d=a.B||(a.B=a.style);return(c=H(c)?d[b]:c)?c:(a.C||(a.C=getComputedStyle(a)))[b]}function U(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"===b?1:0,d&&!c[b]&&(d[d.length]=b,c[b]=1),c;-1!==b.indexOf("matrix")&&(b=M(b,"(",")").split(","),b=a+"("+(parseFloat(b[ba[a]])||0)+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,h=0;hd;++d){var e=this.m(b,this.a,this.b);if(0===e)break;b-=(this.h(b,this.a,this.b)-a)/e}return b};a.prototype.s=function(a){return 0===a||1===a||this.a===this.i&& +this.b===this.j?a:this.h(this.o(a),this.i,this.j)};return function(b,c,d,e){b=new a(b,c,d,e);return b.s.bind(b)}}();l=B.prototype;l.animate=function(a,b){var c=this.F,d=this.G,e=this.duration,h=this.b,f=c===d||!1;a=this.time+=a-(b||a);b=a>=e;if(!f)if(b)var g=d;else{var k;if(k=this.ease)g=k.length?(d-c)*k[z/e*a+.5>>0]/1E4:(d-c)*a/e;else if(k=this.m)g=1===k.length?k(a/e):k(a,c,d,e);g=c+g;g=this.H?(g*z+.5>>0)/z:g+.5>>0}c=this.style;f||this.g===g||(this.g=g,this.transform?h.v[c]=g+this.s:this.f?h["_"+ +this.o][c]=g:(g+=this.s,"custom"!==c&&this.O(g)));c===this.transform?g=this.K():c===this.f&&(g=this.P(this.o));this.h&&this.h.call(h,b?1:a/e,g);b&&(this.time=-1,this.i&&this.i.call(h))};l.N=function(a,b){if(-1===this.time)this.b[this.I]=null;else{var c=b-a.l;if(this.a)if("view"===this.a)if(c=this.b.getBoundingClientRect(),0<=c.top&&c.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0<(this.a-=c))return!0;this.a=0}this.animate(b,a.l);return!0}};l.O=function(a){J(this.j,this.J,a,this.c)};var W= +function(a){function b(b,d){a[b]=-d;a[b+"R"]=d;a[b+"G"]=d;a[b+"B"]=d;a[b+"A"]=d}b("color",1);b("backgroundColor",2);b("borderColor",3);return a}({}),X=function(a){function b(b,d){a[b]=d;a[b+"X"]=d;a[b+"Y"]=d;a[b+"Z"]=d;a[b+"3d"]=d}b("translate",1);b("scale",2);b("rotate",3);b("skew",4);return a}({}),ba={scaleX:0,skewY:1,skewX:2,scaleY:3,translateX:4,translateY:5};var x={};var L=Array(255);for(var F=0;256>F;F++){var C=F.toString(16);C.length%2&&(C="0"+C);x[C]=F;L[F]=C}l.K=function(){for(var a=this.b.v, +b=this.j,c=this.b.D,d="",e=0,h=c.length;e>0,h=2.55*h+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));J(c,d,1===a||H(a)?"#"+L[e]+L[h]+L[f]:"rgba("+e+","+h+","+f+","+a+")",this.c);return b};l.L=function(a,b,c,d,e,h,f,g,k,l,u){H(a)?a=this.g:a=v(a);K(b)&&(b="="===b[1]?T(a,b.substring(2),b[0]):v(b));this.F=a;this.G=b;this.duration=d;this.time=0;this.c=c;this.m!==e&&(this.ease=R(e),this.m=e);this.i=h;this.h=f;this.a=g;k&&(this.transform=k);l&&(this.f=l,this.o=u)};l=p.prototype;l.M=function(a,b,c,d,e,h,f,g,k,l,u,P,p,D,E){var r=""+(p?ca:D?da:Q)(a, +b,d,E);"auto"===r&&(r="0");d=v(r);if(K(e)){var m=e;e="="===e[1]?T(d,m=e.substring(2),e[0]):v(e);h||(h=m.substring((""+e).length))}h||(h=r.substring((""+d).length));b=new B(a,b,c,d,e,h,f,g,k,l,u,P,!1,!1,!1,p,void 0,D,E);this.stack[this.stack.length]=b;a[c]=b};l.animate=function(a,b,c,d){c?"function"===typeof c&&(d=c,c={}):c={};K(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=c.delay,h=c.duration||400,f=c.ease;if(f){var g;if(K(f)){if(g=M(f,"bezier(",")")){g=g.replace(/ /g,"");var k=g.split(",")}}else f.constructor=== +Array&&(g=f.join(","),k=f);g&&(N[g]||(N[g]=O.apply(O,k)),f=g)}g=f||"";k=Object.keys(b);f=k.length;d=d||c.callback||!1;var l=c.step,u=c.force;c=c.init;for(var p,y,D,E,r=f;0q&&(n=b[m],"object"===typeof n&&(n=n.to),w=G(n,m),k[f++]=n=m+"R",b[n]=w[n],k[f++]=n=m+"G",b[n]=w[n],k[f++]=n=m+"B",b[n]=w[n],H(w=w[n=m+"A"])?m+= +"B":(k[f++]=n,b[n]=w,m=n),q*=-1),y||1!==q?D||2!==q?E||3!==q||(E=m):D=m:y=m}for(r=0;rA)continue;1===A?(q=y,x="color"):2===A?(n=D,x="backgroundColor"):3===A&&(w=E,x="borderColor")}t.constructor===Array?(z=t[0],B=t[2],t=t[1]):"object"===typeof t&&(e=t.delay||e,h=t.duration||h,g=t.ease||g,z=t.from,B=t.unit,t=t.to);A=r===f-1;for(var F="_fat_"+v+this.id,C=0,L=a.length;C= sequences.length)){ + const length = sequences.length; + + if((current < 0) || (current >= length)){ obj[this.seq_count] = current = ( reverse ? - sequences.length - 1 + length - 1 : 0 ); - if(current < sequences.length){ + if(current < length){ return; } @@ -661,7 +665,7 @@ } else{ - const delay = now - fat.last_update; + const elapsed = now - fat.last_update; if(this.delay) { @@ -676,7 +680,7 @@ return true; } } - else if((this.delay -= delay) > 0){ + else if((this.delay -= elapsed) > 0){ return true; } @@ -690,7 +694,7 @@ if(!fat.plays){ - fat.last_update += delay; + fat.last_update += elapsed; return true; } @@ -729,11 +733,7 @@ //if(SUPPORT_TRANSFORM){} //if(SUPPORT_COLOR){} - if(this.current === value){ - - return false; - } - else{ + if(this.current !== value){ if(is_string(value)){ @@ -752,13 +752,15 @@ this.current = value; this.force = force; + /* if(this.unit){ value += this.unit; } - } + */ - return value; + return true; + } } } @@ -769,7 +771,7 @@ const color_keys = SUPPORT_COLOR ? (function(obj){ - function construct(suffix, index){ + function construct(suffix, index){ obj[suffix] = -index; obj[suffix + "R"] = index; @@ -1128,7 +1130,7 @@ if(SUPPORT_CONTROL){ this.fps = config && config["fps"]; - this.plays = !config || (config["play"] !== false); + this.plays = !config || (config["start"] !== false); this.direction = true; this.ratio = 1; } @@ -1140,175 +1142,110 @@ } } - const FatPrototype = Fat.prototype; + /** + * @param progress + * @param {number=} shift + */ - if(SUPPORT_ANIMATE){ + function seek(progress, shift){ - FatPrototype.create_job = create_job; - /** @export */ - FatPrototype.animate = animate; - /** @export */ - FatPrototype.destroy = destroy; - //FatPrototype.init = init; - /** @export */ - FatPrototype.create = function(config){ + const stack = this.stack; + const no_shift = is_undefined(shift); + const direction = this.direction; - return new Fat(config); - }; + for(let i = 0, len = stack.length; i < len; i++){ - if(SUPPORT_PAINT){ + const job = stack[i]; - /** @export */ - FatPrototype.paint = paint; - /** @export */ - FatPrototype.cancel = cancel; - } + job.time = ( - if(SUPPORT_EASING){ + no_shift ? - /** @export */ - FatPrototype.ease = easing; + (direction ? progress : 1 - progress) * job.duration + : + (direction ? shift : job.duration - shift) + ); } - if(SUPPORT_PRESET){ + return this; + } - /** @export */ - FatPrototype.preset = presets; - } + /** + * @param obj + * @param {string=} style + */ - if(SUPPORT_TRANSFORM){ + function remove(obj, style){ - /** @export */ - FatPrototype.transform = function(obj, styles, config, callback){ + const stack = this.stack; + const stack_length = stack.length; - if(is_string(styles)){ + obj = get_nodes(obj); - styles = { + for(let a = 0, len = obj.length; a < len; a++){ - "transform": styles - } - } + if(!style || is_string(style)){ - return this.animate(obj, styles, config, callback); - }; - } + for(let i = 0; i < stack_length; i++){ - if(SUPPORT_FILTER){ + const job = stack[i]; - /** @export */ - FatPrototype.filter = function(obj, styles, config, callback){ + if((job.obj === obj) && (!style || (job.style === style))){ - if(is_string(styles)){ + obj["_fat_" + job.style + this.id] = null; + stack[i] = null; - styles = { + if(style){ - "filter": styles + break; + } } } + } + else{ - return this.animate(obj, styles, config, callback); - }; - } - - if(SUPPORT_CONTROL){ - - /** @export */ - FatPrototype.set = set; - - /** @export */ - FatPrototype.seek = seek; - - /** @export */ - FatPrototype.shift = function(ms){ - - return this.seek(0, ms); - }; - - /** @export */ - FatPrototype.pause = function(toggle){ - - this.plays = is_undefined(toggle) ? false : toggle; - return this; - }; - - /** @export */ - FatPrototype.start = function(toggle){ - - this.plays = is_undefined(toggle) ? true : toggle; - return this; - }; - - /** @export */ - FatPrototype.play = FatPrototype.start; - - /** @export */ - FatPrototype.speed = function(ratio){ - - this.ratio = ratio; - return this; - }; - - /** @export */ - FatPrototype.reset = function(){ - - this.ratio = 1; - this.direction = true; - return this.seek(0); - }; - - /** @export */ - FatPrototype.finish = function(){ - - return this.seek(1); - }; + const styles_length = style.length; - /** @export */ - FatPrototype.reverse = function(toggle){ + for(let i = 0; i < styles_length; i++){ - this.direction = is_undefined(toggle) ? !this.direction : !toggle; - return this; - }; + this.remove(obj[a], style[i]); + } + } } - } - - if(SUPPORT_TRANSITION){ - - /** @export */ - FatPrototype.transition = transition; - } - - if(SUPPORT_NATIVE){ - /** @export */ - FatPrototype.native = native; + return this; } /** - * @param progress - * @param {number=} shift + * @param {CSSStyleDeclaration} css + * @param {string} key + * @param {string} value + * @param {boolean=} force */ - function seek(progress, shift){ + function set_style(css, key, value, force){ - const stack = this.stack; - const no_shift = is_undefined(shift); - const direction = this.direction; + if(force){ - for(let i = 0, len = stack.length; i < len; i++){ + css.setProperty(key, value, "important"); + } + else{ - const job = stack[i]; + css.setProperty(key, value); + } - job.time = ( + // Note: Edge actually do not apply style changes when passing void 0: + // css.setProperty(key, value, force ? "important" : void 0); + } - no_shift ? + /** + * @param {string} string + * @returns {string} + */ - (direction ? progress : 1 - progress) * job.duration - : - (direction ? shift : job.duration - shift) - ); - } + function camel_to_snake(string) { - return this; + return string.replace(/([A-Z])/g, "-$1").toLowerCase(); } function get_nodes(obj){ @@ -1463,17 +1400,20 @@ function render_frames(time){ - let len = this.stack.length; - let len_paint = SUPPORT_PAINT && this.paint_stack.length; + const stack = this.stack; + const paint_stack = this.paint_stack; + const len = stack.length; + const len_paint = SUPPORT_PAINT && paint_stack.length; if(len || len_paint){ this.exec = requestAnimationFrame(this.render); - this.last_update || (this.last_update = time); + + const last_update = this.last_update || (this.last_update = time); if(SUPPORT_CONTROL && this.fps){ - if((time - this.last_update + 1) < (1000 / this.fps)){ + if((time - last_update + 1) < (1000 / this.fps)){ return; } @@ -1498,7 +1438,7 @@ for(let i = 0; i < len; i++){ - const current_job = this.stack[i]; + const current_job = stack[i]; if(current_job){ @@ -1506,7 +1446,7 @@ if(!current_job.render_job(this, time)){ - this.stack[i] = null; + stack[i] = null; } } } @@ -1516,17 +1456,17 @@ for(let i = 0; i < len_paint; i++){ - const current_paint = this.paint_stack[i]; + const current_paint = paint_stack[i]; if(current_paint){ in_progress = true; - if(!current_paint._delay || ((current_paint._delay -= (time - this.last_update)) <= 0)){ + if(!current_paint._delay || ((current_paint._delay -= (time - last_update)) <= 0)){ if(!current_paint(time)){ - this.paint_stack[i] = null; + paint_stack[i] = null; } } } @@ -1577,7 +1517,6 @@ /** * @param {string|number} from * @param {string|number} to - * @param {string} unit * @param {boolean} force * @param {number|string|Function} duration * @param {string} ease_str @@ -1590,7 +1529,7 @@ * @param {string=} style_group */ - JobPrototype.update_job = function(from, to, unit, force, duration, ease_str, callback, step, delay, transform, filter, color, style_group){ + JobPrototype.update_job = function(from, to, /*unit,*/ force, duration, ease_str, callback, step, delay, transform, filter, color, style_group){ if(is_undefined(from)){ @@ -1740,9 +1679,8 @@ if(style === "scrollTop"){ - to *= (obj.scrollHeight - obj.clientHeight) / 100; + to *= (obj.scrollHeight - obj.clientHeight) / 100; unit = ""; - } else if(style === "scrollLeft"){ @@ -1754,7 +1692,7 @@ if(!unit){ - unit = style_from.substring(("" + from).length) || ""; + unit = style_from.substring(("" + from).length); } const job = SUPPORT_TRANSFORM || SUPPORT_COLOR || SUPPORT_FILTER ? (new Job( @@ -1900,7 +1838,11 @@ if(style_order){ - style_order[style_order.length] = transform_group; + if(!style_prop[transform_group]){ + + style_order[style_order.length] = transform_group; + style_prop[transform_group] = 1; + } } return style_prop; @@ -2312,7 +2254,7 @@ const values = substring_match(style_matrix, "(", ")").split(','); - return parseFloat(values[matrix2d_index[style]]) || ""; + return parseFloat(values[matrix2d_index[style]]) || 0; } function parse_keyframes(styles, style_keys, style_length, config_duration){ @@ -2353,6 +2295,12 @@ return sequences; } + // TODO: + // dynamic values { style: function() } + // tween object properties + // convert units (support getting styles in desired unit) + // support easing steps { ease: 5 } + /** * @param {Array<(Node|null)>|Node|NodeList|string|null} obj * @param {Object|Array|string|Array} styles @@ -2668,16 +2616,6 @@ let from; let unit; - if(typeof value === "object"){ - - config_delay = value["delay"] || config_delay; - config_duration = value["duration"] || config_duration; - config_ease = value["ease"] || config_ease; - from = value["from"]; - unit = value["unit"]; - value = value["to"]; - } - if(SUPPORT_TRANSFORM){ if(key === "transform"){ @@ -2754,6 +2692,15 @@ unit = value[2]; value = value[1]; } + else if(typeof value === "object"){ + + config_delay = value["delay"] || config_delay; + config_duration = value["duration"] || config_duration; + config_ease = value["ease"] || config_ease; + from = value["from"]; + unit = value["unit"]; + value = value["to"]; + } const last = (k === style_length - 1); const job_id = "_fat_" + key + this.id; @@ -2812,7 +2759,7 @@ from, value, - unit, + //unit, config_force, config_duration, config_ease, @@ -2831,7 +2778,7 @@ from, value, - unit, + //unit, config_force, config_duration, config_ease, @@ -2933,200 +2880,325 @@ function cancel(id){ - if(this.paint_stack[id]){ - - this.paint_stack[id] = null; - } + this.paint_stack[id] = null; } - /** - * @param {Array<(Node|null)>|Node|NodeList|string|null} obj - * @param {Object} styles - * @param {Object} config - */ + const FatPrototype = Fat.prototype; - function transition(obj, styles, config){ + if(SUPPORT_ANIMATE){ - if(obj && styles){ + FatPrototype.create_job = create_job; + /** @export */ + FatPrototype.animate = animate; + /** @export */ + FatPrototype.destroy = destroy; + //FatPrototype.init = init; + /** @export */ + FatPrototype.create = function(config){ - config || (config = {}); + return new Fat(config); + }; - obj = get_nodes(obj); + if(SUPPORT_PAINT){ - const style_keys = Object.keys(styles); - const style_length = style_keys.length; - const config_duration = (config["duration"] || 400) + "ms"; - const config_ease = config["ease"] || "linear"; - const config_callback = config["callback"] || false; - // TODO: - //const config_step = config["step"] || false; - const config_delay = (config["delay"] || 0) + "ms"; - const config_force = config["force"]; + /** @export */ + FatPrototype.paint = paint; + /** @export */ + FatPrototype.cancel = cancel; + } - for(let i = 0; i < style_length; i++){ + if(SUPPORT_EASING){ - const current_style = style_keys[i]; + /** @export */ + FatPrototype.ease = easing; + } - if(prefix_transform && (current_style === "transform")){ + if(SUPPORT_PRESET){ - styles[prefix_transform] = styles[current_style]; - style_keys[i] = prefix_transform; - } - else{ + /** @export */ + FatPrototype.preset = presets; + } - const snake_val = camel_to_snake(current_style); + if(SUPPORT_TRANSFORM){ - styles[snake_val] = styles[current_style]; - style_keys[i] = snake_val; - } - } + /** @export */ + FatPrototype.transform = function(obj, styles, config, callback){ - const event = prefix_transition ? prefix_transition + "End" : "transitionend"; + if(is_string(styles)){ - for(let i = 0, len = obj.length; i < len; i++){ + styles = { - const current_obj = obj[i]; - const current_listener = current_obj.current_listener; + "transform": styles + } + } - if(!config_callback || (config_callback !== current_listener)){ + return this.animate(obj, styles, config, callback); + }; + } - if(current_listener){ + if(SUPPORT_FILTER){ - current_obj.removeEventListener(event, current_listener, false); - current_obj.current_listener = null; - } + /** @export */ + FatPrototype.filter = function(obj, styles, config, callback){ - if(config_callback){ + if(is_string(styles)){ - current_obj.current_listener = config_callback; - current_obj.addEventListener(event, config_callback, false); + styles = { + + "filter": styles } } - requestAnimationFrame(function(){ + return this.animate(obj, styles, config, callback); + }; + } - const transition_str = " " + config_duration + " " + config_ease + " " + config_delay; - const props_str = style_keys.join(transition_str + ",") + transition_str; - const current_style = current_obj._style || (current_obj._style = current_obj.style); + if(SUPPORT_CONTROL){ - set_style(current_style, prefix_transition_js || "transition", props_str, config_force); + /** @export */ + FatPrototype.set = set; - for(let k = 0; k < style_length; k++){ + /** @export */ + FatPrototype.seek = seek; - const key = style_keys[k]; + /** @export */ + FatPrototype.remove = remove; - set_style(current_style, key, styles[key], config_force); - } - }); - } - } + /** @export */ + FatPrototype.shift = function(ms){ - return this; + return this.seek(0, ms); + }; + + /** @export */ + FatPrototype.pause = function(toggle){ + + this.plays = is_undefined(toggle) ? false : toggle; + return this; + }; + + /** @export */ + FatPrototype.start = function(toggle){ + + this.plays = is_undefined(toggle) ? true : toggle; + return this; + }; + + /** @export */ + FatPrototype.speed = function(ratio){ + + this.ratio = ratio; + return this; + }; + + /** @export */ + FatPrototype.reset = function(){ + + this.ratio = 1; + this.direction = true; + return this.seek(0); + }; + + /** @export */ + FatPrototype.finish = function(){ + + return this.seek(1); + }; + + /** @export */ + FatPrototype.reverse = function(toggle){ + + this.direction = is_undefined(toggle) ? !this.direction : !toggle; + return this; + }; + } } - /** - * @param {string} string - * @returns {string} - */ + if(SUPPORT_TRANSITION){ - function camel_to_snake(string) { + /** @export */ + FatPrototype.transition = transition; + } - return string.replace(/([A-Z])/g, "-$1").toLowerCase(); + if(SUPPORT_NATIVE){ + + /** @export */ + FatPrototype.native = native; } /** - * @param {CSSStyleDeclaration} css - * @param {string} key - * @param {string} value - * @param {boolean=} force + * @param {Array<(Node|null)>|Node|NodeList|string|null} obj + * @param {!Object} styles + * @param {Object} config */ - function set_style(css, key, value, force){ + function transition(obj, styles, config){ - if(force){ + if(DEBUG){ - css.setProperty(key, value, "important"); + if(!obj){ + + console.error("Element not found", obj); + } + + if(!styles){ + + console.error("Styles not found", styles); + } } - else{ - css.setProperty(key, value); + config || (config = {}); + + obj = get_nodes(obj); + + const style_keys = Object.keys(styles); + const style_length = style_keys.length; + const config_duration = (config["duration"] || 400) + "ms"; + const config_ease = config["ease"] || "linear"; + const config_callback = config["callback"] || false; + // TODO: + //const config_step = config["step"] || false; + const config_delay = (config["delay"] || 0) + "ms"; + const config_force = config["force"]; + + for(let i = 0; i < style_length; i++){ + + const current_style = style_keys[i]; + + if(prefix_transform && (current_style === "transform")){ + + styles[prefix_transform] = styles[current_style]; + style_keys[i] = prefix_transform; + } + else{ + + const snake_val = camel_to_snake(current_style); + + styles[snake_val] = styles[current_style]; + style_keys[i] = snake_val; + } } - // Note: Edge actually do not apply style changes when passing void 0: - // css.setProperty(key, value, force ? "important" : void 0); + const event = prefix_transition ? prefix_transition + "End" : "transitionend"; + + for(let i = 0, len = obj.length; i < len; i++){ + + const current_obj = obj[i]; + const current_listener = current_obj.current_listener; + + const transition_str = " " + config_duration + " " + config_ease + " " + config_delay; + const props_str = style_keys.join(transition_str + ",") + transition_str; + const current_style = current_obj._style || (current_obj._style = current_obj.style); + + set_style(current_style, prefix_transition_js || "transition", props_str, config_force); + + if(!config_callback || (config_callback !== current_listener)){ + + if(current_listener){ + + current_obj.removeEventListener(event, current_listener, false); + current_obj.current_listener = null; + } + + if(config_callback){ + + current_obj.current_listener = config_callback; + current_obj.addEventListener(event, config_callback, false); + } + } + + requestAnimationFrame(function(){ + + for(let k = 0; k < style_length; k++){ + + const key = style_keys[k]; + + set_style(current_style, key, styles[key], config_force); + } + }); + } + + return this; } /** * @param {Array<(Node|null)>|Node|NodeList|string|null} obj - * @param {Object} styles + * @param {!Object} styles * @param {Object} config */ function native(obj, styles, config){ - if(obj && styles){ + if(DEBUG){ + + if(!obj){ + + console.error("Element not found", obj); + } - config || (config = {}); + if(!styles){ - const style_keys = Object.keys(styles); + console.error("Styles not found", styles); + } + } - obj = get_nodes(obj); + config || (config = {}); - const config_duration = (config["duration"] || 400); - const config_ease = config["ease"] || "linear"; - const config_callback = config["callback"]; - // TODO: - //const config_step = config["step"]; - const config_cancel = config["cancel"]; - const config_delay = (config["delay"] || 0); - const style_length = style_keys.length; + const style_keys = Object.keys(styles); - for(let i = 0, len = obj.length; i < len; i++){ + obj = get_nodes(obj); - const current_obj = obj[i]; - const styles_arr = {}; + const config_duration = (config["duration"] || 400); + const config_ease = config["ease"] || "linear"; + const config_callback = config["callback"]; + // TODO: + //const config_step = config["step"]; + //const config_cancel = config["cancel"]; + const config_delay = (config["delay"] || 0); + const style_length = style_keys.length; - for(let k = 0; k < style_length; k++){ + for(let i = 0, len = obj.length; i < len; i++){ - const key = style_keys[k]; + const current_obj = obj[i]; + const styles_arr = {}; - styles_arr[key] = [ + for(let k = 0; k < style_length; k++){ - get_style(current_obj, key), - styles[key] - ]; - } + const key = style_keys[k]; - const anim = current_obj.animate(styles_arr, { + styles_arr[key] = [ - delay: config_delay, - duration: config_duration, - ease: config_ease - }); + get_style(current_obj, key), + styles[key] + ]; + } - if(config_callback){ + current_obj.animate(styles_arr, { - anim.onfinish = function(){ + delay: config_delay, + duration: config_duration, + ease: config_ease - for(let k = 0; k < style_length; k++){ + }).onfinish = function(){ - const key = style_keys[k]; + for(let k = 0; k < style_length; k++){ - set_style(current_obj._style, key, styles[key]); - } + const key = style_keys[k]; - config_callback.call(current_obj); - }; + set_style(current_obj._style, key, styles[key]); } - if(config_cancel){ - - anim.oncancel = function(){ + if(config_callback){ - config_cancel.call(current_obj); - }; + config_callback.call(current_obj); } - } + }; + + // if(config_cancel){ + // anim.oncancel = function(){ + // config_cancel.call(current_obj); + // }; + // } } return this; diff --git a/fat.light.js b/fat.light.js index 8c4c07c..85cae7d 100644 --- a/fat.light.js +++ b/fat.light.js @@ -1,14 +1,14 @@ /* - FAT v0.6.5 + FAT v0.6.6 Copyright 2019 Nextapps GmbH Author: Thomas Wilkerling Released under the Apache 2.0 Licence https://github.com/nextapps-de/fat */ -'use strict';(function(p,h,r){var m;(m=r.define)&&m.amd?m([],function(){return h}):(m=r.modules)?m[p.toLowerCase()]=h:"object"===typeof exports?module.exports=h:r[p]=h})("Fat",function(){function p(a,c,b,d,e,g,n,f,l,h,x,t){this.i=a;this.B=a.j;this.style=c;this.G=c.replace(/([A-Z])/g,"-$1").toLowerCase();this.o=d;this.s=e;this.c=d;this.H=g;this.m=n;this.duration=f;this.h=l;this.ease=m(l)?[]:null;this.time=0;this.g=h;this.f=x;this.F=b;this.a=t;this.D="px"!==g}function h(){this.id=++B;this.stack=[]; -this.u=r.bind(this);this.exec=this.b=0}function r(a){var c=this.stack.length;if(c){this.exec=requestAnimationFrame(this.u);this.b||(this.b=a);var b=!1;if(c)for(var d=0;d=e;if(!n)if(c)var f= -d;else{var l;if(l=this.ease)f=l.length?(d-b)*l[y/e*a+.5>>0]/1E4:(d-b)*a/e;else if(l=this.h)f=1===l.length?l(a/e):l(a,b,d,e);f=b+f;f=this.D?(f*y+.5>>0)/y:f+.5>>0}b=this.style;n||this.c===f||(this.c=f,"custom"!==b&&this.A(f+=this.H));this.f&&this.f.call(g,c?1:a/e,f);c&&(this.time=-1,this.g&&this.g.call(g))};w.C=function(a,c){if(-1===this.time)this.i[this.F]=null;else{var b=c-a.b;if(this.a)if("view"===this.a)if(b=this.i.getBoundingClientRect(),0<=b.top&&b.bottom<=window.innerHeight)this.a=0;else return!0; -else{if(0<(this.a-=b))return!0;this.a=0}this.animate(c,a.b);return!0}};w.A=function(a){var c=this.B,b=this.G;this.m?c.setProperty(b,a,"important"):c.setProperty(b,a)};var v=h.prototype;v.w=function(a,c,b,d,e,g,n,f,l,h,x,t){if("custom"===c)d=d||0;else{var q=a.j||(a.j=a.style);d=(d="undefined"===typeof d?q[c]:d)?d:(a.l||(a.l=getComputedStyle(a)))[c]}q=""+d;"auto"===q&&(q="0");d=u(q);if(m(e)){var k=e;e=u(e);g||(g=k.substring((""+e).length))}g||(g=q.substring((""+d).length)||"");c=new p(a,c,b,d,e,g,n, -f,l,h,x,t,!1,!1,!1);this.stack[this.stack.length]=c;a[b]=c};v.animate=function(a,c,b,d){b?"function"===typeof b&&(d=b,b={}):b={};m(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=b.delay,g=b.duration||400,n=b.ease||"",f=Object.keys(c),l=f.length;d=d||b.callback||!1;var h=b.step,x=b.force;b=b.init;for(var t=0;t=e;if(!u)if(c)var g=d;else{var m; +if(m=this.ease)g=m.length?(d-b)*m[w/e*a+.5>>0]/1E4:(d-b)*a/e;else if(m=this.h)g=1===m.length?m(a/e):m(a,b,d,e);g=b+g;g=this.D?(g*w+.5>>0)/w:g+.5>>0}b=this.style;u||this.c===g||(this.c=g,g+=this.H,"custom"!==b&&this.A(g));this.f&&this.f.call(f,c?1:a/e,g);c&&(this.time=-1,this.g&&this.g.call(f))};h.C=function(a,c){if(-1===this.time)this.i[this.F]=null;else{var b=c-a.b;if(this.a)if("view"===this.a)if(b=this.i.getBoundingClientRect(),0<=b.top&&b.bottom<=window.innerHeight)this.a=0;else return!0;else{if(0< +(this.a-=b))return!0;this.a=0}this.animate(c,a.b);return!0}};h.A=function(a){var c=this.B,b=this.G;this.m?c.setProperty(b,a,"important"):c.setProperty(b,a)};h.v=function(a,c,b,d,e,f,u,g){"undefined"===typeof a?a=this.c:a=v(a);n(c)&&(c=v(c));this.o=a;this.s=c;this.duration=d;this.time=0;this.m=b;this.h!==e&&(this.ease=n(e)?[]:null,this.h=e);this.g=f;this.f=u;this.a=g};h=l.prototype;h.w=function(a,c,b,d,e,f,u,g,m,h,l,r){if("custom"===c)d=d||0;else{var q=a.j||(a.j=a.style);d=(d="undefined"===typeof d? +q[c]:d)?d:(a.l||(a.l=getComputedStyle(a)))[c]}q=""+d;"auto"===q&&(q="0");d=v(q);if(n(e)){var k=e;e=v(e);f||(f=k.substring((""+e).length))}f||(f=q.substring((""+d).length));c=new t(a,c,b,d,e,f,u,g,m,h,l,r,!1,!1,!1);this.stack[this.stack.length]=c;a[b]=c};h.animate=function(a,c,b,d){b?"function"===typeof b&&(d=b,b={}):b={};n(a)?a=document.querySelectorAll(a):a.length||(a=[a]);var e=b.delay,f=b.duration||400,h=b.ease||"",g=Object.keys(c),m=g.length;d=d||b.callback||!1;var l=b.step,t=b.force;b=b.init; +for(var r=0;rf?f*(1+g):f+g-f*g,e=2*f-a,g=A(e,a,c+1/3),f=A(e,a,c),a=A(e,a,c-1/3)),c=255*g+.5>>0,g=255*f+ -.5>>0,f=255*a+.5>>0);a={};a[b+"R"]=c;a[b+"G"]=g;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function A(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function y(a){this.id=++ka;this.stack=[];this.H=la.bind(this);this.exec=this.f=0;this.l=[];this.P=a&&a.fps;this.G=!a||!1!==a.play;this.direction=!0;this.ratio=1}function V(a){M(a)?a=document.querySelectorAll(a):a.length||(a=[a]);return a}function ba(a){if(M(a))if(a){var b;if(!(b=ca[a])){if(b=O[a]||(O[a]=W.apply(W,ma[a]))){for(var c= -new (Int16Array||Array)(E),d=0;d>0;b=c}else b=[];b=ca[a]=b}a=b}else a=[];else a=null;return a}function la(a){var b=this.stack.length,c=this.l.length;if(b||c)if(this.exec=requestAnimationFrame(this.H),this.f||(this.f=a),!(this.P&&a-this.f+1<1E3/this.P)){var d=!1;if(b){Z&&(T?T===this.id&&(X={}):(X={},T=this.id));for(var e=0;e=(e.F-=a-this.f))e(a)||(this.l[b]= -null);this.f=a;d||this.destroy()}}function M(a){return"string"===typeof a}function u(a){return"undefined"===typeof a}function da(a,b,c){b=D(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function J(a,b,c){if("scrollTop"===b||"scrollLeft"===b)return u(c)?a[b]:c;if("custom"===b)return c||0;var d=a.o||(a.o=a.style);return(c=u(c)?d[b]:c)?c:(a.M||(a.M=getComputedStyle(a)))[b]}function ea(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"=== -b?1:0,d&&(d[d.length]=b),c;-1!==b.indexOf("matrix")&&(b=I(b,"(",")").split(","),b=a+"("+(parseFloat(b[na[a]])||"")+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,g=0;g(""+b).length)return c[a]= -b,d&&(d[d.length]=a),c;a=b.split(" ");b={};for(var e=0,g=0;g>0}e[g]=f}return e}function P(a){return a.replace(/([A-Z])/g,"-$1").toLowerCase()}function z(a,b,c,d){d?a.setProperty(b,c,"important"):a.setProperty(b,c)}var E=Math.max(screen.width,screen.height),ca={},O={},X,r=function(){var a=getComputedStyle(document.body);if(u(a.transform))for(var b=["webkit","moz","ms","o"],c=0,d;cd;++d){var e=this.w(b,this.a,this.b);if(0===e)break;b-=(this.s(b,this.a,this.b)-a)/e}return b};a.prototype.B=function(a){return 0===a||1===a||this.a===this.u&&this.b===this.v?a:this.s(this.A(a),this.u,this.v)};return function(b,c,d,e){b=new a(b,c,d,e);return b.B.bind(b)}}(),q={fadeIn:{opacity:1},fadeOut:{opacity:0},fadeToggle:{opacity:"!=1"},slideInLeft:{translateX:0},slideOutLeft:{translateX:"-100%"}, -slideToggleLeft:{translateX:"!=-100%"},slideOutRight:{translateX:"100%"},slideToggleRight:{translateX:"!=100%"},slideInTop:{translateY:0},slideOutTop:{translateY:"-100%"},slideToggleTop:{translateY:"!=-100%"},slideOutBottom:{translateY:"100%"},slideToggleBottom:{translateY:"!=100%"},zoomIn:{scaleX:1,scaleY:1},zoomOut:{scaleX:0,scaleY:0},zoomToggle:{scaleX:"!=1",scaleY:"!=1"}};q.slideUp=q.slideOutTop;q.slideDown=q.slideOutBottom;q.slideIn=q.slideInBottom=q.slideInTop;q.slideInRight=q.slideInLeft;q.rollIn= -{rotateZ:"0deg"};q.rollOut={rotateZ:"720deg"};q.rollToggle={rotateZ:"!=720deg"};q.blurIn={blur:"0em"};q.blurOut={blur:"5em"};q.blurToggle={blur:"!=5em"};q.scrollUp={scrollTop:0};q.scrollDown={scrollTop:"100%"};q.scrollLeft={scrollLeft:0};q.scrollRight={scrollLeft:"100%"};r=N.prototype;r.animate=function(a,b,c,d){var e=this.s,g=this.K,f=this.duration,h=this.a,l=this.S,m=e===g||l&&X[l];d=c*(d?1:-1);(c=0>d)&&0===this.time&&(this.time=f);a=this.time+=(a-(b||a))*d;b=c?0>=a:a>=f;if(!m)if(l&&(X[l]=1),b)var k= -c?e:g;else{if(l=this.ease)k=l.length?(g-e)*l[E/f*a+.5>>0]/1E4:(g-e)*a/f;else if(l=this.w)k=1===l.length?l(a/f):l(a,e,g,f);k=e+k;k=this.W?(k*E+.5>>0)/E:k+.5>>0}e=this.style;m||this.i===k||(this.i=k,this.transform?h.D[e]=k+this.g:this.filter?h.C[e]=k+this.g:this.B?h["_"+this.J][e]=k:"custom"!==e&&this.T(e,k+=this.g));e===this.transform?k=this.Z():e===this.filter?k=this.V():e===this.B&&(k=this.U(this.J));this.u&&this.u.call(h,b?c?0:1:a/f,k);if(b&&(this.time=-1,this.j)){if(f=h[this.I])if(this.R--){if(m= -c?--h[this.A]:++h[this.A],0>m||m>=f.length)if(h[this.A]=m=c?f.length-1:0,mn;n++){var R=n.toString(16);R.length%2&&(R="0"+R);H[R]=n;Y[n]=R}r.Z=function(){for(var a=this.a.D,b=this.v,c=this.a.N,d="",e=0,g=c.length;e< -g;e++){var f=c[e],h="scale"===f?1:0,l=a[f+"X"],m=a[f+"Y"],k=a[f+"Z"];if(l||m||k)"rotate"===f&&(l&&(d+=f+"X("+(l||h)+") "),m&&(d+=f+"Y("+(m||h)+") ")),k&&D(k)!==h?d="rotate"===f?d+(f+"Z("+(k||h)+") "):d+(f+"3d("+(l||h)+","+(m||h)+","+k+") "):"rotate"!==f&&(d+=f+"("+(l||h)+","+(m||h)+") ")}z(b,ta||"transform",d,this.b);return a};r.V=function(){for(var a=this.a.C,b=this.a.L,c="",d=0,e=b.length;d>0,g=2.55*g+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));z(c,d,1===a||u(a)?"#"+Y[e]+Y[g]+Y[f]:"rgba("+e+","+g+","+f+","+a+")",this.b);return b};n=y.prototype;n.aa=function(a,b,c,d,e,g,f,h,l,m,k,n,q,r,B,x,L,u,y){var C=""+(x?oa:L?pa:u?qa:J)(a,b,d,y);"auto"===C&&(C="0");d=D(C);if(M(e)){var p=e;e="="===e[1]?da(d,p=e.substring(2),e[0]):D(e);g||(g=p.substring((""+e).length)); -"%"===g&&("scrollTop"===b?(e*=(a.scrollHeight-a.clientHeight)/100,g=""):"scrollLeft"===b&&(e*=(a.scrollWidth-a.clientWidth)/100,g=""))}g||(g=C.substring((""+d).length)||"");b=new N(a,b,c,d,e,g,f,h,l,m,k,n,q,r,B,x,L,u,y);this.stack[this.stack.length]=b;r||(a[c]=b)};n.animate=function(a,b,c,d){if(b.constructor===Array){var e=b;b=b[0]}if(M(b))if(-1===b.indexOf(" "))b=q[b];else{b=b.split(" ");for(var g={},f=0,h=b.length;ft){v=b[p];"object"===typeof v&&(v=v.to);v=S(v,p);var A=w=void 0;l[m++]=w=p+"R";b[w]=v[w];l[m++]=w=p+"G";b[w]=v[w];l[m++]=w=p+"B";b[w]=v[w];u(A=v[w=p+"A"])?p+="B":(l[m++]=w,b[w]=A,p=w);t*=-1}L||1!==t?C||2!==t?D||3!==t||(D=p):C=p:L=p}}z="_seq_"+ -this.id;for(p=0;pK)continue;1===K?(A=L,E="color"):2===K?(H=C,E="backgroundColor"):3===K&&(I=D,E="borderColor")}if("scroll"===F)v=void 0,l[m++]=v="scrollLeft",b[v]=t[0],l[m++]=v="scrollTop",b[v]=t[1];else{t.constructor===Array&& -(J=t[0],N=t[2],t=t[1]);K=p===m-1;for(var P="_fat_"+F+this.id,O=0,T=a.length;Of?f*(1+g):f+g-f*g,e=2*f-a,g=E(e,a,c+1/3),f=E(e,a,c),a=E(e,a,c-1/3)),c=255*g+.5>>0,g=255*f+ +.5>>0,f=255*a+.5>>0);a={};a[b+"R"]=c;a[b+"G"]=g;a[b+"B"]=f;-1!==d&&(a[b+"A"]=d);return a}function E(a,b,c){0>c?c+=1:1c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}function F(a){this.id=++ma;this.stack=[];this.I=na.bind(this);this.exec=this.h=0;this.B=[];this.O=a&&a.fps;this.H=!a||!1!==a.start;this.direction=!0;this.ratio=1}function A(a,b,c,d){d?a.setProperty(b,c,"important"):a.setProperty(b,c)}function N(a){return a.replace(/([A-Z])/g,"-$1").toLowerCase()}function U(a){I(a)?a= +document.querySelectorAll(a):a.length||(a=[a]);return a}function da(a){if(I(a))if(a){var b;if(!(b=ea[a])){if(b=T[a]||(T[a]=Y.apply(Y,oa[a]))){for(var c=new (Int16Array||Array)(J),d=0;d>0;b=c}else b=[];b=ea[a]=b}a=b}else a=[];else a=null;return a}function na(a){var b=this.stack,c=this.B,d=b.length,e=c.length;if(d||e){this.exec=requestAnimationFrame(this.I);var g=this.h||(this.h=a);if(!(this.O&&a-g+1<1E3/this.O)){var f=!1;if(d){ba&&(P?P===this.id&&(Z={}):(Z={},P=this.id)); +for(var h=0;h=(d.G-=a-g))d(a)||(c[b]=null);this.h=a;f||this.destroy()}}}function I(a){return"string"===typeof a}function t(a){return"undefined"===typeof a}function fa(a,b,c){b=z(b);"+"===c?b=a+b:"-"===c?b=a-b:"*"===c?b*=a:"/"===c?b=a/b:"!"===c&&(b=a===b?0:b);return b}function L(a,b,c){if("scrollTop"===b||"scrollLeft"===b)return t(c)?a[b]:c;if("custom"===b)return c||0;var d=a.i||(a.i=a.style);return(c= +t(c)?d[b]:c)?c:(a.L||(a.L=getComputedStyle(a)))[b]}function ha(a,b,c,d){if("none"===b)return b=a.substring(0,a.length-1),c[a]="scale"===b?1:0,d&&!c[b]&&(d[d.length]=b,c[b]=1),c;-1!==b.indexOf("matrix")&&(b=B(b,"(",")").split(","),b=a+"("+(parseFloat(b[pa[a]])||0)+")");a=b.replace(/, /g,",").split(" ");b={};for(var e=0,g=0;g(""+b).length)return c[a]=b,d&&(d[d.length]=a),c;a=b.split(" ");b={};for(var e=0,g=0;g>0}e[g]=f}return e}var J=Math.max(screen.width,screen.height),ea={},T={},Z,l=function(){var a=getComputedStyle(document.body);if(t(a.transform))for(var b=["webkit","moz","ms","o"],c=0,d;cd;++d){var e=this.v(b,this.a,this.c);if(0===e)break;b-=(this.m(b,this.a,this.c)-a)/e}return b};a.prototype.A=function(a){return 0===a||1===a||this.a===this.o&&this.c===this.s?a:this.m(this.w(a),this.o,this.s)};return function(b,c,d,e){b=new a(b,c,d,e);return b.A.bind(b)}}(),q={fadeIn:{opacity:1},fadeOut:{opacity:0},fadeToggle:{opacity:"!=1"}, +slideInLeft:{translateX:0},slideOutLeft:{translateX:"-100%"},slideToggleLeft:{translateX:"!=-100%"},slideOutRight:{translateX:"100%"},slideToggleRight:{translateX:"!=100%"},slideInTop:{translateY:0},slideOutTop:{translateY:"-100%"},slideToggleTop:{translateY:"!=-100%"},slideOutBottom:{translateY:"100%"},slideToggleBottom:{translateY:"!=100%"},zoomIn:{scaleX:1,scaleY:1},zoomOut:{scaleX:0,scaleY:0},zoomToggle:{scaleX:"!=1",scaleY:"!=1"}};q.slideInBottom=q.slideInTop;q.slideInRight=q.slideInLeft;q.rollInLeft= +q.rollInRight={rotateZ:"0deg"};q.rollOutRight={rotateZ:"720deg"};q.rollOutLeft={rotateZ:"-720deg"};q.rollToggleRight={rotateZ:"!=720deg"};q.rollToggleLeft={rotateZ:"!=-720deg"};q.blurIn={blur:"0em"};q.blurOut={blur:"5em"};q.blurToggle={blur:"!=5em"};q.scrollUp={scrollTop:0};q.scrollDown={scrollTop:"100%"};q.scrollLeft={scrollLeft:0};q.scrollRight={scrollLeft:"100%"};l=O.prototype;l.animate=function(a,b,c,d){var e=this.j,g=this.S,f=this.duration,h=this.b,k=this.R,n=e===g||k&&Z[k];d=c*(d?1:-1);(c=0> +d)&&0===this.time&&(this.time=f);a=this.time+=(a-(b||a))*d;b=c?0>=a:a>=f;if(!n)if(k&&(Z[k]=1),b)var m=c?e:g;else{if(k=this.ease)m=k.length?(g-e)*k[J/f*a+.5>>0]/1E4:(g-e)*a/f;else if(k=this.o)m=1===k.length?k(a/f):k(a,e,g,f);m=e+m;m=this.W?(m*J+.5>>0)/J:m+.5>>0}e=this.style;n||this.c===m||(this.c=m,this.transform?h.F[e]=m+this.v:this.filter?h.D[e]=m+this.v:this.w?h["_"+this.J][e]=m:(m+=this.v,"custom"!==e&&this.T(e,m)));e===this.transform?m=this.Z():e===this.filter?m=this.V():e===this.w&&(m=this.U(this.J)); +this.l&&this.l.call(h,b?c?0:1:a/f,m);if(b&&(this.time=-1,this.f)){if(n=h[this.A])if(this.P--){if(f=c?--h[this.s]:++h[this.s],n=n.length,0>f||f>=n)if(h[this.s]=f=c?n-1:0,fW;W++){var X=W.toString(16);X.length%2&&(X="0"+X);H[X]=W; +aa[W]=X}l.Z=function(){for(var a=this.b.F,b=this.m,c=this.b.M,d="",e=0,g=c.length;e>0,g=2.55*g+.5>>0,f=2.55*f+.5>>0,a&&(a/=100));A(c,d,1===a||t(a)?"#"+aa[e]+aa[g]+aa[f]:"rgba("+e+","+g+","+f+","+a+")",this.a);return b};l.$=function(a,b,c,d,e,g,f,h,k,n,m,l){t(a)?a=this.c:a=z(a);I(b)&&(b="="===b[1]?fa(a,b.substring(2),b[0]):z(b));this.j=a;this.S=b;this.duration= +d;this.time=0;this.a=c;this.o!==e&&(this.ease=da(e),this.o=e);this.f=g;this.l=f;this.g=h;k&&(this.transform=k);m&&(this.w=m,this.J=l);n&&(this.filter=n)};l=F.prototype;l.aa=function(a,b,c,d,e,g,f,h,k,l,m,q,t,x,y,v,S,G,M){var n=""+(v?qa:S?ra:G?sa:L)(a,b,d,M);"auto"===n&&(n="0");d=z(n);if(I(e)){var p=e;e="="===e[1]?fa(d,p=e.substring(2),e[0]):z(e);g||(g=p.substring((""+e).length));"%"===g&&("scrollTop"===b?(e*=(a.scrollHeight-a.clientHeight)/100,g=""):"scrollLeft"===b&&(e*=(a.scrollWidth-a.clientWidth)/ +100,g=""))}g||(g=n.substring((""+d).length));b=new O(a,b,c,d,e,g,f,h,k,l,m,q,t,x,y,v,S,G,M);this.stack[this.stack.length]=b;x||(a[c]=b)};l.animate=function(a,b,c,d){if(b.constructor===Array){var e=b;b=b[0]}if(I(b))if(-1===b.indexOf(" "))b=q[b];else{b=b.split(" ");for(var g={},f=0,h=b.length;fr){u=b[p];"object"===typeof u&&(u=u.to);u=R(u,p);var A=w=void 0;k[n++]=w=p+"R";b[w]=u[w];k[n++]=w=p+"G";b[w]=u[w];k[n++]=w=p+"B";b[w]=u[w];t(A=u[w=p+"A"])?p+="B":(k[n++]=w,b[w]=A,p=w);r*=-1}S||1!==r?G||2!==r?M||3!==r||(M=p):G=p:S=p}}z="_seq_"+this.id;for(p=0;pK)continue;1===K?(A=S,B="color"):2===K?(E=G,B="backgroundColor"):3===K&&(H=M,B="borderColor")}if("scroll"===C)u=void 0,k[n++]=u="scrollLeft",b[u]=r[0],k[n++]=u="scrollTop",b[u]=r[1];else{r.constructor===Array?(J=r[0],L=r[2],r=r[1]):"object"===typeof r&&(g=r.delay||g,f=r.duration||f,h=r.ease||h,J=r.from,L=r.unit,r=r.to);K=p===n-1;for(var O="_fat_"+C+this.id,N=0,T=a.length;N - Test: Parallel + Test: Concurrency -
1

+
3

1



Speed: @@ -38,9 +38,9 @@ window.scene = Fat.animate("#square_1", [{ - left: {from: "0%", to: "50%"} + left: { from: "0%", to: "50%" } },{ - left: {from: "50%", to: "0%"} + left: { from: "50%", to: "0%" } }],{ loop: -1, duration: 20000, @@ -49,14 +49,13 @@ } }); - // ----------------------------------------------------------- - window.scene2 = Fat.create({play: true}).animate("#square_2", [{ + window.scene2 = Fat.create().animate("#square_2", [{ - left: "50%" + left: [0, 50, "%"] },{ - left: 0 + left: [50, 0, "%"] }],{ loop: -1, duration: 20000, @@ -70,11 +69,11 @@ // ----------------------------------------------------------- - var scene3 = Fat.create({play: false}).animate("#square_3", [{ + var scene3 = Fat.create({start: false}).animate("#square_3", [{ - left: "50%" + left: "!=50%" },{ - left: 0 + left: "!=0%" }],{ loop: -1, duration: 20000, diff --git a/test/effects.html b/test/presets.html similarity index 72% rename from test/effects.html rename to test/presets.html index 928362e..b23c0a5 100644 --- a/test/effects.html +++ b/test/presets.html @@ -2,7 +2,7 @@ - Test: Effects + Test: Presets (Effects) @@ -31,6 +31,7 @@
1

2

3

+
4

\ No newline at end of file diff --git a/test/update.html b/test/update.html index 1941745..8ae1f3f 100644 --- a/test/update.html +++ b/test/update.html @@ -32,7 +32,7 @@ setTimeout(function(){ - Fat.update("#square_1", { + Fat.set("#square_1", { left: "40%" }); @@ -41,7 +41,7 @@ setTimeout(function(){ - Fat.update("#square_1", { + Fat.set("#square_1", { left: -40 });