diff --git a/src/app/fear/scene-components/finale-text.tsx b/src/app/fear/scene-components/finale-text.tsx index 513bbaa..c412e7b 100644 --- a/src/app/fear/scene-components/finale-text.tsx +++ b/src/app/fear/scene-components/finale-text.tsx @@ -3,6 +3,13 @@ import { fearState } from "../state" import './finale-text.css'; +const BLOCKS = [ + "▀", "▂", "▃", "▄", "▅", "▆", "▇", + "█", "▉", "▊", "▋", "▌", "▍", "▎", "▏", + "▐", "░", "▒", "▓", "▔", "▕", "▖", "▗", + "▘", "▙", "▚", "▛", "▜", "▝", "▞", "▟" +]; + export default function FinaleText() { const [wasCaught, setWasCaught] = useState(fearState.wasCaught); const [elements, setElements] = useState([]); @@ -20,13 +27,20 @@ export default function FinaleText() { return; const interval = setInterval(() => { - setElements((prev) => [ - ...prev, - - the deal has been sealed - + if (Math.random() > 0.9) return; + + const baseText = "the deal has been sealed"; + const corrupted = baseText + .split("") + .map((char) => (Math.random() > 0.98 ? BLOCKS[Math.floor(Math.random() * BLOCKS.length)] : char)) + .join(""); + + setElements((prev) => [...prev.slice(-30), + + {corrupted} + ]); - }, 25); + }, 10); return () => clearInterval(interval); }, [wasCaught]);