// lee chu
// section c
// lrchu@andrew.cmu.edu
// project - 10
var ampTog;
var freqTog;
var recordSpinL;
var recordSpinR;
var prevR;
var play;
var playToggle;
var scratch;
var scratch2;
var buildup;
var drop;
var volume;
var visualImage;
var px = [];
var py = [];
var dx = [];
var dy = [];
function preload() {
// load sounds
scratch = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/scratch.wav');
scratch.setVolume(0.08);
scratch2 = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/scratch2.wav');
scratch2.setVolume(0.2);
buildup = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/buildup.wav');
buildup.setVolume(0.5);
drop = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/wheredyago.wav');
drop.setVolume(0.3);
// load visuals
visualImage = loadImage('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/visual.jpg');
}
function setup() {
createCanvas(500, 500);
recordSpinL = 0; recordSpinR = 0;
volume = 0.2;
playFill = 'red';
playToggle = 0;
visualImage.resize(width, height);
visualImage.loadPixels();
// visuals setup
for (var i = 0; i < 150; i ++) {
px.push(random(width));
py.push(random(height));
dx.push(1);
dy.push(1);
}
}
function draw() {
if (drop.isPlaying() == false) {
background(255, 255, 220);
}
else {
for (var i = 0; i < px.length; i ++) {
var ix = constrain(floor(px[i]), 0, width-1);
var iy = constrain(floor(py[i]), 0, height-1);
var theColorAtLocationXY = visualImage.get(ix, iy);
noStroke();
fill(theColorAtLocationXY);
rectMode(CENTER);
rect(px[i], py[i], 30, 30);
// random movement
px[i] += dx[i] * random(-2, 10);
py[i] += dy[i] * random(-2, 10);
// keeping painters on the canvas
if (px[i] > width) {
px[i] = 0;
}
else if (px[i] < 0) {
px[i] = width;
}
if (py[i] > height) {
py[i] = 0;
}
else if (py[i] < 0) {
py[i] = height;
}
}
}
// sound board
soundBoard();
dial(width / 2 - 30, 2 * height / 3 - 5);
dial(width / 2 + 30, 2 * height / 3 - 5);
// play button
fill(45);
rect(width / 2 + 4, 3 * height / 4 + 4, 30, 20);
fill(playFill);
stroke('white');
strokeWeight(0.5);
rect(width / 2, 3 * height / 4, 30, 20);
fill('white');
triangle(width / 2 - 5, 3 * height / 4 - 4, width / 2 - 5, 3 * height / 4 + 4,
width / 2 + 5, 3 * height / 4);
// basssss
fill(45);
strokeWeight(0);
ellipse(width / 2 + 4, 3 * height / 4 + 60 + 4, 40);
strokeWeight(0.5);
fill(100);
if (buildup.isPlaying()) {
fill('red');
}
ellipse(width / 2, 3 * height / 4 + 60, 40);
strokeWeight(2);
text('DROP', width / 2 - 17, 3 * height / 4 + 65);
strokeWeight(0);
// record
disc(width / 4, 3 * width / 4 + 10, recordSpinL);
disc(3 * width / 4, 3 * width / 4 + 10, recordSpinR);
if (play == 1) {
recordSpinL += PI / 100;
recordSpinR += PI / 100;
}
}
function disc(x, y, r) {
// shadow
push();
translate(x + 5, y + 5);
fill(25);
ellipse(0, 0, 155);
pop();
// record
push();
translate(x, y);
rotate(r);
fill(25);
stroke(120);
strokeWeight(3);
ellipse(0, 0, 155);
fill(30, 40, 185);
strokeWeight(1);
ellipse(0, 0, 40);
fill(100);
strokeWeight(0);
ellipse(0, 0, 6);
// scratches
noFill();
strokeWeight(0.3);
arc(0, 0, 140, 140, 0, PI / 4);
arc(0, 0, 120, 120, PI / 2, 5 * PI / 4);
strokeWeight(0.25);
arc(0, 0, 75, 75, 0, PI / 2);
arc(0, 0, 85, 85, PI, 7 * PI / 4);
// more scratches
strokeWeight(0.75);
line(0, 30, 0, 66);
line(-30, 0, -70, 0);
strokeWeight(0.35);
line(20, -20, 45, -45);
line(22, 22, 48, 48);
pop();
}
function dial(x, y, r) {
// shadow
push();
translate(x + 5, y + 5);
fill(50);
strokeWeight(0);
ellipse(0, 0, 35);
pop();
// knob
push();
translate(x, y);
rotate(0);
fill(100);
stroke(180);
strokeWeight(0.75);
ellipse(0, 0, 35);
// pointer
stroke('white');
strokeWeight(1);
line(0, 0, 0, -35 / 2);
pop();
}
function soundBoard() {
rectMode(CENTER);
strokeWeight(0);
// shadow
fill(75);
rect(width / 2 + 10, 4 * height / 5 - 20 + 10, 7 * width / 8, height / 2.5, 20);
// red
fill(175, 50, 50);
rect(width / 2, 4 * height / 5 - 20, 7 * width / 8, height / 2.5, 20);
}
function mousePressed() {
// toggles spinning records
play = 1;
// left scratch sound
if (dist(mouseX, mouseY, width / 4, 3 * width / 4 + 10) < 77.5) {
recordSpinL -= PI / 4;
if (scratch.isPlaying()) {
scratch.stop();
}
scratch.play();
}
// right scratch sound
if (dist(mouseX, mouseY, 3 * width / 4, 3 * width / 4 + 10) < 77.5) {
recordSpinR-= PI / 4;
if (scratch2.isPlaying()) {
scratch2.stop();
}
scratch2.play();
}
// play button
if (dist(mouseX, mouseY, width / 2, 3 * height / 4) < 20) {
playFill = 'green';
if (buildup.isPlaying()) {
buildup.stop();
}
buildup.play();
}
// bass button
if (dist(mouseX, mouseY, width / 2, 3 * height / 4 + 60) < 20 & buildup.isPlaying()) {
if (buildup.isPlaying()) {
buildup.stop();
}
if (drop.isPlaying()) {
drop.stop();
}
drop.play();
}
}
In this primitive virtual audio mixer, I included two dj scratch sounds on each disc, a play button to activate the build up, and a button which drops the bass c: