<html>
<head>
<meta charset="UTF-8">
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.17/p5.js"></script>
<script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.17/addons/p5.dom.js"></script>
<script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.17/addons/p5.sound.js"></script>
<script language="javascript" type="text/javascript" src="sketch.js"></script>
<style>
body {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
</body>
</html>
var counter, goDontGo;
function setup() {
createCanvas(windowWidth, windowHeight);
frameRate(15);
counter = 0;
goDontGo = color(255, 0, 0, 255);
}
function draw() {
if(wait(10)){
var random = rollTheDice();
if(random === 1){
goDontGo = color(255, 0, 0, 255)
}
else{
goDontGo = color(0, 255, 0, 255)
}
}
fill(goDontGo);
rect(0, 0, width, height);
}
function wait(frames){
if(counter > frames){
counter = 0;
return true;
}
else{
counter++;
return false;
}
}
function rollTheDice(){
return ~~(Math.random()*2);
}