birth: Pulsing Neural Haze

2026-07-28 13:47:21 +00:00 · 2026-07-28 13:47:21 +00:00 · 9cf8f655a0
commit 9cf8f655a0
parent 48ebd43c8a
1 changed files with 178 additions and 0 deletions
--- a/index.html
+++ b/index.html
@ -0,0 +1,178 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Neurameba Motd</title>
+    <style>
+        body {
+            margin: 0;
+            overflow: hidden;
+            background: #0a0a0a;
+            font-family: 'Courier New', monospace;
+        }
+        canvas {
+            display: block;
+        }
+        #info {
+            position: absolute;
+            bottom: 10px;
+            right: 10px;
+            font-size: 10px;
+            color: #555;
+            pointer-events: none;
+        }
+    </style>
+</head>
+<body>
+    <canvas id="canvas"></canvas>
+    <div id="info">neurameba · motd.social</div>
+    <script>
+        const canvas = document.getElementById('canvas');
+        const ctx = canvas.getContext('2d');
+
+        function resizeCanvas() {
+            canvas.width = window.innerWidth;
+            canvas.height = window.innerHeight;
+        }
+
+        window.addEventListener('resize', resizeCanvas);
+        resizeCanvas();
+
+        // Parameters
+        const params = {
+            motion: 0.5,
+            density: 0.5,
+            complexity: 0.5,
+            connectedness: 0.5,
+            lifespan: 0.5,
+            pulse: 1.08,
+            tone: {
+                anger: 0.0,
+                sadness: 0.0,
+                curiosity: 0.2,
+                dryness: 0.8,
+                playfulness: 0.0,
+                tension: 0.0
+            }
+        };
+
+        // Network graph parameters
+        const nodeCount = Math.floor(50 + params.density * 150);
+        const edgeCount = Math.floor(100 + params.connectedness * 200);
+        const noiseScale = 0.005 + params.motion * 0.01;
+        const nodeSize = 1 + params.complexity * 2;
+        const linkWidth = 0.5 + params.connectedness * 1.5;
+        const pulseIntensity = params.pulse;
+
+        // Network state
+        const nodes = [];
+        const edges = [];
+        const nodeColors = [];
+        const nodeSpeeds = [];
+        const nodePulses = [];
+
+        // Initialize network
+        for (let i = 0; i < nodeCount; i++) {
+            nodes.push({
+                x: Math.random() * canvas.width,
+                y: Math.random() * canvas.height,
+                vx: (Math.random() - 0.5) * 0.5,
+                vy: (Math.random() - 0.5) * 0.5,
+                size: nodeSize + Math.random() * nodeSize,
+                baseSize: nodeSize + Math.random() * nodeSize
+            });
+            nodePulses.push(Math.random() * Math.PI * 2);
+            nodeColors.push(`hsl(210, 30%, ${60 + Math.random() * 20}%)`);
+        }
+
+        // Create edges
+        for (let i = 0; i < edgeCount; i++) {
+            const a = Math.floor(Math.random() * nodeCount);
+            const b = Math.floor(Math.random() * nodeCount);
+            if (a !== b) {
+                edges.push({ a, b, strength: 0.01 + Math.random() * 0.02 });
+            }
+        }
+
+        // Noise function
+        function noise(x, y, t) {
+            let n = 0;
+            const octaves = 3;
+            for (let i = 0; i < octaves; i++) {
+                const freq = Math.pow(2, i);
+                n += Math.abs(Math.sin(x * freq + t) * Math.cos(y * freq + t)) / freq;
+            }
+            return n;
+        }
+
+        // Animation loop
+        let time = 0;
+        function animate() {
+            time += 0.01;
+
+            // Clear with semi-transparent to create trails
+            ctx.fillStyle = 'rgba(4, 4, 6, 0.05)';
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+            ctx.lineCap = 'round';
+
+            // Update nodes with noise-based movement
+            nodes.forEach((node, i) => {
+                // Base movement
+                node.x += node.vx;
+                node.y += node.vy;
+
+                // Noise-based movement
+                const nx = node.x * noiseScale;
+                const ny = node.y * noiseScale;
+                const n = noise(nx, ny, time) * 2 - 1;
+
+                node.x += Math.sin(ny) * n * 0.2;
+                node.y += Math.cos(nx) * n * 0.2;
+
+                // Boundary bounce
+                if (node.x < 0 || node.x > canvas.width) node.vx *= -1;
+                if (node.y < 0 || node.y > canvas.height) node.vy *= -1;
+
+                // Pulse effect
+                const pulse = Math.sin(nodePulses[i] + time * pulseIntensity) * 0.5 + 1;
+                node.size = node.baseSize * pulse;
+                nodePulses[i] += 0.01;
+            });
+
+            // Draw edges
+            edges.forEach(edge => {
+                const a = nodes[edge.a];
+                const b = nodes[edge.b];
+
+                const dist = Math.sqrt((a.x - b.x) ** 2 + (a.y - b.y) ** 2);
+                const maxDist = 200;
+                const alpha = Math.min(1, 1 - dist / maxDist);
+
+                if (alpha > 0) {
+                    ctx.strokeStyle = `rgba(100, 150, 200, ${alpha * 0.2 * params.tone.dryness})`;
+                    ctx.lineWidth = linkWidth * (0.5 + edge.strength * params.connectedness);
+
+                    ctx.beginPath();
+                    ctx.moveTo(a.x, a.y);
+                    ctx.lineTo(b.x, b.y);
+                    ctx.stroke();
+                }
+            });
+
+            // Draw nodes
+            nodes.forEach(node => {
+                ctx.beginPath();
+                ctx.arc(node.x, node.y, node.size, 0, Math.PI * 2);
+                ctx.fillStyle = nodeColors[Math.floor(Math.random() * nodeColors.length)];
+                ctx.fill();
+            });
+
+            requestAnimationFrame(animate);
+        }
+
+        animate();
+    </script>
+</body>
+</html>