release: v2.11.2

CHANGELOG.md

@@ -2,8 +2,133 @@
 
 All notable changes to this project will be documented in this file.
 
+## 2.11.2 - 2026-09-05
+
+### Changed
+
+- Refreshed the vendored AdminLTE assets to 4.9.1, including the print-layout fixes and extended palette updates.
+- Added independently configurable verification, password-reset, and invitation email expiry periods, with an `[[expiry_time]]` template variable.
+- Updated default account email templates with inline formatting, action buttons, and links, and improved rendering when both button and URL placeholders are used.
+- Shortened user-agent labels across audit logs and account session lists, and removed red/green change highlighting from audit entries.
+
+## 2.11.1 - 2026-09-02
+
+### Added
+
+- Secure administrator invitations that create accounts only after the recipient accepts the invitation.
+- Configurable API progress-bar placeholders with AdminLTE and announcement palette colors, custom colors, striped and animated variants, and quoted numeric literals.
+- An optional `textless` progress-bar modifier to hide the visible percentage while retaining progress accessibility metadata.
+- Configurable progress-bar radius options including `square`, `pill`, `rounded`, and validated `radius(...)` values.
+- Arithmetic API placeholder transforms for adding, subtracting, multiplying, and dividing numeric values.
+- Time-based progress bars using start and end date/time fields to show elapsed timetable-item progress.
+- Audit events for invitation sending and acceptance, email verification, password-reset requests, and account email changes.
+- A pending invitations page with invitation-specific Read, Create, Delete, and Allow permissions.
+- Invitation deletion and resend actions with confirmation prompts.
+- An opt-in Weather audit category for weather-location changes and manually queued refreshes.
+- Opt-in per-command Screen Controls auditing, with forward and back navigation grouped together and disabled by default.
+- The pending invitations list now supports pagination, search, and sorting, with Users, Roles, and Invitations grouped under expandable User management navigation.
+- API progress calculations now support object-wrapped amounts.
+
+### Changed
+
+- Updated the invitation registration page to show fields only for valid tokens, use the themed failure state for invalid links, and pre-fill the invited email and display name.
+- Made the invited email visibly disabled, kept the display name editable and required, and aligned invitation actions with the existing user forms.
+- Added bold, italic, and underline formatting controls to the user invitation email message template editor.
+- Fixed application-settings cleanup SQL so media and icon saves preserve all supported settings and no longer fail with MariaDB placeholder errors.
+- Updated API progress bars to inherit the surrounding WYSIWYG text size and text color, preserve rounded corners, and render consistently in the editor preview, player, and thumbnails.
+
+## 2.11.0 - 2026-09-02
+
+### Added
+
+- Optional account emails with administrator verification bypass, email verification, password recovery, and confirmed email changes.
+- SMTP configuration and mail delivery for account notifications.
+- Autofill restrictions for Bitwarden, LastPass, and 1Password on account profile and new-password fields while preserving current-password autofill.
+
+### Changed
+
+- Updated account email templates and previews to support both line breaks and paragraph spacing.
+
+## 2.10.7 - 2026-09-02
+
+### Added
+
+- API token authentication now reuses access tokens until their expiry and can renew them with a refresh token, including refresh-token rotation.
+- API sources can configure a refresh URL, JSON request body, and refresh-token response path.
+- Client status badges now show Live, Paused, and Blackout states in the responsive Connected clients view.
+
+### Changed
+
+- Reorganized the API source editor into compact Connection, Authentication, and Latest response cards, with authentication collapsed by default on edit pages.
+- Redesigned the Connected clients page for responsive mobile cards with compact controls, expandable search, pairing access, two-line detail clamping, and aligned desktop screen-group controls.
+
+### Fixed
+
+- Fixed client screen moves from mobile cards so the next move disables the client’s current screen group rather than its previous one.
+- Removed unused Bootstrap Icons font preloads that triggered browser warnings on pages where icons were not rendered.
+
+## 2.10.6 - 2026-08-29
+
+### Added
+
+- Playlist recovery now uses cached browser and server snapshots, reports offline status, and recovers after cached responses.
+
+### Changed
+
+- Refactored the player runtime into focused animation, media, transition, command, playback, and rendering modules.
+- Improved player slide transitions and video playback by preloading media, preserving precise durations, pausing outgoing videos during crossfades, and deferring expensive post-render setup.
+
+### Fixed
+
+- Fixed remote player commands and media synchronization so they route through the bridge using the physical player device identity, including announcement and playlist refresh notifications.
+- Fixed player media handling for remote bridge uploads and deletes by using the bridge endpoint with explicit player-device authentication.
+- Fixed player service-worker caching so ranged media requests bypass stale cached responses and video playback remains reliable.
+
+## 2.10.5 - 2026-08-29
+
+### Fixed
+
+- Fixed intermittent pairing failures while player registration and pairing sessions propagate through the bridge by retrying transient resolution and completion requests.
+- Fixed the pairing page so transient submission failures retry automatically and pairing progress uses a single spinner without dimming the form.
+- Fixed the player onboarding page so it continues polling until the pairing code and QR code are available.
+
+## 2.10.4 - 2026-08-29
+
+### Fixed
+
+- Fixed remote client move commands so they route through the player bridge to the correct browser tab using the physical player identity and connection ID.
+- Removed the obsolete `PLAYER_BASE_URL` configuration fallback; command routing uses `PLAYER_INTERNAL_URL` locally or the player bridge remotely, while `PLAYER_PUBLIC_URL` remains available for kiosk launcher and direct player access.
+- Removed the player URL list from screen-group add/edit pages and expanded the remaining form card to full width.
+
+## 2.10.3 - 2026-08-28
+
+### Added
+
+- Remote screens now poll periodically to recover from missed refresh commands after bridge reconnects.
+- Screens now use cached playlist snapshots while the bridge or web service is temporarily unavailable.
+
+### Fixed
+
+- Fixed the weather edit preview so the daily forecast is shown initially, the 24-hour forecast is hidden until selected, and the redundant hourly heading is removed.
+- Fixed onboarding cleanup so incomplete pairings are retained for the 15-minute pairing-code lifetime while inactive completed bindings are pruned after 24 hours.
+- Fixed client-name handling so offline names can be reused, active collisions receive numeric suffixes, and reconnecting players resolve duplicate names consistently.
+- Fixed an internal server error when renaming clients by forwarding the available-name resolver to the client command routes.
+- Fixed remote client moves to resolve the paired browser client binding before changing its target screen.
+- Fixed remote player heartbeats to update the central onboarding bindings for active browser clients without treating the physical player registry ID as a client binding.
+- Fixed targeted commands after browser reconnects by falling back to the stable client ID when a transient connection ID is stale.
+- Fixed stale browser command connections remaining active indefinitely when the physical player heartbeat was still healthy.
+- Fixed media synchronization so generated player caches are excluded while remote image caches remain available to players.
+- Fixed weather screen notifications so changes in the fetched data or the current forecast hour trigger a refresh.
+- Fixed player runtime script loading and slide rendering so region modules, transitions, and cached playlists initialize consistently.
+- Fixed command delivery reporting to require acknowledgement from the receiving browser tab.
+- Fixed playlist refresh notifications to target the physical player hosting each screen instead of always targeting the local player.
+
 ## 2.10.2 - 2026-08-28
 
+### Added
+
+- Onboarding client heartbeats are now persisted so records inactive for 24 hours can be pruned without relying on player connectivity after the fact.
+
 ### Fixed
 
 - Fixed the weather forecast preview to show only its first-fetch message until a successful forecast is available.
@@ -12,30 +137,30 @@ All notable changes to this project will be documented in this file.
 
 ### Added
 
-- Added linear gradient backgrounds to templates, including multiple colours and angle control.
-- Added a visual gradient stop editor with draggable stops, click-to-add support, and stop reordering.
+- Linear gradient backgrounds to templates, including multiple colours and angle control.
+- A visual gradient stop editor with draggable stops, click-to-add support, and stop reordering.
 
 ## 2.10.0 - 2026-08-28
 
 ### Added
 
-- Added secure kiosk onboarding with QR-first and manual pairing flows.
-- Added browser-specific pairing sessions with expiring pairing codes.
-- Added circular QR presentation and a compatible QR scanner with decoder fallbacks.
-- Added responsive player onboarding and a post-pair option to connect another player.
-- Added stable player identity bindings for paired players and moved-client aliases.
-- Added per-tab client identities backed by browser session storage for commands, pairing, and screen moves.
-- Added RBAC protection for player pairing through the `pairing.allow` permission.
-- Added a dedicated web onboarding workflow for pairing and managing player setup.
+- Secure kiosk onboarding with QR-first and manual pairing flows.
+- Browser-specific pairing sessions with expiring pairing codes.
+- Circular QR presentation and a compatible QR scanner with decoder fallbacks.
+- Responsive player onboarding and a post-pair option to connect another player.
+- Stable player identity bindings for paired players and moved-client aliases.
+- Per-tab client identities backed by browser session storage for commands, pairing, and screen moves.
+- RBAC protection for player pairing through the `pairing.allow` permission.
+- A dedicated web onboarding workflow for pairing and managing player setup.
+- Pairing entry points now appear in the dashboard and connected clients workflows.
+- A mobile-friendly connected clients link is now shown after successful pairing.
+- Player keyboard feedback now includes slide navigation, plus `P` pause/unpause and `B` blackout toggles.
 
 ### Changed
 
 - Restricted direct screen URLs to the player configured for the requested screen.
-- Added pairing entry points to the dashboard and connected clients workflows.
 - Made pairing QR codes easier to scan by encoding only the short pairing code.
-- Added a mobile-friendly connected clients link after successful pairing.
 - Made connected-client controls and player pairing UI render independently according to their permissions.
-- Added player keyboard feedback for slide navigation, plus `P` pause/unpause and `B` blackout toggles.
 - Removed client identities from onboarding and screen-move URLs; authorized player data now loads after the tab identity handshake.
 - Updated connected-client commands and screen moves to resolve tab and registered-player identities reliably.
 
@@ -44,9 +169,10 @@ All notable changes to this project will be documented in this file.
 ### Added
 
 - API sources, RSS feeds, and weather locations can be enabled or disabled without deleting their cached data.
-- Added Weather slide regions with current, daily, and hourly placeholders, date/time transforms, and Bootstrap weather icon transforms.
-- Added multiple saved weather locations with provider, coordinate, unit, and refresh settings.
-- Added separate Allow permissions for manually refreshing API sources, RSS feeds, and weather locations.
+- Weather slide regions with current, daily, and hourly placeholders, date/time transforms, and Bootstrap weather icon transforms.
+- Multiple saved weather locations with provider, coordinate, unit, and refresh settings.
+- Separate Allow permissions for manually refreshing API sources, RSS feeds, and weather locations.
+- Announcement colour choices and player rendering now include the AdminLTE extended palette colours.
 
 ### Changed
 
@@ -59,7 +185,6 @@ All notable changes to this project will be documented in this file.
 - Startup data-source refreshes now respect each API, RSS, and weather source's configured repull interval.
 - RSS feeds now persist their last collection timestamp.
 - Refreshed the vendored AdminLTE assets to 4.8.5.
-- Added AdminLTE extended palette colours to announcement colour choices and player rendering.
 - Removed Digital Signage Subheading and top padding.
 - API and RSS source saves now preserve cached data without pulling; added explicit manual refresh actions.
 
@@ -67,13 +192,16 @@ All notable changes to this project will be documented in this file.
 
 ### Added
 
-- Added configurable JSON POST requests and two-step login-then-token authentication for API sources.
+- Configurable JSON POST requests and two-step login-then-token authentication for API sources.
 
 ## 2.8.6 - 2026-08-18
 
+### Added
+
+- URL fields now provide live validation with inline feedback and explicit HTTP or HTTPS scheme enforcement.
+
 ### Fixed
 
-- Added live URL validation with inline feedback and explicit HTTP or HTTPS scheme enforcement for URL fields.
 - Prevented Enter in slide editor inputs from implicitly saving the slide.
 - Collapsed nested API response JSON sections by default while keeping the root response visible.
 
@@ -88,8 +216,8 @@ All notable changes to this project will be documented in this file.
 
 ### Added
 
-- Added local caching for API and RSS image placeholders under `player-cache/remote-images` for offline player playback.
-- Added reconciliation of cached remote images so files no longer referenced by slides are removed.
+- Local caching for API and RSS image placeholders under `player-cache/remote-images` for offline player playback.
+- Reconciliation of cached remote images so files no longer referenced by slides are removed.
 
 ### Fixed
 
@@ -101,8 +229,8 @@ All notable changes to this project will be documented in this file.
 
 ### Added
 
-- Added API, RSS, Timetable, and Time / Date placeholder help panels with shared transform and date-token documentation.
-- Added render-time API and RSS image placeholders with proportional sizing and preview-only bounding boxes.
+- API, RSS, Timetable, and Time / Date placeholder help panels with shared transform and date-token documentation.
+- Render-time API and RSS image placeholders with proportional sizing and preview-only bounding boxes.
 
 ### Changed
 
@@ -147,6 +275,7 @@ All notable changes to this project will be documented in this file.
 - A permissions-gated System Settings page for announcement icon suggestions, media upload limits and MIME types, session lifetime, and password-change policies.
 - Configurable forced password changes for newly created users and administrator password resets.
 - The database foundation for key-based application settings, including typed defaults and validation.
+- All tables now use numeric auto-increment identifiers while retaining natural or relationship keys as unique constraints.
 
 ### Changed
 
@@ -161,7 +290,6 @@ All notable changes to this project will be documented in this file.
 - Replaced password strength presets with customizable length, category, and character requirements.
 - Session expiration now uses the configured system setting, and user and role administration is grouped under the Settings area.
 - Renamed the system settings permissions to the `system-settings.*` namespace and migrated existing role assignments.
-- Added numeric auto-increment identifiers to every table and retained natural or relationship keys as unique constraints.
 
 ## 2.7.6 - 2026-08-15
 
@@ -459,7 +587,7 @@ All notable changes to this project will be documented in this file.
 
 ### Added
 
-- Added branded Windows and Linux kiosk launcher downloads on the dashboard, with updated copy that explains the launcher behavior more clearly.
+- Branded Windows and Linux kiosk launcher downloads on the dashboard, with updated copy that explains the launcher behavior more clearly.
 - Kiosk launchers now start the browser in kiosk mode, suppress notifications for Chromium-based browsers, and use the correct Firefox kiosk flag.
 
 
@@ -757,13 +885,13 @@ All notable changes to this project will be documented in this file.
 ### Added
 
 - Screen and dashboard player links now render the full player URL instead of only the player base host.
+- Notes near the singleton-player code paths to make the future multi-player migration work easier to revisit.
 
 ### Changed
 
 - The player registry now uses a singleton `d_players` row and `d_screens.player_id` points at that shared player record.
 - Player startup is now responsible for creating the shared player record, while onboarding and state polling no longer create extra player rows.
 - The screen/player binding path was simplified so opening a screen binds it to the shared player record without trying to re-register the player.
-- Added notes near the singleton-player code paths to make the future multi-player migration work easier to revisit.
 - Managed fonts now have dedicated editor/player sync handling, including a scheduled font sweep, sorted font-family lists, the TinyMCE fullscreen button, and shared font stylesheet loading in the WYSIWYG editor.
 - Text and RSS region types now own their own default style and fallback behavior instead of relying on shared slide helper fallbacks.
 - Image and video region handling was also pushed further into modular per-type modules, keeping their editor, preview, and player logic closer to the region itself instead of the shared slide helper layer.
@@ -1036,9 +1164,12 @@ All notable changes to this project will be documented in this file.
 
 ## 1.3.3 - 2026-07-21
 
+### Added
+
+- The first round of modular admin-page work, including a shared admin route layer and refreshed dashboard/list rendering.
+
 ### Changed
 
-- Added the first round of modular admin-page work, including a shared admin route layer and refreshed dashboard/list rendering.
 - Updated the admin shell styling and layout handling for the newer page structure.
 - Adjusted package metadata and lockfile state to match the release.
 
@@ -1124,4 +1255,4 @@ All notable changes to this project will be documented in this file.
 
 ### Fixed
 
-- Initial release.
+- Initial release.

README.md

@@ -25,7 +25,7 @@ It gives you one place to publish playlists, slides, announcements, and live upd
 
 Docker Compose is the recommended way to deploy Pulse Signage. It keeps the web app, player, bridge, and database together in a predictable setup.
 
-If you want the details, start with the [Compose guide](docker-compose/README.md).
+For a complete installation, follow the [public stack setup](docker-compose/README.md#public-stack-setup). For screens on separate devices, use the [remote player setup](docker-compose/README.md#remote-player-setup).
 
 ## Docs
 
@@ -33,7 +33,6 @@ If you want the details, start with the [Compose guide](docker-compose/README.md
 - [API reference](docs/api.md) - the player HTTP surface and onboarding endpoints.
 - [Database schema](docs/schema.md) - the tables and data model the app maintains.
 - [WebSocket reference](docs/websocket.md) - the live player and snapshot channels.
-- [Compose guide](docker-compose/README.md) - deployment options and service layout.
 - [Changelog](CHANGELOG.md) - release history and notable changes.
 
 ## Explore The Docs

build/package.player.json

@@ -1,6 +1,6 @@
 {
   "name": "pulse-signage-player",
-  "version": "2.10.2",
+  "version": "2.11.2",
   "private": false,
   "description": "Pulse Signage player application bundle",
   "engines": {

build/package.web.json

@@ -1,6 +1,6 @@
 {
   "name": "pulse-signage-web",
-  "version": "2.10.2",
+  "version": "2.11.2",
   "private": false,
   "description": "Pulse Signage web and bridge application bundle",
   "engines": {
@@ -18,6 +18,7 @@
     "handlebars": "^4.7.8",
     "multer": "^2.2.0",
     "mysql2": "^3.23.3",
+    "nodemailer": "^9.1.1",
     "puppeteer-core": "^25.7.0",
     "sharp": "^0.35.3",
     "jsqr": "^1.4.0",

docker-compose/.env.example

@@ -1,9 +1,11 @@
-# Shared application settings
+# Container images
 PULSE_SIGNAGE_WEB_IMAGE="git.lzstealth.com/lzstealth/pulse-signage-web:latest"
 PULSE_SIGNAGE_PLAYER_IMAGE="git.lzstealth.com/lzstealth/pulse-signage-player:latest"
+
+# Shared security
 PULSE_SIGNAGE_SHARED_SECRET=""
 
-# Database settings for the web, player, and bridge services
+# Database
 DB_HOST="mysql"
 DB_PORT=3306
 DB_NAME="pulse-signage"
@@ -11,17 +13,19 @@ DB_USER="pulse-signage"
 DB_PASSWORD="signage_password"
 MYSQL_ROOT_PASSWORD="root_password"
 
-# Player settings
+# Web application
+WEB_PUBLIC_URL="http://localhost:8080"
+WEB_INTERNAL_URL="http://web:8080"
+
+# Player
 PLAYER_IDENTIFIER="player-local"
 PLAYER_PUBLIC_URL="http://localhost:8081"
 PLAYER_INTERNAL_URL="http://player:8081"
-WEB_PUBLIC_URL="http://localhost:8080"
 
-# Web app bootstrap settings
+# Player bridge
+BRIDGE_INTERNAL_URL="http://player-bridge:8090"
+
+# First-run administrator
 DEFAULT_ADMIN_USERNAME="admin"
 DEFAULT_ADMIN_NAME="Admin"
-DEFAULT_ADMIN_PASSWORD="password123!"
-
-# Bridge settings for the player-bridge service
-WEB_INTERNAL_URL="http://web:8080"
-BRIDGE_INTERNAL_URL="http://player-bridge:8090"
+DEFAULT_ADMIN_PASSWORD="password123!"

docker-compose/.env.remote.example

@@ -1,11 +1,16 @@
-# Shared application settings
+# Container image
 PULSE_SIGNAGE_PLAYER_IMAGE="git.lzstealth.com/lzstealth/pulse-signage-player:latest"
+
+# Shared security
 PULSE_SIGNAGE_SHARED_SECRET=""
 
-# Player settings
+# Remote player
 PLAYER_IDENTIFIER="player-remote"
-PLAYER_PUBLIC_URL="http://localhost:8081"
+
+# Optional URL used by the kiosk launcher when the remote player is directly reachable
+PLAYER_PUBLIC_URL="http://remote-player.example.com:8081"
+
 PLAYER_AGENT_RECONNECT_DELAY_MS=5000
 
-# Remote player connectivity settings
+# Remote bridge connectivity
 BRIDGE_PUBLIC_URL="http://player-bridge.example.com:8090"

docker-compose/README.md

@@ -2,11 +2,26 @@
 
 This folder contains the Docker Compose definitions for Pulse Signage, including the public stack and the remote player stack.
 
+## Contents
+
+- [Files](#files)
+- [Stack Overview](#stack-overview)
+- [Services](#services)
+- [Environment Files](#environment-files)
+- [Public Stack Setup](#public-stack-setup)
+- [Remote Player Setup](#remote-player-setup)
+- [Shared Secret](#shared-secret)
+- [Ports](#ports)
+- [Volumes](#volumes)
+- [Networks](#networks)
+- [Notes](#notes)
+- [Deployment Checklist](#deployment-checklist)
+
 ## Files
 
 - [docker-compose.yml](docker-compose.yml) - full public stack with web, player, player bridge, and MySQL.
 - [.env.example](.env.example) - sample environment values for the public stack.
-- [docker-compose.remote.yml](docker-compose.remote.yml) - remote player-only stack for machines that sit behind the player bridge.
+- [docker-compose.remote.yml](docker-compose.remote.yml) - remote player-only stack using a published player image.
 - [.env.remote.example](.env.remote.example) - sample environment values for the remote stack.
 
 ## Stack Overview
@@ -45,10 +60,11 @@ Key configuration:
 
 - `DB_HOST`, `DB_PORT`, `DB_NAME`, `DB_USER`, `DB_PASSWORD`
 - `PULSE_SIGNAGE_SHARED_SECRET`
+- `WEB_PUBLIC_URL`
+- `BRIDGE_INTERNAL_URL`
 - `DEFAULT_ADMIN_USERNAME`
 - `DEFAULT_ADMIN_NAME`
 - `DEFAULT_ADMIN_PASSWORD`
-- `PASSWORD_HASH_ITERATIONS`
 
 ### `player`
 
@@ -57,7 +73,7 @@ The screen runtime that renders playlists and receives commands.
 Responsibilities:
 
 - serves the player UI on port `8081`
-- connects to MySQL in local mode
+- connects to MySQL in the public stack
 - connects to the bridge in remote mode through `BRIDGE_PUBLIC_URL`
 - registers live connections and accepts control commands
 
@@ -65,11 +81,11 @@ Key configuration:
 
 - `PLAYER_PUBLIC_URL`
 - `PLAYER_INTERNAL_URL`
-- `BRIDGE_INTERNAL_URL`
 - `PLAYER_IDENTIFIER`
 - `BRIDGE_PUBLIC_URL` in remote mode
 - `PULSE_SIGNAGE_SHARED_SECRET`
-- database settings in local mode
+- `WEB_PUBLIC_URL`
+- `DB_HOST`, `DB_PORT`, `DB_NAME`, `DB_USER`, `DB_PASSWORD` in local mode
 
 ### `player-bridge`
 
@@ -99,46 +115,106 @@ Responsibilities:
 
 Key configuration:
 
-- `MYSQL_DATABASE`
-- `MYSQL_USER`
-- `MYSQL_PASSWORD`
+- `DB_NAME`
+- `DB_USER`
+- `DB_PASSWORD`
 - `MYSQL_ROOT_PASSWORD`
 
 ## Environment Files
 
-### `.env.example`
+| File | Used by | How it is loaded |
+| --- | --- | --- |
+| `.env.example` | Public stack | Copy to `.env`; Compose loads it automatically, or pass it with `--env-file`. |
+| `.env.remote.example` | Published remote player | Copy to `.env.remote`; pass it with `--env-file .env.remote`. |
 
-Use this file as a starting point for the public compose stack.
+The example files are templates. Copy the appropriate file, review its defaults, and replace secrets or placeholder URLs before deploying.
+
+### Public stack: `.env.example`
+
+Use this file as a starting point for the public Compose stack.
 
 Important values:
 
-- `PULSE_SIGNAGE_WEB_IMAGE` - image to run for the web app and bridge services, typically `.../pulse-signage-web:latest`
-- `PULSE_SIGNAGE_PLAYER_IMAGE` - image to run for the player services, typically `.../pulse-signage-player:latest`
-- `PULSE_SIGNAGE_SHARED_SECRET` - long random secret shared by the web, player, and bridge services for authenticated requests
-- `PLAYER_IDENTIFIER` - unique local player identifier
-- `DB_*` - MySQL credentials and database name for the stack
-- `PLAYER_PUBLIC_URL` - public URL the player advertises
-- `PLAYER_INTERNAL_URL` - internal URL the web app uses for local player calls
-- `BRIDGE_INTERNAL_URL` - bridge URL the web app uses for player snapshot and command forwarding
-- `WEB_INTERNAL_URL` - internal URL the bridge uses to call the web app directly
-- `DEFAULT_ADMIN_*` - bootstrap admin account values
-- `PASSWORD_HASH_ITERATIONS` - password hashing cost
-- `MYSQL_ROOT_PASSWORD` - root password for the local MySQL container
+| Variable | Purpose | Default |
+| --- | --- | --- |
+| `PULSE_SIGNAGE_WEB_IMAGE` | Image for the web app and bridge services. | `git.lzstealth.com/lzstealth/pulse-signage-web:latest` |
+| `PULSE_SIGNAGE_PLAYER_IMAGE` | Image for the player services. | `git.lzstealth.com/lzstealth/pulse-signage-player:latest` |
+| `PULSE_SIGNAGE_SHARED_SECRET` | Shared request-signing secret. | Blank; set this for a secured deployment. |
+| `DB_HOST` | MySQL host name. | `mysql` |
+| `DB_PORT` | MySQL port. | `3306` |
+| `DB_NAME` | MySQL database name. | `pulse-signage` |
+| `DB_USER` | MySQL user name. | `pulse-signage` |
+| `DB_PASSWORD` | MySQL user password. | `signage_password` |
+| `MYSQL_ROOT_PASSWORD` | Local MySQL root password. | `root_password` |
+| `WEB_PUBLIC_URL` | Public URL of the web application. | `http://localhost:8080` |
+| `WEB_INTERNAL_URL` | Internal URL the bridge uses to call the web app. | `http://web:8080` |
+| `PLAYER_IDENTIFIER` | Unique local player identifier. | `player-local` |
+| `PLAYER_PUBLIC_URL` | URL used by the kiosk launcher and direct player access. | `http://localhost:8081` |
+| `PLAYER_INTERNAL_URL` | Internal URL used for local player calls. | `http://player:8081` |
+| `BRIDGE_INTERNAL_URL` | Bridge URL used for snapshots and command forwarding. | `http://player-bridge:8090` |
+| `DEFAULT_ADMIN_USERNAME` | Bootstrap admin username. | `admin` |
+| `DEFAULT_ADMIN_NAME` | Bootstrap admin display name. | `Admin` |
+| `DEFAULT_ADMIN_PASSWORD` | Bootstrap admin password. | `password123!` |
 
-### `.env.remote.example`
+### Remote player: `.env.remote.example`
 
-Use this file on a remote player device.
+Use this file as the starting point for a remote player device. The production remote Compose file reads values from Compose's environment, so pass the copied file explicitly with `--env-file`.
 
 Important values:
 
-- `PULSE_SIGNAGE_PLAYER_IMAGE` - image to run on the device, typically `.../pulse-signage-player:latest`
-- `PULSE_SIGNAGE_SHARED_SECRET` - must match the public stack and should be the same long random value used everywhere in the deployment
-- `PLAYER_IDENTIFIER` - unique remote player identifier
-- `PLAYER_PUBLIC_URL` - public URL for the remote player
-- `BRIDGE_PUBLIC_URL` - bridge URL the player connects back to
-- `PLAYER_AGENT_RECONNECT_DELAY_MS` - reconnect delay for the player agent
+| Variable | Purpose | Default |
+| --- | --- | --- |
+| `PULSE_SIGNAGE_PLAYER_IMAGE` | Image to run on the device. | `git.lzstealth.com/lzstealth/pulse-signage-player:latest` |
+| `PULSE_SIGNAGE_SHARED_SECRET` | Shared request-signing secret; must match the public stack. | Blank; set it to the public stack's secret. |
+| `PLAYER_IDENTIFIER` | Unique remote player identifier. | `player-remote` |
+| `PLAYER_PUBLIC_URL` | Optional URL for direct player access. | `http://remote-player.example.com:8081` |
+| `BRIDGE_PUBLIC_URL` | Bridge URL the player connects back to. | `http://player-bridge.example.com:8090`; replace this placeholder. |
+| `PLAYER_AGENT_RECONNECT_DELAY_MS` | Delay before reconnecting to the bridge. | `5000` |
 
-### `PULSE_SIGNAGE_SHARED_SECRET`
+## Public Stack Setup
+
+Install Docker Engine with Docker Compose, then run the public stack from this directory:
+
+```sh
+cp .env.example .env
+docker compose -f docker-compose.yml up -d
+```
+
+The command pulls the published images, creates the network and volumes, and starts the web app, local player, player bridge, and MySQL services. Check the installation with:
+
+```sh
+docker compose -f docker-compose.yml ps
+docker compose -f docker-compose.yml logs -f web
+```
+
+## Remote Player Setup
+
+A remote deployment has two parts:
+
+- the public stack runs the web app, database, and player bridge
+- each remote device runs only the player and connects back to the bridge
+
+The remote player does not need database credentials. Set `BRIDGE_PUBLIC_URL` to the externally reachable bridge URL, including its port when required. It must point to the bridge service, not the web dashboard URL. The bridge must be reachable from the device and allow both HTTP requests and the player websocket connection at `/ws/players`.
+
+### Published remote player
+
+On the remote device:
+
+```sh
+cp .env.remote.example .env.remote
+docker compose --env-file .env.remote -f docker-compose.remote.yml up -d
+```
+
+The published remote stack exposes the player on host port `8081`. Check its connection and startup output with:
+
+```sh
+docker compose --env-file .env.remote -f docker-compose.remote.yml ps
+docker compose --env-file .env.remote -f docker-compose.remote.yml logs -f player
+```
+
+Start the public stack and confirm that its bridge is reachable before starting the remote player. Once the player connects, it should appear in the dashboard's Connected clients view. If it does not, verify the bridge URL, shared secret, firewall or reverse-proxy websocket support, and the player logs.
+
+## Shared Secret
 
 This secret is the shared signing key for requests between the services. Use a single value for every service that needs to talk to the same stack, including the web app, player, bridge, and any remote player that connects back to that bridge.
 
@@ -152,34 +228,6 @@ If you want a quick local value, generate one with a password manager or a comma
 
 Leave it blank only if you intentionally want to run without request signing in a throwaway local setup.
 
-## Main Configuration Variables
-
-| Variable | Used By | Purpose |
-| --- | --- | --- |
-| `PULSE_SIGNAGE_WEB_IMAGE` | web, bridge | Docker image to run for the web app and bridge services. |
-| `PULSE_SIGNAGE_PLAYER_IMAGE` | player, remote player | Docker image to run for the player services. |
-| `PULSE_SIGNAGE_SHARED_SECRET` | web, player, bridge, remote player | Shared secret for authenticated requests between services. |
-| `DB_HOST` | web, player, bridge | Database host name. |
-| `DB_PORT` | web, player, bridge | Database port. |
-| `DB_NAME` | web, player, bridge, mysql | Database name. |
-| `DB_USER` | web, player, bridge, mysql | Database user. |
-| `DB_PASSWORD` | web, player, bridge, mysql | Database password. |
-| `MYSQL_ROOT_PASSWORD` | mysql | Root password for the local MySQL container. |
-| `DEFAULT_ADMIN_USERNAME` | web | Bootstrap admin username. |
-| `DEFAULT_ADMIN_NAME` | web | Bootstrap admin display name. |
-| `DEFAULT_ADMIN_PASSWORD` | web | Bootstrap admin password. |
-| `PASSWORD_HASH_ITERATIONS` | web | Password hashing cost. |
-| `PLAYER_INTERNAL_URL` | web, player | Internal player URL used by the dashboard and player runtime. |
-| `BRIDGE_INTERNAL_URL` | web | Bridge URL used by the web app for player snapshot and command forwarding. |
-| `WEB_INTERNAL_URL` | player-bridge | Internal web URL used by the bridge to call the dashboard app directly. |
-| `PLAYER_PUBLIC_URL` | player, remote player | Public URL advertised by the player. |
-| `BRIDGE_PUBLIC_URL` | player, remote player | URL of the bridge service. |
-| `PLAYER_IDENTIFIER` | player | Stable player identifier. |
-| `PLAYER_AGENT_RECONNECT_DELAY_MS` | remote player | Delay before reconnecting to the bridge. |
-| `MYSQL_DATABASE` | mysql | Database name used by the local MySQL container. |
-| `MYSQL_USER` | mysql | Database user used by the local MySQL container. |
-| `MYSQL_PASSWORD` | mysql | Database password used by the local MySQL container. |
-
 ## Ports
 
 Public stack ports:
@@ -209,20 +257,20 @@ Remote stack ports:
 Each compose file creates its own named network:
 
 - `pulse-signage` for the public stack
-- `pulse-signage-remote` for remote player deployment.
+- `pulse-signage-remote` for the remote player deployment.
 
 ## Notes
 
-- The public stack expects the app services and MySQL to share the same `PULSE_SIGNAGE_SHARED_SECRET`.
+- The public stack expects the web, player, and bridge services to share the same `PULSE_SIGNAGE_SHARED_SECRET`.
 - A remote player must use the same `PULSE_SIGNAGE_SHARED_SECRET` as the bridge it connects to.
 - The bridge service is the dashboard-facing command path for connected remote players.
 - The remote player should point `BRIDGE_PUBLIC_URL` at the bridge, not at the public web endpoint.
-- The `PULSE_SIGNAGE_WEB_IMAGE` and `PULSE_SIGNAGE_PLAYER_IMAGE` tags default to the published `pulse-signage-web` and `pulse-signage-player` repositories with `latest` and `v1.2.3` style tags, but they can be overridden for local builds or custom releases.
+- The `PULSE_SIGNAGE_WEB_IMAGE` and `PULSE_SIGNAGE_PLAYER_IMAGE` tags default to the published `pulse-signage-web` and `pulse-signage-player` repositories with `latest` tags, but they can be overridden for custom releases.
 
-## Recommended Setup
+## Deployment Checklist
 
-1. Copy `.env.example` to a local `.env` file for the public stack.
-2. Copy `.env.remote.example` to a device-specific `.env` file for the remote player.
-3. Make sure `PULSE_SIGNAGE_SHARED_SECRET` matches everywhere.
-4. Start the public stack first, then start the remote player after the bridge is reachable.
+1. Follow [Public Stack Setup](#public-stack-setup) to start the public stack with Docker Compose.
+2. Set the same `PULSE_SIGNAGE_SHARED_SECRET` in the public and remote environments.
+3. Set `BRIDGE_PUBLIC_URL` to the externally reachable bridge URL.
+4. Start the published remote player with the workflow above.
 5. Verify that the player appears in Connected clients before testing screen commands.

docker-compose/docker-compose.remote.yml

@@ -11,8 +11,8 @@ services:
       - "8081:8081"
     environment:
       PLAYER_IDENTIFIER: ${PLAYER_IDENTIFIER:-player-remote}
-      PLAYER_PUBLIC_URL: ${PLAYER_PUBLIC_URL:-http://localhost:8081}
-      BRIDGE_PUBLIC_URL: ${BRIDGE_PUBLIC_URL:-}
+      PLAYER_PUBLIC_URL: ${PLAYER_PUBLIC_URL:-}
+      BRIDGE_PUBLIC_URL: ${BRIDGE_PUBLIC_URL:?BRIDGE_PUBLIC_URL must be set to a routable bridge URL}
       PULSE_SIGNAGE_SHARED_SECRET: ${PULSE_SIGNAGE_SHARED_SECRET:-}
       PLAYER_AGENT_RECONNECT_DELAY_MS: ${PLAYER_AGENT_RECONNECT_DELAY_MS:-5000}
     volumes:

docs/README.md

@@ -7,6 +7,7 @@ This folder contains the technical reference material for Pulse Signage.
 - [API reference](api.md) - the player HTTP surface and onboarding endpoints.
 - [Database schema](schema.md) - the tables and data model used by the app.
 - [WebSocket reference](websocket.md) - the live player and snapshot channels.
+- [Compose guide](../docker-compose/README.md) - Docker Compose deployment and service configuration.
 
 ## How To Read It
 

docs/api.md

@@ -6,7 +6,7 @@ Player service base URL: `http://localhost:8081`
 
 This document covers the player HTTP surface only. The admin dashboard exposes its own routes for screen commands and onboarding management.
 
-Access note: most player endpoints are unauthenticated because they are meant to run inside a trusted deployment network. Anything that mutates state or writes files should be treated as internal-only unless you add your own auth layer in front of it. Pairing uses a short-lived random PIN displayed by the kiosk; the PIN is accepted only through the authenticated Web UI pairing flow.
+Access note: when `PULSE_SIGNAGE_SHARED_SECRET` is set, player-page endpoints require a valid `x-pulse-page-auth` token with the appropriate scope, and server-to-server endpoints require the signed request headers. When the secret is unset, these checks are disabled for compatibility, so the player service should remain inside a trusted deployment network. Pairing uses a short-lived random PIN displayed by the kiosk; the PIN is accepted only through the authenticated Web UI pairing flow.
 
 When `PULSE_SIGNAGE_SHARED_SECRET` is set, the player pages sign same-origin API fetches with `x-pulse-page-auth`, and the web app signs server-to-player requests with `x-pulse-request-timestamp` plus `x-pulse-request-signature`. Page tokens auto-renew before expiry while the page stays active, and signed server requests are only accepted when their timestamp is fresh. If the secret is unset, those checks stay disabled for compatibility.
 
@@ -26,23 +26,50 @@ Access: the configured player may load only its persisted paired screen. An unpa
 
 ### `GET /api/onboarding/status`
 Returns the persisted onboarding status for a device.
-Access: public within the trusted player deployment.
+Access: requires a page-auth token with the `onboarding` or `player` scope when shared-secret authentication is enabled.
 
 Query fields:
 
-- `deviceId` required
+- `deviceId` optional; the player device ID is used when omitted
 
 ### `GET /api/onboarding/screens`
 Returns the list of screens available for onboarding.
-Access: public within the trusted player deployment.
+Access: requires a page-auth token with the `onboarding` scope when shared-secret authentication is enabled.
 
 ### `GET /api/onboarding/qr`
 Returns an SVG QR code that points to the onboarding form.
-Access: public within the trusted player deployment.
+Access: public on the player service; the bridge version requires a signed server request when shared-secret authentication is enabled.
 
 Query fields:
 
-- `deviceId` required
+- `deviceId` optional; the player device ID is used when omitted
+
+### `GET /api/onboarding/resolve`
+Resolves a short-lived kiosk pairing code to its device and client identifiers.
+Access: requires an onboarding page token or signed server request when shared-secret authentication is enabled.
+
+Query fields:
+
+- `pairingCode` required
+
+Response fields:
+
+- `deviceId`
+- `clientId`
+
+### `GET /api/onboarding/session`
+Returns the current pairing session for the player page.
+Access: requires an onboarding page-auth token when shared-secret authentication is enabled.
+
+Query fields:
+
+- `deviceId` optional
+- `clientId` optional
+
+Response fields:
+
+- `deviceId`
+- `pairingCode`
 
 ### `POST /api/auth/page`
 Renews the current page-auth token before it expires.
@@ -54,15 +81,28 @@ Response fields:
 - `issuedAt`
 - `expiresAt`
 
+### `POST /api/screen-move-authorize`
+Stores a short-lived screen-move authorization token in an HTTP-only cookie.
+Access: requires a valid screen-move page-auth token in the request body.
+
+Accepted request fields:
+
+- `moveToken` required
+
+Response fields:
+
+- `ok`
+
 ### `POST /api/onboarding`
 Binds a device to a screen and client name.
-Access: internal-only. Browser submissions must go through the authenticated Web UI pairing page. The Web UI resolves the short-lived kiosk PIN to a device ID before forwarding the signed request. Protect this endpoint if the player service is reachable outside your trusted network.
+Access: internal-only. Requires an onboarding page-auth token or signed request when shared-secret authentication is enabled, plus a valid short-lived kiosk pairing code. Browser submissions must go through the authenticated Web UI pairing page.
 
 Accepted request fields:
 
-- `deviceId` required
 - `clientName` required
 - `screenSlug` required
+- `pairingCode` required
+- `clientId` required
 
 Response fields:
 
@@ -76,7 +116,7 @@ Response fields:
 
 ### `GET /api/media/config`
 Returns the upload directory configured for the player service.
-Access: internal-only.
+Access: internal-only and requires signed request headers when shared-secret authentication is enabled.
 
 Response fields:
 
@@ -85,15 +125,15 @@ Response fields:
 
 ### `PUT /api/media/{filename}`
 Writes an uploaded file into the player upload directory.
-Access: internal-only and write-protected behind your deployment boundary.
+Access: internal-only and requires signed request headers when shared-secret authentication is enabled.
 
 ### `DELETE /api/media/{filename}`
 Deletes a file from the player upload directory.
-Access: internal-only and write-protected behind your deployment boundary.
+Access: internal-only and requires signed request headers when shared-secret authentication is enabled.
 
 ### `GET /api/rtmp/session`
 Creates or reuses an RTMP-to-HLS session for a source URL.
-Access: internal-only.
+Access: requires a page-auth token with the `player` scope when shared-secret authentication is enabled.
 
 Query fields:
 
@@ -118,7 +158,7 @@ Access: internal-only.
 
 ### `GET /api/screens/{slug}/playlist`
 Returns the current playlist payload for a screen.
-Access: public within the trusted player deployment.
+Access: requires a page-auth token with the `player` scope when shared-secret authentication is enabled. The player also checks that the browser is authorized for the requested screen.
 
 Response fields:
 
@@ -130,10 +170,19 @@ Response fields:
 - `timetableGroups`
 - `revision`
 
+### `GET /api/screens/{slug}/announcement`
+Returns the active announcement for a screen.
+Access: requires a page-auth token with the `player` scope when shared-secret authentication is enabled. The player also checks that the browser is authorized for the requested screen.
+
+Response fields:
+
+- `announcement`
+- `revision`
+
 ### `GET /api/screens/{slug}/connections`
 ### `GET /api/screens/{slug}/clients`
 Returns the live player connection snapshot for a screen.
-Access: public within the trusted player deployment, but it exposes live connection state.
+Access: internal-only and requires signed request headers when shared-secret authentication is enabled; it exposes live connection state.
 
 Response fields:
 
@@ -143,9 +192,19 @@ Response fields:
 - `connections`
 - `degraded`
 
+### `POST /api/screens/{slug}/announcements/refresh`
+Notifies connected players that the active announcement should be refreshed.
+Access: internal-only and requires signed request headers when shared-secret authentication is enabled.
+
+Response fields:
+
+- `ok`
+- `screenSlug`
+- `sent`
+
 ### `POST /api/screens/{slug}/commands`
 Sends a command to the player connections for a screen.
-Access: internal-only. The admin dashboard should remain the protected control surface for commands.
+Access: internal-only and requires signed request headers when shared-secret authentication is enabled. The admin dashboard should remain the protected control surface for commands.
 
 Accepted request fields:
 

docs/schema.md

@@ -13,12 +13,34 @@ Tables generally use a numeric auto-increment `id` primary key. The relationship
 - `a_role_permissions` - many-to-many mapping between roles and permissions.
 - `a_user_roles` - many-to-many mapping between users and roles.
 - `a_sessions` - persisted admin session tokens.
+- `a_account_tokens` - short-lived account verification and password-reset tokens.
+- `a_user_invitations` - pending user invitations and assigned role ids.
+- `a_login_attempts` - login rate-limit and lockout state.
 
 ### `a_users`
 
-- `id`, `name`, `username`, `password_hash`, `password_salt`, `password_iterations`, `must_change_password`, `account_locked`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `id`, `name`, `username`, `email`, `email_verified_at`, `pending_email`, `pending_email_token_hash`, `pending_email_expires_at`, `password_hash`, `password_salt`, `password_iterations`, `must_change_password`, `account_locked`, `last_login_at`, `last_login_ip`, `created_at`, `created_by`, `modified_at`, `modified_by`
 - `username` is unique.
 
+### `a_account_tokens`
+
+- `id`, `user_id`, `token_type`, `token_hash`, `expires_at`, `used_at`, `created_at`
+- `token_hash` is unique.
+- Foreign key:
+        - `user_id` -> `a_users.id` with `ON DELETE CASCADE`
+- Indexed by `(token_type, token_hash, expires_at)` and `(user_id, token_type)`.
+
+### `a_user_invitations`
+
+- `id`, `email`, `name`, `role_ids_json`, `token_hash`, `expires_at`, `used_at`, `created_at`, `created_by`
+- `token_hash` is unique.
+- Indexed by `(email, used_at, expires_at)` and `(created_by, created_at)`.
+
+### `a_login_attempts`
+
+- `id`, `rate_key`, `failed_count`, `last_failed_at`, `locked_until`, `created_at`, `modified_at`
+- `rate_key` is unique.
+
 ### `a_roles`
 
 - `id`, `role_key`, `name`, `description`, `created_at`, `created_by`, `modified_at`, `modified_by`
@@ -76,7 +98,8 @@ Tables generally use a numeric auto-increment `id` primary key. The relationship
 
 ### `c_templates`
 
-- `id`, `name`, `canvas_size_id`, `background_image_path`, `background_color`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `id`, `name`, `canvas_size_id`, `background_image_path`, `background_color`, `background_gradient`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `background_gradient` stores normalized linear gradient settings as JSON text, including angle and colour stops.
 - Foreign key:
         - `canvas_size_id` -> `c_canvas_sizes.id` with `ON DELETE SET NULL`
 
@@ -133,7 +156,7 @@ Tables generally use a numeric auto-increment `id` primary key. The relationship
 
 ### `d_onboarding_devices`
 
-- `id`, `device_id`, `client_name`, `screen_id`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `id`, `device_id`, `client_name`, `screen_id`, `created_at`, `created_by`, `modified_at`, `modified_by`, `last_seen_at`
 - `device_id` is unique.
 - Foreign key:
         - `screen_id` -> `d_screens.id` with `ON DELETE SET NULL`
@@ -165,12 +188,13 @@ Tables generally use a numeric auto-increment `id` primary key. The relationship
 - `i_rss_feeds` - RSS feed definitions and refresh cadence.
 - `i_rss_feed_items` - cached RSS feed items.
 - `i_api_sources` - API source definitions and last response snapshot.
+- `i_weather_locations` - configured weather locations and last response snapshot.
 - `i_timetable_groups` - grouped timetable definitions used by the timetable region.
 - `i_timetable_entries` - dated entries that belong to a timetable group.
 
 ### `i_rss_feeds`
 
-- `id`, `name`, `feed_url`, `update_interval_value`, `update_interval_unit`, `item_limit`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `id`, `name`, `feed_url`, `update_interval_value`, `update_interval_unit`, `item_limit`, `enabled`, `last_pulled_at`, `created_at`, `created_by`, `modified_at`, `modified_by`
 
 ### `i_rss_feed_items`
 
@@ -182,7 +206,12 @@ Tables generally use a numeric auto-increment `id` primary key. The relationship
 
 ### `i_api_sources`
 
-- `id`, `name`, `api_url`, `auth_method`, `auth_username`, `auth_password`, `auth_bearer_token`, `auth_header_name`, `auth_header_value`, `items_path`, `update_interval_value`, `update_interval_unit`, `last_pulled_at`, `last_pull_error`, `last_response_status`, `last_response_content_type`, `last_response_json`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `id`, `name`, `api_url`, `auth_method`, `auth_username`, `auth_password`, `auth_bearer_token`, `auth_header_name`, `auth_header_value`, `token_url`, `token_request_body_json`, `token_response_path`, `token_refresh_url`, `token_refresh_request_body_json`, `token_refresh_response_path`, `token_header_name`, `token_header_prefix`, `items_path`, `update_interval_value`, `update_interval_unit`, `enabled`, `last_pulled_at`, `last_pull_error`, `last_response_status`, `last_response_content_type`, `last_response_json`, `created_at`, `created_by`, `modified_at`, `modified_by`
+
+### `i_weather_locations`
+
+- `id`, `name`, `location_label`, `latitude`, `longitude`, `timezone`, `provider`, `temperature_unit`, `wind_unit`, `precipitation_unit`, `update_interval_value`, `update_interval_unit`, `enabled`, `last_pulled_at`, `last_pull_error`, `last_response_json`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Stores configured weather locations and the most recent provider response used for forecast previews and weather regions.
 
 ### `i_timetable_groups`
 
@@ -231,6 +260,7 @@ Tables generally use a numeric auto-increment `id` primary key. The relationship
 - The schema is initialized with `CREATE TABLE IF NOT EXISTS`, so new installs can start from an empty database.
 - `src/db/bootstrap.js` seeds the canvas size defaults, default permissions, and the default administrator role.
 - `src/db/migrations.js` records the current schema version in `o_app_state` during startup so later launches can tell whether an update is happening.
+- The ER diagram shows declared foreign keys and the logical audit actor association; player registry and JSON-based references are intentionally not shown as foreign-key relationships.
 
 ```mermaid
 erDiagram
@@ -246,6 +276,12 @@ erDiagram
         }
         A_SESSIONS {
         }
+        A_ACCOUNT_TOKENS {
+        }
+        A_USER_INVITATIONS {
+        }
+        A_LOGIN_ATTEMPTS {
+        }
         C_CANVAS_SIZES {
         }
         C_PLAYLISTS {
@@ -276,6 +312,8 @@ erDiagram
         }
         I_API_SOURCES {
         }
+        I_WEATHER_LOCATIONS {
+        }
         I_TIMETABLE_GROUPS {
         }
         I_TIMETABLE_ENTRIES {
@@ -294,18 +332,19 @@ erDiagram
         A_ROLES ||--o{ A_ROLE_PERMISSIONS : has
         A_PERMISSIONS ||--o{ A_ROLE_PERMISSIONS : granted_to
         A_USERS ||--o{ A_SESSIONS : owns
-        A_USERS ||--o{ O_AUDIT_EVENTS : acts
+        A_USERS ||--o{ A_ACCOUNT_TOKENS : has
+        A_USERS o|--o{ O_AUDIT_EVENTS : acts
 
-        C_CANVAS_SIZES ||--o{ C_TEMPLATES : used_by
-        C_CANVAS_SIZES ||--o{ C_PLAYLISTS : used_by
+        C_CANVAS_SIZES o|--o{ C_TEMPLATES : used_by
+        C_CANVAS_SIZES o|--o{ C_PLAYLISTS : used_by
         C_TEMPLATES ||--o{ C_TEMPLATE_REGIONS : contains
-        C_TEMPLATES ||--o{ C_SLIDES : used_by
+        C_TEMPLATES o|--o{ C_SLIDES : used_by
         C_PLAYLISTS ||--o{ C_PLAYLIST_SLIDES : contains
         C_SLIDES ||--o{ C_PLAYLIST_SLIDES : included_in
         C_PLAYLIST_SLIDES ||--o{ C_PLAYLIST_SLIDE_SCHEDULE_RULES : has_rules
 
-        C_PLAYLISTS ||--o{ D_SCREENS : uses
-        D_SCREENS ||--o{ D_ONBOARDING_DEVICES : binds
+        C_PLAYLISTS o|--o{ D_SCREENS : uses
+        D_SCREENS o|--o{ D_ONBOARDING_DEVICES : binds
         D_ANNOUNCEMENTS ||--o{ D_ANNOUNCEMENT_SCREENS : targets
         D_SCREENS ||--o{ D_ANNOUNCEMENT_SCREENS : receives
 

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "pulse-signage",
-  "version": "2.10.2",
+  "version": "2.11.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "pulse-signage",
-      "version": "2.10.2",
+      "version": "2.11.2",
       "dependencies": {
         "@sparticuz/chromium": "^149.0.0",
         "animate.css": "^4.1.1",
@@ -19,6 +19,7 @@
         "jsqr": "^1.4.0",
         "multer": "^2.2.0",
         "mysql2": "^3.23.3",
+        "nodemailer": "^9.1.1",
         "puppeteer-core": "^25.7.0",
         "sharp": "^0.35.3",
         "ws": "^8.21.3"
@@ -1989,6 +1990,15 @@
       "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
       "license": "MIT"
     },
+    "node_modules/nodemailer": {
+      "version": "9.1.1",
+      "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-9.1.1.tgz",
+      "integrity": "sha512-izw9mVKFix6YSnC9eLgV6g1opl9DUlRio9ZNcq+Wu9Ujn2UwF+8Nl0B8nz22kEC+CTZCvinkxwJ0DeFbb6NwcQ==",
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
     "node_modules/nodemon": {
       "version": "3.1.14",
       "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-3.1.14.tgz",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pulse-signage",
-  "version": "2.10.2",
+  "version": "2.11.2",
   "private": false,
   "description": "Pulse Signage application with MySQL and media storage",
   "engines": {
@@ -31,6 +31,7 @@
     "jsqr": "^1.4.0",
     "multer": "^2.2.0",
     "mysql2": "^3.23.3",
+    "nodemailer": "^9.1.1",
     "puppeteer-core": "^25.7.0",
     "sharp": "^0.35.3",
     "ws": "^8.21.3"

src/auth.js

@@ -7,6 +7,10 @@ const PASSWORD_KEY_LENGTH = 32;
 const PASSWORD_DIGEST = 'sha256';
 const SESSION_BYTES = 32;
 
+function createOneTimeToken() {
+  return crypto.randomBytes(32).toString('hex');
+}
+
 function validatePasswordStrength(password, options) {
   const value = String(password || '');
   const requirements = options && options.policy
@@ -91,5 +95,6 @@ module.exports = {
   verifyPassword,
   validatePasswordStrength,
   createSessionToken,
-  hashSessionToken
+  hashSessionToken,
+  createOneTimeToken
 };

src/common.js

@@ -28,10 +28,13 @@ const data = require('#src/data');
 const player = require('#src/player/render');
 const listQuery = require('#src/web/lib/list-query');
 const { fetchPlaylistCanvasId } = require('#src/web/lib/helpers');
+const { findAvailableClientName } = require('#src/data/client-name-check');
 
 module.exports = {
   createPool: dbCommon.createPool,
   pruneStaleOnboardingDevices: dbCommon.pruneStaleOnboardingDevices,
+  touchOnboardingDeviceLastSeen: dbCommon.touchOnboardingDeviceLastSeen,
+  findAvailableClientName: findAvailableClientName,
   ensureSchema: db.ensureSchema,
   bootstrapDatabase: dbBootstrap.bootstrapDatabase,
   slugify: data.slugify,

src/data/account-email-templates.js

@@ -0,0 +1,54 @@
+const DEFAULT_ACCOUNT_EMAIL_TEMPLATES = {
+  verificationSubject: 'Verify your Pulse Signage email address',
+  verificationBody: 'Hello [b][[display_name]][/b]!\n[[action_button]]\nThis [u]link[/u] expires in [i][[expiry_time]][/i].\nConfirm this email address: [[url]]',
+  resetSubject: 'Reset your Pulse Signage password',
+  resetBody: 'Hello [b][[display_name]][/b]!\n[[action_button]]\nThis [u]link[/u] expires in [i][[expiry_time]][/i].\nChoose a new password: [[url]]'
+};
+
+function formatAccountEmailExpiry(value, unit) {
+  const amount = Number(value);
+  const normalizedAmount = Number.isFinite(amount) && amount > 0 ? Math.round(amount) : 30;
+  const normalizedUnit = unit === 'hours' ? 'hour' : 'minute';
+  return normalizedAmount + ' ' + normalizedUnit + (normalizedAmount === 1 ? '' : 's');
+}
+
+function renderAccountEmailTemplate(subject, body, variables) {
+  const values = variables || {};
+  const replaceVariables = function (value) {
+    return String(value || '').replace(/\[\[([a-z_]+)\]\]/g, function (_match, key) {
+      return Object.prototype.hasOwnProperty.call(values, key) ? String(values[key]) : _match;
+    });
+  };
+  const renderedSubject = replaceVariables(subject);
+  const renderedText = replaceVariables(body);
+  const plainText = renderedText.replace(/\[(?:b|i|u)\]([\s\S]*?)\[\/(?:b|i|u)\]/gi, '$1');
+  const escapedBody = renderedText.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/\[b\]([\s\S]*?)\[\/b\]/gi, '<strong>$1</strong>').replace(/\[i\]([\s\S]*?)\[\/i\]/gi, '<em>$1</em>').replace(/\[u\]([\s\S]*?)\[\/u\]/gi, '<u>$1</u>');
+  const actionLabel = String(values.action_label || 'Continue').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+  const actionUrl = values.url ? String(values.url).replace(/&/g, '&amp;').replace(/"/g, '&quot;') : '';
+  const actionAlignment = values.action_alignment === 'left' || values.action_alignment === 'right' ? values.action_alignment : 'center';
+  const actionButton = actionUrl ? '<a href="' + actionUrl + '" style="display:inline-block;background:#111827;color:#ffffff;padding:12px 22px;text-decoration:none;border-radius:4px;font-weight:600;">' + actionLabel + '</a>' : '';
+  const actionBlock = actionButton ? '<div style="margin:24px 0;text-align:' + actionAlignment + ';">' + actionButton + '</div>' : '';
+  const plainLink = actionUrl ? '<a href="' + actionUrl + '">' + actionUrl + '</a>' : '';
+  const escapedBodyUrl = values.url ? String(values.url).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;') : '';
+  const hasButtonPlaceholder = escapedBody.indexOf('[[action_button]]') !== -1;
+  const hasUrlPlaceholder = String(body || '').indexOf('[[url]]') !== -1;
+  const bodyWithAction = hasButtonPlaceholder
+    ? escapedBody.split(escapedBodyUrl).join(plainLink).replace(/\[\[action_button\]\]/g, actionBlock).replace(/\[\[action_link\]\]/g, plainLink)
+    : hasUrlPlaceholder
+      ? escapedBody.split(actionUrl).join(actionBlock + plainLink)
+      : escapedBody.replace(/\[\[action_link\]\]/g, plainLink).replace(actionUrl, plainLink);
+  const bodyHtml = bodyWithAction.split(/\r?\n(?:[ \t]*\r?\n)+/).map(function (paragraph) {
+    const paragraphHtml = paragraph.replace(/\r?\n/g, '<br>');
+    if (paragraphHtml.indexOf(actionBlock) !== -1 && actionBlock) {
+      return paragraphHtml.split(actionBlock).map(function (part, index, parts) {
+        const text = part ? '<p style="margin:0 0 16px;">' + part + '</p>' : '';
+        return text + (index < parts.length - 1 ? actionBlock : '');
+      }).join('');
+    }
+    return paragraphHtml ? '<p style="margin:0 0 16px;">' + paragraphHtml + '</p>' : '';
+  }).join('');
+  const html = '<!doctype html><html><body style="margin:0;background:#f4f4f5;font-family:Arial,sans-serif;color:#27364b;"><div style="padding:24px 12px;"><div style="max-width:560px;margin:0 auto;text-align:center;color:#111827;font-size:20px;font-weight:700;padding:0 0 16px;">Pulse Signage</div><div style="max-width:560px;margin:0 auto;background:#ffffff;padding:32px;border-radius:4px;text-align:left;">' + bodyHtml + '</div></div></body></html>';
+  return { subject: renderedSubject, text: plainText, html: html };
+}
+
+module.exports = { DEFAULT_ACCOUNT_EMAIL_TEMPLATES, formatAccountEmailExpiry, renderAccountEmailTemplate };

src/data/announcement-icons.js

@@ -1,3 +1,5 @@
+// Load and expose the announcement icon catalog used by the editor and player.
+
 const fs = require('fs');
 const path = require('path');
 

src/data/api-sources.js

@@ -13,6 +13,7 @@ const TOKEN_URL_MAX_LENGTH = 1024;
 const TOKEN_RESPONSE_PATH_MAX_LENGTH = 255;
 const TOKEN_HEADER_PREFIX_MAX_LENGTH = 64;
 const tokenCache = new Map();
+const tokenRequests = new Map();
 
 function normalizeUpdateIntervalUnit(value) {
   const unit = String(value || '').trim().toLowerCase();
@@ -59,7 +60,7 @@ function buildAuthHeaders(source) {
 
 async function fetchApiSourcesData(pool) {
   const [apiSources] = await pool.query(
-    'SELECT id, name, api_url, request_method, request_body_json, auth_method, auth_username, auth_password, auth_bearer_token, auth_header_name, auth_header_value, token_url, token_request_body_json, token_response_path, token_header_name, token_header_prefix, items_path, enabled, update_interval_value, update_interval_unit, last_pulled_at, last_pull_error, last_response_status, last_response_content_type, last_response_json, created_at, modified_at, created_by, modified_by FROM i_api_sources ORDER BY modified_at DESC, id DESC'
+    'SELECT id, name, api_url, request_method, request_body_json, auth_method, auth_username, auth_password, auth_bearer_token, auth_header_name, auth_header_value, token_url, token_request_body_json, token_response_path, token_refresh_url, token_refresh_request_body_json, token_refresh_response_path, token_header_name, token_header_prefix, items_path, enabled, update_interval_value, update_interval_unit, last_pulled_at, last_pull_error, last_response_status, last_response_content_type, last_response_json, created_at, modified_at, created_by, modified_by FROM i_api_sources ORDER BY modified_at DESC, id DESC'
   );
 
   return { apiSources: apiSources };
@@ -67,7 +68,7 @@ async function fetchApiSourcesData(pool) {
 
 async function fetchApiSourcesPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
   const paged = await fetchPagedRows(pool, {
-    selectSql: 'SELECT id, name, api_url, request_method, request_body_json, auth_method, auth_username, auth_password, auth_bearer_token, auth_header_name, auth_header_value, token_url, token_request_body_json, token_response_path, token_header_name, token_header_prefix, items_path, enabled, update_interval_value, update_interval_unit, last_pulled_at, last_pull_error, last_response_status, last_response_content_type, last_response_json, created_at, modified_at, created_by, modified_by FROM i_api_sources ORDER BY modified_at DESC, id DESC',
+    selectSql: 'SELECT id, name, api_url, request_method, request_body_json, auth_method, auth_username, auth_password, auth_bearer_token, auth_header_name, auth_header_value, token_url, token_request_body_json, token_response_path, token_refresh_url, token_refresh_request_body_json, token_refresh_response_path, token_header_name, token_header_prefix, items_path, enabled, update_interval_value, update_interval_unit, last_pulled_at, last_pull_error, last_response_status, last_response_content_type, last_response_json, created_at, modified_at, created_by, modified_by FROM i_api_sources ORDER BY modified_at DESC, id DESC',
     countSql: 'SELECT COUNT(*) AS count FROM i_api_sources',
     searchColumns: ['name', 'api_url', 'last_pull_error'],
     searchTerm: searchTerm,
@@ -91,7 +92,7 @@ async function fetchApiSourcesPage(pool, page, pageSize, searchTerm, sortKey, so
 
 async function fetchApiSourceById(pool, id) {
   const [rows] = await pool.query(
-    'SELECT id, name, api_url, request_method, request_body_json, auth_method, auth_username, auth_password, auth_bearer_token, auth_header_name, auth_header_value, token_url, token_request_body_json, token_response_path, token_header_name, token_header_prefix, items_path, enabled, update_interval_value, update_interval_unit, last_pulled_at, last_pull_error, last_response_status, last_response_content_type, last_response_json, created_at, modified_at, created_by, modified_by FROM i_api_sources WHERE id = ?',
+    'SELECT id, name, api_url, request_method, request_body_json, auth_method, auth_username, auth_password, auth_bearer_token, auth_header_name, auth_header_value, token_url, token_request_body_json, token_response_path, token_refresh_url, token_refresh_request_body_json, token_refresh_response_path, token_header_name, token_header_prefix, items_path, enabled, update_interval_value, update_interval_unit, last_pulled_at, last_pull_error, last_response_status, last_response_content_type, last_response_json, created_at, modified_at, created_by, modified_by FROM i_api_sources WHERE id = ?',
     [id]
   );
 
@@ -184,6 +185,9 @@ function getTokenCacheKey(source) {
     source && (source.token_url || source.tokenUrl) || '',
     source && (source.token_request_body_json || source.tokenRequestBodyJson) || '',
     source && (source.token_response_path || source.tokenResponsePath) || 'access_token',
+    source && (source.token_refresh_url || source.tokenRefreshUrl) || '',
+    source && (source.token_refresh_request_body_json || source.tokenRefreshRequestBodyJson) || '',
+    source && (source.token_refresh_response_path || source.tokenRefreshResponsePath) || 'refresh_token',
     source && (source.token_header_name || source.tokenHeaderName) || 'Authorization',
     source && (source.token_header_prefix || source.tokenHeaderPrefix) || 'Bearer'
   ]);
@@ -193,11 +197,118 @@ function clearCachedToken(source) {
   tokenCache.delete(getTokenCacheKey(source));
 }
 
-async function fetchLoginToken(source) {
+function replaceRefreshToken(value, refreshToken) {
+  if (typeof value === 'string') {
+    return value.split('{{refresh_token}}').join(refreshToken);
+  }
+  if (Array.isArray(value)) {
+    return value.map(function (item) {
+      return replaceRefreshToken(item, refreshToken);
+    });
+  }
+  if (value && typeof value === 'object') {
+    return Object.keys(value).reduce(function (result, key) {
+      result[key] = replaceRefreshToken(value[key], refreshToken);
+      return result;
+    }, {});
+  }
+  return value;
+}
+
+function resolveTokenExpiry(parsed, token) {
+  const expiresIn = Number(parsed && (parsed.expires_in || parsed.expiresIn));
+  if (Number.isFinite(expiresIn) && expiresIn > 0) {
+    return { lifetimeMs: expiresIn * 1000 };
+  }
+
+  const explicitExpiry = parsed && (parsed.expires_at || parsed.expiresAt);
+  if (explicitExpiry !== undefined && explicitExpiry !== null) {
+    const expiryNumber = Number(explicitExpiry);
+    const expiryMs = Number.isFinite(expiryNumber)
+      ? (expiryNumber < 100000000000 ? expiryNumber * 1000 : expiryNumber)
+      : Date.parse(String(explicitExpiry));
+    if (Number.isFinite(expiryMs) && expiryMs > Date.now()) {
+      return { expiresAt: expiryMs };
+    }
+  }
+
+  const tokenParts = String(token).split('.');
+  if (tokenParts.length === 3) {
+    try {
+      const payload = JSON.parse(Buffer.from(tokenParts[1], 'base64url').toString('utf8'));
+      const expiryMs = Number(payload.exp) * 1000;
+      if (Number.isFinite(expiryMs) && expiryMs > Date.now()) {
+        return { expiresAt: expiryMs };
+      }
+    } catch (_error) {
+      // Opaque tokens do not contain a readable JWT expiry.
+    }
+  }
+
+  return { lifetimeMs: 300000 };
+}
+
+function cacheTokenResponse(source, parsed, previousRefreshToken) {
+  const tokenPath = source.token_response_path || source.tokenResponsePath || 'access_token';
+  const token = resolveResponsePath(parsed, tokenPath);
+  if (token === undefined || token === null || String(token).trim() === '') {
+    throw new Error('Token response did not contain a token at the configured path.');
+  }
+
+  const refreshPath = source.token_refresh_response_path || source.tokenRefreshResponsePath || 'refresh_token';
+  const responseRefreshToken = resolveResponsePath(parsed, refreshPath);
+  const refreshToken = responseRefreshToken === undefined || responseRefreshToken === null || String(responseRefreshToken).trim() === ''
+    ? previousRefreshToken
+    : String(responseRefreshToken);
+  const expiry = resolveTokenExpiry(parsed, token);
+  const expiresAt = expiry.expiresAt || Date.now() + Math.max(1000, expiry.lifetimeMs - Math.min(60000, expiry.lifetimeMs * 0.1));
+  const record = { value: String(token), refreshToken: refreshToken, expiresAt: expiresAt };
+  tokenCache.set(getTokenCacheKey(source), record);
+  return record;
+}
+
+async function parseTokenResponse(response, source, previousRefreshToken) {
+  if (!response.ok) {
+    return null;
+  }
+  let parsed;
+  try {
+    parsed = JSON.parse(String(response.bodyText || '').trim());
+  } catch (_error) {
+    throw new Error('Token response was not valid JSON.');
+  }
+  return cacheTokenResponse(source, parsed, previousRefreshToken);
+}
+
+async function refreshLoginToken(source, cached) {
+  const refreshUrl = source.token_refresh_url || source.tokenRefreshUrl || source.token_url || source.tokenUrl;
+  if (!cached || !cached.refreshToken) {
+    return null;
+  }
+  const configuredBody = parseJsonRequestBody(source.token_refresh_request_body_json || source.tokenRefreshRequestBodyJson, 'Refresh request body');
+  const refreshBody = configuredBody === undefined
+    ? { grant_type: 'refresh_token', refresh_token: cached.refreshToken }
+    : replaceRefreshToken(configuredBody, cached.refreshToken);
+  const response = await loadUrlText(refreshUrl, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(refreshBody)
+  });
+  return parseTokenResponse(response, source, cached.refreshToken);
+}
+
+async function fetchLoginTokenUncached(source) {
   const cacheKey = getTokenCacheKey(source);
   const cached = tokenCache.get(cacheKey);
   if (cached && cached.expiresAt > Date.now()) {
-    return cached.value;
+    return cached;
+  }
+
+  if (cached && cached.refreshToken) {
+    const refreshed = await refreshLoginToken(source, cached);
+    if (refreshed) {
+      return refreshed;
+    }
   }
 
   const tokenUrl = source.token_url || source.tokenUrl;
@@ -208,29 +319,25 @@ async function fetchLoginToken(source) {
     headers: tokenHeaders,
     body: tokenBody === undefined ? undefined : JSON.stringify(tokenBody)
   });
-  if (!response.ok) {
+  const record = await parseTokenResponse(response, source, cached && cached.refreshToken);
+  if (!record) {
     throw new Error(`Unable to obtain API token (${response.statusCode}).`);
   }
+  return record;
+}
 
-  let parsed;
-  try {
-    parsed = JSON.parse(String(response.bodyText || '').trim());
-  } catch (_error) {
-    throw new Error('Token response was not valid JSON.');
+async function fetchLoginToken(source) {
+  const cacheKey = getTokenCacheKey(source);
+  const cached = tokenCache.get(cacheKey);
+  if (cached && cached.expiresAt > Date.now()) {
+    return cached.value;
   }
-
-  const tokenPath = source.token_response_path || source.tokenResponsePath || 'access_token';
-  const token = resolveResponsePath(parsed, tokenPath);
-  if (token === undefined || token === null || String(token).trim() === '') {
-    throw new Error('Token response did not contain a token at the configured path.');
+  if (!tokenRequests.has(cacheKey)) {
+    tokenRequests.set(cacheKey, fetchLoginTokenUncached(source).finally(function () {
+      tokenRequests.delete(cacheKey);
+    }));
   }
-
-  const expiresIn = Number(parsed && (parsed.expires_in || parsed.expiresIn));
-  const lifetimeMs = Number.isFinite(expiresIn) && expiresIn > 0
-    ? Math.max(30000, expiresIn * 1000 - 60000)
-    : 300000;
-  tokenCache.set(cacheKey, { value: String(token), expiresAt: Date.now() + lifetimeMs });
-  return String(token);
+  return (await tokenRequests.get(cacheKey)).value;
 }
 
 async function buildRequestHeaders(source) {
@@ -310,6 +417,9 @@ function buildApiSourcePayload(req, existingApiSource) {
   const tokenUrl = validateMaxLength(readBodyValue('token_url', readBodyValue('tokenUrl', fallback.token_url || '')) || '', TOKEN_URL_MAX_LENGTH, 'API token URL');
   const tokenRequestBodyJson = validateMaxLength(readBodyValue('token_request_body_json', readBodyValue('tokenRequestBodyJson', fallback.token_request_body_json || '')) || '', REQUEST_BODY_MAX_LENGTH, 'Login request body');
   const tokenResponsePath = validateMaxLength(readBodyValue('token_response_path', readBodyValue('tokenResponsePath', fallback.token_response_path || 'access_token')) || 'access_token', TOKEN_RESPONSE_PATH_MAX_LENGTH, 'Token response path');
+  const tokenRefreshUrl = validateMaxLength(readBodyValue('token_refresh_url', readBodyValue('tokenRefreshUrl', fallback.token_refresh_url || '')) || '', TOKEN_URL_MAX_LENGTH, 'API refresh URL');
+  const tokenRefreshRequestBodyJson = validateMaxLength(readBodyValue('token_refresh_request_body_json', readBodyValue('tokenRefreshRequestBodyJson', fallback.token_refresh_request_body_json || '')) || '', REQUEST_BODY_MAX_LENGTH, 'Refresh request body');
+  const tokenRefreshResponsePath = validateMaxLength(readBodyValue('token_refresh_response_path', readBodyValue('tokenRefreshResponsePath', fallback.token_refresh_response_path || 'refresh_token')) || 'refresh_token', TOKEN_RESPONSE_PATH_MAX_LENGTH, 'Refresh token response path');
   const tokenHeaderName = validateMaxLength(readBodyValue('token_header_name', readBodyValue('tokenHeaderName', fallback.token_header_name || 'Authorization')) || 'Authorization', AUTH_MAX_LENGTH, 'Token header name');
   const tokenHeaderPrefix = validateMaxLength(readBodyValue('token_header_prefix', readBodyValue('tokenHeaderPrefix', fallback.token_header_prefix || 'Bearer')) || '', TOKEN_HEADER_PREFIX_MAX_LENGTH, 'Token prefix');
   const itemsPath = validateMaxLength(readBodyValue('items_path', readBodyValue('itemsPath', fallback.items_path || '')) || '', ITEMS_PATH_MAX_LENGTH, 'API source items path');
@@ -369,6 +479,7 @@ function buildApiSourcePayload(req, existingApiSource) {
 
   parseJsonRequestBody(requestBodyJson, 'API request body');
   parseJsonRequestBody(tokenRequestBodyJson, 'Login request body');
+  parseJsonRequestBody(tokenRefreshRequestBodyJson, 'Refresh request body');
 
   if (authMethod === 'token_login') {
     if (!tokenUrl) {
@@ -393,6 +504,19 @@ function buildApiSourcePayload(req, existingApiSource) {
     }
   }
 
+  if (tokenRefreshUrl) {
+    try {
+      const refreshParsedUrl = new URL(tokenRefreshUrl);
+      if (refreshParsedUrl.protocol !== 'http:' && refreshParsedUrl.protocol !== 'https:') {
+        throw new Error('invalid protocol');
+      }
+    } catch (_error) {
+      const error = new Error('Enter a valid API refresh URL.');
+      error.statusCode = 400;
+      throw error;
+    }
+  }
+
   return {
     name: name,
     apiUrl: parsedUrl.toString(),
@@ -407,6 +531,9 @@ function buildApiSourcePayload(req, existingApiSource) {
     tokenUrl: tokenUrl,
     tokenRequestBodyJson: tokenRequestBodyJson,
     tokenResponsePath: tokenResponsePath,
+    tokenRefreshUrl: tokenRefreshUrl,
+    tokenRefreshRequestBodyJson: tokenRefreshRequestBodyJson,
+    tokenRefreshResponsePath: tokenRefreshResponsePath,
     tokenHeaderName: tokenHeaderName,
     tokenHeaderPrefix: tokenHeaderPrefix,
     itemsPath: itemsPath,

src/data/app-settings.js

@@ -1,3 +1,5 @@
+// Application-wide settings defaults and persistence helpers.
+
 const { DEFAULT_ANNOUNCEMENT_ICON_KEYS } = require('./announcement-icons');
 
 const SETTING_DEFINITIONS = [
@@ -19,8 +21,33 @@ const SETTING_DEFINITIONS = [
   { key: 'security.login_max_attempts', type: 'integer', min: 1, defaultValue: 5 },
   { key: 'security.login_lockout_minutes', type: 'integer', min: 1, defaultValue: 15 },
   { key: 'security.login_rate_limit_scope', type: 'enum', values: ['both', 'username', 'ip'], defaultValue: 'both' },
+  { key: 'security.allow_admin_email_verification_bypass', type: 'boolean', defaultValue: true },
+  { key: 'email.smtp_enabled', type: 'boolean', defaultValue: false },
+  { key: 'email.smtp_host', type: 'string', defaultValue: '' },
+  { key: 'email.smtp_port', type: 'integer', min: 1, defaultValue: 587 },
+  { key: 'email.smtp_security', type: 'enum', values: ['none', 'starttls', 'tls'], defaultValue: 'starttls' },
+  { key: 'email.smtp_username', type: 'string', defaultValue: '' },
+  { key: 'email.smtp_password', type: 'string', defaultValue: '' },
+  { key: 'email.from_address', type: 'string', defaultValue: '' },
+  { key: 'email.from_name', type: 'string', defaultValue: 'Pulse Signage' },
+  { key: 'email.verification_expiry_minutes', type: 'integer', min: 1, defaultValue: 30 },
+  { key: 'email.reset_expiry_minutes', type: 'integer', min: 1, defaultValue: 30 },
+  { key: 'email.invitation_expiry_hours', type: 'integer', min: 1, defaultValue: 24 },
+  { key: 'email.verification_subject', type: 'string', defaultValue: 'Verify your Pulse Signage email address' },
+  { key: 'email.verification_body', type: 'string', defaultValue: 'Hello [b][[display_name]][/b]!\n[[action_button]]\nThis [u]link[/u] expires in [i][[expiry_time]][/i].\nConfirm this email address: [[url]]' },
+  { key: 'email.reset_subject', type: 'string', defaultValue: 'Reset your Pulse Signage password' },
+  { key: 'email.reset_body', type: 'string', defaultValue: 'Hello [b][[display_name]][/b]!\n[[action_button]]\nThis [u]link[/u] expires in [i][[expiry_time]][/i].\nChoose a new password: [[url]]' },
+  { key: 'email.verification_button_alignment', type: 'enum', values: ['left', 'center', 'right'], defaultValue: 'center' },
+  { key: 'email.verification_button_text', type: 'string', defaultValue: 'Verify email address' },
+  { key: 'email.reset_button_alignment', type: 'enum', values: ['left', 'center', 'right'], defaultValue: 'center' },
+  { key: 'email.reset_button_text', type: 'string', defaultValue: 'Reset password' },
+  { key: 'email.invitation_subject', type: 'string', defaultValue: 'You have been invited to Pulse Signage' },
+  { key: 'email.invitation_body', type: 'string', defaultValue: 'Hello [b][[display_name]][/b]!\n[[action_button]]\nThis [u]invitation link[/u] expires in [i][[expiry_time]][/i].\nCreate your account: [[url]]' },
+  { key: 'email.invitation_button_alignment', type: 'enum', values: ['left', 'center', 'right'], defaultValue: 'center' },
+  { key: 'email.invitation_button_text', type: 'string', defaultValue: 'Accept invitation' },
   { key: 'audit.enabled', type: 'boolean', defaultValue: true },
   { key: 'audit.categories', type: 'string_array', defaultValue: ['authentication', 'security', 'sessions', 'users', 'roles', 'system-settings'] },
+  { key: 'audit.screen_control_commands', type: 'string_array', defaultValue: [] },
   { key: 'audit.include_request_metadata', type: 'boolean', defaultValue: true },
   { key: 'audit.retention_days', type: 'integer', min: 0, defaultValue: 180 },
   { key: 'uploads.image_max_bytes', type: 'integer', min: 1, defaultValue: 100 * 1024 * 1024 },
@@ -35,13 +62,13 @@ const SETTING_DEFINITIONS = [
   { key: 'announcements.suggested_icons', type: 'string_array', defaultValue: DEFAULT_ANNOUNCEMENT_ICON_KEYS.slice() },
   { key: 'player.default_slide_duration_seconds', type: 'integer', min: 1, defaultValue: 10 },
   { key: 'player.default_fade_between_slides', type: 'boolean', defaultValue: true },
-  { key: 'player.skip_unavailable_rtmp', type: 'boolean', defaultValue: true }
-  ,{ key: 'data-sources.rss_default_interval_value', type: 'integer', min: 1, defaultValue: 60 }
-  ,{ key: 'data-sources.rss_default_interval_unit', type: 'enum', values: ['seconds', 'minutes', 'hours'], defaultValue: 'minutes' }
-  ,{ key: 'data-sources.api_default_interval_value', type: 'integer', min: 1, defaultValue: 60 }
-  ,{ key: 'data-sources.api_default_interval_unit', type: 'enum', values: ['seconds', 'minutes', 'hours'], defaultValue: 'minutes' }
-  ,{ key: 'weather.open_meteo_api_key', type: 'string', defaultValue: '' }
-  ,{ key: 'weather.pirate_weather_api_key', type: 'string', defaultValue: '' }
+  { key: 'player.skip_unavailable_rtmp', type: 'boolean', defaultValue: true },
+  { key: 'data-sources.rss_default_interval_value', type: 'integer', min: 1, defaultValue: 60 },
+  { key: 'data-sources.rss_default_interval_unit', type: 'enum', values: ['seconds', 'minutes', 'hours'], defaultValue: 'minutes' },
+  { key: 'data-sources.api_default_interval_value', type: 'integer', min: 1, defaultValue: 60 },
+  { key: 'data-sources.api_default_interval_unit', type: 'enum', values: ['seconds', 'minutes', 'hours'], defaultValue: 'minutes' },
+  { key: 'weather.open_meteo_api_key', type: 'string', defaultValue: '' },
+  { key: 'weather.pirate_weather_api_key', type: 'string', defaultValue: '' }
 ];
 
 const DEFINITIONS_BY_KEY = new Map(SETTING_DEFINITIONS.map(function (definition) {

src/data/audit-log.js

@@ -1,3 +1,5 @@
+// Audit event definitions and data access helpers for administrative activity.
+
 const AUDIT_EVENT_CATEGORIES = Object.freeze({
   AUTHENTICATION: 'authentication',
   SECURITY: 'security',
@@ -13,7 +15,9 @@ const AUDIT_EVENT_CATEGORIES = Object.freeze({
   CANVAS_SIZES: 'canvas-sizes',
   API_SOURCES: 'api-sources',
   RSS_FEEDS: 'rss-feeds',
-  TIMETABLES: 'timetables'
+  TIMETABLES: 'timetables',
+  WEATHER: 'weather',
+  SCREEN_CONTROLS: 'screen-controls'
 });
 const AUDIT_CATEGORY_KEYS = Object.freeze(Object.values(AUDIT_EVENT_CATEGORIES));
 const AUDIT_CATEGORY_LABELS = Object.freeze({
@@ -31,10 +35,42 @@ const AUDIT_CATEGORY_LABELS = Object.freeze({
   'canvas-sizes': 'Canvas Sizes',
   'api-sources': 'API Sources',
   'rss-feeds': 'RSS Feeds',
-  timetables: 'Timetables'
+  timetables: 'Timetables',
+  weather: 'Weather',
+  'screen-controls': 'Screen Controls'
+});
+const SCREEN_CONTROL_COMMAND_KEYS = Object.freeze(['pause', 'blackout', 'reload', 'navigation', 'moveclient', 'setclientname']);
+const SCREEN_CONTROL_COMMAND_LABELS = Object.freeze({
+  pause: 'Pause / Resume',
+  blackout: 'Blackout / Restore',
+  reload: 'Reload',
+  navigation: 'Forward / Back',
+  moveclient: 'Move client',
+  setclientname: 'Rename client'
 });
 const { fetchAppSettings } = require('./app-settings');
 
+function formatUserAgentLabel(userAgent) {
+  const value = String(userAgent || '').trim();
+  if (!value) return '';
+  const browserMatch = value.match(/(?:Edg|OPR|Chrome|Firefox|Version|Electron)\/([\d.]+)/i);
+  let browser = '';
+  if (/Edg\//i.test(value)) browser = 'Edge';
+  else if (/OPR\//i.test(value)) browser = 'Opera';
+  else if (/Electron\//i.test(value)) browser = 'Electron';
+  else if (/Chrome\//i.test(value)) browser = 'Chrome';
+  else if (/Firefox\//i.test(value)) browser = 'Firefox';
+  else if (/Version\/.*Safari\//i.test(value)) browser = 'Safari';
+  const browserLabel = browserMatch && browser ? browser + ' ' + browserMatch[1] : browser;
+  let operatingSystem = '';
+  if (/Windows NT/i.test(value)) operatingSystem = 'Windows';
+  else if (/Macintosh|Mac OS X/i.test(value)) operatingSystem = 'macOS';
+  else if (/Android/i.test(value)) operatingSystem = 'Android';
+  else if (/iPhone|iPad|iPod/i.test(value)) operatingSystem = 'iOS';
+  else if (/Linux/i.test(value)) operatingSystem = 'Linux';
+  return [browserLabel, operatingSystem].filter(Boolean).join(' on ') || value;
+}
+
 function normalizeDetails(details) {
   if (details === undefined || details === null) {
     return null;
@@ -99,6 +135,14 @@ async function recordRequestAuditEvent(pool, req, event) {
     if (!settings['audit.enabled'] || !enabledCategories.includes(category)) {
       return;
     }
+    if (category === 'screen-controls') {
+      const command = String(event && event.eventType || '').replace(/^screen-control\./, '').trim().toLowerCase();
+      const commandGroup = command === 'previous' || command === 'next' ? 'navigation' : command;
+      const enabledCommands = Array.isArray(settings['audit.screen_control_commands']) ? settings['audit.screen_control_commands'] : [];
+      if (!enabledCommands.includes(commandGroup)) {
+        return;
+      }
+    }
     const metadata = settings['audit.include_request_metadata'] ? getRequestMetadata(req) : {};
     await recordAuditEvent(pool, Object.assign({}, event, metadata));
   } catch (error) {
@@ -111,6 +155,9 @@ module.exports = {
   AUDIT_EVENT_CATEGORIES,
   AUDIT_CATEGORY_KEYS,
   AUDIT_CATEGORY_LABELS,
+  SCREEN_CONTROL_COMMAND_KEYS,
+  SCREEN_CONTROL_COMMAND_LABELS,
+  formatUserAgentLabel,
   getRequestMetadata,
   buildAuditChanges,
   recordAuditEvent,

src/data/client-name-check.js

@@ -23,6 +23,9 @@ async function isClientNameAvailable(pool, clientName, excludeDeviceId, liveConn
   const normalizedDeviceId = normalizeDeviceId(excludeDeviceId);
   const live = collectLiveConnections(liveConnections);
   const lowerName = normalizedName.toLowerCase();
+  const liveDeviceIds = new Set(live.map(function (connection) {
+    return normalizeDeviceId(connection && (connection.deviceId || connection.clientId));
+  }).filter(Boolean));
 
   try {
     if (pool) {
@@ -32,12 +35,13 @@ async function isClientNameAvailable(pool, clientName, excludeDeviceId, liveConn
          WHERE client_name IS NOT NULL
            AND TRIM(client_name) <> ''
            AND LOWER(TRIM(client_name)) = LOWER(TRIM(?))
-           AND device_id <> ?
-         LIMIT 1`,
+           AND device_id <> ?`,
         [normalizedName, normalizedDeviceId]
       );
 
-      if (deviceRows.length) {
+      if ((deviceRows || []).some(function (row) {
+        return liveDeviceIds.has(normalizeDeviceId(row && row.device_id));
+      })) {
         return false;
       }
     }
@@ -72,6 +76,22 @@ async function isClientNameAvailable(pool, clientName, excludeDeviceId, liveConn
   }
 }
 
+async function findAvailableClientName(pool, clientName, excludeDeviceId, liveConnections) {
+  const normalizedName = normalizeClientName(clientName);
+  if (!normalizedName) {
+    return '';
+  }
+
+  for (let suffix = 0; suffix < 1000; suffix += 1) {
+    const candidate = suffix === 0 ? normalizedName : `${normalizedName} (${suffix})`;
+    if (await isClientNameAvailable(pool, candidate, excludeDeviceId, liveConnections)) {
+      return candidate;
+    }
+  }
+
+  return '';
+}
+
 function buildClientNameLockName(clientName) {
   return `ps_client_name_${crypto.createHash('sha1').update(String(clientName || '').trim().toLowerCase()).digest('hex')}`;
 }
@@ -116,5 +136,6 @@ module.exports = {
   normalizeDeviceId: normalizeDeviceId,
   collectLiveConnections: collectLiveConnections,
   isClientNameAvailable: isClientNameAvailable,
+  findAvailableClientName: findAvailableClientName,
   withClientNameReservation: withClientNameReservation
 };

src/data/mailer.js

@@ -0,0 +1,43 @@
+// SMTP delivery for account notifications.
+
+const nodemailer = require('nodemailer');
+
+function getSmtpConfig(settings) {
+  return {
+    enabled: Boolean(settings['email.smtp_enabled']),
+    host: String(settings['email.smtp_host'] || '').trim(),
+    port: Number(settings['email.smtp_port']) || 587,
+    security: String(settings['email.smtp_security'] || 'starttls'),
+    username: String(settings['email.smtp_username'] || '').trim(),
+    password: String(settings['email.smtp_password'] || ''),
+    fromAddress: String(settings['email.from_address'] || '').trim(),
+    fromName: String(settings['email.from_name'] || '').trim()
+  };
+}
+
+function createMailTransport(settings) {
+  const config = getSmtpConfig(settings);
+  if (!config.enabled || !config.host || !config.fromAddress) {
+    return null;
+  }
+  return nodemailer.createTransport({
+    host: config.host,
+    port: config.port,
+    secure: config.security === 'tls',
+    requireTLS: config.security === 'starttls',
+    auth: config.username ? { user: config.username, pass: config.password } : undefined
+  });
+}
+
+async function sendAccountEmail(settings, message) {
+  const transport = createMailTransport(settings);
+  if (!transport) {
+    throw new Error('Email delivery is not configured.');
+  }
+  const config = getSmtpConfig(settings);
+  return transport.sendMail(Object.assign({}, message, {
+    from: config.fromName ? '"' + config.fromName.replace(/"/g, '') + '" <' + config.fromAddress + '>' : config.fromAddress,
+  }));
+}
+
+module.exports = { getSmtpConfig, createMailTransport, sendAccountEmail };

src/data/player-registry.js

@@ -1,3 +1,5 @@
+// Persistent player registration and heartbeat helpers shared by the web app and bridge.
+
 function normalizeDeviceId(value) {
   return String(value || '')
     .trim()

src/data/qr-code.js

@@ -1,3 +1,5 @@
+// QR code generation helpers for player onboarding and administrative links.
+
 const path = require('path');
 const QRCodeStyling = require(path.join(__dirname, '..', 'web', 'public', 'vendor', 'qr-code-styling', 'qr-code-styling.js'));
 const QR_PNG_WIDTH = 2048;

src/db/common.js

@@ -1,3 +1,5 @@
+// Database pool setup and lifecycle maintenance for persisted onboarding devices.
+
 const mysql = require('mysql2/promise');
 
 function createPool() {
@@ -15,14 +17,34 @@ function createPool() {
 }
 
 async function pruneStaleOnboardingDevices(pool) {
+  // Uncompleted pairings expire quickly; completed bindings use their persisted heartbeat instead.
   await pool.query(
     `DELETE FROM d_onboarding_devices
-     WHERE screen_id IS NULL
-       AND modified_at < (CURRENT_TIMESTAMP - INTERVAL 1 MINUTE)`
+     WHERE (screen_id IS NULL
+           AND modified_at < (CURRENT_TIMESTAMP - INTERVAL 15 MINUTE))
+        OR (last_seen_at IS NOT NULL
+            AND last_seen_at < (CURRENT_TIMESTAMP - INTERVAL 24 HOUR))`
+  );
+}
+
+async function touchOnboardingDeviceLastSeen(pool, deviceId) {
+  const deviceIds = (Array.isArray(deviceId) ? deviceId : [deviceId])
+    .map(function (value) { return String(value || '').trim(); })
+    .filter(Boolean);
+  if (!deviceIds.length) {
+    return;
+  }
+
+  await pool.query(
+    `UPDATE d_onboarding_devices
+        SET last_seen_at = CURRENT_TIMESTAMP
+      WHERE device_id IN (${deviceIds.map(function () { return '?'; }).join(', ')})`,
+    deviceIds
   );
 }
 
 module.exports = {
   createPool,
-  pruneStaleOnboardingDevices
+  pruneStaleOnboardingDevices,
+  touchOnboardingDeviceLastSeen
 };

src/db/index.js

@@ -1,3 +1,5 @@
+// Schema initialization, migration execution, and database bootstrap helpers.
+
 const { version: appVersion } = require('#root/package.json');
 const { compareVersions, detectSchemaVersion, getPendingMigrations, recordSchemaVersion, runMigrations } = require('./migrations');
 
@@ -247,6 +249,9 @@ async function ensureSchema(pool, options) {
       token_url VARCHAR(1024) NULL,
       token_request_body_json MEDIUMTEXT NULL,
       token_response_path VARCHAR(255) NULL DEFAULT 'access_token',
+      token_refresh_url VARCHAR(1024) NULL,
+      token_refresh_request_body_json MEDIUMTEXT NULL,
+      token_refresh_response_path VARCHAR(255) NULL DEFAULT 'refresh_token',
       token_header_name VARCHAR(255) NULL DEFAULT 'Authorization',
       token_header_prefix VARCHAR(64) NULL DEFAULT 'Bearer',
       items_path VARCHAR(255) NULL,
@@ -331,6 +336,7 @@ async function ensureSchema(pool, options) {
       created_by INT NULL,
       modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
       modified_by INT NULL,
+      last_seen_at TIMESTAMP NULL,
       CONSTRAINT fk_player_onboarding_devices_screen FOREIGN KEY (screen_id) REFERENCES d_screens(id) ON DELETE SET NULL
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
@@ -340,11 +346,18 @@ async function ensureSchema(pool, options) {
       id INT AUTO_INCREMENT PRIMARY KEY,
       name VARCHAR(255) NULL,
       username VARCHAR(255) NOT NULL UNIQUE,
+      email VARCHAR(320) NULL,
+      email_verified_at DATETIME NULL,
+      pending_email VARCHAR(320) NULL,
+      pending_email_token_hash CHAR(64) NULL,
+      pending_email_expires_at DATETIME NULL,
       password_hash CHAR(64) NOT NULL,
       password_salt VARCHAR(64) NOT NULL,
       password_iterations INT NOT NULL,
       must_change_password TINYINT(1) NOT NULL DEFAULT 0,
       account_locked TINYINT(1) NOT NULL DEFAULT 0,
+      last_login_at DATETIME NULL,
+      last_login_ip VARCHAR(255) NULL,
       created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
       created_by INT NULL,
       modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
@@ -352,6 +365,37 @@ async function ensureSchema(pool, options) {
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS a_account_tokens (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
+      user_id INT NOT NULL,
+      token_type VARCHAR(32) NOT NULL,
+      token_hash CHAR(64) NOT NULL UNIQUE,
+      expires_at DATETIME NOT NULL,
+      used_at DATETIME NULL,
+      created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+      CONSTRAINT fk_account_tokens_user FOREIGN KEY (user_id) REFERENCES a_users(id) ON DELETE CASCADE,
+      INDEX idx_account_tokens_lookup (token_type, token_hash, expires_at),
+      INDEX idx_account_tokens_user_type (user_id, token_type)
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
+
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS a_user_invitations (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
+      email VARCHAR(320) NOT NULL,
+      name VARCHAR(255) NULL,
+      role_ids_json TEXT NOT NULL,
+      token_hash CHAR(64) NOT NULL UNIQUE,
+      expires_at DATETIME NOT NULL,
+      used_at DATETIME NULL,
+      created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+      created_by INT NULL,
+      INDEX idx_user_invitations_email (email, used_at, expires_at),
+      INDEX idx_user_invitations_created_by (created_by, created_at)
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
+
   await pool.query(`
     CREATE TABLE IF NOT EXISTS a_roles (
       id INT AUTO_INCREMENT PRIMARY KEY,

src/db/migrations.js

@@ -1,3 +1,5 @@
+// Ordered database migrations kept independent from the application version.
+
 const { version: appVersion } = require('#root/package.json');
 const TIMETABLE_TIME_ZONE = 'Europe/London';
 const APP_STATE_TABLE = 'o_app_state';
@@ -502,7 +504,10 @@ const VERSIONED_MIGRATIONS = [
       await ensureColumn(pool, 'i_api_sources', 'token_url', 'VARCHAR(1024) NULL', 'auth_header_value');
       await ensureColumn(pool, 'i_api_sources', 'token_request_body_json', 'MEDIUMTEXT NULL', 'token_url');
       await ensureColumn(pool, 'i_api_sources', 'token_response_path', "VARCHAR(255) NULL DEFAULT 'access_token'", 'token_request_body_json');
-      await ensureColumn(pool, 'i_api_sources', 'token_header_name', "VARCHAR(255) NULL DEFAULT 'Authorization'", 'token_response_path');
+      await ensureColumn(pool, 'i_api_sources', 'token_refresh_url', 'VARCHAR(1024) NULL', 'token_response_path');
+      await ensureColumn(pool, 'i_api_sources', 'token_refresh_request_body_json', 'MEDIUMTEXT NULL', 'token_refresh_url');
+      await ensureColumn(pool, 'i_api_sources', 'token_refresh_response_path', "VARCHAR(255) NULL DEFAULT 'refresh_token'", 'token_refresh_request_body_json');
+      await ensureColumn(pool, 'i_api_sources', 'token_header_name', "VARCHAR(255) NULL DEFAULT 'Authorization'", 'token_refresh_response_path');
       await ensureColumn(pool, 'i_api_sources', 'token_header_prefix', "VARCHAR(64) NULL DEFAULT 'Bearer'", 'token_header_name');
     }
   },
@@ -552,6 +557,70 @@ const VERSIONED_MIGRATIONS = [
     run: async function (pool) {
       await ensureColumn(pool, 'c_templates', 'background_gradient', 'LONGTEXT NULL', 'background_color');
     }
+  },
+  {
+    version: '2.10.2',
+    label: 'v2.10.2 onboarding client last-seen schema',
+    run: async function (pool) {
+      await ensureColumn(pool, 'd_onboarding_devices', 'last_seen_at', 'TIMESTAMP NULL', 'screen_id');
+    }
+  },
+  {
+    version: '2.10.7',
+    label: 'v2.10.7 API token refresh settings schema',
+    run: async function (pool) {
+      await ensureColumn(pool, 'i_api_sources', 'token_refresh_url', 'VARCHAR(1024) NULL', 'token_response_path');
+      await ensureColumn(pool, 'i_api_sources', 'token_refresh_request_body_json', 'MEDIUMTEXT NULL', 'token_refresh_url');
+      await ensureColumn(pool, 'i_api_sources', 'token_refresh_response_path', "VARCHAR(255) NULL DEFAULT 'refresh_token'", 'token_refresh_request_body_json');
+    }
+  },
+  {
+    version: '2.11.0',
+    label: 'v2.11.0 account email and password reset schema',
+    run: async function (pool) {
+      await ensureColumn(pool, 'a_users', 'email', 'VARCHAR(320) NULL', 'username');
+      await ensureColumn(pool, 'a_users', 'email_verified_at', 'DATETIME NULL', 'email');
+      await ensureColumn(pool, 'a_users', 'pending_email', 'VARCHAR(320) NULL', 'email_verified_at');
+      await ensureColumn(pool, 'a_users', 'pending_email_token_hash', 'CHAR(64) NULL', 'pending_email');
+      await ensureColumn(pool, 'a_users', 'pending_email_expires_at', 'DATETIME NULL', 'pending_email_token_hash');
+      await ensureColumn(pool, 'a_users', 'last_login_at', 'DATETIME NULL', 'modified_by');
+      await ensureColumn(pool, 'a_users', 'last_login_ip', 'VARCHAR(255) NULL', 'last_login_at');
+      await pool.query(`
+        CREATE TABLE IF NOT EXISTS a_account_tokens (
+          id BIGINT AUTO_INCREMENT PRIMARY KEY,
+          user_id INT NOT NULL,
+          token_type VARCHAR(32) NOT NULL,
+          token_hash CHAR(64) NOT NULL UNIQUE,
+          expires_at DATETIME NOT NULL,
+          used_at DATETIME NULL,
+          created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+          CONSTRAINT fk_account_tokens_user FOREIGN KEY (user_id) REFERENCES a_users(id) ON DELETE CASCADE,
+          INDEX idx_account_tokens_lookup (token_type, token_hash, expires_at),
+          INDEX idx_account_tokens_user_type (user_id, token_type)
+        ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+      `);
+    }
+  },
+  {
+    version: '2.11.1',
+    label: 'v2.11.1 user invitations schema',
+    run: async function (pool) {
+      await pool.query(`
+        CREATE TABLE IF NOT EXISTS a_user_invitations (
+          id BIGINT AUTO_INCREMENT PRIMARY KEY,
+          email VARCHAR(320) NOT NULL,
+          name VARCHAR(255) NULL,
+          role_ids_json TEXT NOT NULL,
+          token_hash CHAR(64) NOT NULL UNIQUE,
+          expires_at DATETIME NOT NULL,
+          used_at DATETIME NULL,
+          created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+          created_by INT NULL,
+          INDEX idx_user_invitations_email (email, used_at, expires_at),
+          INDEX idx_user_invitations_created_by (created_by, created_at)
+        ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+      `);
+    }
   }
 ];
 

src/player-bridge/index.js

@@ -1,3 +1,5 @@
+// Thin-client bridge for player registration, snapshots, commands, and heartbeats.
+
 const express = require('express');
 const crypto = require('crypto');
 const fs = require('fs');
@@ -8,7 +10,6 @@ const common = require('../common');
 const { verifyRequestAuth, createRequestAuthHeaders } = require('#src/request-auth');
 const { normalizeDeviceId, upsertPlayerRegistration, recordPlayerHeartbeat } = require('#src/data/player-registry');
 const { createPlayerPlaylistService } = require('../player/playlist');
-const { buildThumbnailPreviewData } = require('../player/thumbnail-preview');
 const { commitDeviceBinding, bindPlayerToScreen, getOnboardingStatus, getPlayerPublicBaseUrl } = require('../player/onboarding');
 const { createStyledQrCodeSvg } = require('../data/qr-code');
 const { verifyPageAuthToken } = require('#src/request-auth');
@@ -458,7 +459,21 @@ async function start() {
 
   function storeScreenSnapshot(slug, connections, deviceIds) {
     const key = String(slug || '').trim();
-    const normalizedConnections = Array.isArray(connections) ? connections : [];
+    const normalizedConnections = [];
+    const connectionIndexes = new Map();
+    (Array.isArray(connections) ? connections : []).forEach(function (connection) {
+      const identity = connection && typeof connection === 'object'
+        ? [String(connection.deviceId || '').trim(), String(connection.clientId || '').trim()].join('|')
+        : '';
+      if (!identity || !connectionIndexes.has(identity)) {
+        if (identity) {
+          connectionIndexes.set(identity, normalizedConnections.length);
+        }
+        normalizedConnections.push(connection);
+        return;
+      }
+      normalizedConnections[connectionIndexes.get(identity)] = connection;
+    });
     const normalizedDeviceIds = Array.isArray(deviceIds) ? deviceIds.map(function (value) {
       return normalizeDeviceId(value);
     }).filter(Boolean) : [];
@@ -654,6 +669,16 @@ async function start() {
         }, response && typeof response === 'object' ? response : {});
       }));
 
+      logBridge('Screen command result', {
+        screenSlug: slug,
+        command: command,
+        connectionId: connectionId || null,
+        targets: targetPlayers.map(function (target) { return target.deviceId; }),
+        results: results.map(function (result) {
+          return { playerIdentifier: result.playerIdentifier, ok: result.ok, status: result.status, error: result.error || null };
+        })
+      });
+
       res.json({
         ok: true,
         screenSlug: slug,
@@ -882,48 +907,6 @@ async function start() {
     }
   });
 
-  app.get('/api/internal/slide-thumbnails/:id/preview', requireRequestAuth, async function (req, res, next) {
-    try {
-      const slide = await common.fetchSlideById(pool, Number(req.params.id));
-      if (!slide) {
-        return res.status(404).send('Slide not found');
-      }
-
-      const data = buildThumbnailPreviewData(slide);
-
-      if (typeof common.fetchRssFeedsData === 'function' && typeof common.fetchRssFeedItemsByFeedId === 'function') {
-        const rssData = await common.fetchRssFeedsData(pool);
-        data.rssFeeds = await Promise.all((rssData.rssFeeds || []).map(async function (feed) {
-          const items = await common.fetchRssFeedItemsByFeedId(pool, feed.id);
-          return Object.assign({}, feed, {
-            items: items.map(function (item) {
-              return typeof common.normalizeRssFeedItem === 'function' ? common.normalizeRssFeedItem(item) : item;
-            })
-          });
-        }));
-      }
-
-      if (typeof common.fetchApiSourcesData === 'function') {
-        const apiData = await common.fetchApiSourcesData(pool);
-        data.apiSources = (apiData.apiSources || []).map(function (source) {
-          return Object.assign({}, source, {
-            responseJson: typeof common.parseJsonSafe === 'function' ? common.parseJsonSafe(source.last_response_json) : null
-          });
-        });
-      }
-
-      if (typeof common.fetchTimetablesData === 'function') {
-        const timetableData = await common.fetchTimetablesData(pool);
-        data.timetableGroups = Array.isArray(timetableData && timetableData.timetableGroups) ? timetableData.timetableGroups : [];
-      }
-
-      res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
-      res.send(common.renderPlayerPage('slide-thumbnail-preview-' + slide.id, data));
-    } catch (error) {
-      next(error);
-    }
-  });
-
   app.post('/api/players/:deviceId/commands', requireRequestAuth, async function (req, res, next) {
     try {
       const deviceId = normalizeDeviceId(req.params.deviceId);
@@ -933,8 +916,11 @@ async function start() {
         return res.status(404).json({ ok: false, error: 'Player is not connected.' });
       }
 
-      socket.send(JSON.stringify(payload));
-      res.json({ ok: true, deviceId: deviceId, sent: true });
+      const response = await sendPlayerCommandToSocket(socket, payload);
+      res.status(response && response.ok ? 200 : (response && response.status || 502)).json(Object.assign({
+        deviceId: deviceId,
+        connectionId: payload.connectionId || null
+      }, response && typeof response === 'object' ? response : { ok: false }));
     } catch (error) {
       next(error);
     }
@@ -989,7 +975,19 @@ async function start() {
         return;
       }
 
-      setScreenSnapshotSource(slug, deviceId, Array.isArray(payload.connections) ? payload.connections : []);
+      const snapshotPlayerPublicBaseUrl = String(payload.playerPublicBaseUrl || socket.publicBaseUrl || '').trim().replace(/\/$/, '');
+      const connections = Array.isArray(payload.connections) ? payload.connections.map(function (connection) {
+        if (!connection || typeof connection !== 'object' || !snapshotPlayerPublicBaseUrl) {
+          return connection && typeof connection === 'object'
+            ? Object.assign({}, connection, { playerDeviceId: deviceId })
+            : connection;
+        }
+        return Object.assign({}, connection, {
+          playerDeviceId: deviceId,
+          playerPublicBaseUrl: snapshotPlayerPublicBaseUrl
+        });
+      }) : [];
+      setScreenSnapshotSource(slug, deviceId, connections);
       return;
     }
 
@@ -1021,6 +1019,12 @@ async function start() {
         publicBaseUrl: payload.publicBaseUrl,
         internalBaseUrl: payload.internalBaseUrl
       });
+      if (typeof common.touchOnboardingDeviceLastSeen === 'function') {
+        const onboardingClientIds = (Array.isArray(payload.connections) ? payload.connections : []).map(function (connection) {
+          return connection && connection.clientId;
+        });
+        await common.touchOnboardingDeviceLastSeen(pool, onboardingClientIds);
+      }
 
       socket.send(JSON.stringify({ type: 'heartbeat-ack', ok: true, player: player }));
       return;

src/player.js

@@ -1,3 +1,5 @@
+// Player application bootstrap, media routes, websocket runtime, and onboarding wiring.
+
 const express = require('express');
 const fs = require('fs');
 const http = require('http');
@@ -10,8 +12,10 @@ const { createRtmpStreamService } = require('./player/modules/rtmp-streams');
 const { normalizeDeviceId, registerPlayerOnboardingRoutes, commitDeviceBinding } = require('./player/onboarding');
 const { createOnboardingStore } = require('./player/onboarding/store');
 const { registerPlayerRoutes } = require('./player/routes');
+const { getPlayerRuntimeScripts } = require('./player/render-helpers');
 const { ensureFontLibrary } = require('#src/web/lib/media/font-library');
 const { createRequestAuthHeaders } = require('#src/request-auth');
+const { withClientNameReservation } = require('#src/data/client-name-check');
 const { getConfiguredPlayerIdentifier, recordPlayerHeartbeat } = require('#src/data/player-registry');
 
 
@@ -20,11 +24,11 @@ async function start() {
   const app = express();
   const pool = String(process.env.BRIDGE_PUBLIC_URL || '').trim().replace(/\/$/, '') ? null : common.createPool();
   const PORT = Number(process.env.PLAYER_PORT || 8081);
-  const PLAYER_PUBLIC_URL = String(process.env.PLAYER_PUBLIC_URL || process.env.PLAYER_BASE_URL || '').trim().replace(/\/$/, '');
+  const PLAYER_PUBLIC_URL = String(process.env.PLAYER_PUBLIC_URL || '').trim().replace(/\/$/, '');
   const BRIDGE_PUBLIC_URL = String(process.env.BRIDGE_PUBLIC_URL || '').trim().replace(/\/$/, '');
   const WEB_INTERNAL_URL = String(process.env.WEB_INTERNAL_URL || '').trim().replace(/\/$/, '');
   const isRemotePlayer = Boolean(BRIDGE_PUBLIC_URL);
-  const PLAYER_INTERNAL_URL = String(isRemotePlayer ? BRIDGE_PUBLIC_URL : (process.env.PLAYER_INTERNAL_URL || PLAYER_PUBLIC_URL || process.env.PLAYER_BASE_URL || '')).trim().replace(/\/$/, '');
+  const PLAYER_INTERNAL_URL = String(isRemotePlayer ? BRIDGE_PUBLIC_URL : (process.env.PLAYER_INTERNAL_URL || '')).trim().replace(/\/$/, '');
   const PLAYER_DEVICE_ID = getConfiguredPlayerIdentifier();
   const PLAYER_AGENT_RECONNECT_DELAY_MS = Number(process.env.PLAYER_AGENT_RECONNECT_DELAY_MS || 5000);
   const ASSET_DIR = path.join(__dirname, 'player', 'public');
@@ -52,11 +56,28 @@ async function start() {
         thinClientSocket.send(JSON.stringify({
           type: 'snapshot',
           deviceId: PLAYER_DEVICE_ID,
+          playerPublicBaseUrl: getPlayerPublicBaseUrl(),
           slug: snapshot && snapshot.slug ? String(snapshot.slug).trim() : '',
           connections: Array.isArray(snapshot && snapshot.connections) ? snapshot.connections : []
         }));
       } catch (_error) {
       }
+    },
+    persistClientName: async function (deviceId, clientName) {
+      if (!pool || !deviceId || !clientName) {
+        return;
+      }
+      await withClientNameReservation(pool, clientName, async function () {
+        await pool.query(
+          `UPDATE d_onboarding_devices
+              SET client_name = ?, modified_at = CURRENT_TIMESTAMP
+            WHERE device_id = ?`,
+          [clientName, deviceId]
+        );
+      });
+    },
+    touchClientLastSeen: async function (deviceId) {
+      await common.touchOnboardingDeviceLastSeen(pool, deviceId);
     }
   });
   const playerPlaylistService = isRemotePlayer
@@ -320,6 +341,14 @@ async function start() {
       }
     }
   });
+  app.get('/assets/player-script/:name.js', function (req, res) {
+    const script = getPlayerRuntimeScripts().find(function (entry) { return entry[0] === req.params.name; });
+    if (!script) {
+      return res.sendStatus(404);
+    }
+    res.set('Cache-Control', 'no-cache');
+    return res.type('application/javascript').send(script[1]);
+  });
   registerPlayerRoutes(app, {
     pool: pool,
     common: common,
@@ -328,6 +357,7 @@ async function start() {
     playerRuntime: playerRuntime,
     playerPlaylistService: playerPlaylistService,
     rtmpStreamService: rtmpStreamService,
+    snapshotDir: path.join(MEDIA_DIR, 'player-cache', 'screen-playlists'),
     playerInternalBaseUrl: PLAYER_INTERNAL_URL,
     bridgeBaseUrl: BRIDGE_PUBLIC_URL,
     playerDeviceId: PLAYER_DEVICE_ID,
@@ -391,7 +421,8 @@ async function start() {
           internalBaseUrl: PLAYER_INTERNAL_URL,
           pairingCode: activePairingCode,
           pairingCodes: activePairingCodes,
-          pairingSessions: activePairingSessions
+          pairingSessions: activePairingSessions,
+          connections: playerRuntime.snapshotAllConnections()
         }));
       }
 
@@ -439,6 +470,7 @@ async function start() {
           socket.send(JSON.stringify({
             type: 'snapshot',
             deviceId: PLAYER_DEVICE_ID,
+            playerPublicBaseUrl: getPlayerPublicBaseUrl(),
             slug: String(slug || '').trim(),
             connections: playerRuntime.snapshotConnections(slug)
           }));
@@ -565,10 +597,6 @@ async function start() {
         console.error(error);
       });
 
-      if (playerRuntime.snapshotAllConnections().length > 0) {
-        await common.pruneStaleOnboardingDevices(pool);
-      }
-
       await onboardingStore.flushBindings(function (entry) {
         return commitDeviceBinding(
           pool,

src/player/onboarding/index.js

@@ -2,7 +2,7 @@
 
 const express = require('express');
 const crypto = require('crypto');
-const { isClientNameAvailable, withClientNameReservation } = require('#src/data/client-name-check');
+const { findAvailableClientName, withClientNameReservation } = require('#src/data/client-name-check');
 const { createStyledQrCodeSvg } = require('#src/data/qr-code');
 const { getSharedSecret, verifyPageAuthToken, verifyRequestAuth, createRequestAuthHeaders } = require('#src/request-auth');
 const { resolvePlayerRegistration, upsertPlayerRegistration: upsertPlayerRegistrationRecord } = require('#src/data/player-registry');
@@ -48,7 +48,7 @@ function getPublicBaseUrl(req, configuredUrl) {
     return `${protocol}://${host}`.replace(/\/$/, '');
   }
 
-  const configured = String(configuredUrl || process.env.PLAYER_PUBLIC_URL || process.env.PLAYER_BASE_URL || '').trim().replace(/\/$/, '');
+  const configured = String(configuredUrl || process.env.PLAYER_PUBLIC_URL || '').trim().replace(/\/$/, '');
   return configured || null;
 }
 
@@ -75,7 +75,7 @@ function getPlayerPublicBaseUrl(req, configuredUrl) {
 }
 
 function getPlayerInternalBaseUrl(configuredUrl) {
-  const configured = String(configuredUrl || process.env.PLAYER_INTERNAL_URL || process.env.PLAYER_BASE_URL || '').trim().replace(/\/$/, '');
+  const configured = String(configuredUrl || process.env.PLAYER_INTERNAL_URL || '').trim().replace(/\/$/, '');
   return configured || null;
 }
 
@@ -144,8 +144,8 @@ async function commitDeviceBinding(pool, deviceId, clientName, screenSlug, isNam
     }
     const screen = screenRows[0];
 
-    const available = await isClientNameAvailable(pool, normalizedClientName, null, liveConnections);
-    if (!available) {
+    const selectedClientName = await findAvailableClientName(pool, normalizedClientName, normalizedDeviceId, liveConnections);
+    if (!selectedClientName) {
       const error = new Error('Client name already exists.');
       error.statusCode = 400;
       throw error;
@@ -153,9 +153,9 @@ async function commitDeviceBinding(pool, deviceId, clientName, screenSlug, isNam
 
     await pool.query(
       `UPDATE d_onboarding_devices
-          SET client_name = ?, screen_id = ?, modified_at = CURRENT_TIMESTAMP
+          SET client_name = ?, screen_id = ?, last_seen_at = CURRENT_TIMESTAMP, modified_at = CURRENT_TIMESTAMP
         WHERE device_id = ?`,
-      [normalizedClientName, screen.id, normalizedDeviceId]
+      [selectedClientName, screen.id, normalizedDeviceId]
     );
     await pool.query(
       `INSERT INTO d_onboarding_devices (device_id, client_name, screen_id)
@@ -163,7 +163,7 @@ async function commitDeviceBinding(pool, deviceId, clientName, screenSlug, isNam
         WHERE NOT EXISTS (
           SELECT 1 FROM d_onboarding_devices WHERE device_id = ?
         )`,
-      [normalizedDeviceId, normalizedClientName, screen.id, normalizedDeviceId]
+      [normalizedDeviceId, selectedClientName, screen.id, normalizedDeviceId]
     );
 
     return getOnboardingStatus(pool, normalizedDeviceId);
@@ -238,7 +238,7 @@ function registerPlayerOnboardingRoutes(app, options) {
   const common = options && options.common ? options.common : null;
   const playerRuntime = options && options.playerRuntime ? options.playerRuntime : null;
   const onboardingStore = options && options.onboardingStore ? options.onboardingStore : null;
-  const playerPublicUrl = String(options && options.playerPublicBaseUrl || process.env.PLAYER_PUBLIC_URL || process.env.PLAYER_BASE_URL || '').trim().replace(/\/$/, '');
+  const playerPublicUrl = String(options && options.playerPublicBaseUrl || process.env.PLAYER_PUBLIC_URL || '').trim().replace(/\/$/, '');
   const bridgeBaseUrl = String(options && options.bridgeBaseUrl || process.env.BRIDGE_PUBLIC_URL || '').trim().replace(/\/$/, '');
   const playerDeviceId = normalizeDeviceId(options && options.playerDeviceId);
   const onPairingCode = options && typeof options.onPairingCode === 'function' ? options.onPairingCode : null;
@@ -581,6 +581,7 @@ function registerPlayerOnboardingRoutes(app, options) {
         }
         if (response.ok) {
           pairingSessions.delete(deviceId);
+          res.cookie('pulse-player-client-id', clientId, { path: '/', sameSite: 'lax' });
         }
         payload.playerUrl = payload && payload.screenSlug ? `${getPublicBaseUrl(req, playerPublicUrl)}/screen/${encodeURIComponent(payload.screenSlug)}` : `${getPublicBaseUrl(req, playerPublicUrl)}/screen/${encodeURIComponent(screenSlug)}`;
         return res.json(payload);
@@ -600,6 +601,7 @@ function registerPlayerOnboardingRoutes(app, options) {
       }
       const status = await bindDeviceToScreen(pool, clientId, clientName, screenSlug, playerRuntime.isClientNameAvailableOnScreen, playerRuntime, onboardingStore);
       pairingSessions.delete(deviceId);
+      res.cookie('pulse-player-client-id', clientId, { path: '/', sameSite: 'lax' });
       res.json({
         deviceId: deviceId,
         clientName: status ? status.client_name : clientName,

src/player/onboarding/player-onboarding-landing.script.html

@@ -44,6 +44,22 @@
         })
         .catch(function () { return null; });
     }
+    function keepPairingSessionLoaded(deviceId, clientId) {
+      var pairingSessionPoll = null;
+      function poll() {
+        loadPairingSession(deviceId, clientId).then(function (payload) {
+          if (payload && payload.pairingCode) {
+            loadQr(deviceId, clientId);
+            if (pairingSessionPoll) {
+              window.clearInterval(pairingSessionPoll);
+              pairingSessionPoll = null;
+            }
+          }
+        });
+      }
+      poll();
+      pairingSessionPoll = window.setInterval(poll, 1000);
+    }
     function getClientId() {
       var stored = getSessionStorageItem("pulse-signage-player-client-id");
       if (stored) { return stored; }
@@ -60,7 +76,7 @@
             if (payload.clientName) { setSessionStorageItem(clientNameKey, payload.clientName); }
             if (payload.clientName && payload.screenSlug) { setSessionStorageItem(getClientNameStorageKey(payload.screenSlug), payload.clientName); }
             try { window.localStorage.setItem(screenKey, payload.screenSlug); } catch (_error) {}
-            window.location.replace("/screen/" + encodeURIComponent(payload.screenSlug) + "?clientId=" + encodeURIComponent(clientId));
+            window.location.replace("/screen/" + encodeURIComponent(payload.screenSlug));
             return true;
           }
           return false;
@@ -74,9 +90,7 @@
       if (qr && !qr.getAttribute("src")) {
         qr.src = qrPlaceholderSrc;
       }
-      loadPairingSession(deviceId, clientId).then(function () {
-          loadQr(deviceId, clientId);
-      });
+        keepPairingSessionLoaded(deviceId, clientId);
       window.setInterval(function () { redirectIfOnboarded(deviceId); }, 2000);
     });
   }());

src/player/player-page.script.html

@@ -1,41 +1,11 @@
+<!-- Player page bootstrap and browser-side playback lifecycle. -->
+
 <script>
   const slug = {{SLUG_JSON}};
   let initialData = {{INITIAL_DATA_JSON}};
   window.slug = slug;
   window.initialData = initialData;
   const app = document.getElementById('app');
-  (function () {
-    var root = window;
-    var registry = root.pulsePlayerRegionTypes && typeof root.pulsePlayerRegionTypes === 'object' ? root.pulsePlayerRegionTypes : {};
-
-    function normalizeType(type) {
-      return String(type || '').trim().toLowerCase();
-    }
-
-    function register(type, definition) {
-      registry[normalizeType(type)] = definition || {};
-      return registry[normalizeType(type)];
-    }
-
-    function get(type) {
-      return registry[normalizeType(type)] || null;
-    }
-
-    function list() {
-      return Object.keys(registry).map(function (type) {
-        return {
-          type: type,
-          definition: registry[type] || {}
-        };
-      });
-    }
-
-    root.pulsePlayerRegionTypes = {
-      register: register,
-      get: get,
-      list: list
-    };
-  }());
   let slides = Array.isArray(initialData && initialData.slides) ? initialData.slides.map(normalizeSlide) : [];
   let currentPlaylistSignature = '';
   let currentPlaylistEtag = '';
@@ -61,6 +31,7 @@
   let viewportRenderTimer = null;
   let refreshRetryTimer = null;
   let refreshRetryDelayMs = 0;
+  let playlistRefreshTimer = null;
   let commandClientId = null;
   let screenWakeLock = null;
   let screenWakeLockRequestPromise = null;
@@ -71,7 +42,8 @@
   let isBlackout = false;
   let pausedRemainingMs = null;
   let slideExpiresAt = null;
-  const slideFadeDurationMs = 560;
+  const slideFadeLengthMs = 560;
+  const slideFadeOffsetMs = slideFadeLengthMs / 2;
   const commandSocketPath = '/ws/screens/' + encodeURIComponent(slug);
   const commandClientStorageKey = 'pulse-signage-player-client-id';
   const playlistSnapshotStorageKey = 'pulse-signage-player-playlist-snapshot:' + slug;
@@ -93,16 +65,23 @@
 
   function logDebug(message, details, level) {
     var logger = level === 'error' ? console.error : console.info;
+    var timestamp = new Date().toISOString();
+    var timestampedMessage = '[' + timestamp + '] ' + String(message || '');
     if (details) {
-      logger(message, details);
+      logger(timestampedMessage, details);
     } else {
-      logger(message);
+      logger(timestampedMessage);
     }
   }
 
   // Render the empty-state message into the player root.
   function renderEmpty(message) {
-    app.innerHTML = '<div class="empty">' + escapeHtml(message) + '</div>';
+    var markup = '<div class="empty">' + escapeHtml(message) + '</div>';
+    if (currentPlaylistFadeBetweenSlides && typeof renderSlideMarkup === 'function') {
+      renderSlideMarkup(markup, true);
+      return;
+    }
+    app.innerHTML = markup;
   }
 
   // Announce the player to the command websocket.
@@ -204,10 +183,19 @@
     showCurrent();
     refresh();
   } else {
+    if (initialPlaylistSnapshot && applyPlaylistSnapshot(initialPlaylistSnapshot)) {
+      currentPlaylistSkipUnavailableRtmp = Boolean(initialPlaylistSnapshot.skipUnavailableRtmp);
+      showCurrent();
+    }
     syncBlackoutState();
     refresh();
   }
   syncOfflineBanner();
   syncScreenWakeLock();
+  playlistRefreshTimer = window.setInterval(function () {
+    if (document.visibilityState !== 'hidden') {
+      refresh();
+    }
+  }, 60 * 1000);
   connectCommandSocket();
 </script>

src/player/public/css/player.css

@@ -22,21 +22,6 @@ body.onboarding-page #app {
   display: none;
 }
 
-body.thumbnail-preview *,
-body.thumbnail-preview *::before,
-body.thumbnail-preview *::after {
-  animation: none !important;
-  animation-delay: 0s !important;
-  animation-duration: 0s !important;
-  animation-iteration-count: 1 !important;
-  transition: none !important;
-}
-
-body.thumbnail-preview .player-announcement-layer,
-body.thumbnail-preview .player-offline-banner {
-  display: none !important;
-}
-
 #app {
   width: 100%;
   height: 100%;
@@ -47,6 +32,45 @@ body.thumbnail-preview .player-offline-banner {
   position: relative;
 }
 
+.api-progress {
+  --bs-progress-height: 1rem;
+  --bs-progress-font-size: 0.75rem;
+  --bs-border-radius: 0.375rem;
+  --bs-progress-border-radius: 0.375rem;
+  display: flex;
+  width: 100%;
+  box-sizing: border-box;
+  height: var(--bs-progress-height);
+  overflow: hidden;
+  font-size: var(--bs-progress-font-size);
+  border-radius: var(--bs-progress-border-radius);
+}
+
+.api-progress > .progress-bar {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  overflow: hidden;
+  color: #fff;
+  text-align: center;
+  white-space: nowrap;
+  background-color: #0d6efd;
+}
+
+.api-progress > .progress-bar-striped {
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-size: var(--bs-progress-height) var(--bs-progress-height);
+}
+
+.api-progress > .progress-bar-animated {
+  animation: api-progress-bar-stripes 1s linear infinite;
+}
+
+@keyframes api-progress-bar-stripes {
+  from { background-position-x: var(--bs-progress-height); }
+  to { background-position-x: 0; }
+}
+
 .onboarding-shell {
   min-height: 100%;
   display: flex;

src/player/public/js/player-page-animation.js

@@ -0,0 +1,253 @@
+// Region animation configuration and lifecycle helpers.
+
+function normalizePlayerAnimationConfig(value) {
+  var raw = value;
+  if (typeof raw === 'string') {
+    var text = String(raw || '').trim();
+    if (!text) {
+      raw = null;
+    } else {
+      try {
+        raw = JSON.parse(text);
+      } catch (_error) {
+        raw = null;
+      }
+    }
+  }
+
+  if (!raw || typeof raw !== 'object' || Array.isArray(raw)) {
+    raw = {};
+  }
+
+  return {
+    intro: normalizePlayerAnimationStep(raw.intro, 'none'),
+    outro: normalizePlayerAnimationStep(raw.outro !== undefined ? raw.outro : raw.out, 'none'),
+    loop: normalizePlayerAnimationStep(raw.loop, 'none')
+  };
+}
+
+function normalizePlayerAnimationStep(value, fallbackPreset) {
+  if (value && typeof value === 'object' && !Array.isArray(value)) {
+    return {
+      preset: String(value.preset || fallbackPreset || 'none').trim(),
+      duration_ms: Number.isFinite(Number(value.duration_ms)) && Number(value.duration_ms) > 0 ? Math.round(Number(value.duration_ms)) : null,
+      delay_ms: Number.isFinite(Number(value.delay_ms)) && Number(value.delay_ms) >= 0 ? Math.round(Number(value.delay_ms)) : null,
+      iterations: Number.isFinite(Number(value.iterations)) && Number(value.iterations) > 0 ? Math.round(Number(value.iterations)) : null
+    };
+  }
+
+  return {
+    preset: String(typeof value === 'string' ? value : fallbackPreset || 'none').trim(),
+    duration_ms: null,
+    delay_ms: null,
+    iterations: null
+  };
+}
+
+function getAnimationStepTimingMs(step) {
+  if (!step) {
+    return 0;
+  }
+
+  var preset = String(step.preset || 'none').trim();
+  if (!preset || preset === 'none') {
+    return 0;
+  }
+
+  var durationMs = Number(step.duration_ms);
+  if (!Number.isFinite(durationMs) || durationMs <= 0) {
+    durationMs = 1000;
+  }
+
+  var delayMs = Number(step.delay_ms);
+  if (!Number.isFinite(delayMs) || delayMs < 0) {
+    delayMs = 0;
+  }
+
+  var iterations = Number(step.iterations);
+  if (!Number.isFinite(iterations) || iterations < 1) {
+    iterations = 1;
+  }
+
+  return delayMs + (durationMs * iterations);
+}
+
+function getRegionAnimationPhaseTimings(root, phase) {
+  if (!root) {
+    return [];
+  }
+
+  var normalizedPhase = String(phase || 'intro').trim().toLowerCase();
+  if (normalizedPhase !== 'intro' && normalizedPhase !== 'outro') {
+    normalizedPhase = 'intro';
+  }
+
+  var timings = [];
+  Array.prototype.forEach.call(root.querySelectorAll('[data-animation-json]'), function (element) {
+    if (!element) {
+      return;
+    }
+
+    var config;
+    try {
+      config = normalizePlayerAnimationConfig(element.getAttribute('data-animation-json') || '{}');
+    } catch (_error) {
+      config = null;
+    }
+
+    if (!config) {
+      return;
+    }
+
+    var timingMs = getAnimationStepTimingMs(normalizedPhase === 'outro' ? config.outro : config.intro);
+    if (timingMs > 0) {
+      timings.push({
+        element: element,
+        timingMs: timingMs
+      });
+    }
+  });
+
+  return timings;
+}
+
+function getRegionAnimationPhaseTimingMs(root, phase) {
+  return getRegionAnimationPhaseTimings(root, phase).reduce(function (maxTimingMs, entry) {
+    return Math.max(maxTimingMs, Number(entry && entry.timingMs || 0));
+  }, 0);
+}
+
+function clearRegionAnimationClasses(root) {
+  if (!root) {
+    return;
+  }
+
+  var elements = [];
+  if (typeof root.matches === 'function' && root.matches('[data-animation-json]')) {
+    elements.push(root);
+  }
+  Array.prototype.forEach.call(root.querySelectorAll('[data-animation-json]'), function (element) {
+    elements.push(element);
+  });
+
+  elements.forEach(function (element) {
+    if (!element) {
+      return;
+    }
+    element.classList.remove('animate__animated', 'animate__infinite');
+    element.classList.remove('animate__repeat-1', 'animate__repeat-2', 'animate__repeat-3');
+    Array.prototype.slice.call(element.classList || []).forEach(function (className) {
+      if (String(className || '').indexOf('animate__') === 0) {
+        element.classList.remove(className);
+      }
+    });
+    element.style.removeProperty('--animate-duration');
+    element.style.removeProperty('--animate-delay');
+    element.style.removeProperty('--animate-repeat');
+  });
+}
+
+function isAttentionSeekerAnimation(preset) {
+  return ['bounce', 'flash', 'pulse', 'rubberBand', 'shakeX', 'shakeY', 'headShake', 'swing', 'tada', 'wobble', 'jello', 'heartBeat'].indexOf(String(preset || '').trim()) !== -1;
+}
+
+function applyAnimationStep(element, step, phase) {
+  if (!element || !step) {
+    return;
+  }
+
+  var preset = String(step.preset || 'none').trim();
+  if (!preset || preset === 'none') {
+    return;
+  }
+
+  element.classList.add('animate__animated', 'animate__' + preset);
+  element.style.setProperty('--animate-duration', String(Math.max(1, Number(step.duration_ms || 0) || 1000)) + 'ms');
+  if (Number(step.delay_ms || 0) > 0) {
+    element.style.setProperty('--animate-delay', String(Math.max(0, Number(step.delay_ms || 0))) + 'ms');
+  } else {
+    element.style.removeProperty('--animate-delay');
+  }
+
+  if (phase === 'loop') {
+    var repeatCount = Number(step.iterations);
+    if (!Number.isFinite(repeatCount) || repeatCount < 1) {
+      repeatCount = 1;
+    }
+    if (repeatCount > 1) {
+      element.classList.add('animate__repeat-1');
+    }
+    element.style.setProperty('--animate-repeat', String(repeatCount));
+    return;
+  }
+
+  if (isAttentionSeekerAnimation(preset) && Number(step.iterations || 0) > 1) {
+    element.style.setProperty('--animate-repeat', String(Math.max(1, Number(step.iterations || 1))));
+  }
+}
+
+function playRegionAnimation(element, phase) {
+  if (!element) {
+    return;
+  }
+
+  var normalizedPhase = String(phase || 'intro').trim().toLowerCase();
+  if (normalizedPhase !== 'intro' && normalizedPhase !== 'outro') {
+    normalizedPhase = 'intro';
+  }
+
+  var config;
+  try {
+    config = normalizePlayerAnimationConfig(element.getAttribute('data-animation-json') || '{}');
+  } catch (_error) {
+    config = null;
+  }
+
+  if (!config) {
+    return;
+  }
+
+  element.dataset.animationPhase = normalizedPhase;
+  clearRegionAnimationClasses(element);
+
+  if (normalizedPhase === 'outro') {
+    applyAnimationStep(element, config.outro, 'outro');
+    return;
+  }
+
+  if (config.intro && String(config.intro.preset || '').trim() && String(config.intro.preset || '').trim() !== 'none') {
+    applyAnimationStep(element, config.intro, 'intro');
+    if (config.loop && String(config.loop.preset || '').trim() && String(config.loop.preset || '').trim() !== 'none') {
+      element.addEventListener('animationend', function handleAnimationEnd(event) {
+        if (event.target !== element) {
+          return;
+        }
+        if (String(element.dataset.animationPhase || '').trim() !== 'intro') {
+          return;
+        }
+        element.removeEventListener('animationend', handleAnimationEnd);
+        clearRegionAnimationClasses(element);
+        applyAnimationStep(element, config.loop, 'loop');
+      });
+    }
+    return;
+  }
+
+  applyAnimationStep(element, config.loop, 'loop');
+}
+
+function playRegionAnimations(root, phase) {
+  if (!root) {
+    return;
+  }
+
+  var normalizedPhase = String(phase || 'intro').trim().toLowerCase();
+  if (normalizedPhase !== 'intro' && normalizedPhase !== 'outro') {
+    normalizedPhase = 'intro';
+  }
+
+  var elements = Array.prototype.slice.call(root.querySelectorAll('[data-animation-json]'));
+  elements.forEach(function (element) {
+    playRegionAnimation(element, normalizedPhase);
+  });
+}

src/player/public/js/player-page-commands.js

@@ -6,7 +6,7 @@ function getCurrentViewport() {
   };
 }
 
-var slideOutroTimers = [];
+var commandHeartbeatTimer = null;
 
 // Command websocket and player-state helpers.
 // Send the current playback state to the command websocket.
@@ -61,103 +61,6 @@ function scheduleViewportRenderUpdate() {
   }, 150);
 }
 
-// Cancel the current slide-advance timer.
-function clearSlideTimer() {
-  if (timer) {
-    window.clearTimeout(timer);
-    timer = null;
-  }
-  clearSlideOutroTimer();
-}
-
-// Cancel any pending outro triggers for the current slide.
-function clearSlideOutroTimer() {
-  if (!Array.isArray(slideOutroTimers) || !slideOutroTimers.length) {
-    slideOutroTimers = [];
-    return;
-  }
-
-  slideOutroTimers.forEach(function (timerId) {
-    window.clearTimeout(timerId);
-  });
-  slideOutroTimers = [];
-}
-
-// Return the rendered slide root that is currently on screen.
-function getCurrentSlideRoot() {
-  var shells = Array.prototype.slice.call(app ? app.querySelectorAll('.slide-shell') : []);
-  if (shells.length) {
-    return shells[shells.length - 1];
-  }
-  return app && app.firstElementChild ? app.firstElementChild : app;
-}
-
-// Schedule the outgoing slide animation for each region so it finishes before removal.
-function scheduleSlideOutro(holdDelayMs) {
-  clearSlideOutroTimer();
-
-  var currentRoot = getCurrentSlideRoot();
-  if (!currentRoot || typeof getRegionAnimationPhaseTimings !== 'function' || typeof playRegionAnimation !== 'function') {
-    return;
-  }
-
-  var regionTimings = getRegionAnimationPhaseTimings(currentRoot, 'outro');
-  if (!regionTimings.length) {
-    return;
-  }
-
-  var slideDurationMs = Math.max(1, Math.round(Number(holdDelayMs || 0)));
-  slideOutroTimers = regionTimings.map(function (entry) {
-    var timingMs = Math.max(0, Math.round(Number(entry && entry.timingMs || 0)));
-    var triggerDelayMs = Math.max(0, slideDurationMs - timingMs);
-    return window.setTimeout(function () {
-      if (!entry || !entry.element || !entry.element.isConnected) {
-        return;
-      }
-      playRegionAnimation(entry.element, 'outro');
-    }, triggerDelayMs);
-  });
-}
-
-// Schedule the next slide transition.
-function scheduleSlideAdvance(delayMs) {
-  clearSlideTimer();
-  var holdDelayMs = Math.max(1, Number(delayMs || 0));
-  slideExpiresAt = Date.now() + holdDelayMs;
-  scheduleSlideOutro(holdDelayMs);
-  timer = window.setTimeout(function () {
-    timer = null;
-    slideExpiresAt = null;
-    pausedRemainingMs = null;
-    clearSlideOutroTimer();
-    applyPendingPlaylistUpdate();
-    const activeSlides = getCurrentActiveSlides();
-    if (activeSlides.length < 2) {
-      showCurrent();
-      return;
-    }
-    if (index >= activeSlides.length) {
-      index = 0;
-    }
-    index = (index + 1) % activeSlides.length;
-    showCurrent();
-  }, holdDelayMs);
-}
-
-// Return the slide duration without shifting it for fade timing.
-function getSlideHoldDelay(delayMs) {
-  var holdDelayMs = Math.max(1, Number(delayMs || 0));
-  return holdDelayMs;
-}
-
-// Cancel any pending fade-transition cleanup.
-function clearSlideTransitionTimer() {
-  if (slideTransitionTimer) {
-    window.clearTimeout(slideTransitionTimer);
-    slideTransitionTimer = null;
-  }
-}
-
 function getPlayerRegionModules() {
   if (!window.pulsePlayerRegionTypes || typeof window.pulsePlayerRegionTypes.list !== 'function') {
     return [];
@@ -166,19 +69,11 @@ function getPlayerRegionModules() {
   return window.pulsePlayerRegionTypes.list();
 }
 
-function isThumbnailPreview() {
-  return Boolean(window.__pulseThumbnailPreview);
-}
-
 function runRegionLifecycle(root, lifecycleName) {
   if (!root) {
     return;
   }
 
-  if (isThumbnailPreview() && lifecycleName === 'initRegion') {
-    return;
-  }
-
   getPlayerRegionModules().forEach(function (entry) {
     var module = entry && entry.definition ? entry.definition : null;
     if (!module || typeof module[lifecycleName] !== 'function') {
@@ -202,65 +97,11 @@ function initializeRegionInstances(root) {
 }
 
 // Swap slide markup with optional fade animation.
-function renderSlideMarkup(markup, shouldFade) {
+function renderSlideMarkup(markup, shouldFade, mediaDelayMs) {
   clearSlideTransitionTimer();
   destroyRegionInstances(app);
-  if (typeof destroyRtmpRegions === 'function') {
-    destroyRtmpRegions(app);
-  }
-
-  function initializeRenderedVideoPlayback(root, delayMs) {
-    if (!root) {
-      return;
-    }
-
-    var startDelayMs = Math.max(0, Number(delayMs || 0));
-    var videos = root.querySelectorAll('.template-region.video video');
-    Array.prototype.forEach.call(videos, function (video) {
-      if (!video) {
-        return;
-      }
-
-      var playbackScheduled = false;
-
-      video.autoplay = true;
-      video.loop = true;
-  video.muted = !(video.dataset && video.dataset.disableAudio === '0');
-      video.playsInline = true;
-
-      function startPlayback() {
-        var playPromise = video.play && video.play();
-        if (playPromise && typeof playPromise.catch === 'function') {
-          playPromise.catch(function () {
-            return null;
-          });
-        }
-      }
-
-      function schedulePlaybackStart() {
-        if (playbackScheduled) {
-          return;
-        }
-        playbackScheduled = true;
-        if (startDelayMs > 0) {
-          window.setTimeout(startPlayback, startDelayMs);
-          return;
-        }
-        startPlayback();
-      }
-
-      if (video.readyState >= 2) {
-        schedulePlaybackStart();
-        return;
-      }
-
-      video.addEventListener('canplay', schedulePlaybackStart, { once: true });
-      video.addEventListener('loadedmetadata', function () {
-        if (video.readyState >= 2) {
-          schedulePlaybackStart();
-        }
-      }, { once: true });
-    });
+  if (typeof destroySlideMedia === 'function') {
+    destroySlideMedia(app);
   }
 
   function schedulePostRenderSetup(root, delayMs) {
@@ -272,16 +113,11 @@ function renderSlideMarkup(markup, shouldFade) {
       return;
     }
 
-    if (typeof syncRtmpRegions === 'function') {
-      syncRtmpRegions(root);
+    initializeRegionInstances(root);
+    if (typeof initializeSlideMedia === 'function') {
+      initializeSlideMedia(root, delayMs);
     }
 
-    if (!isThumbnailPreview()) {
-      initializeRegionInstances(root);
-    }
-
-    initializeRenderedVideoPlayback(root, delayMs);
-
     if (typeof playRegionAnimations === 'function') {
       playRegionAnimations(root, 'intro');
     }
@@ -307,52 +143,37 @@ function renderSlideMarkup(markup, shouldFade) {
     });
   }
 
-  function pauseRenderedVideoPlayback(root, delayMs) {
-    if (!root) {
-      return;
-    }
-
-    var pauseDelayMs = Math.max(0, Number(delayMs || 0));
-    var videos = root.querySelectorAll('.template-region.video video, .slide-media video');
-    Array.prototype.forEach.call(videos, function (video) {
-      if (!video || typeof video.pause !== 'function') {
-        return;
-      }
-
-      window.setTimeout(function () {
-        try {
-          video.pause();
-        } catch (_error) {
-          // Ignore pause errors from detached or unsupported media elements.
-        }
-      }, pauseDelayMs);
-    });
-  }
-
   var nextShell = document.createElement('div');
-  nextShell.className = 'slide-shell';
+  nextShell.className = 'slide-shell slide-shell-entering';
+  nextShell.style.zIndex = '0';
   nextShell.style.opacity = '0';
   nextShell.innerHTML = markup;
 
   if (!previousShell || (previousShell.classList && previousShell.classList.contains('empty'))) {
     app.innerHTML = '';
     nextShell.style.opacity = '1';
+    nextShell.classList.remove('slide-shell-entering');
+    nextShell.classList.add('is-visible');
     app.appendChild(nextShell);
-    schedulePostRenderSetup(nextShell, slideFadeDurationMs / 2);
+    schedulePostRenderSetup(nextShell, mediaDelayMs === undefined ? slideFadeOffsetMs : mediaDelayMs);
     return nextShell;
   }
 
   if (!previousShell.classList.contains('slide-shell')) {
     previousShell.classList.add('slide-shell');
   }
+  previousShell.classList.remove('is-visible');
+  previousShell.classList.add('is-exiting');
+  previousShell.style.zIndex = '1';
   previousShell.style.opacity = '1';
-  pauseRenderedVideoPlayback(previousShell, slideFadeDurationMs / 2);
 
   app.appendChild(nextShell);
   window.requestAnimationFrame(function () {
     nextShell.style.opacity = '1';
     previousShell.style.opacity = '0';
-    schedulePostRenderSetup(nextShell, slideFadeDurationMs / 2);
+    nextShell.classList.remove('slide-shell-entering');
+    nextShell.classList.add('is-visible');
+    schedulePostRenderSetup(nextShell, mediaDelayMs === undefined ? slideFadeOffsetMs : mediaDelayMs);
   });
 
   slideTransitionTimer = window.setTimeout(function () {
@@ -360,10 +181,13 @@ function renderSlideMarkup(markup, shouldFade) {
       previousShell.parentNode.removeChild(previousShell);
     }
     if (nextShell) {
+      nextShell.style.zIndex = '1';
       nextShell.style.opacity = '1';
+      nextShell.classList.remove('slide-shell-entering');
+      nextShell.classList.add('is-visible');
     }
     slideTransitionTimer = null;
-  }, slideFadeDurationMs);
+  }, slideFadeLengthMs);
 
   return nextShell;
 }
@@ -537,14 +361,28 @@ function handleCommandMessage(rawMessage) {
     handleClientIdConflict();
     return;
   }
+  if (payload && payload.type === 'client-name-updated') {
+    if (payload.clientName) {
+      applyOnboardingClientName(payload.clientName, commandSocket);
+    }
+    return;
+  }
 
   if (!payload || payload.type !== 'command') {
     return;
   }
 
+  if (payload.requestId && commandSocket && commandSocket.readyState === WebSocket.OPEN) {
+    commandSocket.send(JSON.stringify({
+      type: 'command-ack',
+      requestId: payload.requestId,
+      ok: true
+    }));
+  }
+
   switch (payload.command) {
     case 'refresh':
-      refresh();
+      refresh(true);
       return;
     case 'setclientname':
       if (payload.clientName) {
@@ -602,7 +440,6 @@ function handleCommandMessage(rawMessage) {
 function handleClientIdConflict() {
   var replacementClientId = regenerateCommandClientId();
   var onboardingUrl = new URL('/', window.location.origin);
-  onboardingUrl.searchParams.set('clientId', replacementClientId);
   window.location.replace(onboardingUrl.toString());
 }
 
@@ -629,6 +466,12 @@ function connectCommandSocket() {
   commandSocket = socket;
 
   socket.onopen = function () {
+    if (commandHeartbeatTimer) {
+      window.clearInterval(commandHeartbeatTimer);
+    }
+    commandHeartbeatTimer = window.setInterval(function () {
+      sendCommandState(lastRenderedSlide);
+    }, 60 * 1000);
     if (typeof syncOnboardingClientNameFromServer === 'function') {
       syncOnboardingClientNameFromServer(socket).then(function () {
         sendCommandState(socket);
@@ -643,6 +486,13 @@ function connectCommandSocket() {
   };
 
   socket.onclose = function (event) {
+    if (typeof logDebug === 'function') {
+      logDebug('Command websocket closed.', 'code=' + String(event && event.code || '') + ' reason=' + String(event && event.reason || ''), 'warn');
+    }
+    if (commandHeartbeatTimer) {
+      window.clearInterval(commandHeartbeatTimer);
+      commandHeartbeatTimer = null;
+    }
     commandSocket = null;
     if (event && event.code === 4009) {
       handleClientIdConflict();
@@ -651,7 +501,10 @@ function connectCommandSocket() {
     scheduleCommandReconnect();
   };
 
-  socket.onerror = function () {
+  socket.onerror = function (error) {
+    if (typeof logDebug === 'function') {
+      logDebug('Command websocket error.', error && error.message ? String(error.message) : 'Websocket transport error.', 'error');
+    }
     try {
       socket.close();
     } catch (_error) {

src/player/public/js/player-page-media.js

@@ -0,0 +1,94 @@
+// Slide media startup and teardown helpers.
+
+function initializeRenderedVideoPlayback(root, delayMs) {
+  if (!root) {
+    return;
+  }
+
+  var startDelayMs = Math.max(0, Number(delayMs || 0));
+  var videos = root.querySelectorAll('.template-region.video video');
+  Array.prototype.forEach.call(videos, function (video) {
+    if (!video) {
+      return;
+    }
+
+    var playbackScheduled = false;
+
+    video.autoplay = false;
+    video.loop = !(video.dataset && video.dataset.loop === '0');
+    video.muted = !(video.dataset && video.dataset.disableAudio === '0');
+    video.playsInline = true;
+
+    function startPlayback() {
+      var playPromise = video.play && video.play();
+      if (playPromise && typeof playPromise.catch === 'function') {
+        playPromise.catch(function () {
+          return null;
+        });
+      }
+    }
+
+    function schedulePlaybackStart() {
+      if (playbackScheduled) {
+        return;
+      }
+      playbackScheduled = true;
+      if (startDelayMs > 0) {
+        window.setTimeout(startPlayback, startDelayMs);
+        return;
+      }
+      startPlayback();
+    }
+
+    if (video.readyState >= 2) {
+      schedulePlaybackStart();
+      return;
+    }
+
+    video.addEventListener('canplay', schedulePlaybackStart, { once: true });
+    video.addEventListener('loadedmetadata', function () {
+      if (video.readyState >= 2) {
+        schedulePlaybackStart();
+      }
+    }, { once: true });
+  });
+}
+
+function pauseRenderedVideoPlayback(root, delayMs) {
+  if (!root) {
+    return;
+  }
+
+  var pauseDelayMs = Math.max(0, Number(delayMs || 0));
+  var videos = root.querySelectorAll('.template-region.video video, .slide-media video');
+  Array.prototype.forEach.call(videos, function (video) {
+    if (!video || typeof video.pause !== 'function') {
+      return;
+    }
+
+    window.setTimeout(function () {
+      try {
+        video.pause();
+      } catch (_error) {
+        return null;
+      }
+    }, pauseDelayMs);
+  });
+}
+
+function initializeSlideMedia(root, delayMs) {
+  if (!root || root.isConnected === false) {
+    return;
+  }
+
+  if (typeof syncRtmpRegions === 'function') {
+    syncRtmpRegions(root);
+  }
+  initializeRenderedVideoPlayback(root, delayMs);
+}
+
+function destroySlideMedia(root) {
+  if (typeof destroyRtmpRegions === 'function') {
+    destroyRtmpRegions(root);
+  }
+}

src/player/public/js/player-page-offline.js

@@ -1,8 +1,5 @@
 // Show or hide the offline status banner.
 function setOfflineBannerVisible(visible, message) {
-  if (window.__pulseThumbnailPreview) {
-    return;
-  }
   var normalizedVisible = Boolean(visible);
   var bannerMessage = String(message || 'Offline mode: using cached playlist.').trim();
   if (normalizedVisible) {
@@ -41,9 +38,6 @@ function setOfflineBannerVisible(visible, message) {
 
 // Update the offline banner based on connectivity or playlist availability.
 function syncOfflineBanner() {
-  if (window.__pulseThumbnailPreview) {
-    return;
-  }
   if (!window.navigator.onLine) {
     setOfflineBannerVisible(true, 'Offline mode: using cached playlist.');
     return;
@@ -63,9 +57,6 @@ function clearRefreshRetry() {
 
 // Retry playlist refresh with a short backoff while the player is offline.
 function scheduleRefreshRetry() {
-  if (window.__pulseThumbnailPreview) {
-    return;
-  }
   if (refreshRetryTimer) {
     return;
   }

src/player/public/js/player-page-playback.js

@@ -1,5 +1,5 @@
 // Render the slide at the requested index within the active set.
-async function renderSlideAtIndex(sourceSlides, targetIndex) {
+async function renderSlideAtIndex(sourceSlides, targetIndex, options) {
   const availableSlides = Array.isArray(sourceSlides) ? sourceSlides : [];
   if (!availableSlides.length) {
     renderEmpty(slides.length ? 'No slides are scheduled for this time.' : 'No slides assigned to this screen yet.');
@@ -53,18 +53,34 @@ async function renderSlideAtIndex(sourceSlides, targetIndex) {
 
   index = currentIndex;
   var markup = buildSlideMarkup(slide);
-  renderSlideMarkup(markup, currentPlaylistFadeBetweenSlides);
+  var shouldFade = !(options && options.skipFade) && currentPlaylistFadeBetweenSlides;
+  var mediaDelayMs = slide && slide.use_video_duration ? 0 : undefined;
+  renderSlideMarkup(markup, shouldFade, mediaDelayMs);
   if (typeof scheduleSlideMarkupPreload === 'function') {
     scheduleSlideMarkupPreload(availableSlides, currentIndex);
   }
   sendCommandState(slide);
   if (!isPaused) {
-    scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(slide.duration_seconds || 10)) * 1000));
+    scheduleSlideAdvance(getSlideAdvanceDelay(slide));
   }
   lastRenderedViewKey = getCurrentRenderKey(availableSlides);
   return true;
 }
 
+// Calculate the configured time from slide entry to the next transition.
+function getSlideAdvanceDelay(slide) {
+  var durationMs = Math.max(1, Number(slide && slide.duration_seconds || 10)) * 1000;
+  if (slide && slide.use_video_duration) {
+    return currentPlaylistFadeBetweenSlides
+      ? getSlideHoldDelay(Math.max(1, durationMs - slideFadeLengthMs))
+      : getSlideHoldDelay(durationMs);
+  }
+  if (currentPlaylistFadeBetweenSlides) {
+    return getSlideHoldDelay(Math.max(1, durationMs - slideFadeOffsetMs));
+  }
+  return getSlideHoldDelay(durationMs);
+}
+
 // Promote a deferred playlist update at the next safe point.
 function applyPendingPlaylistUpdate() {
   if (!pendingPlaylistUpdate) {
@@ -91,7 +107,7 @@ function applyPendingPlaylistUpdate() {
 }
 
 // Render the current active slide or the empty state.
-function showCurrent() {
+function showCurrent(options) {
   clearSlideTimer();
   const activeSlides = getCurrentActiveSlides();
   syncWebpagePreloads(activeSlides, index);
@@ -106,7 +122,7 @@ function showCurrent() {
     lastRenderedViewKey = getCurrentRenderKey(activeSlides);
     return;
   }
-  void renderSlideAtIndex(activeSlides, index);
+  void renderSlideAtIndex(activeSlides, index, options);
   lastRenderedViewKey = getCurrentRenderKey(activeSlides);
 }
 
@@ -148,7 +164,7 @@ function handleRtmpPlaybackFailure(message, options) {
 }
 
 // Fetch the latest playlist and queue any updates.
-function refresh() {
+function refresh(applyImmediately) {
   var request = new XMLHttpRequest();
   var url = window.location.origin + '/api/screens/' + encodeURIComponent(slug) + '/playlist?ts=' + Date.now();
   request.open('GET', url, true);
@@ -167,10 +183,16 @@ function refresh() {
       return;
     }
     if (request.status === 304) {
+      if (!initialData || !Array.isArray(initialData.apiSources) || !Array.isArray(initialData.weatherLocations)) {
+        currentPlaylistEtag = '';
+        refresh(applyImmediately);
+        return;
+      }
+      logDebug('Playlist refresh completed with no changes.');
       markRefreshHealthy();
       setOfflineBannerVisible(false);
       if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
-          scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
+          scheduleSlideAdvance(getSlideAdvanceDelay(lastRenderedSlide));
       }
       return;
     }
@@ -192,10 +214,12 @@ function refresh() {
       const responseEtag = String(request.getResponseHeader('ETag') || '').trim();
       const data = JSON.parse(request.responseText || '{}');
       const nextSignature = getPlaylistRevision(data);
+      logDebug('Playlist refresh completed.', 'Revision: ' + nextSignature);
       const nextSlides = Array.isArray(data.slides) ? data.slides.map(normalizeSlide) : [];
       const nextActiveSlides = getActiveSlidesFrom(nextSlides);
       const nextFadeBetweenSlides = Boolean(data && data.playlist && data.playlist.fade_between_slides);
       const nextSkipUnavailableRtmp = Boolean(data && data.playlist && data.playlist.skip_unavailable_rtmp);
+      const hadSourceData = !(typeof window !== 'undefined' && window.initialData === null);
       var refreshedInitialData = Object.assign({},
         typeof initialData !== 'undefined' && initialData ? initialData : (window.initialData || {}), {
         screen: data.screen || null,
@@ -211,6 +235,11 @@ function refresh() {
         initialData = refreshedInitialData;
       }
       window.initialData = refreshedInitialData;
+      if (!hadSourceData) {
+        slideMarkupCache = Object.create(null);
+        templateLayoutCache = Object.create(null);
+        templateRenderPlanCache = Object.create(null);
+      }
       savePlaylistSnapshot({
         slides: nextSlides,
         signature: nextSignature,
@@ -235,8 +264,12 @@ function refresh() {
         return;
       }
       if (nextSignature === currentPlaylistSignature || (pendingPlaylistUpdate && nextSignature === pendingPlaylistUpdate.signature)) {
+        if (!hadSourceData) {
+          showCurrent({ skipFade: true });
+          return;
+        }
         if (currentActiveSlides.length < 2 && lastRenderedSlide) {
-          scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
+            scheduleSlideAdvance(getSlideAdvanceDelay(lastRenderedSlide));
         }
         return;
       }
@@ -254,6 +287,11 @@ function refresh() {
           fadeBetweenSlides: nextFadeBetweenSlides,
           skipUnavailableRtmp: nextSkipUnavailableRtmp
         };
+        if (applyImmediately) {
+          applyPendingPlaylistUpdate();
+          showCurrent();
+          return;
+        }
         if (!isSlideInList(lastRenderedSlide, nextSlides)) {
           applyPendingPlaylistUpdate();
           showCurrent();
@@ -268,6 +306,11 @@ function refresh() {
         fadeBetweenSlides: nextFadeBetweenSlides,
         skipUnavailableRtmp: nextSkipUnavailableRtmp
       };
+      if (applyImmediately) {
+        applyPendingPlaylistUpdate();
+        showCurrent();
+        return;
+      }
       logDebug('Playlist update detected; applying on next slide transition.');
     } catch (_error) {
       logDebug(
@@ -288,7 +331,7 @@ function refresh() {
       setOfflineBannerVisible(true);
       scheduleRefreshRetry();
     if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
-      scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
+        scheduleSlideAdvance(getSlideAdvanceDelay(lastRenderedSlide));
     }
   };
   request.ontimeout = function () {
@@ -300,7 +343,7 @@ function refresh() {
     setOfflineBannerVisible(true);
     scheduleRefreshRetry();
     if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
-      scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
+        scheduleSlideAdvance(getSlideAdvanceDelay(lastRenderedSlide));
     }
   };
   request.send();

src/player/public/js/player-page-playlist.js

@@ -129,10 +129,6 @@ function getSlideMarkupPreloadSlides(sourceSlides, targetIndex) {
 }
 
 function scheduleSlideMarkupPreload(sourceSlides, targetIndex) {
-  if (window.__pulseThumbnailPreview) {
-    return;
-  }
-
   const preloadSlides = getSlideMarkupPreloadSlides(sourceSlides, targetIndex);
   if (!preloadSlides.length || typeof primeSlideMarkup !== 'function') {
     return;
@@ -236,6 +232,7 @@ function loadPlaylistSnapshot() {
       slides: parsed.slides.map(normalizeSlide),
       signature: String(parsed.signature || ''),
       fadeBetweenSlides: Boolean(parsed.fadeBetweenSlides),
+      skipUnavailableRtmp: Boolean(parsed.skipUnavailableRtmp),
       etag: String(parsed.etag || '')
     };
   } catch (_error) {

src/player/public/js/player-page-rendering.js

@@ -12,12 +12,10 @@ function normalizeStyleAttributeValue(value) {
     .replace(/'/g, "'");
 }
 
-// Clamp font size to the supported range.
 function sanitizeFontSize(value) {
   return Math.max(8, Number(value || 0) || 24);
 }
 
-// Validate a text color and fall back when needed.
 function sanitizeTextColor(value, fallback) {
   var raw = String(value || '').trim();
   if (/^#[0-9a-fA-F]{6}$/.test(raw) || /^#[0-9a-fA-F]{3}$/.test(raw)) {
@@ -26,7 +24,6 @@ function sanitizeTextColor(value, fallback) {
   return fallback || '#000000';
 }
 
-// Read the template's canvas dimensions with safe defaults.
 function getTemplateCanvasSize(template) {
   return {
     width: Math.max(1, Number(template.canvas_size_width || 1920)),
@@ -34,7 +31,6 @@ function getTemplateCanvasSize(template) {
   };
 }
 
-// Read the server-supplied playlist revision, or fall back to the ETag.
 function getPlaylistRevision(data) {
   if (data && data.revision) {
     return String(data.revision);
@@ -48,7 +44,6 @@ function getPlaylistRevision(data) {
   return String(Date.now());
 }
 
-// Scale a canvas to fit within the viewport.
 function fitCanvasSize(canvasWidth, canvasHeight, maxWidth, maxHeight) {
   var width = Math.max(1, Number(canvasWidth || 0) || 1920);
   var height = Math.max(1, Number(canvasHeight || 0) || 1080);
@@ -61,53 +56,10 @@ function fitCanvasSize(canvasWidth, canvasHeight, maxWidth, maxHeight) {
   };
 }
 
-function normalizePlayerAnimationStep(value, fallbackPreset) {
-  if (value && typeof value === 'object' && !Array.isArray(value)) {
-    return {
-      preset: String(value.preset || fallbackPreset || 'none').trim(),
-      duration_ms: Number.isFinite(Number(value.duration_ms)) && Number(value.duration_ms) > 0 ? Math.round(Number(value.duration_ms)) : null,
-      delay_ms: Number.isFinite(Number(value.delay_ms)) && Number(value.delay_ms) >= 0 ? Math.round(Number(value.delay_ms)) : null,
-      iterations: Number.isFinite(Number(value.iterations)) && Number(value.iterations) > 0 ? Math.round(Number(value.iterations)) : null
-    };
-  }
-
-  return {
-    preset: String(typeof value === 'string' ? value : fallbackPreset || 'none').trim(),
-    duration_ms: null,
-    delay_ms: null,
-    iterations: null
-  };
-}
-
-function normalizePlayerAnimationConfig(value) {
-  var raw = value;
-  if (typeof raw === 'string') {
-    var text = String(raw || '').trim();
-    if (!text) {
-      raw = null;
-    } else {
-      try {
-        raw = JSON.parse(text);
-      } catch (_error) {
-        raw = null;
-      }
-    }
-  }
-
-  if (!raw || typeof raw !== 'object' || Array.isArray(raw)) {
-    raw = {};
-  }
-
-  return {
-    intro: normalizePlayerAnimationStep(raw.intro, 'none'),
-    outro: normalizePlayerAnimationStep(raw.outro !== undefined ? raw.outro : raw.out, 'none'),
-    loop: normalizePlayerAnimationStep(raw.loop, 'none')
-  };
-}
-
 function hasPlayerAnimation(config) {
   return Boolean(config && ['intro', 'outro', 'loop'].some(function (stepName) {
-    return String((config[stepName] && config[stepName].preset) || '').trim() && String((config[stepName] && config[stepName].preset) || '').trim() !== 'none';
+    var preset = String((config[stepName] && config[stepName].preset) || '').trim();
+    return preset && preset !== 'none';
   }));
 }
 
@@ -122,215 +74,6 @@ function decorateRegionMarkup(markup, region) {
   });
 }
 
-function clearRegionAnimationClasses(root) {
-  if (!root) {
-    return;
-  }
-
-  var elements = [];
-  if (typeof root.matches === 'function' && root.matches('[data-animation-json]')) {
-    elements.push(root);
-  }
-  Array.prototype.forEach.call(root.querySelectorAll('[data-animation-json]'), function (element) {
-    elements.push(element);
-  });
-
-  elements.forEach(function (element) {
-    if (!element) {
-      return;
-    }
-    element.classList.remove('animate__animated', 'animate__infinite');
-    element.classList.remove('animate__repeat-1', 'animate__repeat-2', 'animate__repeat-3');
-    Array.prototype.slice.call(element.classList || []).forEach(function (className) {
-      if (String(className || '').indexOf('animate__') === 0) {
-        element.classList.remove(className);
-      }
-    });
-    element.style.removeProperty('--animate-duration');
-    element.style.removeProperty('--animate-delay');
-    element.style.removeProperty('--animate-repeat');
-  });
-}
-
-function isAttentionSeekerAnimation(preset) {
-  return ['bounce', 'flash', 'pulse', 'rubberBand', 'shakeX', 'shakeY', 'headShake', 'swing', 'tada', 'wobble', 'jello', 'heartBeat'].indexOf(String(preset || '').trim()) !== -1;
-}
-
-function applyAnimationStep(element, step, phase) {
-  if (!element || !step) {
-    return;
-  }
-
-  var preset = String(step.preset || 'none').trim();
-  if (!preset || preset === 'none') {
-    return;
-  }
-
-  element.classList.add('animate__animated', 'animate__' + preset);
-  element.style.setProperty('--animate-duration', String(Math.max(1, Number(step.duration_ms || 0) || 1000)) + 'ms');
-  if (Number(step.delay_ms || 0) > 0) {
-    element.style.setProperty('--animate-delay', String(Math.max(0, Number(step.delay_ms || 0))) + 'ms');
-  } else {
-    element.style.removeProperty('--animate-delay');
-  }
-
-  if (phase === 'loop') {
-    var repeatCount = Number(step.iterations);
-    if (!Number.isFinite(repeatCount) || repeatCount < 1) {
-      repeatCount = 1;
-    }
-    if (repeatCount > 1) {
-      element.classList.add('animate__repeat-1');
-    }
-    element.style.setProperty('--animate-repeat', String(repeatCount));
-    return;
-  }
-
-  if (isAttentionSeekerAnimation(preset) && Number(step.iterations || 0) > 1) {
-    element.style.setProperty('--animate-repeat', String(Math.max(1, Number(step.iterations || 1))));
-  }
-}
-
-function getAnimationStepTimingMs(step) {
-  if (!step) {
-    return 0;
-  }
-
-  var preset = String(step.preset || 'none').trim();
-  if (!preset || preset === 'none') {
-    return 0;
-  }
-
-  var durationMs = Number(step.duration_ms);
-  if (!Number.isFinite(durationMs) || durationMs <= 0) {
-    durationMs = 1000;
-  }
-
-  var delayMs = Number(step.delay_ms);
-  if (!Number.isFinite(delayMs) || delayMs < 0) {
-    delayMs = 0;
-  }
-
-  var iterations = Number(step.iterations);
-  if (!Number.isFinite(iterations) || iterations < 1) {
-    iterations = 1;
-  }
-
-  return delayMs + (durationMs * iterations);
-}
-
-function getRegionAnimationPhaseTimingMs(root, phase) {
-  var timings = getRegionAnimationPhaseTimings(root, phase);
-  return timings.reduce(function (maxTimingMs, entry) {
-    return Math.max(maxTimingMs, Number(entry && entry.timingMs || 0));
-  }, 0);
-}
-
-function getRegionAnimationPhaseTimings(root, phase) {
-  if (!root || isThumbnailPreview()) {
-    return [];
-  }
-
-  var normalizedPhase = String(phase || 'intro').trim().toLowerCase();
-  if (normalizedPhase !== 'intro' && normalizedPhase !== 'outro') {
-    normalizedPhase = 'intro';
-  }
-
-  var timings = [];
-  Array.prototype.forEach.call(root.querySelectorAll('[data-animation-json]'), function (element) {
-    if (!element) {
-      return;
-    }
-
-    var config;
-    try {
-      config = normalizePlayerAnimationConfig(element.getAttribute('data-animation-json') || '{}');
-    } catch (_error) {
-      config = null;
-    }
-
-    if (!config) {
-      return;
-    }
-
-    var timingMs = getAnimationStepTimingMs(normalizedPhase === 'outro' ? config.outro : config.intro);
-    if (timingMs > 0) {
-      timings.push({
-        element: element,
-        timingMs: timingMs
-      });
-    }
-  });
-
-  return timings;
-}
-
-function playRegionAnimation(element, phase) {
-  if (!element || isThumbnailPreview()) {
-    return;
-  }
-
-  var normalizedPhase = String(phase || 'intro').trim().toLowerCase();
-  if (normalizedPhase !== 'intro' && normalizedPhase !== 'outro') {
-    normalizedPhase = 'intro';
-  }
-
-  var config;
-  try {
-    config = normalizePlayerAnimationConfig(element.getAttribute('data-animation-json') || '{}');
-  } catch (_error) {
-    config = null;
-  }
-
-  if (!config) {
-    return;
-  }
-
-  element.dataset.animationPhase = normalizedPhase;
-  clearRegionAnimationClasses(element);
-
-  if (normalizedPhase === 'outro') {
-    applyAnimationStep(element, config.outro, 'outro');
-    return;
-  }
-
-  if (config.intro && String(config.intro.preset || '').trim() && String(config.intro.preset || '').trim() !== 'none') {
-    applyAnimationStep(element, config.intro, 'intro');
-    if (config.loop && String(config.loop.preset || '').trim() && String(config.loop.preset || '').trim() !== 'none') {
-      element.addEventListener('animationend', function handleAnimationEnd(event) {
-        if (event.target !== element) {
-          return;
-        }
-        if (String(element.dataset.animationPhase || '').trim() !== 'intro') {
-          return;
-        }
-        element.removeEventListener('animationend', handleAnimationEnd);
-        clearRegionAnimationClasses(element);
-        applyAnimationStep(element, config.loop, 'loop');
-      });
-    }
-    return;
-  }
-
-  applyAnimationStep(element, config.loop, 'loop');
-}
-
-function playRegionAnimations(root, phase) {
-  if (!root || isThumbnailPreview()) {
-    return;
-  }
-
-  var normalizedPhase = String(phase || 'intro').trim().toLowerCase();
-  if (normalizedPhase !== 'intro' && normalizedPhase !== 'outro') {
-    normalizedPhase = 'intro';
-  }
-
-  var elements = Array.prototype.slice.call(root.querySelectorAll('[data-animation-json]'));
-  elements.forEach(function (element) {
-    playRegionAnimation(element, normalizedPhase);
-  });
-}
-
 function setPlayerCanvasDimensions(canvasWidth, canvasHeight) {
   if (!document || !document.documentElement) {
     return;
@@ -600,6 +343,13 @@ function normalizeSlide(slide) {
   Object.keys(content).forEach(function (regionKey) {
     normalized.content[regionKey] = normalizeContentValue(content[regionKey]);
   });
+  if (normalized.use_video_duration && normalized.template && Array.isArray(normalized.template.regions)) {
+    normalized.template.regions.forEach(function (region) {
+      if (region && region.region_type === 'video' && normalized.content[region.region_key]) {
+        normalized.content[region.region_key].loop = false;
+      }
+    });
+  }
   return normalized;
 }
 
@@ -797,7 +547,7 @@ function buildBackdropStyle(backgroundColor, backgroundImagePath, backgroundGrad
   var gradient = '';
   try {
     var gradientData = typeof backgroundGradient === 'string' ? JSON.parse(backgroundGradient) : backgroundGradient;
-    if (gradientData && gradientData.type === 'linear' && Array.isArray(gradientData.colors) && gradientData.colors.length >= 2) {
+    if (gradientData && gradientData.type === 'linear' && ((Array.isArray(gradientData.stops) && gradientData.stops.length >= 2) || (Array.isArray(gradientData.colors) && gradientData.colors.length >= 2))) {
       var stops = Array.isArray(gradientData.stops) ? gradientData.stops : (gradientData.colors || []).map(function (color, index, colors) { return { color: color, position: colors.length > 1 ? Math.round(index * 100 / (colors.length - 1)) : 0 }; });
       stops = stops.filter(function (stop) { return stop && /^#[0-9a-fA-F]{3,8}$/.test(String(stop.color || '').trim()); }).slice(0, 12);
       if (stops.length >= 2) {
@@ -975,7 +725,7 @@ function notifyVideoRegionSourceReady() {
   }
   slideMarkupCache = Object.create(null);
   if (typeof showCurrent === 'function' && slides && slides.length) {
-    showCurrent();
+    showCurrent({ skipFade: true });
   }
 }
 

src/player/public/js/player-page-transition.js

@@ -0,0 +1,104 @@
+// Slide transition timing, cancellation, and outgoing animation coordination.
+
+var slideOutroTimers = [];
+
+// Cancel the current slide-advance timer.
+function clearSlideTimer() {
+  if (timer) {
+    window.clearTimeout(timer);
+    timer = null;
+  }
+  clearSlideOutroTimer();
+}
+
+// Cancel any pending outro triggers for the current slide.
+function clearSlideOutroTimer() {
+  if (!Array.isArray(slideOutroTimers) || !slideOutroTimers.length) {
+    slideOutroTimers = [];
+    return;
+  }
+
+  slideOutroTimers.forEach(function (timerId) {
+    window.clearTimeout(timerId);
+  });
+  slideOutroTimers = [];
+}
+
+// Return the rendered slide root that is currently on screen.
+function getCurrentSlideRoot() {
+  var shells = Array.prototype.slice.call(app ? app.querySelectorAll('.slide-shell') : []);
+  if (shells.length) {
+    return shells[shells.length - 1];
+  }
+  return app && app.firstElementChild ? app.firstElementChild : app;
+}
+
+// Schedule the outgoing slide animation for each region so it finishes before removal.
+function scheduleSlideOutro(holdDelayMs) {
+  clearSlideOutroTimer();
+
+  var currentRoot = getCurrentSlideRoot();
+  if (!currentRoot || typeof getRegionAnimationPhaseTimings !== 'function' || typeof playRegionAnimation !== 'function') {
+    return;
+  }
+
+  var regionTimings = getRegionAnimationPhaseTimings(currentRoot, 'outro');
+  if (!regionTimings.length) {
+    return;
+  }
+
+  var slideDurationMs = Math.max(1, Math.round(Number(holdDelayMs || 0)));
+  slideOutroTimers = regionTimings.map(function (entry) {
+    var timingMs = Math.max(0, Math.round(Number(entry && entry.timingMs || 0)));
+    var triggerDelayMs = Math.max(0, slideDurationMs - timingMs);
+    return window.setTimeout(function () {
+      if (!entry || !entry.element || !entry.element.isConnected) {
+        return;
+      }
+      playRegionAnimation(entry.element, 'outro');
+    }, triggerDelayMs);
+  });
+}
+
+// Schedule the next slide transition.
+function scheduleSlideAdvance(delayMs) {
+  clearSlideTimer();
+  var holdDelayMs = Math.max(1, Number(delayMs || 0));
+  slideExpiresAt = Date.now() + holdDelayMs;
+  scheduleSlideOutro(holdDelayMs);
+  timer = window.setTimeout(function () {
+    timer = null;
+    slideExpiresAt = null;
+    pausedRemainingMs = null;
+    clearSlideOutroTimer();
+    applyPendingPlaylistUpdate();
+    const activeSlides = getCurrentActiveSlides();
+    if (activeSlides.length < 2) {
+      showCurrent();
+      return;
+    }
+    if (index >= activeSlides.length) {
+      index = 0;
+    }
+    index = (index + 1) % activeSlides.length;
+    showCurrent();
+  }, holdDelayMs);
+}
+
+// Return the configured slide duration without shifting it for fade timing.
+function getSlideHoldDelay(delayMs) {
+  return Math.max(1, Number(delayMs || 0));
+}
+
+// Calculate the configured time from slide entry to the next transition.
+function getSlideAdvanceDelay(slide) {
+  return getSlideHoldDelay(Math.max(1, Number(slide && slide.duration_seconds || 10)) * 1000);
+}
+
+// Cancel any pending fade-transition cleanup.
+function clearSlideTransitionTimer() {
+  if (slideTransitionTimer) {
+    window.clearTimeout(slideTransitionTimer);
+    slideTransitionTimer = null;
+  }
+}

src/player/public/js/player-region-registry.js

@@ -0,0 +1,34 @@
+// Registry used by the player runtime to discover independently loaded region modules.
+
+(function () {
+  var root = window;
+  var registry = root.pulsePlayerRegionTypes && typeof root.pulsePlayerRegionTypes === 'object' ? root.pulsePlayerRegionTypes : {};
+
+  function normalizeType(type) {
+    return String(type || '').trim().toLowerCase();
+  }
+
+  function register(type, definition) {
+    registry[normalizeType(type)] = definition || {};
+    return registry[normalizeType(type)];
+  }
+
+  function get(type) {
+    return registry[normalizeType(type)] || null;
+  }
+
+  function list() {
+    return Object.keys(registry).map(function (type) {
+      return {
+        type: type,
+        definition: registry[type] || {}
+      };
+    });
+  }
+
+  root.pulsePlayerRegionTypes = {
+    register: register,
+    get: get,
+    list: list
+  };
+}());

src/player/public/sw.js

@@ -1,6 +1,6 @@
 // Service worker cache strategy for player pages, assets, media, and playlists.
 
-const CACHE_VERSION = 'v38';
+const CACHE_VERSION = new URL(self.location.href).searchParams.get('v') || 'development';
 const PAGE_CACHE = `pulse-signage-player-pages-${CACHE_VERSION}`;
 const ASSET_CACHE = `pulse-signage-player-assets-${CACHE_VERSION}`;
 const MEDIA_CACHE = `pulse-signage-player-media-${CACHE_VERSION}`;

src/player/regions/api.js

@@ -68,6 +68,9 @@ function substituteApiVariables(html, item, sourceId) {
     }
 
     var resolved = placeholderUtils.resolvePlaceholderExpression(item, expression);
+    if (typeof placeholderUtils.isProgressPlaceholderExpression === 'function' && placeholderUtils.isProgressPlaceholderExpression(expression)) {
+      return placeholderUtils.renderProgressPlaceholder(item, expression);
+    }
     if (typeof placeholderUtils.isImagePlaceholderExpression === 'function' && placeholderUtils.isImagePlaceholderExpression(expression)) {
       var imageSource = placeholderUtils.formatPlaceholderValue(resolved);
       var source = getApiSourceById(sourceId);

src/player/regions/rss.js

@@ -74,6 +74,9 @@ function substituteRssVariables(html, item, feedId) {
       return '';
     }
     var resolved = placeholderUtils.resolvePlaceholderExpression(item, expression);
+    if (typeof placeholderUtils.isProgressPlaceholderExpression === 'function' && placeholderUtils.isProgressPlaceholderExpression(expression)) {
+      return placeholderUtils.renderProgressPlaceholder(item, expression);
+    }
     if (typeof placeholderUtils.isImagePlaceholderExpression === 'function' && placeholderUtils.isImagePlaceholderExpression(expression)) {
       var imageSource = placeholderUtils.formatPlaceholderValue(resolved);
       var feed = getRssFeedById(feedId);

src/player/regions/rtmp.js

@@ -1,3 +1,5 @@
+// RTMP region markup and playback lifecycle hooks.
+
 var registry = window.pulsePlayerRegionTypes;
 
 function renderRtmpRegion(region, regionContent) {

src/player/regions/timetable.js

@@ -13,6 +13,9 @@ function substituteTimetableVariables(html, entry) {
       return '';
     }
 
+    if (typeof window.placeholderUtils.isProgressPlaceholderExpression === 'function' && window.placeholderUtils.isProgressPlaceholderExpression(expression)) {
+      return window.placeholderUtils.renderProgressPlaceholder(entry, expression);
+    }
     return escapeHtml(window.placeholderUtils.formatPlaceholderValue(window.placeholderUtils.resolvePlaceholderExpression(entry, expression)));
   });
 }

src/player/regions/video.js

@@ -112,6 +112,8 @@ function renderVideoRegion(region, regionContent) {
   var cachedSrc = regionKey ? String(videoRegionLastGoodSrcCache[regionKey] || '').trim() : '';
   var cachedSrcVersioned = appendCacheBust(cachedSrc, regionContent && regionContent.cache_bust);
   var disableAudio = regionContent && regionContent.disable_audio === undefined ? true : Boolean(regionContent && regionContent.disable_audio);
+  var shouldLoop = !(regionContent && regionContent.loop === false);
+  var loopMarkup = shouldLoop ? ' loop' : '';
 
   if (!requestedSrc) {
     return '';
@@ -122,7 +124,7 @@ function renderVideoRegion(region, regionContent) {
       videoRegionLastGoodSrcCache[regionKey] = requestedSrc;
     }
     setVideoSourceAvailability(requestedSrc, true);
-    return '<div class="template-region video" style="' + region.baseStyle + '"><video src="' + escapeHtml(requestedSrcVersioned) + '" title="' + escapeHtml(region.label) + '" data-disable-audio="' + (disableAudio ? '1' : '0') + '" autoplay' + (disableAudio ? ' muted' : '') + ' loop playsinline preload="auto" disablepictureinpicture oncanplay="this.play().catch(function () {})"></video></div>';
+    return '<div class="template-region video" style="' + region.baseStyle + '"><video src="' + escapeHtml(requestedSrcVersioned) + '" title="' + escapeHtml(region.label) + '" data-disable-audio="' + (disableAudio ? '1' : '0') + '" data-loop="' + (shouldLoop ? '1' : '0') + '"' + (disableAudio ? ' muted' : '') + loopMarkup + ' playsinline preload="auto" disablepictureinpicture></video></div>';
   }
 
   var requestedState = getVideoSourceAvailability(requestedSrc);
@@ -132,7 +134,7 @@ function renderVideoRegion(region, regionContent) {
     if (regionKey) {
       videoRegionLastGoodSrcCache[regionKey] = requestedSrc;
     }
-    return '<div class="template-region video" style="' + region.baseStyle + '"><video src="' + escapeHtml(requestedSrcVersioned) + '" title="' + escapeHtml(region.label) + '" data-disable-audio="' + (disableAudio ? '1' : '0') + '" autoplay' + (disableAudio ? ' muted' : '') + ' loop playsinline preload="auto" disablepictureinpicture oncanplay="this.play().catch(function () {})"></video></div>';
+    return '<div class="template-region video" style="' + region.baseStyle + '"><video src="' + escapeHtml(requestedSrcVersioned) + '" title="' + escapeHtml(region.label) + '" data-disable-audio="' + (disableAudio ? '1' : '0') + '" data-loop="' + (shouldLoop ? '1' : '0') + '"' + (disableAudio ? ' muted' : '') + loopMarkup + ' playsinline preload="auto" disablepictureinpicture></video></div>';
   }
 
   scheduleVideoSourceProbe(regionKey, requestedSrc, false);
@@ -141,7 +143,7 @@ function renderVideoRegion(region, regionContent) {
     if (cachedSrc !== requestedSrc) {
       logVideoRegionStatus('Keeping the previous playable video until the new mirrored file finishes transferring.', 'region=' + regionKey + ' old=' + cachedSrc + ' new=' + requestedSrc);
     }
-    return '<div class="template-region video" style="' + region.baseStyle + '"><video src="' + escapeHtml(cachedSrcVersioned) + '" title="' + escapeHtml(region.label) + '" data-disable-audio="' + (disableAudio ? '1' : '0') + '" autoplay' + (disableAudio ? ' muted' : '') + ' loop playsinline preload="auto" disablepictureinpicture oncanplay="this.play().catch(function () {})"></video></div>';
+    return '<div class="template-region video" style="' + region.baseStyle + '"><video src="' + escapeHtml(cachedSrcVersioned) + '" title="' + escapeHtml(region.label) + '" data-disable-audio="' + (disableAudio ? '1' : '0') + '" data-loop="' + (shouldLoop ? '1' : '0') + '"' + (disableAudio ? ' muted' : '') + loopMarkup + ' playsinline preload="auto" disablepictureinpicture></video></div>';
   }
 
   return '';

src/player/regions/weather.js

@@ -51,6 +51,9 @@ function substituteWeatherVariables(html, value) {
     if (!value || typeof value !== 'object' || typeof weatherPlaceholderUtils.resolvePlaceholderExpression !== 'function' || typeof weatherPlaceholderUtils.formatPlaceholderValue !== 'function') return '';
     var rawExpression = String(expression).trim();
     var normalizedExpression = normalizeWeatherExpression(rawExpression);
+    if (typeof weatherPlaceholderUtils.isProgressPlaceholderExpression === 'function' && weatherPlaceholderUtils.isProgressPlaceholderExpression(rawExpression)) {
+      return weatherPlaceholderUtils.renderProgressPlaceholder(value, rawExpression);
+    }
     var iconMatch = normalizedExpression.match(/^(?:current\.weather_code|daily\.weather_code\.\d+|hourly\.weather_code\.\d+)\.icon(?:\((\d+)(?:\s*,\s*(\d+))?\))?$/);
     if (iconMatch) {
       var codeExpression = normalizedExpression.replace(/\.icon(?:\(.*\))?$/, '');

src/player/render-helpers.js

@@ -1,3 +1,5 @@
+// Assemble player HTML and inline runtime scripts from the server-side templates.
+
 const fs = require('fs');
 const path = require('path');
 const announcementIcons = require('#src/data/announcement-icons');
@@ -345,6 +347,9 @@ const playerPageTemplatePath = path.join(__dirname, 'player-page.template.html')
 const playerClientNameScriptPath = path.join(__dirname, 'player-client-name.script.html');
 const playerPageOfflineScriptPath = path.join(__dirname, 'public', 'js', 'player-page-offline.js');
 const playerPagePlaylistScriptPath = path.join(__dirname, 'public', 'js', 'player-page-playlist.js');
+const playerPageAnimationScriptPath = path.join(__dirname, 'public', 'js', 'player-page-animation.js');
+const playerPageMediaScriptPath = path.join(__dirname, 'public', 'js', 'player-page-media.js');
+const playerPageTransitionScriptPath = path.join(__dirname, 'public', 'js', 'player-page-transition.js');
 const playerPageCommandsScriptPath = path.join(__dirname, 'public', 'js', 'player-page-commands.js');
 const playerPageRenderingScriptPath = path.join(__dirname, 'public', 'js', 'player-page-rendering.js');
 const playerPagePlaybackScriptPath = path.join(__dirname, 'public', 'js', 'player-page-playback.js');
@@ -523,6 +528,35 @@ function getPlayerOnboardingFormScript() {
   return loadTemplate(playerOnboardingFormScriptPath, playerOnboardingFormScriptCache || (playerOnboardingFormScriptCache = {}));
 }
 
+function getPlayerRuntimeScripts() {
+  function getScriptBody(value) {
+    return String(value || '')
+      .replace(/^\s*<script(?:\s[^>]*)?>/i, '')
+      .replace(/<\/script>\s*$/i, '')
+      .trim();
+  }
+
+  return [
+    ['region-registry', fs.readFileSync(path.join(__dirname, 'public', 'js', 'player-region-registry.js'), 'utf8').trim()],
+    ['placeholder-utils', fs.readFileSync(path.join(__dirname, '..', 'web', 'public', 'js', 'shared', 'placeholder-utils.js'), 'utf8').trim()],
+    ['qr-code-svg', fs.readFileSync(path.join(__dirname, '..', 'web', 'public', 'js', 'shared', 'qr-code-svg.js'), 'utf8').trim()],
+    ['client-name', getScriptBody(getPlayerClientNameScript()())],
+    ['offline', getScriptBody(getPlayerPageOfflineScript()())],
+    ['playlist', getScriptBody(getPlayerPagePlaylistScript()())],
+    ['animation', fs.readFileSync(playerPageAnimationScriptPath, 'utf8').trim()],
+    ['media', fs.readFileSync(playerPageMediaScriptPath, 'utf8').trim()],
+    ['transition', fs.readFileSync(playerPageTransitionScriptPath, 'utf8').trim()],
+    ['commands', getScriptBody(getPlayerPageCommandsScript()())],
+    ['rendering', getScriptBody(getPlayerPageRenderingScript()())],
+    ['playback', getScriptBody(getPlayerPagePlaybackScript()())],
+    ['announcement-icons', getAnnouncementIconsDataScript()],
+    ['announcement-data', getPlayerAnnouncementTemplatesDataScript()],
+    ['announcement-templates', getScriptBody(getPlayerAnnouncementTemplatesScript())]
+  ].concat(getPlayerRegionScriptPaths().map(function (filePath, index) {
+    return ['region-' + index, fs.readFileSync(filePath, 'utf8').trim()];
+  })).filter(function (entry) { return entry[1]; });
+}
+
 module.exports = {
   mediaKind: mediaKind,
   escapeHtml: escapeHtml,
@@ -556,5 +590,6 @@ module.exports = {
   getPlayerPageScript: getPlayerPageScript,
   getPlayerRegionScripts: getPlayerRegionScripts,
   getPlayerOnboardingLandingScript: getPlayerOnboardingLandingScript,
-  getPlayerOnboardingFormScript: getPlayerOnboardingFormScript
+  getPlayerOnboardingFormScript: getPlayerOnboardingFormScript,
+  getPlayerRuntimeScripts: getPlayerRuntimeScripts
 };

src/player/render.js

@@ -2,8 +2,8 @@
 
 const Handlebars = require('handlebars');
 const path = require('path');
-const { mediaKind, safeJsonForScript, getPlayerPageTemplate, getPlayerClientNameScript, getPlayerPageOfflineScript, getPlayerPagePlaylistScript, getPlayerPageCommandsScript, getPlayerPageRenderingScript, getPlayerPagePlaybackScript, getAnnouncementIconsDataScript, getPlayerAnnouncementTemplatesDataScript, getPlayerAnnouncementTemplatesScript, getPlayerPageAnnouncementsScript, getPlayerPageScript, getPlayerRegionScripts, getPlayerOnboardingLandingScript, getPlayerOnboardingFormScript } = require('./render-helpers');
-const { createThumbnailPreviewBootstrapScript } = require('./thumbnail-preview');
+const packageMetadata = require('../../package.json');
+const { mediaKind, safeJsonForScript, getPlayerPageTemplate, getPlayerPageAnnouncementsScript, getPlayerPageScript, getPlayerOnboardingLandingScript, getPlayerOnboardingFormScript, getPlayerRuntimeScripts } = require('./render-helpers');
 const { createPageAuthBundle, createPageFetchAuthScript } = require('#src/request-auth');
 const { getFontStylesheetHref } = require('#src/web/lib/media/font-library');
 
@@ -23,11 +23,12 @@ function renderPage(template, options) {
 }
 
 function getPlayerServiceWorkerRegistrationScript() {
+  const releaseVersion = encodeURIComponent(String(packageMetadata.version || 'development'));
   return [
     '<script>',
     '  if ("serviceWorker" in navigator) {',
     '    window.addEventListener("load", function () {',
-      '      navigator.serviceWorker.register("/sw.js?v=38").catch(function () {',
+      '      navigator.serviceWorker.register("/sw.js?v=' + releaseVersion + '").catch(function () {',
     '        return null;',
     '      });',
     '    });',
@@ -110,30 +111,26 @@ function renderOnboardingFormScript(deviceId) {
 }
 
 function renderPlayerPage(slug, initialData) {
-  const onboardingScript = getPlayerClientNameScript()();
-  const offlineScript = getPlayerPageOfflineScript()();
-  const playlistScript = getPlayerPagePlaylistScript()();
-  const commandScript = getPlayerPageCommandsScript()();
-  const renderingScript = getPlayerPageRenderingScript()();
-  const playbackScript = getPlayerPagePlaybackScript()();
   const serviceWorkerScript = getPlayerServiceWorkerRegistrationScript();
   const template = getPlayerPageTemplate();
   const hlsScriptTag = '<script src="/assets/vendor/hls.min.js"></script>';
   const pageAuthToken = createPageAuthBundle({ scope: 'player', slug: String(slug || '').trim() });
   const fontStylesheetHref = getFontStylesheetHref(PLAYER_MEDIA_DIR);
-  const bodyClass = [initialData && initialData.thumbnailPreview ? 'thumbnail-preview' : '', ''].join(' ').trim();
-  const script = getPlayerPageScript()({
+  const bootstrapScript = getPlayerPageScript()({
     SLUG_JSON: new Handlebars.SafeString(JSON.stringify(slug)),
     INITIAL_DATA_JSON: new Handlebars.SafeString(safeJsonForScript(initialData || null)),
-    REGION_SCRIPTS: new Handlebars.SafeString(getPlayerRegionScripts())
+    REGION_SCRIPTS: ''
   });
+  const runtimeScriptTags = getPlayerRuntimeScripts().map(function (entry) {
+    return '<script src="/assets/player-script/' + encodeURIComponent(entry[0]) + '.js?v=' + encodeURIComponent(String(packageMetadata.version || 'development')) + '"></script>';
+  }).join('');
 
   return renderPage(template, {
     title: 'Screen ' + slug,
-    bodyClass: bodyClass,
+    bodyClass: '',
     body: '<div id="app"><div class="empty">Loading screen...</div></div>',
     stylesheets: fontStylesheetHref ? [fontStylesheetHref] : [],
-    script: createPageFetchAuthScript(pageAuthToken, '/ws/screens/' + encodeURIComponent(slug || '')) + hlsScriptTag + serviceWorkerScript + createThumbnailPreviewBootstrapScript(initialData) + '<script>' + offlineScript + '</script>' + '<script>' + playlistScript + '</script>' + '<script>' + commandScript + '</script>' + '<script>' + renderingScript + '</script>' + '<script>' + playbackScript + '</script>' + '<script>' + getAnnouncementIconsDataScript() + '</script>' + '<script>' + getPlayerAnnouncementTemplatesDataScript() + '</script>' + '<script>' + getPlayerAnnouncementTemplatesScript() + '</script>' + onboardingScript + script + '<script>' + getPlayerPageAnnouncementsScript()() + '</script>'
+    script: createPageFetchAuthScript(pageAuthToken, '/ws/screens/' + encodeURIComponent(slug || '')) + hlsScriptTag + serviceWorkerScript + runtimeScriptTags + bootstrapScript + '<script>' + getPlayerPageAnnouncementsScript()() + '</script>'
   });
 }
 

src/player/routes.js

@@ -5,7 +5,6 @@ const express = require('express');
 const path = require('path');
 const { getSharedSecret, createPageAuthBundle, verifyPageAuthToken, verifyRequestAuth, createRequestAuthHeaders } = require('#src/request-auth');
 const { getPlayerPublicBaseUrl } = require('./onboarding');
-const { buildThumbnailPreviewData } = require('./thumbnail-preview');
 
 const TRANSIENT_DB_ERROR_CODES = ['ECONNREFUSED', 'ECONNRESET', 'ETIMEDOUT', 'EPIPE', 'ENOTFOUND', 'PROTOCOL_CONNECTION_LOST', 'POOL_CLOSED', 'ERR_POOL_CLOSED'];
 
@@ -24,6 +23,23 @@ function isBridgeFetchError(error) {
   ));
 }
 
+function getRequestClientId(req) {
+  const headerClientId = String(req && req.headers && req.headers['x-pulse-client-id'] || '').trim();
+  if (headerClientId) {
+    return headerClientId;
+  }
+  const queryClientId = String(req && req.query && req.query.clientId || '').trim();
+  if (queryClientId) {
+    return queryClientId;
+  }
+  const cookieHeader = String(req && req.headers && req.headers.cookie || '');
+  const cookie = cookieHeader.split(';').map(function (part) {
+    const separator = part.indexOf('=');
+    return separator === -1 ? null : [part.slice(0, separator).trim(), part.slice(separator + 1).trim()];
+  }).filter(Boolean).find(function (entry) { return entry[0] === 'pulse-player-client-id'; });
+  return cookie ? decodeURIComponent(cookie[1]) : '';
+}
+
 function registerPlayerRoutes(app, options) {
   const pool = options && options.pool ? options.pool : null;
   const common = options && options.common ? options.common : null;
@@ -32,9 +48,10 @@ function registerPlayerRoutes(app, options) {
   const playerRuntime = options && options.playerRuntime ? options.playerRuntime : null;
   const playerPlaylistService = options && options.playerPlaylistService ? options.playerPlaylistService : null;
   const rtmpStreamService = options && options.rtmpStreamService ? options.rtmpStreamService : null;
-  const playerInternalUrl = String(options && options.playerInternalBaseUrl || process.env.PLAYER_INTERNAL_URL || process.env.PLAYER_BASE_URL || '').trim().replace(/\/$/, '');
+  const playerInternalUrl = String(options && options.playerInternalBaseUrl || process.env.PLAYER_INTERNAL_URL || '').trim().replace(/\/$/, '');
   const bridgeBaseUrl = String(options && options.bridgeBaseUrl || process.env.BRIDGE_PUBLIC_URL || '').trim().replace(/\/$/, '');
   const playerDeviceId = String(options && options.playerDeviceId || '').trim() || null;
+  const snapshotDir = options && options.snapshotDir ? path.resolve(String(options.snapshotDir)) : null;
   const onPlayerPublicBaseUrl = typeof options.onPlayerPublicBaseUrl === 'function' ? options.onPlayerPublicBaseUrl : null;
 
   if (!app || !common || !mediaDir || !assetDir || !playerRuntime || !rtmpStreamService) {
@@ -66,11 +83,16 @@ function registerPlayerRoutes(app, options) {
     if (requestHeaders['x-pulse-page-auth']) {
       headers['x-pulse-page-auth'] = String(requestHeaders['x-pulse-page-auth']).trim();
     }
-    if (requestHeaders['if-none-match']) {
+    if (requestHeaders['if-none-match'] && !requestOptions.skipIfNoneMatch) {
       headers['if-none-match'] = String(requestHeaders['if-none-match']).trim();
     }
     if (requestHeaders['x-pulse-client-id']) {
       headers['x-pulse-client-id'] = String(requestHeaders['x-pulse-client-id']).trim();
+    } else {
+      const clientId = getRequestClientId(req);
+      if (clientId) {
+        headers['x-pulse-client-id'] = clientId;
+      }
     }
     if (requestOptions.contentType) {
       headers['content-type'] = requestOptions.contentType;
@@ -130,7 +152,7 @@ function registerPlayerRoutes(app, options) {
   }
 
   async function isClientAuthorizedForScreen(req, requestedSlug) {
-    const clientId = String(req.headers['x-pulse-client-id'] || '').trim();
+    const clientId = getRequestClientId(req);
     if (!clientId) {
       return false;
     }
@@ -219,6 +241,32 @@ function registerPlayerRoutes(app, options) {
     return resolvedFilePath;
   }
 
+  function getSnapshotFilePath(slug) {
+    const normalizedSlug = String(slug || '').trim();
+    return snapshotDir && normalizedSlug ? path.join(snapshotDir, `${normalizedSlug}.json`) : null;
+  }
+
+  async function readPlaylistSnapshot(slug) {
+    const filePath = getSnapshotFilePath(slug);
+    if (!filePath) {
+      return null;
+    }
+    try {
+      return JSON.parse(await fs.promises.readFile(filePath, 'utf8'));
+    } catch (_error) {
+      return null;
+    }
+  }
+
+  async function writePlaylistSnapshot(slug, payload) {
+    const filePath = getSnapshotFilePath(slug);
+    if (!filePath || !payload) {
+      return;
+    }
+    await fs.promises.mkdir(path.dirname(filePath), { recursive: true });
+    await fs.promises.writeFile(filePath, JSON.stringify(payload, null, 2), 'utf8');
+  }
+
   app.use('/assets', express.static(assetDir));
   app.use('/assets/adminlte/bootstrap-icons', express.static(path.join(__dirname, '..', 'web', 'public', 'adminlte', 'bootstrap-icons')));
   app.use('/media', express.static(mediaDir));
@@ -371,7 +419,7 @@ function registerPlayerRoutes(app, options) {
   });
 
   app.get('/screen/:slug', async function (req, res, next) {
-    if (onPlayerPublicBaseUrl) {
+    if (onPlayerPublicBaseUrl && !bridgeBaseUrl) {
       try {
         onPlayerPublicBaseUrl(getPlayerPublicBaseUrl(req, null));
       } catch (_error) {
@@ -387,21 +435,25 @@ function registerPlayerRoutes(app, options) {
         headers: pageAuthToken ? { 'x-pulse-page-auth': pageAuthToken } : {}
       }).then(async function (response) {
         if (!response || response.status >= 400) {
+          const snapshot = await readPlaylistSnapshot(req.params.slug);
           res.set('X-Player-Offline', '1');
-          return res.send(common.renderPlayerPage(req.params.slug, null));
+          return res.send(common.renderPlayerPage(req.params.slug, snapshot));
         }
         const data = await readJsonResponse(response);
         if (!data) {
+          const snapshot = await readPlaylistSnapshot(req.params.slug);
           res.set('X-Player-Offline', '1');
-          return res.send(common.renderPlayerPage(req.params.slug, null));
+          return res.send(common.renderPlayerPage(req.params.slug, snapshot));
         }
+        await writePlaylistSnapshot(req.params.slug, data);
         res.send(common.renderPlayerPage(req.params.slug, null));
-      }).catch(function (error) {
+      }).catch(async function (error) {
         if (!isBridgeFetchError(error)) {
           console.error(error);
         }
+        const snapshot = await readPlaylistSnapshot(req.params.slug);
         res.set('X-Player-Offline', '1');
-        res.send(common.renderPlayerPage(req.params.slug, null));
+        res.send(common.renderPlayerPage(req.params.slug, snapshot));
       });
       return;
     }
@@ -415,61 +467,6 @@ function registerPlayerRoutes(app, options) {
     });
   });
 
-  app.get('/api/internal/slide-thumbnails/:id/preview', requireRequestAuth, async function (req, res, next) {
-    try {
-      if (bridgeBaseUrl) {
-        const response = await fetchBridge(req, '/api/internal/slide-thumbnails/' + encodeURIComponent(req.params.id) + '/preview', {
-          method: 'GET'
-        });
-        if (!response) {
-          return res.status(502).send('Thin client unavailable');
-        }
-        res.status(response.status);
-        res.set('Cache-Control', response.headers.get('cache-control') || 'no-store, no-cache, must-revalidate, proxy-revalidate');
-        res.type(response.headers.get('content-type') || 'text/html; charset=utf-8');
-        return res.send(await response.text());
-      }
-
-      const slide = await common.fetchSlideById(pool, Number(req.params.id));
-      if (!slide) {
-        return res.status(404).send('Slide not found');
-      }
-
-      const data = buildThumbnailPreviewData(slide);
-
-      if (typeof common.fetchRssFeedsData === 'function' && typeof common.fetchRssFeedItemsByFeedId === 'function') {
-        const rssData = await common.fetchRssFeedsData(pool);
-        data.rssFeeds = await Promise.all((rssData.rssFeeds || []).map(async function (feed) {
-          const items = await common.fetchRssFeedItemsByFeedId(pool, feed.id);
-          return Object.assign({}, feed, {
-            items: items.map(function (item) {
-              return typeof common.normalizeRssFeedItem === 'function' ? common.normalizeRssFeedItem(item) : item;
-            })
-          });
-        }));
-      }
-
-      if (typeof common.fetchApiSourcesData === 'function') {
-        const apiData = await common.fetchApiSourcesData(pool);
-        data.apiSources = (apiData.apiSources || []).map(function (source) {
-          return Object.assign({}, source, {
-            responseJson: typeof common.parseJsonSafe === 'function' ? common.parseJsonSafe(source.last_response_json) : null
-          });
-        });
-      }
-
-      if (typeof common.fetchTimetablesData === 'function') {
-        const timetableData = await common.fetchTimetablesData(pool);
-        data.timetableGroups = Array.isArray(timetableData && timetableData.timetableGroups) ? timetableData.timetableGroups : [];
-      }
-
-      res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
-      res.send(common.renderPlayerPage('slide-thumbnail-preview-' + slide.id, data));
-    } catch (error) {
-      next(error);
-    }
-  });
-
   app.get('/api/screens/:slug/playlist', requirePageAuth(['player']), async function (req, res, next) {
     try {
       if (playerDeviceId && !(await isClientAuthorizedForScreen(req, req.params.slug))) {
@@ -480,7 +477,13 @@ function registerPlayerRoutes(app, options) {
           method: 'GET'
         });
         if (!response) {
-          return res.status(502).json({ error: 'Thin client unavailable.' });
+          const snapshot = await readPlaylistSnapshot(req.params.slug);
+          if (!snapshot) {
+            return res.status(502).json({ error: 'Thin client unavailable.' });
+          }
+          res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
+          res.set('ETag', '"' + String(snapshot.revision || '') + '"');
+          return res.json(snapshot);
         }
         res.status(response.status);
         const etag = response.headers.get('etag');
@@ -492,10 +495,29 @@ function registerPlayerRoutes(app, options) {
           res.set('Cache-Control', cacheControl);
         }
         if (response.status === 304) {
-          return res.end();
+          const cachedSnapshot = await readPlaylistSnapshot(req.params.slug);
+          if (cachedSnapshot) {
+            return res.end();
+          }
+
+          const refreshedResponse = await fetchBridge(req, '/api/screens/' + encodeURIComponent(req.params.slug) + '/playlist', {
+            method: 'GET',
+            skipIfNoneMatch: true
+          });
+          const refreshedData = await readJsonResponse(refreshedResponse);
+          if (!refreshedResponse || refreshedResponse.status >= 400 || !refreshedData) {
+            return res.status(502).json({ error: 'Thin client playlist cache unavailable.' });
+          }
+          await writePlaylistSnapshot(req.params.slug, refreshedData);
+          return res.json(refreshedData);
         }
         res.type(response.headers.get('content-type') || 'application/json');
-        return res.send(await response.text());
+        const responseText = await response.text();
+        try {
+          await writePlaylistSnapshot(req.params.slug, JSON.parse(responseText));
+        } catch (_error) {
+        }
+        return res.send(responseText);
       }
 
       res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');

src/player/runtime.js

@@ -2,7 +2,7 @@
 
 const crypto = require('crypto');
 const { WebSocketServer, WebSocket } = require('ws');
-const { isClientNameAvailable } = require('#src/data/client-name-check');
+const { findAvailableClientName, isClientNameAvailable } = require('#src/data/client-name-check');
 const { verifyPageAuthToken, verifyRequestAuth } = require('#src/request-auth');
 const PAGE_AUTH_COOKIE_NAME = 'pulse_page_auth';
 
@@ -22,6 +22,8 @@ function normalizePlayerPublicBaseUrl(pageUrl) {
 function createPlayerRuntime(options) {
   const pool = options && options.pool ? options.pool : null;
   const notifySnapshot = typeof options.notifySnapshot === 'function' ? options.notifySnapshot : null;
+  const persistClientName = typeof options.persistClientName === 'function' ? options.persistClientName : null;
+  const touchClientLastSeen = typeof options.touchClientLastSeen === 'function' ? options.touchClientLastSeen : null;
   const normalizeDeviceId = typeof options.normalizeDeviceId === 'function'
     ? options.normalizeDeviceId
     : function (value) {
@@ -30,7 +32,11 @@ function createPlayerRuntime(options) {
   const connectionsBySlug = new Map();
   const dashboardListenersBySlug = new Map();
   const announcementListenersBySlug = new Map();
+  const pendingCommandAcks = new Map();
   const wss = new WebSocketServer({ noServer: true });
+  const staleConnectionMs = Number(options && options.staleConnectionMs) > 0
+    ? Number(options.staleConnectionMs)
+    : 3 * 60 * 1000;
 
   function hasActiveClientId(clientId, currentConnection) {
     const normalizedClientId = String(clientId || '').trim();
@@ -180,6 +186,57 @@ function createPlayerRuntime(options) {
     }
   }
 
+  function removeStaleConnections() {
+    const cutoff = Date.now() - staleConnectionMs;
+    for (const [slug, bucket] of connectionsBySlug.entries()) {
+      for (const [connectionId, connection] of bucket.entries()) {
+        if (connection.lastSeenAt && connection.lastSeenAt.getTime() > cutoff) {
+          continue;
+        }
+        removeConnection(slug, connectionId);
+        try {
+          connection.socket.close(1000, 'Connection heartbeat expired.');
+        } catch (_error) {
+        }
+        broadcastConnectionSnapshot(slug);
+      }
+    }
+  }
+
+  const staleConnectionSweep = setInterval(removeStaleConnections, Math.min(staleConnectionMs, 60 * 1000));
+  if (typeof staleConnectionSweep.unref === 'function') {
+    staleConnectionSweep.unref();
+  }
+
+  function checkWebsocketHealth() {
+    for (const [slug, bucket] of connectionsBySlug.entries()) {
+      for (const [connectionId, connection] of bucket.entries()) {
+        if (!connection.isAlive) {
+          removeConnection(slug, connectionId);
+          try {
+            connection.socket.terminate();
+          } catch (_error) {
+          }
+          broadcastConnectionSnapshot(slug);
+          continue;
+        }
+
+        connection.isAlive = false;
+        try {
+          connection.socket.ping();
+        } catch (_error) {
+          removeConnection(slug, connectionId);
+          broadcastConnectionSnapshot(slug);
+        }
+      }
+    }
+  }
+
+  const websocketHealthCheck = setInterval(checkWebsocketHealth, 30 * 1000);
+  if (typeof websocketHealthCheck.unref === 'function') {
+    websocketHealthCheck.unref();
+  }
+
   function getDashboardListenerBucket(slug) {
     const key = String(slug || '').trim();
     if (!key) {
@@ -370,7 +427,10 @@ function createPlayerRuntime(options) {
       return 0;
     }
 
-    const target = bucket.get(String(connectionId || '').trim());
+    const normalizedConnectionId = String(connectionId || '').trim();
+    const target = bucket.get(normalizedConnectionId) || Array.from(bucket.values()).find(function (connection) {
+      return String(connection && connection.clientId || '').trim() === normalizedConnectionId;
+    });
     if (!target || target.socket.readyState !== WebSocket.OPEN) {
       return 0;
     }
@@ -382,8 +442,28 @@ function createPlayerRuntime(options) {
     payload.targetConnectionId = target.id;
     payload.sentAt = new Date().toISOString();
 
+    const requestId = String(payload.requestId || '').trim();
+    if (!requestId) {
+      target.socket.send(JSON.stringify(payload));
+      return 1;
+    }
+
+    const acknowledgement = new Promise(function (resolve) {
+      const timeout = setTimeout(function () {
+        pendingCommandAcks.delete(requestId);
+        resolve(0);
+      }, 5000);
+      pendingCommandAcks.set(requestId, {
+        connection: target,
+        resolve: function (acknowledged) {
+          clearTimeout(timeout);
+          pendingCommandAcks.delete(requestId);
+          resolve(acknowledged ? 1 : 0);
+        }
+      });
+    });
     target.socket.send(JSON.stringify(payload));
-    return 1;
+    return await acknowledgement;
   }
 
   async function broadcastCommand(slug, commandOrPayload) {
@@ -527,6 +607,7 @@ function createPlayerRuntime(options) {
       connectedAt: new Date(),
       lastSeenAt: new Date()
     };
+    connection.isAlive = true;
     const bucket = getConnectionBucket(slug);
 
     if (!bucket) {
@@ -536,7 +617,11 @@ function createPlayerRuntime(options) {
 
     bucket.set(connectionId, connection);
 
-    socket.on('message', function (rawMessage) {
+    socket.on('pong', function () {
+      connection.isAlive = true;
+    });
+
+    socket.on('message', async function (rawMessage) {
       connection.lastSeenAt = new Date();
       let payload = null;
       try {
@@ -546,6 +631,13 @@ function createPlayerRuntime(options) {
       }
 
       if (!payload || payload.type !== 'state') {
+        if (payload && payload.type === 'command-ack') {
+          const requestId = String(payload.requestId || '').trim();
+          const pendingAck = pendingCommandAcks.get(requestId);
+          if (pendingAck && pendingAck.connection === connection) {
+            pendingAck.resolve(payload.ok !== false);
+          }
+        }
         return;
       }
 
@@ -561,6 +653,26 @@ function createPlayerRuntime(options) {
       if (!connection.clientName && connection.clientId) {
         connection.clientName = connection.clientId;
       }
+      if (connection.clientName) {
+        const connectionIdentity = connection.deviceId || connection.clientId;
+        const selectedClientName = await findAvailableClientName(pool, connection.clientName, connectionIdentity, snapshotAllConnections());
+        if (selectedClientName && selectedClientName !== connection.clientName) {
+          connection.clientName = selectedClientName;
+          if (persistClientName) {
+            await persistClientName(connection.deviceId, selectedClientName);
+          }
+          if (socket.readyState === WebSocket.OPEN) {
+            socket.send(JSON.stringify({ type: 'client-name-updated', clientName: selectedClientName }));
+          }
+        }
+      }
+      if (touchClientLastSeen) {
+        try {
+          await touchClientLastSeen(connection.clientId);
+        } catch (_error) {
+          // A heartbeat failure must not interrupt playback or websocket state.
+        }
+      }
       connection.userAgent = payload.userAgent ? String(payload.userAgent).trim() : connection.userAgent;
       connection.viewport = payload.viewport && typeof payload.viewport === 'object' ? payload.viewport : connection.viewport;
       connection.page = payload.page ? String(payload.page).trim() : connection.page;
@@ -581,12 +693,24 @@ function createPlayerRuntime(options) {
       broadcastConnectionSnapshot(slug);
     });
 
-    socket.on('close', function () {
+    socket.on('close', function (code, reason) {
+      pendingCommandAcks.forEach(function (pendingAck, requestId) {
+        if (pendingAck.connection === connection) {
+          pendingAck.resolve(false);
+          pendingCommandAcks.delete(requestId);
+        }
+      });
       removeConnection(slug, connectionId);
       broadcastConnectionSnapshot(slug);
     });
 
     socket.on('error', function () {
+      pendingCommandAcks.forEach(function (pendingAck, requestId) {
+        if (pendingAck.connection === connection) {
+          pendingAck.resolve(false);
+          pendingCommandAcks.delete(requestId);
+        }
+      });
       removeConnection(slug, connectionId);
       broadcastConnectionSnapshot(slug);
     });

src/player/thumbnail-preview.js

@@ -1,30 +0,0 @@
-// Thumbnail preview data and bootstrap script helpers for slide thumbnails.
-
-function buildThumbnailPreviewData(slide) {
-  return {
-    thumbnailPreview: true,
-    screen: {
-      id: slide.id,
-      name: slide.title,
-      slug: 'slide-thumbnail-preview-' + slide.id,
-      playlist_id: null
-    },
-    playlist: {
-      fade_between_slides: false
-    },
-    slides: [slide],
-    rssFeeds: [],
-    apiSources: [],
-    timetableGroups: [],
-    revision: String(slide.modified_at || slide.id || Date.now())
-  };
-}
-
-function createThumbnailPreviewBootstrapScript(initialData) {
-  return initialData && initialData.thumbnailPreview ? '<script>window.__pulseThumbnailPreview = true;</script>' : '';
-}
-
-module.exports = {
-  buildThumbnailPreviewData: buildThumbnailPreviewData,
-  createThumbnailPreviewBootstrapScript: createThumbnailPreviewBootstrapScript
-};

src/rbac.js

@@ -191,6 +191,17 @@ const PERMISSION_SECTIONS = [
           { key: 'delete', name: 'Delete', description: 'Delete users.' }
         ]
       },
+      {
+        key: 'invitations',
+        order: 15,
+        name: 'Invitations',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View pending user invitations.' },
+          { key: 'create', name: 'Create', description: 'Send new user invitations.' },
+          { key: 'delete', name: 'Delete', description: 'Delete pending user invitations.' },
+          { key: 'allow', name: 'Allow', description: 'Resend pending user invitations.' }
+        ]
+      },
       {
         key: 'rbac',
         order: 20,

src/web.js

@@ -6,7 +6,7 @@ const multer = require('multer');
 const fs = require('fs');
 const crypto = require('crypto');
 const common = require('./common');
-const { verifyPassword, createSessionToken, hashSessionToken, hashPassword, validatePasswordStrength } = require('#src/auth');
+const { verifyPassword, createSessionToken, hashSessionToken, hashPassword, validatePasswordStrength, createOneTimeToken } = require('#src/auth');
 const pages = require('#src/web/pages');
 const registerMiddleware = require('#src/web/middleware');
 const registerNotFoundHandler = require('#src/web/middleware/not-found');
@@ -23,8 +23,9 @@ const { requirePermission: createRequirePermission, PERMISSION_DENIED_MESSAGE }
 const { rbacData } = require('#src/web/lib/auth');
 const { createPlayerActionService } = require('#src/web/lib/player-actions');
 const { isClientNameAvailable, withClientNameReservation } = require('#src/data/client-name-check');
-const { createSessionService } = require('#src/web/lib/auth');
+const { createSessionService, getRequestOrigin } = require('#src/web/lib/auth');
 const { fetchAppSettings } = require('#src/data/app-settings');
+const { sendAccountEmail } = require('#src/data/mailer');
 const { recordRequestAuditEvent } = require('#src/data/audit-log');
 const { hasAnyPermission } = require('#src/rbac');
 const { ensureFontLibrary } = require('#src/web/lib/media/font-library');
@@ -67,7 +68,13 @@ async function start() {
     playerInternalBaseUrl: webConfig.playerInternalUrl,
     bridgeInternalBaseUrl: webConfig.bridgeInternalUrl
   });
-  const notifyPlayerScreens = createNotifyPlayerScreens(playerActionService.forwardPlayerCommand);
+  const notifyPlayerScreens = createNotifyPlayerScreens(
+    playerActionService.forwardPlayerCommand,
+    playerActionService.getScreenConnections,
+    playerActionService.forwardPlayerCommandToBaseUrl,
+    playerActionService.resolvePlayerBaseUrlForPublicUrl,
+    playerActionService.forwardPlayerCommandToDevice
+  );
 
   // Centralized dashboard/player bootstrap.
   const webBootstrap = createWebBootstrap({
@@ -144,7 +151,10 @@ async function start() {
     sessionCookieName: webConfig.sessionCookieName,
     formatDashboardDate: formatDashboardDate,
     getAuditUserId: getAuditUserId,
+    getRequestOrigin: getRequestOrigin,
     recordRequestAuditEvent: recordRequestAuditEvent,
+    sendAccountEmail: function (settings, message) { return sendAccountEmail(settings, message); },
+    createOneTimeToken: createOneTimeToken,
     hashPassword: hashPassword,
     validatePasswordStrength: validatePasswordStrength,
     readArrayField: readArrayField,
@@ -165,6 +175,7 @@ async function start() {
     playerActionService: playerActionService,
     playerInternalBaseUrl: webConfig.playerInternalUrl,
     isClientNameAvailable: isClientNameAvailable,
+    findAvailableClientName: common.findAvailableClientName,
     withClientNameReservation: withClientNameReservation,
     requirePermission: function (permissionKey, options) {
       return createRequirePermission(permissionKey, Object.assign({ setAuthMessageCookie: setAuthMessageCookie }, options));

src/web/bootstrap.js

@@ -121,6 +121,7 @@ function createWebBootstrap(options) {
     pool: pool,
     common: common,
     playerInternalBaseUrl: configuredPlayerInternalUrl,
+    bridgeInternalBaseUrl: configuredBridgeInternalUrl,
     playerSnapshotCache: playerSnapshotCache,
     notifyPlayerScreens: notifyPlayerScreens,
     backgroundTaskQueue: backgroundTaskQueue

src/web/lib/auth/index.js

@@ -2,5 +2,6 @@
 
 module.exports = {
   createSessionService: require('./session').createSessionService,
+  getRequestOrigin: require('./session').getRequestOrigin,
   rbacData: require('./rbac-data')
 };

src/web/lib/auth/rbac-data.js

@@ -57,6 +57,32 @@ async function fetchRolesPage(pool, page, pageSize, searchTerm, sortKey, sortDir
   return Object.assign({ roles: paged.rows }, paged);
 }
 
+async function fetchInvitationsPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: `SELECT i.id, i.email, i.name, i.role_ids_json, i.created_at, i.expires_at, u.username AS created_by_username
+                  FROM a_user_invitations i
+             LEFT JOIN a_users u ON u.id = i.created_by
+                 WHERE i.used_at IS NULL AND i.expires_at > NOW()
+                 ORDER BY i.created_at DESC`,
+    countSql: 'SELECT COUNT(*) AS count FROM a_user_invitations WHERE used_at IS NULL AND expires_at > NOW()',
+    searchColumns: ['i.email', 'i.name', 'u.username'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      email: 'i.email',
+      name: 'i.name',
+      created: 'i.created_at',
+      expires: 'i.expires_at',
+      createdBy: 'u.username'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ invitations: paged.rows }, paged);
+}
+
 async function fetchRoleById(pool, roleId) {
   const [rows] = await pool.query(
     `SELECT r.id, r.role_key, r.name, r.description, r.created_at, r.modified_at,
@@ -142,7 +168,7 @@ async function fetchUsersWithRolesPage(pool, page, pageSize, searchTerm, sortKey
   const whereSql = hasExcludedUserId ? 'WHERE u.id <> ?' : '';
   const queryArgs = hasExcludedUserId ? [excludedUserId] : [];
   const paged = await fetchPagedRows(pool, {
-    selectSql: `SELECT u.id, u.name, u.username, u.account_locked, u.created_at, u.modified_at,
+    selectSql: `SELECT u.id, u.name, u.username, u.email, u.email_verified_at, u.account_locked, u.created_at, u.modified_at,
             COALESCE(role_data.role_names, '') AS role_names,
             COALESCE(role_data.role_ids_csv, '') AS role_ids_csv
     FROM a_users u
@@ -189,7 +215,7 @@ async function fetchUsersWithRolesPage(pool, page, pageSize, searchTerm, sortKey
 
 async function fetchUserWithRoles(pool, userId) {
   const [rows] = await pool.query(
-    `SELECT u.id, u.name, u.username, u.account_locked, u.created_at, u.modified_at,
+    `SELECT u.id, u.name, u.username, u.email, u.email_verified_at, u.account_locked, u.created_at, u.modified_at,
             COALESCE(role_data.role_names, '') AS role_names,
             COALESCE(role_data.role_ids_csv, '') AS role_ids_csv
     FROM a_users u
@@ -299,6 +325,7 @@ module.exports = {
   fetchPermissions,
   fetchRoles,
   fetchRolesPage,
+  fetchInvitationsPage,
   fetchRoleById,
   fetchRolePermissionKeys,
   fetchRoleUserIds,

src/web/lib/auth/session.js

@@ -128,7 +128,7 @@ function createSessionService(options) {
 
     const tokenHash = hashSessionToken(token);
     const [rows] = await pool.query(
-      `SELECT s.user_id, u.id, u.name, u.username, u.must_change_password
+      `SELECT s.user_id, u.id, u.name, u.username, u.email, u.email_verified_at, u.pending_email, u.must_change_password
       FROM a_sessions s
       JOIN a_users u ON u.id = s.user_id
        WHERE s.session_hash = ?

src/web/lib/background-tasks/tasks-scheduled/data-source-refresh.js

@@ -68,7 +68,7 @@ function registerRecurringDataSourceRefreshes(options) {
         category: TASK.category,
         intervalMs: normalizeIntervalMs(location.update_interval_value, location.update_interval_unit),
         metadata: { sourceType: 'weather-location', sourceId: Number(location.id), sourceName: location.name },
-        run: function () { return refreshWeatherLocation(pool, common, location, null, options.notifyPlayerScreens); }
+        run: function () { return refreshWeatherLocation(pool, common, location.id, null, options.notifyPlayerScreens); }
       });
     });
   })();

src/web/lib/config.js

@@ -5,7 +5,7 @@ function createWebConfig() {
   const uploadsDir = path.join(mediaDir, 'uploads');
   const thumbnailsDir = path.join(mediaDir, 'thumbnails');
   const assetDir = path.join(__dirname, '..', 'public');
-  const playerInternalUrl = (process.env.PLAYER_INTERNAL_URL || process.env.PLAYER_BASE_URL || 'http://player:8081').replace(/\/$/, '');
+  const playerInternalUrl = (process.env.PLAYER_INTERNAL_URL || 'http://player:8081').replace(/\/$/, '');
   const bridgeInternalUrl = (process.env.BRIDGE_INTERNAL_URL || 'http://player-bridge:8090').replace(/\/$/, '');
   const webInternalUrl = (process.env.WEB_INTERNAL_URL || `http://127.0.0.1:${Number(process.env.WEB_PORT || 8080)}`).replace(/\/$/, '');
   const sessionCookieName = 'digital_signage_session';

src/web/lib/data-source-refresh.js

@@ -1,3 +1,5 @@
+// Refresh data sources and notify only the screens whose rendered data changed.
+
 async function getAffectedScreenSlugs(connection, common, slideMatchKey, sourceId) {
   const [slideRows] = await connection.query('SELECT id, content_json FROM c_slides WHERE content_json IS NOT NULL');
   const slideIds = [];
@@ -106,6 +108,24 @@ function hasApiSourceChanged(apiSource, responseDetails) {
   return normalizeSnapshotValue(apiSource && apiSource.last_response_json) !== normalizeSnapshotValue(responseDetails && responseDetails.responseJson);
 }
 
+function isDifferentHour(previousPulledAt, currentPulledAt) {
+  const previous = new Date(previousPulledAt);
+  const current = new Date(currentPulledAt);
+  if (!Number.isFinite(previous.getTime())) {
+    return false;
+  }
+
+  return previous.getFullYear() !== current.getFullYear()
+    || previous.getMonth() !== current.getMonth()
+    || previous.getDate() !== current.getDate()
+    || previous.getHours() !== current.getHours();
+}
+
+function hasWeatherLocationChanged(location, responseDetails, refreshedAt) {
+  return normalizeSnapshotValue(location && location.last_response_json) !== normalizeSnapshotValue(responseDetails && responseDetails.responseJson)
+    || isDifferentHour(location && location.last_pulled_at, refreshedAt);
+}
+
 async function refreshApiSource(pool, common, apiSourceOrId, actorId, notifyPlayerScreens) {
   const connection = await pool.getConnection();
   try {
@@ -169,16 +189,17 @@ async function refreshWeatherLocation(pool, common, weatherLocationOrId, actorId
       pullError = String(error && error.message ? error.message : 'Unable to load weather forecast.');
     }
 
+    const refreshedAt = new Date();
     await connection.beginTransaction();
     await connection.query(
       'UPDATE i_weather_locations SET last_pulled_at = ?, last_pull_error = ?, last_response_json = COALESCE(?, last_response_json), modified_by = ? WHERE id = ?',
-      [new Date(), pullError || null, result ? result.responseJson : null, actorId, location.id]
+      [refreshedAt, pullError || null, result ? result.responseJson : null, actorId, location.id]
     );
     await connection.commit();
 
     if (pullError) {
       console.error('[data-source-refresh] Weather location refresh completed with an error for location ' + location.id + ': ' + pullError);
-    } else if (typeof notifyAffectedScreens === 'function') {
+    } else if (hasWeatherLocationChanged(location, result, refreshedAt) && typeof notifyPlayerScreens === 'function') {
       try {
         await notifyAffectedScreens(connection, common, notifyPlayerScreens, 'weather_location_id', location.id);
       } catch (notifyError) {

src/web/lib/media/slide-thumbnails.js

@@ -184,6 +184,9 @@ function substitutePlaceholders(html, regionContent, options) {
     const resolved = typeof placeholderUtils.resolvePlaceholderExpression === 'function'
       ? placeholderUtils.resolvePlaceholderExpression(item, weatherExpression, { timeZone: item.timezone })
       : resolvePlaceholderPath(item, expression);
+    if (typeof placeholderUtils.isProgressPlaceholderExpression === 'function' && placeholderUtils.isProgressPlaceholderExpression(expression)) {
+      return placeholderUtils.renderProgressPlaceholder(item, expression);
+    }
     if (type === 'weather' && /(?:^|\.)weather_code\.\d+\.icon(?:\(|$)|^current\.weather_code\.icon/.test(weatherExpression)) {
       const codeExpression = weatherExpression.replace(/\.icon(?:\(.*\))?$/, '');
       const iconSize = String(expression).match(/\.icon\(\s*(\d+)(?:\s*,\s*(\d+))?\s*\)$/);

src/web/lib/media/upload-sync.js

@@ -36,22 +36,6 @@ function normalizeBaseUrl(value) {
   return String(value || '').trim().replace(/\/$/, '');
 }
 
-function appendPlayerDeviceIdToUrl(baseUrl, playerIdentifier) {
-  const targetBaseUrl = normalizeBaseUrl(baseUrl);
-  const deviceId = String(playerIdentifier || '').trim();
-  if (!targetBaseUrl || !deviceId) {
-    return targetBaseUrl;
-  }
-
-  try {
-    const url = new URL(targetBaseUrl);
-    url.searchParams.set('deviceId', deviceId);
-    return url.toString().replace(/\/$/, '');
-  } catch (_error) {
-    return targetBaseUrl;
-  }
-}
-
 function normalizePlayerRowBaseUrl(player) {
   return normalizeBaseUrl(player && player.internal_base_url);
 }
@@ -68,6 +52,7 @@ function createUploadSyncService(options) {
   const pool = options && options.pool;
   const common = options && options.common;
   const configuredPlayerInternalBaseUrl = String(options && options.playerInternalBaseUrl || '').replace(/\/$/, '');
+  const configuredBridgeInternalBaseUrl = String(options && options.bridgeInternalBaseUrl || '').trim().replace(/\/$/, '');
   const playerSnapshotCache = options && options.playerSnapshotCache;
   const notifyPlayerScreens = options && options.notifyPlayerScreens;
   const backgroundTaskQueue = options && options.backgroundTaskQueue;
@@ -389,6 +374,9 @@ function createUploadSyncService(options) {
       }
 
       const filePath = resolveUploadFilePath(uploadDir, uploadPath);
+      if (String(uploadPath || '').startsWith('/media/player-cache/')) {
+        continue;
+      }
       try {
         await fs.promises.unlink(filePath);
       } catch (error) {
@@ -432,10 +420,6 @@ function createUploadSyncService(options) {
         const nextRelativePath = relativeDir ? path.posix.join(relativeDir, entryName) : entryName;
         const nextAbsolutePath = path.join(currentDir, entryName);
 
-        if (!relativeDir && entryName === 'player-cache') {
-          continue;
-        }
-
         if (entry.isDirectory && entry.isDirectory()) {
           await walkDirectory(nextAbsolutePath, nextRelativePath);
           continue;
@@ -445,7 +429,11 @@ function createUploadSyncService(options) {
           continue;
         }
 
-        uploadPaths.push('/media/uploads/' + nextRelativePath.replace(/\\/g, '/'));
+        const normalizedRelativePath = nextRelativePath.replace(/\\/g, '/');
+        if (normalizedRelativePath.startsWith('player-cache/') && !normalizedRelativePath.startsWith('player-cache/remote-images/')) {
+          continue;
+        }
+        uploadPaths.push((normalizedRelativePath.startsWith('player-cache/') ? '/media/' : '/media/uploads/') + normalizedRelativePath);
       }
     }
 
@@ -542,6 +530,9 @@ function createUploadSyncService(options) {
     }
 
     const playerMetadata = await getPlayerTaskMetadata(preferredPlayerIdentifier, targetBaseUrl);
+    const mediaBaseUrl = playerMetadata && playerMetadata.playerIdentifier && !isLocalLikeBaseUrl(targetBaseUrl) && configuredBridgeInternalBaseUrl
+      ? configuredBridgeInternalBaseUrl
+      : targetBaseUrl;
     const relativePath = getUploadRelativePath(uploadPath);
     const sourcePath = resolveUploadFilePath(localUploadDir, uploadPath);
     if (!relativePath || !sourcePath) {
@@ -563,11 +554,13 @@ function createUploadSyncService(options) {
         pathname: `/api/media/${encodeURIComponent(relativePath)}`,
         body: fileBuffer
       });
-      const mediaUploadUrl = appendPlayerDeviceIdToUrl(`${targetBaseUrl}/api/media/${encodeURIComponent(relativePath)}`, playerMetadata && playerMetadata.playerIdentifier);
+      const mediaUploadUrl = `${mediaBaseUrl}/api/media/${encodeURIComponent(relativePath)}`;
+      const playerDeviceId = String(playerMetadata && playerMetadata.playerIdentifier || '').trim();
       const response = await fetch(mediaUploadUrl, {
         method: 'PUT',
         headers: {
           'Content-Type': 'application/octet-stream',
+          ...(playerDeviceId ? { 'x-pulse-player-device-id': playerDeviceId } : {}),
           ...authHeaders
         },
         body: fileBuffer
@@ -598,6 +591,9 @@ function createUploadSyncService(options) {
     }
 
     const playerMetadata = await getPlayerTaskMetadata(preferredPlayerIdentifier, targetBaseUrl);
+    const mediaBaseUrl = playerMetadata && playerMetadata.playerIdentifier && !isLocalLikeBaseUrl(targetBaseUrl) && configuredBridgeInternalBaseUrl
+      ? configuredBridgeInternalBaseUrl
+      : targetBaseUrl;
     const relativePath = getUploadRelativePath(uploadPath);
     if (!relativePath) {
       return false;
@@ -607,11 +603,13 @@ function createUploadSyncService(options) {
         method: 'DELETE',
         pathname: `/api/media/${encodeURIComponent(relativePath)}`
       });
-      const mediaDeleteUrl = appendPlayerDeviceIdToUrl(`${targetBaseUrl}/api/media/${encodeURIComponent(relativePath)}`, playerMetadata && playerMetadata.playerIdentifier);
+      const mediaDeleteUrl = `${mediaBaseUrl}/api/media/${encodeURIComponent(relativePath)}`;
+      const playerDeviceId = String(playerMetadata && playerMetadata.playerIdentifier || '').trim();
       const response = await fetch(mediaDeleteUrl, {
         method: 'DELETE',
         headers: {
           Accept: 'application/json',
+          ...(playerDeviceId ? { 'x-pulse-player-device-id': playerDeviceId } : {}),
           ...authHeaders
         }
       });
@@ -930,6 +928,12 @@ function createUploadSyncService(options) {
         });
       });
       const fontLibraryOperations = collectFontLibrarySyncOperations(uploadDir);
+      const generatedCachePaths = await collectUploadPathsFromDirectory(uploadDir);
+      generatedCachePaths.filter(function (uploadPath) {
+        return String(uploadPath || '').startsWith('/media/player-cache/remote-images/');
+      }).forEach(function (uploadPath) {
+        uploadRefs.add(uploadPath);
+      });
       Array.from(uploadRefs).forEach(function (uploadPath) {
         queuePlayerUploadSync({
           type: 'put',
@@ -957,8 +961,12 @@ function createUploadSyncService(options) {
     if (mode === 'playlist') {
       const operation = normalizePlaylistUploadSyncOperation(taskPayload.operation || taskPayload);
 
-      if (operation.nextUploadRefs.length) {
-        await syncUploadRefsToPlayer(operation.nextUploadRefs, operation.localUploadDir, taskPayload.playerIdentifier, taskPayload.playerInternalBaseUrl);
+      const generatedCachePaths = await collectUploadPathsFromDirectory(operation.localUploadDir);
+      const nextUploadRefs = operation.nextUploadRefs.concat(generatedCachePaths.filter(function (uploadPath) {
+        return String(uploadPath || '').startsWith('/media/player-cache/remote-images/');
+      }));
+      if (nextUploadRefs.length) {
+        await syncUploadRefsToPlayer(nextUploadRefs, operation.localUploadDir, taskPayload.playerIdentifier, taskPayload.playerInternalBaseUrl);
       }
 
       if (operation.previousUploadRefs.length) {

src/web/lib/notify-player-screens.js

@@ -1,4 +1,6 @@
-function createNotifyPlayerScreens(forwardPlayerCommand) {
+// Route screen refresh commands to the physical player hosting each screen.
+
+function createNotifyPlayerScreens(forwardPlayerCommand, getScreenConnections, forwardPlayerCommandToBaseUrl, resolvePlayerBaseUrl, forwardPlayerCommandToDevice) {
   if (typeof forwardPlayerCommand !== 'function') {
     throw new Error('createNotifyPlayerScreens requires a player command sender.');
   }
@@ -12,12 +14,47 @@ function createNotifyPlayerScreens(forwardPlayerCommand) {
       return Promise.resolve(0);
     }
 
-    return Promise.allSettled(uniqueSlugs.map(function (slug) {
+    return Promise.allSettled(uniqueSlugs.map(async function (slug) {
+      // A screen may have connections on multiple players after a remote move or reconnect.
+      if (typeof getScreenConnections === 'function' && typeof forwardPlayerCommandToBaseUrl === 'function') {
+        const screenState = await getScreenConnections(slug);
+        const connections = Array.isArray(screenState && screenState.connections) ? screenState.connections : [];
+        const deviceIds = Array.from(new Set(connections.map(function (connection) {
+          return String(connection && connection.playerDeviceId || '').trim();
+        }).filter(Boolean)));
+        const playerBaseUrls = Array.from(new Set(connections.map(function (connection) {
+          if (String(connection && connection.playerDeviceId || '').trim()) {
+            return '';
+          }
+          return String(connection && connection.playerPublicBaseUrl || '').trim().replace(/\/$/, '');
+        }).filter(Boolean)));
+        const deviceResults = deviceIds.length && typeof forwardPlayerCommandToDevice === 'function'
+          ? await Promise.all(deviceIds.map(function (deviceId) {
+            return forwardPlayerCommandToDevice(deviceId, {
+              command: commandOrPayload || 'refresh',
+              screenSlug: slug
+            });
+          }))
+          : [];
+        let baseUrlResults = [];
+        if (playerBaseUrls.length) {
+          const resolvedPlayerBaseUrls = typeof resolvePlayerBaseUrl === 'function'
+            ? await Promise.all(playerBaseUrls.map(function (playerBaseUrl) { return resolvePlayerBaseUrl(playerBaseUrl); }))
+            : playerBaseUrls;
+          baseUrlResults = await Promise.all(resolvedPlayerBaseUrls.filter(Boolean).map(function (playerBaseUrl) {
+            return forwardPlayerCommandToBaseUrl(playerBaseUrl, slug, commandOrPayload || 'refresh');
+          }));
+        }
+        if (deviceResults.length || baseUrlResults.length) {
+          return deviceResults.concat(baseUrlResults);
+        }
+      }
       return forwardPlayerCommand(slug, commandOrPayload || 'refresh');
     })).then(function (results) {
-      return results.filter(function (result) {
-        return result.status === 'fulfilled';
+      const successful = results.filter(function (result) {
+        return result.status === 'fulfilled' && (!result.value || result.value.ok !== false);
       }).length;
+      return successful;
     });
   };
 }

src/web/lib/player-actions.js

@@ -1,3 +1,5 @@
+// Commands and synchronization actions forwarded from the web app to players.
+
 const { createRequestAuthHeaders } = require('#src/request-auth');
 const { getConfiguredPlayerIdentifier } = require('#src/data/player-registry');
 
@@ -215,7 +217,49 @@ function createPlayerActionService(options) {
     return forwardPlayerCommandToBaseUrl(resolvedPlayerInternalBaseUrl, slug, commandOrPayload, connectionId);
   }
 
+  async function resolvePlayerBaseUrlForPublicUrl(playerPublicBaseUrl) {
+    const normalizedPublicBaseUrl = normalizeBaseUrl(playerPublicBaseUrl);
+    if (!normalizedPublicBaseUrl) {
+      return '';
+    }
+
+    try {
+      const players = await fetchPlayerRegistrations(pool);
+      const matchedPlayer = (Array.isArray(players) ? players : []).find(function (player) {
+        return normalizeBaseUrl(player && player.public_base_url) === normalizedPublicBaseUrl;
+      });
+      const registeredInternalBaseUrl = normalizeBaseUrl(matchedPlayer && matchedPlayer.internal_base_url);
+      if (registeredInternalBaseUrl) {
+        return registeredInternalBaseUrl;
+      }
+    } catch (_error) {
+    }
+
+    if (isLocalLikeBaseUrl(normalizedPublicBaseUrl) && configuredPlayerInternalBaseUrl) {
+      return configuredPlayerInternalBaseUrl;
+    }
+
+    return normalizedPublicBaseUrl;
+  }
+
   async function forwardAnnouncementRefresh(slug) {
+    try {
+      const screenState = await getScreenConnections(slug);
+      const deviceIds = Array.from(new Set((screenState && Array.isArray(screenState.connections) ? screenState.connections : []).map(function (connection) {
+        return String(connection && connection.playerDeviceId || '').trim();
+      }).filter(Boolean)));
+      if (deviceIds.length) {
+        const deviceResults = await Promise.all(deviceIds.map(function (deviceId) {
+          return forwardPlayerCommandToDevice(deviceId, {
+            command: 'announcement-refresh',
+            screenSlug: slug
+          });
+        }));
+        return deviceResults;
+      }
+    } catch (_error) {
+    }
+
     const resolvedPlayerInternalBaseUrl = await getPlayerInternalBaseUrl();
     const targetBaseUrls = Array.from(new Set([
       resolvedPlayerInternalBaseUrl,
@@ -367,6 +411,7 @@ function createPlayerActionService(options) {
 
   return {
     forwardPlayerCommand: forwardPlayerCommand,
+    resolvePlayerBaseUrlForPublicUrl: resolvePlayerBaseUrlForPublicUrl,
     forwardAnnouncementRefresh: forwardAnnouncementRefresh,
     getScreenConnections: getScreenConnections,
     forwardPlayerCommandToBaseUrl: forwardPlayerCommandToBaseUrl,

src/web/lib/region-scripts.js

@@ -1,3 +1,5 @@
+// Load and normalize browser region scripts for server-rendered player pages.
+
 const fs = require('fs');
 const path = require('path');
 

src/web/lib/web-startup.js

@@ -1,3 +1,5 @@
+// Start background services, scheduled tasks, and web application dependencies.
+
 async function initializeWebServer(options) {
   const common = options && options.common;
   const pool = options && options.pool;

src/web/middleware.js

@@ -29,7 +29,7 @@ module.exports = function registerMiddleware(app, deps) {
   });
 
   app.use(function (req, res, next) {
-    if (req.path === '/' || req.path === '/login' || req.path === '/logout' || req.path === '/slides/popup-preview' || req.path.indexOf('/api/internal/slide-thumbnails/') === 0 || req.path === '/api/internal/sync/player-media' || req.path === '/api/internal/sync/player-font') {
+    if (req.path === '/' || req.path === '/login' || req.path === '/logout' || req.path === '/forgot-password' || req.path === '/reset-password' || req.path === '/verify-email' || req.path === '/slides/popup-preview' || req.path.indexOf('/api/internal/slide-thumbnails/') === 0 || req.path === '/api/internal/sync/player-media' || req.path === '/api/internal/sync/player-font') {
       return next();
     }
 

src/web/pages/index.js

@@ -8,11 +8,18 @@ function routePath(...segments) {
 
 module.exports = {
   renderLoginPage: require(routePath('auth', 'login')),
+  renderForgotPasswordPage: require(routePath('auth', 'forgot-password')),
+  renderResetPasswordPage: require(routePath('auth', 'reset-password')),
+  renderAcceptInvitePage: require(routePath('auth', 'accept-invite')),
+  renderEmailVerifiedPage: require(routePath('auth', 'email-verified')),
+  renderEmailVerificationErrorPage: require(routePath('auth', 'email-verification-error')),
   renderAccountPage: require(routePath('account', 'password')),
   renderSettingsPage: require(routePath('settings', 'index')),
   renderAboutPage: require(routePath('settings', 'about', 'index')),
   renderUsersPage: require(routePath('settings', 'users', 'list')),
+  renderInvitationsPage: require(routePath('settings', 'invitations', 'list')),
   renderUsersAddPage: require(routePath('settings', 'users', 'add')),
+  renderUsersInvitePage: require(routePath('settings', 'users', 'invite')),
   renderUsersEditPage: require(routePath('settings', 'users', 'edit')),
   renderDashboardPage: require(routePath('signage', 'dashboard', 'index')),
   renderConnectedClientsPage: require(routePath('signage', 'clients', 'list')),

src/web/public/adminlte/css/adminlte-colors.min.css

@@ -1,5 +1,5 @@
 @charset "UTF-8";/*!
- *   AdminLTE v4.8.5 — Extended color palette
+ *   AdminLTE v4.9.1 — Extended color palette
  *   Opt-in. Nothing here is in adminlte.css: load this sheet after it and you
  *   get fourteen additional colours (orange, amber, olive, teal, sky, indigo,
  *   violet, fuchsia, pink, navy, steel, slate, graphite, midnight) as `--bs-*`

src/web/public/adminlte/js/adminlte.min.js

@@ -1,5 +1,5 @@
 /*!
- * AdminLTE v4.3.1 (https://adminlte.io)
+ * AdminLTE v4.9.1 (https://adminlte.io)
  * Copyright 2014-2026 Colorlib <https://colorlib.com>
  * Licensed under MIT (https://github.com/ColorlibHQ/AdminLTE/blob/master/LICENSE)
  */

src/web/public/js/account/account-page.js

@@ -0,0 +1,56 @@
+(function () {
+  var currentPasswordInput = document.querySelector('[data-account-current-password]');
+  var profileFormInput = document.querySelector('[data-account-profile-current-password]');
+  var passwordFormInput = document.querySelector('[data-account-password-current-password]');
+  var profileForm = profileFormInput && profileFormInput.form;
+  var passwordForm = passwordFormInput && passwordFormInput.form;
+
+  if (!currentPasswordInput || !profileFormInput || !passwordFormInput || !profileForm || !passwordForm) {
+    return;
+  }
+
+  function syncCurrentPassword() {
+    profileFormInput.value = currentPasswordInput.value;
+    passwordFormInput.value = currentPasswordInput.value;
+  }
+
+  function clearCurrentPassword() {
+    currentPasswordInput.value = '';
+    currentPasswordInput.setCustomValidity('');
+    currentPasswordInput.removeAttribute('required');
+    profileFormInput.value = '';
+    passwordFormInput.value = '';
+    passwordForm.querySelectorAll('input[type="password"]').forEach(function (input) {
+      input.value = '';
+      input.setCustomValidity('');
+    });
+    profileForm.classList.remove('was-validated');
+    passwordForm.classList.remove('was-validated');
+  }
+
+  currentPasswordInput.addEventListener('input', syncCurrentPassword);
+  currentPasswordInput.addEventListener('input', function () {
+    currentPasswordInput.setCustomValidity('');
+  });
+  document.addEventListener('submit', function (event) {
+    if (event.target !== profileForm && event.target !== passwordForm) {
+      return;
+    }
+    if (!currentPasswordInput.value) {
+      event.preventDefault();
+      event.stopImmediatePropagation();
+      currentPasswordInput.setCustomValidity('Current password is required.');
+      currentPasswordInput.reportValidity();
+      return;
+    }
+    currentPasswordInput.setCustomValidity('');
+    syncCurrentPassword();
+  }, true);
+  passwordForm.addEventListener('submit', syncCurrentPassword);
+  document.addEventListener('web-async-save:success', function (event) {
+    if (event.detail && event.detail.form !== profileForm && event.detail.form !== passwordForm) {
+      return;
+    }
+    clearCurrentPassword();
+  });
+})();

src/web/public/js/admin/admin-page.js

@@ -969,8 +969,11 @@
       }
 
       if (typeof rawJson !== 'string' || !rawJson.trim()) {
-        if (button) {
-          button.classList.add('d-none');
+        if (collapseButton) {
+          collapseButton.classList.add('d-none');
+        }
+        if (expandButton) {
+          expandButton.classList.add('d-none');
         }
         return;
       }
@@ -979,8 +982,11 @@
       try {
         parsedJson = JSON.parse(rawJson);
       } catch (_error) {
-        if (button) {
-          button.classList.add('d-none');
+        if (collapseButton) {
+          collapseButton.classList.add('d-none');
+        }
+        if (expandButton) {
+          expandButton.classList.add('d-none');
         }
         return;
       }

src/web/public/js/dashboard/dashboard-page.js

@@ -35,7 +35,7 @@
   function getSelectedScreenClients(state) {
     var select = getScreenCommandSelect();
     var selectedSlug = select ? String(select.value || '').trim() : '';
-    var clients = Array.isArray(state && state.clients) ? state.clients : [];
+    var clients = state && Array.isArray(state.clients) ? state.clients : [];
 
     if (!selectedSlug || selectedSlug === '__all__') {
       return clients;
@@ -72,9 +72,13 @@
     var allBlackout = hasClients && clients.every(function (client) {
       return Boolean(client && client.blackout);
     });
+    var isClientsMobile = Boolean(document.querySelector('.clients-screen-command-card'));
+    var useShortMobileLabels = isClientsMobile && window.innerWidth < 768;
 
     if (action === 'pause') {
-      var pauseLabel = allPaused ? 'Resume ' + (isAllScreens ? 'all clients' : 'screen') : 'Pause ' + (isAllScreens ? 'all clients' : 'screen');
+      var pauseLabel = useShortMobileLabels
+        ? (allPaused ? 'Resume' : 'Pause')
+        : (allPaused ? 'Resume ' + (isAllScreens ? 'all clients' : 'screen') : 'Pause ' + (isAllScreens ? 'all clients' : 'screen'));
       var pauseConfirm = allPaused ? 'Resume ' + (isAllScreens ? 'all connected clients' : selectedLabel) + '?' : 'Pause ' + (isAllScreens ? 'all connected clients' : selectedLabel) + '?';
       var pauseIcon = allPaused ? 'bi-play-fill' : 'bi-pause-fill';
       button.innerHTML = '<i class="bi ' + pauseIcon + ' me-1" aria-hidden="true"></i>' + escapeHtml(pauseLabel);
@@ -92,7 +96,9 @@
     }
 
     if (action === 'blackout') {
-      var blackoutLabel = allBlackout ? 'Restore ' + (isAllScreens ? 'all clients' : 'screen') : 'Blackout ' + (isAllScreens ? 'all clients' : 'screen');
+      var blackoutLabel = useShortMobileLabels
+        ? (allBlackout ? 'Restore' : 'Blackout')
+        : (allBlackout ? 'Restore ' + (isAllScreens ? 'all clients' : 'screen') : 'Blackout ' + (isAllScreens ? 'all clients' : 'screen'));
       var blackoutConfirm = allBlackout ? 'Restore ' + (isAllScreens ? 'all connected clients' : selectedLabel) + '?' : 'Blackout ' + (isAllScreens ? 'all connected clients' : selectedLabel) + '?';
       var blackoutIcon = allBlackout ? 'bi-eye' : 'bi-eye-slash';
       button.innerHTML = '<i class="bi ' + blackoutIcon + ' me-1" aria-hidden="true"></i>' + escapeHtml(blackoutLabel);
@@ -147,6 +153,9 @@
       }
 
       if (button) {
+        if (Boolean(document.querySelector('.clients-screen-command-card')) && window.innerWidth < 768) {
+          button.innerHTML = '<i class="bi bi-arrow-repeat me-1" aria-hidden="true"></i>Reload';
+        }
         button.setAttribute('aria-label', selectedName ? selectedName : 'Selected screen group');
       }
     });
@@ -336,15 +345,16 @@
     var blackoutButtonLabel = blackout ? 'Restore client' : 'Blackout client';
     var blackoutButtonText = blackout ? 'Restore' : 'Blackout';
     var reloadConfirmMessage = 'Reloading will restart the player page. Continue?';
+    var commandTargetId = client.clientId || client.id || '';
 
     return [
       '<div class="actions justify-content-end">',
-      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-confirm-message="' + escapeHtml(reloadConfirmMessage) + '" data-async-command><input type="hidden" name="command" value="reload" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="btn btn-sm btn-danger" data-action="reload" aria-label="Reload client" title="Reload client"><i class="bi bi-arrow-repeat" aria-hidden="true"></i></button></form>',
+      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-confirm-message="' + escapeHtml(reloadConfirmMessage) + '" data-async-command><input type="hidden" name="command" value="reload" /><input type="hidden" name="connectionId" value="' + escapeHtml(commandTargetId) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="btn btn-sm btn-danger" data-action="reload" aria-label="Reload client" title="Reload client"><i class="bi bi-arrow-repeat" aria-hidden="true"></i></button></form>',
       '<button type="button" class="btn btn-sm btn-danger" data-action="move-screen" aria-label="Move client to another screen" title="Move client to another screen"><i class="bi bi-display" aria-hidden="true"></i></button>',
-      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="previous" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="btn btn-sm btn-warning" data-action="previous" aria-label="Previous slide" title="Previous slide"><i class="bi bi-skip-backward-fill" aria-hidden="true"></i></button></form>',
-      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="next" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="btn btn-sm btn-warning" data-action="next" aria-label="Next slide" title="Next slide"><i class="bi bi-skip-forward-fill" aria-hidden="true"></i></button></form>',
-      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="pause" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="' + pauseButtonClass + '" data-action="pause" aria-label="' + pauseButtonLabel + '" title="' + pauseButtonLabel + '"><i class="bi ' + pauseButtonIcon + ' me-1" aria-hidden="true"></i>' + pauseButtonText + '</button></form>',
-      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="blackout" /><input type="hidden" name="blackout" value="' + (blackout ? 'false' : 'true') + '" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="' + blackoutButtonClass + '" data-action="blackout" aria-label="' + blackoutButtonLabel + '" title="' + blackoutButtonLabel + '"><i class="bi ' + blackoutButtonIcon + ' me-1" aria-hidden="true"></i>' + blackoutButtonText + '</button></form>',
+      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="previous" /><input type="hidden" name="connectionId" value="' + escapeHtml(commandTargetId) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="btn btn-sm btn-warning" data-action="previous" aria-label="Previous slide" title="Previous slide"><i class="bi bi-skip-backward-fill" aria-hidden="true"></i></button></form>',
+      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="next" /><input type="hidden" name="connectionId" value="' + escapeHtml(commandTargetId) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="btn btn-sm btn-warning" data-action="next" aria-label="Next slide" title="Next slide"><i class="bi bi-skip-forward-fill" aria-hidden="true"></i></button></form>',
+      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="pause" /><input type="hidden" name="connectionId" value="' + escapeHtml(commandTargetId) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="' + pauseButtonClass + '" data-action="pause" aria-label="' + pauseButtonLabel + '" title="' + pauseButtonLabel + '"><i class="bi ' + pauseButtonIcon + ' me-1" aria-hidden="true"></i>' + pauseButtonText + '</button></form>',
+      '<form method="post" action="/clients/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="blackout" /><input type="hidden" name="blackout" value="' + (blackout ? 'false' : 'true') + '" /><input type="hidden" name="connectionId" value="' + escapeHtml(commandTargetId) + '" /><input type="hidden" name="playerBaseUrl" value="' + escapeHtml(client.player_url || '') + '" /><button type="submit" class="' + blackoutButtonClass + '" data-action="blackout" aria-label="' + blackoutButtonLabel + '" title="' + blackoutButtonLabel + '"><i class="bi ' + blackoutButtonIcon + ' me-1" aria-hidden="true"></i>' + blackoutButtonText + '</button></form>',
       '</div>'
     ].join('');
   }
@@ -368,10 +378,10 @@
     }
 
     var currentScreenSlug = String(row.getAttribute('data-client-screen-slug') || '').trim();
-    var connectionId = String(row.getAttribute('data-client-id') || '').trim();
+    var connectionId = String(row.getAttribute('data-client-client-id') || row.getAttribute('data-client-id') || '').trim();
     var clientId = String(row.getAttribute('data-client-client-id') || '').trim();
     var playerBaseUrl = String(row.getAttribute('data-client-player-base-url') || '').trim();
-    var clientNameCell = row.querySelector('td[data-label="Client"] > div');
+    var clientNameCell = row.querySelector('td[data-label="Client"] > div, [data-mobile-client-name]');
     var clientName = String(clientNameCell && clientNameCell.textContent || '').trim();
     var options = Array.prototype.slice.call(elements.targetSelect.options || []);
 
@@ -428,7 +438,7 @@
       }
       var connectionInput = pauseForm.querySelector('input[name="connectionId"]');
       if (connectionInput) {
-        connectionInput.value = client.id || '';
+        connectionInput.value = client.clientId || client.id || '';
       }
       var playerBaseUrlInput = pauseForm.querySelector('input[name="playerBaseUrl"]');
       if (playerBaseUrlInput) {
@@ -447,7 +457,7 @@
       if (reloadForm) {
         var reloadInput = reloadForm.querySelector('input[name="connectionId"]');
         if (reloadInput) {
-          reloadInput.value = client.id || '';
+          reloadInput.value = client.clientId || client.id || '';
         }
         var reloadPlayerBaseUrlInput = reloadForm.querySelector('input[name="playerBaseUrl"]');
         if (reloadPlayerBaseUrlInput) {
@@ -483,7 +493,7 @@
       }
       var blackoutConnectionInput = blackoutForm.querySelector('input[name="connectionId"]');
       if (blackoutConnectionInput) {
-        blackoutConnectionInput.value = client.id || '';
+        blackoutConnectionInput.value = client.clientId || client.id || '';
       }
       var blackoutPlayerBaseUrlInput = blackoutForm.querySelector('input[name="playerBaseUrl"]');
       if (blackoutPlayerBaseUrlInput) {
@@ -508,7 +518,7 @@
       }
       var previousConnectionInput = previousForm.querySelector('input[name="connectionId"]');
       if (previousConnectionInput) {
-        previousConnectionInput.value = client.id || '';
+        previousConnectionInput.value = client.clientId || client.id || '';
       }
       var previousPlayerBaseUrlInput = previousForm.querySelector('input[name="playerBaseUrl"]');
       if (previousPlayerBaseUrlInput) {
@@ -533,7 +543,7 @@
       }
       var nextConnectionInput = nextForm.querySelector('input[name="connectionId"]');
       if (nextConnectionInput) {
-        nextConnectionInput.value = client.id || '';
+        nextConnectionInput.value = client.clientId || client.id || '';
       }
       var nextPlayerBaseUrlInput = nextForm.querySelector('input[name="playerBaseUrl"]');
       if (nextPlayerBaseUrlInput) {
@@ -825,7 +835,7 @@
     if (typeof elements.modal.addEventListener === 'function') {
       elements.modal.addEventListener('show.bs.modal', function (event) {
         var trigger = event && event.relatedTarget ? event.relatedTarget : null;
-        var row = trigger && trigger.closest ? trigger.closest('tr[data-client-key]') : null;
+        var row = trigger && trigger.closest ? trigger.closest('tr[data-client-key], article[data-mobile-client-key]') : null;
         if (row) {
           updateClientMoveModalFromRow(row);
         }
@@ -842,7 +852,7 @@
         event.preventDefault();
       }
 
-      var row = moveButton.closest ? moveButton.closest('tr[data-client-key]') : null;
+      var row = moveButton.closest ? moveButton.closest('tr[data-client-key], article[data-mobile-client-key]') : null;
       if (!row) {
         return;
       }
@@ -1037,6 +1047,60 @@
     blackoutButton.setAttribute('aria-label', label);
   }
 
+  function updateMobileClientCards(state) {
+    document.querySelectorAll('[data-mobile-client-id]').forEach(function (card) {
+      var id = String(card.getAttribute('data-mobile-client-id') || '').trim();
+      var clientId = String(card.getAttribute('data-mobile-client-client-id') || '').trim();
+      var client = (state.clients || []).find(function (candidate) {
+        return String(candidate.id || '').trim() === id || String(candidate.clientId || '').trim() === clientId;
+      });
+      if (!client) {
+        return;
+      }
+      var paused = Boolean(client.paused);
+      var blackout = Boolean(client.blackout);
+      var badge = card.querySelector('.badge');
+      var heading = card.querySelector('h4');
+      var details = card.querySelectorAll('.clients-mobile-client-details strong');
+      var pauseButton = card.querySelector('button[type="submit"].btn-info');
+      var blackoutButton = card.querySelector('button[type="submit"].btn-secondary, button[type="submit"].btn-success');
+      card.setAttribute('data-client-screen-slug', client.screen_slug || '');
+      card.setAttribute('data-client-client-id', client.clientId || client.id || '');
+      card.setAttribute('data-client-player-base-url', client.player_url || '');
+      card.classList.toggle('card-warning', paused);
+      card.classList.toggle('card-primary', !paused);
+      if (badge) {
+        badge.className = 'badge ' + (blackout ? 'text-bg-secondary' : paused ? 'text-bg-warning' : 'text-bg-success');
+        badge.textContent = blackout ? 'Blackout' : paused ? 'Paused' : 'Live';
+      }
+      if (heading) {
+        heading.textContent = client.client_name || 'Unknown';
+      }
+      if (details[0]) {
+        details[0].textContent = client.screen_name || client.screen_slug || 'Unknown';
+      }
+      if (details[1]) {
+        details[1].textContent = client.currentSlideTitle || 'No slide currently showing';
+      }
+      if (pauseButton) {
+        pauseButton.innerHTML = '<i class="bi ' + (paused ? 'bi-play-fill' : 'bi-pause-fill') + ' me-1" aria-hidden="true"></i>' + (paused ? 'Resume' : 'Pause');
+      }
+      if (blackoutButton) {
+        blackoutButton.innerHTML = '<i class="bi ' + (blackout ? 'bi-eye' : 'bi-eye-slash') + ' me-1" aria-hidden="true"></i>' + (blackout ? 'Restore' : 'Blackout');
+        blackoutButton.className = 'btn btn-sm ' + (blackout ? 'btn-success' : 'btn-secondary') + ' w-100';
+      }
+      card.querySelectorAll('form').forEach(function (form) {
+        var connectionInput = form.querySelector('input[name="connectionId"]');
+        var baseUrlInput = form.querySelector('input[name="playerBaseUrl"]');
+        if (connectionInput) connectionInput.value = client.clientId || client.id || '';
+        if (baseUrlInput) baseUrlInput.value = client.player_url || '';
+        form.action = '/clients/' + encodeURIComponent(client.screen_slug || '') + '/commands';
+        var blackoutInput = form.querySelector('input[name="blackout"]');
+        if (blackoutInput) blackoutInput.value = blackout ? 'false' : 'true';
+      });
+    });
+  }
+
   function handleDashboardState(state) {
     if (!state) {
       return;
@@ -1046,6 +1110,7 @@
     updateStats(state);
     updateScreenGrid(state);
     updateClientTable(state);
+    updateMobileClientCards(state);
     updateKioskLauncherModal(state);
     updateDashboardQuickActions(state);
     updateScreenCommandControls();
@@ -1141,10 +1206,24 @@
       return;
     }
 
+    document.querySelectorAll('article[data-mobile-client-key] .clients-mobile-client-actions').forEach(function (actions) {
+      if (actions.querySelector('button[data-action="move-screen"]')) {
+        return;
+      }
+      var button = document.createElement('button');
+      button.type = 'button';
+      button.className = 'btn btn-sm btn-danger';
+      button.setAttribute('data-action', 'move-screen');
+      button.setAttribute('aria-label', 'Change screen');
+      button.setAttribute('title', 'Change screen');
+      button.innerHTML = '<i class="bi bi-display" aria-hidden="true"></i>';
+      actions.insertBefore(button, actions.children[1] || null);
+    });
+
     if (typeof elements.modal.addEventListener === 'function') {
       elements.modal.addEventListener('show.bs.modal', function (event) {
         var trigger = event && event.relatedTarget ? event.relatedTarget : null;
-        var row = trigger && trigger.closest ? trigger.closest('tr[data-client-key]') : null;
+        var row = trigger && trigger.closest ? trigger.closest('tr[data-client-key], article[data-mobile-client-key]') : null;
         if (row) {
           updateClientMoveModalFromRow(row);
         }
@@ -1161,7 +1240,7 @@
         event.preventDefault();
       }
 
-      var row = moveButton.closest ? moveButton.closest('tr[data-client-key]') : null;
+      var row = moveButton.closest ? moveButton.closest('tr[data-client-key], article[data-mobile-client-key]') : null;
       if (!row) {
         return;
       }

src/web/public/js/data-sources/api-source-form.js

@@ -7,6 +7,7 @@
   }
 
   var methodSelect = form.querySelector('[data-api-source-auth-method]');
+  var authCard = form.querySelector('[data-api-source-auth-card]');
   var authDetailsSection = form.querySelector('[data-api-source-auth-details-section]');
   var panels = Array.prototype.slice.call(form.querySelectorAll('[data-api-source-auth-panel]'));
   var bearerTokenInput = form.querySelector('[data-api-source-bearer-token-input]');
@@ -36,10 +37,20 @@
     bearerTokenInput.focus();
   }
 
-  function updatePanels() {
+  function updatePanels(shouldExpandAuth) {
     var method = String(methodSelect && methodSelect.value || 'none').trim();
     var hasAuth = method !== 'none';
 
+    if (authCard) {
+      authCard.hidden = !hasAuth;
+      if (shouldExpandAuth && hasAuth && authCard.classList.contains('collapsed-card')) {
+        var collapseButton = authCard.querySelector('[data-lte-toggle="card-collapse"]');
+        if (collapseButton) {
+          collapseButton.click();
+        }
+      }
+    }
+
     if (authDetailsSection) {
       authDetailsSection.hidden = !hasAuth;
     }
@@ -60,7 +71,9 @@
   }
 
   if (methodSelect) {
-    methodSelect.addEventListener('change', updatePanels);
+    methodSelect.addEventListener('change', function () {
+      updatePanels(true);
+    });
   }
 
   if (requestMethodSelect) {
@@ -72,6 +85,6 @@
     updateBearerTokenToggle();
   }
 
-  updatePanels();
+  updatePanels(false);
   updateRequestBodyVisibility();
 }());

src/web/public/js/onboarding/pair.js

@@ -44,6 +44,27 @@
     lines.push(new Date().toISOString().slice(11, 19) + ' ' + value);
     scannerDebugOutput.textContent = lines.slice(-8).join('\n');
   }
+  function wait(milliseconds) {
+    return new Promise(function (resolve) { window.setTimeout(resolve, milliseconds); });
+  }
+  function submitPairing(body, attempt) {
+    return fetch(form.action, {
+      method: 'POST',
+      headers: { 'Accept': 'application/json', 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8' },
+      body: body
+    }).then(function (response) {
+      return response.text().then(function (text) {
+        var payload = null;
+        try { payload = JSON.parse(text); } catch (_error) {}
+        var transientCodeError = response.status === 401 && payload && String(payload.error || '').indexOf('valid kiosk pairing code') !== -1;
+        var transientTransportError = [502, 503, 504].indexOf(response.status) !== -1;
+        if ((!response.ok && (transientCodeError || transientTransportError)) && attempt < 2) {
+          return wait(300 * (attempt + 1)).then(function () { return submitPairing(body, attempt + 1); });
+        }
+        return { response: response, payload: payload };
+      });
+    });
+  }
 
   var codeInputs = codeInputsContainer ? Array.prototype.slice.call(codeInputsContainer.querySelectorAll('[data-pairing-code-input]')) : [];
   function normalizeCode(value) {
@@ -321,28 +342,21 @@
       if (firstEmptyInput) { firstEmptyInput.focus(); }
       return;
     }
-    message.className = 'alert alert-info';
-    message.textContent = 'Pairing player...';
+    message.className = 'alert d-none';
+    message.textContent = '';
     var pairingBody = new URLSearchParams(new FormData(form)).toString();
     if (pairingCard) { pairingCard.classList.add('is-pairing'); }
     if (pairingProgress) { pairingProgress.classList.remove('d-none'); }
     Array.prototype.slice.call(form.elements).forEach(function (element) {
       if (element !== anotherButton && element !== manualButton) { element.disabled = true; }
     });
-    fetch(form.action, {
-      method: 'POST',
-      headers: { 'Accept': 'application/json', 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8' },
-      body: pairingBody
-    }).then(function (response) {
-      return response.text().then(function (text) {
-        var payload = null;
-        try { payload = JSON.parse(text); } catch (_error) {}
+    submitPairing(pairingBody, 0).then(function (result) {
+        var response = result.response;
+        var payload = result.payload;
         if (!response.ok) {
           throw new Error(payload && payload.error ? payload.error : 'Unable to pair player.');
         }
         if (payload && payload.queued) {
-          message.className = 'alert alert-info';
-          message.textContent = 'Pairing is still being completed. Keep this page open and wait for confirmation.';
           return;
         }
         message.className = 'alert alert-success';
@@ -363,7 +377,6 @@
         }
         if (anotherButtonLabel) { anotherButtonLabel.classList.remove('d-none'); }
         if (manualButton) { manualButton.classList.remove('d-none'); }
-      });
     }).catch(function (error) {
       if (pairingCard) { pairingCard.classList.remove('is-pairing'); }
       if (pairingProgress) { pairingProgress.classList.add('d-none'); }

src/web/public/js/regions/type/api.js

@@ -106,6 +106,9 @@
       }
 
       var resolved = placeholderUtils.resolvePlaceholderExpression(item, expression);
+      if (typeof placeholderUtils.isProgressPlaceholderExpression === 'function' && placeholderUtils.isProgressPlaceholderExpression(expression)) {
+        return placeholderUtils.renderProgressPlaceholder(item, expression);
+      }
       if (typeof placeholderUtils.isImagePlaceholderExpression === 'function' && placeholderUtils.isImagePlaceholderExpression(expression)) {
         var imageSource = placeholderUtils.formatPlaceholderValue(resolved);
         if (!/^(?:https?:\/\/|\/media\/|\/assets\/|\/[^/])/i.test(imageSource)) {
@@ -164,8 +167,11 @@
         '<div class="offcanvas-body">' +
           '<p class="small text-body-secondary">Placeholders read values from the selected API item. Nested fields use dots.</p>' +
           (window.placeholderInfo ? window.placeholderInfo.renderTextTransforms() : '') +
+          (window.placeholderInfo ? window.placeholderInfo.renderMathTransforms() : '') +
           (window.placeholderInfo ? window.placeholderInfo.renderDateFormatTokens() : '') +
           (window.placeholderInfo ? window.placeholderInfo.renderImageTransform() : '') +
+          '<h3 class="fs-6 mt-4 fw-normal">Progress bar</h3>' +
+          '<p class="small">Use <code>{{progress(current,total,success,light,striped,animated,textless)}}</code> to render a configurable bar, or use start and end date/time fields such as <code>{{progress(start_datetime,end_datetime)}}</code> to show elapsed time. The first color controls the bar and the second controls its background. Choose AdminLTE or announcement colors such as <code>orange</code> or <code>midnight</code>, a hex color, <code>striped</code>, <code>animated</code>, or <code>textless</code> in any order. Set the radius with <code>square</code>, <code>pill</code>, or <code>radius(12px)</code>. The bar height follows the API region text size, and all options after the two field paths are optional.</p>' +
         '</div>' +
       '</div>';
   }

src/web/public/js/regions/type/rss.js

@@ -125,6 +125,9 @@
         return '';
       }
       var resolved = placeholderUtils.resolvePlaceholderExpression(item, expression);
+      if (typeof placeholderUtils.isProgressPlaceholderExpression === 'function' && placeholderUtils.isProgressPlaceholderExpression(expression)) {
+        return placeholderUtils.renderProgressPlaceholder(item, expression);
+      }
       if (typeof placeholderUtils.isImagePlaceholderExpression === 'function' && placeholderUtils.isImagePlaceholderExpression(expression)) {
         var imageSource = placeholderUtils.formatPlaceholderValue(resolved);
         if (!/^(?:https?:\/\/|\/media\/|\/assets\/|\/[^/])/i.test(imageSource)) {
@@ -224,6 +227,7 @@
       '<h3 class="fs-6 mt-4 fw-normal">Placeholder paths</h3>' +
       '<p class="small">Nested values use dots. Missing values render as empty text.</p>' +
       (window.placeholderInfo ? window.placeholderInfo.renderTextTransforms() : '') +
+      (window.placeholderInfo ? window.placeholderInfo.renderMathTransforms() : '') +
       '<h3 class="fs-6 mt-4 fw-normal">Date formatting</h3>' +
       '<p class="small">Use <code>format("MMM D, YYYY")</code> with date fields. Use <code>tz()</code> for a short timezone name and <code>tz_long()</code> for the full timezone name.</p>' +
       (window.placeholderInfo ? window.placeholderInfo.renderDateFormatTokens() : '') +

src/web/public/js/regions/type/timetable.js

@@ -140,6 +140,9 @@
 
     if (placeholderUtils && typeof placeholderUtils.resolvePlaceholderExpression === 'function' && typeof placeholderUtils.formatPlaceholderValue === 'function') {
       return source.replace(/\{\{\s*([^{}]+?)\s*\}\}/g, function (_match, expression) {
+        if (typeof placeholderUtils.isProgressPlaceholderExpression === 'function' && placeholderUtils.isProgressPlaceholderExpression(expression)) {
+          return placeholderUtils.renderProgressPlaceholder(context, expression);
+        }
         return escapeHtml(placeholderUtils.formatPlaceholderValue(placeholderUtils.resolvePlaceholderExpression(context, expression)));
       });
     }
@@ -248,6 +251,7 @@
       '<h3 class="fs-6 mt-4 fw-normal">Placeholder paths</h3>' +
       '<p class="small">Use the available field chips. Nested values use dots, and missing values render as empty text.</p>' +
       window.placeholderInfo.renderTextTransforms() +
+      window.placeholderInfo.renderMathTransforms() +
       '<h3 class="fs-6 mt-4 fw-normal">Date and time formatting</h3>' +
       '<p class="small">Use <code>format("MMM D, YYYY h:mm A")</code> with date fields. Use <code>tz()</code> for a short timezone name and <code>tz_long()</code> for the full timezone name.</p>' +
       window.placeholderInfo.renderDateFormatTokens() +

src/web/public/js/regions/type/weather.js

@@ -114,6 +114,9 @@
       if (!value || typeof value !== 'object' || typeof placeholderUtils.resolvePlaceholderExpression !== 'function' || typeof placeholderUtils.formatPlaceholderValue !== 'function') return '';
       var rawExpression = String(expression).trim();
       var normalizedExpression = normalizeWeatherExpression(rawExpression);
+      if (typeof placeholderUtils.isProgressPlaceholderExpression === 'function' && placeholderUtils.isProgressPlaceholderExpression(rawExpression)) {
+        return placeholderUtils.renderProgressPlaceholder(value, rawExpression);
+      }
       var iconMatch = normalizedExpression.match(/^(?:current\.weather_code|daily\.weather_code\.\d+|hourly\.weather_code\.\d+)\.icon(?:\((\d+)(?:\s*,\s*(\d+))?\))?$/);
       if (iconMatch) {
         var codeExpression = normalizedExpression.replace(/\.icon(?:\(.*\))?$/, '');
@@ -137,6 +140,7 @@
         '<div class="offcanvas-body"><p class="small text-body-secondary">Placeholders read values from the selected weather snapshot. Nested fields use dots.</p>' +
           '<h3 class="h6 mt-3">Weather icons</h3><p class="small text-body-secondary">Use the icon property to insert a Bootstrap weather icon. Add width and height in pixels when sizing is needed.</p><ul class="small"><li><code>{{current.icon}}</code></li><li><code>{{current.icon(48,48)}}</code></li><li><code>{{daily.0.icon(32,24)}}</code></li></ul>' +
           (window.placeholderInfo ? window.placeholderInfo.renderTextTransforms() : '') +
+          (window.placeholderInfo ? window.placeholderInfo.renderMathTransforms() : '') +
           (window.placeholderInfo ? window.placeholderInfo.renderDateFormatTokens() : '') +
         '</div>' +
       '</div>';

src/web/public/js/settings/settings-page.js

@@ -384,9 +384,111 @@
     setActiveSection(initialSection);
   }
 
+  function initEmailTemplatePreviews() {
+    var previewUser = document.querySelector('[data-email-preview-user]');
+    var signedInUser = {
+      username: previewUser ? previewUser.getAttribute('data-username') : '',
+      display_name: previewUser ? previewUser.getAttribute('data-display-name') : '',
+      email: previewUser ? previewUser.getAttribute('data-email') : '',
+      verification_expiry: previewUser ? previewUser.getAttribute('data-verification-expiry') : '30',
+      reset_expiry: previewUser ? previewUser.getAttribute('data-reset-expiry') : '30',
+      invitation_expiry: previewUser ? previewUser.getAttribute('data-invitation-expiry') : '24'
+    };
+    document.querySelectorAll('[data-email-template-editor]').forEach(function (editor) {
+      var subject = editor.querySelector('[data-email-template-subject]');
+      var body = editor.querySelector('[data-email-template-body]');
+      var alignment = editor.querySelector('[data-email-template-alignment]');
+      var buttonText = editor.querySelector('[data-email-template-button-text]');
+      var preview = editor.querySelector('[data-email-template-preview]');
+      if (!subject || !body || !preview) return;
+      var isVerificationTemplate = Boolean(editor.querySelector('[name="verification_subject"]'));
+      var isResetTemplate = Boolean(editor.querySelector('[name="reset_subject"]'));
+      var isInvitationTemplate = Boolean(editor.querySelector('[name="invitation_subject"]'));
+
+      function render() {
+        preview.innerHTML = '';
+        var shell = document.createElement('div');
+        shell.className = 'email-template-preview__shell';
+        var brand = document.createElement('div');
+        brand.className = 'email-template-preview__brand';
+        brand.textContent = 'Pulse Signage';
+        var message = document.createElement('div');
+        message.className = 'email-template-preview__message';
+        var sampleValues = {
+          username: signedInUser.username || 'username',
+          display_name: signedInUser.display_name || signedInUser.username || 'Your name',
+          email: signedInUser.email || 'your-email@example.com',
+          expiry_time: isInvitationTemplate ? signedInUser.invitation_expiry + ' hours' : (isResetTemplate ? signedInUser.reset_expiry : signedInUser.verification_expiry) + ' minutes'
+        };
+        var button = document.createElement('div');
+        button.className = 'email-template-preview__button';
+        var buttonAlignment = alignment ? alignment.value : 'center';
+        var buttonWrap = document.createElement('div');
+        buttonWrap.className = 'email-template-preview__button-wrap';
+        buttonWrap.style.textAlign = buttonAlignment;
+        buttonWrap.appendChild(button);
+        var previewActionPlaceholder = '[[url]]';
+        button.textContent = buttonText && buttonText.value ? buttonText.value : (isVerificationTemplate ? 'Verify email address' : (isInvitationTemplate ? 'Accept invitation' : 'Reset password'));
+        var previewOrigin = window.location.origin || 'https://pulse-signage.example';
+        var previewVerificationUrl = previewOrigin + '/verify-email?token=preview-token';
+        var previewResetUrl = previewOrigin + '/reset-password?token=preview-token';
+        var previewActionUrl = isVerificationTemplate ? previewVerificationUrl : (isInvitationTemplate ? previewOrigin + '/accept-invite?token=preview-token' : previewResetUrl);
+        var hasExplicitButton = body.value.indexOf('[[action_button]]') !== -1;
+        body.value.split(/\r?\n(?:[ \t]*\r?\n)+/).forEach(function (sourceParagraph) {
+          var line = sourceParagraph.replace(/\[\[(username|display_name|email|expiry_time)\]\]/g, function (_match, key) { return sampleValues[key]; }).replace(previewActionPlaceholder, previewActionUrl);
+          var hasButtonToken = sourceParagraph.indexOf('[[action_button]]') !== -1;
+          var hasUrlToken = !hasExplicitButton && sourceParagraph.indexOf(previewActionPlaceholder) !== -1;
+          if (hasButtonToken) {
+            var buttonParts = line.split('[[action_button]]');
+            if (buttonParts[0]) appendPreviewParagraph(buttonParts[0]);
+            message.appendChild(buttonWrap);
+            if (buttonParts[1]) appendPreviewParagraph(buttonParts[1]);
+            return;
+          }
+          if (hasUrlToken) {
+            var legacyParts = sourceParagraph.split(previewActionPlaceholder);
+            if (legacyParts[0]) appendPreviewParagraph(legacyParts[0]);
+            message.appendChild(buttonWrap);
+            appendPreviewParagraph(previewActionUrl + legacyParts[1]);
+            return;
+          }
+          appendPreviewParagraph(line);
+        });
+        function appendPreviewParagraph(line) {
+          var paragraph = document.createElement('p');
+          paragraph.innerHTML = (line || '\u00a0').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\r?\n/g, '<br>').replace(/(https?:\/\/[^\s<]+)/g, '<a href="$1">$1</a>').replace(/\[b\]([\s\S]*?)\[\/b\]/gi, '<strong>$1</strong>').replace(/\[i\]([\s\S]*?)\[\/i\]/gi, '<em>$1</em>').replace(/\[u\]([\s\S]*?)\[\/u\]/gi, '<u>$1</u>');
+          message.appendChild(paragraph);
+        }
+        preview.appendChild(brand);
+        shell.appendChild(message);
+        preview.appendChild(shell);
+      }
+
+      subject.addEventListener('input', render);
+      body.addEventListener('input', render);
+      if (alignment) alignment.addEventListener('change', render);
+      if (buttonText) buttonText.addEventListener('input', render);
+      editor.querySelectorAll('[data-email-format]').forEach(function (formatButton) {
+        formatButton.addEventListener('click', function () {
+          var tag = formatButton.getAttribute('data-email-format');
+          var start = body.selectionStart;
+          var end = body.selectionEnd;
+          var selected = body.value.slice(start, end) || 'text';
+          var markerPattern = new RegExp('^\\[' + tag + '\\]([\\s\\S]*)\\[\\/' + tag + '\\]$');
+          var replacement = markerPattern.test(selected) ? markerPattern.exec(selected)[1] : '[' + tag + ']' + selected + '[/' + tag + ']';
+          body.setRangeText(replacement, start, end, 'select');
+          body.dispatchEvent(new Event('input', { bubbles: true }));
+          body.focus();
+        });
+      });
+      render();
+    });
+  }
+
   document.addEventListener('DOMContentLoaded', function () {
     initIconSuggestions();
     initDefaultAnnouncementIconPicker();
     initSettingsSectionNavigation();
+    initEmailTemplatePreviews();
   });
 }());

src/web/public/js/shared/placeholder-info.js

@@ -36,6 +36,11 @@
       '</dl>';
   }
 
+  function renderMathTransforms() {
+    return '<h3 class="fs-6 mt-4 fw-normal">Math transforms</h3>' +
+      '<p class="small">Use <code>add(number)</code>, <code>subtract(number)</code>, <code>multiply(number)</code>, or <code>divide(number)</code>, for example <code>{{amount.multiply(10)}}</code>. Transforms can be chained, such as <code>{{amount.add(3).multiply(10)}}</code>.</p>';
+  }
+
   function renderDateFormatTokens() {
     return '<h3 class="fs-6 mt-4 fw-normal">Date format tokens</h3>' +
       '<p class="small">Use the <code>format("...")</code> transform with these tokens. Text inside square brackets is treated as a literal.</p>' +
@@ -61,6 +66,7 @@
     escapeHtml: escapeHtml,
     render: render,
     renderTextTransforms: renderTextTransforms,
+    renderMathTransforms: renderMathTransforms,
     renderDateFormatTokens: renderDateFormatTokens,
     renderImageTransform: renderImageTransform
   };

src/web/public/js/shared/placeholder-utils.js

@@ -27,9 +27,30 @@
     return current === undefined || current === null ? '' : current;
   }
 
+  function splitExpressionSegments(value) {
+    var segments = [];
+    var current = '';
+    var depth = 0;
+    String(value || '').split('').forEach(function (character) {
+      if (character === '(') {
+        depth += 1;
+      } else if (character === ')' && depth > 0) {
+        depth -= 1;
+      }
+      if (character === '.' && depth === 0) {
+        segments.push(current);
+        current = '';
+        return;
+      }
+      current += character;
+    });
+    segments.push(current);
+    return segments;
+  }
+
   function parsePlaceholderExpression(expression) {
     var raw = String(expression || '').trim();
-    var segments = raw ? raw.split('.') : [];
+    var segments = raw ? splitExpressionSegments(raw) : [];
     var transforms = [];
 
     while (segments.length) {
@@ -57,13 +78,33 @@
     if (!source) {
       return [];
     }
-
-    if ((source[0] === '"' && source[source.length - 1] === '"') || (source[0] === '\'' && source[source.length - 1] === '\'')) {
-      return [source.slice(1, -1)];
+    var args = [];
+    var current = '';
+    var quote = '';
+    source.split('').forEach(function (character) {
+      if ((character === '"' || character === '\'') && (!quote || quote === character)) {
+        quote = quote ? '' : character;
+        current += character;
+        return;
+      }
+      if (character === ',' && !quote) {
+        if (current.trim()) {
+          args.push(current.trim());
+        }
+        current = '';
+        return;
+      }
+      current += character;
+    });
+    if (current.trim()) {
+      args.push(current.trim());
     }
-
-    return source.split(',').map(function (item) {
-      return String(item || '').trim();
+    return args.map(function (item) {
+      var normalized = String(item || '').trim();
+      if ((normalized[0] === '"' && normalized[normalized.length - 1] === '"') || (normalized[0] === '\'' && normalized[normalized.length - 1] === '\'')) {
+        return normalized.slice(1, -1);
+      }
+      return normalized;
     }).filter(Boolean);
   }
 
@@ -253,6 +294,26 @@
     return resolveTimeZone((args && args[0]) || (options && options.timeZone) || '');
   }
 
+  function toNumericValue(value) {
+    if (value && typeof value === 'object') {
+      var numericKeys = ['value', 'amount', 'current', 'total', 'goal', 'raised'];
+      for (var keyIndex = 0; keyIndex < numericKeys.length; keyIndex += 1) {
+        var nestedValue = value[numericKeys[keyIndex]];
+        if (nestedValue !== undefined && nestedValue !== null && nestedValue !== value) {
+          var nestedNumber = toNumericValue(nestedValue);
+          if (Number.isFinite(nestedNumber)) {
+            return nestedNumber;
+          }
+        }
+      }
+      return NaN;
+    }
+
+    var normalized = String(value === undefined || value === null ? '' : value).replace(/[^0-9.eE+-]/g, '');
+    var number = Number(normalized);
+    return Number.isFinite(number) ? number : NaN;
+  }
+
   function applyTransform(value, transform, options) {
     var text = String(value === undefined || value === null ? '' : value);
     var name = String(transform && transform.name || '').trim().toLowerCase();
@@ -284,6 +345,18 @@
       return getTimeZoneLongName(getTransformTimeZone(args, options));
     }
 
+    if (name === 'add' || name === 'subtract' || name === 'multiply' || name === 'divide') {
+      var arithmeticValue = toNumericValue(value);
+      var operand = toNumericValue(args[0]);
+      if (!Number.isFinite(arithmeticValue) || !Number.isFinite(operand) || (name === 'divide' && operand === 0)) {
+        return value;
+      }
+      if (name === 'add') return arithmeticValue + operand;
+      if (name === 'subtract') return arithmeticValue - operand;
+      if (name === 'multiply') return arithmeticValue * operand;
+      return arithmeticValue / operand;
+    }
+
     return text;
   }
 
@@ -319,6 +392,147 @@
     };
   }
 
+  function isProgressPlaceholderExpression(expression) {
+    var parsed = parsePlaceholderExpression(expression);
+    return parsed.transforms.some(function (transform) {
+      return transform && transform.name === 'progress';
+    });
+  }
+
+  function renderProgressPlaceholder(value, expression) {
+    var parsed = parsePlaceholderExpression(expression);
+    var transform = parsed.transforms.find(function (candidate) {
+      return candidate && candidate.name === 'progress';
+    });
+    if (!transform || !value || typeof value !== 'object' || transform.args.length < 2) {
+      return '';
+    }
+
+    function toNumber(raw) {
+      if (raw && typeof raw === 'object') {
+        var numericKeys = ['value', 'amount', 'current', 'total', 'goal', 'raised'];
+        for (var keyIndex = 0; keyIndex < numericKeys.length; keyIndex += 1) {
+          var nestedValue = raw[numericKeys[keyIndex]];
+          if (nestedValue !== undefined && nestedValue !== null && nestedValue !== raw) {
+            var nestedNumber = toNumber(nestedValue);
+            if (Number.isFinite(nestedNumber)) {
+              return nestedNumber;
+            }
+          }
+        }
+        return 0;
+      }
+      var normalized = String(raw === undefined || raw === null ? '' : raw).replace(/[^0-9.eE+-]/g, '');
+      var number = Number(normalized);
+      return Number.isFinite(number) ? number : 0;
+    }
+
+    function resolveProgressValue(argument) {
+      var raw = String(argument === undefined || argument === null ? '' : argument).trim();
+      var literal = raw.replace(/^(?:"([\s\S]*)"|'([\s\S]*)')$/, '$1$2');
+      if (/^[+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?$/i.test(literal)) {
+        return literal;
+      }
+      return resolvePath(value, raw);
+    }
+
+    var startValue = resolveProgressValue(transform.args[0]);
+    var endValue = resolveProgressValue(transform.args[1]);
+    var startDate = startValue instanceof Date ? startValue : new Date(startValue);
+    var endDate = endValue instanceof Date ? endValue : new Date(endValue);
+    var percentage;
+    if (typeof startValue === 'string' && typeof endValue === 'string' && /[-T]/.test(startValue) && /[-T]/.test(endValue) && !Number.isNaN(startDate.getTime()) && !Number.isNaN(endDate.getTime()) && endDate.getTime() > startDate.getTime()) {
+      percentage = Math.max(0, Math.min(100, ((Date.now() - startDate.getTime()) / (endDate.getTime() - startDate.getTime())) * 100));
+    } else {
+      var current = toNumber(startValue);
+      var goal = toNumber(endValue);
+      percentage = goal > 0 ? Math.max(0, Math.min(100, (current / goal) * 100)) : 0;
+    }
+    var roundedPercentage = Math.round(percentage * 10) / 10;
+    var label = roundedPercentage + '%';
+    var variants = ['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'light', 'dark'];
+    var variantColors = {
+      primary: '#0d6efd',
+      secondary: '#6c757d',
+      success: '#198754',
+      danger: '#dc3545',
+      warning: '#ffc107',
+      info: '#0dcaf0',
+      light: '#f8f9fa',
+      dark: '#212529'
+    };
+    var announcementColors = {
+      orange: '#c84e10',
+      amber: '#a56710',
+      olive: '#5f7f0f',
+      teal: '#12827d',
+      sky: '#127caf',
+      indigo: '#6f60ea',
+      violet: '#9553db',
+      fuchsia: '#b347be',
+      pink: '#cd388d',
+      navy: '#1d2d4c',
+      steel: '#3a4860',
+      slate: '#566577',
+      graphite: '#32363c',
+      midnight: '#1e1d2d'
+    };
+    var variant = 'primary';
+    var barVariant = '';
+    var customColor = '';
+    var backgroundColor = '';
+    var colorCount = 0;
+    var modifiers = [];
+    var textless = false;
+    var borderRadius = 'var(--bs-border-radius)';
+    transform.args.slice(2).forEach(function (argument) {
+      var option = String(argument || '').trim().toLowerCase();
+      var isNamedColor = variants.indexOf(option) !== -1 || Object.prototype.hasOwnProperty.call(announcementColors, option);
+      var isHexColor = /^#[0-9a-f]{3}(?:[0-9a-f]{3})?$/i.test(option);
+      if (isNamedColor || isHexColor) {
+        var color = isHexColor ? option : (variantColors[option] || announcementColors[option]);
+        if (colorCount === 0) {
+          if (variants.indexOf(option) !== -1) {
+            variant = option;
+            barVariant = option;
+          }
+          customColor = color;
+        } else if (colorCount === 1) {
+          backgroundColor = color;
+        }
+        colorCount += 1;
+      }
+      if (option === 'striped' || option === 'animated') {
+        modifiers.push('progress-bar-' + option);
+      }
+      if (option === 'textless') {
+        textless = true;
+      }
+      if (option === 'square') {
+        borderRadius = '0';
+      } else if (option === 'pill') {
+        borderRadius = '50rem';
+      } else if (option === 'rounded') {
+        borderRadius = 'var(--bs-border-radius)';
+      } else {
+        var radiusMatch = option.match(/^radius\((0|[0-9]+(?:\.[0-9]+)?(?:px|rem|em|%)?)\)$/);
+        if (radiusMatch) {
+          borderRadius = radiusMatch[1];
+        }
+      }
+    });
+    var progressClass = 'progress';
+    var barClass = 'progress-bar' + (barVariant ? ' bg-' + barVariant : '') + (modifiers.length ? ' ' + modifiers.join(' ') : '');
+    var barStyle = 'width:' + roundedPercentage + '%;color:inherit;';
+    if (customColor) {
+      barStyle += 'background-color:' + customColor + ';';
+    }
+    var progressStyleValue = (backgroundColor ? 'background-color:' + backgroundColor + ';' : '') + 'font-size:inherit;--bs-progress-font-size:inherit;--bs-progress-height:1em;height:1em;border-radius:' + borderRadius + ';';
+    var progressStyle = progressStyleValue ? ' style="' + progressStyleValue + '"' : '';
+    return '<span class="' + progressClass + ' api-progress"' + progressStyle + ' role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="' + roundedPercentage + '" aria-label="' + label + '">' +
+      '<span class="' + barClass + '" style="' + barStyle + '">' + (textless ? '' : label) + '</span></span>';
+  }
+
   function formatPlaceholderValue(value) {
     if (value === undefined || value === null) {
       return '';
@@ -372,6 +586,8 @@
     resolvePlaceholderExpression: resolvePlaceholderExpression,
     isImagePlaceholderExpression: isImagePlaceholderExpression,
     getImagePlaceholderConfig: getImagePlaceholderConfig,
+    isProgressPlaceholderExpression: isProgressPlaceholderExpression,
+    renderProgressPlaceholder: renderProgressPlaceholder,
     formatPlaceholderValue: formatPlaceholderValue,
     collectPlaceholderFieldPaths: collectPlaceholderFieldPaths
   };

src/web/public/js/slides/slide-form-regions.js

@@ -138,7 +138,7 @@ export function createSlideFormRegionHelpers(options) {
         ? placeholderChips.renderChip(field)
         : '<span class="chip">{{' + escapeHtml(field) + '}}</span>';
     }).join('');
-    var transformHint = includeTransformHint === false ? '' : '<div class="text-body-secondary small mt-1">Placeholder values support transforms, for example <code>{{title.upper()}}</code>, <code>{{title.title()}}</code>, <code>{{title.lower()}}</code>, <code>{{publishedAt.format("MMM D, YYYY")}}</code>.</div>';
+    var transformHint = includeTransformHint === false ? '' : '<div class="text-body-secondary small mt-1">Placeholder values support transforms, for example <code>{{title.upper()}}</code>, <code>{{title.title()}}</code>, <code>{{title.lower()}}</code>, <code>{{publishedAt.format("MMM D, YYYY")}}</code>, or <code>{{amount.multiply(10)}}</code>.</div>';
 
     if (!overflowFields.length) {
       return visibleMarkup + transformHint;

src/web/public/js/slides/slide-form.js

@@ -93,8 +93,22 @@ import { createSlideFormPreviewHelpers } from '/assets/js/slides/slide-form-prev
     }
 
     var color = String(backgroundColor || '#111111').trim() || '#111111';
+    var gradient = '';
+    try {
+      var gradientData = typeof backgroundGradient === 'string' ? JSON.parse(backgroundGradient) : backgroundGradient;
+      if (gradientData && gradientData.type === 'linear' && ((Array.isArray(gradientData.stops) && gradientData.stops.length >= 2) || (Array.isArray(gradientData.colors) && gradientData.colors.length >= 2))) {
+        var stops = Array.isArray(gradientData.stops) ? gradientData.stops : (gradientData.colors || []).map(function (stopColor, index, colors) { return { color: stopColor, position: colors.length > 1 ? Math.round(index * 100 / (colors.length - 1)) : 0 }; });
+        stops = stops.filter(function (stop) { return stop && /^#[0-9a-fA-F]{3,8}$/.test(String(stop.color || '').trim()); }).slice(0, 12);
+        if (stops.length >= 2) {
+          var angle = Number(gradientData.angle);
+          gradient = 'linear-gradient(' + (Number.isFinite(angle) ? Math.max(0, Math.min(360, angle)) : 90) + 'deg,' + stops.map(function (stop) { return stop.color + ' ' + Math.max(0, Math.min(100, Number(stop.position) || 0)) + '%'; }).join(',') + ')';
+        }
+      }
+    } catch (_error) {
+      gradient = '';
+    }
     element.style.backgroundColor = color;
-    element.style.backgroundImage = backgroundImagePath ? 'url("' + encodeURI(String(backgroundImagePath)) + '")' : 'none';
+    element.style.backgroundImage = [backgroundImagePath ? 'url("' + encodeURI(String(backgroundImagePath)) + '")' : '', gradient].filter(Boolean).join(',') || 'none';
     element.style.backgroundPosition = 'center';
     element.style.backgroundSize = 'cover';
     element.style.backgroundRepeat = 'no-repeat';
@@ -110,7 +124,7 @@ import { createSlideFormPreviewHelpers } from '/assets/js/slides/slide-form-prev
     var gradient = '';
     try {
       var gradientData = typeof backgroundGradient === 'string' ? JSON.parse(backgroundGradient) : backgroundGradient;
-      if (gradientData && gradientData.type === 'linear' && Array.isArray(gradientData.colors) && gradientData.colors.length >= 2) {
+      if (gradientData && gradientData.type === 'linear' && ((Array.isArray(gradientData.stops) && gradientData.stops.length >= 2) || (Array.isArray(gradientData.colors) && gradientData.colors.length >= 2))) {
         var stops = Array.isArray(gradientData.stops) ? gradientData.stops : (gradientData.colors || []).map(function (color, index, colors) { return { color: color, position: colors.length > 1 ? Math.round(index * 100 / (colors.length - 1)) : 0 }; });
         stops = stops.filter(function (stop) { return stop && /^#[0-9a-fA-F]{3,8}$/.test(String(stop.color || '').trim()); }).slice(0, 12);
         if (stops.length >= 2) {

src/web/public/js/table/table-search.js

@@ -129,6 +129,26 @@
 
       input.value = String(currentUrl.searchParams.get(searchParam) || '').trim();
 
+      var searchGroup = input.closest('.table-search-group');
+      if (searchGroup) {
+        var actionButton = searchGroup.parentNode ? searchGroup.parentNode.querySelector('.btn:not(.table-search-group .btn)') : null;
+        if (actionButton && actionButton.getBoundingClientRect) {
+          searchGroup.style.setProperty('--table-search-action-offset', (actionButton.getBoundingClientRect().width + 8) + 'px');
+        }
+        var searchToggle = searchGroup.querySelector('[data-table-search-toggle]');
+        if (searchToggle) {
+          searchToggle.addEventListener('click', function () {
+            focusSearchInput(input);
+          });
+          searchToggle.addEventListener('keydown', function (event) {
+            if (event.key === 'Enter' || event.key === ' ') {
+              event.preventDefault();
+              focusSearchInput(input);
+            }
+          });
+        }
+      }
+
       function updateSearch() {
         var query = String(input.value || '').trim();
         var nextUrl = new URL(window.location.href);

src/web/public/js/web-ui-helpers.js

@@ -187,163 +187,8 @@
     return ip;
   }
 
-  window.escapeHtml = escapeHtml;
   initializeUrlValidation();
 
-  var defaultQrOptions = window.defaultQrOptions || {
-    width: 1000,
-    height: 1000,
-    type: 'canvas',
-    margin: 10,
-    qrOptions: {},
-    dotsOptions: {
-      color: '#000000',
-      type: 'square'
-    },
-    cornersSquareOptions: {
-      color: '#000000',
-      type: 'square'
-    },
-    cornersDotOptions: {
-      color: '#000000',
-      type: 'square'
-    },
-    backgroundOptions: {
-      color: '#ffffff'
-    }
-  };
-  var qrDotTypes = window.qrDotTypes || [
-    { value: 'square', label: 'Square' },
-    { value: 'dots', label: 'Dots' },
-    { value: 'rounded', label: 'Rounded' },
-    { value: 'extra-rounded', label: 'Extra rounded' },
-    { value: 'classy', label: 'Classy' },
-    { value: 'classy-rounded', label: 'Classy rounded' }
-  ];
-  var qrCornerSquareTypes = window.qrCornerSquareTypes || [
-    { value: 'square', label: 'Square' },
-    { value: 'dot', label: 'Dot' },
-    { value: 'rounded', label: 'Rounded' },
-    { value: 'extra-rounded', label: 'Extra rounded' },
-    { value: 'dots', label: 'Dots' },
-    { value: 'classy', label: 'Classy' },
-    { value: 'classy-rounded', label: 'Classy rounded' }
-  ];
-  var qrCornerDotTypes = window.qrCornerDotTypes || [
-    { value: 'square', label: 'Square' },
-    { value: 'dot', label: 'Dot' },
-    { value: 'rounded', label: 'Rounded' },
-    { value: 'extra-rounded', label: 'Extra rounded' },
-    { value: 'classy', label: 'Classy' },
-    { value: 'classy-rounded', label: 'Classy rounded' }
-  ];
-
-  function getOptionValue(option) {
-    if (option && typeof option === 'object' && option.value !== undefined && option.value !== null) {
-      return String(option.value).trim();
-    }
-
-    return String(option === undefined || option === null ? '' : option).trim();
-  }
-
-  function normalizeMarginValue(value, fallback) {
-    var parsed = Number(value);
-    return Number.isFinite(parsed) && parsed >= 0 ? Math.round(parsed) : fallback;
-  }
-
-  function normalizeHexColorValue(value, fallback) {
-    var raw = String(value === undefined || value === null ? '' : value).trim();
-    return raw || fallback;
-  }
-
-  function normalizeBooleanValue(value, fallback) {
-    if (value === undefined || value === null || value === '') {
-      return Boolean(fallback);
-    }
-    if (typeof value === 'boolean') {
-      return value;
-    }
-    var text = String(value).trim().toLowerCase();
-    if (text === 'true' || text === '1' || text === 'yes' || text === 'on') {
-      return true;
-    }
-    if (text === 'false' || text === '0' || text === 'no' || text === 'off') {
-      return false;
-    }
-    return Boolean(value);
-  }
-
-  function normalizeOptionValue(value, options, fallback) {
-    var text = String(value === undefined || value === null ? '' : value).trim();
-    for (var index = 0; index < options.length; index += 1) {
-      if (getOptionValue(options[index]) === text) {
-        return text;
-      }
-    }
-
-    return fallback;
-  }
-
-  function normalizeRatioValue(value, fallback) {
-    var parsed = Number(value);
-    return Number.isFinite(parsed) && parsed >= 0 ? parsed : fallback;
-  }
-
-  function normalizeGradientTypeValue(value, fallback) {
-    var text = String(value === undefined || value === null ? '' : value).trim().toLowerCase();
-    return text === 'radial' ? 'radial' : 'linear';
-  }
-
-  function normalizeGradientRotationValue(value, fallback) {
-    var parsed = Number(value);
-    return Number.isFinite(parsed) ? Math.round(parsed) : fallback;
-  }
-
-  function normalizeColorModeValue(value, fallback) {
-    var text = String(value === undefined || value === null ? '' : value).trim().toLowerCase();
-    return text === 'gradient' ? 'gradient' : 'single';
-  }
-
-  function normalizeColorValue(value, fallback) {
-    return normalizeHexColorValue(value, fallback);
-  }
-
-  function renderSelectOptions(options, currentValue) {
-    return options.map(function (option) {
-      var optionValue = getOptionValue(option);
-      var optionLabel = option && typeof option === 'object' && option.label !== undefined ? option.label : optionValue;
-      return '<option value="' + escapeHtml(optionValue) + '"' + (String(optionValue) === String(currentValue) ? ' selected' : '') + '>' + escapeHtml(optionLabel) + '</option>';
-    }).join('');
-  }
-
-  function normalizeSvgMarkup(svg) {
-    var markup = String(svg || '').trim();
-    if (!markup || markup.charAt(0) !== '<') {
-      return markup;
-    }
-
-    return markup.replace(/^<svg\b([^>]*)>/i, function (_match, attrText) {
-      var attrs = String(attrText || '');
-      if (!/\bwidth\s*=\s*/i.test(attrs)) {
-        attrs += ' width="95%"';
-      }
-      if (!/\bheight\s*=\s*/i.test(attrs)) {
-        attrs += ' height="95%"';
-      }
-      if (!/\bpreserveAspectRatio\s*=\s*/i.test(attrs)) {
-        attrs += ' preserveAspectRatio="xMidYMid meet"';
-      }
-      if (!/\bstyle\s*=\s*/i.test(attrs)) {
-        attrs += ' style="display:block;width:95%;height:95%;"';
-      }
-      return '<svg' + attrs + '>';
-    });
-  }
-
-  function normalizeQrSvg(svg) {
-    return normalizeSvgMarkup(svg);
-  }
-
   async function blobToText(blob) {
     if (!blob) {
       return '';
@@ -369,23 +214,8 @@
     return '';
   }
 
-  window.defaultQrOptions = defaultQrOptions;
-  window.qrDotTypes = qrDotTypes;
-  window.qrCornerSquareTypes = qrCornerSquareTypes;
-  window.qrCornerDotTypes = qrCornerDotTypes;
-  window.normalizeMarginValue = normalizeMarginValue;
-  window.normalizeHexColorValue = normalizeHexColorValue;
-  window.normalizeBooleanValue = normalizeBooleanValue;
-  window.normalizeOptionValue = normalizeOptionValue;
-  window.normalizeRatioValue = normalizeRatioValue;
-  window.normalizeGradientTypeValue = normalizeGradientTypeValue;
-  window.normalizeGradientRotationValue = normalizeGradientRotationValue;
-  window.normalizeColorModeValue = normalizeColorModeValue;
-  window.normalizeColorValue = normalizeColorValue;
-  window.renderSelectOptions = renderSelectOptions;
-  window.normalizeSvgMarkup = normalizeSvgMarkup;
-  window.normalizeQrSvg = normalizeQrSvg;
   window.blobToText = blobToText;
+  window.escapeHtml = escapeHtml;
   window.pendingByRegionId = window.pendingByRegionId || Object.create(null);
 
   window.webUiHelpers = {

src/web/routes/account/password.js

@@ -33,17 +33,22 @@ module.exports = function renderAccountPage(currentUser, message, returnUrl, all
       ? 'Use at least ' + requirements.minimumLength + ' characters and include uppercase, lowercase, number, and symbol.'
       : 'Use at least ' + requirements.minimumLength + ' characters and include ' + requirements.minimumCategories + ' of: uppercase, lowercase, number, and symbol.';
 
-  return renderView('account/password', {
+  return renderView('account/index', {
     title: 'My account',
     active: 'account',
     currentUser: currentUser || null,
     message: message || '',
     username: currentUser ? currentUser.username : '',
     name: currentUser ? String(currentUser.name || '') : '',
+    email: currentUser ? String(currentUser.email || '') : '',
+    emailPending: Boolean(currentUser && currentUser.pending_email),
+    pendingEmail: currentUser ? String(currentUser.pending_email || '') : '',
+    emailVerified: Boolean(currentUser && currentUser.email_verified_at),
     returnUrl: normalizeReturnUrl(returnUrl),
     allowUserSessionRevocation: Boolean(allowUserSessionRevocation),
     sessions: Array.isArray(sessions) ? sessions : [],
     passwordMinimumLength: requirements.minimumLength,
-    passwordRequirementsText: passwordRequirementsText
+    passwordRequirementsText: passwordRequirementsText,
+    scripts: ['js/account/account-page.js']
   });
 };

src/web/routes/admin/account.js

@@ -1,6 +1,8 @@
 // Admin account route registration and profile helpers.
 
 const { fetchAppSettings } = require('#src/data/app-settings');
+const { formatAccountEmailExpiry, renderAccountEmailTemplate } = require('#src/data/account-email-templates');
+const { formatUserAgentLabel } = require('#src/data/audit-log');
 
 module.exports = function registerAccountRoutes(app, deps) {
   const pool = deps.pool;
@@ -18,6 +20,8 @@ module.exports = function registerAccountRoutes(app, deps) {
   const hashSessionToken = deps.hashSessionToken;
   const sessionCookieName = deps.sessionCookieName;
   const recordRequestAuditEvent = deps.recordRequestAuditEvent;
+  const sendAccountEmail = deps.sendAccountEmail;
+  const createOneTimeToken = deps.createOneTimeToken;
 
   async function getPasswordRequirements() {
     const settings = await fetchAppSettings(pool);
@@ -43,6 +47,30 @@ module.exports = function registerAccountRoutes(app, deps) {
     };
   }
 
+  function getRequestOrigin(req) {
+    const forwardedProto = String(req.headers['x-forwarded-proto'] || req.protocol || 'http').split(',')[0].trim();
+    const forwardedHost = String(req.headers['x-forwarded-host'] || req.headers.host || '').split(',')[0].trim();
+    return forwardedHost ? forwardedProto + '://' + forwardedHost : '';
+  }
+
+  app.post('/account/email', async function (req, res, next) {
+    try {
+      const email = String(req.body.email || '').trim().toLowerCase();
+      if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) return res.status(400).send('Email address is invalid.');
+      const settings = await fetchAppSettings(pool);
+      if (!settings['email.smtp_enabled'] || typeof sendAccountEmail !== 'function') return res.status(400).send('Email delivery is not configured.');
+      const token = createOneTimeToken();
+      const expiryMinutes = Number(settings['email.verification_expiry_minutes']);
+      await pool.query('UPDATE a_users SET pending_email = ?, pending_email_token_hash = ?, pending_email_expires_at = DATE_ADD(NOW(), INTERVAL ' + expiryMinutes + ' MINUTE) WHERE id = ?', [email, hashSessionToken(token), req.currentUser.id]);
+      const url = getRequestOrigin(req) + '/verify-email?token=' + encodeURIComponent(token);
+      await sendAccountEmail(settings, Object.assign({ to: email }, renderAccountEmailTemplate(settings['email.verification_subject'], settings['email.verification_body'], { url: url, username: req.currentUser.username, display_name: req.currentUser.name, email: email, expiry_time: formatAccountEmailExpiry(expiryMinutes, 'minutes'), action_alignment: settings['email.verification_button_alignment'], action_label: settings['email.verification_button_text'] })));
+      if (typeof recordRequestAuditEvent === 'function') await recordRequestAuditEvent(pool, req, { category: 'users', eventType: 'user.email_change_requested', actorUserId: req.currentUser.id, targetType: 'user', targetId: req.currentUser.id, targetLabel: email });
+      res.redirect('/account?message=' + encodeURIComponent('Check your new email address for a verification link.'));
+    } catch (error) {
+      next(error);
+    }
+  });
+
   app.get('/account', function (req, res) {
     fetchAppSettings(pool).then(function (settings) {
       const passwordRequirements = buildPasswordRequirements(settings);
@@ -61,7 +89,7 @@ module.exports = function registerAccountRoutes(app, deps) {
             id: Number(session.id),
             isCurrent: Boolean(tokenHash && session.session_hash === tokenHash),
             ipAddress: String(session.ip_address || 'Unknown'),
-            userAgent: String(session.user_agent || 'Unknown browser'),
+            userAgent: formatUserAgentLabel(session.user_agent) || 'Unknown browser',
             createdAtLabel: formatDashboardDate(session.created_at),
             lastUsedAtLabel: formatDashboardDate(session.last_used_at),
             expiresAtLabel: formatDashboardDate(session.expires_at)
@@ -74,6 +102,53 @@ module.exports = function registerAccountRoutes(app, deps) {
     });
   });
 
+  app.post('/account/profile', async function (req, res, next) {
+    try {
+      const name = String(req.body.name || '').trim();
+      const username = common.validateMaxLength(req.body.username || '', 64, 'Username');
+      const email = String(req.body.email || '').trim().toLowerCase();
+      const currentPassword = String(req.body.current_password || '');
+      if (!name) return res.status(400).send('Name is required.');
+      if (!username) return res.status(400).send('Username is required.');
+      if (email && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) return res.status(400).send('Email address is invalid.');
+      if (!currentPassword) return res.status(400).send('Current password is required.');
+
+      const [rows] = await pool.query('SELECT id, username, name, email, password_hash, password_salt, password_iterations FROM a_users WHERE id = ? LIMIT 1', [req.currentUser.id]);
+      const user = rows[0] || null;
+      if (!user) return res.status(404).send('User not found.');
+      if (!verifyPassword(currentPassword, user)) return res.status(400).send('Current password is incorrect.');
+      if (username !== user.username && await common.fetchDuplicateName(pool, 'a_users', username, user.id, 'username')) return res.status(400).send('That username already exists.');
+      if (name !== user.name && await common.fetchDuplicateName(pool, 'a_users', name, user.id)) return res.status(400).send('That name already exists.');
+
+      const confirmedEmail = String(user.email || '').trim().toLowerCase();
+      const pendingEmail = String(user.pending_email || '').trim().toLowerCase();
+      const emailChanged = email !== confirmedEmail && email !== pendingEmail;
+      const pendingEmailCleared = Boolean(pendingEmail && email === confirmedEmail);
+      const settings = emailChanged ? await fetchAppSettings(pool) : null;
+      if (emailChanged && email && (!settings['email.smtp_enabled'] || typeof sendAccountEmail !== 'function')) return res.status(400).send('Email delivery is not configured.');
+
+      const actorId = getAuditUserId(req);
+      await pool.query('UPDATE a_users SET username = ?, name = ?, modified_by = ? WHERE id = ?', [username, name, actorId, user.id]);
+      if (emailChanged || pendingEmailCleared) {
+        if (!email) {
+          await pool.query('UPDATE a_users SET email = NULL, email_verified_at = NULL, pending_email = NULL, pending_email_token_hash = NULL, pending_email_expires_at = NULL WHERE id = ?', [user.id]);
+        } else if (pendingEmailCleared) {
+          await pool.query('UPDATE a_users SET pending_email = NULL, pending_email_token_hash = NULL, pending_email_expires_at = NULL WHERE id = ?', [user.id]);
+        } else {
+          const token = createOneTimeToken();
+          const expiryMinutes = Number(settings['email.verification_expiry_minutes']);
+          await pool.query('UPDATE a_users SET pending_email = ?, pending_email_token_hash = ?, pending_email_expires_at = DATE_ADD(NOW(), INTERVAL ' + expiryMinutes + ' MINUTE) WHERE id = ?', [email, hashSessionToken(token), user.id]);
+          const url = getRequestOrigin(req) + '/verify-email?token=' + encodeURIComponent(token);
+          await sendAccountEmail(settings, Object.assign({ to: email }, renderAccountEmailTemplate(settings['email.verification_subject'], settings['email.verification_body'], { url: url, username: req.currentUser.username, display_name: req.currentUser.name, email: email, expiry_time: formatAccountEmailExpiry(expiryMinutes, 'minutes'), action_alignment: settings['email.verification_button_alignment'], action_label: settings['email.verification_button_text'] })));
+        }
+      }
+      if (emailChanged && typeof recordRequestAuditEvent === 'function') await recordRequestAuditEvent(pool, req, { category: 'users', eventType: email ? 'user.email_change_requested' : 'user.email_cleared', actorUserId: user.id, targetType: 'user', targetId: user.id, targetLabel: email || user.email, details: { previousEmail: confirmedEmail || null, email: email || null, verificationRequired: Boolean(email) } });
+      res.redirect('/account?message=' + encodeURIComponent(emailChanged && email ? 'Account details updated. Check your new email address for a verification link.' : 'Account details updated.'));
+    } catch (error) {
+      next(error);
+    }
+  });
+
   app.post('/account/sessions/:id/revoke', async function (req, res, next) {
     try {
       const sessionId = Number(req.params.id);
@@ -161,6 +236,26 @@ module.exports = function registerAccountRoutes(app, deps) {
     }
   });
 
+  app.post('/account/username', async function (req, res, next) {
+    try {
+      const username = common.validateMaxLength(req.body.username || '', 255, 'Username');
+      const currentPassword = String(req.body.current_password || '');
+      if (!username) return res.status(400).send('Username is required.');
+      if (!currentPassword) return res.status(400).send('Current password is required.');
+      const [rows] = await pool.query('SELECT id, username, password_hash, password_salt, password_iterations FROM a_users WHERE id = ? LIMIT 1', [req.currentUser.id]);
+      const user = rows[0] || null;
+      if (!user) return res.status(404).send('User not found.');
+      if (!verifyPassword(currentPassword, user)) return res.status(400).send('Current password is incorrect.');
+      const [existingRows] = await pool.query('SELECT id FROM a_users WHERE username = ? AND id <> ? LIMIT 1', [username, user.id]);
+      if (existingRows.length) return res.status(400).send('That username already exists.');
+      await pool.query('UPDATE a_users SET username = ?, modified_by = ? WHERE id = ?', [username, getAuditUserId(req), user.id]);
+      if (typeof recordRequestAuditEvent === 'function') await recordRequestAuditEvent(pool, req, { category: 'users', eventType: 'user.username_updated', actorUserId: user.id, targetType: 'user', targetId: user.id, targetLabel: username, details: { previousUsername: user.username, username: username } });
+      res.redirect('/account?message=' + encodeURIComponent('Username updated.'));
+    } catch (error) {
+      next(error);
+    }
+  });
+
   app.post('/account/password', async function (req, res, next) {
     try {
       const currentPassword = String(req.body.current_password || '');

src/web/routes/admin/client-commands.js

@@ -7,11 +7,28 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
   const common = deps.common;
   const forwardPlayerCommand = deps.forwardPlayerCommand;
   const forwardPlayerCommandToBaseUrl = deps.forwardPlayerCommandToBaseUrl;
+  const forwardPlayerCommandToDevice = deps.forwardPlayerCommandToDevice;
   const getScreenConnections = deps.getScreenConnections;
   const isClientNameAvailable = deps.isClientNameAvailable;
+  const findAvailableClientName = deps.findAvailableClientName;
   const withClientNameReservation = deps.withClientNameReservation;
   const broadcastDashboardState = deps.broadcastDashboardState;
   const requirePermission = deps.requirePermission;
+  const recordRequestAuditEvent = deps.recordRequestAuditEvent;
+
+  async function recordScreenControlAudit(req, screenSlug, command, details) {
+    if (typeof recordRequestAuditEvent !== 'function') {
+      return;
+    }
+    await recordRequestAuditEvent(pool, req, {
+      category: 'screen-controls',
+      eventType: 'screen-control.' + command,
+      actorUserId: req.currentUser && req.currentUser.id,
+      targetType: screenSlug === '__all__' ? 'all-screens' : 'screen',
+      targetLabel: screenSlug === '__all__' ? 'All screens' : screenSlug,
+      details: details || {}
+    });
+  }
 
   function normalizeExplicitPlayerBaseUrl(value) {
     return String(value || '').trim().replace(/\/$/, '');
@@ -103,12 +120,51 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
   }
 
   async function forwardPlayerCommandForConnections(screenSlug, connections, commandPayload, connectionId, deviceId) {
-    const targetBaseUrls = await resolvePlayerBaseUrlsForConnections(connections);
+    const connectionList = Array.isArray(connections) ? connections : [];
+    const targetedConnections = connectionId
+      ? connectionList.filter(function (connection) {
+        const candidateConnectionId = String(connection && connection.id || '').trim();
+        const candidateClientId = String(connection && connection.clientId || '').trim();
+        const candidateDeviceId = String(connection && connection.deviceId || '').trim();
+        return candidateConnectionId === connectionId
+          || candidateClientId === connectionId
+          || candidateDeviceId === connectionId;
+      })
+      : (deviceId
+        ? connectionList.filter(function (connection) {
+          return String(connection && connection.deviceId || '').trim() === String(deviceId).trim();
+        })
+        : connectionList);
+    const remoteConnections = targetedConnections.filter(function (connection) {
+      return String(connection && connection.playerDeviceId || '').trim();
+    });
+    const localConnections = targetedConnections.filter(function (connection) {
+      return !String(connection && connection.playerDeviceId || '').trim();
+    });
+    const deviceTargets = Array.from(new Set(remoteConnections.map(function (connection) {
+      return String(connection && connection.playerDeviceId || '').trim();
+    }).filter(Boolean)));
+    const results = [];
+    if (deviceTargets.length && typeof forwardPlayerCommandToDevice === 'function') {
+      const remoteResults = await Promise.allSettled(deviceTargets.map(function (targetDeviceId) {
+        const payload = Object.assign({ screenSlug: screenSlug }, commandPayload || {});
+        if (connectionId) {
+          payload.connectionId = connectionId;
+        }
+        return forwardPlayerCommandToDevice(targetDeviceId, payload);
+      }));
+      results.push.apply(results, remoteResults);
+    }
+
+    const targetBaseUrls = await resolvePlayerBaseUrlsForConnections(localConnections);
     if (targetBaseUrls.length && typeof forwardPlayerCommandToBaseUrl === 'function') {
-      const results = await Promise.allSettled(targetBaseUrls.map(function (targetBaseUrl) {
+      const localResults = await Promise.allSettled(targetBaseUrls.map(function (targetBaseUrl) {
         return forwardPlayerCommandToBaseUrl(targetBaseUrl, screenSlug, commandPayload, connectionId || deviceId || undefined);
       }));
+      results.push.apply(results, localResults);
+    }
 
+    if (results.length) {
       return {
         ok: true,
         sent: results.filter(function (result) {
@@ -209,6 +265,13 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
           await broadcastDashboardState();
         }
 
+        await recordScreenControlAudit(req, '__all__', command, {
+          targetScreenCount: targets.length,
+          targetPlayerCount: sentCount,
+          blackout: command === 'blackout' ? Boolean(commandPayload.blackout) : undefined,
+          paused: command === 'pause' ? Boolean(commandPayload.paused) : undefined
+        });
+
         return res.json({
           ok: true,
           allScreens: true,
@@ -297,8 +360,8 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
             liveConnections = [];
           }
 
-          const available = await isClientNameAvailable(pool, clientName, bindingDeviceId, liveConnections);
-          if (!available) {
+          const selectedClientName = await findAvailableClientName(pool, clientName, bindingDeviceId, liveConnections);
+          if (!selectedClientName) {
             return res.status(409).json({ error: 'Client name already exists.' });
           }
 
@@ -306,14 +369,14 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
             if (playerBaseUrl) {
               await forwardPlayerCommandForPlayerBaseUrl(slug, playerBaseUrl, {
                 command: command,
-                clientName: clientName,
+                clientName: selectedClientName,
                 clientId: connectionId || deviceId || null,
                 deviceId: deviceId || null
               }, connectionId || deviceId || undefined, deviceId || null);
             } else {
               await forwardPlayerCommandForConnections(slug, liveConnections, {
                 command: command,
-                clientName: clientName,
+                clientName: selectedClientName,
                 clientId: connectionId || deviceId || null,
                 deviceId: deviceId || null
               }, connectionId || deviceId || undefined, deviceId || null);
@@ -323,13 +386,15 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
               await broadcastDashboardState();
             }
 
+            await recordScreenControlAudit(req, slug, command, { clientName: selectedClientName, deviceId: deviceId });
+
             return res.json({
               screen: screenRows[0],
               screenSlug: slug,
               command: command,
               connectionId: connectionId || null,
               deviceId: deviceId,
-              clientName: clientName,
+              clientName: selectedClientName,
               ok: true,
               liveOnly: true
             });
@@ -339,19 +404,21 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
             `UPDATE d_onboarding_devices
              SET client_name = ?, modified_at = CURRENT_TIMESTAMP
              WHERE device_id = ?`,
-            [clientName, bindingDeviceId]
+            [selectedClientName, bindingDeviceId]
           );
           if (!updateResult.affectedRows) {
             return res.status(404).json({ error: 'Client not found' });
           }
 
+          await recordScreenControlAudit(req, slug, command, { clientName: selectedClientName, deviceId: deviceId });
+
           return res.json({
             screen: screenRows[0],
             screenSlug: slug,
             command: command,
             connectionId: connectionId || null,
             deviceId: deviceId,
-            clientName: clientName,
+            clientName: selectedClientName,
             ok: true
           });
         });
@@ -360,42 +427,71 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
       if (command === 'moveclient') {
         const legacyDeviceId = String((req.body && req.body.deviceId) || req.query.deviceId || '').trim();
         let physicalPlayerId = '';
+        let registeredPlayerBaseUrl = '';
         const tabClientId = String((req.body && req.body.clientId) || req.query.clientId || '').trim();
         const clientName = String((req.body && req.body.clientName) || req.query.clientName || '').trim();
         const targetScreenSlug = String((req.body && (req.body.targetScreenSlug || req.body.screenSlug)) || req.query.targetScreenSlug || req.query.screenSlug || '').trim();
         const submittedPlayerBaseUrl = normalizeExplicitPlayerBaseUrl(playerBaseUrl);
+        const liveConnections = await fetchScreenConnections(slug);
+        const liveConnection = liveConnections.find(function (connection) {
+          const candidateConnectionId = String(connection && connection.id || '').trim();
+          const candidateClientId = String(connection && connection.clientId || '').trim();
+          return candidateConnectionId === connectionId || candidateClientId === connectionId;
+        }) || null;
+        const liveDeviceId = String(liveConnection && liveConnection.deviceId || '').trim();
+        const livePlayerDeviceId = String(liveConnection && liveConnection.playerDeviceId || '').trim();
+        const livePlayerBaseUrl = normalizeExplicitPlayerBaseUrl(liveConnection && liveConnection.playerPublicBaseUrl);
 
-        if (!connectionId && !submittedPlayerBaseUrl && !legacyDeviceId) {
+        if (!connectionId && !submittedPlayerBaseUrl && !legacyDeviceId && !liveDeviceId) {
           return res.status(400).json({ error: 'Client connection is required' });
         }
         if (!targetScreenSlug) {
           return res.status(400).json({ error: 'Target screen is required' });
         }
 
-        if (submittedPlayerBaseUrl) {
+        if (livePlayerDeviceId) {
+          physicalPlayerId = livePlayerDeviceId;
+        } else if (livePlayerBaseUrl || submittedPlayerBaseUrl) {
           const [playerRows] = await pool.query(
-            'SELECT identifier FROM d_players WHERE public_base_url = ? LIMIT 1',
-            [submittedPlayerBaseUrl]
+            'SELECT identifier, public_base_url FROM d_players WHERE public_base_url = ? LIMIT 1',
+            [livePlayerBaseUrl || submittedPlayerBaseUrl]
           );
-          const registeredPlayerId = String(playerRows[0] && playerRows[0].identifier || '').trim();
-          if (registeredPlayerId) {
-            physicalPlayerId = registeredPlayerId;
-          }
+          const registeredPlayer = playerRows[0] || null;
+          physicalPlayerId = String(registeredPlayer && registeredPlayer.identifier || '').trim();
+          registeredPlayerBaseUrl = normalizeExplicitPlayerBaseUrl(registeredPlayer && registeredPlayer.public_base_url);
+        } else if (legacyDeviceId || liveDeviceId) {
+          const [playerRows] = await pool.query(
+            'SELECT identifier, public_base_url FROM d_players WHERE identifier = ? LIMIT 1',
+            [legacyDeviceId || liveDeviceId]
+          );
+          const registeredPlayer = playerRows[0] || null;
+          physicalPlayerId = String(registeredPlayer && registeredPlayer.identifier || '').trim();
+          registeredPlayerBaseUrl = normalizeExplicitPlayerBaseUrl(registeredPlayer && registeredPlayer.public_base_url);
         }
-
-        physicalPlayerId = physicalPlayerId || legacyDeviceId;
         if (!physicalPlayerId) {
           return res.status(400).json({ error: 'Registered player identity is required' });
         }
 
-        const [currentRows] = await pool.query(
-          `SELECT d.client_name, s.slug AS current_screen_slug
-           FROM d_onboarding_devices d
-           LEFT JOIN d_screens s ON s.id = d.screen_id
-           WHERE d.device_id = ?
-           LIMIT 1`,
-          [physicalPlayerId]
-        );
+        let [currentRows] = tabClientId
+          ? await pool.query(
+            `SELECT d.client_name, s.slug AS current_screen_slug
+             FROM d_onboarding_devices d
+             LEFT JOIN d_screens s ON s.id = d.screen_id
+             WHERE d.device_id = ?
+             LIMIT 1`,
+            [tabClientId]
+          )
+          : [[]];
+        if (!currentRows.length && physicalPlayerId && physicalPlayerId !== tabClientId) {
+          [currentRows] = await pool.query(
+            `SELECT d.client_name, s.slug AS current_screen_slug
+             FROM d_onboarding_devices d
+             LEFT JOIN d_screens s ON s.id = d.screen_id
+             WHERE d.device_id = ?
+             LIMIT 1`,
+            [physicalPlayerId]
+          );
+        }
         const onboardingRow = currentRows[0] || null;
         const resolvedClientName = String(clientName || onboardingRow && onboardingRow.client_name || '').trim();
         const currentScreenSlug = String(onboardingRow && onboardingRow.current_screen_slug || '').trim();
@@ -418,7 +514,6 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
           });
         }
 
-        const liveConnections = await fetchScreenConnections(slug);
         let status = null;
         if (onboardingRow) {
           const [targetRows] = await pool.query('SELECT id, name, slug FROM d_screens WHERE slug = ? LIMIT 1', [targetScreenSlug]);
@@ -485,14 +580,20 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
           };
         }
         let targetPlayerUrl = '';
-        const liveConnection = Array.isArray(liveConnections)
+        const matchedLiveConnection = Array.isArray(liveConnections)
           ? liveConnections.find(function (connection) {
-              const candidateConnectionId = String(connection && (connection.id || connection.clientId) || '').trim();
+              const candidateConnectionId = String(connection && connection.id || '').trim();
+              const candidateClientId = String(connection && connection.clientId || '').trim();
               const candidateDeviceId = String(connection && connection.deviceId || '').trim();
-              return candidateConnectionId === connectionId || candidateConnectionId === physicalPlayerId || candidateDeviceId === physicalPlayerId;
+              return candidateConnectionId === connectionId
+                || candidateClientId === connectionId
+                || candidateConnectionId === physicalPlayerId
+                || candidateClientId === physicalPlayerId
+                || candidateDeviceId === physicalPlayerId;
             }) || liveConnections[0] || null
           : null;
-        const sourcePlayerBaseUrl = normalizeExplicitPlayerBaseUrl(playerBaseUrl || (liveConnection && liveConnection.playerPublicBaseUrl) || '');
+        const sourcePlayerBaseUrl = livePlayerDeviceId ? '' : registeredPlayerBaseUrl
+          || normalizeExplicitPlayerBaseUrl(matchedLiveConnection && matchedLiveConnection.playerPublicBaseUrl);
         if (sourcePlayerBaseUrl) {
           targetPlayerUrl = `${sourcePlayerBaseUrl}/screen/${encodeURIComponent(targetScreenSlug)}`;
         }
@@ -505,8 +606,14 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
           connectionId: connectionId || null,
           screenSlug: targetScreenSlug
         });
-        if (playerBaseUrl) {
-          await forwardPlayerCommandForPlayerBaseUrl(slug, playerBaseUrl, {
+        if (livePlayerDeviceId) {
+          await forwardPlayerCommandForConnections(slug, liveConnections, {
+            command: 'redirect',
+            url: targetPlayerUrl,
+            moveToken: moveToken || null
+          }, connectionId || physicalPlayerId || undefined, physicalPlayerId || null);
+        } else if (sourcePlayerBaseUrl) {
+          await forwardPlayerCommandForPlayerBaseUrl(slug, sourcePlayerBaseUrl, {
             command: 'redirect',
             url: targetPlayerUrl,
             moveToken: moveToken || null
@@ -523,6 +630,13 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
           await broadcastDashboardState();
         }
 
+        await recordScreenControlAudit(req, slug, command, {
+          connectionId: connectionId || null,
+          deviceId: physicalPlayerId,
+          targetScreenSlug: targetScreenSlug,
+          clientName: status ? status.client_name : resolvedClientName
+        });
+
         return res.json({
           screen: screenRows[0],
           screenSlug: slug,
@@ -544,14 +658,32 @@ module.exports = function registerScreenCommandRoutes(app, deps) {
       }
 
       const liveConnections = await fetchScreenConnections(slug);
-      const result = playerBaseUrl
-        ? await forwardPlayerCommandForPlayerBaseUrl(slug, playerBaseUrl, commandPayload, connectionId, null)
-        : await forwardPlayerCommandForConnections(slug, liveConnections, commandPayload, connectionId, null);
+      const liveConnection = connectionId
+        ? liveConnections.find(function (connection) {
+            const candidateConnectionId = String(connection && connection.id || '').trim();
+            const candidateClientId = String(connection && connection.clientId || '').trim();
+            return candidateConnectionId === connectionId || candidateClientId === connectionId;
+          })
+        : null;
+      const livePlayerBaseUrl = normalizeExplicitPlayerBaseUrl(liveConnection && liveConnection.playerPublicBaseUrl);
+      const targetPlayerBaseUrl = livePlayerBaseUrl || playerBaseUrl;
+      const liveDeviceId = String(liveConnection && liveConnection.playerDeviceId || '').trim();
+      const result = liveDeviceId && typeof forwardPlayerCommandToDevice === 'function'
+        ? await forwardPlayerCommandToDevice(liveDeviceId, Object.assign({ screenSlug: slug }, commandPayload, connectionId ? { connectionId: connectionId } : {}))
+        : targetPlayerBaseUrl
+          ? await forwardPlayerCommandForPlayerBaseUrl(slug, targetPlayerBaseUrl, commandPayload, connectionId, null)
+          : await forwardPlayerCommandForConnections(slug, liveConnections, commandPayload, connectionId, null);
 
       if (typeof broadcastDashboardState === 'function') {
         await broadcastDashboardState();
       }
 
+      await recordScreenControlAudit(req, slug, command, {
+        connectionId: connectionId || null,
+        blackout: command === 'blackout' ? Boolean(commandPayload.blackout) : undefined,
+        paused: command === 'pause' ? Boolean(commandPayload.paused) : undefined
+      });
+
       return res.json(Object.assign({
         screen: screenRows[0],
         screenSlug: slug,

src/web/routes/admin/manage.js

@@ -15,6 +15,7 @@ module.exports = function registerManageRoutes(app, deps) {
   const getScreenConnections = deps.getScreenConnections;
   const forwardPlayerCommand = deps.forwardPlayerCommand;
   const forwardPlayerCommandToBaseUrl = deps.forwardPlayerCommandToBaseUrl;
+  const forwardPlayerCommandToDevice = deps.forwardPlayerCommandToDevice;
   const requirePermission = deps.requirePermission;
 
   const SCREEN_NAME_MAX_LENGTH = 255;
@@ -88,12 +89,30 @@ module.exports = function registerManageRoutes(app, deps) {
   }
 
   async function forwardPlayerCommandForConnections(slug, connections, commandPayload) {
-    const targetBaseUrls = await resolvePlayerBaseUrlsForConnections(connections);
+    const connectionList = Array.isArray(connections) ? connections : [];
+    const remoteDeviceIds = Array.from(new Set(connectionList.map(function (connection) {
+      return String(connection && connection.playerDeviceId || '').trim();
+    }).filter(Boolean)));
+    const localConnections = connectionList.filter(function (connection) {
+      return !String(connection && connection.playerDeviceId || '').trim();
+    });
+    const results = [];
+    if (remoteDeviceIds.length && typeof forwardPlayerCommandToDevice === 'function') {
+      const remoteResults = await Promise.allSettled(remoteDeviceIds.map(function (deviceId) {
+        return forwardPlayerCommandToDevice(deviceId, Object.assign({ screenSlug: slug }, commandPayload || {}));
+      }));
+      results.push.apply(results, remoteResults);
+    }
+
+    const targetBaseUrls = await resolvePlayerBaseUrlsForConnections(localConnections);
     if (targetBaseUrls.length && typeof forwardPlayerCommandToBaseUrl === 'function') {
-      const results = await Promise.allSettled(targetBaseUrls.map(function (targetBaseUrl) {
+      const localResults = await Promise.allSettled(targetBaseUrls.map(function (targetBaseUrl) {
         return forwardPlayerCommandToBaseUrl(targetBaseUrl, slug, commandPayload);
       }));
+      results.push.apply(results, localResults);
+    }
 
+    if (results.length) {
       return {
         ok: true,
         sent: results.filter(function (result) {

src/web/routes/admin/users.js

@@ -1,7 +1,8 @@
 	// Admin user route registration and user-role management.
 
 	const { fetchAppSettings } = require('#src/data/app-settings');
-	const { buildAuditChanges } = require('#src/data/audit-log');
+	const { formatAccountEmailExpiry, renderAccountEmailTemplate } = require('#src/data/account-email-templates');
+	const { buildAuditChanges, formatUserAgentLabel } = require('#src/data/audit-log');
 
 	module.exports = function registerUsersRoutes(app, deps) {
 	const pool = deps.pool;
@@ -10,6 +11,10 @@
 	const formatDashboardDate = deps.formatDashboardDate;
 	const getAuditUserId = deps.getAuditUserId;
 	const recordRequestAuditEvent = deps.recordRequestAuditEvent;
+	const sendAccountEmail = deps.sendAccountEmail;
+	const createOneTimeToken = deps.createOneTimeToken;
+	const hashSessionToken = deps.hashSessionToken;
+	const getRequestOrigin = deps.getRequestOrigin;
 	const hashPassword = deps.hashPassword;
 	const validatePasswordStrength = deps.validatePasswordStrength;
 	const readArrayField = deps.readArrayField;
@@ -20,6 +25,8 @@
 
 	const USER_NAME_MAX_LENGTH = 255;
 	const USER_USERNAME_MAX_LENGTH = 255;
+	const USER_EMAIL_MAX_LENGTH = 320;
+	const EMAIL_PATTERN = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 
 	const LIST_PAGE_SIZE = 25;
 
@@ -78,6 +85,23 @@
 		return { ok: true, roleIds: normalizedRoleIds };
 	}
 
+	function mapInvitationForView(invitation, roleNamesById) {
+		let roleIds = [];
+		try {
+			roleIds = JSON.parse(invitation.role_ids_json || '[]');
+		} catch (error) {
+			roleIds = [];
+		}
+		return Object.assign({}, invitation, {
+			roleNames: roleIds.map(function (roleId) {
+				return roleNamesById.get(Number(roleId));
+			}).filter(Boolean).join(', ') || 'No roles assigned',
+			createdAtLabel: formatDashboardDate(invitation.created_at),
+			expiresAtLabel: formatDashboardDate(invitation.expires_at),
+			createdByLabel: invitation.created_by_username || 'System'
+		});
+	}
+
 	app.get('/settings/users', requirePermission('users.read'), async function (req, res, next) {
 		try {
 			const page = Math.max(1, Math.floor(Number(req.query.page) || 1));
@@ -102,6 +126,77 @@
 		}
 	});
 
+	app.get('/settings/invitations', requirePermission('invitations.read'), async function (req, res, next) {
+		try {
+			const page = Math.max(1, Math.floor(Number(req.query.page) || 1));
+			const search = common.getSearchQuery(req);
+			const sort = common.getSortQuery(req);
+			const direction = common.getSortDirectionQuery(req);
+			const data = await rbacData.fetchInvitationsPage(pool, page, LIST_PAGE_SIZE, search, sort, direction);
+			const roles = await fetchRoleOptions();
+			const roleNamesById = new Map((roles || []).map(function (role) {
+				return [Number(role.id), role.name];
+			}));
+			const invitations = (data.invitations || []).map(function (invitation) {
+				return mapInvitationForView(invitation, roleNamesById);
+			});
+			res.send(pages.renderInvitationsPage({
+				invitations: invitations,
+				pagination: buildPagination(data.totalItems, data.currentPage, 'page', { search: search, sort: sort, direction: direction }, LIST_PAGE_SIZE, 'invitations', 'Invitation pages'),
+				message: req.query.message ? String(req.query.message) : ''
+			}, req.currentUser));
+		} catch (error) {
+			next(error);
+		}
+	});
+
+	app.post('/settings/invitations/:id/delete', requirePermission('invitations.delete'), async function (req, res, next) {
+		try {
+			const invitationId = Number(req.params.id);
+			if (!Number.isInteger(invitationId) || invitationId <= 0) {
+				return res.status(400).send('Invalid invitation.');
+			}
+			const [result] = await pool.query('DELETE FROM a_user_invitations WHERE id = ? AND used_at IS NULL', [invitationId]);
+			if (!result || !result.affectedRows) {
+				return res.status(404).send('Invitation not found.');
+			}
+			if (typeof recordRequestAuditEvent === 'function') await recordRequestAuditEvent(pool, req, { category: 'users', eventType: 'user.invitation_deleted', actorUserId: getAuditUserId(req), targetType: 'invitation', targetId: invitationId });
+			res.redirect('/settings/invitations?message=' + encodeURIComponent('Invitation deleted.'));
+		} catch (error) {
+			next(error);
+		}
+	});
+
+	app.post('/settings/invitations/:id/resend', requirePermission('invitations.allow'), async function (req, res, next) {
+		try {
+			const invitationId = Number(req.params.id);
+			if (!Number.isInteger(invitationId) || invitationId <= 0) {
+				return res.status(400).send('Invalid invitation.');
+			}
+			if (typeof sendAccountEmail !== 'function' || typeof createOneTimeToken !== 'function' || typeof hashSessionToken !== 'function') {
+				return res.status(503).send('Email delivery is not available.');
+			}
+			const settings = await fetchAppSettings(pool);
+			if (!settings['email.smtp_enabled']) {
+				return res.status(503).send('Email delivery is not configured.');
+			}
+			const [rows] = await pool.query('SELECT email, name, role_ids_json FROM a_user_invitations WHERE id = ? AND used_at IS NULL AND expires_at > NOW() LIMIT 1', [invitationId]);
+			if (!rows.length) {
+				return res.status(404).send('Invitation not found.');
+			}
+			const invitation = rows[0];
+			const token = createOneTimeToken();
+			const invitationUrl = getRequestOrigin(req) + '/accept-invite?token=' + encodeURIComponent(token);
+			const expiryHours = Number(settings['email.invitation_expiry_hours']);
+			await sendAccountEmail(settings, Object.assign({ to: invitation.email }, renderAccountEmailTemplate(settings['email.invitation_subject'], settings['email.invitation_body'], { url: invitationUrl, username: '', display_name: invitation.name || 'there', email: invitation.email, expiry_time: formatAccountEmailExpiry(expiryHours, 'hours'), action_alignment: settings['email.invitation_button_alignment'], action_label: settings['email.invitation_button_text'] })));
+			await pool.query('UPDATE a_user_invitations SET token_hash = ?, expires_at = DATE_ADD(NOW(), INTERVAL ' + expiryHours + ' HOUR), created_at = NOW(), created_by = ? WHERE id = ? AND used_at IS NULL', [hashSessionToken(token), getAuditUserId(req), invitationId]);
+			if (typeof recordRequestAuditEvent === 'function') await recordRequestAuditEvent(pool, req, { category: 'users', eventType: 'user.invitation_resent', actorUserId: getAuditUserId(req), targetType: 'invitation', targetId: invitationId, targetLabel: invitation.email });
+			res.redirect('/settings/invitations?message=' + encodeURIComponent('Invitation resent.'));
+		} catch (error) {
+			next(error);
+		}
+	});
+
 	app.get('/settings/users/new', requirePermission('users.create'), function (req, res) {
 		fetchRoleOptions().then(function (roles) {
 			res.send(pages.renderUsersAddPage(req.query.message ? String(req.query.message) : '', req.currentUser, mapRolesForForm(roles, []), {}, 'primary'));
@@ -110,6 +205,54 @@
 		});
 	});
 
+	app.get('/settings/users/invite', requirePermission('invitations.create'), async function (req, res, next) {
+		try {
+			const roles = await fetchRoleOptions();
+			res.send(pages.renderUsersInvitePage('', req.currentUser, mapRolesForForm(roles, []), {}, 'success'));
+		} catch (error) {
+			next(error);
+		}
+	});
+
+	app.post('/settings/users/invite', requirePermission('invitations.create'), async function (req, res, next) {
+		try {
+			const email = common.validateMaxLength(req.body.email || '', USER_EMAIL_MAX_LENGTH, 'Email').toLowerCase();
+			const name = common.validateMaxLength(req.body.name || '', USER_NAME_MAX_LENGTH, 'Name');
+			const selectedRoleIds = readArrayField(req.body, ['role_ids[]', 'role_ids']);
+			const roleCheck = await validateRoleIds(selectedRoleIds);
+			const formValues = { email: email, name: name };
+			async function renderInviteError(message) {
+				const roles = await fetchRoleOptions();
+				return res.status(400).send(pages.renderUsersInvitePage(message, req.currentUser, mapRolesForForm(roles, selectedRoleIds), formValues, 'warning'));
+			}
+			if (!email || !EMAIL_PATTERN.test(email)) return renderInviteError('Email address is invalid.');
+			if (!name) return renderInviteError('Display name is required.');
+			if (!roleCheck.ok) return renderInviteError(roleCheck.message);
+			if (typeof sendAccountEmail !== 'function' || typeof createOneTimeToken !== 'function' || typeof hashSessionToken !== 'function') return renderInviteError('Email delivery is not available.');
+			const settings = await fetchAppSettings(pool);
+			if (!settings['email.smtp_enabled']) return renderInviteError('Email delivery is not configured.');
+			const [existingUsers] = await pool.query('SELECT id FROM a_users WHERE email = ? OR pending_email = ? LIMIT 1', [email, email]);
+			if (existingUsers.length) return renderInviteError('That email address is already associated with an account.');
+			const [recentInvites] = await pool.query('SELECT COUNT(*) AS invite_count FROM a_user_invitations WHERE created_by = ? AND created_at > DATE_SUB(NOW(), INTERVAL 1 HOUR)', [getAuditUserId(req)]);
+			if (Number(recentInvites[0] && recentInvites[0].invite_count) >= 25) return renderInviteError('Invitation sending is temporarily limited. Try again later.');
+			const token = createOneTimeToken();
+			await pool.query('UPDATE a_user_invitations SET used_at = NOW() WHERE email = ? AND used_at IS NULL', [email]);
+			const expiryHours = Number(settings['email.invitation_expiry_hours']);
+			await pool.query('INSERT INTO a_user_invitations (email, name, role_ids_json, token_hash, expires_at, created_by) VALUES (?, ?, ?, ?, DATE_ADD(NOW(), INTERVAL ' + expiryHours + ' HOUR), ?)', [email, name || null, JSON.stringify(roleCheck.roleIds), hashSessionToken(token), getAuditUserId(req)]);
+			const invitationUrl = getRequestOrigin(req) + '/accept-invite?token=' + encodeURIComponent(token);
+			try {
+				await sendAccountEmail(settings, Object.assign({ to: email }, renderAccountEmailTemplate(settings['email.invitation_subject'], settings['email.invitation_body'], { url: invitationUrl, username: '', display_name: name || 'there', email: email, expiry_time: formatAccountEmailExpiry(expiryHours, 'hours'), action_alignment: settings['email.invitation_button_alignment'], action_label: settings['email.invitation_button_text'] })));
+			} catch (mailError) {
+				await pool.query('DELETE FROM a_user_invitations WHERE token_hash = ?', [hashSessionToken(token)]);
+				throw mailError;
+			}
+			if (typeof recordRequestAuditEvent === 'function') await recordRequestAuditEvent(pool, req, { category: 'users', eventType: 'user.invitation_sent', actorUserId: getAuditUserId(req), targetType: 'email', targetLabel: email, details: { roleIds: roleCheck.roleIds } });
+			res.redirect('/settings/users?message=' + encodeURIComponent('Invitation sent.'));
+		} catch (error) {
+			next(error);
+		}
+	});
+
 	app.get('/settings/users/:id/duplicate', requirePermission('users.read'), requirePermission('users.create'), async function (req, res, next) {
 		try {
 			const userId = Number(req.params.id);
@@ -166,7 +309,7 @@
 				return {
 					id: Number(session.id),
 					ipAddress: String(session.ip_address || 'Unknown'),
-					userAgent: String(session.user_agent || 'Unknown browser'),
+					userAgent: formatUserAgentLabel(session.user_agent) || 'Unknown browser',
 					createdAtLabel: formatDashboardDate(session.created_at),
 					lastUsedAtLabel: formatDashboardDate(session.last_used_at),
 					expiresAtLabel: formatDashboardDate(session.expires_at)
@@ -222,6 +365,7 @@
 		try {
 			const name = common.validateMaxLength(req.body.name || '', USER_NAME_MAX_LENGTH, 'Name');
 			const username = common.validateMaxLength(req.body.username || '', USER_USERNAME_MAX_LENGTH, 'Username');
+			const email = common.validateMaxLength(req.body.email || '', USER_EMAIL_MAX_LENGTH, 'Email').toLowerCase();
 			const password = String(req.body.password || '');
 			const confirmPassword = String(req.body.confirm_password || '');
 			const saveAction = String(req.body.save_action || req.body.action || '').trim().toLowerCase();
@@ -229,7 +373,8 @@
 			const roleCheck = await validateRoleIds(selectedRoleIds);
 			const formValues = {
 				username: username,
-				name: name
+				name: name,
+				email: email
 			};
 
 			async function renderValidationError(message) {
@@ -243,6 +388,9 @@
 			if (!username) {
 				return renderValidationError('Username is required.');
 			}
+			if (email && !EMAIL_PATTERN.test(email)) {
+				return renderValidationError('Email address is invalid.');
+			}
 			const passwordStrengthMessage = validatePasswordStrength(password, await getPasswordRequirements());
 			if (passwordStrengthMessage) {
 				return renderValidationError(passwordStrengthMessage);
@@ -267,8 +415,8 @@
 			const actorId = getAuditUserId(req);
 			await connection.beginTransaction();
 			const [result] = await connection.query(
-				'INSERT INTO a_users (name, username, password_hash, password_salt, password_iterations, must_change_password, created_by, modified_by) VALUES (?, ?, ?, ?, ?, ?, ?, ?)',
-				[name, username, passwordRecord.hash, passwordRecord.salt, passwordRecord.iterations, mustChangePassword ? 1 : 0, actorId, actorId]
+				'INSERT INTO a_users (name, username, email, password_hash, password_salt, password_iterations, must_change_password, created_by, modified_by) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)',
+				[name, username, email || null, passwordRecord.hash, passwordRecord.salt, passwordRecord.iterations, mustChangePassword ? 1 : 0, actorId, actorId]
 			);
 			await rbacData.syncUserRoles(connection, result.insertId, roleCheck.roleIds);
 			await connection.commit();
@@ -364,7 +512,9 @@
 			}
 
 			const username = common.validateMaxLength(req.body.username || user.username || '', USER_USERNAME_MAX_LENGTH, 'Username');
+			const email = common.validateMaxLength(req.body.email || '', USER_EMAIL_MAX_LENGTH, 'Email').toLowerCase();
 			const accountLocked = req.body.account_locked === '1' || (Array.isArray(req.body.account_locked) && req.body.account_locked.includes('1'));
+			const emailVerified = req.body.email_verified === '1' || (Array.isArray(req.body.email_verified) && req.body.email_verified.includes('1'));
 
 			const [countRows] = await pool.query('SELECT COUNT(*) AS user_count FROM a_users');
 			const canDelete = !countRows.length || Number(countRows[0].user_count) > 1;
@@ -386,6 +536,9 @@
 			if (!username) {
 				return renderValidationError('Username is required.');
 			}
+			if (email && !EMAIL_PATTERN.test(email)) {
+				return renderValidationError('Email address is invalid.');
+			}
 			if (shouldUpdatePassword) {
 				const passwordStrengthMessage = validatePasswordStrength(password, await getPasswordRequirements());
 				if (passwordStrengthMessage) {
@@ -410,12 +563,14 @@
 			const changes = buildAuditChanges({
 				name: user.name,
 				username: user.username,
+				email: user.email || '',
 				roleIds: user.roleIds,
 				accountLocked: Boolean(user.account_locked),
 				passwordReset: false
 			}, {
 				name: name,
 				username: username,
+				email: email,
 				roleIds: roleCheck.roleIds,
 				accountLocked: accountLocked,
 				passwordReset: shouldUpdatePassword
@@ -426,6 +581,10 @@
 				await connection.rollback();
 				return res.status(404).send('User not found.');
 			}
+			await connection.query('UPDATE a_users SET email = ?, email_verified_at = CASE WHEN email = ? THEN email_verified_at ELSE NULL END, modified_by = ? WHERE id = ?', [email || null, email || null, getAuditUserId(req), userId]);
+			if (emailVerified && email && (await fetchAppSettings(pool))['security.allow_admin_email_verification_bypass']) {
+				await connection.query('UPDATE a_users SET email_verified_at = NOW() WHERE id = ? AND email = ?', [userId, email]);
+			}
 			await rbacData.syncUserRoles(connection, userId, roleCheck.roleIds);
 			if (accountLocked) {
 				await connection.query('DELETE FROM a_sessions WHERE user_id = ?', [userId]);
@@ -471,6 +630,17 @@
 						details: { source: 'administrator' }
 					});
 				}
+				if (emailVerified && !user.email_verified_at && email) {
+					await recordRequestAuditEvent(pool, req, {
+						category: 'security',
+						eventType: 'email.verification_bypassed',
+						actorUserId: req.currentUser.id,
+						targetType: 'user',
+						targetId: userId,
+						targetLabel: username,
+						details: { source: 'administrator' }
+					});
+				}
 			}
 			if (saveAction === 'new') {
 				return res.redirect('/settings/users/new?message=' + encodeURIComponent('User updated.'));

src/web/routes/auth/accept-invite.js

@@ -0,0 +1,27 @@
+const { renderView } = require('../../view');
+
+module.exports = function renderAcceptInvitePage(message, token, email, name, passwordRequirements, isValidInvitation) {
+  const requirements = passwordRequirements || { minimumLength: 10, minimumCategories: 3, requireLowercase: false, requireUppercase: false, requireNumber: false, requireSymbol: false };
+  const requiredCategories = [];
+  if (requirements.requireLowercase) requiredCategories.push('lowercase');
+  if (requirements.requireUppercase) requiredCategories.push('uppercase');
+  if (requirements.requireNumber) requiredCategories.push('number');
+  if (requirements.requireSymbol) requiredCategories.push('symbol');
+  const passwordRequirementsText = requiredCategories.length
+    ? 'Use at least ' + requirements.minimumLength + ' characters and include ' + requiredCategories.join(', ') + '.'
+    : requirements.minimumCategories === 4
+      ? 'Use at least ' + requirements.minimumLength + ' characters and include uppercase, lowercase, number, and symbol.'
+      : 'Use at least ' + requirements.minimumLength + ' characters and include ' + requirements.minimumCategories + ' of: uppercase, lowercase, number, and symbol.';
+  return renderView('auth/accept-invite', {
+    title: 'Accept invitation',
+    authShell: true,
+    bodyClass: 'login-page-body',
+    message: message || '',
+    isValidInvitation: Boolean(isValidInvitation),
+    token: token || '',
+    email: email || '',
+    name: name || '',
+    passwordMinimumLength: requirements.minimumLength,
+    passwordRequirementsText: passwordRequirementsText
+  });
+};

src/web/routes/auth/email-verification-error.js

@@ -0,0 +1,5 @@
+const { renderView } = require('../../view');
+
+module.exports = function renderEmailVerificationErrorPage(message) {
+  return renderView('auth/email-verification-error', { title: 'Verification link unavailable', authShell: true, bodyClass: 'login-page-body', message: message || 'This email verification link is invalid or has expired.' });
+};