vome-doom

  on('ui.render', { component: 'Pane', requestId: PANE }, async ($, e) => {
    if (e.surface !== 'terminal') {
      const { Text } = $.ui.resolve(e)
      return <Text>house.wad plays in the terminal.</Text>
    }
    const { Box, Text, Button, Raster, Client } = $.ui.resolve(e)
    // Room for the screen: the pane's width, its height less the strip and the buttons.
    room = { columns: Math.max(40, e.props.bodyColumns), rows: Math.max(12, (e.viewport?.rows ?? 40) - 6) }
    const now = await read($, phase)
    const said = await read($, note)
    const home = await read($, homeName)

    if (now === 'playing') {
      const shape = await read($, size)
      const line = await read($, status)
      if (!shape) return <Text dimColor>Starting…</Text>
      const text = line
        ? [line.room, line.aim ? `aiming at ${line.aim}` : '', line.last].filter(Boolean).join(' · ') || 'LIVE: this is your house'
        : 'LIVE: this is your house'
      return (
        <Box flexDirection="column">
          <Raster key="screen" columns={shape.columns} rows={shape.rows} cells={frame ?? blank(shape.columns, shape.rows)} />
          <Client
            key="keys"
            module="./keys.tsx"
            width={shape.columns}
            props={{ text, hint: 'Click here to play. Arrows/WASD move, Space fires, E uses, Y/N answers, M menu, Esc gives the keys back.' }}
          />
          <Box flexDirection="row" gap={1}>
            <Button key="stop" hotkey="q" onPress={() => stop($)}>Stop</Button>
            {said ? <Text dimColor wrap="truncate-end">{said}</Text> : null}
          </Box>
        </Box>
      )
    }

    const busy = now === 'checking' || now === 'downloading' || now === 'reading' || now === 'building'
    return (
      <Box flexDirection="column" gap={1}>
        <Text bold>house.wad{home ? `: ${home}` : ''}</Text>
        <Text wrap="wrap">
          Your home as a Doom level. Rooms are your areas; lamps, plugs and screens are where they really are. Shoot a lamp and it
          turns off for real. Use a door and its lock opens, after a Y/N. House problems are the monsters.
        </Text>
        {busy ? <Text color="yellow">{said ?? 'Working…'}</Text> : said ? <Text color={now === 'failed' ? 'red' : undefined} wrap="wrap">{said}</Text> : null}
        {busy ? null : (
          <Box flexDirection="row" gap={1}>
            <Button key="play" variant="primary" hotkey="p" onPress={() => start($, 'real')}>Play for real</Button>
            <Button key="practice" hotkey="t" onPress={() => start($, 'practice')}>Practice (nothing changes)</Button>
          </Box>
        )}
        <Text dimColor wrap="wrap">
          Needs Node 18 or newer. The first game downloads its data once (about 19 MB, Freedoom's free game data). Built from
          github.com/Vortitron/housewad.
        </Text>
      </Box>
    )
  })