|
@ -18,6 +18,9 @@ var recording; |
|
|
var recordingTimeout = 30000; // 30 seconds (in milliseconds)
|
|
|
var recordingTimeout = 30000; // 30 seconds (in milliseconds)
|
|
|
var shapes = []; |
|
|
var shapes = []; |
|
|
var stopButton; |
|
|
var stopButton; |
|
|
|
|
|
var canvasWidth; |
|
|
|
|
|
var canvasHeight; |
|
|
|
|
|
var timer; |
|
|
|
|
|
|
|
|
function record() { |
|
|
function record() { |
|
|
/** |
|
|
/** |
|
@ -164,6 +167,9 @@ class GeneratedShape { |
|
|
this.randomX = random(-77, 77); |
|
|
this.randomX = random(-77, 77); |
|
|
this.randomY = random(-77, 77); |
|
|
this.randomY = random(-77, 77); |
|
|
|
|
|
|
|
|
|
|
|
this.destX = random(canvasWidth); |
|
|
|
|
|
this.destY = random(canvasHeight); |
|
|
|
|
|
|
|
|
this.initialise(); |
|
|
this.initialise(); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
@ -255,8 +261,8 @@ class GeneratedShape { |
|
|
/** |
|
|
/** |
|
|
* Move the shape vectors. |
|
|
* Move the shape vectors. |
|
|
**/ |
|
|
**/ |
|
|
this.deltaX = mouseX - centerX; |
|
|
this.deltaX = this.destX - centerX; |
|
|
this.deltaY = mouseY - centerY; |
|
|
this.deltaY = this.destY - centerY; |
|
|
|
|
|
|
|
|
this.deltaX *= this.springing; |
|
|
this.deltaX *= this.springing; |
|
|
this.deltaY *= this.springing; |
|
|
this.deltaY *= this.springing; |
|
@ -286,13 +292,16 @@ function setup() { |
|
|
/** |
|
|
/** |
|
|
* The p5.js initial setup function. |
|
|
* The p5.js initial setup function. |
|
|
**/ |
|
|
**/ |
|
|
createCanvas(windowWidth, windowHeight); |
|
|
canvasWidth = 600; |
|
|
|
|
|
canvasHeight = 600; |
|
|
|
|
|
|
|
|
|
|
|
createCanvas(canvasWidth, canvasHeight); |
|
|
frameRate(frameRate); |
|
|
frameRate(frameRate); |
|
|
|
|
|
|
|
|
setupRecording(); |
|
|
setupRecording(); |
|
|
|
|
|
|
|
|
centerX = windowWidth / 2; |
|
|
centerX = canvasWidth / 2; |
|
|
centerY = windowHeight / 2; |
|
|
centerY = canvasHeight / 2; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function draw() { |
|
|
function draw() { |
|
@ -312,8 +321,16 @@ function draw() { |
|
|
for (var shape of shapes) { |
|
|
for (var shape of shapes) { |
|
|
shape.draw(); |
|
|
shape.draw(); |
|
|
shape.move(); |
|
|
shape.move(); |
|
|
|
|
|
|
|
|
|
|
|
if (millis() >= 500 + timer) { |
|
|
|
|
|
shape.destX = random(canvasWidth); |
|
|
|
|
|
shape.destY = random(canvasHeight); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
if (shape.collide(shapes) === true) { |
|
|
if (shape.collide(shapes) === true) { |
|
|
shape.sound(); |
|
|
shape.sound(); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
timer = millis(); |
|
|
} |
|
|
} |
|
|