Skip to content

Instantly share code, notes, and snippets.

@rdsilver

rdsilver/index.html

Last active August 29, 2015 14:05
Show Gist options
  • Save rdsilver/eb6641f0499bc807f575 to your computer and use it in GitHub Desktop.
Save rdsilver/eb6641f0499bc807f575 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<html>
<head>
<script language="javascript" src="http://p5js.org/js/p5.min.js"></script>
<script language="javascript" src="http://p5js.org/js/p5.dom.js"></script>
<script language="javascript" src="http://p5js.org/js/p5.sound.js"></script>
<script language="javascript" src="sketch.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
</body>
</html>
Raw
sketch.js
var start_stop_button;
var osc;
var oscOn = false;
var freq;
function setup() {
createCanvas(1400,600);
//Create Buttons
start_stop_button = createButton('Start',100,100);
start_stop_button.addClass('block');
start_stop_button.mousePressed(toggleOsc);
// Oscillator.
osc = new p5.SinOsc();
osc.amp(.1);
//osc.start();
fill(0);
textSize(50);
textAlign(CENTER);
textFont("Helvetica");
noStroke();
}
function draw() {
background(240, 220,200);
freq = frameCount * 1;
osc.freq(freq);
osc.pan( sin(frameCount/20.0) );
text('Frequency: ' + freq, width/2.0 , height/2.0) ;
}
function toggleOsc() {
if (oscOn) {
osc.stop();
start_stop_button.html('start');
} else {
osc.start();
start_stop_button.html('stop');
}
oscOn = !oscOn;
}
Raw
style.css
body { padding: 0;}
.block { display: block;}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment