p5ex = p5ex && p5ex.hasOwnProperty('default') ? p5ex['default'] : p5ex;
function setP5exInstance(p5exInstance) {
this.noiseMagnitude = params.noiseMagnitude;
this.noiseTimeScale = params.noiseTimeScale || 0.005;
this.vertexPositionArray = params.vertexPositionArray;
this.noiseTimeOffsetArray = [];
for (let i = 0, len = params.vertexPositionArray.length; i < len; i += 1) {
this.noiseTimeOffsetArray.push(p.createVector(Math.random(), Math.random()).mult(1024));
this.noiseTime += this.noiseTimeScale;
p.currentRenderer.beginShape();
for (let i = 0, len = this.vertexPositionArray.length; i < len; i += 1) {
const noiseX = (2 * p.noise(this.noiseTimeOffsetArray[i].x + this.noiseTime) - 1) * this.noiseMagnitude;
const noiseY = (2 * p.noise(this.noiseTimeOffsetArray[i].y + this.noiseTime) - 1) * this.noiseMagnitude;
p.currentRenderer.vertex(this.vertexPositionArray[i].x + noiseX, this.vertexPositionArray[i].y + noiseY);
p.currentRenderer.endShape(p.CLOSE);
targetPosition = p.createVector();
white = p.shapeColor(undefined, p.color(255, 128));
this.body = new p5ex.PhysicsBody();
this.body.position.set(x, y);
this.body.setFriction(0.01);
this.angleQuantity = new p5ex.AngleQuantity(0, ((Math.random() < 0.5) ? 1 : -1) * p.unitAngleSpeed);
if (Math.random() < 0.2) {
const spriteArray = new p5ex.SpriteArray();
const polygon = new NoisePolygon({
vertexPositionArray: vertices,
const innerPolygon = new NoisePolygon({
vertexPositionArray: innerVertices,
spriteArray.push(polygon);
spriteArray.push(innerPolygon);
this.noisePolygons = spriteArray;
const drawers = new p5ex.DrawableArray();
drawers.push(p.createDrawer(polygon, {
shapeColorRef: p.shapeColor(undefined, c),
drawers.push(p.createDrawer(innerPolygon, {
this.drawer = p.createDrawer(drawers, {
positionRef: this.body.position,
rotationAngleRef: this.angleQuantity.angleReference,
const polygon = new NoisePolygon({
vertexPositionArray: innerVertices,
this.noisePolygons = polygon;
this.drawer = p.createDrawer(polygon, {
positionRef: this.body.position,
rotationAngleRef: this.angleQuantity.angleReference,
shapeColorRef: p.shapeColor(undefined, c),
this.targetPositionNoiseOffset = p.createVector(Math.random(), Math.random()).mult(1024);
targetPosition.set(p.scalableCanvas.getNonScaledValueOf(p.mouseX), p.scalableCanvas.getNonScaledValueOf(p.mouseY));
const targetAngle = (0.1 * p.frameCount / p.idealFrameRate) * p.TWO_PI;
targetPosition.set((0.5 + 0.25 * Math.cos(targetAngle)) * p.scalableCanvas.nonScaledWidth, (0.5 + 0.25 * Math.sin(targetAngle)) * p.scalableCanvas.nonScaledHeight);
targetPosition.add(300 * (p.noise(this.targetPositionNoiseOffset.x + 0.02 * p.frameCount) - 0.5), 300 * (p.noise(this.targetPositionNoiseOffset.y + 0.02 * p.frameCount) - 0.5));
this.body.attractToPoint(targetPosition, 100000 * p.unitAccelerationMagnitude, 0, 5 * p.unitAccelerationMagnitude);
this.noisePolygons.step();
this.angleQuantity.step();
p5.disableFriendlyErrors = true;
const SKETCH_NAME = 'ColoredParticles20171220';
const sketch = (p$$1) => {
p$$1.createScalableCanvas(2 );
backgroundColor = p$$1.color(255);
particleArray = new p5ex.SpriteArray();
for (let i = 0; i < 50; i += 1) {
const c = p$$1.cielchColor(80, 110, Math.random() * p$$1.TWO_PI);
particleArray.push(new Particle(Math.random() * p$$1.scalableCanvas.nonScaledWidth, Math.random() * p$$1.scalableCanvas.nonScaledHeight, p$$1.color(255 - c[0], 255 - c[1], 255 - c[2], 192)));
alphaBackground = p$$1.createAlphaBackground(p$$1.color(255, 24), 1, p$$1.ADD, p$$1.DIFFERENCE);
if (p$$1.mouseIsPressed || motionBlur) {
p$$1.blendMode(p$$1.REPLACE);
p$$1.background(backgroundColor);
p$$1.blendMode(p$$1.DIFFERENCE);
p$$1.scalableCanvas.scale();
motionBlur = !motionBlur;
new p5ex(sketch, SKETCH_NAME);