Lobby

The public front of a private house. The landing page shows the house on the lake: the Market Board Facade is entered by the main gate and is open to everyone; the other rooms are reached through the windows of the quarter they belong to, and each asks for a key.

Every scene has a photo slot: a photorealistic image with the right name in assets/img/ is used automatically; until then a drawn SVG scene stands in. The images are generated with the OpenAI image API by the Generate scene images workflow (tools/gen_images.py, prompts in assets/img/prompts.json), which needs the repository secret OPENAI_API_KEY. The Fin Lab analyst is a photograph (fin-lab/assets/analyst.jpg) with generated keyframes of the same woman that the page crossfades between so she blinks, turns to you, talks, waves and points.

Live site: https://hongguqaz.github.io/Lobby/ (after GitHub Pages is enabled, see below)

Drive (private)                              Lobby (public, this repository)
  market-board-facade/  data + pipeline  -->   market-board-facade/  the board, as a dashboard   (open)
  fin-lab/              reserved         -->   fin-lab/              trading-floor office        (key)
  legal-quarter/        reserved         -->   legal-quarter/        walnut-panelled chambers    (key)
  library/              reserved         -->   library/              the study in the west tower (key)
  maiden-hall/          reserved         -->   maiden-hall/          drawing room over the gate  (key)
  garden/               reserved         -->   garden/               the grounds                 (key)
  bedroom/              reserved         -->   bedroom/              the east tower              (key)
                                               index.html            the painting

Only result files cross from Drive to Lobby. Source data never enters this repository.

The rooms and where they sit

Room	Where in the house	Why there	Status
Market Board Facade	the main gate	meant to be seen from outside	open, sample data
Fin Lab	west wing, ground floor	what it gathers feeds the board outside	reserved
Legal Quarter	east wing, ground floor	the law of the market beside the market	reserved
Maiden Hall	piano nobile, over the gate	where the work of both wings is written up	reserved
Library	west tower	the wider reading the lab draws on	reserved
Bedroom	east tower	private quarters, furthest from the gate	design only
Garden	the grounds	outside the walls, for lighter things	design only

assets/rooms.js is the registry the landing page and the gate read from; each room carries a hotspot box on a 1600 x 900 grid that assets/castle.js draws as a clickable overlay over the painting or the photo. Move the boxes if your castle.jpg is composed differently.

Keys

Every room except the facade is behind a key. The gate is client-side (assets/gate.js): each room's key is stored as a SHA-256 hash, the visitor's key is hashed in the browser and compared, and an unlocked room is remembered for the browser session. All rooms currently use the key 1111.

To change a key, hash the new one and paste it into KEYS in assets/gate.js:

python3 -c "import hashlib;print(hashlib.sha256(b'NEW-KEY').hexdigest())"

Because the site is static and public, this keeps casual visitors out but is not real security: the room pages are in the repository and anyone who reads the page source can bypass the gate. For material that must stay private, keep it in Drive.

Structure

Path	What it is
index.html	The stage (drawn painting or assets/img/castle.jpg), hotspot overlay, room cards and the gate.
assets/castle-painting.svg	The drawn fallback scene, generated by tools/paint_castle.py.
assets/img/	Photo slots for every scene, with a README of prompts.
assets/rooms.js	Room registry: names, folders, placement, lock state, hotspot boxes.
assets/gate.js, assets/gate.css	The password gate and its brass plate.
assets/castle.js, assets/site.css	Landing-page behaviour and styles.
assets/tokens.css	Light/dark tokens for the landing page and the board.
assets/rooms.css	Shared skeleton for the room pages; each page sets its own palette.
market-board-facade/	The board: index.html, assets/, data/dashboard.json from the private pipeline.
fin-lab/	Office scene, ticker, and the analyst: a photographic guide (assets/analyst.jpg, assets/figure.js) who talks in EN/KO, turns toward the pointer, breathes, and nods when clicked.
legal-quarter/, library/, maiden-hall/, garden/, bedroom/	Themed rooms, each a single index.html generated by tools/build_rooms.py.
tools/	paint_castle.py and build_rooms.py, the generators for the drawn scenes and room pages.
scripts/check_public_data.py	CI guard: no spreadsheets committed, images only in assets folders, published aggregate well-formed.
.github/workflows/pages.yml	Runs the guard on every push, deploys the default branch to GitHub Pages.

The Market Board Facade

market-board-facade/index.html renders market-board-facade/data/dashboard.json. The board is meant for financial market data (uploaded, auto-updated, or extracted from the Fin Lab); until that database exists it demonstrates the mechanics with a synthetic vendor dataset, and says so in a banner. The published data holds names and per-period sums and counts only, never rows, identifiers or free text.

Viewing locally

Open index.html in a browser, or serve the folder:

python -m http.server 8000     # then open http://localhost:8000/

One-time setup

• GitHub Pages: Settings > Pages > Build and deployment > Source: GitHub Actions. Until it is enabled the deploy job is skipped with a warning and only the data check runs.
• Publishing token: Drive needs a secret LOBBY_DEPLOY_TOKEN with Contents: Read and write on this repository. Details are in Drive's README.
• Keys: change the shared 1111 before putting anything sensitive behind a door.
• Scene images: add the repository secret OPENAI_API_KEY, then run the Generate scene images workflow from the Actions tab. It commits the images and redeploys the site.