Quick 07

07/genuary07.py

@@ -0,0 +1,34 @@
+#!/usr/bin/env python
+
+r0 = 2
+
+print('<svg width="600" height="600" xmlns="http://www.w3.org/2000/svg">')
+
+cache = {}
+
+def bool_r(x, y):
+    if x in cache:
+        if y in cache[x]:
+            return cache[x][y]
+    else:
+        cache[x] = {}
+    if x < 1:
+        cache[x][y] = (y % 2 == 1)
+    else:
+        if y < 1:
+            cache[x][y] = (x % 2 == 1)
+        else:
+            a = bool_r(x - 1, y)
+            b = bool_r(x, y - 1)
+            cache[x][y] = (a and not b) or (b and not a)
+    return cache[x][y]
+
+
+for x in range(128):
+    for y in range(128):
+        cx = r0 + x * r0 * 2
+        cy = r0 + y * r0 * 2
+        if bool_r(x, y):
+            print(f'<circle cx="{cx}" cy="{cy}" r="{r0}" style="fill:blue;"></circle>')
+
+print("</svg>") 

dist/06/animate.js

@@ -0,0 +1,140 @@
+
+const WIDTH = 800;
+const HEIGHT = 800;
+const NCRITTERS = 10;
+const CLOSE = 20;
+const BOUNCE = 0.02;
+const STUN = 10;
+const MIN_RADIUS = 2;
+const HIDE_SPEED = 10.5;
+
+const pointer = { x: 0, y: 0 };
+
+const critters = [];
+
+let lights = "off";
+
+function dist(c1, c2) {
+    const dx = c1.x - c2.x;
+    const dy = c1.y - c2.y;
+    return Math.sqrt(dx * dx + dy * dy);
+}
+
+class Critter {
+    constructor(i) {
+        this.i = i;
+        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";
+   }
+    init() {
+        const i0 = `c00${this.i}`;
+        this.elt = document.getElementById(i0);
+        console.log(`elt ${i0} ${this.elt}`);
+    }
+    go_v(pos, vel) {
+        if( pos < 10 ) {
+            return vel + 0.01;
+        } else if ( pos > WIDTH - 10 ) {
+            return vel - 0.01;
+        } else {
+            return vel + Math.random() * 0.01 - 0.005;
+        }
+    }
+    update() {
+        if( this.status === "hide" ) {
+            if( this.tick > STUN ) {
+                this.tick--;
+                this.elt.setAttribute("r", this.tick + MIN_RADIUS);
+            } else {
+                this.hide_vec = Math.atan2(this.y - pointer.y, this.x - pointer.x);
+                this.vx = Math.cos(this.hide_vec) * HIDE_SPEED;
+                this.vy = Math.sin(this.hide_vec) * HIDE_SPEED;
+            }
+        }
+        if( this.status === "collide" ) {
+            this.tick--;
+            if( this.tick === 0 ) {
+                this.status = "go";
+                this.elt.setAttribute("fill", "blue");
+            }
+        }
+        if( this.status === "go" ) {
+            const collisions = critters.filter((c) => c.i != this.i && dist(c, this) < CLOSE);
+            if( collisions.length > 0 ) {
+                const hit = collisions[0];
+                this.status = "collide";
+                this.tick = 20;
+                this.elt.setAttribute("fill", "red");
+                this.vx = (this.x - collisions[0].x) * BOUNCE;
+                this.vy = (this.y - collisions[0].y) * BOUNCE;
+                hit.status = "collide";
+                hit.tick = 20;
+                hit.vx = -this.vx;
+                hit.vy = -this.vy;
+            } else {
+                this.vx = this.go_v(this.x, this.vx);
+                this.vy = this.go_v(this.y, this.vy);
+            }
+        }
+        this.x += this.vx;
+        this.y += this.vy;
+        this.elt.setAttribute("cx", this.x);
+        this.elt.setAttribute("cy", this.y);
+    }
+}
+
+
+
+document.addEventListener('DOMContentLoaded', () => {
+    const svg = document.getElementsByTagName("svg")[0];
+    if (svg) { // Check if container exists
+
+        for( let i = 0; i < NCRITTERS; i++ ) {
+            const c = new Critter(i);
+            c.init(i);
+            c.update();
+            critters.push(c);
+        }
+
+        svg.addEventListener("click", () => {
+            const dark = document.getElementById("dark");
+            if( lights === "on" ) {
+                lights = "off";
+                dark.setAttribute("fill-opacity", "0.8");
+                for( const c of critters ) {
+                    c.status = "go";
+                }
+            } else {
+                lights = "on";
+                dark.setAttribute("fill-opacity", "0");
+                for( const c of critters ) {
+                    c.status = "hide";
+                    c.tick = Math.random() * 10 + 15;
+                }
+            }
+        });
+    } else {
+    }
+
+    
+
+});
+
+
+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();
+
+
+

dist/06/index.html

@@ -0,0 +1,43 @@
+
+<html>
+<head>
+	<title>etc.mikelynch.org | Genuary 2026</title>
+    <link rel="stylesheet" href="../styles.css" />
+</head>
+<body>
+
+<div id="main">
+
+<h1>Genuary 2026 - </h1>
+
+<p>Prompt: Lights on/off. Make something that changes when you switch on or off the “digital” lights.</p>
+
+<p>Not what I wanted, but I'm on holidays and need to go to bed</p>
+
+<div id="container">
+<svg width="800" height="800" xmlns="http://www.w3.org/2000/svg">
+<rect id="dark" x="0" y="0" width="800" height="800" fill="black" fill-opacity="0.8"></rect>
+<circle id="c000" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c001" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c002" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c003" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c004" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c005" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c006" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c007" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c008" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+<circle id="c009" r="10" cx="100" cy="100" fill="blue" fill-opacity="0.5"></circle>
+</svg>
+
+</div>
+<p><a href="../">Back</a></p>
+
+
+
+
+<script src="animate.js">
+</script>
+
+</body>
+</html>
+