UI Components

Website

Part	What it does
Sign in, account creation and recovery	Lets a researcher access the platform, create an account or reset a password. Hosted recovery uses a Supabase email link; local development does not send email.
Project list	Shows projects the account may open. + New project opens a separate popup with starting templates and project details. The current integration branch validates six preset files; a deployed build may lag behind it.
Project detail	Keeps experiments and team management together inside the selected project, with labelled model/script integration slots.
Team access	Lets the project lead add an existing account, make them a lead, researcher or observer, and choose their editable modules.
Setup	Separates Conditions (time, treatment and stimuli), Arena (starting doors), Templates (preset choice and region surfaces) and Environment (weather-based suggestions) beside a persistent arena. The control pane scrolls independently on desktop.
Template shelf	Reads available presets from JSON files and appears inside project creation and Setup. Preset ideas without a file are labelled as planned. The separate arena builder is implemented on feature/arena-editor but not yet in the checked integration build.
Embedded simulator	Hosts only the Godot 3D view, and loads on demand after an experiment opens in a separate browser tab.
Run and camera toolbar	Sends Start, Step, Reset, Speed, Camera and Reset view commands to Godot. The adjacent Doors strip changes a selected route live, without resetting the trial, for people with arena edit access.
Review	Summarizes recorded steps, shows formatted JSON in the browser or downloads JSON/CSV, saves runs and plays replays with an over-arena timeline and Exit replay.
Focus on arena	Hides surrounding UI and expands the arena while keeping a small Start/Pause and live-door overlay, until Escape or Exit focus view.
Model and script slots	Show where model adapters attach. In the checked integration build, a drop displays an explanation only; it does not save or run the file. Work in other branches or working copies needs separate verification.

Project modules set the ceiling for a project. A researcher's assigned modules narrow what that person can edit within it. These rules are enforced by the backend as well as reflected in the interface. The current modules are arena, light, odour, sound, treatment, simulation and demo agent settings. Temperature is planned, but not a working module yet.

Standalone Godot editor

Area	Main controls
Prepare, Arena	Select and edit spatial objects, surfaces, barriers and fixed lights.
Prepare, Conditions	Treatment, stimuli, timing, seed and demo agent settings.
Prepare, Templates	Load and save experiment configurations.
Run	See the 3D arena and current simulation state. The desktop build also displays native run controls.
Review, Results	See recorded steps, zone dwell and events, then export JSON or CSV.
Review, Replay	Save a run, load a recording, play, pause, step and seek.

When Godot is embedded in the website, these desktop editor menus are hidden. The website's Setup, Run and Review panels are the only researcher-facing controls.

The website communicates with Godot through a same-origin command bridge. The simulation kernel and JSON experiment schema remain separate from the UI. The current agent is a demonstration placeholder, not a biological model.

Shared appearance

The website and standalone Godot editor use the same Inter font file and base colors. The full token table, usage rules and rationale are in Visual language. The website defines tokens in web/styles.css; Godot defines them in src/app/brand_theme.gd. The UI contract test checks that their font files and shared colors still match. Ahmed's implemented 2D arena editor needs a final visual consistency check in the combined build.

AI Attribution: This page was updated with OpenAI Codex assistance and should be reviewed by the team before submission.