diff --git a/06/animate.js b/06/animate.js new file mode 100644 index 0000000..55d0b4e --- /dev/null +++ b/06/animate.js @@ -0,0 +1,66 @@ + +const WIDTH = 800; +const HEIGHT = 800; +const NCRITTERS = 100; + +const pointer = { x: 0, y: 0 }; + +const svg = document.getElementsByTagName("svg")[0]; + +svg.addEventListener( + "pointermove", + (e) => { + pointer.x = e.clientX; + pointer.y = e.clientY; + }, + false +); + +class Critter { + constructor() { + this.x = Math.random() * WIDTH; + this.y = Math.random() * HEIGHT; + this.vx = Math.random() * 0.1 - 0.05; + this.vy = Math.random() * 0.1 - 0.05; + this.status = "go"; + this.init(); + this.update(); + } + init() { + this.elt = document.createElement("circle"); + this.elt.setAttribute("fill", "blue"); + this.elt.setAttribute("r", 10); + this.elt.setAttribute("opacity", "50%"); + svg.addChild(this.elt); + } + update() { + this.x += this.vx; + this.y += this.vy; + this.elt.setAttribute("cx", this.x); + this.elt.setAttribute("cy", this.y); + } +} + +const critters = []; + +for( let i = 0; i++; i < NCRITTERS) { + critters.push(new Critter); +} + + + + +function animate() { + requestAnimationFrame(animate); + const rect = svg.getBoundingClientRect(); + const x = pointer.x - rect.left; + const y = pointer.y - rect.top; + for( const c of critters ) { + c.update(); + } +} + +animate(); + + + diff --git a/06/index.html b/06/index.html new file mode 100644 index 0000000..56c83fe --- /dev/null +++ b/06/index.html @@ -0,0 +1,28 @@ + + + + etc.mikelynch.org | Genuary 2026 + + + + +
+ +

Genuary 2026 -

+ +

Prompt: Lights on/off. Make something that changes when you switch on or off the “digital” lights.

+ +

+ +

Back

+ + + +

The Python script

+ + + + + +