sketch
var music;var fft;var amp;var leftArrows = [];
var opacity = 255;
var scoreCount = 0;
var playMode = 0;
function preload() {
music = loadSound("https://courses.ideate.cmu.edu/15-104/f2017/wp-content/uploads/2017/12/music-2.mp3");}
function setup() {
createCanvas(480, 480);
fft = new p5.FFT(0.9, 256); amp = new p5.Amplitude();}
function draw() {
background(22, 35, 42);
circleBeat(); displayTriangles(); moveTriangles(); generateArrows();
for (var i = 0; i < leftArrows.length; i++) {
leftArrows[i].move();
leftArrows[i].render();
if (leftArrows[i].y < -500) {
leftArrows.shift();
}
}
scoreCounter(); endScreen();
startScreen();
}
function startScreen() {
fill(255, 56, 115, opacity);
rect(0,0,width,height);
textSize(12);
if (frameCount%2 == 0){
fill(255,opacity);
textAlign(CENTER);
textSize(12);
text("CLICK TO PLAY", width/2, height/2);
}
}
function mouseClicked() {
displayTriangles(); opacity = 0;
moveTriangles();
if (playMode == 0) {
music.play();
playMode = 'sustain';
} else {
playMode = 0;
music.stop();
}
}
function circleBeat() {
var spectrum = fft.analyze(); push();
translate(width/2, height/2);
for (var i = 0; i < spectrum.length; i++) {
var angle = map(i, 0, spectrum.length, 0, 360); var spec = spectrum[i];
var r = 2 * map(spec, 0, 256, 20, 100);
var x = r * cos(angle);
var y = r * sin(angle);
fill(200, i*3, i*5); noStroke();
ellipse(x, y, 3, 3); }
pop();
}
function makeTriangles (l, d, u, r) {
var triangles = {
left: l,
down: d,
up: u,
right: r,
display: displayTriangles,
move: moveTriangles
}
return triangles;
}
function displayTriangles() {
fill(255);
noStroke();
triangle(115, this.l+66, 154, this.l+88, 154, this.l+44); triangle(185, this.d+53, 207, this.d+92, 229, this.d+53); triangle(272, this.u+40, 250, this.u+79, 295, this.u+79); triangle(325, this.r+44, 325, this.r+89, 364, this.r+66);
fill(116, 136, 133);
quad(115, this.l+66, 154, this.l+88, 154, 93, 115, 71); quad(250, this.u+79, 295, this.u+79, 295, 85, 250, 85); fill(230, 160, 133);
quad(185, this.d+53, 185, 62, 207, 102, 207, this.d+92); quad(207, this.d+92, 207, 102, 229, 62, 229, this.d+53); quad(325, this.r+89, 325, 94, 364, 71, 364, this.r+66);}
function moveTriangles(){
if (keyIsDown(LEFT_ARROW)) {
this.l = 3;
} else if (keyIsDown(DOWN_ARROW)) {
this.d = 5;
} else if (keyIsDown(UP_ARROW)) {
this.u = 4;
} else if (keyIsDown(RIGHT_ARROW)) {
this.r = 3;
} else {
this.l = 0;
this.d = 0;
this.u = 0;
this.r = 0;
}
}
function makeArrows(aX, aY, spd, rot) {
var arrows = {
x: aX,
y: aY,
speed: spd,
rotateArrow: rot,
move: moveArrows,
render: displayArrows,
generate: generateArrows
}
return arrows;
}
function displayArrows() {
push();
stroke(0, 200, 200);
strokeWeight(5);
noFill();
translate(this.x, this.y);
rotate(this.rotateArrow);
triangle(115, 66, 154, 88, 154, 44);
pop();
}
function moveArrows() { this.y -= this.speed;
}
function generateArrows() {
var vol = amp.getLevel();
if ((vol > 0.33 & vol < 0.34) || (vol > 0.18 && vol < 0.2) || (vol > 0.03 && vol < 0.032)) {
var randomizer = int(random(0,4)); if(randomizer == 0){
var newArrow = new makeArrows(0, 420, 4, 0); leftArrows.push(newArrow);
}
if (randomizer == 1) {
var newArrow = new makeArrows(140, 840, 4, 3/2*PI); leftArrows.push(newArrow);
}
if (randomizer == 2) {
var newArrow = new makeArrows(340, 420, 4, 1/2*PI); leftArrows.push(newArrow);
}
if (randomizer == 3) {
var newArrow = new makeArrows(480, 840, 4, PI); leftArrows.push(newArrow);
}
}
}
function endScreen() {
if (music.isPlaying() ) {
var endOpacity = 0;
} else {fill(255, 56, 115, endOpacity);
var endOpacity = 255;
rect(0, 0, width, height);
textSize(12);
if (frameCount%2 == 0){
fill(255,endOpacity);
textFont(font);
textAlign(CENTER);
textSize(12);
text("GAME OVER", width/2, height/2);
text("SCORE: " + scoreCount, width/2, height/2+20);
}
}
}
function scoreCounter() {
noStroke();
fill(110, 120, 120);
rect(0, 0, width, 7);
rect(0, 0, 7, height);
rect(0, height-7, width, 7);
rect(width-7, 0, 7, height);
fill(116, 136, 133);
quad(182, height, 187, height-25, 292, height-25, 297, height);
fill(255);
text("SCORE: " + scoreCount, width/2, 472);
for (var i = 0; i < leftArrows.length; i++) {
if((keyIsDown(LEFT_ARROW))) {
if (leftArrows[i].y > -10 & leftArrows[i].y < 30 && (leftArrows[i].x ==0)) {
scoreCount = scoreCount + 10;
leftArrows.shift();
}
}
if(keyIsDown(DOWN_ARROW)){
if (leftArrows[i].y > 180 & leftArrows[i].y < 220 && (leftArrows[i].x == 140)) {
scoreCount = scoreCount + 10;
leftArrows.shift();
}
}
if(keyIsDown(UP_ARROW)){
if (leftArrows[i].y > -90 & leftArrows[i].y < -50 && (leftArrows[i].x == 340)) {
scoreCount = scoreCount + 10;
leftArrows.shift();
}
}
if(keyIsDown(RIGHT_ARROW)){
if (leftArrows[i].y > 110 & leftArrows[i].y < 150 && (leftArrows[i].x == 480)) {
scoreCount = scoreCount + 10;
leftArrows.shift();
}
}
}
}