-
-
-
-
-
-
setDecorFrames((v) => ({ ...v, poster: randFrame(DECOR_SPRITES.posters) }))}
- />
- setDecorFrames((v) => ({ ...v, plantA: randFrame(DECOR_SPRITES.plants) }))}
- />
- setDecorFrames((v) => ({ ...v, plantB: randFrame(DECOR_SPRITES.plants) }))}
- />
- setDecorFrames((v) => ({ ...v, plantC: randFrame(DECOR_SPRITES.plants) }))}
- />
-
-
- setVisualState('idle')}
- />
-
-
- setCoffeePaused((v) => !v)}
- />
-
- setVisualState('working')}
- />
- setDecorFrames((v) => ({ ...v, flower: randFrame(DECOR_SPRITES.flowers) }))}
- />
-
-
- {
- const p = worldToScreen({ x: mainPos.x, y: mainPos.y + 62 }, camera);
- return { left: `${p.x}%`, top: `${p.y}%` };
- })(),
- zIndex: 55,
- }}
- >
-
{main.name || main.id || 'main'}
-
-
- {mainBubble && mainBubble.expiresAt > Date.now() ? (
-
- ) : null}
-
- {placedNodes.map((n) => {
- const p = nodePos[n.key] || n.point;
- const nodeFrame = frameAtTick(NODE_SPRITES[n.spriteIndex], tick, n.avatarSeed % 1000);
- const nodeBubble = nodeBubbles[n.key];
- return (
-
-
- {nodeBubble && nodeBubble.expiresAt > Date.now() ? (
-
- ) : null}
-
- );
- })}
-
- setDecorFrames((v) => ({ ...v, cat: randFrame(DECOR_SPRITES.cats) }))}
- />
-
- {showDebug ? (
- <>
- {Object.entries(OFFICE_ZONE_POINT).map(([zone, p]) => {
- const s = worldToScreen(p, camera);
- return (
-
- );
- })}
- {Object.entries(OFFICE_ZONE_SLOTS).map(([zone, slots]) =>
- slots.map((p, idx) => {
- const s = worldToScreen(p, camera);
- return (
-
- );
- })
- )}
- >
- ) : null}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- state={effectiveMainState} live={liveMainState} mode={manualState ? `manual(${manualLeftSec}s)` : 'follow'} server={serverMode} coffee={coffeePaused ? 'paused' : 'on'}
-
-
- {showDebug ? (
-
- cam x={camera.x.toFixed(1)} y={camera.y.toFixed(1)} zoom={camera.zoom.toFixed(2)}
- {pointerWorld ? ` | pointer ${Math.round(pointerWorld.x)},${Math.round(pointerWorld.y)}` : ''}
- {` | nodes ${placedNodes.length}`}
-
- ) : null}
-