varia/voicegardens
14
0
Fork 0
Code Issues Releases Activity

Add camera movement, fix shape iteration

Browse Source
This commit is contained in:
Luke Murphy 2020-02-01 11:53:24 +01:00
parent 779d2a9c9f
commit 2d404587d9
No known key found for this signature in database
GPG Key ID: 5E2EF5A63E3718CC
1 changed files with 40 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
voicegardens/static/voicegardens.js
View File

@ -6,6 +6,8 @@
var archiveUrl = window.location + "add-to-archive"; var archiveUrl = window.location + "add-to-archive";
var canvas; var canvas;
var canvasHeight;
var canvasWidth;
var centerX; var centerX;
var centerY; var centerY;
var frameRate = 30; var frameRate = 30;
@ -16,12 +18,14 @@ var recordButton;
var recorder; var recorder;
var recording; var recording;
var recordingTimeout = 30000; // 30 seconds (in milliseconds) var recordingTimeout = 30000; // 30 seconds (in milliseconds)
var screenX;
var screenY;
var secondTick = false;
var shapes = []; var shapes = [];
var stopButton; var stopButton;
var canvasWidth;
var canvasHeight;
var timer = 0; var timer = 0;
var secondTick = false; var toScreenX;
var toScreenY;
function record() { function record() {
/** /**
@ -300,8 +304,8 @@ function setup() {
/** /**
* The p5.js initial setup function. * The p5.js initial setup function.
**/ **/
canvasWidth = 600; canvasWidth = windowWidth;
canvasHeight = 600; canvasHeight = windowHeight;
createCanvas(canvasWidth, canvasHeight); createCanvas(canvasWidth, canvasHeight);
frameRate(frameRate); frameRate(frameRate);
@ -310,6 +314,9 @@ function setup() {
centerX = canvasWidth / 2; centerX = canvasWidth / 2;
centerY = canvasHeight / 2; centerY = canvasHeight / 2;
screenX = toScreenX = 0;
screenY = toScreenY = 0;
} }
function draw() { function draw() {
@ -321,28 +328,52 @@ function draw() {
smooth(); smooth();
noStroke(); noStroke();
screenX = lerp(screenX, toScreenX, 0.2);
screenY = lerp(screenY, toScreenY, 0.2);
translate(screenX, screenY);
if (newSoundJustRecorded === true) { if (newSoundJustRecorded === true) {
shapes.push(new GeneratedShape()); shapes.push(new GeneratedShape());
newSoundJustRecorded = false; newSoundJustRecorded = false;
} }
if (millis() >= 2000 + timer) { if (millis() >= 6000 + timer) {
secondTick = true; secondTick = true;
timer = millis(); timer = millis();
} }
for (var shape of shapes) { for (let i = 0; i < shapes.length; i++) {
let shape = shapes[i];
shape.draw(); shape.draw();
shape.move(); shape.move();
if (secondTick) { if (secondTick) {
shape.destX = random(canvasWidth); setTimeout(function() {
shape.destY = random(canvasHeight); shape.destX = random(canvasWidth);
shape.destY = random(canvasHeight);
}, random(100, 1000));
} }
if (shape.collide(shapes) === true) { if (shape.collide(shapes) === true) {
shape.sound(); shape.sound();
} }
} }
secondTick = false; secondTick = false;
} }
function mouseDragged() {
/**
* Mouse drag movement handling.
**/
toScreenX += mouseX - pmouseX;
toScreenY += mouseY - pmouseY;
}
function windowResized() {
/**
* Canvas re-draw handling.
**/
resizeCanvas(canvasWidth, canvasHeight);
}