react-flowfield/dist/react-flowfield.cjs.production.min.js

<div align="center"><h1>React-Flowfield</h1></div>

"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),i=t(e),s=require("p5"),o=t(s),r=function(){function t(t,e){this.maxSpeed=4,this.p5=t,this.pos=t.createVector(t.random(t.width),t.random(t.height)),this.vel=t.createVector(0,0),this.acc=t.createVector(0,0),this.prevPos=this.pos.copy(),this.particalRGB=e}var e=t.prototype;return e.update=function(){this.vel.add(this.acc),this.pos.add(this.vel),this.acc.mult(0),this.vel.limit(this.maxSpeed)},e.follow=function(t,e,i){var s=this.p5.floor(this.pos.x/e),o=this.p5.floor(this.pos.y/e);this.applyForce(t[s+o*i])},e.applyForce=function(t){this.acc.add(t)},e.show=function(){this.p5.stroke(this.particalRGB.R,this.particalRGB.G,this.particalRGB.B,this.particalRGB.A),this.p5.strokeWeight(1),this.p5.line(this.pos.x,this.pos.y,this.prevPos.x,this.prevPos.y),this.updatePrev()},e.updatePrev=function(){this.prevPos.x=this.pos.x,this.prevPos.y=this.pos.y},e.edges=function(){this.pos.x>this.p5.width&&(this.pos.x=0,this.updatePrev()),this.pos.x<0&&(this.pos.x=this.p5.width,this.updatePrev()),this.pos.y>this.p5.height&&(this.pos.y=0,this.updatePrev()),this.pos.y<0&&(this.pos.y=this.p5.height,this.updatePrev())},t}();exports.FlowField=function(t){var h=t.lengthOfAnimation,n=void 0===h?4e3:h,a=t.numberOfParticals,p=void 0===a?2e3:a,c=t.backgroundColor,u=void 0===c?{R:255,G:255,B:255,A:255}:c,l=t.particalColor,f=void 0===l?{R:0,G:0,B:0,A:10}:l,d=e.useRef(null),v=function(t){var e,i,o,h,a,c,l,v=null==(e=d.current)||null==(i=e.parentElement)?void 0:i.offsetHeight,y=null==(o=d.current)||null==(h=o.parentElement)?void 0:h.offsetWidth,g=0,P=0,w=[];t.setup=function(){v&&y&&t.createCanvas(y,v),a=t.floor(t.width/10),c=t.floor(t.height/10),l=new Array(a*c);for(var e=0;e<p;e++)w[e]=new r(t,f);t.background(u.R,u.G,u.B,u.A)},t.draw=function(){for(var e=0,i=0;i<c;i++){for(var o=0,r=0;r<a;r++){var h=r+i*a,p=t.noise(o,e,g)*t.TWO_PI*2,u=s.Vector.fromAngle(p);u.setMag(.5),l[h]=u,o+=.1}e+=.1}if(g+=5e-4,P<n)for(var f=0;f<w.length-1;f++)w[f].follow(l,10,a),w[f].update(),w[f].edges(),w[f].show();P+=1}},y=!1;return e.useEffect((function(){return d.current&&!y&&new o(v,d.current),function(){y=!0}}),[d.current]),i.createElement("div",{ref:d})};
//# sourceMappingURL=react-flowfield.cjs.production.min.js.map