neurameba/fading-cellular-whispers-l0dk
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

birth: Fading cellular whispers

Browse source
This commit is contained in:
motd_admin 2026-03-25 19:30:56 +00:00
parent 9a147ba8ae
commit 1c595acebd
1 changed files with 136 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

136
index.html Normal file
View file

@ -0,0 +1,136 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Neurameba Cellular Pattern</title>
<style>
body {
margin: 0;
overflow: hidden;
background: #0a0a0a;
font-family: 'Courier New', monospace;
}
canvas {
display: block;
}
#attribution {
position: absolute;
bottom: 10px;
right: 10px;
color: #666;
font-size: 10px;
text-shadow: 0 0 5px #333;
}
</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();
// Parameters derived from the prompt
const params = {
motion: 0.5,
density: 0.5,
complexity: 0.5,
connectedness: 0.5,
lifespan: 0.5,
pulse: { avg: 1.05, min: 1.0, max: 1.1 },
tone: {
anger: 0.0,
sadness: 0.0,
curiosity: 0.1,
dryness: 0.9,
playfulness: 0.0,
tension: 0.0
}
};
// Cellular automata setup
const gridSize = 30;
const cols = Math.floor(canvas.width / gridSize) + 2;
const rows = Math.floor(canvas.height / gridSize) + 2;
let grid = Array(rows).fill().map(() =>
Array(cols).fill().map(() => Math.random() > 0.5 ? 1 : 0)
);
let nextGrid = Array(rows).fill().map(() => Array(cols).fill(0));
// Tone-based color scheme
const bgColor = '#0a0a0a';
const cellColor = params.tone.dryness > 0.7 ?
'#f0f0f0' : '#a0a0a0';
// Animation state
let frameCount = 0;
let pulseMultiplier = 1;
function updateGrid() {
for (let y = 1; y < rows - 1; y++) {
for (let x = 1; x < cols - 1; x++) {
const neighbors = grid[y-1][x-1] + grid[y-1][x] + grid[y-1][x+1] +
grid[y][x-1] + grid[y][x+1] +
grid[y+1][x-1] + grid[y+1][x] + grid[y+1][x+1];
// Cellular automata rules
if (grid[y][x] === 1) {
nextGrid[y][x] = neighbors >= 3 && neighbors <= 5 ? 1 : 0;
} else {
nextGrid[y][x] = neighbors === 4 || neighbors === 5 ? 1 : 0;
}
}
}
// Swap grids
[grid, nextGrid] = [nextGrid, grid];
}
function drawCells() {
// Clear with background
ctx.fillStyle = bgColor;
ctx.fillRect(0, 0, canvas.width, canvas.height);
// Calculate pulse effect
pulseMultiplier = params.pulse.min +
(params.pulse.max - params.pulse.min) *
0.5 * (1 + Math.sin(frameCount * 0.05));
// Draw cells
ctx.fillStyle = cellColor;
for (let y = 0; y < rows; y++) {
for (let x = 0; x < cols; x++) {
if (grid[y][x] === 1) {
const size = gridSize * pulseMultiplier * 0.8;
const px = x * gridSize - gridSize/2;
const py = y * gridSize - gridSize/2;
ctx.fillRect(px, py, size, size);
}
}
}
}
function animate() {
updateGrid();
drawCells();
frameCount++;
requestAnimationFrame(animate);
}
animate();
</script>
</body>
</html>