/* OpenCode + github copilotで作成 PETSCII風の文字をランダムに表示した時にいい感じにキラキラしているように見えたのでパーティクルっぽくなるようにアニメーションを実装してみた */ const C64_PALETTE = [ [ 0, 0, 0], [255, 255, 255], [129, 51, 56], [117, 206, 200], [142, 60, 151], [ 86, 172, 77], [ 46, 44, 155], [237, 241, 113], [142, 80, 41], [ 85, 56, 0], [196, 108, 113], [ 74, 74, 74], [123, 123, 123], [169, 255, 159], [112, 109, 235], [178, 178, 178], ]; const RAMP = [ '█', '█', '▓', '▓', '▌', '▐', '▒', '▚', '◤', '◥', '▘', '▝', '░', '▖', '▏', '▕', ' ', ' ', ]; const CW = 16; const CH = 17; const CURSOR_RADIUS = 50; const SPAWN_PROB = 0.15; const DIE_PROB = 0.06; const MAX_LIFE = 50; const FLICKER = 0.08; const P_INTERVAL = 5; const P_SPEED_MIN = 1.5; const P_SPEED_MAX = 4.0; const P_LIFE_MIN = 30; const P_LIFE_MAX = 80; const P_DRAG = 0.97; const P_MAX = 1000; const NOISE_CURSOR_DEFS = [ { nrOffset: 0, ntOffset: 1000, nrSpeed: 0.012, ntSpeed: 0.004 }, { nrOffset: 200, ntOffset: 1200, nrSpeed: 0.016, ntSpeed: 0.003 }, { nrOffset: 400, ntOffset: 1400, nrSpeed: 0.009, ntSpeed: 0.005 }, ]; let COLS, ROWS; let cells = []; let particles = []; let fCountMouse = 0; let noiseCursors; function randomGlitchCell(pal) { const ch = RAMP[floor(random(RAMP.length - 2))]; const c = pal ?? C64_PALETTE[floor(random(C64_PALETTE.length))]; return { ch, r: c[0], g: c[1], b: c[2], life: floor(random(10, MAX_LIFE)) }; } function spawnParticle(ox, oy, pal) { const angle = random(TWO_PI); const speed = random(P_SPEED_MIN, P_SPEED_MAX); const life = floor(random(P_LIFE_MIN, P_LIFE_MAX)); const c = pal ?? C64_PALETTE[floor(random(C64_PALETTE.length))]; const ch = RAMP[floor(random(RAMP.length - 2))]; return { x: ox + cos(angle) * CURSOR_RADIUS, y: oy + sin(angle) * CURSOR_RADIUS, vx: cos(angle) * speed, vy: sin(angle) * speed, ch, r: c[0], g: c[1], b: c[2], life, maxLife: life, }; } function initGrid() { COLS = ceil(width / CW); ROWS = ceil(height / CH); cells = []; for (let row = 0; row < ROWS; row++) { cells[row] = new Array(COLS).fill(null); } } function updateNoiseCursors() { for (const c of noiseCursors) { c.x = map(noise(c.nt * c.nrSpeed, c.nrOffset), 0, 1, -width * 0.5, width * 1.5); c.y = map(noise(c.nt * c.ntSpeed, c.ntOffset), 0, 1, -height * 0.5, height * 1.5); c.nt++; } } function setup() { createCanvas(windowWidth, windowHeight); frameRate(60); noiseCursors = NOISE_CURSOR_DEFS.map((def, i) => ({ ...def, nt: i * 50, x: width / 2, y: height / 2, fCount: i * 2, })); initGrid(); background(C64_PALETTE[6]); } function draw() { updateNoiseCursors(); const mx = mouseX; const my = mouseY; for (let row = 0; row < ROWS; row++) { for (let col = 0; col < COLS; col++) { const cx = col * CW + CW / 2; const cy = row * CH + CH / 2; const dMouse = sqrt((cx - mx) ** 2 + (cy - my) ** 2); const fromMouse = dMouse < CURSOR_RADIUS; const inRange = fromMouse || noiseCursors.some(c => sqrt((cx - c.x) ** 2 + (cy - c.y) ** 2) < CURSOR_RADIUS); if (cells[row][col]) { cells[row][col].life--; if (cells[row][col].life <= 0 || random() < DIE_PROB) { cells[row][col] = null; } else if (random() < FLICKER) { const prev = cells[row][col]; const origin = prev.origin; const pal = origin === 'mouse' ? C64_PALETTE[6] : null; cells[row][col] = { ...randomGlitchCell(pal), origin, life: prev.life }; } } else { if (inRange && random() < SPAWN_PROB) { const origin = fromMouse ? 'mouse' : 'noise'; const pal = fromMouse ? C64_PALETTE[6] : null; cells[row][col] = { ...randomGlitchCell(pal), origin }; } } } } fCountMouse++; if (fCountMouse % P_INTERVAL === 0 && mx >= 0 && mx <= width && my >= 0 && my <= height) { if (particles.length < P_MAX) particles.push(spawnParticle(mx, my, C64_PALETTE[6])); } for (const c of noiseCursors) { c.fCount++; if (c.fCount % P_INTERVAL === 0) { if (particles.length < P_MAX) particles.push(spawnParticle(c.x, c.y)); } } for (let i = particles.length - 1; i >= 0; i--) { const p = particles[i]; p.life--; if (p.life <= 0) { particles.splice(i, 1); continue; } p.vx *= P_DRAG; p.vy *= P_DRAG; p.x += p.vx; p.y += p.vy; } textFont('monospace'); textSize(CW + 1); textStyle(BOLD); noStroke(); for (let row = 0; row < ROWS; row++) { for (let col = 0; col < COLS; col++) { const cell = cells[row][col]; if (!cell) continue; fill(cell.r, cell.g, cell.b); text(cell.ch, col * CW, row * CH + CH - 2); } } for (const p of particles) { const opacity = map(p.life, 0, p.maxLife, 0, 255); fill(p.r, p.g, p.b, opacity); text(p.ch, p.x, p.y); } } function windowResized() { resizeCanvas(windowWidth, windowHeight); particles = []; initGrid(); }

Text particles