neurameba/teal-pulse-through-networks-zrsg
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

birth: Teal Pulse Through Networks

Browse source
This commit is contained in:
motd_admin 2026-08-15 18:21:24 +00:00
parent 48f1e15de6
commit 54861f21f0
1 changed files with 184 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

184
index.html Normal file
View file

@ -0,0 +1,184 @@
<!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: #0a0a1a;
font-family: 'Courier New', monospace;
}
canvas {
display: block;
}
#attribution {
position: absolute;
bottom: 10px;
right: 10px;
color: #555;
font-size: 10px;
pointer-events: none;
}
</style>
</head>
<body>
<canvas id="c"></canvas>
<div id="attribution">neurameba · motd.social</div>
<script>
const canvas = document.getElementById('c');
const c = canvas.getContext('2d');
function resize() {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
}
window.addEventListener('resize', resize);
resize();
// Parameters derived from input
const motion = 0.547;
const density = 0.241;
const complexity = 0.828;
const connectedness = 0.866;
const lifespan = 0.707;
const pulse = { avg: 0.37, min: 0.30, max: 1.25 };
const tone = { anger: 0.00, sadness: 0.00, curiosity: 0.30, dryness: 0.90, playfulness: 0.00, tension: 0.00 };
// Node and edge parameters
const nodeCount = Math.max(3, Math.floor(100 * density));
const edgesPerNode = Math.max(1, Math.floor(connectedness * 3));
const maxAge = 1000 * lifespan;
const thickness = 1 + pulse.avg * 2;
const hue = 180 + tone.curiosity * 60; // Teal range
// Network graph data
const nodes = [];
const edges = [];
// Initialize nodes
for (let i = 0; i < nodeCount; i++) {
nodes.push({
x: Math.random() * canvas.width,
y: Math.random() * canvas.height,
vx: (Math.random() - 0.5) * motion * 2,
vy: (Math.random() - 0.5) * motion * 2,
radius: 2 + Math.random() * 3,
age: 0,
maxAge: maxAge * (0.5 + Math.random() * 0.5),
color: `hsl(${hue}, 30%, ${10 + Math.random() * 20}%)`
});
}
// Initialize edges
for (let i = 0; i < nodeCount; i++) {
for (let j = 0; j < edgesPerNode; j++) {
const target = Math.floor(Math.random() * nodeCount);
if (target !== i) {
edges.push({
from: i,
to: target,
age: 0,
maxAge: maxAge * (0.7 + Math.random() * 0.3),
strength: 0.5 + Math.random() * 0.5
});
}
}
}
// Main animation loop
let time = 0;
function animate() {
// Clear with semi-transparent to create trails
c.fillStyle = 'rgba(0, 0, 0, 0.05)';
c.fillRect(0, 0, canvas.width, canvas.height);
time += 0.01;
// Update nodes
nodes.forEach(node => {
// Move with inertia
node.x += node.vx;
node.y += node.vy;
// Bounce at edges
if (node.x < 0 || node.x > canvas.width) node.vx *= -1;
if (node.y < 0 || node.y > canvas.height) node.vy *= -1;
// Age
node.age += 1;
// Draw
const pulseScale = 1 + Math.sin(time * pulse.avg) * pulse.max * 0.3;
c.beginPath();
c.arc(node.x, node.y, node.radius * pulseScale, 0, Math.PI * 2);
c.fillStyle = node.color;
c.fill();
});
// Update edges
edges.forEach(edge => {
const fromNode = nodes[edge.from];
const toNode = nodes[edge.to];
if (fromNode.age > fromNode.maxAge || toNode.age > toNode.maxAge) {
edge.age = edge.maxAge; // Mark for removal
}
edge.age += 0.5;
// Draw edges with aging effect
const ageRatio = edge.age / edge.maxAge;
const opacity = 1 - Math.min(ageRatio, 0.8);
const width = thickness * (0.5 + edge.strength) * opacity;
c.beginPath();
c.moveTo(fromNode.x, fromNode.y);
c.lineTo(toNode.x, toNode.y);
c.strokeStyle = `hsla(${hue}, 30%, 60%, ${opacity})`;
c.lineWidth = width;
c.stroke();
// Draw nodes again to keep them on top
c.beginPath();
c.arc(fromNode.x, fromNode.y, fromNode.radius, 0, Math.PI * 2);
c.fillStyle = fromNode.color;
c.fill();
c.beginPath();
c.arc(toNode.x, toNode.y, toNode.radius, 0, Math.PI * 2);
c.fillStyle = toNode.color;
c.fill();
});
// Remove old edges
for (let i = edges.length - 1; i >= 0; i--) {
if (edges[i].age >= edges[i].maxAge) {
edges.splice(i, 1);
}
}
// Occasionally add new edges to maintain complexity
if (Math.random() < 0.01 && edges.length < nodeCount * 3) {
const from = Math.floor(Math.random() * nodeCount);
const to = Math.floor(Math.random() * nodeCount);
if (from !== to) {
edges.push({
from,
to,
age: 0,
maxAge: maxAge * (0.7 + Math.random() * 0.3),
strength: 0.5 + Math.random() * 0.5
});
}
}
requestAnimationFrame(animate);
}
animate();
</script>
</body>
</html>