54 lines
1.7 KiB
Markdown
54 lines
1.7 KiB
Markdown
# By Other Means Control Timer
|
|
|
|
A round timer for **By Other Means**, a diplomacy/wargame-style event. Each 40-minute round is broken into four phases (Negotiation, Plenary, Discussion, Orders), and this app tracks elapsed time and displays the current phase to players.
|
|
|
|
- **Start Round** begins the timer and highlights the active phase as time passes.
|
|
- Once running, the button switches to **Prepare Next Round**, which asks for confirmation before resetting the timer for the next round.
|
|
- Time past the round length is shown in red and pulses to flag overtime.
|
|
|
|
Phase names, durations, descriptions, and colors are defined in `src/utils/constants.ts`.
|
|
|
|
## Tech Stack
|
|
|
|
Built with [TanStack Start](https://tanstack.com/start) (file-based routing via TanStack Router), React 19, Redux Toolkit + `redux-persist` for timer state, Luxon for time handling, and Tailwind CSS for styling.
|
|
|
|
## Getting Started
|
|
|
|
```bash
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
The dev server runs on port 8000 (see `vite.config.ts`).
|
|
|
|
## Building For Production
|
|
|
|
```bash
|
|
npm run build
|
|
```
|
|
|
|
A `Dockerfile` is included for containerized deployment.
|
|
|
|
## Linting & Formatting
|
|
|
|
This project uses [Biome](https://biomejs.dev/) for linting and formatting.
|
|
|
|
```bash
|
|
npm run lint
|
|
npm run format
|
|
npm run check
|
|
```
|
|
|
|
## Project Structure
|
|
|
|
- `src/routes/` — file-based routes (`__root.tsx`, `index.tsx`)
|
|
- `src/pages/Welcome.tsx` — main timer view
|
|
- `src/components/` — `Phase` and `ConfirmModal` UI components
|
|
- `src/store/` — Redux store, `timeSlice` (start time) and `phaseSlice`
|
|
- `src/utils/` — phase/round constants, helper functions, and types
|
|
|
|
## Learn More
|
|
|
|
- [TanStack Start documentation](https://tanstack.com/start)
|
|
- [TanStack Router documentation](https://tanstack.com/router)
|