|
| 1 | +# ZHU Controller Toolkit |
| 2 | + |
| 3 | +Unified front-end shell for Houston ARTCC controller utilities. |
| 4 | + |
| 5 | +Current tools are registered in a single data file and rendered as searchable cards: |
| 6 | +- TFMS Viewer |
| 7 | +- Alias Guide (migrated internal route) |
| 8 | +- Split Map |
| 9 | +- RVM Reference |
| 10 | + |
| 11 | +## Getting Started |
| 12 | + |
| 13 | +Run the development server: |
| 14 | + |
| 15 | +```bash |
| 16 | +npm run dev |
| 17 | +``` |
| 18 | + |
| 19 | +Then open [http://localhost:3000](http://localhost:3000). |
| 20 | + |
| 21 | +## Project Structure |
| 22 | + |
| 23 | +- `data/tools.json`: tool registry (add/edit tools here) |
| 24 | +- `app/page.js`: homepage entry |
| 25 | +- `components/toolkit-home.js`: searchable tool grid UI |
| 26 | +- `app/tools/[id]/page.js`: per-tool detail pages |
| 27 | +- `app/tools/alias-guide/page.js`: migrated Alias Guide tool |
| 28 | +- `components/alias-guide-page.js`: refactored Alias UI (sidebar nav, search, cards) |
| 29 | +- `data/alias-guide.json`: normalized Alias data model used by the app |
| 30 | +- `data/alias-guide-markup.html`: imported source markup from legacy Alias Guide |
| 31 | +- `scripts/convert-alias-markup.mjs`: converter from legacy markup to normalized JSON |
| 32 | +- `lib/tools.js`: helpers for loading tool data |
| 33 | +- `app/globals.css`: shared theme tokens and utility classes |
| 34 | + |
| 35 | +## Adding a Tool |
| 36 | + |
| 37 | +Add a new object to `data/tools.json` with: |
| 38 | +- `id` |
| 39 | +- `name` |
| 40 | +- `description` |
| 41 | +- `url` |
| 42 | +- `liveUrl` |
| 43 | +- `category` |
| 44 | +- `status` |
| 45 | +- `icon` |
| 46 | +- `tags` |
| 47 | + |
| 48 | +The homepage and `/tools/[id]` route will automatically include it. |
| 49 | + |
| 50 | +## Alias Data Workflow |
| 51 | + |
| 52 | +The Alias Guide now renders from `data/alias-guide.json`. |
| 53 | + |
| 54 | +If you update legacy source HTML in `data/alias-guide-markup.html`, regenerate JSON with: |
| 55 | + |
| 56 | +```bash |
| 57 | +npm run alias:convert |
| 58 | +``` |
| 59 | + |
| 60 | +### Alias Module Notes |
| 61 | + |
| 62 | +- In `data/alias-guide.json`, most content fields store both: |
| 63 | + - `html`: rendered UI content (supports formatting tags) |
| 64 | + - `text`: plain-text content used for search/filter |
| 65 | +- Keep `html` and `text` semantically aligned when editing content. |
| 66 | +- Current section layout behavior: |
| 67 | + - `CRC/ZHU Basics`: explorer layout (accordion groups + sticky detail panel + share links) |
| 68 | + - `Pilot Help Messages`: explorer layout (accordion groups + sticky detail panel + share links) |
| 69 | + - `Autotrack`: informational table layout |
| 70 | + - `Standard Routes`: informational table layout |
| 71 | +- Explorer permalink links use URL query param: |
| 72 | + - `/tools/alias-guide?alias=<entry-id>#<section-id>` |
| 73 | + - currently enabled for `CRC/ZHU Basics` and `Pilot Help Messages` |
| 74 | + |
| 75 | +## Validate |
| 76 | + |
| 77 | +```bash |
| 78 | +npm run lint |
| 79 | +npm run build |
| 80 | +``` |
| 81 | + |
| 82 | +## Theme Modes |
| 83 | + |
| 84 | +The app now supports `Light`, `Dark`, and `System` mode via a global top-right selector. |
| 85 | +Preference is saved in `localStorage` (`theme-mode`). |
| 86 | + |
| 87 | +## GitHub Pages Deployment |
| 88 | + |
| 89 | +This project is configured for static export + GitHub Pages. |
| 90 | + |
| 91 | +Important files: |
| 92 | +- `next.config.mjs` (`output: "export"`) |
| 93 | +- `public/CNAME` (`toolkit.houston.center`) |
| 94 | +- `.github/workflows/deploy-pages.yml` |
| 95 | + |
| 96 | +Required one-time GitHub settings: |
| 97 | +1. In your repo, go to `Settings > Pages`. |
| 98 | +2. Under `Source`, select `GitHub Actions`. |
| 99 | +3. In your DNS provider, set `toolkit.houston.center` to GitHub Pages (CNAME target per GitHub docs). |
| 100 | + |
| 101 | +After that, pushes to `main` will build and deploy automatically. |
| 102 | + |
| 103 | +## Notes for PowerShell |
| 104 | + |
| 105 | +If your machine blocks `npm`/`npx` PowerShell scripts, use: |
| 106 | +- `npm.cmd run dev` |
| 107 | +- `npm.cmd run lint` |
| 108 | +- `npm.cmd run build` |
0 commit comments