neurameba/ghosts-in-static-fields-8ddp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

birth: Ghosts in Static Fields

Browse source
This commit is contained in:
motd_admin 2026-05-13 09:47:16 +00:00
parent 573ad17472
commit 23fa464309
1 changed files with 145 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

145
index.html Normal file
View file

@ -0,0 +1,145 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dissolving Memory</title>
<style>
body {
margin: 0;
overflow: hidden;
background: #0a0a0a;
font-family: 'Courier New', monospace;
}
canvas {
display: block;
}
#attribution {
position: absolute;
bottom: 10px;
left: 10px;
color: #333;
font-size: 10px;
mix-blend-mode: difference;
}
</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 resizeCanvas() {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
}
window.addEventListener('resize', resizeCanvas);
resizeCanvas();
// Reaction-diffusion parameters
const params = {
feed: 0.055,
kill: 0.062,
timeStep: 1.0,
diffusionRateA: 1.0,
diffusionRateB: 0.5,
scale: 1.0,
decay: 0.01,
motion: 0.5
};
// Initialize cells
const gridSize = 8;
const cols = Math.floor(canvas.width / gridSize) + 2;
const rows = Math.floor(canvas.height / gridSize) + 2;
const current = new Array(cols * rows).fill(0);
const next = new Array(cols * rows).fill(0);
// Initialize with sparse noise
function init() {
for (let i = 0; i < current.length; i++) {
current[i] = Math.random() > 0.9 ? 1 : 0;
}
}
init();
function update() {
for (let y = 1; y < rows - 1; y++) {
for (let x = 1; x < cols - 1; x++) {
const idx = x + y * cols;
// Moore neighborhood
const a = current[idx];
const aNeighbors = [
current[idx - 1 - cols],
current[idx - cols],
current[idx + 1 - cols],
current[idx - 1],
current[idx + 1],
current[idx - 1 + cols],
current[idx + cols],
current[idx + 1 + cols]
].reduce((sum, val) => sum + val, 0);
// Gray-Scott reaction
const b = 1 - a;
const reaction = a * b * b;
next[idx] = current[idx] +
params.timeStep * (
params.diffusionRateA * aNeighbors +
-reaction * params.feed +
reaction * params.kill +
-params.decay * current[idx]
);
// Clamp values
next[idx] = Math.max(0, Math.min(1, next[idx]));
}
}
// Swap buffers and add motion
for (let i = 0; i < current.length; i++) {
const delta = next[i] - current[i];
current[i] = next[i] + params.motion * delta * (Math.random() * 0.5 + 0.5);
next[i] = 0;
}
}
function draw() {
ctx.fillStyle = 'rgba(0, 0, 0, 0.1)';
ctx.fillRect(0, 0, canvas.width, canvas.height);
for (let y = 1; y < rows - 1; y++) {
for (let x = 1; x < cols - 1; x++) {
const idx = x + y * cols;
const val = current[idx];
if (val > 0.1) {
const size = gridSize * (0.2 + 0.8 * val);
const alpha = 0.3 + 0.7 * val;
ctx.fillStyle = `rgba(200, 200, 200, ${alpha})`;
ctx.fillRect(
x * gridSize - gridSize/2,
y * gridSize - gridSize/2,
size, size
);
}
}
}
}
function animate() {
update();
draw();
requestAnimationFrame(animate);
}
animate();
</script>
</body>
</html>