blobs/v2/animate/index.js

Random blob generation and animation

!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((n="undefined"!=typeof globalThis?globalThis:n||self).blobs2Animate={})}(this,function(n){"use strict";var d=function(){return(d=Object.assign||function(n){for(var t,e=1,r=arguments.length;e<r;e++)for(var a in t=arguments[e])Object.prototype.hasOwnProperty.call(t,a)&&(n[a]=t[a]);return n}).apply(this,arguments)};function u(n){return{x:n.x,y:n.y,handleIn:d({},n.handleIn),handleOut:d({},n.handleOut)}}function i(n,t){return n.x===t.x&&n.y===t.y}function o(n,t){var e=t.x-n.x,t=-t.y+n.y;return(n=Math.atan2(t,e))<0?Math.abs(n):2*Math.PI-n}function h(n,t){return{angle:o(n,t),length:Math.sqrt(Math.pow(t.x-n.x,2)+Math.pow(t.y-n.y,2))}}function s(n,t,e){var r,a,i,o,l;return n<2?[t,e]:(r=1/n,e=e,(a=u(t=t)).handleOut.length*=r,(i=u(e)).handleIn.length*=1-r,t=y(t,t.handleOut),e=y(e,e.handleIn),o=y(a,a.handleOut),l=y(i,i.handleIn),t=g(r,t,e),e=g(r,o,t),o=g(1-r,l,t),l=g(r,e,o),r=(t=[a,{x:l.x,y:l.y,handleIn:h(l,e),handleOut:h(l,o)},i])[0],a=t[1],e=t[2],2===n?[r,a,e]:function(n,t,e){if(e||2===arguments.length)for(var r,a=0,i=t.length;a<i;a++)!r&&a in t||((r=r||Array.prototype.slice.call(t,0,a))[a]=t[a]);return n.concat(r||Array.prototype.slice.call(t))}([r],s(n-1,a,e),!0))}function c(n,t){return(n%t+t)%t}function f(n,t){return Math.sqrt(Math.pow(n.x-t.x,2)+Math.pow(n.y-t.y,2))}function g(n,t,e){return{x:b(n,t.x,e.x),y:b(n,t.y,e.y)}}function m(n){var r=new Path2D;return n.length<1||(r.moveTo(n[0].x,n[0].y),p(n,function(n){var t=n.curr,n=(0,n.next)(),t=y(t,t.handleOut),e=y(n,n.handleIn);r.bezierCurveTo(t.x,t.y,e.x,e.y,n.x,n.y)})),r}var p=function(e,r){for(var n=function(n){function t(n){return u(e[c(n,e.length)])}r({curr:u(e[n]),index:n,sibling:t,prev:function(){return t(n-1)},next:function(){return t(n+1)}})},t=0;t<e.length;t++)n(t)},v=function(n,t){var e=[];return p(n,function(n){e.push(t(n))}),e},y=function(n,t){return{x:n.x+t.length*Math.cos(t.angle),y:n.y+t.length*Math.sin(t.angle)}},b=function(n,t,e){return t+n*(e-t)};const x=.5*(Math.sqrt(3)-1),I=(3-Math.sqrt(3))/6,O=n=>0|Math.floor(n),t=new Float64Array([1,1,-1,1,1,-1,-1,-1,1,0,-1,0,1,0,-1,0,0,1,0,-1,0,1,0,-1]);function w(n=Math.random){const m=function(t){var e=new Uint8Array(512);for(let n=0;n<256;n++)e[n]=n;for(let n=0;n<255;n++){var r=n+~~(t()*(256-n)),a=e[n];e[n]=e[r],e[r]=a}for(let n=256;n<512;n++)e[n]=e[n-256];return e}(n),v=new Float64Array(m).map(n=>t[n%12*2]),y=new Float64Array(m).map(n=>t[n%12*2+1]);return function(n,t){let e=0,r=0,a=0;var i=(n+t)*x,o=O(n+i),i=O(t+i),l=(o+i)*I,n=n-(o-l),t=t-(i-l);let u,h;h=t<n?(u=1,0):(u=0,1);var s,c,l=n-u+I,d=t-h+I,f=n-1+2*I,g=t-1+2*I,o=255&o,i=255&i,p=.5-n*n-t*t,p=(0<=p&&(s=o+m[i],c=v[s],s=y[s],p*=p,e=p*p*(c*n+s*t)),.5-l*l-d*d),t=(0<=p&&(c=o+u+m[i+h],n=v[c],s=y[c],p*=p,r=p*p*(n*l+s*d)),.5-f*f-g*g);return 0<=t&&(c=1+o+m[1+i],p=v[c],n=y[c],t*=t,a=t*t*(p*f+n*g)),70*(e+r+a)}}function e(n){var a,t=2*Math.PI/n.length,t=4/3*Math.tan(t/4)/Math.sin(t/2)/2;return a=t,v(n,function(n){var t=n.curr,e=n.next,n=n.prev,r=o(n(),e());return{x:t.x,y:t.y,handleIn:{angle:r+Math.PI,length:a*f(t,n())},handleOut:{angle:r,length:a*f(t,e())}}})}function r(n){return 1-Math.pow(n-1,2)}function a(t){return function(n){return Math.pow(2,-10*n)*Math.sin((n-t/4)*(2*Math.PI)/t)+1}}function M(a,n){function t(n){for(var t=0;t<i;t++){for(var e=0,r=0;r<i&&(e+=Math.pow(100*f(a[r],n[c(r+t,i)]),2),!(o<e));r++);e<=o&&(o=e,l=t,u=n)}}var e,r,i=a.length,o=1/0,l=0,u=[];return t(n),t(v(e=n,function(n){var t=n.index,n=(0,n.sibling)(e.length-t-1);return n.handleIn.angle+=Math.PI,n.handleOut.angle+=Math.PI,n})),r=l,v(u,function(n){var t=n.index;return(0,n.sibling)(t+r)})}function F(n,t){if(t.length<3)throw new Error("not enough points");if(n<t.length)throw new Error("cannot remove points");if(n===t.length)return t.slice();for(var a=[],e=(p(t,function(n){var t,e,r=n.curr,n=n.next;a.push((r=r,n=n(),t=y(r,r.handleOut),e=y(n,n.handleIn),(f(r,n)+f(t,e)+r.handleOut.length+n.handleIn.length)/2))}),function(n,t){for(var e=n.map(function(){return 1}),r=n.slice(),a=0;a<t;a++){var i=0;for(var o=1;o<r.length;o++){if(r[o]>r[i]){i=o;continue}if(r[o]===r[i])if(n[o]>n[i])i=o}e[i]++;r[i]=n[i]/e[i]}return e}(a,n-t.length)),r=[],i=0;i<t.length;i++){var o=r[r.length-1]||t[i],l=t[c(i+1,t.length)];r.pop(),r.push.apply(r,s(e[i],o,l))}return n=r.pop(),r[0].handleIn=n.handleIn,r}function P(n,a){return v(n,function(n){var t=n.index,e=n.curr,r=n.prev,n=n.next;return 0===e.handleIn.length&&i(r(),e)&&(e.handleIn.angle=a[t].handleIn.angle),0===e.handleOut.length&&i(n(),e)&&(e.handleOut.angle=a[t].handleOut.angle),e})}function S(n){return v(n,function(n){var t=n.curr,e=n.prev,n=n.next,e=o(e(),n());return 0===t.handleIn.length&&(t.handleIn.angle=e+Math.PI),0===t.handleOut.length&&(t.handleOut.angle=e),t})}function A(n,t,e){var r=2*Math.PI,t=c(t,r),e=c(e,r);return Math.abs(t-e)>Math.PI&&(t<e?t+=r:e+=r),b(n,t,e)}function j(){return String(Math.random()).substr(2)}function l(n,t,e){var r=typeof t;if("number"===r&&isNaN(t)&&(r="NaN"),!e.includes(r="object"===r&&null===t?"null":r))throw'"'.concat(n,'" should have type "').concat(e.join("|"),'" but was "').concat(r,'".')}function C(e){var n="points"in e?e.points:z(e.blobOptions);return v(n,function(n){var t,n=n.curr;return n.x+=(null==(t=null==e?void 0:e.canvasOptions)?void 0:t.offsetX)||0,n.y+=(null==(t=null==e?void 0:e.canvasOptions)?void 0:t.offsetY)||0,n})}function E(n,t){try{if("points"in n)return R(n.points);Y(n.blobOptions),D(n.canvasOptions),X(n)}catch(n){throw"(blobs2): keyframe ".concat(t,": ").concat(n)}}var k=function(n){var t,e,r,a,n=function(n){for(var t=2166136261,e=0;e<n.length;e++)t=Math.imul(t^n.charCodeAt(e),16777619);return function(){return(t=(t=(t=(t=(t+=t<<13)^t>>>7)+(t<<3))^t>>>17)+(t<<5))>>>0}}(n);return t=n(),e=n(),r=n(),a=n(),function(){var n=(t>>>=0)+(e>>>=0)|0;return t=e^e>>>9,e=(r>>>=0)+(r<<3)|0,r=(r=r<<21|r>>>11)+(n=n+(a=(a>>>=0)+1|0)|0)|0,(n>>>0)/4294967296}},T=function(n,t){return e(function(n,t){for(var e=2*Math.PI/n,r=[],a=0;a<n;a++){var i=t(a),o=Math.sin(a*e),l=Math.cos(a*e);r.push({x:.5+o*i,y:.5+l*i,handleIn:{angle:0,length:0},handleOut:{angle:0,length:0}})}return r}(n,t))},z=function(n,t){var e=t||k(String(n.seed)),r=1/(1+n.randomness/10),t=T(3+n.extraPoints,function(n){return(r+e(n)*(1-r))/2}),a=n.size;return v(t,function(n){n=n.curr;return n.x*=a,n.y*=a,n.handleIn.length*=a,n.handleOut.length*=a,n})},q={linear:function(n){return n},easeEnd:r,easeStart:function(n){return 1-r(1-n)},ease:function(n){return.5+.5*Math.sin(Math.PI*(n+1.5))},elasticEnd0:a(1),elasticEnd1:a(.64),elasticEnd2:a(.32),elasticEnd3:a(.16)},N=function(n){var t=n.renderCache,e=n.currentFrames;if(0===e.length)return{renderCache:t,lastFrameId:null,points:[]};if(1===e.length)return{renderCache:t,lastFrameId:(c=e[0]).id,points:c.initialPoints};for(var r=e[0],a=e[1],i=2;i<e.length&&!(a.timestamp>n.timestamp);i++)r=e[i-1],a=e[i];var o,l,u,h,s,c=a===e[e.length-1];return a.timestamp<n.timestamp&&c?{renderCache:t,lastFrameId:a.id,points:a.initialPoints}:(c=null==(c=t[r.id])?void 0:c.preparedStartPoints,o=null==(o=t[a.id])?void 0:o.preparedEndPoints,c&&o||(s=r.initialPoints,h=a.initialPoints,l=(u={rawAngles:!1,divideRatio:1}).divideRatio*Math.max(s.length,h.length),s=F(l,s),l=F(l,h),h=M(s,l),c=(l=[u.rawAngles?s:P(S(s),h),u.rawAngles?h:P(S(h),s)])[0],o=l[1],t[r.id]=t[r.id]||{},t[r.id].preparedStartPoints=c,t[a.id]=t[a.id]||{},t[a.id].preparedEndPoints=o),u=(n.timestamp-r.timestamp)/(a.timestamp-r.timestamp),h=Math.max(0,Math.min(1,u)),s=a.timingFunction(h),{renderCache:t,lastFrameId:(1===h?a:r).id,points:function(n,t,e){if(t.length!==e.length)throw new Error("must have equal number of points");for(var r=Math.min(1,Math.max(0,n)),a=[],i=0;i<t.length;i++)a.push(d(d({},g(n,t[i],e[i])),{handleIn:{angle:A(n,t[i].handleIn.angle,e[i].handleIn.angle),length:b(r,t[i].handleIn.length,e[i].handleIn.length)},handleOut:{angle:A(n,t[i].handleOut.angle,e[i].handleOut.angle),length:b(r,t[i].handleOut.length,e[i].handleOut.length)}}));return a}(s,c,o)})},G=function(n){var t=[];if(0!==n.newFrames.length){var e=N(n);if(null===e.lastFrameId){for(var r=n.shapeGenerator(n.newFrames[0]),a={x:0,y:0,handleIn:{angle:0,length:0},handleOut:{angle:0,length:0}},i=0,o=r;i<o.length;i++){var l=o[i];a.x+=l.x/r.length,a.y+=l.y/r.length}e.points=[a,a,a]}t.push({id:j(),initialPoints:e.points,timestamp:n.timestamp,timingFunction:q.linear,transitionSourceFrameIndex:-1,isSynthetic:!0});for(var u=0,h=0;h<n.newFrames.length;h++){var s,c=n.newFrames[h];c.delay&&(u+=c.delay,s=t[t.length-1],t.push({id:j(),initialPoints:s.initialPoints,timestamp:n.timestamp+u,timingFunction:q.linear,transitionSourceFrameIndex:h-1,isSynthetic:!0})),u+=c.duration,t.push({id:j(),initialPoints:n.shapeGenerator(c),timestamp:n.timestamp+u,timingFunction:q[c.timingFunction||"linear"],transitionSourceFrameIndex:h,isSynthetic:!1})}}return{newFrames:t}},X=function(n){l("keyframe",n,["object"]);var t=n.delay,e=n.duration,r=n.timingFunction,n=n.callback;if(l("delay",t,["number","undefined"]),t&&t<0)throw'delay is invalid "'.concat(t,'".');if(l("duration",e,["number"]),e&&e<0)throw'duration is invalid "'.concat(e,'".');if(l("timingFunction",r,["string","undefined"]),r&&!q[r])throw'".timingFunction" is not recognized "'.concat(r,'".');l("callback",n,["function","undefined"])},Y=function(n){l("blobOptions",n,["object"]);var t=n.seed,e=n.extraPoints,r=n.randomness,n=n.size;if(l("blobOptions.seed",t,["string","number"]),l("blobOptions.extraPoints",e,["number"]),e<0)throw'blobOptions.extraPoints is invalid "'.concat(e,'".');if(l("blobOptions.randomness",r,["number"]),r<0)throw'blobOptions.randomness is invalid "'.concat(r,'".');if(l("blobOptions.size",n,["number"]),n<0)throw'blobOptions.size is invalid "'.concat(n,'".')},D=function(n){var t;l("canvasOptions",n,["object","undefined"]),n&&(t=n.offsetX,n=n.offsetY,l("canvasOptions.offsetX",t,["number","undefined"]),l("canvasOptions.offsetY",n,["number","undefined"]))},R=function(n){if(!Array.isArray(n))throw'points should be an array but was "'.concat(typeof n,'".');if(n.length<3)throw'expected more than two points but received "'.concat(n.length,'".');for(var t=0,e=n;t<e.length;t++){var r=e[t];l("point.x",r.x,["number"]),l("point.y",r.y,["number"]),l("point.handleIn",r.handleIn,["object"]),l("point.handleIn.angle",r.handleIn.angle,["number"]),l("point.handleIn.length",r.handleIn.length,["number"]),l("point.handleOut",r.handleOut,["object"]),l("point.handleOut.angle",r.handleOut.angle,["number"]),l("point.handleOut.length",r.handleOut.length,["number"])}};n.canvasPath=function(t){var e,u,r,h,n=Date.now,a=(void 0!==t&&(e=0,n=function(){var n=t();if(n<e)throw"timestamp provider generated decreasing value: ".concat(e," then ").concat(n,".");return e=n}),u=C,r=m,h=E,n),s=[],c={},d={},i=0,o=0,f=function(){return a()-o},l=function(){return 0!==i},g=function(){l()&&(o+=f()-i,i=0)},p=function(){l()||(i=f())};return{renderFrame:function(){var n=N({renderCache:c,timestamp:l()?i:f(),currentFrames:s});return c=n.renderCache,n.lastFrameId&&d[n.lastFrameId]&&(d[n.lastFrameId](),delete d[n.lastFrameId]),r(n.points)},transition:function(){for(var n=[],t=0;t<arguments.length;t++)n[t]=arguments[t];for(var e=0;e<n.length;e++)h(n[e],e);var r=G({renderCache:c,timestamp:f(),currentFrames:s,newFrames:n,shapeGenerator:u});s=r.newFrames,d={},c={};for(var a=0,i=s;a<i.length;a++){var o,l=i[a];l.isSynthetic||(o=n[l.transitionSourceFrameIndex].callback)&&(d[l.id]=o)}},play:g,pause:p,playPause:function(){(l()?g:p)()}}},n.wigglePreset=function(e,r,a,n){function i(n,t){h++,e.transition({duration:n?0:80,delay:t||0,timingFunction:"linear",canvasOptions:a,points:z(r,function(n){return u(l*h,n)}),callback:i})}var t,o,l=.01*n.speed,u=(t=String(r.seed),o=w(k(t)),function(n,t){return o(n,t)}),h=0;i(!0,n.delay)}});
//# sourceMappingURL=index.js.map