lee chu – project 10

lrchu



// 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:

Leave a Reply