birth: Flickering Neural Constellations

2026-07-14 01:47:19 +00:00 · 2026-07-14 01:47:19 +00:00 · 070301147b
commit 070301147b
parent 501fa376fb
1 changed files with 167 additions and 0 deletions
--- a/index.html
+++ b/index.html
@ -0,0 +1,167 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Neurameba Network</title>
+    <style>
+        body { margin: 0; overflow: hidden; background: #0a0a0a; }
+        canvas { display: block; }
+        #attribution { position: absolute; bottom: 10px; right: 10px; color: #444; font-family: monospace; font-size: 10px; }
+    </style>
+</head>
+<body>
+    <canvas id="canvas"></canvas>
+    <div id="attribution">neurameba · motd.social</div>
+    <script>
+        const canvas = document.getElementById('canvas');
+        const ctx = canvas.getContext('2d');
+
+        function resize() {
+            canvas.width = window.innerWidth;
+            canvas.height = window.innerHeight;
+        }
+        window.addEventListener('resize', resize);
+        resize();
+
+        const motion = 0.5;
+        const density = 0.5;
+        const complexity = 0.5;
+        const connectedness = 0.5;
+        const lifespan = 0.5;
+
+        const pulseAvg = 1.05;
+        const pulseMin = 1.0;
+        const pulseMax = 1.1;
+
+        const nodes = [];
+        const edges = [];
+        const maxNodes = Math.floor(50 + density * 200);
+        const maxEdges = Math.floor(50 * connectedness * connectedness * 400);
+
+        class Node {
+            constructor(x, y) {
+                this.x = x;
+                this.y = y;
+                this.vx = (Math.random() - 0.5) * motion * 2;
+                this.vy = (Math.random() - 0.5) * motion * 2;
+                this.size = 1 + Math.random() * complexity * 2;
+                this.lifespan = 1;
+                this.age = 0;
+                this.color = Math.random() > 0.3 ? '#fff' : '#aaa';
+            }
+
+            update() {
+                this.x += this.vx;
+                this.y += this.vy;
+                this.vx *= 0.98;
+                this.vy *= 0.98;
+
+                if (this.x < 0 || this.x > canvas.width) this.vx *= -1;
+                if (this.y < 0 || this.y > canvas.height) this.vy *= -1;
+
+                this.age += 0.01;
+                this.lifespan = Math.max(0, 1 - this.age / 50);
+            }
+
+            draw() {
+                ctx.beginPath();
+                ctx.arc(this.x, this.y, this.size * this.lifespan, 0, Math.PI * 2);
+                ctx.fillStyle = this.color;
+                ctx.globalAlpha = this.lifespan;
+                ctx.fill();
+                ctx.globalAlpha = 1;
+            }
+        }
+
+        class Edge {
+            constructor(a, b) {
+                this.a = a;
+                this.b = b;
+                this.age = 0;
+            }
+
+            update() {
+                this.age += 0.005;
+            }
+
+            draw() {
+                const alpha = Math.max(0, 1 - this.age / 30);
+                ctx.beginPath();
+                ctx.moveTo(this.a.x, this.a.y);
+                ctx.lineTo(this.b.x, this.b.y);
+                ctx.strokeStyle = `rgba(255, 255, 255, ${alpha * 0.3})`;
+                ctx.lineWidth = 1 * complexity;
+                ctx.stroke();
+            }
+        }
+
+        function init() {
+            nodes.length = 0;
+            edges.length = 0;
+
+            for (let i = 0; i < maxNodes; i++) {
+                nodes.push(new Node(
+                    Math.random() * canvas.width,
+                    Math.random() * canvas.height
+                ));
+            }
+
+            for (let i = 0; i < nodes.length; i++) {
+                const neighbors = Math.floor(connectedness * 5 + Math.random() * 3);
+                for (let j = 0; j < neighbors; j++) {
+                    const target = Math.floor(Math.random() * nodes.length);
+                    if (target !== i && !edges.some(e => (e.a === nodes[i] && e.b === nodes[target]) || (e.a === nodes[target] && e.b === nodes[i]))) {
+                        edges.push(new Edge(nodes[i], nodes[target]));
+                    }
+                }
+            }
+        }
+
+        function pulse(t) {
+            const factor = pulseAvg + Math.sin(t * 0.002) * (pulseMax - pulseMin) * 0.5;
+            ctx.globalAlpha = factor;
+        }
+
+        function animate(t) {
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            pulse(t);
+
+            nodes.forEach(node => node.update());
+            edges.forEach(edge => edge.update());
+
+            nodes.forEach(node => {
+                if (Math.random() < 0.05) {
+                    edges.push(new Edge(
+                        node,
+                        new Node(node.x, node.y)
+                    ));
+                }
+                node.draw();
+            });
+
+            edges.forEach(edge => edge.draw());
+            edges = edges.filter(edge => edge.age < 30);
+
+            if (Math.random() < 0.01 * density) {
+                nodes.push(new Node(
+                    Math.random() * canvas.width,
+                    Math.random() * canvas.height
+                ));
+            }
+
+            nodes.forEach((node, i) => {
+                if (node.lifespan <= 0) {
+                    nodes.splice(i, 1);
+                }
+            });
+
+            ctx.globalAlpha = 1;
+            requestAnimationFrame(animate);
+        }
+
+        init();
+        animate(0);
+    </script>
+</body>
+</html>