Last active
August 29, 2015 14:18
-
-
Save bsmithgall/a97c08e3d849b8ca7c27 to your computer and use it in GitHub Desktop.
fun with p5
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var x = 0, backwards = false, s = 800, y = 0, up=true, | |
r=0, g=0, b=0, circleWidth = 100, mavericks=[], | |
maxR = false, maxG = false, maxB = false, fft, song, img; | |
function preload() { | |
song = loadSound('danger-zone.mp3'); | |
img = loadImage('maverick.png'); | |
} | |
function setup() { | |
createCanvas(window.screen.availWidth, window.screen.height-200); | |
analyzer = new p5.Amplitude(); | |
song.loop(); | |
analyzer.setInput(song); | |
fft = new p5.FFT(); | |
} | |
function moveX(backwards, x) { | |
if (backwards) { | |
return x -= 10; | |
} | |
return x += 10; | |
} | |
function moveY(up, y) { | |
if (up) { | |
return y += 5; | |
} | |
return y -= 5; | |
} | |
function Maverick(x, y, size) { | |
this.x = Math.abs(size - x)/2; | |
this.y = Math.abs(size - y)/2; | |
this.size = size; | |
this.display = function() { | |
image(img, this.x, this.y, this.size, this.size); | |
}; | |
} | |
function calculateMavericks(mavericks, x, y, size) { | |
if (mavericks.length > 25) { | |
mavericks.splice(0, 1); | |
} | |
mavericks.push(new Maverick(x,y,size)); | |
return mavericks; | |
} | |
function draw() { | |
clear(); | |
var vol = analyzer.getLevel(); | |
if (x >= (width - circleWidth) || Math.random() < 0.005) { | |
backwards = true; | |
} else if (x <= circleWidth) { | |
backwards = false; | |
} | |
if (y >= (height - circleWidth) || Math.random() < 0.005) { | |
up = false; | |
} else if (y <= circleWidth) { | |
up = true; | |
} | |
x = moveX(backwards, x); | |
y = moveY(up, y); | |
mavericks = calculateMavericks(mavericks, x, y, Math.max(vol * 800, 10)); | |
for (var i = 0; i < mavericks.length; i++) { | |
mavericks[i].display(); | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.3/p5.js"></script> | |
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.3/addons/p5.sound.js"></script> | |
<script src="script.js"></script> | |
<!--<script src="cruise.js"></script>--> | |
</html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var x = 0, backwards = false, s = 800, y = s, up=true, | |
r=0, g=0, b=0, circleWidth = 40, circles=[], | |
maxR = false, maxG = false, maxB = false, fft; | |
function preload() { | |
song = loadSound('danger-zone.mp3'); | |
} | |
function setup() { | |
createCanvas(window.screen.availWidth, window.screen.height); | |
x = 0; | |
y = 0; | |
song.loop(); | |
// create a new Amplitude analyzer | |
colorMode(RGB, 255); | |
analyzer = new p5.Amplitude(); | |
// Patch the input to an volume analyzer | |
analyzer.setInput(song); | |
fft = new p5.FFT(); | |
} | |
function calculateRGB(red, green, blue, vol) { | |
red += maxR ? -Math.random() * 2 : Math.random() * 2; | |
green += maxG ? -Math.random() * 2 : Math.random() * 2; | |
blue += maxB ? -Math.random() * 2 : Math.random() * 2; | |
return [red,green,blue]; | |
} | |
function moveX(backwards, x) { | |
if (backwards) { | |
return x -= 5; | |
} | |
return x += 5; | |
} | |
function moveY(up, y) { | |
if (up) { | |
return y += Math.random() * 5; | |
} | |
return y -= Math.random() * 5; | |
} | |
function Circle(x,y,diameter) { | |
this.x = x; | |
this.y = y; | |
this.diameter = diameter; | |
this.display = function() { | |
ellipse(this.x, this.y, Math.max(this.diameter, 5), Math.max(this.diameter, 5)); | |
}; | |
} | |
function calculateCircles(circles, x, y, diameter) { | |
if (circles.length > 25) { | |
circles.splice(0, 1); | |
} | |
circles.push(new Circle(x,y,diameter)); | |
return circles; | |
} | |
function draw() { | |
clear(); | |
// draw our circles | |
var vol = analyzer.getLevel(); | |
var analyze = fft.analyze(); | |
var bass = fft.getEnergy('lowMid'); | |
var mid = fft.getEnergy('mid'); | |
var treb = fft.getEnergy('treble'); | |
circles = calculateCircles(circles, x, y, vol*600); | |
fill(r, g, b); | |
for (var i = 0; i < circles.length; i++) { | |
circles[i].display(); | |
} | |
// figure out if we need to go fowards or backwards | |
if (x >= (width - circleWidth) || Math.random() < 0.005) { | |
backwards = true; | |
} else if (x <= circleWidth) { | |
backwards = false; | |
} | |
// figure out if we are going up or down | |
if (y >= (height - circleWidth) || Math.random() < 0.005) { | |
up = false; | |
} else if (y <= circleWidth) { | |
up = true; | |
} | |
// should we increase or decrease RGB values? | |
maxR = r >= 100 || r <= 0 ? !maxR : maxR; | |
maxG = g >= 100 || g <= 0 ? !maxG : maxG; | |
maxB = b >= 100 || b <= 0 ? !maxB : maxB; | |
// recalculate our x/y positions | |
x = moveX(backwards, x); | |
y = moveY(up, y); | |
// figure out our colors -- random | |
// newColors = calculateRGB(r, g, b, vol); | |
// r = newColors[0]; | |
// g = newColors[1]; | |
// b = newColors[2]; | |
// figure out our colors -- sound analysis | |
b = map(bass, 0, 255, 50, 200); | |
g = map(mid, 0, 255, 50, 200); | |
r = map(treb, 0, 255, 50, 200); | |
} | |
function mousePressed() { | |
if (song.isPlaying()) { | |
song.pause(); | |
} else { | |
song.play(); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment