Browse Source

put the christmas lights up again

master
Brennen Bearnes 5 years ago
parent
commit
bcf0a69e58
2 changed files with 69 additions and 5 deletions
  1. +69
    -5
      index.html
  2. +0
    -0
      js/lights.p5.js

+ 69
- 5
index.html View File

@ -8,11 +8,10 @@
<link rel=stylesheet href="tildebrennen.css?update_for_xmas_lights=yesplease" />
<!-- the following are all available for general use from squiggle.city/js/ -->
<script type="text/javascript" src="//squiggle.city/js/jquery.js"></script>
<script type="text/javascript" src="//squiggle.city/js/shjs/sh_main.js"></script>
<script type="text/javascript" src="//squiggle.city/js/shjs/lang/sh_perl.js"></script>
<script type="text/javascript" src="//squiggle.city/js/p5/p5.min.js"></script>
<script type="text/javascript" src="js/lights.p5.js"></script>
<script type="text/javascript" src="https://squiggle.city/js/jquery.js"></script>
<script type="text/javascript" src="https://squiggle.city/js/shjs/sh_main.js"></script>
<script type="text/javascript" src="https://squiggle.city/js/shjs/lang/sh_perl.js"></script>
<script type="text/javascript" src="https://squiggle.city/js/p5/p5.min.js"></script>
<link type="text/css" rel="stylesheet" href="//squiggle.city/js/shjs/css/sh_darkness.css">
</head>
@ -1241,6 +1240,71 @@ sub slurp {
// nice job, really.
sh_highlightDocument();
// A really simple p5.js sketch - google p5.js:
var lights_sketch = function(sketch) {
var x = 0;
var y = 12;
var world;
var red = sketch.color(255, 0, 0);
var green = sketch.color(0, 255, 0);
var blue = sketch.color(0, 0, 255);
var yeller = sketch.color(255, 255, 0);
var colors = [red, green, blue, yeller];
var light_width = 9;
var light_height = 18;
var renderlight = function (x, y, color) {
sketch.push();
sketch.stroke(color);
sketch.fill(color);
sketch.ellipse(x, y, light_width, light_height);
sketch.pop();
};
sketch.setup = function () {
world = {
// size of the canvas
width: $(window).width(),
height: $(window).height(),
};
sketch.createCanvas(world.width, world.height);
sketch.background(0, 0, 0);
};
var waitfor = 1800;
var wait_til = sketch.millis() + waitfor;
sketch.draw = function () {
x = 0;
if (sketch.millis() < wait_til) {
return;
}
sketch.clear();
var previous_color;
var color;
while (x < world.width) {
while (color === previous_color) {
color = colors[ Math.floor(Math.random()*colors.length) ];
}
renderlight(x, y, color);
x += 50;
previous_color = color;
}
wait_til = sketch.millis() + waitfor;
};
};
var myp5;
myp5 = new p5(lights_sketch, 'squiggleCanvas');
$(window).resize(function () {
myp5.setup();
});
// STACK STARTS HERE


+ 0
- 0
js/lights.p5.js View File


Loading…
Cancel
Save