@@ -121,27 +126,47 @@ export function Architect({ engine, hud }: { engine: GameEngine; hud: HudSnapsho
Drag organelles between slots. Placement matters: synergies light up between neighbors. The cortex holds membrane machinery (flagella, cilia, extrusomes, eyespots).
+ Drag organelles between slots. Placement matters: synergies light up between neighbors. The cortex holds membrane machinery
+ (flagella, cilia, extrusomes, eyespots).
+
@@ -149,13 +174,26 @@ export function Architect({ engine, hud }: { engine: GameEngine; hud: HudSnapsho
- {b.name} {b.owned}/{b.max}
+
+ {b.name}{' '}
+
+ {b.owned}/{b.max}
+
+
{b.role}
{!b.ok && {b.reason}}
))}
diff --git a/src/ui/Hud.tsx b/src/ui/Hud.tsx
index 8e46387..580515a 100644
--- a/src/ui/Hud.tsx
+++ b/src/ui/Hud.tsx
@@ -4,14 +4,39 @@ import { FATES } from '@/game/sim/organelles';
import { SPECIES } from '@/game/sim/species';
import type { LightMode, UnlockId } from '@/game/sim/types';
import { fmt } from './hooks';
-import { AbilityIcon, AtpIcon, BiomassIcon, DnaIcon, GlucoseIcon, IntegrityIcon, LightIcon, PauseIcon, SpeakerIcon, SunIcon } from './icons';
+import {
+ AbilityIcon,
+ AtpIcon,
+ BiomassIcon,
+ DnaIcon,
+ GlucoseIcon,
+ IntegrityIcon,
+ LightIcon,
+ PauseIcon,
+ SpeakerIcon,
+ SunIcon,
+} from './icons';
import { Radar } from './Radar';
// The HUD grows with the organism: each element appears (with a soft reveal
// animation on mount) once the run has given the player a reason to need it.
const has = (hud: HudSnapshot, id: UnlockId) => hud.unlocked.includes(id);
-function Ring({ value, max, color, icon, label, warn }: { value: number; max: number; color: string; icon: ReactNode; label: string; warn?: boolean }) {
+function Ring({
+ value,
+ max,
+ color,
+ icon,
+ label,
+ warn,
+}: {
+ value: number;
+ max: number;
+ color: string;
+ icon: ReactNode;
+ label: string;
+ warn?: boolean;
+}) {
const r = 22;
const c = 2 * Math.PI * r;
const k = Math.max(0, Math.min(1, value / Math.max(1, max)));
@@ -20,8 +45,15 @@ function Ring({ value, max, color, icon, label, warn }: { value: number; max: nu
@@ -33,14 +65,31 @@ function Ring({ value, max, color, icon, label, warn }: { value: number; max: nu
);
}
-function Meter({ icon, k, value, max, gradient, title }: { icon: ReactNode; k: number; value: string; max: number; gradient: string; title: string }) {
+function Meter({
+ icon,
+ k,
+ value,
+ max,
+ gradient,
+ title,
+}: {
+ icon: ReactNode;
+ k: number;
+ value: string;
+ max: number;
+ gradient: string;
+ title: string;
+}) {
return (
{icon}
-
{value}/{max}
+
+ {value}
+ /{max}
+
);
}
@@ -50,25 +99,52 @@ function Vitals({ hud, engine }: { hud: HudSnapshot; engine: GameEngine }) {
} label="ATP" warn={hud.atp < 15} />
- } label="Membrane" warn={hud.integrity < hud.maxIntegrity * 0.35} />
+ }
+ label="Membrane"
+ warn={hud.integrity < hud.maxIntegrity * 0.35}
+ />
{has(hud, 'glucose') && (
- } label="Glucose" warn={hud.glucose < 6} />
+ }
+ label="Glucose"
+ warn={hud.glucose < 6}
+ />
)}
{has(hud, 'biomass') && (
} k={hud.biomass / hud.division.threshold} value={fmt(hud.biomass)} max={hud.division.threshold}
- gradient="linear-gradient(90deg,#ff9a6b,#b48cff)" title="Biomass: builds organelles and drives growth. Reach the threshold to divide."
+ icon={}
+ k={hud.biomass / hud.division.threshold}
+ value={fmt(hud.biomass)}
+ max={hud.division.threshold}
+ gradient="linear-gradient(90deg,#ff9a6b,#b48cff)"
+ title="Biomass: builds organelles and drives growth. Reach the threshold to divide."
/>
)}
{has(hud, 'dna') && (
} k={hud.dna / hud.division.dna} value={fmt(hud.dna, 1)} max={hud.division.dna}
- gradient="linear-gradient(90deg,#5ab0ff,#ff5f9e)" title="Nucleotides: needed to replicate the genome and to mutate."
+ icon={}
+ k={hud.dna / hud.division.dna}
+ value={fmt(hud.dna, 1)}
+ max={hud.division.dna}
+ gradient="linear-gradient(90deg,#5ab0ff,#ff5f9e)"
+ title="Nucleotides: needed to replicate the genome and to mutate."
/>
)}
{hud.division.progress > 0 ? (
-
+
) : hud.division.ok ? (
);
@@ -374,10 +537,19 @@ export function Toasts({ toasts, engine, docked }: { toasts: Toast[]; engine: Ga
return (