Adjust API source response header spacing

# Conflicts:
#	CHANGELOG.md
#	build/package.player.json
#	build/package.web.json
#	package-lock.json
#	package.json

.dockerignore

@@ -1,4 +1,9 @@
 *
 !package.json
+!package-lock.json
+!build/
+!build/**
 !src/
 !src/**
+!scripts/
+!scripts/**

.env.example

@@ -1,21 +0,0 @@
-NODE_ENV=production
-WEB_PORT=3000
-PLAYER_PORT=3001
-
-DB_HOST=mysql
-DB_PORT=3306
-DB_NAME=signage
-DB_USER=signage_user
-DB_PASSWORD=signage_password
-MYSQL_ROOT_PASSWORD=root_password
-
-PLAYER_INTERNAL_BASE_URL=http://player:3001
-PLAYER_PUBLIC_BASE_URL=http://localhost:3001
-PULSE_SIGNAGE_SHARED_SECRET=
-
-SESSION_MAX_AGE_DAYS=14
-DASHBOARD_REFRESH_INTERVAL_MS=2000
-DEFAULT_ADMIN_USERNAME=admin
-DEFAULT_ADMIN_NAME=Admin
-DEFAULT_ADMIN_PASSWORD=admin
-PASSWORD_HASH_ITERATIONS=310000

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -0,0 +1,48 @@
+name: Bug report
+about: Report a problem with Pulse Signage
+labels:
+  - bug
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Please provide enough detail to reproduce the problem.
+
+  - type: textarea
+    id: steps
+    attributes:
+      label: Steps to reproduce
+      description: List the actions that trigger the bug.
+      placeholder: |
+        1. Open the dashboard
+        2. Change the playlist on a screen
+        3. Save and wait for playback to refresh
+    validations:
+      required: true
+
+  - type: textarea
+    id: expected
+    attributes:
+      label: Expected behavior
+      description: What you expected to happen.
+    validations:
+      required: true
+
+  - type: textarea
+    id: actual
+    attributes:
+      label: Actual behavior
+      description: What actually happened.
+    validations:
+      required: true
+
+  - type: textarea
+    id: environment
+    attributes:
+      label: Environment
+      description: Include version, browser, player setup, and any relevant logs.
+      placeholder: |
+        Version:
+        Browser:
+        Player version:
+        Logs:

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,5 @@
+blank_issues_enabled: false
+contact_links:
+  - name: Documentation
+    url: https://git.lzstealth.com/LZStealth/pulse-signage
+    about: Check the project repository and docs before opening an issue.

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -0,0 +1,37 @@
+name: Feature request
+about: Suggest an improvement or new capability
+labels:
+  - enhancement
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Share the problem you're trying to solve and the outcome you'd like.
+
+  - type: textarea
+    id: problem
+    attributes:
+      label: Problem statement
+      description: What limitation or workflow gap are you trying to address?
+    validations:
+      required: true
+
+  - type: textarea
+    id: proposal
+    attributes:
+      label: Proposed solution
+      description: Describe the change you would like to see.
+    validations:
+      required: true
+
+  - type: textarea
+    id: alternatives
+    attributes:
+      label: Alternatives considered
+      description: Any workarounds or other approaches you've considered.
+
+  - type: textarea
+    id: context
+    attributes:
+      label: Additional context
+      description: Mockups, screenshots, examples, or related links.

.github/copilot-instructions.md

@@ -0,0 +1,17 @@
+# Repository Instructions
+
+## Versioning and releases
+
+- Treat `package.json` as the source of truth for the application version.
+- Keep `package.json`, `build/package.player.json`, and `build/package.web.json` on the same version number.
+- Keep dependency versions and package metadata in `package.json`, `package-lock.json`, `build/package.player.json`, and `build/package.web.json` aligned unless a dependency is intentionally omitted from a specific bundle.
+- When changing bundled library versions, update the About page source data from the same package metadata or vendored asset banner rather than hardcoding a fresh literal.
+- When the app version changes, update `CHANGELOG.md` in the same change.
+- Keep database migration versions aligned with the release they actually belong to.
+- If only part of a migration batch belongs to a newer release, split that batch into a separate migration entry instead of relabeling the earlier release.
+- Do not bump migration versions just because the app version changed.
+
+## Before finishing a versioned change
+
+- Confirm the package version, changelog entry, and migration tags are consistent.
+- If a release note mentions a feature or fix, make sure the matching code path or migration block is tagged to the same release.

.github/workflows/docker-publish.yml

@@ -7,9 +7,20 @@ on:
   workflow_dispatch:
 
 jobs:
-  build-and-push:
+  build-and-push-existing-registry:
     runs-on: ubuntu-latest
 
+    strategy:
+      fail-fast: false
+      matrix:
+        include:
+          - name: web
+            repository: pulse-signage-web
+            dockerfile: ./build/Dockerfile
+          - name: player
+            repository: pulse-signage-player
+            dockerfile: ./build/Dockerfile.player
+
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4
@@ -17,7 +28,7 @@ jobs:
       - name: Set up Docker Buildx
         uses: docker/setup-buildx-action@v3
 
-      - name: Log in to container registry
+      - name: Log in to existing package registry
         uses: docker/login-action@v3
         with:
           registry: git.lzstealth.com
@@ -28,18 +39,19 @@ jobs:
         id: meta
         uses: docker/metadata-action@v5
         with:
-          images: git.lzstealth.com/LZStealth/pulse-signage
+          images: |
+            git.lzstealth.com/lzstealth/${{ matrix.repository }}
           tags: |
             type=raw,value=latest
             type=ref,event=tag
-            type=semver,pattern=v{{major}}.{{minor}}
             type=semver,pattern=v{{major}}
+            type=semver,pattern=v{{major}}.{{minor}}
 
       - name: Build and push image
         uses: docker/build-push-action@v6
         with:
           context: .
-          file: ./Dockerfile
+          file: ${{ matrix.dockerfile }}
           push: true
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}

.gitignore

@@ -1,9 +1,15 @@
 node_modules/
 media/
+!src/web/lib/media/
+!src/web/lib/media/**
 docker-compose.dev.yml
+/docker-compose/*.dev.yml
+/docker-compose/*.env
+/dev-demo-seed.js
 .vscode/
 .env
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 .DS_Store
+TODO.md

CHANGELOG.md

@@ -2,9 +2,885 @@
 
 All notable changes to this project will be documented in this file.
 
-## Unreleased
+## 2.8.7 - 2026-08-22
 
-- No unreleased changes recorded yet.
+### Added
+
+- Added configurable JSON POST requests and two-step login-then-token authentication for API sources.
+
+## 2.8.6 - 2026-08-18
+
+### 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.
+
+## 2.8.5 - 2026-08-17
+
+### Fixed
+
+- Fixed thumbnail capture timing so video assets are ready before the preview canvas is captured.
+- Replaced unavailable webpage thumbnails with a subdued placeholder while keeping live webpage previews intact.
+
+## 2.8.4 - 2026-08-17
+
+### 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.
+
+### Fixed
+
+- Fixed popup preview authentication for background thumbnail capture.
+- Fixed thumbnails so they use the same popup-preview canvas and resolve API/RSS placeholders, fonts, styles, and cached images correctly.
+- Fixed manual scheduled-task run notifications so they use task-neutral wording.
+
+## 2.8.3 - 2026-08-17
+
+### 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.
+
+### Changed
+
+- API and RSS regions now preserve authored content when no data source is selected and remain blank when a selected source has no authored content.
+- Normal WYSIWYG image insertion remains upload-backed and separate from image placeholder transforms.
+
+## 2.8.2 - 2026-08-16
+
+### Changed
+
+- Standardized update audit events on from/to changes and added readable table diffs for nested JSON, arrays, null values, and empty strings.
+- Standardized internal `src/data` imports on the `#src` alias.
+
+## 2.8.1 - 2026-08-16
+
+### Fixed
+
+- Prevented startup and runtime duplicate-key writes from consuming auto-increment values in permission, player, onboarding, settings, and relationship tables.
+- Prevented partial timetable schemas from being incorrectly treated as fully migrated during schema version detection.
+
+### Changed
+
+- Renamed the built-in administrator role key to `super-admin`, while allowing its display name and description to be edited without being overwritten on restart.
+
+## 2.8.0 - 2026-08-16
+
+### Added
+
+- Filtered audit-log CSV export with a dedicated `audit-log.export` permission.
+- Canvas Sizes as an individual Content audit category.
+- Audit events for slide, template, playlist, and screen changes.
+- Audit events for System Settings changes.
+- Administration audit events for user and role management.
+- Audit logging enablement, category selection, and request metadata controls.
+- The extensible audit event storage, retention setting, dedicated audit-log permission, and paginated viewer foundation.
+- A Defaults settings section for player and announcement defaults.
+- A configurable maximum active session limit that removes the oldest sessions first.
+- IP address and user-agent metadata to active sessions.
+- The option for users to sign out their other active sessions from My Account.
+- Persistent administrator-controlled account locking and unlocking.
+- Database-backed login rate limiting with configurable attempts, lockout duration, and tracking scope.
+- 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.
+
+### Changed
+
+- Updated the API and database documentation and added the Docker publish status badge to the project README.
+- Renamed the audit export permission to `audit-log.allow`.
+- Made Content and Data Sources audit categories opt-in and excluded automatic data-source refreshes from audit logging.
+- Split Content audit logging into individual Slides, Templates, Playlists, Screens, and Announcements categories.
+- Renamed the System Settings audit category key from `settings` to `system-settings`.
+- Split audit administration events into separate Users and Roles categories.
+- Split RSS and API data-source refresh defaults.
+- Made the default announcement duration use a value and unit selector, matching announcement forms.
+- 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
+
+### Changed
+
+- The announcement icon picker now supports searching the full Bootstrap Icons catalog while still showing the curated suggestion set by default.
+
+### Fixed
+
+- The announcement Play/Stop button now refreshes after saving screen-group changes, so Play stays disabled until the announcement actually has targets again.
+
+## 2.7.5 - 2026-08-15
+
+### Changed
+
+- The About page now reads bundled library versions from package metadata and the vendored AdminLTE stylesheet.
+- AdminLTE is now reported as 4.3.1.
+- Animate.css is now reported as 4.1.1.
+- Bootstrap Icons is now reported as 1.13.1.
+- Cropper.js is now reported as 1.6.2.
+- Express is now reported as 5.2.1.
+- Handlebars is now reported as 4.7.8.
+- hls.js is now reported as 1.7.0.
+- Multer is now reported as 2.2.0.
+- MySQL2 is now reported as 3.23.3.
+- Sharp is now reported as 0.35.3.
+- TinyMCE is now reported from the vendored package metadata.
+- ws is now reported as 8.21.3.
+- The runtime and container images now target Node.js 26.
+
+## 2.7.4 - 2026-08-15
+
+### Added
+
+- A new About page.
+
+### Changed
+
+- Refreshed the vendored AdminLTE assets to 4.3.1.
+
+## 2.7.3 - 2026-08-15
+
+### Changed
+
+- The slide image cropper now warns that SVG and GIF files will be rasterized if they are edited, and it keeps the original file only when the full image remains selected.
+- The slide image upload flow now accepts PNG, JPG, GIF, WebP, and SVG images, while the WYSIWYG image uploader now matches that same allowlist.
+- TIFF is no longer accepted by the WYSIWYG image uploader.
+
+### Fixed
+
+- The player now preserves quoted custom font-family values from rich text content, so fonts with spaces such as Old London render correctly on screens.
+
+## 2.7.2 - 2026-08-14
+
+### Fixed
+
+- HTML and webpage region previews now normalize object-shaped content before rendering, so the player, thumbnails, and popup preview show the intended iframe content instead of leaking raw objects.
+- HTML and webpage preview iframes now size explicitly to the full region bounds in the player, thumbnails, and popup preview.
+
+## 2.7.1 - 2026-08-14
+
+### Changed
+
+- The player page now supports keyboard navigation with arrow keys to move between slides.
+
+## 2.7.0 - 2026-08-14
+
+### Added
+
+- The WYSIWYG editor now supports adding small images.
+
+### Changed
+
+- The WYSIWYG image insertion flow also received a small code cleanup to simplify the related helper logic.
+- The default table formatting has been applied.
+- Timetable regions now use the renamed helpers end to end in the editor and player, including timezone-aware rendering for timetable entry placeholders.
+
+## 2.6.27 - 2026-08-14
+
+### Fixed
+
+- Scheduled task intervals now display the most appropriate exact unit, such as seconds, minutes, hours, or days, while keeping the sort order numeric.
+
+## 2.6.26 - 2026-08-10
+
+### Changed
+
+- API sources and RSS feeds now accept hours as an update interval unit, and the list and background task scheduling paths now format and convert that unit correctly.
+
+## 2.6.25 - 2026-08-10
+
+### Fixed
+
+- Screen group edit now keeps the slug locked after creation, so existing screen group URLs remain stable.
+
+## 2.6.24 - 2026-08-10
+
+### Fixed
+
+- Deferred playlist updates now keep the current slide index when the next playlist snapshot is applied, so playback no longer jumps back to the first slide mid-cycle.
+
+## 2.6.23 - 2026-08-09
+
+### Fixed
+
+- Dashboard quick-action and kiosk-launcher cards now use row spacing instead of extra card padding, so the layout stays consistent at large widths.
+- API and RSS refresh jobs now notify affected player screens only when the refreshed data actually changes, so unchanged polls no longer trigger redundant player refreshes.
+
+## 2.6.22 - 2026-08-09
+
+### Changed
+
+- Startup now logs the previously detected schema version, the current app version, and whether pending migrations exist.
+
+### Fixed
+
+- Direct-to-URL player sessions now generate and persist a stable onboarding device id in session storage, so connected screens can still be moved and renamed independently without going through the onboarding flow first.
+- The connected-clients move action now tolerates rows that only have a live connection id, which keeps move operations working for screens that skipped onboarding.
+
+## 2.6.21 - 2026-08-09
+
+### Changed
+
+- Startup now logs the previously detected schema version, the current app version, and whether migrations are required.
+- The schema documentation now reflects the timetable table rename, the new `o_app_state` table, and startup version tracking.
+- Timetable timezone placeholders now use `tz` for the short zone name and `tz_long` for the full IANA zone.
+
+## 2.6.20 - 2026-08-09
+
+### Changed
+
+- Startup now logs the previously detected schema version, the current app version, and whether migrations are required.
+
+## 2.6.19 - 2026-08-09
+
+### Changed
+
+- Timetable editor helpers, routes, and table layout now use timetable-specific naming and tighter card/table styling.
+- Connected clients now sort by client identity fields instead of the old IP-based ordering assumption.
+
+## 2.6.18 - 2026-08-09
+
+### Changed
+
+- Timetable tables were renamed from the old `schedule` names to `timetable` names, and existing databases now rename those tables during migration.
+- The timetable group editor now uses timetable-specific naming in its shared helpers and keeps the entries table aligned with the standard admin card/table layout.
+
+## 2.6.17 - 2026-08-09
+
+### Changed
+
+- Existing timetable groups and entries are now migrated to Europe/London, and timetable dates are rewritten to UTC using that source timezone so the wall-clock meaning stays intact.
+
+### Fixed
+
+- New timetable groups now default to Europe/London so the timetable editor and saved data start from the same timezone assumption as the migrated rows.
+
+## 2.6.16 - 2026-08-09
+
+### Changed
+
+- Timetable groups now store an IANA time zone and render their entry datetimes in that timetable time zone, so schedules keep the same wall-clock meaning when they are edited from another country.
+
+### Fixed
+
+- Timetable entry date inputs now round-trip through the timetable time zone instead of the browser locale, so saving from Florida while targeting Germany keeps the intended local times.
+
+## 2.6.15 - 2026-08-08
+
+### Fixed
+
+- Slide update media sync on the player now removes uploads that were removed from the slide, so player storage stays aligned with the current slide content.
+- Routine player and player-bridge media upload/delete logs were removed to keep remote player and bridge operation quieter.
+- Background task descriptions no longer repeat the player slug when the task key already ends with that player name.
+
+## 2.6.14 - 2026-08-08
+
+### Fixed
+
+- Slide updates and template deletes now fan out media sync work across all live players instead of targeting only one player.
+
+## 2.6.13 - 2026-08-08
+
+### Fixed
+
+- The player bundle now keeps the browser-only QR export dependencies lazy-loaded, so the remote player image no longer needs `puppeteer-core` or `@sparticuz/chromium` at startup.
+- Remote player startup sync now falls back to `WEB_INTERNAL_URL` when it is configured, which avoids 404s when the bridge is not the correct sync target.
+- The player startup sync and media-write info logs were removed to keep normal remote-player operation quieter.
+
+## 2.6.12 - 2026-08-08
+
+### Fixed
+
+- The Docker build inputs now live under `build/`, with separate web and player package manifests so the player image no longer carries the web browser tooling bundle.
+- The Docker publish workflow now restores `v2` and `v2.2` style image tags alongside `latest` and the full release tag.
+- Remote player sync and upload routing now carry the exact connected player device id through the bridge, so startup media and font jobs target the correct player instance in split-device deployments.
+- Player websocket registration now learns the public base URL from the actual screen request origin, so localhost and 127.0.0.1 aliases both keep websocket commands working.
+
+## 2.6.11 - 2026-08-08
+
+### Fixed
+
+- Role edits now save selected permissions from the shared RBAC form, so changes on the role page persist when you submit the form.
+- RBAC permission sections now stay open independently in the accordion, so opening one section no longer closes the others.
+
+## 2.6.10 - 2026-08-08
+
+### Fixed
+
+- The onboarding landing page and form no longer restore a previously selected screen, so the screen picker always starts clean while still keeping the saved client name.
+
+## 2.6.9 - 2026-08-08
+
+### Fixed
+
+- The connected-clients view no longer exposes or sorts by client IP, so the table stays focused on the player identity, screen, and playback state.
+- The connected-clients dashboard row renderer now keeps the actions column aligned after removing the IP column, so row updates no longer append a duplicate actions cell.
+
+## 2.6.8 - 2026-08-08
+
+### Fixed
+
+- The screen-group command buttons stay disabled until a real target group is selected, so the placeholder "Select Screen Group" state cannot send commands.
+
+## 2.6.7 - 2026-08-08
+
+### Fixed
+
+- Admin client commands now stay on the bridge for remote players, so screen control no longer depends on a public player address.
+- The connected-clients screen-group controls now use the same async bulk-command path as the dashboard, including the All Screens option and live pause/blackout toggles.
+
+## 2.6.6 - 2026-08-07
+
+### Fixed
+
+- Timetable entry editing now validates end times locally, requires the end to be at least one minute after the start, and highlights the end field when the value is invalid.
+
+## 2.6.5 - 2026-08-07
+
+### Added
+
+- Multiple players are now supported across the player registry, dashboard snapshots, and screen group management, so a deployment can track more than one connected player at a time.
+- The player-agent can now run remotely, which lets a player connect through the bridge instead of requiring everything to stay on the same host.
+- The Docker Compose setup now includes a public stack with a player bridge service and a separate remote player stack, so local and split-device deployments share the same documented layout.
+- Dedicated local and remote compose manifests now live at `docker-compose/docker-compose.yml` and `docker-compose/docker-compose.remote.yml`, with matching example env files for the two deployment modes.
+- Admin client commands now have a dedicated route and test coverage, which keeps dashboard actions aligned with the current player control-plane flow.
+
+### Changed
+
+- Screen group views now show each registered player's public base URL and computed player URL on the edit screen instead of assuming a single local player.
+- The dashboard status indicator now reports the connected player count, which makes the live feed status more explicit when several players are online.
+- Player command dispatch, playlist playback, and render preloading were tightened so the player keeps using the active web base URL and can warm assets before the slide is shown.
+- Playlist video-duration selection now uses the longest matching video region when a slide contains more than one video region.
+- Media sync, font sync, and upload sync now follow the newer player-agent workflow, keeping background tasks and dashboard refreshes consistent with split-device deployments.
+- The onboarding landing page now shows a built-in QR placeholder and falls back to it when the QR request fails, so the screen never starts blank.
+- Upload sync now resolves the player internal base URL once per batch and reuses it for queued upload and delete operations, keeping mirrored media writes pointed at the active player endpoint.
+- The connected clients list now defaults to client name, then IP address, so rows stay in a stable order when connection details change.
+
+### Fixed
+
+- Connected clients search results now keep the row action column, because the row template resolves `currentUser` from the parent view context while rendering inside the `clients` loop.
+- The move-client modal now carries the row's player base URL through to the redirect step, so clients move correctly even when local and bridge-backed players are mixed.
+- Paginated table cards now only apply their minimum height when the table content would otherwise exceed that threshold, which keeps short result sets compact in smaller browser windows.
+
+## 2.6.4 - 2026-08-07
+
+### Fixed
+
+- The screen table no longer stores a player foreign key, and screen/player URLs now resolve from the current player registration instead of a screen assignment.
+
+## 2.6.3 - 2026-08-07
+
+### Fixed
+
+- The screen table no longer enforces a foreign key to the player table, which keeps player assignments flexible while preserving the existing screen schema.
+
+## 2.6.2 - 2026-08-07
+
+### Fixed
+
+- The player registry now upgrades to an integer player id with a separate player identifier so the schema migration can complete cleanly on existing databases.
+- Dashboard screen lookups now tolerate the upgraded player table layout during the rollout.
+
+## 2.6.1 - 2026-08-06
+
+### Fixed
+
+
+### Changed
+
+- The web side now resolves the player base URL from the database-backed player registration record instead of depending on a web-container environment fallback.
+- Player registrations now store a separate friendly identifier, so a player can keep the same device key while showing a label like `Shop2`.
+
+## 2.5.14 - 2026-08-06
+
+### Added
+
+- Added 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.
+
+
+## 2.5.13 - 2026-08-05
+
+### Fixed
+
+- Slide and template save forms now allow larger multipart text fields, so rich region content no longer trips Multer's default field-value limit.
+
+## 2.5.12 - 2026-08-05
+
+### Fixed
+
+- The auth route test now loads the alias bootstrap before the login flow, so isolated test runs do not depend on prior module initialization.
+- The slide editor now blocks pasted data images in TinyMCE so image content must come through the upload flow.
+
+## 2.5.11 - 2026-08-05
+
+### Fixed
+
+- Single-slide playlists now re-render the active slide immediately when a refresh arrives, instead of waiting for a transition that never happens.
+- Playlist create and update flows now redirect to the canonical `/playlists/:id/edit` path after saving.
+- Slide preview popups now keep rich-text spacing and line height consistent with the editor preview.
+
+## 2.5.10 - 2026-08-05
+
+### Fixed
+
+- Slide editor rich-text updates now keep the hidden field and preview state in sync after inline formatting actions.
+
+## 2.5.9 - 2026-08-05
+
+### Fixed
+
+- Screen playlist refreshes now wait until the next slide transition before applying a pending update, so one-slide playlists do not swap immediately during a refresh.
+- Playlist rows now show the mute control for any playable media region, including RTMP slides, instead of only video regions.
+
+## 2.5.8 - 2026-08-05
+
+### Fixed
+
+- MariaDB migrations now retry alternate foreign-key constraint names when screen-to-player constraint creation reports a duplicate-key error.
+
+## 2.5.7 - 2026-08-05
+
+### Fixed
+
+- QR template backgrounds now use a single solid color only, and the editor no longer exposes a background gradient mode.
+
+## 2.5.6 - 2026-08-05
+
+### Added
+
+- Onboarding QR rendering now uses the vendored `qr-code-styling` library directly, with a wider quiet zone and extra frame padding so the code does not clip at the corners.
+
+### Changed
+
+- The shared QR helper now renders `qr-code-styling` in Node without the old `qrcode` or `qrcode-generator` packages.
+- The onboarding QR endpoint now generates the styled QR at request time, and the player onboarding page requests it only after confirming the player is not already onboarded.
+- Playlist QR preview backfill now uses the same styled QR helper as onboarding, so playlist snapshots and generated previews stay consistent.
+- The onboarding QR layout now keeps the code inset within its frame so the corners have more breathing room.
+
+## 2.5.5 - 2026-08-04
+
+### Added
+
+- A shared Dupe flow was added to most admin create pages and list views, including roles, users, playlists, slides, templates, canvas sizes, announcements, and supported data sources.
+
+### Changed
+
+- RBAC roles now include a Dupe action that opens a copy-on-create flow with the selected permissions already populated.
+- Users now include a Dupe action that opens the add-user form with the copied name and roles, while leaving the username blank for a new login.
+- User usernames are now editable from the admin users section, while the personal account password page remains unchanged.
+- The users form now allows creating an account without assigning any roles.
+- Save and New on the users form now returns to the blank create page instead of falling back to the list.
+- Password updates now accept a slightly lighter policy of 10 characters with 3 of 4 character classes, and the account and user password forms now describe the updated requirement.
+- The slide rich-text editor now groups underline, strikethrough, subscript, and superscript into a single split-button control, with the main button using the underline icon and the dropdown exposing the other text-format actions.
+- Chip formatting in the slide rich-text editor now uses a reusable inline-format helper so the chip action continues to sync and mark the editor as edited when applied.
+- RSS, API, and timetable placeholder help text now uses the same transform examples, spacing, and typography as the timetable version, with the hint shown after the visible placeholders and before any overflow disclosure.
+
+### Fixed
+
+- Cells and inputs now enforce route-specific character limits on the form itself and on the matching save paths, so overlong values no longer fail at submit time.
+- Playlist rows now use a grip drag handle with separate up/down move controls, and the drag grip cursor now changes to grab and grabbing on hover and drag.
+- Playlist duration inputs now respect a min-only limit correctly, so the shared limiter no longer coerces values down to 0 when no max attribute is present.
+- Playlist row video and mute toggles now use the correct filled/outline Bootstrap button styles for their current state without relying on the `active` class.
+- Slides table search now only matches slide titles and template names, and no longer searches within slide content.
+- Banner marquee text now measures its real cycle width so top-banner and lower-third announcements loop continuously instead of resetting from a fixed start position.
+- Slide editor template selection now stays editable on blank slides until the user makes a real content edit, so TinyMCE hydration no longer locks the canvas immediately.
+- Slide editor region cards now share a common header shell, so the image and video chips stay aligned with the other region types on the Video Webpage and HTML RTMP pages.
+- Firefox preview popup now centers the preview canvas in normal layout flow and scales from the center, so the popup preview lines up correctly in Chrome and Firefox.
+- Canvas size edits now keep the width and height fields locked while the size is in use, and oversized canvas dimensions are rejected at 16384 instead of reaching the save path.
+- Schedule rules now start collapsed by default, use the built-in card collapse behavior, and keep validation messages visible without re-highlighting empty paired inputs.
+- Timetable group deletes now scan slide content for the actual `timetable_group_id` field, so groups that are still referenced by slides stay protected from deletion.
+- Timetable add and edit pages now keep cancel confirmation tied to timetable entry edits, so changes inside the entries table are treated as unsaved form changes.
+- Screen add and edit pages now keep the Player URL box in a stable two-column layout, so switching between the forms no longer causes the page to jump or shift.
+- Screen add pages now show the secondary Save and Close / Save and New actions, and screen edit delete actions now prompt for confirmation before removing the screen.
+- Admin user password resets now keep the selected user in view by returning to that user's edit page after saving.
+- Account password saves now refresh the page after the success toast is queued so the confirmation message stays visible.
+- Shared toast handling now preserves a pending success message across the redirect so refreshes do not drop the confirmation banner.
+- Announcement create and edit pages now keep the save action buttons visible, and the edit-page delete action now prompts for confirmation before deleting.
+- Active announcements are now blocked from deletion with a clearer edit-page message that explains why.
+- Slide template create now shows the background image remove button and clear flag, matching the edit page behavior.
+- Template create now exposes Save & Close and Save & New actions, and template edit delete actions now use the shared action-button helper with a confirmation prompt instead of a separate hidden form.
+- The advanced animation modal now shows intro, outro, and loop durations as 1-200% fields, with 100% saving back as 1000ms.
+- The advanced animation modal now hard-limits repeat counts to 999 so attention-seeker animations cannot be configured with unbounded loops.
+- Template editor region boxes now rerender when the canvas or stage resizes, and region width/height changes now keep the lock ratio, stay within the canvas, and shift back on-canvas instead of spilling over.
+- Background tasks and scheduled tasks now render timestamps in 24-hour format, and the background task queue keeps a confirmation prompt before clearing finished items.
+
+## 2.5.4 - 2026-08-03
+
+### Changed
+
+- The API source bearer token field now uses a password input with a right-side toggle to show or hide the token.
+
+### Fixed
+
+- QR code regions now render at the correct size in the slide editor preview, and the QR chip header now matches the other region cards.
+- The dashboard onboarding link now uses the player public base URL stored in the database instead of a `/screen/...` URL.
+
+## 2.5.3 - 2026-08-03
+
+### Changed
+
+- The user edit page delete action now shows a confirmation prompt before removing an account.
+
+### Fixed
+
+- Schedule modal cancel now restores the original rule set instead of keeping edits made after the modal opened.
+
+## 2.5.2 - 2026-08-03
+
+### Changed
+
+- Player page auth now writes a cookie for websocket reuse, and player and announcement sockets accept that cookie so they no longer depend on query-string tokens.
+- RSS and API region placeholder panels now use shared field-aware chip rendering, with updated spacing and defaults across the slide editor.
+- RTMP regions now default audio to enabled in the editor, and the slide rich-text editor no longer allows anchor tags.
+
+### Fixed
+
+- Player websocket auth now falls back to the `pulse_page_auth` cookie when the auth query parameter is unavailable.
+
+## 2.5.1 - 2026-08-03
+
+### Added
+
+- Template regions now include a dedicated advanced animation modal for editing intro, outro, and Attention Seekers settings directly.
+
+### Changed
+
+- Template region animation settings now store as a single JSON object with `intro`, `outro`, and `loop` keys.
+- The template editor advanced animation field now edits the JSON object directly instead of separate preset selects.
+- Animate.css is now loaded from vendored assets so template previews and player rendering use the local copy.
+
+### Fixed
+
+- Existing databases now migrate legacy animation columns into `animation_json` and then drop the old columns.
+
+## 2.5.0 - 2026-08-03
+
+### Added
+
+- Template regions now support intro, exit, and Attention Seekers animation presets in the editor, with in-canvas preview controls.
+
+### Changed
+
+- The template editor now locks editing while preview playback is running so animation changes are easier to inspect.
+
+### Fixed
+
+- Existing databases now receive the template region animation columns through the versioned migration path.
+
+## 2.4.2 - 2026-08-02
+
+### Added
+
+- Screen-level controls are now shown on the dashboard for quicker access to screen actions.
+- Connected clients can now be moved to another screen from the dashboard, and the player redirects to the new screen after the binding updates.
+- Playlist slide config now includes a mute toggle for video and RTMP items, and the player honors the stored mute state during playback.
+
+### Changed
+
+- Playlist canvas lock now stores `canvas_id` on `c_playlists` and links directly to `c_canvas_sizes`.
+- Playlist add and edit now keep the selected canvas size tied to the playlist form flow, so canvas changes stay consistent while editing.
+- RBAC permission sections now follow the same order as the admin sidebar, with section spacing kept in 10-point increments.
+- Admin add/edit pages now share form view-model helpers and common form shells across data sources, signage, RBAC, and user settings, reducing duplicated template markup.
+- Playlist editing now goes through a shared form page helper with dedicated schedule-rule cards and drag sorting, keeping slide rows and rule state in sync.
+- Data sources now use per-section route modules for API sources, RSS feeds, and timetables, while the shared controller only keeps the root `/data-sources` redirect.
+- The consolidated admin shell also refreshed shared layout, toast, login, and error rendering to match the newer helper registration flow.
+- Connected client row actions now use consistent icon-and-label buttons for pause and blackout across the server-rendered page and live dashboard updates.
+
+### Fixed
+
+- Canvas filtering for playlist slides now follows the selected canvas size id instead of a derived signature.
+- Saving API sources and RSS feeds no longer throws an internal server error after the route split, because the shared data-source refresh task service is wired through the web bootstrap again.
+
+## 2.4.1 - 2026-08-02
+
+### Changed
+
+- Playlist canvas size is now stored on `c_playlists.canvas_signature` and the migration backfills existing single-canvas playlists.
+
+### Fixed
+
+- Playlist canvas sizing no longer relies on startup bootstrap logic.
+
+## 2.4.0 - 2026-08-02
+
+### Added
+
+- Playlist slide scheduling now supports multiple OR-ed rule blocks instead of a single date-or-time schedule.
+
+### Changed
+
+- Playlist slide schedule data now stores rule sets in `schedule_rules_json`, and the migration backfills legacy schedule columns before dropping them.
+
+### Fixed
+
+- Legacy `schedule_mode`, date, time, and day columns are removed from `c_playlist_slides` after the new rule schema is installed.
+
+## 2.3.0 - 2026-08-02
+
+### Added
+
+- Shared add/edit form templates now cover API sources, RSS feeds, announcements, canvas sizes, screens, and templates, reducing duplicate page markup.
+- Schedule data source CRUD was added for grouped events in the admin UI.
+- The schedule region was added for rendering grouped events in slides and player playback.
+- Schedule data now flows through `scheduleGroups` in the slide editor and player payloads, letting the schedule region show upcoming or current entries from a selected group.
+
+### Changed
+
+- Admin save actions were standardized around the shared `saveActionButtons` helper, including save, save-and-close, save-and-new, cancel, and delete controls.
+- Admin routes and page renderers now route through the shared form/view helpers instead of separate add/edit templates for the refactored sections.
+- Toast, error, login, and shared layout rendering were refreshed to line up with the consolidated admin shell and helper registration flow.
+
+### Fixed
+
+- Canvas size defaults now seed only once during bootstrap when `c_canvas_sizes` is empty, instead of running from the schema layout path on every startup.
+- The schema bootstrap file is now limited to table layout definitions, with one-time seed data handled by the bootstrap layer.
+
+## 2.2.2 - 2026-08-01
+
+### Fixed
+
+- The theme bootstrap now resolves saved `auto` to an actual dark or light value on first paint, so explicit dark mode no longer flashes white while the page loads.
+- The shared app header is now sticky so the top navigation stays visible while scrolling.
+
+## 2.2.1 - 2026-08-01
+
+### Fixed
+
+- Managed-font source files are now tracked correctly so packaged releases include the `src/web/lib/media` module instead of shipping a broken build.
+
+## 2.2.0 - 2026-08-01
+
+### Added
+
+- Announcement management is now wired for the admin UI and player overlay, with color, template, and expiry controls.
+- Time / Date regions now render live in the editor and player.
+
+### Changed
+
+- Announcement lists now default-sort by Description and show the affected screens for each announcement.
+- Role add and edit pages now include a Cancel action alongside the save buttons.
+- Announcement publishing now only targets explicitly assigned screens; unassigned announcements no longer publish globally.
+
+### Fixed
+
+- Announcement screen labels now correctly distinguish No Screens, partial assignments, and All Screens.
+- Role duplicate-name validation on edit now checks the correct RBAC table.
+
+## 2.1.1 - 2026-08-01
+
+### Added
+
+- API source latest-response viewing now supports collapsing and expanding all JSON sections from the edit page.
+- Placeholder transforms now support basic string helpers like `.upper()`, `.title()`, and `.lower()`.
+
+### Changed
+
+- The API source add page now matches the edit page’s section titles and layout more closely.
+- API source placeholder suggestions now stay leaf-only, so container paths and arrays are no longer suggested as placeholders.
+- Slide editor and player placeholder resolution now share the same parsing and transform logic.
+- API source and RSS editor helper text now shows the new placeholder transform syntax.
+- API sources, RSS feeds, slides, users, and roles now render their delete actions in a disabled outlined-danger state when deletion is blocked, matching the rest of the admin tables.
+- The users edit page no longer wraps all sections in one outer card, so the profile, password, and roles cards render as separate sections.
+
+### Fixed
+
+- API source item-path overrides continue to treat the final path as an array source, while nested object fields remain available for placeholders.
+- The API source latest-response panel now opens as a tree view by default instead of a flat JSON blob.
+
+## 2.1.0 - 2026-07-30
+
+### Added
+
+- Screen and dashboard player links now render the full player URL instead of only the player base host.
+
+### 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.
+
+### Fixed
+
+- Removed several onboarding and runtime code paths that were still inserting or refreshing `d_players` rows during normal player playback.
+- Fixed the screen-binding flow so it no longer writes a device UUID into `d_screens.player_id`, which avoided foreign key errors under the shared-player model.
+
+## 2.0.0 - 2026-07-28
+
+### Breaking Changes
+
+- Breaking database schema changes were introduced in this release; existing databases may require migration or recreation before upgrading.
+
+### Added
+
+- Broader player and admin release coverage across onboarding, playlist playback, background task handling, and media-region support.
+
+### Changed
+
+- The database bootstrap and migration flow were reorganized, with shared DB helpers split out to support the newer schema layout.
+- Admin and signage views were updated around the newer list, playlist, and RBAC behavior, including playlist scheduling and screen/client actions.
+- Player runtime, onboarding, and region rendering were tightened so HTML, image, RSS, RTMP, text, video, and webpage regions follow the newer playback flow.
+- Background task, upload sync, and data-source refresh handling were refined across the web app and startup paths.
+- Docker, environment, README, and websocket/api documentation were refreshed to match the current release structure.
+
+### Fixed
+
+- Client name checks, playlist editing, and slide/media synchronization paths were adjusted to better preserve existing references during admin and player updates.
+
+## 1.5.16 - 2026-07-26
+
+### Added
+
+- Background task handling was split into dedicated handler and scheduling modules, with startup data-source refreshes and unused-upload cleanup wired through the shared setup flow.
+
+### Changed
+
+- The admin shell, shared theme, and toast presentation were refreshed to match the newer layout and notification styling.
+- Playlist scheduling now handles video-duration toggles and already-assigned slides more clearly in the picker and editor UI.
+- RBAC and settings views were updated to align with the revised admin layout and shared table behavior.
+
+### Fixed
+
+- Template and slide thumbnail refreshes now run through the background task queue so template-wide thumbnail regeneration stays consistent.
+
+## 1.5.15 - 2026-07-26
+
+### Changed
+
+- Player slide transitions now start and pause video playback around the fade window so video regions stay aligned with the slide boundary.
+- Dashboard action cards now use a three-column grid on wider layouts.
+
+### Fixed
+
+- Slide video duration probes now preserve sub-second precision instead of rounding to whole seconds.
+
+## 1.5.14 - 2026-07-26
+
+### Fixed
+
+- Dashboard client action icons now render valid Bootstrap Icon classes without duplicating the `bi-` prefix.
+
+## 1.5.13 - 2026-07-26
+
+### Added
+
+- Shared table helpers for pagination, search, and sorting across the admin and signage views.
+
+### Changed
+
+- Refreshed the shared admin shell and moved common UI behavior into shared layout and helper modules.
+- Reworked dashboard, background tasks, RBAC, and signage list pages to use the newer shared table and state flow.
+- Updated the admin and player branding assets and tightened the page scripts around the new layout structure.
+
+## 1.5.12 - 2026-07-26
+
+### Changed
+
+- Shared web UI helpers are now loaded once in the admin shell and reused across the dashboard, admin, and template editor.
+- Template lists now show slide counts, and the template editor tracks which regions are already in use.
+
+### Fixed
+
+- Template editing now blocks removal of regions that are still referenced by slides.
+
+## 1.5.11 - 2026-07-26
+
+### Added
+
+- Video regions are now supported end to end, including player rendering, admin editing, playlist scheduling, and player sync.
+
+### Changed
+
+- The slide, template, and playlist flows were updated so video content can be created, configured, and scheduled alongside existing region types.
+- Player rendering and related media handling now recognize the new video region implementation.
+
+### Fixed
+
+- Region and upload handling were adjusted so video media syncs cleanly through the player and web admin paths.
+
+## 1.5.10 - 2026-07-26
+
+### Added
+
+- Scheduled background tasks now have their own settings page, separate permission gate, and manual run action alongside the main queue view.
+- The slide editor now includes a refreshed preview/sidebar layout and a cropper-based image upload flow.
+
+### Changed
+
+- Background task and admin list views now use richer pagination and filtering so queue state, task sources, and recurring jobs stay easier to navigate.
+- The admin shell and shared styling were refreshed to support the updated settings pages, slide editor layout, and task table presentation.
+
+### Fixed
+
+- Upload sync and slide thumbnail refresh handling were tightened so slide changes queue follow-up work more reliably.
+
+## 1.5.9 - 2026-07-26
+
+### Fixed
+
+- User creation now keeps the role checkboxes inside the add-user form so selected roles are submitted correctly.
+
+## 1.5.8 - 2026-07-25
+
+### Fixed
+
+- Upload removal requests now authenticate correctly when a deployed player parses a bodyless `DELETE` request as an empty object, which could cause 401s for newly uploaded images.
+
+## 1.5.6 - 2026-07-25
+
+### Changed
+
+- Playlist slide picker now uses a button to reveal already added slides, while still defaulting to showing only available slides.
+- Already-added slides in the picker are now labeled and visually muted to make them easier to spot.
+
+### Fixed
+
+- Thumbnails in slide and playlist tables now follow the slide canvas ratio and cap at 5.5rem tall.
+- Thumbnail-only table columns are no longer sortable.
+
+## 1.5.5 - 2026-07-25
+
+### Fixed
+
+- Fixed a migration gap that could leave `slides.thumbnail_path` missing on upgraded databases.
+
+## 1.5.4 - 2026-07-25
+
+### Added
+
+- Cropper.js has been added to aid with image uploading.
+
+### Changed
+
+- Upgraded Multer to 2.x to remove the deprecated 1.x dependency warning.
+- Tightened a few admin UI details, including slide editor and RBAC list spacing/typography adjustments.
+
+## 1.5.3 - 2026-07-25
+
+### Added
+
+- A modal-based slide picker for playlist editing with search, multi-select, and slide thumbnails.
+- Reusable modal and table-pagination helpers for the admin UI.
+- Slide thumbnail previews in playlist schedules, with image fallbacks when a thumbnail is missing.
+
+### Changed
+
+- RTMP playback now probes session readiness more aggressively and retries startup before surfacing failures.
+- Playlist editing now includes richer scheduling controls, live slide counts, and support for skipping unavailable RTMP slides.
+- Admin lists and background task pages now preserve filter and pagination state during AJAX navigation.
+- Shared admin shell styling and helpers were refreshed to support the newer list, modal, and pagination UI.
+
+### Fixed
+
+- Player upload sync and route handling now degrade more gracefully when backend services are unavailable.
+- RTMP and playlist playback now recover more cleanly when a stream fails to initialize or respond in time.
 
 ## 1.5.2 - 2026-07-25
 

Dockerfile

@@ -1,16 +0,0 @@
-FROM node:24-alpine
-
-WORKDIR /app
-
-RUN apk add --no-cache ffmpeg
-
-COPY package*.json ./
-RUN npm install --omit=dev --no-audit --no-fund
-
-COPY src ./src
-
-RUN mkdir -p /app/media
-
-EXPOSE 3000
-
-CMD ["npm", "run", "start:web"]

README.md

@@ -1,92 +1,41 @@
 # Pulse Signage
 
-Pulse Signage is a digital signage system that lets you manage screens, playlists, slides, templates, and uploaded media from one admin interface.
+[![Publish Docker Image](https://git.lzstealth.com/lzstealth/pulse-signage/actions/workflows/docker-publish.yml/badge.svg?branch=main)](https://git.lzstealth.com/lzstealth/pulse-signage/actions?workflow=docker-publish.yml)
 
-It runs as two connected services:
+Pulse Signage is a self-hosted digital signage platform for teams that want clear, reliable control over the content on every screen.
 
-- the web admin app for managing content and screens
-- the player app that shows the current signage on each screen and listens for live updates
+It gives you one place to publish playlists, slides, announcements, and live updates without handing the workflow to a third-party service.
 
-## What You Can Do
+## What It Can Do
 
-- Sign in to the admin dashboard
-- Create and organize playlists and slides
-- Design reusable templates and canvas sizes
-- Register screens and assign playlists to them
-- Manage roles and permissions for the admin web UI
-- Upload images and other media for use in slides and templates
-- View live screen connections and send player commands
+- Run polished screen experiences with playlists, slides, and reusable templates.
+- Keep announcements, schedules, RSS feeds, API content, and other live data in sync.
+- Manage many screens from a single dashboard.
+- Support everyday signage, event messages, lobbies, dashboards, and other always-on displays.
+- Keep the player, dashboard, and bridge connected so updates move quickly and consistently.
 
-Admin permissions are split into CRUD actions per section, so you can grant read-only, editor, creator, or delete access separately.
+## Why It Fits
 
-## Documentation
+- It keeps signage under your own control.
+- It is built for teams that need screens to stay current without extra manual work.
+- It works well for offices, venues, campuses, and operations teams.
+- It stays focused on display management instead of trying to be a general-purpose CMS.
 
-Player-facing API details live in [docs/api.md](docs/api.md). It covers the player HTTP endpoints for screen playback, playlist data, connections, and commands.
+## Deploying
 
-Player websocket behavior lives in [docs/websocket.md](docs/websocket.md). It covers the player control socket, snapshot stream, and the command/message shapes the player accepts.
+Docker Compose is the recommended way to deploy Pulse Signage. It keeps the web app, player, bridge, and database together in a predictable setup.
 
-## What You Need
+If you want the details, start with the [Compose guide](docker-compose/README.md).
 
-- Docker and Docker Compose
-- A MySQL database
+## Docs
 
-## First-Time Setup
+- [Documentation home](docs/README.md) - the technical reference index.
+- [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.
 
-When the app starts for the first time, it creates the database tables it needs and adds a default admin account if no users exist yet.
+## Explore The Docs
 
-- Username: `admin`
-- Password: `admin`
-
-The first admin account is placed into the built-in `Administrators` role, which has full web-admin access through the CRUD permissions.
-
-You can change the initial admin credentials with these optional environment variables:
-
-- `DEFAULT_ADMIN_USERNAME`
-- `DEFAULT_ADMIN_NAME`
-- `DEFAULT_ADMIN_PASSWORD`
-
-## Configuration
-
-The app reads its settings from environment variables.
-
-### Database Connection
-
-- `DB_HOST` - MySQL host, default `127.0.0.1`
-- `DB_PORT` - MySQL port, default `3306`
-- `DB_NAME` - database name, default `signage`
-- `DB_USER` - database user, default `signage_user`
-- `DB_PASSWORD` - database password, default `signage_password`
-
-### Web Admin App
-
-- `WEB_PORT` - admin app port, default `3000`
-- `PLAYER_INTERNAL_BASE_URL` - player address used by the server, default `http://player:3001`
-- `PLAYER_PUBLIC_BASE_URL` - player address shown in browser links, default `http://localhost:3001`
-- `PULSE_SIGNAGE_SHARED_SECRET` - shared secret used to sign player page API fetches and server-to-player requests; page tokens auto-renew while the page stays active and request signatures must be fresh; leave unset to keep the auth checks disabled for compatibility
-
-### Player App
-
-- `PLAYER_PORT` - player port, default `3001`
-
-## Docker Compose
-
-The repository includes a `docker-compose.yml` file that starts three services:
-
-- `web` - the admin app on port `3000`
-- `player` - the signage player on port `3001`
-- `mysql` - the database on port `3306`
-
-By default, `web` and `player` use the published image from `git.lzstealth.com/lzstealth/pulse-signage:latest`. You can point both services at a specific release by setting `PULSE_SIGNAGE_IMAGE` to a tagged image such as `git.lzstealth.com/lzstealth/pulse-signage:v1.0.0`.
-
-The Compose file also defines a shared `media` volume for stored assets and a `mysql_data` volume for database persistence.
-
-In Docker, media storage is controlled by the `media` volume mount at `/app/media`.
-Outside Docker, the web app and player do not have to use the same upload location or even the same server, as long as each service can access its own configured media path.
-
-## Important Notes
-
-- The web app must be able to reach the player through `PLAYER_INTERNAL_BASE_URL`.
-- When running in Docker, that value should point to the Docker service name, not `localhost`.
-- If `PULSE_SIGNAGE_SHARED_SECRET` is set, the web and player containers must use the same value, and any reverse proxy in front of the player must forward `/api/media/...` without rewriting the path.
-- Uploaded media is stored separately from the application source, so make sure it is backed up if you are not using Docker volumes.
-- The player page uses the browser Screen Wake Lock API when available, but kiosk mode and OS sleep settings still matter because the browser can deny or release the wake lock.
+The project includes a dashboard for managing content, a player runtime for rendering screens, an onboarding flow for connecting devices, and a bridge layer for remote screens. If you want to understand how the pieces fit together, the docs above cover the technical details without repeating the project overview.

build/Dockerfile

@@ -0,0 +1,18 @@
+FROM node:26-alpine
+
+WORKDIR /app
+
+RUN apk add --no-cache chromium nss freetype harfbuzz ttf-freefont
+
+COPY build/package.web.json ./package.json
+RUN npm install --omit=dev --no-audit --no-fund
+COPY package-lock.json ./package-lock.json
+
+COPY src ./src
+COPY scripts ./scripts
+
+RUN mkdir -p /app/media
+
+EXPOSE 3000
+
+CMD ["npm", "run", "start:web"]

build/Dockerfile.player

@@ -0,0 +1,18 @@
+FROM node:26-alpine
+
+WORKDIR /app
+
+RUN apk add --no-cache ffmpeg
+
+COPY build/package.player.json ./package.json
+RUN npm install --omit=dev --no-audit --no-fund
+COPY package-lock.json ./package-lock.json
+
+COPY src ./src
+COPY scripts ./scripts
+
+RUN mkdir -p /app/media
+
+EXPOSE 3000
+
+CMD ["npm", "run", "start:player"]

build/package.player.json

@@ -0,0 +1,22 @@
+{
+  "name": "pulse-signage-player",
+  "version": "2.8.7",
+  "private": false,
+  "description": "Pulse Signage player application bundle",
+  "engines": {
+    "node": ">=26.0.0"
+  },
+  "main": "src/common.js",
+  "scripts": {
+    "start": "node -r dotenv/config src/player.js",
+    "start:player": "node -r dotenv/config src/player.js"
+  },
+  "dependencies": {
+    "dotenv": "^17.4.2",
+    "express": "^5.2.1",
+    "handlebars": "^4.7.8",
+    "hls.js": "^1.7.0",
+    "mysql2": "^3.23.3",
+    "ws": "^8.21.3"
+  }
+}

build/package.web.json

@@ -0,0 +1,25 @@
+{
+  "name": "pulse-signage-web",
+  "version": "2.8.7",
+  "private": false,
+  "description": "Pulse Signage web and bridge application bundle",
+  "engines": {
+    "node": ">=26.0.0"
+  },
+  "main": "src/common.js",
+  "scripts": {
+    "start": "node -r dotenv/config src/web.js",
+    "start:web": "node -r dotenv/config src/web.js"
+  },
+  "dependencies": {
+    "@sparticuz/chromium": "^149.0.0",
+    "dotenv": "^17.4.2",
+    "express": "^5.2.1",
+    "handlebars": "^4.7.8",
+    "multer": "^2.2.0",
+    "mysql2": "^3.23.3",
+    "puppeteer-core": "^25.7.0",
+    "sharp": "^0.35.3",
+    "ws": "^8.21.3"
+  }
+}

docker-compose.yml

@@ -1,90 +0,0 @@
-services:
-  web:
-    image: ${PULSE_SIGNAGE_IMAGE:-git.lzstealth.com/lzstealth/pulse-signage:latest}
-    container_name: signage-web
-    restart: unless-stopped
-    ports:
-      - "3000:3000"
-    environment:
-      NODE_ENV: ${NODE_ENV:-production}
-      WEB_PORT: ${WEB_PORT:-3000}
-      DB_HOST: ${DB_HOST:-mysql}
-      DB_PORT: ${DB_PORT:-3306}
-      DB_NAME: ${DB_NAME:-signage}
-      DB_USER: ${DB_USER:-signage_user}
-      DB_PASSWORD: ${DB_PASSWORD:-signage_password}
-      PLAYER_INTERNAL_BASE_URL: ${PLAYER_INTERNAL_BASE_URL:-http://player:3001}
-      PLAYER_PUBLIC_BASE_URL: ${PLAYER_PUBLIC_BASE_URL:-http://localhost:3001}
-      PULSE_SIGNAGE_SHARED_SECRET: ${PULSE_SIGNAGE_SHARED_SECRET:-}
-      SESSION_MAX_AGE_DAYS: ${SESSION_MAX_AGE_DAYS:-14}
-      DASHBOARD_REFRESH_INTERVAL_MS: ${DASHBOARD_REFRESH_INTERVAL_MS:-2000}
-      DEFAULT_ADMIN_USERNAME: ${DEFAULT_ADMIN_USERNAME:-admin}
-      DEFAULT_ADMIN_NAME: ${DEFAULT_ADMIN_NAME:-Admin}
-      DEFAULT_ADMIN_PASSWORD: ${DEFAULT_ADMIN_PASSWORD:-admin}
-      PASSWORD_HASH_ITERATIONS: ${PASSWORD_HASH_ITERATIONS:-310000}
-    volumes:
-      - media:/app/media
-    command: ["npm", "run", "start:web"]
-    depends_on:
-      mysql:
-        condition: service_healthy
-    networks:
-      - pulse_signage
-
-  player:
-    image: ${PULSE_SIGNAGE_IMAGE:-git.lzstealth.com/lzstealth/pulse-signage:latest}
-    container_name: signage-player
-    restart: unless-stopped
-    ports:
-      - "3001:3001"
-    environment:
-      NODE_ENV: ${NODE_ENV:-production}
-      PLAYER_PORT: ${PLAYER_PORT:-3001}
-      PLAYER_PUBLIC_BASE_URL: ${PLAYER_PUBLIC_BASE_URL:-http://localhost:3001}
-      PULSE_SIGNAGE_SHARED_SECRET: ${PULSE_SIGNAGE_SHARED_SECRET:-}
-      DB_HOST: ${DB_HOST:-mysql}
-      DB_PORT: ${DB_PORT:-3306}
-      DB_NAME: ${DB_NAME:-signage}
-      DB_USER: ${DB_USER:-signage_user}
-      DB_PASSWORD: ${DB_PASSWORD:-signage_password}
-    volumes:
-      - media:/app/media
-    command: ["npm", "run", "start:player"]
-    depends_on:
-      mysql:
-        condition: service_healthy
-    networks:
-      - pulse_signage
-
-  mysql:
-    image: mysql:8.4
-    container_name: signage-mysql
-    restart: unless-stopped
-    ports:
-      - "3306:3306"
-    environment:
-      MYSQL_DATABASE: ${DB_NAME:-signage}
-      MYSQL_USER: ${DB_USER:-signage_user}
-      MYSQL_PASSWORD: ${DB_PASSWORD:-signage_password}
-      MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASSWORD:-root_password}
-    command:
-      - --character-set-server=utf8mb4
-      - --collation-server=utf8mb4_unicode_ci
-    volumes:
-      - mysql_data:/var/lib/mysql
-    healthcheck:
-      test: ["CMD-SHELL", "mysqladmin ping -h localhost -uroot -p$$MYSQL_ROOT_PASSWORD"]
-      interval: 10s
-      timeout: 5s
-      retries: 10
-    networks:
-      - pulse_signage
-
-volumes:
-  mysql_data:
-  media:
-
-networks:
-  pulse_signage:
-    name: pulse_signage
-    external: false

docker-compose/.env.example

@@ -0,0 +1,26 @@
+# Shared application settings
+PULSE_SIGNAGE_WEB_IMAGE="git.lzstealth.com/lzstealth/pulse-signage-web:latest"
+PULSE_SIGNAGE_PLAYER_IMAGE="git.lzstealth.com/lzstealth/pulse-signage-player:latest"
+PULSE_SIGNAGE_SHARED_SECRET=""
+
+# Database settings for the web, player, and bridge services
+DB_HOST="mysql"
+DB_PORT=3306
+DB_NAME="pulse-signage"
+DB_USER="pulse-signage"
+DB_PASSWORD="signage_password"
+MYSQL_ROOT_PASSWORD="root_password"
+
+# Player settings
+PLAYER_IDENTIFIER="player-local"
+PLAYER_PUBLIC_URL="http://localhost:8081"
+PLAYER_INTERNAL_URL="http://player:8081"
+
+# Web app bootstrap settings
+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"

docker-compose/.env.remote.example

@@ -0,0 +1,11 @@
+# Shared application settings
+PULSE_SIGNAGE_PLAYER_IMAGE="git.lzstealth.com/lzstealth/pulse-signage-player:latest"
+PULSE_SIGNAGE_SHARED_SECRET=""
+
+# Player settings
+PLAYER_IDENTIFIER="player-remote"
+PLAYER_PUBLIC_URL="http://localhost:8081"
+PLAYER_AGENT_RECONNECT_DELAY_MS=5000
+
+# Remote player connectivity settings
+BRIDGE_PUBLIC_URL="http://player-bridge.example.com:8090"

docker-compose/README.md

@@ -0,0 +1,228 @@
+# Docker Compose Setup
+
+This folder contains the Docker Compose definitions for Pulse Signage, including the public stack and the remote player stack.
+
+## 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.
+- [.env.remote.example](.env.remote.example) - sample environment values for the remote stack.
+
+## Stack Overview
+
+### Public stack
+
+The main compose stack is the most complete setup. It runs:
+
+- `web` - the dashboard and admin app.
+- `player` - the local screen player.
+- `player-bridge` - the bridge service that proxies dashboard commands and player communication.
+- `mysql` - the database used by the web, player, and bridge services.
+
+This is the stack to use when you want the full app running on one machine.
+
+### Remote player
+
+The remote stack runs only the `player` service.
+
+Use it when the player is installed on a remote device and connects back through the player bridge instead of running the full app separately.
+
+## Services
+
+### `web`
+
+The dashboard and admin application.
+
+Responsibilities:
+
+- serves the web UI on port `8080`
+- reads and writes application data from MySQL
+- forwards player actions through the configured bridge base URL
+- renders connected clients, dashboard pages, and admin workflows
+
+Key configuration:
+
+- `DB_HOST`, `DB_PORT`, `DB_NAME`, `DB_USER`, `DB_PASSWORD`
+- `PULSE_SIGNAGE_SHARED_SECRET`
+- `DEFAULT_ADMIN_USERNAME`
+- `DEFAULT_ADMIN_NAME`
+- `DEFAULT_ADMIN_PASSWORD`
+- `PASSWORD_HASH_ITERATIONS`
+
+### `player`
+
+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 the bridge in remote mode through `BRIDGE_PUBLIC_URL`
+- registers live connections and accepts control commands
+
+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
+
+### `player-bridge`
+
+The bridge layer that connects the dashboard to the player network.
+
+Responsibilities:
+
+- serves the bridge API on port `8090`
+- forwards authenticated dashboard commands to registered players
+- exposes screen connection snapshots and player registration data
+- proxies command traffic between the web app and remote players
+
+Key configuration:
+
+- `PULSE_SIGNAGE_SHARED_SECRET`
+- `WEB_INTERNAL_URL` for the bridge when it should call the web app directly instead of inferring from request headers
+- `DB_HOST`, `DB_PORT`, `DB_NAME`, `DB_USER`, `DB_PASSWORD`
+
+### `mysql`
+
+The MySQL 8.4 database used by the public stack.
+
+Responsibilities:
+
+- stores application data, screen state, onboarding state, and registry records
+- provides persistent storage through `mysql_data`
+
+Key configuration:
+
+- `MYSQL_DATABASE`
+- `MYSQL_USER`
+- `MYSQL_PASSWORD`
+- `MYSQL_ROOT_PASSWORD`
+
+## Environment Files
+
+### `.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
+
+### `.env.remote.example`
+
+Use this file on a remote player device.
+
+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
+
+### `PULSE_SIGNAGE_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.
+
+Recommended shape:
+
+- at least 32 random bytes
+- ideally 64 hex characters, or another equally long cryptographically random string
+- not a password, phrase, or anything human-readable
+
+If you want a quick local value, generate one with a password manager or a command such as `openssl rand -hex 32`.
+
+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:
+
+- `8080` - web dashboard
+- `8081` - player
+- `8090` - player bridge
+- `3306` - MySQL
+
+Remote stack ports:
+
+- `8081` - player only
+
+## Volumes
+
+### Public stack
+
+- `mysql_data` - persistent MySQL data.
+- `pulse-signage` - shared media and cache volume for the app services.
+
+### Remote stack
+
+- `pulse-signage` - shared media and cache volume for the remote player.
+
+## Networks
+
+Each compose file creates its own named network:
+
+- `pulse-signage` for the public stack
+- `pulse-signage-remote` for remote player deployment.
+
+## Notes
+
+- The public stack expects the app services and MySQL 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.
+
+## Recommended Setup
+
+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.
+5. Verify that the player appears in Connected clients before testing screen commands.

docker-compose/docker-compose.remote.yml

@@ -0,0 +1,28 @@
+name: pulse-signage-remote
+
+services:
+
+  player:
+    image: ${PULSE_SIGNAGE_PLAYER_IMAGE:-git.lzstealth.com/lzstealth/pulse-signage-player:latest}
+    restart: unless-stopped
+    networks:
+      - pulse_signage
+    ports:
+      - "8081:8081"
+    environment:
+      PLAYER_IDENTIFIER: ${PLAYER_IDENTIFIER:-player-remote}
+      PLAYER_PUBLIC_URL: ${PLAYER_PUBLIC_URL:-http://localhost:8081}
+      BRIDGE_PUBLIC_URL: ${BRIDGE_PUBLIC_URL:-}
+      PULSE_SIGNAGE_SHARED_SECRET: ${PULSE_SIGNAGE_SHARED_SECRET:-}
+      PLAYER_AGENT_RECONNECT_DELAY_MS: ${PLAYER_AGENT_RECONNECT_DELAY_MS:-5000}
+    volumes:
+      - pulse-signage:/app/media
+    command: ["node", "src/player.js"]
+
+volumes:
+  pulse-signage:
+
+networks:
+  pulse_signage:
+    name: pulse-signage-remote
+    external: false

docker-compose/docker-compose.yml

@@ -0,0 +1,103 @@
+name: pulse-signage
+
+services:
+  web:
+    image: ${PULSE_SIGNAGE_WEB_IMAGE:-git.lzstealth.com/lzstealth/pulse-signage-web:latest}
+    restart: unless-stopped
+    networks:
+      - pulse_signage
+    ports:
+      - "8080:8080"
+    environment:
+      DB_HOST: ${DB_HOST:-mysql}
+      DB_PORT: ${DB_PORT:-3306}
+      DB_NAME: ${DB_NAME:-pulse-signage}
+      DB_USER: ${DB_USER:-pulse-signage}
+      DB_PASSWORD: ${DB_PASSWORD:-signage_password}
+      PULSE_SIGNAGE_SHARED_SECRET: ${PULSE_SIGNAGE_SHARED_SECRET:-}
+      BRIDGE_INTERNAL_URL: ${BRIDGE_INTERNAL_URL:-http://player-bridge:8090}
+      DEFAULT_ADMIN_USERNAME: ${DEFAULT_ADMIN_USERNAME:-admin}
+      DEFAULT_ADMIN_NAME: ${DEFAULT_ADMIN_NAME:-Admin}
+      DEFAULT_ADMIN_PASSWORD: ${DEFAULT_ADMIN_PASSWORD:-password123}
+    volumes:
+      - pulse-signage:/app/media
+    command: ["node", "src/web.js"]
+    depends_on:
+      mysql:
+        condition: service_healthy
+
+  player:
+    image: ${PULSE_SIGNAGE_PLAYER_IMAGE:-git.lzstealth.com/lzstealth/pulse-signage-player:latest}
+    restart: unless-stopped
+    networks:
+      - pulse_signage
+    ports:
+      - "8081:8081"
+    environment:
+      PLAYER_PUBLIC_URL: ${PLAYER_PUBLIC_URL:-http://localhost:8081}
+      PLAYER_INTERNAL_URL: ${PLAYER_INTERNAL_URL:-http://player:8081}
+      PLAYER_IDENTIFIER: ${PLAYER_IDENTIFIER:-player-local}
+      PULSE_SIGNAGE_SHARED_SECRET: ${PULSE_SIGNAGE_SHARED_SECRET:-}
+      DB_HOST: ${DB_HOST:-mysql}
+      DB_PORT: ${DB_PORT:-3306}
+      DB_NAME: ${DB_NAME:-pulse-signage}
+      DB_USER: ${DB_USER:-pulse-signage}
+      DB_PASSWORD: ${DB_PASSWORD:-signage_password}
+    volumes:
+      - pulse-signage:/app/media
+    command: ["node", "src/player.js"]
+    depends_on:
+      mysql:
+        condition: service_healthy
+
+  player-bridge:
+    image: ${PULSE_SIGNAGE_WEB_IMAGE:-git.lzstealth.com/lzstealth/pulse-signage-web:latest}
+    restart: unless-stopped
+    networks:
+      - pulse_signage
+    ports:
+      - "8090:8090"
+    environment:
+      WEB_INTERNAL_URL: ${WEB_INTERNAL_URL:-http://web:8080}
+      PULSE_SIGNAGE_SHARED_SECRET: ${PULSE_SIGNAGE_SHARED_SECRET:-}
+      DB_HOST: ${DB_HOST:-mysql}
+      DB_PORT: ${DB_PORT:-3306}
+      DB_NAME: ${DB_NAME:-pulse-signage}
+      DB_USER: ${DB_USER:-pulse-signage}
+      DB_PASSWORD: ${DB_PASSWORD:-signage_password}
+    command: ["node", "src/player-bridge/index.js"]
+    depends_on:
+      mysql:
+        condition: service_healthy
+
+  mysql:
+    image: mysql:8.4
+    restart: unless-stopped
+    ports:
+      - "3306:3306"
+    environment:
+      MYSQL_DATABASE: ${DB_NAME:-pulse-signage}
+      MYSQL_USER: ${DB_USER:-pulse-signage}
+      MYSQL_PASSWORD: ${DB_PASSWORD:-signage_password}
+      MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASSWORD:-root_password}
+    command:
+      - --character-set-server=utf8mb4
+      - --collation-server=utf8mb4_unicode_ci
+    volumes:
+      - mysql_data:/var/lib/mysql
+    healthcheck:
+      test: ["CMD-SHELL", "mysqladmin ping -h localhost -uroot -p$$MYSQL_ROOT_PASSWORD"]
+      interval: 10s
+      timeout: 5s
+      retries: 10
+    networks:
+      - pulse_signage
+
+volumes:
+  mysql_data:
+  pulse-signage:
+
+networks:
+  pulse_signage:
+    name: pulse-signage
+    external: false

docs/README.md

@@ -0,0 +1,13 @@
+# Documentation
+
+This folder contains the technical reference material for Pulse Signage.
+
+## What’s Here
+
+- [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.
+
+## How To Read It
+
+If you want the big picture first, start with the main [project README](../README.md). It gives a plain overview of what Pulse Signage does, while the pages in this folder explain how the pieces work.

docs/api.md

@@ -2,7 +2,7 @@
 
 ## Overview
 
-Player service base URL: `http://localhost:3001`
+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.
 
@@ -78,6 +78,11 @@ Response fields:
 Returns the upload directory configured for the player service.
 Access: internal-only.
 
+Response fields:
+
+- `mediaDir`
+- `uploadDir`
+
 ### `PUT /api/media/{filename}`
 Writes an uploaded file into the player upload directory.
 Access: internal-only and write-protected behind your deployment boundary.
@@ -95,6 +100,14 @@ Query fields:
 - `source` required
 - `disableAudio` optional
 
+Response fields:
+
+- `key`
+- `playlistUrl`
+- `disableAudio`
+- `ready`
+- `live`
+
 ### `GET /api/rtmp/streams/{key}/index.m3u8`
 Returns the RTMP session HLS manifest.
 Access: internal-only.
@@ -114,6 +127,7 @@ Response fields:
 - `slides`
 - `rssFeeds`
 - `apiSources`
+- `timetableGroups`
 - `revision`
 
 ### `GET /api/screens/{slug}/connections`
@@ -198,6 +212,7 @@ Response fields:
 
 `GET /api/media/config` returns an object with:
 
+- `mediaDir`
 - `uploadDir`
 
 ### RTMP Session Response
@@ -208,6 +223,7 @@ Response fields:
 - `playlistUrl`
 - `disableAudio`
 - `ready`
+- `live`
 
 ### Onboarding Write Response
 
@@ -230,6 +246,7 @@ Response fields:
 - `slides`
 - `rssFeeds`
 - `apiSources`
+- `timetableGroups`
 - `revision`
 
 ### Connections Response
@@ -269,6 +286,8 @@ Response fields:
 - `id`
 - `name`
 - `fade_between_slides`
+- `skip_unavailable_rtmp`
+- `canvas_id`
 
 ### Slide
 
@@ -276,12 +295,9 @@ Response fields:
 - `title`
 - `body`
 - `duration_seconds`
-- `schedule_mode`
-- `schedule_start_datetime`
-- `schedule_end_datetime`
-- `schedule_start_time`
-- `schedule_end_time`
-- `schedule_days_json`
+- `use_video_duration`
+- `disable_audio`
+- `scheduleRules`
 - `media_url`
 - `media_type`
 - `kind`

docs/schema.md

@@ -0,0 +1,314 @@
+# Database Schema
+
+This app creates and maintains its schema at startup through `src/db/index.js`.
+The sections below summarize the current tables and their purpose.
+
+Tables generally use a numeric auto-increment `id` primary key. The relationship table `d_announcement_screens` intentionally uses the composite `(announcement_id, screen_id)` primary key instead. Natural and relationship keys remain as unique constraints where needed. Timestamps are stored as `created_at` and `modified_at` when a table supports auditing.
+
+## Admin
+
+- `a_users` - admin user accounts and password hashes.
+- `a_roles` - named role definitions.
+- `a_permissions` - permission catalog seeded from the application constants.
+- `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_users`
+
+- `id`, `name`, `username`, `password_hash`, `password_salt`, `password_iterations`, `must_change_password`, `account_locked`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `username` is unique.
+
+### `a_roles`
+
+- `id`, `role_key`, `name`, `description`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `role_key` is unique.
+- `name` is unique.
+
+### `a_permissions`
+
+- `id`, `permission_key`, `name`, `section_name`, `description`, `created_at`, `modified_at`
+- `permission_key` is unique.
+
+### `a_role_permissions`
+
+- `id`, `role_id`, `permission_id`, `created_at`, `modified_at`
+- Foreign keys:
+        - `role_id` -> `a_roles.id`
+        - `permission_id` -> `a_permissions.id`
+- Unique key: `(role_id, permission_id)`
+
+### `a_user_roles`
+
+- `id`, `user_id`, `role_id`, `created_at`, `modified_at`
+- Foreign keys:
+        - `user_id` -> `a_users.id`
+        - `role_id` -> `a_roles.id`
+- Unique key: `(user_id, role_id)`
+
+### `a_sessions`
+
+- `id`, `session_hash`, `user_id`, `ip_address`, `user_agent`, `expires_at`, `created_at`, `created_by`, `last_used_at`, `modified_by`
+- `session_hash` is unique.
+- Foreign key:
+        - `user_id` -> `a_users.id`
+
+## Content
+
+- `c_canvas_sizes` - reusable canvas presets for templates.
+- `c_playlists` - playlist definitions, playback options, and canvas assignment.
+- `c_templates` - slide templates with canvas and background settings.
+- `c_template_regions` - template region layout and metadata.
+- `c_slides` - slide records with template binding, JSON content, and thumbnail path.
+- `c_playlist_slides` - ordered playlist items and timing.
+- `c_playlist_slide_schedule_rules` - rule rows attached to playlist slides.
+
+### `c_canvas_sizes`
+
+- `id`, `name`, `width`, `height`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `(width, height)` is unique.
+
+### `c_playlists`
+
+- `id`, `name`, `fade_between_slides`, `skip_unavailable_rtmp`, `canvas_id`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign key:
+        - `canvas_id` -> `c_canvas_sizes.id` with `ON DELETE SET NULL`
+
+### `c_templates`
+
+- `id`, `name`, `canvas_size_id`, `background_image_path`, `background_color`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign key:
+        - `canvas_size_id` -> `c_canvas_sizes.id` with `ON DELETE SET NULL`
+
+### `c_template_regions`
+
+- `id`, `template_id`, `region_key`, `region_type`, `label`, `font_family`, `lock_ratio`, `animation_json`, `x`, `y`, `width`, `height`, `z_index`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign key:
+        - `template_id` -> `c_templates.id` with `ON DELETE CASCADE`
+
+### `c_slides`
+
+- `id`, `title`, `template_id`, `content_json`, `thumbnail_path`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign key:
+        - `template_id` -> `c_templates.id` with `ON DELETE SET NULL`
+
+### `c_playlist_slides`
+
+- `id`, `playlist_id`, `slide_id`, `position`, `duration_seconds`, `use_video_duration`, `disable_audio`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign keys:
+        - `playlist_id` -> `c_playlists.id` with `ON DELETE CASCADE`
+        - `slide_id` -> `c_slides.id` with `ON DELETE CASCADE`
+
+### `c_playlist_slide_schedule_rules`
+
+- `id`, `playlist_slide_id`, `position`, `start_datetime`, `end_datetime`, `start_time`, `end_time`, `schedule_days_json`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign key:
+        - `playlist_slide_id` -> `c_playlist_slides.id` with `ON DELETE CASCADE`
+- Index:
+        - `(playlist_slide_id, position)`
+
+- Each playlist slide can have zero or more schedule rules.
+- Rules are evaluated with OR across rows and with AND across the fields inside a single rule.
+
+## Devices
+
+- `d_players` - player registry and connection metadata.
+- `d_screens` - screen records and playlist assignment.
+- `d_onboarding_devices` - device-to-screen bindings and onboarded client names.
+
+### `d_players`
+
+- `id`, `identifier`, `public_base_url`, `internal_base_url`, `last_seen_at`, `created_at`, `modified_at`
+- `id` is the primary key.
+- `identifier` is unique and is the stable player identity used by the app.
+        
+### `d_screens`
+
+- `id`, `name`, `slug`, `playlist_id`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `slug` is unique.
+- Foreign keys:
+        - `playlist_id` -> `c_playlists.id` with `ON DELETE SET NULL`
+
+- Screens are no longer tied to a player foreign key directly; player registration and live connection metadata are tracked separately in `d_players`.
+
+### `d_onboarding_devices`
+
+- `id`, `device_id`, `client_name`, `screen_id`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `device_id` is unique.
+- Foreign key:
+        - `screen_id` -> `d_screens.id` with `ON DELETE SET NULL`
+
+## Onboarding
+
+- The onboarding flow uses `d_onboarding_devices` to bind a device to a screen and persist the client name.
+
+## Announcements
+
+- `d_announcements` - announcement content and display metadata.
+- `d_announcement_screens` - announcement-to-screen assignments.
+
+### `d_announcements`
+
+- `id`, `message`, `short_label`, `announcement_type`, `color_key`, `icon_key`, `duration_seconds`, `expires_at`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `announcement_type` defaults to `lower-third`.
+
+### `d_announcement_screens`
+
+- `announcement_id`, `screen_id`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign keys:
+        - `announcement_id` -> `d_announcements.id` with `ON DELETE CASCADE`
+        - `screen_id` -> `d_screens.id` with `ON DELETE CASCADE`
+- Unique key: `(announcement_id, screen_id)`
+
+## Integrations
+
+- `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_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`
+
+### `i_rss_feed_items`
+
+- `id`, `rss_feed_id`, `position`, `item_json`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign key:
+        - `rss_feed_id` -> `i_rss_feeds.id` with `ON DELETE CASCADE`
+- Unique key:
+        - `(rss_feed_id, position)`
+
+### `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`
+
+### `i_timetable_groups`
+
+- `id`, `name`, `short_description`, `timezone`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `timezone` defaults to `Europe/London`.
+
+### `i_timetable_entries`
+
+- `id`, `schedule_group_id`, `title`, `short_description`, `start_datetime`, `end_datetime`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- Foreign key:
+        - `schedule_group_id` -> `i_timetable_groups.id` with `ON DELETE CASCADE`
+- Index:
+        - `(schedule_group_id, start_datetime)`
+
+## Operations
+
+- `o_background_tasks` - queue and history for background jobs.
+- `o_app_state` - generic app state and version markers stored as key/value pairs.
+- `o_app_settings` - administrator-configurable application settings stored by key.
+- `o_audit_events` - retained audit events for administrator activity and system changes.
+
+### `o_background_tasks`
+
+- `id`, `task_key`, `task_type`, `title`, `category`, `status`, `payload_json`, `metadata_json`, `attempts`, `created_at`, `created_by`, `started_at`, `finished_at`, `error_message`
+- Indexed by `status`, `task_key`, and `task_type`.
+
+### `o_app_state`
+
+- `id`, `state_key`, `state_value`, `created_at`, `modified_at`
+- `state_key` is unique.
+- `schema_version` is stored here so startup can detect the previously recorded schema version before deciding whether migrations need to run.
+
+### `o_app_settings`
+
+- `id`, `setting_key`, `setting_value`, `created_at`, `created_by`, `modified_at`, `modified_by`
+- `setting_key` is unique.
+- Values are stored as JSON and validated against the application setting definitions in `src/data/app-settings.js`.
+
+### `o_audit_events`
+
+- `id`, `occurred_at`, `category`, `event_type`, `actor_user_id`, `target_type`, `target_id`, `target_label`, `ip_address`, `user_agent`, `details_json`
+- Indexed by occurrence time, category and event type, actor, and target.
+
+## Notes
+
+- 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.
+
+```mermaid
+erDiagram
+        A_USERS {
+        }
+        A_ROLES {
+        }
+        A_PERMISSIONS {
+        }
+        A_ROLE_PERMISSIONS {
+        }
+        A_USER_ROLES {
+        }
+        A_SESSIONS {
+        }
+        C_CANVAS_SIZES {
+        }
+        C_PLAYLISTS {
+        }
+        C_TEMPLATES {
+        }
+        C_TEMPLATE_REGIONS {
+        }
+        C_SLIDES {
+        }
+        C_PLAYLIST_SLIDES {
+        }
+        C_PLAYLIST_SLIDE_SCHEDULE_RULES {
+        }
+        D_PLAYERS {
+        }
+        D_SCREENS {
+        }
+        D_ONBOARDING_DEVICES {
+        }
+        D_ANNOUNCEMENTS {
+        }
+        D_ANNOUNCEMENT_SCREENS {
+        }
+        I_RSS_FEEDS {
+        }
+        I_RSS_FEED_ITEMS {
+        }
+        I_API_SOURCES {
+        }
+        I_TIMETABLE_GROUPS {
+        }
+        I_TIMETABLE_ENTRIES {
+        }
+        O_APP_STATE {
+        }
+        O_APP_SETTINGS {
+        }
+        O_BACKGROUND_TASKS {
+        }
+        O_AUDIT_EVENTS {
+        }
+
+        A_USERS ||--o{ A_USER_ROLES : has
+        A_ROLES ||--o{ A_USER_ROLES : assigned_to
+        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
+
+        C_CANVAS_SIZES ||--o{ C_TEMPLATES : used_by
+        C_CANVAS_SIZES ||--o{ C_PLAYLISTS : used_by
+        C_TEMPLATES ||--o{ C_TEMPLATE_REGIONS : contains
+        C_TEMPLATES ||--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
+        D_ANNOUNCEMENTS ||--o{ D_ANNOUNCEMENT_SCREENS : targets
+        D_SCREENS ||--o{ D_ANNOUNCEMENT_SCREENS : receives
+
+        I_RSS_FEEDS ||--o{ I_RSS_FEED_ITEMS : caches
+        I_TIMETABLE_GROUPS ||--o{ I_TIMETABLE_ENTRIES : contains
+```

docs/websocket.md

@@ -2,7 +2,7 @@
 
 ## Overview
 
-Player service websocket base URL: `ws://localhost:3001`
+Player service websocket base URL: `ws://localhost:8081`
 
 This document uses OpenAPI-style sections, but stays in plain markdown.
 
@@ -24,33 +24,18 @@ This is the server-to-dashboard snapshot stream for live player connection state
 
 Access: internal-only. The web backend subscribes with signed request headers; browsers should not connect directly.
 
+### `GET /ws/screens/{slug}/announcements`
+Player announcement channel.
+
+This is the server-to-player push channel used to wake the player when an announcement changes. The browser player reconnects automatically and refreshes its announcement state when it receives an `announcement-refresh` message.
+
+Access: the player page must include a valid `auth` query parameter signed with the shared secret.
+
 ## Player Control Channel
 
 ### Messages from player to server
 
-The player sends two message types:
-
-- `hello`
-- `state`
-
-#### `hello`
-
-Example payload:
-
-```json
-{
-  "type": "hello",
-  "clientId": "client-id",
-  "clientName": "friendly label",
-  "deviceId": "device-id",
-  "userAgent": "browser ua",
-  "page": "http://.../screen/demo",
-  "viewport": { "width": 1920, "height": 1080 },
-  "paused": false,
-  "blackout": false,
-  "currentSlide": null
-}
-```
+The player sends a state snapshot message.
 
 #### `state`
 
@@ -67,16 +52,13 @@ Example payload:
   "viewport": { "width": 1920, "height": 1080 },
   "paused": false,
   "blackout": false,
-  "currentSlide": {
-    "id": 12,
-    "title": "Main Slide",
-    "kind": "image",
-    "playlistSignature": "..."
-  }
+  "currentSlide": null
 }
 ```
 
-The server recognizes `clientId`, `clientName`, `deviceId`, `userAgent`, `page`, `viewport`, `paused`, `blackout`, and `currentSlide` from player messages. When `currentSlide` is present, the player includes the active slide id, title, kind, and playlist signature.
+When `currentSlide` is present, the player includes the active slide id, title, kind, and playlist signature.
+
+The server recognizes `clientId`, `clientName`, `deviceId`, `userAgent`, `page`, `viewport`, `paused`, `blackout`, and `currentSlide` from state messages.
 
 ### Messages from server to player
 
@@ -92,15 +74,13 @@ The server sends command messages with:
 
 Supported commands:
 
+- `blackout`
+- `next`
+- `pause`
+- `previous`
 - `refresh`
 - `reload`
 - `redirect`
-- `pause`
-- `blackout`
-- `previous`
-- `next`
-- `left`
-- `right`
 - `setclientname`
 
 #### `refresh`
@@ -130,16 +110,36 @@ Use `false` to restore and `true` to blackout.
 #### `redirect`
 Requests the player page to navigate to a new location. The destination is supplied as `url` by the caller that forwarded the command.
 
-#### `previous` / `left`
+#### `previous`
 Moves to the previous slide.
 
-#### `next` / `right`
+#### `next`
 Moves to the next slide.
 
 #### `setclientname`
 Updates the client name associated with the player session and onboarding record.
 The command payload should include `clientName` and may include `deviceId` when the caller is updating a specific onboarding binding.
 
+## Announcement Channel
+
+### Messages from server to player
+
+The server sends a lightweight refresh notification.
+
+#### `announcement-refresh`
+
+Example payload:
+
+```json
+{
+  "type": "announcement-refresh",
+  "slug": "demo",
+  "sentAt": "2026-08-01T12:00:00.000Z"
+}
+```
+
+When the player receives this message, it refetches the current announcement state over HTTP.
+
 ## Snapshot Channel
 
 ### Messages from server to client

package.json

@@ -1,8 +1,11 @@
 {
   "name": "pulse-signage",
-  "version": "1.5.2",
+  "version": "2.8.7",
   "private": false,
   "description": "Pulse Signage application with MySQL and media storage",
+  "engines": {
+    "node": ">=26.0.0"
+  },
   "repository": {
     "type": "git",
     "url": "https://git.lzstealth.com/LZStealth/pulse-signage.git"
@@ -13,18 +16,23 @@
     "start:web": "node -r dotenv/config src/web.js",
     "start:player": "node -r dotenv/config src/player.js",
     "dev:web": "nodemon -r dotenv/config src/web.js",
-    "dev:player": "nodemon -r dotenv/config src/player.js"
+    "dev:player": "nodemon -r dotenv/config src/player.js",
+    "test": "node --test"
   },
   "dependencies": {
-    "bootstrap-icons": "1.11.3",
+    "@sparticuz/chromium": "^149.0.0",
+    "animate.css": "^4.1.1",
+    "bootstrap-icons": "1.13.1",
+    "cropperjs": "^1.6.2",
     "dotenv": "^17.4.2",
-    "express": "^4.21.2",
-    "hls.js": "^1.5.15",
+    "express": "^5.2.1",
     "handlebars": "^4.7.8",
-    "multer": "^1.4.5-lts.1",
-    "mysql2": "^3.14.3",
-    "qrcode": "^1.5.4",
-    "ws": "^8.21.0"
+    "hls.js": "^1.7.0",
+    "multer": "^2.2.0",
+    "mysql2": "^3.23.3",
+    "puppeteer-core": "^25.7.0",
+    "sharp": "^0.35.3",
+    "ws": "^8.21.3"
   },
   "devDependencies": {
     "nodemon": "^3.1.10"

scripts/pulse-signage-kiosk.bat

@@ -0,0 +1,61 @@
+@echo off
+setlocal EnableExtensions EnableDelayedExpansion
+
+set "TARGET_URL=%~1"
+if not defined TARGET_URL set "TARGET_URL=http://localhost:8081"
+
+set "BROWSER_PATH="
+set "BROWSER_KIND="
+
+for %%B in (chrome.exe msedge.exe firefox.exe) do if not defined BROWSER_PATH (
+  for /f "delims=" %%I in ('where %%B 2^>nul') do if not defined BROWSER_PATH (
+    set "BROWSER_PATH=%%I"
+    set "BROWSER_KIND=%%~nB"
+  )
+)
+
+if not defined BROWSER_PATH if not defined BROWSER_KIND (
+  for %%P in (
+    "%ProgramFiles%\Google\Chrome\Application\chrome.exe"
+    "%ProgramFiles(x86)%\Google\Chrome\Application\chrome.exe"
+    "%LocalAppData%\Google\Chrome\Application\chrome.exe"
+  ) do if not defined BROWSER_PATH if exist "%%~fP" (
+    set "BROWSER_PATH=%%~fP"
+    set "BROWSER_KIND=chrome"
+  )
+)
+
+if not defined BROWSER_PATH if not defined BROWSER_KIND (
+  for %%P in (
+    "%ProgramFiles%\Microsoft\Edge\Application\msedge.exe"
+    "%ProgramFiles(x86)%\Microsoft\Edge\Application\msedge.exe"
+    "%LocalAppData%\Microsoft\Edge\Application\msedge.exe"
+  ) do if not defined BROWSER_PATH if exist "%%~fP" (
+    set "BROWSER_PATH=%%~fP"
+    set "BROWSER_KIND=edge"
+  )
+)
+
+if not defined BROWSER_PATH if not defined BROWSER_KIND (
+  for %%P in (
+    "%ProgramFiles%\Mozilla Firefox\firefox.exe"
+    "%ProgramFiles(x86)%\Mozilla Firefox\firefox.exe"
+    "%LocalAppData%\Mozilla Firefox\firefox.exe"
+  ) do if not defined BROWSER_PATH if exist "%%~fP" (
+    set "BROWSER_PATH=%%~fP"
+    set "BROWSER_KIND=firefox"
+  )
+)
+
+if not defined BROWSER_PATH (
+  echo No supported browser was found.
+  echo Tried Chrome, Edge, and Firefox in PATH and common install locations.
+  exit /b 1
+)
+
+echo Launching !BROWSER_KIND! in kiosk mode: !TARGET_URL!
+if /I "!BROWSER_KIND!"=="firefox" (
+  start "" "!BROWSER_PATH!" -kiosk "!TARGET_URL!"
+) else (
+  start "" "!BROWSER_PATH!" --disable-notifications --kiosk "!TARGET_URL!"
+)

scripts/pulse-signage-kiosk.sh

@@ -0,0 +1,47 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+target_url="${1:-http://localhost:8081}"
+
+find_browser() {
+  local candidate
+  for candidate in "$@"; do
+    if command -v "$candidate" >/dev/null 2>&1; then
+      printf '%s' "$candidate"
+      return 0
+    fi
+  done
+  return 1
+}
+
+browser=""
+browser_kind=""
+
+if browser="$(find_browser google-chrome-stable google-chrome chromium chromium-browser msedge microsoft-edge firefox)"; then
+  case "$browser" in
+    firefox)
+      browser_kind="firefox"
+      ;;
+    msedge|microsoft-edge)
+      browser_kind="edge"
+      ;;
+    *)
+      browser_kind="chrome"
+      ;;
+  esac
+else
+  echo "No supported browser was found."
+  echo "Tried Chrome, Chromium, Edge, and Firefox in PATH."
+  exit 1
+fi
+
+echo "Launching ${browser_kind} in kiosk mode: ${target_url}"
+
+case "$browser_kind" in
+  firefox)
+    exec "$browser" -kiosk "$target_url"
+    ;;
+  edge|chrome)
+    exec "$browser" --disable-notifications --kiosk "$target_url"
+    ;;
+esac

src/auth.js

@@ -1,3 +1,5 @@
+// Password hashing and session token helpers.
+
 const crypto = require('crypto');
 
 const PASSWORD_ITERATIONS = Number(process.env.PASSWORD_HASH_ITERATIONS || 310000);
@@ -5,6 +7,55 @@ const PASSWORD_KEY_LENGTH = 32;
 const PASSWORD_DIGEST = 'sha256';
 const SESSION_BYTES = 32;
 
+function validatePasswordStrength(password, options) {
+  const value = String(password || '');
+  const requirements = options && options.policy
+    ? getPasswordPolicyPreset(options.policy)
+    : {
+      minimumLength: Number(options && options.minimumLength) || 10,
+      minimumCategories: Number(options && options.minimumCategories) || 3,
+      requireLowercase: Boolean(options && options.requireLowercase),
+      requireUppercase: Boolean(options && options.requireUppercase),
+      requireNumber: Boolean(options && options.requireNumber),
+      requireSymbol: Boolean(options && options.requireSymbol)
+    };
+  const hasLowercase = /[a-z]/.test(value);
+  const hasUppercase = /[A-Z]/.test(value);
+  const hasNumber = /[0-9]/.test(value);
+  const hasSymbol = /[^A-Za-z0-9]/.test(value);
+  const categoryCount = [hasLowercase, hasUppercase, hasNumber, hasSymbol].filter(Boolean).length;
+
+  const missingRequiredCategory = requirements.requireLowercase && !hasLowercase
+    || requirements.requireUppercase && !hasUppercase
+    || requirements.requireNumber && !hasNumber
+    || requirements.requireSymbol && !hasSymbol;
+  if (value.length < requirements.minimumLength || categoryCount < requirements.minimumCategories || missingRequiredCategory) {
+    if (missingRequiredCategory) {
+      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');
+      return `Password must be at least ${requirements.minimumLength} characters and include ${requiredCategories.join(', ')}.`;
+    }
+    if (requirements.minimumCategories === 4) {
+      return `Password must be at least ${requirements.minimumLength} characters and include uppercase, lowercase, number, and symbol.`;
+    }
+    return `Password must be at least ${requirements.minimumLength} characters and include ${requirements.minimumCategories} of: uppercase, lowercase, number, and symbol.`;
+  }
+
+  return '';
+}
+
+function getPasswordPolicyPreset(policy) {
+  const normalizedPolicy = String(policy || 'standard').trim().toLowerCase();
+  return normalizedPolicy === 'strict'
+    ? { minimumLength: 14, minimumCategories: 4 }
+    : normalizedPolicy === 'strong'
+      ? { minimumLength: 12, minimumCategories: 3 }
+      : { minimumLength: 10, minimumCategories: 3 };
+}
+
 function hashPassword(password, salt) {
   const safePassword = String(password || '');
   const safeSalt = salt || crypto.randomBytes(16).toString('hex');
@@ -38,6 +89,7 @@ function hashSessionToken(token) {
 module.exports = {
   hashPassword,
   verifyPassword,
+  validatePasswordStrength,
   createSessionToken,
   hashSessionToken
 };

src/common.js

@@ -1,20 +1,81 @@
-const db = require('./db');
-const data = require('./data');
-const player = require('./player/render');
+// Module-resolution shims for the app's `#root` and `#src` aliases.
+
+const Module = require('module');
+const path = require('path');
+
+const rootDir = path.resolve(__dirname, '..');
+const srcDir = __dirname;
+const resolveFilename = Module._resolveFilename;
+
+Module._resolveFilename = function (request, parent, isMain, options) {
+  if (request === '#root') {
+    request = rootDir;
+  } else if (request.startsWith('#root/')) {
+    request = path.join(rootDir, request.slice('#root/'.length));
+  } else if (request === '#src') {
+    request = srcDir;
+  } else if (request.startsWith('#src/')) {
+    request = path.join(srcDir, request.slice('#src/'.length));
+  }
+
+  return resolveFilename.call(this, request, parent, isMain, options);
+};
+
+const dbCommon = require('#src/db/common');
+const db = require('#src/db');
+const dbBootstrap = require('#src/db/bootstrap');
+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');
 
 module.exports = {
-  createPool: db.createPool,
+  createPool: dbCommon.createPool,
+  pruneStaleOnboardingDevices: dbCommon.pruneStaleOnboardingDevices,
   ensureSchema: db.ensureSchema,
+  bootstrapDatabase: dbBootstrap.bootstrapDatabase,
   slugify: data.slugify,
   uniqueScreenSlug: data.uniqueScreenSlug,
   parseJsonSafe: data.parseJsonSafe,
+  validateMaxLength: data.validateMaxLength,
+  truncateToMaxLength: data.truncateToMaxLength,
   fetchAdminData: data.fetchAdminData,
+  fetchPlaylistsPage: data.fetchPlaylistsPage,
+  fetchSlidesPage: data.fetchSlidesPage,
+  fetchTemplatesPage: data.fetchTemplatesPage,
+  fetchCanvasSizesPage: data.fetchCanvasSizesPage,
+  fetchScreensPage: data.fetchScreensPage,
+  ANNOUNCEMENT_TYPES: data.ANNOUNCEMENT_TYPES,
+  ANNOUNCEMENT_COLORS: data.ANNOUNCEMENT_COLORS,
+  ANNOUNCEMENT_ICONS: data.ANNOUNCEMENT_ICONS,
+  ANNOUNCEMENT_ICON_OPTIONS: data.ANNOUNCEMENT_ICON_OPTIONS,
+  ANNOUNCEMENT_ICON_LABELS: data.ANNOUNCEMENT_ICON_LABELS,
+  DEFAULT_ANNOUNCEMENT_ICON: data.DEFAULT_ANNOUNCEMENT_ICON,
+  normalizeAnnouncementType: data.normalizeAnnouncementType,
+  normalizeAnnouncementColor: data.normalizeAnnouncementColor,
+  normalizeAnnouncementIcon: data.normalizeAnnouncementIcon,
+  fetchAnnouncementsPage: data.fetchAnnouncementsPage,
+  fetchAnnouncementById: data.fetchAnnouncementById,
+  fetchActiveAnnouncement: data.fetchActiveAnnouncement,
+  buildAnnouncementPayload: data.buildAnnouncementPayload,
+  getSearchQuery: listQuery.getSearchQuery,
+  getSortQuery: listQuery.getSortQuery,
+  getSortDirectionQuery: listQuery.getSortDirectionQuery,
   fetchPlaylistById: data.fetchPlaylistById,
+  fetchPlaylistCanvasId: fetchPlaylistCanvasId,
+  normalizeDisplayMode: data.normalizeDisplayMode,
+  fetchTimetablesData: data.fetchTimetablesData,
+  fetchTimetableGroupsPage: data.fetchTimetableGroupsPage,
+  fetchTimetableGroupById: data.fetchTimetableGroupById,
+  fetchTimetableEntriesByGroupId: data.fetchTimetableEntriesByGroupId,
+  buildTimetableGroupPayload: data.buildTimetableGroupPayload,
   fetchApiSourcesData: data.fetchApiSourcesData,
+  fetchApiSourcesPage: data.fetchApiSourcesPage,
   fetchApiSourceById: data.fetchApiSourceById,
   fetchApiSourceResponse: data.fetchApiSourceResponse,
   buildApiSourcePayload: data.buildApiSourcePayload,
   fetchRssFeedsData: data.fetchRssFeedsData,
+  fetchRssFeedsPage: data.fetchRssFeedsPage,
   fetchRssFeedById: data.fetchRssFeedById,
   fetchRssFeedItemsByFeedId: data.fetchRssFeedItemsByFeedId,
   normalizeRssFeedItem: data.normalizeRssFeedItem,
@@ -23,12 +84,17 @@ module.exports = {
   replaceRssFeedItems: data.replaceRssFeedItems,
   fetchScreenById: data.fetchScreenById,
   fetchScreenEditData: data.fetchScreenEditData,
+  fetchScreenPlayerUrls: data.fetchScreenPlayerUrls,
+  fetchPlayerPublicBaseUrl: data.fetchPlayerPublicBaseUrl,
+  fetchScreenPlayerRecord: data.fetchScreenPlayerRecord,
   fetchTemplateById: data.fetchTemplateById,
+  fetchPlayerRegistrations: data.fetchPlayerRegistrations,
   fetchSlideById: data.fetchSlideById,
   fetchTemplatesData: data.fetchTemplatesData,
   fetchCanvasSizesData: data.fetchCanvasSizesData,
   fetchCanvasSizeById: data.fetchCanvasSizeById,
   buildCanvasSizePayload: data.buildCanvasSizePayload,
+  MAX_CANVAS_SIZE_DIMENSION: data.MAX_CANVAS_SIZE_DIMENSION,
   buildSlidePayload: data.buildSlidePayload,
   extractTemplateRegions: data.extractTemplateRegions,
   buildTemplatePayload: data.buildTemplatePayload,

src/data/admin.js

@@ -1,38 +1,199 @@
+// Admin data aggregation helpers for dashboards, playlists, slides, templates, and screens.
+
+const { fetchPagedRows } = require('./utils');
+
 async function fetchAdminData(pool) {
-  const [playlists] = await pool.query('SELECT id, name, fade_between_slides, created_at, modified_at, created_by, modified_by FROM playlists ORDER BY id DESC');
-  const [canvasSizes] = await pool.query('SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM canvas_sizes ORDER BY width ASC, height ASC, name ASC');
+  const [playlists] = await pool.query('SELECT id, name, fade_between_slides, skip_unavailable_rtmp, created_at, modified_at, created_by, modified_by FROM c_playlists ORDER BY id DESC');
+  const [canvasSizes] = await pool.query('SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM c_canvas_sizes ORDER BY width ASC, height ASC, name ASC');
   const [templates] = await pool.query(`
     SELECT st.id, st.name, st.canvas_size_id, st.background_image_path, st.background_color, st.created_at, st.modified_at,
            cs.name AS canvas_size_name, cs.width AS canvas_size_width, cs.height AS canvas_size_height
-    FROM slide_templates st
-    LEFT JOIN canvas_sizes cs ON cs.id = st.canvas_size_id
+    FROM c_templates st
+    LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
     ORDER BY st.id DESC
   `);
-  const [templateRegions] = await pool.query('SELECT id, template_id, region_key, region_type, label, font_family, lock_ratio, x, y, width, height, z_index, created_at, modified_at, created_by, modified_by FROM slide_template_regions ORDER BY template_id ASC, z_index ASC, id ASC');
+  const [templateRegions] = await pool.query('SELECT id, template_id, region_key, region_type, label, lock_ratio, x, y, width, height, z_index, created_at, modified_at, created_by, modified_by FROM c_template_regions ORDER BY template_id ASC, z_index ASC, id ASC');
   const [slides] = await pool.query(`
-    SELECT s.id, s.title, s.body, s.template_id, s.content_json, s.media_path, s.media_type, s.created_at, s.modified_at, s.created_by, s.modified_by, st.name AS template_name, cs.width AS canvas_width, cs.height AS canvas_height
-    FROM slides s
-    LEFT JOIN slide_templates st ON st.id = s.template_id
-    LEFT JOIN canvas_sizes cs ON cs.id = st.canvas_size_id
+    SELECT s.id, s.title, s.template_id, s.content_json, s.thumbnail_path, s.created_at, s.modified_at, s.created_by, s.modified_by, st.name AS template_name, st.canvas_size_id, cs.width AS canvas_width, cs.height AS canvas_height,
+           (SELECT COUNT(DISTINCT ps.playlist_id) FROM c_playlist_slides ps WHERE ps.slide_id = s.id) AS playlist_count
+    FROM c_slides s
+    LEFT JOIN c_templates st ON st.id = s.template_id
+    LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
     ORDER BY s.id DESC
   `);
   const [screens] = await pool.query(`
     SELECT s.id, s.name, s.slug, s.playlist_id, s.created_at, s.modified_at, s.created_by, s.modified_by, p.name AS playlist_name
-    FROM screens s
-    LEFT JOIN playlists p ON p.id = s.playlist_id
+    FROM d_screens s
+    LEFT JOIN c_playlists p ON p.id = s.playlist_id
     ORDER BY s.id DESC
   `);
   const [playlistSlides] = await pool.query(`
-    SELECT ps.id, ps.playlist_id, ps.position, ps.duration_seconds, ps.schedule_mode, ps.schedule_start_datetime, ps.schedule_end_datetime, ps.schedule_start_time, ps.schedule_end_time, ps.schedule_days_json, sl.id AS slide_id, sl.title, sl.media_path, sl.media_type, cs.width AS canvas_width, cs.height AS canvas_height
-    FROM playlist_slides ps
-    JOIN slides sl ON sl.id = ps.slide_id
-    LEFT JOIN slide_templates st ON st.id = sl.template_id
-    LEFT JOIN canvas_sizes cs ON cs.id = st.canvas_size_id
+    SELECT ps.id, ps.playlist_id, ps.position, ps.duration_seconds, ps.use_video_duration, ps.disable_audio, sl.id AS slide_id, sl.title, sl.content_json, sl.thumbnail_path, st.canvas_size_id, cs.width AS canvas_width, cs.height AS canvas_height
+    FROM c_playlist_slides ps
+    JOIN c_slides sl ON sl.id = ps.slide_id
+    LEFT JOIN c_templates st ON st.id = sl.template_id
+    LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
     ORDER BY ps.playlist_id ASC, ps.position ASC, ps.id ASC
   `);
-  return { playlists, canvasSizes, templates, templateRegions, slides, screens, playlistSlides };
+  const [playlistScheduleRules] = await pool.query(`
+    SELECT id, playlist_slide_id, position, start_datetime, end_datetime, start_time, end_time, schedule_days_json, created_at, modified_at, created_by, modified_by
+    FROM c_playlist_slide_schedule_rules
+    ORDER BY playlist_slide_id ASC, position ASC, id ASC
+  `);
+
+  const rulesBySlideId = new Map();
+  playlistScheduleRules.forEach(function (rule) {
+    const slideId = Number(rule.playlist_slide_id);
+    if (!rulesBySlideId.has(slideId)) {
+      rulesBySlideId.set(slideId, []);
+    }
+    rulesBySlideId.get(slideId).push(rule);
+  });
+
+  const playlistSlidesWithRules = playlistSlides.map(function (slide) {
+    return Object.assign({}, slide, {
+      scheduleRules: rulesBySlideId.get(Number(slide.id)) || []
+    });
+  });
+
+  return { playlists, canvasSizes, templates, templateRegions, slides, screens, playlistSlides: playlistSlidesWithRules };
+}
+
+async function fetchPlaylistsPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+        selectSql: `SELECT p.id, p.name, p.fade_between_slides, p.skip_unavailable_rtmp, p.created_at, p.modified_at, p.created_by, p.modified_by,
+          (SELECT COUNT(*) FROM c_playlist_slides ps WHERE ps.playlist_id = p.id) AS slide_count,
+          (SELECT COUNT(*) FROM d_screens s WHERE s.playlist_id = p.id) AS screen_count
+         FROM c_playlists p
+     ORDER BY p.id DESC`,
+    countSql: 'SELECT COUNT(*) AS count FROM c_playlists',
+    searchColumns: ['p.name'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      name: 'p.name',
+      slides: 'slide_count',
+      created: 'p.created_at',
+      modified: 'p.modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ playlists: paged.rows }, paged);
+}
+
+async function fetchSlidesPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: `SELECT s.id, s.title, s.template_id, s.content_json, s.thumbnail_path, s.created_at, s.modified_at, s.created_by, s.modified_by, st.name AS template_name, cs.width AS canvas_width, cs.height AS canvas_height,
+          (SELECT COUNT(DISTINCT ps.playlist_id) FROM c_playlist_slides ps WHERE ps.slide_id = s.id) AS playlist_count
+    FROM c_slides s
+    LEFT JOIN c_templates st ON st.id = s.template_id
+    LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
+     ORDER BY s.id DESC`,
+    countSql: 'SELECT COUNT(*) AS count FROM c_slides',
+    searchColumns: ['s.title', 'st.name'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      title: 's.title',
+      template: 'st.name',
+      created: 's.created_at',
+      modified: 's.modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ slides: paged.rows }, paged);
+}
+
+async function fetchTemplatesPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: `SELECT st.id, st.name, st.canvas_size_id, st.background_image_path, st.background_color, st.created_at, st.modified_at,
+           cs.name AS canvas_size_name, cs.width AS canvas_size_width, cs.height AS canvas_size_height,
+        (SELECT COUNT(*) FROM c_template_regions str WHERE str.template_id = st.id) AS region_count,
+           (SELECT COUNT(*) FROM c_slides s WHERE s.template_id = st.id) AS slide_count
+    FROM c_templates st
+    LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
+    ORDER BY st.id DESC`,
+    countSql: 'SELECT COUNT(*) AS count FROM c_templates',
+    searchColumns: ['st.name', 'st.background_image_path', 'st.background_color', 'cs.name'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      name: 'st.name',
+      canvas: ['cs.width', 'cs.height', 'cs.name'],
+      regions: 'region_count',
+      slides: 'slide_count',
+      created: 'st.created_at',
+      modified: 'st.modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ templates: paged.rows }, paged);
+}
+
+async function fetchCanvasSizesPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: `SELECT id, name, width, height, created_at, modified_at, created_by, modified_by,
+                 (SELECT COUNT(*) FROM c_templates st WHERE st.canvas_size_id = c_canvas_sizes.id) AS template_count
+               FROM c_canvas_sizes
+     ORDER BY width ASC, height ASC, name ASC`,
+    countSql: 'SELECT COUNT(*) AS count FROM c_canvas_sizes',
+    searchColumns: ['name', 'width', 'height'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      name: 'name',
+      dimensions: ['width', 'height', 'name'],
+      templates: 'template_count',
+      created: 'created_at',
+      modified: 'modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ canvasSizes: paged.rows }, paged);
+}
+
+async function fetchScreensPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: `SELECT s.id, s.name, s.slug, s.playlist_id, s.created_at, s.modified_at, s.created_by, s.modified_by, p.name AS playlist_name
+     FROM d_screens s
+     LEFT JOIN c_playlists p ON p.id = s.playlist_id
+     ORDER BY s.id DESC`,
+    countSql: 'SELECT COUNT(*) AS count FROM d_screens',
+    searchColumns: ['s.name', 's.slug', 'p.name'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      name: 's.name',
+      url: 's.slug',
+      playlist: 'p.name',
+      created: 's.created_at',
+      modified: 's.modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ screens: paged.rows }, paged);
 }
 
 module.exports = {
-  fetchAdminData
+  fetchAdminData,
+  fetchPlaylistsPage,
+  fetchSlidesPage,
+  fetchTemplatesPage,
+  fetchCanvasSizesPage,
+  fetchScreensPage
 };

src/data/announcement-icons.js

@@ -0,0 +1,98 @@
+const fs = require('fs');
+const path = require('path');
+
+const BOOTSTRAP_ICON_CSS_PATH = path.join(__dirname, '..', 'web', 'public', 'adminlte', 'bootstrap-icons', 'css', 'bootstrap-icons.min.css');
+
+const DEFAULT_ANNOUNCEMENT_ICON_KEYS = [
+  'megaphone-fill', 'megaphone', 'bell-fill', 'bell',
+  'exclamation-triangle-fill', 'exclamation-triangle', 'info-circle-fill', 'info-circle',
+  'check-circle-fill', 'check-circle', 'lightbulb-fill', 'lightbulb',
+  'calendar-event-fill', 'calendar-event', 'clock-fill', 'clock',
+  'wifi-off', 'wifi', 'hdd-network', 'hdd-network-fill',
+  'speaker-fill', 'speaker', 'shield-fill', 'shield',
+  'collection-play-fill', 'collection-play', 'broadcast', 'broadcast-pin',
+  'plug-fill', 'plug', 'lightning-charge-fill', 'lightning-charge',
+  'car-front-fill', 'car-front', 'lamp-fill', 'lamp',
+  'envelope-fill', 'envelope', 'people-fill', 'people',
+  'browser-chrome', 'browser-edge', 'browser-firefox', 'browser-safari',
+  'cone', 'cone-striped', 'cup-straw', 'fire'
+];
+
+function humanizeBootstrapIconLabel(iconKey) {
+  return String(iconKey || '')
+    .trim()
+    .replace(/[-_]+/g, ' ')
+    .replace(/\b\w/g, function (character) {
+      return character.toUpperCase();
+    });
+}
+
+function loadBootstrapIconCatalog() {
+  try {
+    const css = fs.readFileSync(BOOTSTRAP_ICON_CSS_PATH, 'utf8');
+    const keys = Array.from(new Set((css.match(/\.bi-([a-z0-9-]+)::?before/g) || []).map(function (match) {
+      return String(match || '')
+        .replace(/^\.bi-/, '')
+        .replace(/::?before$/, '')
+        .trim()
+        .toLowerCase();
+    }).filter(Boolean)));
+
+    return keys.map(function (value) {
+      return {
+        value: value,
+        label: humanizeBootstrapIconLabel(value)
+      };
+    }).sort(function (left, right) {
+      return left.value.localeCompare(right.value);
+    });
+  } catch (_error) {
+    return DEFAULT_ANNOUNCEMENT_ICON_KEYS.map(function (value) {
+      return { value: value, label: humanizeBootstrapIconLabel(value) };
+    });
+  }
+}
+
+const ANNOUNCEMENT_ICON_CATALOG = loadBootstrapIconCatalog();
+const ANNOUNCEMENT_ICON_OPTIONS = DEFAULT_ANNOUNCEMENT_ICON_KEYS.map(function (value) {
+  const catalogOption = ANNOUNCEMENT_ICON_CATALOG.find(function (option) {
+    return option.value === value;
+  });
+  return catalogOption || { value: value, label: humanizeBootstrapIconLabel(value) };
+});
+
+const ANNOUNCEMENT_ICON_KEYS = DEFAULT_ANNOUNCEMENT_ICON_KEYS.slice();
+
+const ANNOUNCEMENT_ICON_CATALOG_KEYS = ANNOUNCEMENT_ICON_CATALOG.map(function (option) {
+  return option.value;
+});
+
+const ANNOUNCEMENT_ICON_LABELS = ANNOUNCEMENT_ICON_OPTIONS.reduce(function (labels, option) {
+  labels[option.value] = option.label;
+  return labels;
+}, Object.create(null));
+
+ANNOUNCEMENT_ICON_CATALOG.forEach(function (option) {
+  if (!Object.prototype.hasOwnProperty.call(ANNOUNCEMENT_ICON_LABELS, option.value)) {
+    ANNOUNCEMENT_ICON_LABELS[option.value] = option.label;
+  }
+});
+
+const DEFAULT_ANNOUNCEMENT_ICON = 'megaphone-fill';
+
+function normalizeAnnouncementIcon(value) {
+  const normalized = String(value || '').trim().toLowerCase();
+  return ANNOUNCEMENT_ICON_CATALOG_KEYS.includes(normalized) ? normalized : DEFAULT_ANNOUNCEMENT_ICON;
+}
+
+module.exports = {
+  DEFAULT_ANNOUNCEMENT_ICON_KEYS,
+  ANNOUNCEMENT_ICON_OPTIONS,
+  ANNOUNCEMENT_ICON_KEYS,
+  ANNOUNCEMENT_ICON_CATALOG,
+  ANNOUNCEMENT_ICON_CATALOG_KEYS,
+  ANNOUNCEMENT_ICON_LABELS,
+  DEFAULT_ANNOUNCEMENT_ICON,
+  humanizeBootstrapIconLabel,
+  normalizeAnnouncementIcon
+};

src/data/announcements.js

@@ -0,0 +1,192 @@
+// Announcement data access helpers.
+
+const { fetchPagedRows } = require('./utils');
+const {
+  ANNOUNCEMENT_ICON_KEYS,
+  DEFAULT_ANNOUNCEMENT_ICON,
+  normalizeAnnouncementIcon: normalizeAnnouncementIconFromConfig
+} = require('./announcement-icons');
+const { validateMaxLength } = require('./utils');
+
+const SHORT_LABEL_MAX_LENGTH = 255;
+
+const ANNOUNCEMENT_TYPES = ['lower-third', 'fullscreen', 'top-banner'];
+const ANNOUNCEMENT_COLORS = ['primary', 'secondary', 'success', 'info', 'warning', 'danger', 'dark', 'light'];
+
+function normalizeAnnouncementType(value) {
+  const normalized = String(value || '').trim().toLowerCase();
+  if (normalized === 'center-card') {
+    return 'fullscreen';
+  }
+  return ANNOUNCEMENT_TYPES.includes(normalized) ? normalized : 'lower-third';
+}
+
+function normalizeAnnouncementColor(value) {
+  const normalized = String(value || '').trim().toLowerCase();
+  return ANNOUNCEMENT_COLORS.includes(normalized) ? normalized : 'primary';
+}
+
+function normalizeAnnouncementMessage(value) {
+  return String(value || '').replace(/\r\n/g, '\n').trim();
+}
+
+function normalizeAnnouncementShortLabel(value) {
+  return String(value || '').replace(/\r\n/g, ' ').trim();
+}
+
+function normalizeAnnouncementDurationSeconds(value) {
+  const seconds = Math.max(0, Math.round(Number(value) || 0));
+  return seconds > 0 ? seconds : null;
+}
+
+function normalizeAnnouncementScreenIds(value) {
+  if (Array.isArray(value)) {
+    return value.map(function (screenId) {
+      return Number(screenId) || 0;
+    }).filter(function (screenId) {
+      return screenId > 0;
+    });
+  }
+
+  return String(value || '')
+    .split(',')
+    .map(function (screenId) {
+      return Number(screenId) || 0;
+    })
+    .filter(function (screenId) {
+      return screenId > 0;
+    });
+}
+
+function buildAnnouncementPayload(input) {
+  const message = normalizeAnnouncementMessage(input && input.message);
+  const shortLabel = validateMaxLength(normalizeAnnouncementShortLabel(input && input.short_label), SHORT_LABEL_MAX_LENGTH, 'Announcement short description');
+  const announcementType = normalizeAnnouncementType(input && input.announcement_type);
+  const colorKey = normalizeAnnouncementColor(input && input.color_key);
+  const iconKey = normalizeAnnouncementIconFromConfig(input && input.icon_key);
+  const durationSeconds = normalizeAnnouncementDurationSeconds(input && input.duration_seconds);
+
+  return {
+    message,
+    shortLabel,
+    announcementType,
+    colorKey,
+    iconKey,
+    durationSeconds,
+    expiresAt: durationSeconds ? new Date(Date.now() + (durationSeconds * 1000)) : null
+  };
+}
+
+function normalizeAnnouncementRow(row) {
+  if (!row) {
+    return null;
+  }
+
+  return {
+    id: Number(row.id) || null,
+    message: normalizeAnnouncementMessage(row.message),
+    short_label: normalizeAnnouncementShortLabel(row.short_label),
+    announcement_type: normalizeAnnouncementType(row.announcement_type),
+    color_key: normalizeAnnouncementColor(row.color_key),
+    icon_key: normalizeAnnouncementIconFromConfig(row.icon_key),
+    duration_seconds: row.duration_seconds === null || row.duration_seconds === undefined
+      ? null
+      : Math.max(0, Math.round(Number(row.duration_seconds) || 0)),
+    expires_at: row.expires_at || null,
+    screen_target_count: row.screen_target_count === null || row.screen_target_count === undefined
+      ? null
+      : Math.max(0, Math.round(Number(row.screen_target_count) || 0)),
+    total_screen_count: row.total_screen_count === null || row.total_screen_count === undefined
+      ? null
+      : Math.max(0, Math.round(Number(row.total_screen_count) || 0)),
+    screen_targets_label: String(row.screen_targets_label || '').trim(),
+    screen_ids: normalizeAnnouncementScreenIds(row.screen_ids),
+    created_at: row.created_at || null,
+    modified_at: row.modified_at || null,
+    created_by: row.created_by || null,
+    modified_by: row.modified_by || null
+  };
+}
+
+async function fetchAnnouncementById(pool, id) {
+  const [rows] = await pool.query(`
+    SELECT a.id, a.message, a.short_label, a.announcement_type, a.color_key, a.icon_key, a.duration_seconds, a.expires_at, a.created_at, a.modified_at, a.created_by, a.modified_by,
+           GROUP_CONCAT(DISTINCT aas.screen_id ORDER BY aas.screen_id SEPARATOR ',') AS screen_ids
+    FROM d_announcements a
+    LEFT JOIN d_announcement_screens aas ON aas.announcement_id = a.id
+    WHERE a.id = ?
+    GROUP BY a.id
+  `, [id]);
+  return normalizeAnnouncementRow(rows[0] || null);
+}
+
+async function fetchAnnouncementsPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: `SELECT a.id, a.message, a.short_label, a.announcement_type, a.color_key, a.icon_key, a.duration_seconds, a.expires_at, a.created_at, a.modified_at, a.created_by, a.modified_by,
+                       COUNT(DISTINCT aas.screen_id) AS screen_target_count,
+                       (SELECT COUNT(*) FROM d_screens) AS total_screen_count,
+                       COALESCE(
+                         GROUP_CONCAT(DISTINCT COALESCE(NULLIF(TRIM(s.name), ''), s.slug) ORDER BY COALESCE(NULLIF(TRIM(s.name), ''), s.slug) SEPARATOR ', '),
+                         ''
+                       ) AS screen_targets_label
+                FROM d_announcements a
+                LEFT JOIN d_announcement_screens aas ON aas.announcement_id = a.id
+                LEFT JOIN d_screens s ON s.id = aas.screen_id
+                GROUP BY a.id`,
+    countSql: 'SELECT COUNT(*) AS count FROM d_announcements',
+    searchColumns: ['message', 'short_label', 'announcement_type', 'color_key'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      description: 'short_label',
+      message: 'message',
+      type: 'announcement_type',
+      color: 'color_key',
+      status: 'expires_at',
+      expires: 'expires_at',
+      created: 'created_at',
+      modified: 'modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ announcements: (paged.rows || []).map(normalizeAnnouncementRow) }, paged);
+}
+
+async function fetchActiveAnnouncement(pool, screenSlug) {
+  const [rows] = await pool.query(`
+    SELECT a.id, a.message, a.short_label, a.announcement_type, a.color_key, a.icon_key, a.duration_seconds, a.expires_at, a.created_at, a.modified_at, a.created_by, a.modified_by,
+           GROUP_CONCAT(DISTINCT aas.screen_id ORDER BY aas.screen_id SEPARATOR ',') AS screen_ids
+    FROM d_announcements a
+    LEFT JOIN d_announcement_screens aas ON aas.announcement_id = a.id
+    WHERE (a.expires_at IS NULL OR a.expires_at > CURRENT_TIMESTAMP)
+      AND EXISTS (
+        SELECT 1
+        FROM d_announcement_screens restriction
+        JOIN d_screens screen ON screen.id = restriction.screen_id
+        WHERE restriction.announcement_id = a.id
+          AND screen.slug = ?
+      )
+    GROUP BY a.id
+    ORDER BY a.modified_at DESC, a.created_at DESC, a.id DESC
+    LIMIT 1
+  `, [screenSlug]);
+  return normalizeAnnouncementRow(rows[0] || null);
+}
+
+module.exports = {
+  ANNOUNCEMENT_TYPES,
+  ANNOUNCEMENT_COLORS,
+  ANNOUNCEMENT_ICONS: ANNOUNCEMENT_ICON_KEYS,
+  DEFAULT_ANNOUNCEMENT_ICON,
+  normalizeAnnouncementType,
+  normalizeAnnouncementColor,
+  normalizeAnnouncementIcon: normalizeAnnouncementIconFromConfig,
+  normalizeAnnouncementShortLabel,
+  buildAnnouncementPayload,
+  fetchAnnouncementById,
+  fetchAnnouncementsPage,
+  fetchActiveAnnouncement
+};

src/data/api-sources.js

@@ -1,36 +1,117 @@
+// API source data access, pagination, and remote fetch helpers.
+
 const http = require('http');
 const https = require('https');
+const { fetchPagedRows, validateMaxLength } = require('./utils');
+
+const NAME_MAX_LENGTH = 255;
+const URL_MAX_LENGTH = 1024;
+const AUTH_MAX_LENGTH = 255;
+const ITEMS_PATH_MAX_LENGTH = 255;
+const REQUEST_BODY_MAX_LENGTH = 1000000;
+const TOKEN_URL_MAX_LENGTH = 1024;
+const TOKEN_RESPONSE_PATH_MAX_LENGTH = 255;
+const TOKEN_HEADER_PREFIX_MAX_LENGTH = 64;
+const tokenCache = new Map();
 
 function normalizeUpdateIntervalUnit(value) {
   const unit = String(value || '').trim().toLowerCase();
-  return unit === 'seconds' ? 'seconds' : 'minutes';
+  if (unit === 'seconds' || unit === 'minutes' || unit === 'hours') {
+    return unit;
+  }
+  return 'minutes';
+}
+
+function normalizeAuthMethod(value) {
+  const method = String(value || '').trim().toLowerCase();
+  return ['basic', 'bearer', 'api_key_header', 'token_login'].includes(method) ? method : 'none';
+}
+
+function normalizeRequestMethod(value) {
+  return String(value || '').trim().toUpperCase() === 'POST' ? 'POST' : 'GET';
+}
+
+function buildAuthHeaders(source) {
+  const method = normalizeAuthMethod(source && (source.auth_method || source.authMethod));
+  const headers = {};
+
+  if (method === 'basic') {
+    const username = String(source && (source.auth_username || source.authUsername) || '').trim();
+    const password = String(source && (source.auth_password || source.authPassword) || '');
+    if (username || password) {
+      headers.Authorization = 'Basic ' + Buffer.from(username + ':' + password, 'utf8').toString('base64');
+    }
+  } else if (method === 'bearer') {
+    const token = String(source && (source.auth_bearer_token || source.authBearerToken) || '').trim();
+    if (token) {
+      headers.Authorization = 'Bearer ' + token;
+    }
+  } else if (method === 'api_key_header') {
+    const headerName = String(source && (source.auth_header_name || source.authHeaderName) || 'X-API-Key').trim() || 'X-API-Key';
+    const headerValue = String(source && (source.auth_header_value || source.authHeaderValue) || '').trim();
+    if (headerValue) {
+      headers[headerName] = headerValue;
+    }
+  }
+
+  return headers;
 }
 
 async function fetchApiSourcesData(pool) {
   const [apiSources] = await pool.query(
-    'SELECT id, name, api_url, 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 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_header_name, token_header_prefix, 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, modified_at, created_by, modified_by FROM i_api_sources ORDER BY modified_at DESC, id DESC'
   );
 
   return { apiSources: apiSources };
 }
 
+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, 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,
+    sortColumns: {
+      name: 'name',
+      url: 'api_url',
+      interval: ['update_interval_value', 'update_interval_unit'],
+      last_pulled: 'last_pulled_at',
+      last_response: 'last_response_status',
+      created: 'created_at',
+      modified: 'modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ apiSources: paged.rows }, paged);
+}
+
 async function fetchApiSourceById(pool, id) {
   const [rows] = await pool.query(
-    'SELECT id, name, api_url, 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 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_header_name, token_header_prefix, 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, modified_at, created_by, modified_by FROM i_api_sources WHERE id = ?',
     [id]
   );
 
   return rows[0] || null;
 }
 
-async function loadUrlText(urlValue) {
+async function loadUrlText(urlValue, requestOptions) {
+  const extraHeaders = requestOptions && requestOptions.headers ? requestOptions.headers : {};
+  const method = String(requestOptions && requestOptions.method || 'GET').toUpperCase();
+  const body = requestOptions && requestOptions.body !== undefined ? requestOptions.body : undefined;
+  const headers = Object.assign({
+    Accept: 'application/json, text/plain;q=0.9, */*;q=0.8',
+    'User-Agent': 'Pulse Signage API Reader'
+  }, extraHeaders);
   if (typeof fetch === 'function') {
-    const response = await fetch(urlValue, {
-      headers: {
-        Accept: 'application/json, text/plain;q=0.9, */*;q=0.8',
-        'User-Agent': 'Pulse Signage API Reader'
-      }
-    });
+    const fetchOptions = { method: method, headers: headers };
+    if (body !== undefined && method !== 'GET' && method !== 'HEAD') {
+      fetchOptions.body = body;
+    }
+    const response = await fetch(urlValue, fetchOptions);
 
     return {
       statusCode: response.status,
@@ -43,12 +124,10 @@ async function loadUrlText(urlValue) {
   return await new Promise(function (resolve, reject) {
     const url = new URL(urlValue);
     const transport = url.protocol === 'https:' ? https : http;
-    const request = transport.get(url, {
-      headers: {
-        Accept: 'application/json, text/plain;q=0.9, */*;q=0.8',
-        'User-Agent': 'Pulse Signage API Reader'
-      }
-    }, function (response) {
+    const request = transport.request(url, Object.assign({}, requestOptions || {}, {
+      method: method,
+      headers: headers
+    }), function (response) {
       response.setEncoding('utf8');
       let body = '';
       response.on('data', function (chunk) {
@@ -65,12 +144,126 @@ async function loadUrlText(urlValue) {
       response.on('error', reject);
     });
 
+    if (body !== undefined && method !== 'GET' && method !== 'HEAD') {
+      request.write(body);
+    }
+    request.end();
     request.on('error', reject);
   });
 }
 
-async function fetchApiSourceResponse(apiUrl) {
-  const response = await loadUrlText(apiUrl);
+function parseJsonRequestBody(value, fieldName) {
+  const text = String(value || '').trim();
+  if (!text) {
+    return undefined;
+  }
+  try {
+    return JSON.parse(text);
+  } catch (_error) {
+    const error = new Error(fieldName + ' must contain valid JSON.');
+    error.statusCode = 400;
+    throw error;
+  }
+}
+
+function resolveResponsePath(value, responsePath) {
+  let current = value;
+  String(responsePath || '').split('.').forEach(function (segment) {
+    if (current === undefined || current === null) {
+      current = undefined;
+      return;
+    }
+    current = current[segment];
+  });
+  return current;
+}
+
+function getTokenCacheKey(source) {
+  return JSON.stringify([
+    source && source.id || '',
+    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_header_name || source.tokenHeaderName) || 'Authorization',
+    source && (source.token_header_prefix || source.tokenHeaderPrefix) || 'Bearer'
+  ]);
+}
+
+function clearCachedToken(source) {
+  tokenCache.delete(getTokenCacheKey(source));
+}
+
+async function fetchLoginToken(source) {
+  const cacheKey = getTokenCacheKey(source);
+  const cached = tokenCache.get(cacheKey);
+  if (cached && cached.expiresAt > Date.now()) {
+    return cached.value;
+  }
+
+  const tokenUrl = source.token_url || source.tokenUrl;
+  const tokenBody = parseJsonRequestBody(source.token_request_body_json || source.tokenRequestBodyJson, 'Login request body');
+  const tokenHeaders = { 'Content-Type': 'application/json' };
+  const response = await loadUrlText(tokenUrl, {
+    method: 'POST',
+    headers: tokenHeaders,
+    body: tokenBody === undefined ? undefined : JSON.stringify(tokenBody)
+  });
+  if (!response.ok) {
+    throw new Error(`Unable to obtain API token (${response.statusCode}).`);
+  }
+
+  let parsed;
+  try {
+    parsed = JSON.parse(String(response.bodyText || '').trim());
+  } catch (_error) {
+    throw new Error('Token response was not valid JSON.');
+  }
+
+  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 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);
+}
+
+async function buildRequestHeaders(source) {
+  const method = normalizeAuthMethod(source && (source.auth_method || source.authMethod));
+  if (method !== 'token_login') {
+    return buildAuthHeaders(source);
+  }
+
+  const token = await fetchLoginToken(source);
+  const headerName = String(source.token_header_name || source.tokenHeaderName || 'Authorization').trim() || 'Authorization';
+  const prefix = String(source.token_header_prefix || source.tokenHeaderPrefix || 'Bearer').trim();
+  return { [headerName]: prefix ? prefix + ' ' + token : token };
+}
+
+async function fetchApiSourceResponse(apiSource) {
+  const source = apiSource && typeof apiSource === 'object' ? apiSource : { api_url: apiSource };
+  const requestMethod = normalizeRequestMethod(source.request_method || source.requestMethod);
+  const requestBody = parseJsonRequestBody(source.request_body_json || source.requestBodyJson, 'API request body');
+  let response;
+  let tokenRetry = false;
+  do {
+    response = await loadUrlText(source.api_url || source.apiUrl, {
+      method: requestMethod,
+      headers: Object.assign({}, await buildRequestHeaders(source), requestBody === undefined ? {} : { 'Content-Type': 'application/json' }),
+      body: requestBody === undefined ? undefined : JSON.stringify(requestBody)
+    });
+    if (response.statusCode === 401 && normalizeAuthMethod(source.auth_method || source.authMethod) === 'token_login' && !tokenRetry) {
+      clearCachedToken(source);
+      tokenRetry = true;
+    } else {
+      break;
+    }
+  } while (true);
   if (!response.ok) {
     throw new Error(`Unable to load API response (${response.statusCode}).`);
   }
@@ -96,8 +289,30 @@ async function fetchApiSourceResponse(apiUrl) {
 
 function buildApiSourcePayload(req, existingApiSource) {
   const fallback = existingApiSource || {};
-  const name = String(req.body.name || fallback.name || '').trim();
-  const apiUrl = String(req.body.api_url || req.body.apiUrl || fallback.api_url || '').trim();
+  const body = req && req.body ? req.body : {};
+  function readBodyValue(fieldName, fallbackValue) {
+    if (Object.prototype.hasOwnProperty.call(body, fieldName)) {
+      return body[fieldName];
+    }
+    return fallbackValue;
+  }
+
+  const name = validateMaxLength(req.body.name || fallback.name || '', NAME_MAX_LENGTH, 'API source name');
+  const apiUrl = validateMaxLength(req.body.api_url || req.body.apiUrl || fallback.api_url || '', URL_MAX_LENGTH, 'API source URL');
+  const authMethod = normalizeAuthMethod(readBodyValue('auth_method', readBodyValue('authMethod', fallback.auth_method || 'none')));
+  const requestMethod = normalizeRequestMethod(readBodyValue('request_method', readBodyValue('requestMethod', fallback.request_method || 'GET')));
+  const requestBodyJson = validateMaxLength(readBodyValue('request_body_json', readBodyValue('requestBodyJson', fallback.request_body_json || '')) || '', REQUEST_BODY_MAX_LENGTH, 'API request body');
+  const authUsername = validateMaxLength(readBodyValue('auth_username', readBodyValue('authUsername', fallback.auth_username || '')) || '', AUTH_MAX_LENGTH, 'API source username');
+  const authPassword = validateMaxLength(readBodyValue('auth_password', readBodyValue('authPassword', fallback.auth_password || '')) || '', AUTH_MAX_LENGTH, 'API source password');
+  const authBearerToken = validateMaxLength(readBodyValue('auth_bearer_token', readBodyValue('authBearerToken', fallback.auth_bearer_token || '')) || '', AUTH_MAX_LENGTH, 'API source bearer token');
+  const authHeaderName = validateMaxLength(readBodyValue('auth_header_name', readBodyValue('authHeaderName', fallback.auth_header_name || 'X-API-Key')) || 'X-API-Key', AUTH_MAX_LENGTH, 'API source header name') || 'X-API-Key';
+  const authHeaderValue = validateMaxLength(readBodyValue('auth_header_value', readBodyValue('authHeaderValue', fallback.auth_header_value || '')) || '', AUTH_MAX_LENGTH, 'API source header value');
+  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 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');
   const updateIntervalValue = Math.max(1, Number(req.body.update_interval_value || req.body.updateIntervalValue || fallback.update_interval_value || 60));
   const updateIntervalUnit = normalizeUpdateIntervalUnit(req.body.update_interval_unit || req.body.updateIntervalUnit || fallback.update_interval_unit || 'minutes');
 
@@ -134,9 +349,67 @@ function buildApiSourcePayload(req, existingApiSource) {
     throw error;
   }
 
+  if (authMethod === 'basic' && !authUsername && !authPassword) {
+    const error = new Error('Basic auth requires a username or password.');
+    error.statusCode = 400;
+    throw error;
+  }
+
+  if (authMethod === 'bearer' && !authBearerToken) {
+    const error = new Error('Bearer auth requires a token.');
+    error.statusCode = 400;
+    throw error;
+  }
+
+  if (authMethod === 'api_key_header' && !authHeaderValue) {
+    const error = new Error('API key auth requires a header value.');
+    error.statusCode = 400;
+    throw error;
+  }
+
+  parseJsonRequestBody(requestBodyJson, 'API request body');
+  parseJsonRequestBody(tokenRequestBodyJson, 'Login request body');
+
+  if (authMethod === 'token_login') {
+    if (!tokenUrl) {
+      const error = new Error('Token login requires a login URL.');
+      error.statusCode = 400;
+      throw error;
+    }
+    try {
+      const tokenParsedUrl = new URL(tokenUrl);
+      if (tokenParsedUrl.protocol !== 'http:' && tokenParsedUrl.protocol !== 'https:') {
+        throw new Error('invalid protocol');
+      }
+    } catch (_error) {
+      const error = new Error('Enter a valid API token URL.');
+      error.statusCode = 400;
+      throw error;
+    }
+    if (!tokenRequestBodyJson) {
+      const error = new Error('Token login requires a JSON request body.');
+      error.statusCode = 400;
+      throw error;
+    }
+  }
+
   return {
     name: name,
     apiUrl: parsedUrl.toString(),
+    requestMethod: requestMethod,
+    requestBodyJson: requestBodyJson,
+    authMethod: authMethod,
+    authUsername: authUsername,
+    authPassword: authPassword,
+    authBearerToken: authBearerToken,
+    authHeaderName: authHeaderName,
+    authHeaderValue: authHeaderValue,
+    tokenUrl: tokenUrl,
+    tokenRequestBodyJson: tokenRequestBodyJson,
+    tokenResponsePath: tokenResponsePath,
+    tokenHeaderName: tokenHeaderName,
+    tokenHeaderPrefix: tokenHeaderPrefix,
+    itemsPath: itemsPath,
     updateIntervalValue: Math.floor(updateIntervalValue),
     updateIntervalUnit: updateIntervalUnit
   };
@@ -144,6 +417,7 @@ function buildApiSourcePayload(req, existingApiSource) {
 
 module.exports = {
   fetchApiSourcesData: fetchApiSourcesData,
+  fetchApiSourcesPage: fetchApiSourcesPage,
   fetchApiSourceById: fetchApiSourceById,
   fetchApiSourceResponse: fetchApiSourceResponse,
   buildApiSourcePayload: buildApiSourcePayload

src/data/app-settings.js

@@ -0,0 +1,207 @@
+const { DEFAULT_ANNOUNCEMENT_ICON_KEYS } = require('./announcement-icons');
+
+const SETTING_DEFINITIONS = [
+  { key: 'app.name', type: 'string', defaultValue: 'Pulse Signage' },
+  { key: 'locale.timezone', type: 'string', defaultValue: 'Europe/London' },
+  { key: 'locale.language', type: 'string', defaultValue: 'en' },
+  { key: 'ui.theme', type: 'enum', values: ['dark', 'light', 'auto'], defaultValue: 'dark' },
+  { key: 'security.session_lifetime_days', type: 'integer', min: 1, defaultValue: 14 },
+  { key: 'security.allow_user_session_revocation', type: 'boolean', defaultValue: true },
+  { key: 'security.max_active_sessions', type: 'integer', min: 0, defaultValue: 0 },
+  { key: 'security.password_min_length', type: 'integer', min: 8, defaultValue: 10 },
+  { key: 'security.password_min_categories', type: 'integer', min: 1, defaultValue: 3 },
+  { key: 'security.password_require_lowercase', type: 'boolean', defaultValue: false },
+  { key: 'security.password_require_uppercase', type: 'boolean', defaultValue: false },
+  { key: 'security.password_require_number', type: 'boolean', defaultValue: false },
+  { key: 'security.password_require_symbol', type: 'boolean', defaultValue: false },
+  { key: 'security.require_password_change_for_new_users', type: 'boolean', defaultValue: true },
+  { key: 'security.require_password_change_after_admin_reset', type: 'boolean', defaultValue: true },
+  { 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: 'audit.enabled', type: 'boolean', defaultValue: true },
+  { key: 'audit.categories', type: 'string_array', defaultValue: ['authentication', 'security', 'sessions', 'users', 'roles', 'system-settings'] },
+  { 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 },
+  { key: 'uploads.video_max_bytes', type: 'integer', min: 1, defaultValue: 1024 * 1024 * 1024 },
+  { key: 'uploads.wysiwyg_image_max_bytes', type: 'integer', min: 1, defaultValue: 2 * 1024 * 1024 },
+  { key: 'uploads.allowed_mime_types', type: 'string_array', defaultValue: ['image/png', 'image/jpeg', 'image/gif', 'image/webp', 'image/svg+xml', 'video/mp4', 'video/webm', 'video/ogg'] },
+  { key: 'uploads.cleanup_days', type: 'integer', min: 0, defaultValue: 30 },
+  { key: 'uploads.optimize_images', type: 'boolean', defaultValue: true },
+  { key: 'announcements.default_icon', type: 'string', defaultValue: 'megaphone-fill' },
+  { key: 'announcements.default_duration_value', type: 'integer', min: 1, defaultValue: 10 },
+  { key: 'announcements.default_duration_unit', type: 'enum', values: ['seconds', 'minutes'], defaultValue: 'seconds' },
+  { 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' }
+];
+
+const DEFINITIONS_BY_KEY = new Map(SETTING_DEFINITIONS.map(function (definition) {
+  return [definition.key, definition];
+}));
+
+function cloneValue(value) {
+  if (Array.isArray(value)) {
+    return value.slice();
+  }
+  return value;
+}
+
+function getAppSettingDefinitions() {
+  return SETTING_DEFINITIONS.map(function (definition) {
+    return Object.assign({}, definition, {
+      values: definition.values ? definition.values.slice() : undefined,
+      defaultValue: cloneValue(definition.defaultValue)
+    });
+  });
+}
+
+function getDefaultAppSettings() {
+  return SETTING_DEFINITIONS.reduce(function (settings, definition) {
+    settings[definition.key] = cloneValue(definition.defaultValue);
+    return settings;
+  }, {});
+}
+
+function normalizeSettingValue(key, value) {
+  const definition = DEFINITIONS_BY_KEY.get(String(key || '').trim());
+  if (!definition) {
+    throw new Error('Unknown application setting: ' + key);
+  }
+
+  if (definition.type === 'string') {
+    return String(value == null ? '' : value).trim();
+  }
+
+  if (definition.type === 'integer') {
+    const normalized = Number(value);
+    if (!Number.isInteger(normalized) || normalized < definition.min) {
+      throw new Error('Invalid value for application setting: ' + definition.key);
+    }
+    return normalized;
+  }
+
+  if (definition.type === 'boolean') {
+    if (value === true || value === 1 || value === '1' || value === 'true') {
+      return true;
+    }
+    if (value === false || value === 0 || value === '0' || value === 'false') {
+      return false;
+    }
+    throw new Error('Invalid value for application setting: ' + definition.key);
+  }
+
+  if (definition.type === 'enum') {
+    const normalized = String(value == null ? '' : value).trim();
+    if (!definition.values.includes(normalized)) {
+      throw new Error('Invalid value for application setting: ' + definition.key);
+    }
+    return normalized;
+  }
+
+  if (definition.type === 'string_array') {
+    if (!Array.isArray(value)) {
+      throw new Error('Invalid value for application setting: ' + definition.key);
+    }
+    return Array.from(new Set(value.map(function (item) {
+      return String(item || '').trim();
+    }).filter(Boolean)));
+  }
+
+  throw new Error('Unsupported application setting type: ' + definition.type);
+}
+
+function normalizeAppSettings(settings) {
+  const input = settings && typeof settings === 'object' ? settings : {};
+  return SETTING_DEFINITIONS.reduce(function (normalized, definition) {
+    const value = Object.prototype.hasOwnProperty.call(input, definition.key)
+      ? input[definition.key]
+      : definition.defaultValue;
+    normalized[definition.key] = normalizeSettingValue(definition.key, value);
+    return normalized;
+  }, {});
+}
+
+function parseStoredValue(value) {
+  if (typeof value !== 'string') {
+    return value;
+  }
+  try {
+    return JSON.parse(value);
+  } catch (_error) {
+    return value;
+  }
+}
+
+async function fetchAppSettings(pool) {
+  const [rows] = await pool.query('SELECT id, setting_key, setting_value FROM o_app_settings ORDER BY setting_key');
+  const storedSettings = {};
+  (rows || []).forEach(function (row) {
+    const key = String(row && row.setting_key || '').trim();
+    if (DEFINITIONS_BY_KEY.has(key)) {
+      storedSettings[key] = parseStoredValue(row.setting_value);
+    }
+  });
+  return normalizeAppSettings(Object.assign({}, getDefaultAppSettings(), storedSettings));
+}
+
+async function saveAppSettings(pool, settings, modifiedBy) {
+  const inputSettings = settings && typeof settings === 'object' ? settings : {};
+  const normalizedSettings = normalizeAppSettings(inputSettings);
+  const connection = typeof pool.getConnection === 'function' ? await pool.getConnection() : pool;
+  const shouldRelease = connection !== pool;
+
+  try {
+    if (typeof connection.beginTransaction === 'function') {
+      await connection.beginTransaction();
+    }
+    for (const definition of SETTING_DEFINITIONS) {
+      if (!Object.prototype.hasOwnProperty.call(inputSettings, definition.key)) {
+        continue;
+      }
+      await connection.query(
+        `UPDATE o_app_settings
+            SET setting_value = ?, modified_by = ?
+          WHERE setting_key = ?`,
+        [JSON.stringify(normalizedSettings[definition.key]), modifiedBy || null, definition.key]
+      );
+      await connection.query(
+        `INSERT INTO o_app_settings (setting_key, setting_value, created_by, modified_by)
+         SELECT ?, ?, ?, ?
+          WHERE NOT EXISTS (
+            SELECT 1 FROM o_app_settings WHERE setting_key = ?
+          )`,
+        [definition.key, JSON.stringify(normalizedSettings[definition.key]), modifiedBy || null, modifiedBy || null, definition.key]
+      );
+    }
+    if (typeof connection.commit === 'function') {
+      await connection.commit();
+    }
+  } catch (error) {
+    if (typeof connection.rollback === 'function') {
+      await connection.rollback();
+    }
+    throw error;
+  } finally {
+    if (shouldRelease && typeof connection.release === 'function') {
+      connection.release();
+    }
+  }
+
+  return normalizedSettings;
+}
+
+module.exports = {
+  getAppSettingDefinitions,
+  getDefaultAppSettings,
+  normalizeSettingValue,
+  normalizeAppSettings,
+  fetchAppSettings,
+  saveAppSettings
+};

src/data/audit-log.js

@@ -0,0 +1,118 @@
+const AUDIT_EVENT_CATEGORIES = Object.freeze({
+  AUTHENTICATION: 'authentication',
+  SECURITY: 'security',
+  SESSIONS: 'sessions',
+  USERS: 'users',
+  ROLES: 'roles',
+  SETTINGS: 'system-settings',
+  SLIDES: 'slides',
+  TEMPLATES: 'templates',
+  PLAYLISTS: 'playlists',
+  SCREENS: 'screens',
+  ANNOUNCEMENTS: 'announcements',
+  CANVAS_SIZES: 'canvas-sizes',
+  API_SOURCES: 'api-sources',
+  RSS_FEEDS: 'rss-feeds',
+  TIMETABLES: 'timetables'
+});
+const AUDIT_CATEGORY_KEYS = Object.freeze(Object.values(AUDIT_EVENT_CATEGORIES));
+const AUDIT_CATEGORY_LABELS = Object.freeze({
+  authentication: 'Authentication',
+  security: 'Security',
+  sessions: 'Sessions',
+  users: 'Users',
+  roles: 'Roles',
+  'system-settings': 'System Settings',
+  slides: 'Slides',
+  templates: 'Templates',
+  playlists: 'Playlists',
+  screens: 'Screens',
+  announcements: 'Announcements',
+  'canvas-sizes': 'Canvas Sizes',
+  'api-sources': 'API Sources',
+  'rss-feeds': 'RSS Feeds',
+  timetables: 'Timetables'
+});
+const { fetchAppSettings } = require('./app-settings');
+
+function normalizeDetails(details) {
+  if (details === undefined || details === null) {
+    return null;
+  }
+  return JSON.stringify(details);
+}
+
+function buildAuditChanges(previousValues, nextValues) {
+  const previous = previousValues && typeof previousValues === 'object' ? previousValues : {};
+  const next = nextValues && typeof nextValues === 'object' ? nextValues : {};
+  const changes = {};
+  const keys = new Set(Object.keys(previous).concat(Object.keys(next)));
+
+  keys.forEach(function (key) {
+    if (JSON.stringify(previous[key]) !== JSON.stringify(next[key])) {
+      changes[key] = { from: previous[key], to: next[key] };
+    }
+  });
+
+  return changes;
+}
+
+function getRequestMetadata(req) {
+  const forwardedAddress = String(req && req.headers && req.headers['x-forwarded-for'] || '').split(',')[0].trim();
+  return {
+    ipAddress: forwardedAddress || String(req && req.ip || req && req.socket && req.socket.remoteAddress || '').trim() || null,
+    userAgent: String(req && req.headers && req.headers['user-agent'] || '').trim() || null
+  };
+}
+
+async function recordAuditEvent(pool, event) {
+  const input = event && typeof event === 'object' ? event : {};
+  const category = String(input.category || '').trim().toLowerCase();
+  const eventType = String(input.eventType || '').trim().toLowerCase();
+  if (!category || !eventType) {
+    throw new Error('Audit events require a category and event type.');
+  }
+
+  await pool.query(
+    `INSERT INTO o_audit_events
+      (category, event_type, actor_user_id, target_type, target_id, target_label, ip_address, user_agent, details_json)
+     VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)`,
+    [
+      category,
+      eventType,
+      Number.isInteger(Number(input.actorUserId)) && Number(input.actorUserId) > 0 ? Number(input.actorUserId) : null,
+      String(input.targetType || '').trim() || null,
+      String(input.targetId || '').trim() || null,
+      String(input.targetLabel || '').trim() || null,
+      String(input.ipAddress || '').trim() || null,
+      String(input.userAgent || '').trim() || null,
+      normalizeDetails(input.details)
+    ]
+  );
+}
+
+async function recordRequestAuditEvent(pool, req, event) {
+  try {
+    const settings = await fetchAppSettings(pool);
+    const category = String(event && event.category || '').trim().toLowerCase();
+    const enabledCategories = Array.isArray(settings['audit.categories']) ? settings['audit.categories'] : AUDIT_CATEGORY_KEYS;
+    if (!settings['audit.enabled'] || !enabledCategories.includes(category)) {
+      return;
+    }
+    const metadata = settings['audit.include_request_metadata'] ? getRequestMetadata(req) : {};
+    await recordAuditEvent(pool, Object.assign({}, event, metadata));
+  } catch (error) {
+    // Auditing must not turn a successful login or administration action into a failed request.
+    console.error('Unable to record audit event:', error.message);
+  }
+}
+
+module.exports = {
+  AUDIT_EVENT_CATEGORIES,
+  AUDIT_CATEGORY_KEYS,
+  AUDIT_CATEGORY_LABELS,
+  getRequestMetadata,
+  buildAuditChanges,
+  recordAuditEvent,
+  recordRequestAuditEvent
+};

src/data/canvas-sizes.js

@@ -1,17 +1,64 @@
+// Canvas size data access and pagination helpers.
+
+const { fetchPagedRows } = require('./utils');
+const MAX_CANVAS_SIZE_DIMENSION = 16384;
+
 async function fetchCanvasSizesData(pool) {
-  const [canvasSizes] = await pool.query('SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM canvas_sizes ORDER BY width ASC, height ASC, name ASC');
+  const [canvasSizes] = await pool.query('SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM c_canvas_sizes ORDER BY width ASC, height ASC, name ASC');
   return { canvasSizes };
 }
 
+async function fetchCanvasSizesPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: 'SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM c_canvas_sizes ORDER BY width ASC, height ASC, name ASC',
+    countSql: 'SELECT COUNT(*) AS count FROM c_canvas_sizes',
+    searchColumns: ['name', 'width', 'height'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      name: 'name',
+      dimensions: ['width', 'height', 'name'],
+      created: 'created_at',
+      modified: 'modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ canvasSizes: paged.rows }, paged);
+}
+
 async function fetchCanvasSizeById(pool, id) {
-  const [rows] = await pool.query('SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM canvas_sizes WHERE id = ?', [id]);
+  const [rows] = await pool.query('SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM c_canvas_sizes WHERE id = ?', [id]);
   return rows[0] || null;
 }
 
+function readCanvasDimension(rawValue, fallbackValue, fieldName) {
+  const sourceValue = rawValue !== undefined && rawValue !== null && String(rawValue).trim() !== ''
+    ? rawValue
+    : fallbackValue;
+  const numericValue = Number(sourceValue);
+
+  if (!Number.isFinite(numericValue)) {
+    const error = new Error('Canvas size ' + fieldName + ' must be a number.');
+    error.statusCode = 400;
+    throw error;
+  }
+
+  if (numericValue > MAX_CANVAS_SIZE_DIMENSION) {
+    const error = new Error('Canvas size dimensions must be 16384 or less.');
+    error.statusCode = 400;
+    throw error;
+  }
+
+  return Math.max(1, numericValue);
+}
+
 function buildCanvasSizePayload(req, existingCanvasSize) {
   const name = String(req.body.name || '').trim();
-  const width = Math.max(1, Number(req.body.width || (existingCanvasSize && existingCanvasSize.width) || 0));
-  const height = Math.max(1, Number(req.body.height || (existingCanvasSize && existingCanvasSize.height) || 0));
+  const width = readCanvasDimension(req.body.width, existingCanvasSize && existingCanvasSize.width, 'width');
+  const height = readCanvasDimension(req.body.height, existingCanvasSize && existingCanvasSize.height, 'height');
 
   if (!name) {
     const error = new Error('Canvas size name is required.');
@@ -28,6 +75,8 @@ function buildCanvasSizePayload(req, existingCanvasSize) {
 
 module.exports = {
   fetchCanvasSizesData,
+  fetchCanvasSizesPage,
   fetchCanvasSizeById,
-  buildCanvasSizePayload
+  buildCanvasSizePayload,
+  MAX_CANVAS_SIZE_DIMENSION
 };

src/data/client-name-check.js

@@ -1,3 +1,5 @@
+// Client name reservation helpers for onboarding and live connection checks.
+
 const crypto = require('crypto');
 
 function normalizeClientName(value) {
@@ -26,7 +28,7 @@ async function isClientNameAvailable(pool, clientName, excludeDeviceId, liveConn
     if (pool) {
       const [deviceRows] = await pool.query(
         `SELECT device_id
-         FROM player_onboarding_devices
+         FROM d_onboarding_devices
          WHERE client_name IS NOT NULL
            AND TRIM(client_name) <> ''
            AND LOWER(TRIM(client_name)) = LOWER(TRIM(?))

src/data/index.js

@@ -1,24 +1,58 @@
-const { fetchAdminData } = require('./admin');
+// Aggregated exports for the shared data access layer.
+
+const { fetchAdminData, fetchPlaylistsPage, fetchSlidesPage, fetchTemplatesPage, fetchCanvasSizesPage, fetchScreensPage } = require('./admin');
+const { ANNOUNCEMENT_TYPES, ANNOUNCEMENT_COLORS, ANNOUNCEMENT_ICONS, DEFAULT_ANNOUNCEMENT_ICON, normalizeAnnouncementType, normalizeAnnouncementColor, normalizeAnnouncementIcon, fetchAnnouncementsPage, fetchAnnouncementById, fetchActiveAnnouncement, buildAnnouncementPayload } = require('./announcements');
+const { ANNOUNCEMENT_ICON_OPTIONS, ANNOUNCEMENT_ICON_LABELS } = require('./announcement-icons');
 const { fetchPlaylistById } = require('./playlists');
-const { fetchApiSourcesData, fetchApiSourceById, fetchApiSourceResponse, buildApiSourcePayload } = require('./api-sources');
-const { fetchRssFeedsData, fetchRssFeedById, fetchRssFeedItemsByFeedId, normalizeRssFeedItem, buildRssFeedPayload, fetchRssFeedItems, replaceRssFeedItems } = require('./rss-feeds');
-const { slugify, uniqueScreenSlug, fetchScreenById, fetchScreenEditData } = require('./screens');
+const { normalizeDisplayMode, fetchTimetablesData, fetchTimetableGroupsPage, fetchTimetableGroupById, fetchTimetableEntriesByGroupId, buildTimetableGroupPayload } = require('./timetables');
+const { fetchApiSourcesData, fetchApiSourcesPage, fetchApiSourceById, fetchApiSourceResponse, buildApiSourcePayload } = require('./api-sources');
+const { fetchRssFeedsData, fetchRssFeedsPage, fetchRssFeedById, fetchRssFeedItemsByFeedId, normalizeRssFeedItem, buildRssFeedPayload, fetchRssFeedItems, replaceRssFeedItems } = require('./rss-feeds');
+const { slugify, uniqueScreenSlug, fetchScreenById, fetchScreenEditData, fetchScreenPlayerUrls, fetchPlayerPublicBaseUrl, fetchScreenPlayerRecord, fetchPlayerRecordByIdentifier } = require('./screens');
+const { fetchPlayerRegistrations } = require('./player-registry');
 const { fetchTemplateById, fetchTemplatesData, extractTemplateRegions, buildTemplatePayload } = require('./templates');
-const { fetchCanvasSizesData, fetchCanvasSizeById, buildCanvasSizePayload } = require('./canvas-sizes');
+const { fetchCanvasSizesData, fetchCanvasSizeById, buildCanvasSizePayload, MAX_CANVAS_SIZE_DIMENSION } = require('./canvas-sizes');
 const { fetchSlideById, buildSlidePayload } = require('./slides');
-const { parseJsonSafe, fetchDuplicateName } = require('./utils');
+const { parseJsonSafe, fetchDuplicateName, validateMaxLength, truncateToMaxLength } = require('./utils');
 
 module.exports = {
   slugify,
   uniqueScreenSlug,
   parseJsonSafe,
+  validateMaxLength,
+  truncateToMaxLength,
   fetchAdminData,
+  fetchPlaylistsPage,
+  fetchSlidesPage,
+  fetchTemplatesPage,
+  fetchCanvasSizesPage,
+  fetchScreensPage,
+  ANNOUNCEMENT_TYPES,
+  ANNOUNCEMENT_COLORS,
+  ANNOUNCEMENT_ICONS,
+  ANNOUNCEMENT_ICON_OPTIONS,
+  ANNOUNCEMENT_ICON_LABELS,
+  DEFAULT_ANNOUNCEMENT_ICON,
+  normalizeAnnouncementType,
+  normalizeAnnouncementColor,
+  normalizeAnnouncementIcon,
+  fetchAnnouncementsPage,
+  fetchAnnouncementById,
+  fetchActiveAnnouncement,
+  buildAnnouncementPayload,
   fetchPlaylistById,
+  normalizeDisplayMode,
+  fetchTimetablesData,
+  fetchTimetableGroupsPage,
+  fetchTimetableGroupById,
+  fetchTimetableEntriesByGroupId,
+  buildTimetableGroupPayload,
   fetchApiSourcesData,
+  fetchApiSourcesPage,
   fetchApiSourceById,
   fetchApiSourceResponse,
   buildApiSourcePayload,
   fetchRssFeedsData,
+  fetchRssFeedsPage,
   fetchRssFeedById,
   fetchRssFeedItemsByFeedId,
   normalizeRssFeedItem,
@@ -27,12 +61,18 @@ module.exports = {
   replaceRssFeedItems,
   fetchScreenById,
   fetchScreenEditData,
+  fetchScreenPlayerUrls,
+  fetchPlayerPublicBaseUrl,
+  fetchScreenPlayerRecord,
+  fetchPlayerRecordByIdentifier,
+  fetchPlayerRegistrations,
   fetchTemplateById,
   fetchSlideById,
   fetchTemplatesData,
   fetchCanvasSizesData,
   fetchCanvasSizeById,
   buildCanvasSizePayload,
+  MAX_CANVAS_SIZE_DIMENSION,
   buildSlidePayload,
   extractTemplateRegions,
   buildTemplatePayload,

src/data/player-registry.js

@@ -0,0 +1,151 @@
+function normalizeDeviceId(value) {
+  return String(value || '')
+    .trim()
+    .replace(/[^a-zA-Z0-9_-]/g, '')
+    .slice(0, 128);
+}
+
+function normalizeBaseUrl(value) {
+  return String(value || '').trim().replace(/\/$/, '');
+}
+
+function normalizeIdentifier(value) {
+  return String(value || '').trim().slice(0, 255);
+}
+
+async function columnExists(pool, tableName, columnName) {
+  const [rows] = await pool.query(
+    `SELECT COUNT(*) AS column_count
+     FROM information_schema.COLUMNS
+     WHERE TABLE_SCHEMA = DATABASE()
+       AND TABLE_NAME = ?
+       AND COLUMN_NAME = ?`,
+    [tableName, columnName]
+  );
+
+  return Number(rows && rows[0] && rows[0].column_count) > 0;
+}
+
+async function fetchPlayerRegistrations(pool) {
+  if (!pool) {
+    return [];
+  }
+
+  const [rows] = await pool.query(
+    `SELECT id, identifier, public_base_url, internal_base_url, last_seen_at, modified_at
+     FROM d_players
+     ORDER BY modified_at DESC, identifier ASC`
+  );
+
+  return rows;
+}
+
+function getConfiguredPlayerIdentifier() {
+  return normalizeDeviceId(process.env.PLAYER_IDENTIFIER || process.env.PLAYER_DEVICE_ID || '');
+}
+
+async function resolvePlayerRegistration(pool, identifier) {
+  const normalizedIdentifier = normalizeDeviceId(identifier);
+  if (!pool || !normalizedIdentifier) {
+    return null;
+  }
+
+  const hasIdentifierColumn = await columnExists(pool, 'd_players', 'identifier');
+  const hasDeviceIdColumn = await columnExists(pool, 'd_players', 'device_id');
+  const identifierColumn = hasIdentifierColumn ? 'identifier' : (hasDeviceIdColumn ? 'device_id' : '');
+  if (!identifierColumn) {
+    return null;
+  }
+
+  const selectIdExpression = hasIdentifierColumn ? 'id' : 'NULL AS id';
+  const selectIdentifierExpression = hasIdentifierColumn ? 'identifier' : 'device_id AS identifier';
+  const orderByExpression = hasIdentifierColumn ? 'modified_at DESC, id DESC' : 'modified_at DESC';
+
+  const [rows] = await pool.query(
+    `SELECT ${selectIdExpression}, ${selectIdentifierExpression}, public_base_url, internal_base_url, last_seen_at
+     FROM d_players
+     WHERE ${identifierColumn} = ?
+     LIMIT 1`,
+    [normalizedIdentifier]
+  );
+
+  if (rows[0]) {
+    return rows[0];
+  }
+
+  const [fallbackRows] = await pool.query(
+    `SELECT ${selectIdExpression}, ${selectIdentifierExpression}, public_base_url, internal_base_url, last_seen_at
+     FROM d_players
+     ORDER BY ${orderByExpression}
+     LIMIT 1`
+  );
+
+  return fallbackRows[0] || null;
+}
+
+async function upsertPlayerRegistration(pool, options) {
+  const identifier = normalizeDeviceId(options && (options.identifier || options.deviceId));
+  const publicBaseUrl = normalizeBaseUrl(options && options.publicBaseUrl);
+  const internalBaseUrl = normalizeBaseUrl(options && options.internalBaseUrl);
+
+  if (!pool || !identifier) {
+    return null;
+  }
+
+  await pool.query(
+    `UPDATE d_players
+        SET public_base_url = ?, internal_base_url = ?, last_seen_at = CURRENT_TIMESTAMP, modified_at = CURRENT_TIMESTAMP
+      WHERE identifier = ?`,
+    [publicBaseUrl || null, internalBaseUrl || null, identifier]
+  );
+  await pool.query(
+    `INSERT INTO d_players (identifier, public_base_url, internal_base_url, last_seen_at)
+     SELECT ?, ?, ?, CURRENT_TIMESTAMP
+      WHERE NOT EXISTS (
+        SELECT 1 FROM d_players WHERE identifier = ?
+      )`,
+    [identifier, publicBaseUrl || null, internalBaseUrl || null, identifier]
+  );
+
+  return resolvePlayerRegistration(pool, identifier);
+}
+
+async function recordPlayerHeartbeat(pool, options) {
+  const identifier = normalizeDeviceId(options && (options.identifier || options.deviceId));
+  const publicBaseUrl = normalizeBaseUrl(options && options.publicBaseUrl);
+  const internalBaseUrl = normalizeBaseUrl(options && options.internalBaseUrl);
+
+  if (!pool || !identifier) {
+    return null;
+  }
+
+  await pool.query(
+    `UPDATE d_players
+        SET public_base_url = COALESCE(?, public_base_url),
+            internal_base_url = COALESCE(?, internal_base_url),
+            last_seen_at = CURRENT_TIMESTAMP,
+            modified_at = CURRENT_TIMESTAMP
+      WHERE identifier = ?`,
+    [publicBaseUrl || null, internalBaseUrl || null, identifier]
+  );
+  await pool.query(
+    `INSERT INTO d_players (identifier, public_base_url, internal_base_url, last_seen_at)
+     SELECT ?, ?, ?, CURRENT_TIMESTAMP
+      WHERE NOT EXISTS (
+        SELECT 1 FROM d_players WHERE identifier = ?
+      )`,
+    [identifier, publicBaseUrl || null, internalBaseUrl || null, identifier]
+  );
+
+  return resolvePlayerRegistration(pool, identifier);
+}
+
+module.exports = {
+  normalizeDeviceId: normalizeDeviceId,
+  normalizeIdentifier: normalizeIdentifier,
+  getConfiguredPlayerIdentifier: getConfiguredPlayerIdentifier,
+  fetchPlayerRegistrations: fetchPlayerRegistrations,
+  resolvePlayerRegistration: resolvePlayerRegistration,
+  upsertPlayerRegistration: upsertPlayerRegistration,
+  recordPlayerHeartbeat: recordPlayerHeartbeat
+};

src/data/playlists.js

@@ -1,5 +1,7 @@
+// Playlist data access helpers.
+
 async function fetchPlaylistById(pool, id) {
-  const [rows] = await pool.query('SELECT id, name, fade_between_slides, created_at, modified_at, created_by, modified_by FROM playlists WHERE id = ?', [id]);
+  const [rows] = await pool.query('SELECT id, name, fade_between_slides, skip_unavailable_rtmp, canvas_id, created_at, modified_at, created_by, modified_by FROM c_playlists WHERE id = ?', [id]);
   return rows[0] || null;
 }
 

src/data/qr-code.js

@@ -0,0 +1,472 @@
+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;
+
+function escapeXml(value) {
+  return String(value === undefined || value === null ? '' : value).replace(/[&<>"']/g, function (character) {
+    return {
+      '&': '&amp;',
+      '<': '&lt;',
+      '>': '&gt;',
+      '"': '&quot;',
+      "'": '&apos;'
+    }[character];
+  });
+}
+
+function serializeNode(node) {
+  if (!node) {
+    return '';
+  }
+  if (node.nodeType === 3) {
+    return escapeXml(node.textContent || '');
+  }
+
+  const attributeEntries = Object.keys(node.attributes || {}).map(function (name) {
+    return name + '="' + escapeXml(node.attributes[name]) + '"';
+  });
+  if (node.tagName === 'svg' && node.namespaceURI === 'http://www.w3.org/2000/svg' && !Object.prototype.hasOwnProperty.call(node.attributes || {}, 'xmlns')) {
+    attributeEntries.unshift('xmlns="http://www.w3.org/2000/svg"');
+  }
+  const attributes = attributeEntries.join(' ');
+  const children = (node.childNodes || []).map(serializeNode).join('') + escapeXml(node.textContent || '');
+  return '<' + node.tagName + (attributes ? ' ' + attributes : '') + '>' + children + '</' + node.tagName + '>';
+}
+
+function createDomNode(tagName, namespaceUri) {
+  return {
+    tagName: tagName,
+    namespaceURI: namespaceUri || null,
+    attributes: {},
+    childNodes: [],
+    parentNode: null,
+    nodeType: 1,
+    textContent: '',
+    style: {},
+    setAttribute: function (name, value) {
+      this.attributes[name] = String(value);
+    },
+    appendChild: function (child) {
+      if (child) {
+        this.childNodes.push(child);
+        child.parentNode = this;
+      }
+      return child;
+    },
+    removeChild: function (child) {
+      this.childNodes = this.childNodes.filter(function (node) { return node !== child; });
+      return child;
+    },
+    get firstChild() {
+      return this.childNodes[0] || null;
+    },
+    get outerHTML() {
+      return serializeNode(this);
+    }
+  };
+}
+
+function createCanvasContext() {
+  return {
+    fillStyle: '#000000',
+    strokeStyle: '#000000',
+    lineWidth: 1,
+    beginPath: function () {},
+    closePath: function () {},
+    clearRect: function () {},
+    fillRect: function () {},
+    strokeRect: function () {},
+    moveTo: function () {},
+    lineTo: function () {},
+    arc: function () {},
+    rect: function () {},
+    fill: function () {},
+    stroke: function () {},
+    save: function () {},
+    restore: function () {},
+    translate: function () {},
+    rotate: function () {},
+    scale: function () {},
+    setTransform: function () {},
+    transform: function () {},
+    drawImage: function () {},
+    measureText: function (text) {
+      return { width: String(text === undefined || text === null ? '' : text).length * 8 };
+    },
+    createLinearGradient: function () {
+      return { addColorStop: function () {} };
+    },
+    createRadialGradient: function () {
+      return { addColorStop: function () {} };
+    },
+    createPattern: function () {
+      return null;
+    },
+    getImageData: function () {
+      return { data: [] };
+    },
+    putImageData: function () {},
+    clip: function () {}
+  };
+}
+
+function createCanvasNode() {
+  const node = createDomNode('canvas', 'http://www.w3.org/1999/xhtml');
+  node.width = 0;
+  node.height = 0;
+  node.getContext = function () {
+    return createCanvasContext();
+  };
+  node.toDataURL = function () {
+    return '';
+  };
+  node.toBlob = function (callback) {
+    if (typeof callback === 'function') {
+      callback(null);
+    }
+  };
+  return node;
+}
+
+function createQrStylingWindow() {
+  const document = {
+    createElement: function (tagName) {
+      if (String(tagName || '').toLowerCase() === 'canvas') {
+        return createCanvasNode();
+      }
+      return createDomNode(tagName, 'http://www.w3.org/1999/xhtml');
+    },
+    createElementNS: function (namespaceUri, tagName) {
+      return createDomNode(tagName, namespaceUri);
+    },
+    createTextNode: function (text) {
+      return {
+        nodeType: 3,
+        textContent: String(text === undefined || text === null ? '' : text),
+        parentNode: null
+      };
+    },
+    body: createDomNode('body', 'http://www.w3.org/1999/xhtml'),
+    head: createDomNode('head', 'http://www.w3.org/1999/xhtml')
+  };
+
+  const window = {
+    document: document,
+    navigator: { userAgent: 'node' },
+    URL: {
+      createObjectURL: function () { return ''; },
+      revokeObjectURL: function () {}
+    }
+  };
+
+  window.window = window;
+  window.self = window;
+  window.Image = class {
+    constructor() {
+      this.onload = null;
+      this.onerror = null;
+      this.width = 1;
+      this.height = 1;
+      this.naturalWidth = 1;
+      this.naturalHeight = 1;
+      this._src = '';
+    }
+
+    set src(value) {
+      this._src = String(value === undefined || value === null ? '' : value);
+      if (typeof this.onload === 'function') {
+        setTimeout(() => this.onload(), 0);
+      }
+    }
+
+    get src() {
+      return this._src;
+    }
+  };
+  window.HTMLImageElement = window.Image;
+
+  window.XMLSerializer = class {
+    serializeToString(node) {
+      return serializeNode(node);
+    }
+  };
+
+  return { window: window, document: document };
+}
+
+async function renderStyledQrRawData(options, format) {
+  const previousWindow = global.window;
+  const previousDocument = global.document;
+  const previousXMLSerializer = global.XMLSerializer;
+  const dom = createQrStylingWindow();
+
+  global.window = dom.window;
+  global.document = dom.document;
+  global.XMLSerializer = dom.window.XMLSerializer;
+
+  try {
+    const qrCode = new QRCodeStyling(options);
+    const blob = await qrCode.getRawData(format);
+    if (!blob) {
+      return '';
+    }
+
+    if (typeof blob === 'string') {
+      return blob;
+    }
+
+    if (typeof blob.text === 'function') {
+      return blob.text();
+    }
+
+    if (typeof blob.arrayBuffer === 'function') {
+      const buffer = await blob.arrayBuffer();
+      const bytes = new Uint8Array(buffer);
+      let binary = '';
+      for (let index = 0; index < bytes.length; index += 1) {
+        binary += String.fromCharCode(bytes[index]);
+      }
+      return binary;
+    }
+
+    return '';
+  } finally {
+    global.window = previousWindow;
+    global.document = previousDocument;
+    global.XMLSerializer = previousXMLSerializer;
+  }
+}
+
+function svgToDataUrl(svg) {
+  const markup = String(svg === undefined || svg === null ? '' : svg).trim();
+  if (!markup) {
+    return '';
+  }
+
+  return 'data:image/svg+xml;charset=utf-8,' + encodeURIComponent(markup);
+}
+
+function normalizeQrStyleColor(value, fallback) {
+  const raw = String(value === undefined || value === null ? '' : value).trim();
+  return raw || fallback;
+}
+
+function normalizeQrStyleNumber(value, fallback, min, max) {
+  const parsed = Number(value);
+  if (!Number.isFinite(parsed)) {
+    return fallback;
+  }
+
+  let next = parsed;
+  if (typeof min === 'number') {
+    next = Math.max(min, next);
+  }
+  if (typeof max === 'number') {
+    next = Math.min(max, next);
+  }
+  return next;
+}
+
+function buildQrStylingOptions(source) {
+  const text = String(source && source.value === undefined ? '' : source && source.value === null ? '' : source.value || '').trim();
+  const qrStyle = source && typeof source === 'object' ? source : {};
+  const dotsGradient = qrStyle.qr_dots_color_mode === 'gradient' ? {
+    type: String(qrStyle.qr_dots_gradient_type || 'linear').trim() || 'linear',
+    rotation: normalizeQrStyleNumber(qrStyle.qr_dots_gradient_rotation, 0, undefined, undefined),
+    colorStops: [
+      { offset: 0, color: normalizeQrStyleColor(qrStyle.qr_dots_gradient_color_1, normalizeQrStyleColor(qrStyle.qr_dots_color, '#000000')) },
+      { offset: 1, color: normalizeQrStyleColor(qrStyle.qr_dots_gradient_color_2, '#ffffff') }
+    ]
+  } : null;
+  const cornersSquareGradient = qrStyle.qr_corners_square_color_mode === 'gradient' ? {
+    type: String(qrStyle.qr_corners_square_gradient_type || 'linear').trim() || 'linear',
+    rotation: normalizeQrStyleNumber(qrStyle.qr_corners_square_gradient_rotation, 0, undefined, undefined),
+    colorStops: [
+      { offset: 0, color: normalizeQrStyleColor(qrStyle.qr_corners_square_gradient_color_1, normalizeQrStyleColor(qrStyle.qr_corners_square_color, '#000000')) },
+      { offset: 1, color: normalizeQrStyleColor(qrStyle.qr_corners_square_gradient_color_2, '#ffffff') }
+    ]
+  } : null;
+  const cornersDotGradient = qrStyle.qr_corners_dot_color_mode === 'gradient' ? {
+    type: String(qrStyle.qr_corners_dot_gradient_type || 'linear').trim() || 'linear',
+    rotation: normalizeQrStyleNumber(qrStyle.qr_corners_dot_gradient_rotation, 0, undefined, undefined),
+    colorStops: [
+      { offset: 0, color: normalizeQrStyleColor(qrStyle.qr_corners_dot_gradient_color_1, normalizeQrStyleColor(qrStyle.qr_corners_dot_color, '#000000')) },
+      { offset: 1, color: normalizeQrStyleColor(qrStyle.qr_corners_dot_gradient_color_2, '#ffffff') }
+    ]
+  } : null;
+
+  return {
+    width: QR_PNG_WIDTH,
+    height: QR_PNG_WIDTH,
+    type: 'canvas',
+    data: text,
+    margin: normalizeQrStyleNumber(qrStyle.qr_margin, 10, 0, undefined),
+    qrOptions: {},
+    dotsOptions: {
+      type: String(qrStyle.qr_dots_type || 'square').trim() || 'square',
+      color: normalizeQrStyleColor(qrStyle.qr_dots_color, '#000000'),
+      gradient: dotsGradient || undefined
+    },
+    cornersSquareOptions: {
+      type: String(qrStyle.qr_corners_square_type || 'square').trim() || 'square',
+      color: normalizeQrStyleColor(qrStyle.qr_corners_square_color, '#000000'),
+      gradient: cornersSquareGradient || undefined
+    },
+    cornersDotOptions: {
+      type: String(qrStyle.qr_corners_dot_type || 'square').trim() || 'square',
+      color: normalizeQrStyleColor(qrStyle.qr_corners_dot_color, '#000000'),
+      gradient: cornersDotGradient || undefined
+    },
+    backgroundOptions: {
+      color: qrStyle.qr_background_transparent ? 'transparent' : normalizeQrStyleColor(qrStyle.qr_background_color, '#ffffff')
+    },
+    image: String(qrStyle.qr_image || '').trim() || undefined,
+    imageOptions: {
+      hideBackgroundDots: Boolean(qrStyle.qr_image_hide_background_dots),
+      imageSize: normalizeQrStyleNumber(qrStyle.qr_image_size, 0.4, 0, 1),
+      margin: normalizeQrStyleNumber(qrStyle.qr_image_margin, 5, 0, undefined)
+    }
+  };
+}
+
+async function createStyledQrCodeDataUrl(value) {
+  const source = value && typeof value === 'object' ? value : { value: value };
+  const options = buildQrStylingOptions(source);
+  if (!options.data) {
+    return '';
+  }
+
+  return svgToDataUrl(await createStyledQrCodeSvg(options.data));
+}
+
+async function createStyledQrCodeSvg(value) {
+  const source = value && typeof value === 'object' ? value : { value: value };
+  const options = buildQrStylingOptions(source);
+  if (!options.data) {
+    return '';
+  }
+
+  return renderStyledQrRawData(options, 'svg');
+}
+
+async function createQrCodeSvg(value) {
+  return createStyledQrCodeSvg(value);
+}
+
+async function createQrCodeDataUrl(value) {
+  return createStyledQrCodeDataUrl(value);
+}
+
+async function buildQrCodeContent(value, options) {
+  const source = value && typeof value === 'object' ? value : { value: value };
+  const forcePreviewRefresh = Boolean(options && options.forcePreviewRefresh);
+  const text = String(source.value === undefined || source.value === null ? '' : source.value).trim();
+  const hasBooleanField = function (key) {
+    return Object.prototype.hasOwnProperty.call(source, key);
+  };
+  const margin = Number(source.qr_margin);
+  const normalizeHex = function (value) {
+    const raw = String(value === undefined || value === null ? '' : value).trim();
+    return raw || undefined;
+  };
+  const normalizeNumber = function (value, min, max, round) {
+    const parsed = Number(value);
+    if (!Number.isFinite(parsed)) {
+      return undefined;
+    }
+
+    let next = parsed;
+    if (round) {
+      next = Math.round(next);
+    }
+    if (typeof min === 'number') {
+      next = Math.max(min, next);
+    }
+    if (typeof max === 'number') {
+      next = Math.min(max, next);
+    }
+    return next;
+  };
+  const style = {
+    qr_margin: Number.isFinite(margin) && margin >= 0 ? Math.round(margin) : undefined,
+    qr_border_radius: Number.isFinite(Number(source.qr_border_radius)) ? Math.max(0, Math.round(Number(source.qr_border_radius))) : undefined,
+    qr_background_color: String(source.qr_background_color === undefined || source.qr_background_color === null ? '' : source.qr_background_color).trim() || undefined,
+    qr_background_transparent: hasBooleanField('qr_background_transparent') ? Boolean(source.qr_background_transparent) : undefined,
+    qr_background_color_mode: 'single',
+    qr_background_gradient_type: String(source.qr_background_gradient_type === undefined || source.qr_background_gradient_type === null ? '' : source.qr_background_gradient_type).trim() || undefined,
+    qr_background_gradient_rotation: normalizeNumber(source.qr_background_gradient_rotation),
+    qr_background_gradient_color_1: normalizeHex(source.qr_background_gradient_color_1),
+    qr_background_gradient_color_2: normalizeHex(source.qr_background_gradient_color_2),
+    qr_dots_color: String(source.qr_dots_color === undefined || source.qr_dots_color === null ? '' : source.qr_dots_color).trim() || undefined,
+    qr_dots_type: String(source.qr_dots_type === undefined || source.qr_dots_type === null ? '' : source.qr_dots_type).trim() || undefined,
+    qr_dots_color_mode: String(source.qr_dots_color_mode === undefined || source.qr_dots_color_mode === null ? '' : source.qr_dots_color_mode).trim() || undefined,
+    qr_dots_gradient_type: String(source.qr_dots_gradient_type === undefined || source.qr_dots_gradient_type === null ? '' : source.qr_dots_gradient_type).trim() || undefined,
+    qr_dots_gradient_rotation: normalizeNumber(source.qr_dots_gradient_rotation),
+    qr_dots_gradient_color_1: normalizeHex(source.qr_dots_gradient_color_1),
+    qr_dots_gradient_color_2: normalizeHex(source.qr_dots_gradient_color_2),
+    qr_corners_square_color: String(source.qr_corners_square_color === undefined || source.qr_corners_square_color === null ? '' : source.qr_corners_square_color).trim() || undefined,
+    qr_corners_square_type: String(source.qr_corners_square_type === undefined || source.qr_corners_square_type === null ? '' : source.qr_corners_square_type).trim() || undefined,
+    qr_corners_square_color_mode: String(source.qr_corners_square_color_mode === undefined || source.qr_corners_square_color_mode === null ? '' : source.qr_corners_square_color_mode).trim() || undefined,
+    qr_corners_square_gradient_type: String(source.qr_corners_square_gradient_type === undefined || source.qr_corners_square_gradient_type === null ? '' : source.qr_corners_square_gradient_type).trim() || undefined,
+    qr_corners_square_gradient_rotation: normalizeNumber(source.qr_corners_square_gradient_rotation),
+    qr_corners_square_gradient_color_1: normalizeHex(source.qr_corners_square_gradient_color_1),
+    qr_corners_square_gradient_color_2: normalizeHex(source.qr_corners_square_gradient_color_2),
+    qr_corners_dot_color: String(source.qr_corners_dot_color === undefined || source.qr_corners_dot_color === null ? '' : source.qr_corners_dot_color).trim() || undefined,
+    qr_corners_dot_type: String(source.qr_corners_dot_type === undefined || source.qr_corners_dot_type === null ? '' : source.qr_corners_dot_type).trim() || undefined,
+    qr_corners_dot_color_mode: String(source.qr_corners_dot_color_mode === undefined || source.qr_corners_dot_color_mode === null ? '' : source.qr_corners_dot_color_mode).trim() || undefined,
+    qr_corners_dot_gradient_type: String(source.qr_corners_dot_gradient_type === undefined || source.qr_corners_dot_gradient_type === null ? '' : source.qr_corners_dot_gradient_type).trim() || undefined,
+    qr_corners_dot_gradient_rotation: normalizeNumber(source.qr_corners_dot_gradient_rotation),
+    qr_corners_dot_gradient_color_1: normalizeHex(source.qr_corners_dot_gradient_color_1),
+    qr_corners_dot_gradient_color_2: normalizeHex(source.qr_corners_dot_gradient_color_2),
+    qr_image: String(source.qr_image === undefined || source.qr_image === null ? '' : source.qr_image).trim() || undefined,
+    qr_image_size: Number.isFinite(Number(source.qr_image_size)) ? Math.max(0, Math.min(1, Number(source.qr_image_size))) : undefined,
+    qr_image_margin: Number.isFinite(Number(source.qr_image_margin)) ? Math.max(0, Math.round(Number(source.qr_image_margin))) : undefined,
+    qr_image_hide_background_dots: hasBooleanField('qr_image_hide_background_dots') ? Boolean(source.qr_image_hide_background_dots) : undefined
+  };
+  const content = {
+    type: 'qr-code',
+    value: text
+  };
+
+  Object.keys(style).forEach((key) => {
+    if (style[key] !== undefined) {
+      content[key] = style[key];
+    }
+  });
+
+  content.qr_background_use_gradient = false;
+  content.qr_dots_use_gradient = content.qr_dots_gradient_type && content.qr_dots_gradient_type !== 'none';
+  content.qr_corners_square_use_gradient = content.qr_corners_square_gradient_type && content.qr_corners_square_gradient_type !== 'none';
+  content.qr_corners_dot_use_gradient = content.qr_corners_dot_gradient_type && content.qr_corners_dot_gradient_type !== 'none';
+
+  const svg = String(source.qr_svg === undefined || source.qr_svg === null ? '' : source.qr_svg).trim();
+  if (svg) {
+    content.qr_svg = svg;
+  }
+
+  const preview = forcePreviewRefresh ? '' : String(source.qr_preview === undefined || source.qr_preview === null ? '' : source.qr_preview).trim();
+  if (preview) {
+    content.qr_preview = preview;
+  }
+
+  if (text && !content.qr_preview) {
+    const generatedSvg = await createQrCodeSvg(text);
+    if (generatedSvg) {
+      content.qr_svg = generatedSvg;
+    }
+    const generatedDataUrl = await createStyledQrCodeDataUrl(content);
+    if (generatedDataUrl) {
+      content.qr_preview = generatedDataUrl;
+    }
+  }
+
+  return content;
+}
+
+module.exports = {
+  createQrCodeSvg,
+  createStyledQrCodeSvg,
+  createStyledQrCodeDataUrl,
+  createQrCodeDataUrl,
+  buildQrCodeContent
+};

src/data/rss-feeds.js

@@ -1,22 +1,54 @@
+// RSS feed data access, pagination, and item normalization helpers.
+
 const http = require('http');
 const https = require('https');
+const { fetchPagedRows, validateMaxLength } = require('./utils');
+
+const NAME_MAX_LENGTH = 255;
+const URL_MAX_LENGTH = 1024;
 
 function normalizeUpdateIntervalUnit(value) {
   const unit = String(value || '').trim().toLowerCase();
-  return unit === 'seconds' ? 'seconds' : 'minutes';
+  if (unit === 'seconds' || unit === 'minutes' || unit === 'hours') {
+    return unit;
+  }
+  return 'minutes';
 }
 
 async function fetchRssFeedsData(pool) {
   const [rssFeeds] = await pool.query(
-    'SELECT id, name, feed_url, update_interval_value, update_interval_unit, item_limit, created_at, modified_at, created_by, modified_by FROM rss_feeds ORDER BY modified_at DESC, id DESC'
+    'SELECT id, name, feed_url, update_interval_value, update_interval_unit, item_limit, created_at, modified_at, created_by, modified_by FROM i_rss_feeds ORDER BY modified_at DESC, id DESC'
   );
 
   return { rssFeeds: rssFeeds };
 }
 
+async function fetchRssFeedsPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: 'SELECT id, name, feed_url, update_interval_value, update_interval_unit, item_limit, created_at, modified_at, created_by, modified_by FROM i_rss_feeds ORDER BY modified_at DESC, id DESC',
+    countSql: 'SELECT COUNT(*) AS count FROM i_rss_feeds',
+    searchColumns: ['name', 'feed_url'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      name: 'name',
+      url: 'feed_url',
+      interval: ['update_interval_value', 'update_interval_unit'],
+      items: 'item_limit',
+      created: 'created_at',
+      modified: 'modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ rssFeeds: paged.rows }, paged);
+}
+
 async function fetchRssFeedById(pool, id) {
   const [rows] = await pool.query(
-    'SELECT id, name, feed_url, update_interval_value, update_interval_unit, item_limit, created_at, modified_at, created_by, modified_by FROM rss_feeds WHERE id = ?',
+    'SELECT id, name, feed_url, update_interval_value, update_interval_unit, item_limit, created_at, modified_at, created_by, modified_by FROM i_rss_feeds WHERE id = ?',
     [id]
   );
 
@@ -26,7 +58,7 @@ async function fetchRssFeedById(pool, id) {
 async function fetchRssFeedItemsByFeedId(pool, rssFeedId) {
   const [rows] = await pool.query(
     `SELECT id, rss_feed_id, position, item_json, created_at, modified_at
-     FROM rss_feed_items
+     FROM i_rss_feed_items
      WHERE rss_feed_id = ?
      ORDER BY position ASC, id ASC`,
     [rssFeedId]
@@ -205,7 +237,7 @@ async function fetchRssFeedItems(feedUrl, itemLimit) {
 
 async function replaceRssFeedItems(connection, rssFeedId, items) {
   const normalizedItems = Array.isArray(items) ? items : [];
-  await connection.query('DELETE FROM rss_feed_items WHERE rss_feed_id = ?', [rssFeedId]);
+  await connection.query('DELETE FROM i_rss_feed_items WHERE rss_feed_id = ?', [rssFeedId]);
 
   if (!normalizedItems.length) {
     return 0;
@@ -220,7 +252,7 @@ async function replaceRssFeedItems(connection, rssFeedId, items) {
   });
 
   await connection.query(
-    'INSERT INTO rss_feed_items (rss_feed_id, position, item_json) VALUES ?',
+    'INSERT INTO i_rss_feed_items (rss_feed_id, position, item_json) VALUES ?',
     [insertValues]
   );
 
@@ -229,8 +261,8 @@ async function replaceRssFeedItems(connection, rssFeedId, items) {
 
 function buildRssFeedPayload(req, existingRssFeed) {
   const fallback = existingRssFeed || {};
-  const name = String(req.body.name || fallback.name || '').trim();
-  const feedUrl = String(req.body.feed_url || req.body.feedUrl || fallback.feed_url || '').trim();
+  const name = validateMaxLength(req.body.name || fallback.name || '', NAME_MAX_LENGTH, 'RSS feed name');
+  const feedUrl = validateMaxLength(req.body.feed_url || req.body.feedUrl || fallback.feed_url || '', URL_MAX_LENGTH, 'RSS feed URL');
   const updateIntervalValue = Math.max(1, Number(req.body.update_interval_value || req.body.updateIntervalValue || fallback.update_interval_value || 60));
   const updateIntervalUnit = normalizeUpdateIntervalUnit(req.body.update_interval_unit || req.body.updateIntervalUnit || fallback.update_interval_unit || 'minutes');
   const itemLimit = Math.max(1, Number(req.body.item_limit || req.body.itemLimit || fallback.item_limit || 1));
@@ -285,6 +317,7 @@ function buildRssFeedPayload(req, existingRssFeed) {
 
 module.exports = {
   fetchRssFeedsData,
+  fetchRssFeedsPage,
   fetchRssFeedById,
   fetchRssFeedItemsByFeedId,
   normalizeRssFeedItem,

src/data/screens.js

@@ -1,3 +1,5 @@
+// Screen slug helpers and screen lookup utilities.
+
 function slugify(value) {
   return String(value || '')
     .toLowerCase()
@@ -7,13 +9,105 @@ function slugify(value) {
     .replace(/-{2,}/g, '-');
 }
 
+function normalizePlayerBaseUrl(value) {
+  return String(value || '').trim().replace(/\/$/, '');
+}
+
+function getConfiguredPlayerIdentifier() {
+  return String(process.env.PLAYER_IDENTIFIER || process.env.PLAYER_DEVICE_ID || '').trim() || null;
+}
+
+async function fetchPlayerRecordByIdentifier(pool, identifier) {
+  const normalizedIdentifier = String(identifier || '').trim();
+  if (!normalizedIdentifier) {
+    return null;
+  }
+
+  const [rows] = await pool.query(
+    `SELECT id, identifier, public_base_url, internal_base_url, last_seen_at
+     FROM d_players
+     WHERE identifier = ?
+     LIMIT 1`,
+    [normalizedIdentifier]
+  );
+
+  return rows[0] || null;
+}
+
+function buildScreenPlayerUrl(screen, fallbackBaseUrl) {
+  const slug = String(screen && screen.slug || '').trim();
+  if (!slug) {
+    return null;
+  }
+
+  const baseUrl = normalizePlayerBaseUrl(fallbackBaseUrl);
+  if (!baseUrl) {
+    return null;
+  }
+
+  return `${baseUrl}/screen/${encodeURIComponent(slug)}`;
+}
+
+async function fetchScreenPlayerUrls(pool) {
+  const playerBaseUrl = await fetchPlayerPublicBaseUrl(pool);
+  if (!playerBaseUrl) {
+    return {};
+  }
+
+  const [rows] = await pool.query(`
+    SELECT slug
+    FROM d_screens
+    ORDER BY slug ASC
+  `);
+
+  const playerUrls = {};
+  rows.forEach(function (row) {
+    const slug = String(row && row.slug || '').trim();
+    const playerUrl = buildScreenPlayerUrl({ slug: slug }, playerBaseUrl);
+    if (slug && playerUrl && !playerUrls[slug]) {
+      playerUrls[slug] = playerUrl;
+    }
+  });
+
+  return playerUrls;
+}
+
+async function fetchPlayerPublicBaseUrl(pool) {
+  const configuredPlayerIdentifier = getConfiguredPlayerIdentifier();
+  const [rows] = await pool.query(`
+    SELECT public_base_url
+    FROM d_players
+    WHERE identifier = ?
+    LIMIT 1
+  `, [configuredPlayerIdentifier]);
+
+  return normalizePlayerBaseUrl(rows[0] && rows[0].public_base_url) || null;
+}
+
+async function fetchScreenPlayerRecord(pool, slug) {
+  if (slug) {
+    const [rows] = await pool.query(
+      `SELECT slug
+       FROM d_screens
+       WHERE slug = ?
+       LIMIT 1`,
+      [slug]
+    );
+    if (!rows.length) {
+      return null;
+    }
+  }
+
+  return fetchPlayerRecordByIdentifier(pool, getConfiguredPlayerIdentifier());
+}
+
 async function uniqueScreenSlug(pool, baseSlug, excludeId) {
   const start = baseSlug || `screen-${Date.now()}`;
   let candidate = start;
   let counter = 2;
   while (true) {
     const params = [candidate];
-    let sql = 'SELECT id FROM screens WHERE slug = ?';
+    let sql = 'SELECT id FROM d_screens WHERE slug = ?';
     if (excludeId !== undefined && excludeId !== null) {
       sql += ' AND id <> ?';
       params.push(excludeId);
@@ -30,20 +124,27 @@ async function uniqueScreenSlug(pool, baseSlug, excludeId) {
 async function fetchScreenById(pool, id) {
   const [rows] = await pool.query(`
     SELECT s.id, s.name, s.slug, s.playlist_id, s.created_at, s.modified_at, s.created_by, s.modified_by, p.name AS playlist_name
-    FROM screens s
-    LEFT JOIN playlists p ON p.id = s.playlist_id
+    FROM d_screens s
+    LEFT JOIN c_playlists p ON p.id = s.playlist_id
     WHERE s.id = ?
   `, [id]);
   return rows[0] || null;
 }
 
 async function fetchScreenEditData(pool) {
-  const [playlists] = await pool.query('SELECT id, name, fade_between_slides, created_at, modified_at, created_by, modified_by FROM playlists ORDER BY id DESC');
+  const [playlists] = await pool.query('SELECT id, name, fade_between_slides, skip_unavailable_rtmp, created_at, modified_at, created_by, modified_by FROM c_playlists ORDER BY id DESC');
   return { playlists };
 }
 
 module.exports = {
   slugify,
+  normalizePlayerBaseUrl,
+  getConfiguredPlayerIdentifier,
+  fetchPlayerRecordByIdentifier,
+  buildScreenPlayerUrl,
+  fetchScreenPlayerUrls,
+  fetchPlayerPublicBaseUrl,
+  fetchScreenPlayerRecord,
   uniqueScreenSlug,
   fetchScreenById,
   fetchScreenEditData

src/data/slides.js

@@ -1,37 +1,116 @@
+// Slide data access helpers, including rich-text normalization and payload building.
+
 const { fetchTemplateById } = require('./templates');
-const { parseJsonSafe } = require('./utils');
+const { parseJsonSafe, validateMaxLength } = require('./utils');
+
+const TITLE_MAX_LENGTH = 255;
+const { buildQrCodeContent } = require('./qr-code');
 
-const ALLOWED_RICH_TEXT_TAGS = ['b', 'strong', 'i', 'em', 'u', 'br', 'p', 'div', 'ul', 'ol', 'li'];
 const DEFAULT_FONT_SIZE = 32;
 
+const ALLOWED_RICH_TEXT_TAGS = ['a', 'b', 'blockquote', 'br', 'code', 'div', 'em', 'figure', 'figcaption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'i', 'img', 'li', 'ol', 'p', 'pre', 'span', 'strong', 'sub', 'sup', 'table', 'tbody', 'td', 'th', 'thead', 'tr', 'u', 'ul'];
+
+function sanitizeRichTextAttributes(tagName, attrText) {
+  const allowedAttributes = {
+    a: ['href', 'title', 'target', 'rel', 'class', 'style'],
+    blockquote: ['class', 'style'],
+    div: ['class', 'style'],
+    figure: ['class', 'style'],
+    figcaption: ['class', 'style'],
+    h1: ['class', 'style'],
+    h2: ['class', 'style'],
+    h3: ['class', 'style'],
+    h4: ['class', 'style'],
+    h5: ['class', 'style'],
+    h6: ['class', 'style'],
+    img: ['src', 'alt', 'title', 'width', 'height', 'class', 'style', 'loading', 'decoding'],
+    li: ['class', 'style'],
+    ol: ['class', 'style', 'start'],
+    p: ['class', 'style'],
+    pre: ['class', 'style'],
+    span: ['class', 'style'],
+    table: ['class', 'style'],
+    td: ['class', 'style', 'colspan', 'rowspan'],
+    th: ['class', 'style', 'colspan', 'rowspan', 'scope'],
+    tr: ['class', 'style'],
+    ul: ['class', 'style']
+  };
+  const allowed = allowedAttributes[tagName] || [];
+  if (!allowed.length) {
+    return '';
+  }
+
+  const attrs = [];
+  String(attrText || '').replace(/([a-zA-Z0-9:-]+)(?:\s*=\s*("([^"]*)"|'([^']*)'|([^\s"'>/=`]+)))?/g, (_full, key, _valuePart, doubleQuoted, singleQuoted, bareValue) => {
+    const lowerKey = String(key || '').toLowerCase();
+    if (!allowed.includes(lowerKey)) {
+      return '';
+    }
+
+    const value = doubleQuoted !== undefined ? doubleQuoted : singleQuoted !== undefined ? singleQuoted : bareValue !== undefined ? bareValue : '';
+    if (lowerKey === 'href' && /^(?:\s*javascript:|\s*data:)/i.test(String(value || ''))) {
+      return '';
+    }
+    if (lowerKey === 'style' && /(?:expression\s*\(|javascript:|url\s*\()/i.test(String(value || ''))) {
+      return '';
+    }
+    if (lowerKey === 'target') {
+      const targetValue = String(value || '').trim();
+      if (targetValue === '_blank') {
+        attrs.push(' target="_blank"');
+        if (!attrs.includes(' rel="noreferrer noopener"')) {
+          attrs.push(' rel="noreferrer noopener"');
+        }
+        return '';
+      }
+    }
+    attrs.push(' ' + lowerKey + '="' + String(value || '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;') + '"');
+    return '';
+  });
+
+  return attrs.join('');
+}
+
 function sanitizeRichText(html) {
   let output = String(html || '');
   output = output.replace(/<script[\s\S]*?<\/script>/gi, '');
   output = output.replace(/<style[\s\S]*?<\/style>/gi, '');
   return output.replace(/<[^>]+>/g, (tag) => {
-    const match = tag.match(/^<\s*(\/?)\s*([a-z0-9]+)(?:\s[^>]*)?>$/i);
+    const match = tag.match(/^<\s*(\/?)\s*([a-z0-9]+)([\s\S]*?)(\/?)>$/i);
     if (!match) {
       return '';
     }
     const closing = Boolean(match[1]);
     const name = String(match[2] || '').toLowerCase();
+    const attrText = String(match[3] || '');
     if (!ALLOWED_RICH_TEXT_TAGS.includes(name)) {
       return '';
     }
-    if (name === 'br') {
-      return '<br>';
+    if (closing) {
+      return `</${name}>`;
     }
-    return closing ? `</${name}>` : `<${name}>`;
+    return `<${name}${sanitizeRichTextAttributes(name, attrText)}>`;
   });
 }
 
+function stripEditorOnlyMarkup(value) {
+  return String(value || '')
+    .replace(/<pre[^>]*class="[^"]*api-region-sample-preview[^"]*"[^>]*>[\s\S]*?<\/pre>/gi, '')
+    .replace(/<details[^>]*class="[^"]*api-region-sample-accordion[^"]*"[^>]*>[\s\S]*?<\/details>/gi, '')
+    .trim();
+}
+
+function normalizeEditorMarkup(value) {
+  return String(value === undefined || value === null ? '' : value).trim();
+}
+
 async function fetchSlideById(pool, id) {
   const [slides] = await pool.query(`
-    SELECT s.id, s.title, s.body, s.template_id, s.content_json, s.media_path, s.media_type, s.created_at, s.modified_at,
-           st.name AS template_name, cs.name AS canvas_size_name, cs.width AS canvas_width, cs.height AS canvas_height
-    FROM slides s
-    LEFT JOIN slide_templates st ON st.id = s.template_id
-    LEFT JOIN canvas_sizes cs ON cs.id = st.canvas_size_id
+    SELECT s.id, s.title, s.template_id, s.content_json, s.thumbnail_path, s.created_at, s.modified_at,
+           st.name AS template_name, st.canvas_size_id, cs.name AS canvas_size_name, cs.width AS canvas_width, cs.height AS canvas_height
+    FROM c_slides s
+    LEFT JOIN c_templates st ON st.id = s.template_id
+    LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
     WHERE s.id = ?
   `, [id]);
   if (!slides.length) {
@@ -53,6 +132,14 @@ function getFilesByField(files) {
   return map;
 }
 
+function getSubmittedValue(body, key, fallback) {
+  if (body && Object.prototype.hasOwnProperty.call(body, key)) {
+    return String(body[key] || '').trim();
+  }
+
+  return fallback;
+}
+
 function sanitizeTextColor(value, fallback) {
   const raw = String(value || '').trim();
   if (/^#[0-9a-fA-F]{6}$/.test(raw) || /^#[0-9a-fA-F]{3}$/.test(raw)) {
@@ -82,15 +169,150 @@ function getTextRegionStyle(body, region, existingContent) {
   };
 }
 
-function buildTemplateContent(template, body, filesByField, existingContent) {
+function getQrRegionStyle(body, region, existingContent) {
+  const existing = existingContent && existingContent[region.region_key] ? existingContent[region.region_key] : {};
+  const styleKeys = [
+    'qr_margin',
+    'qr_background_color',
+    'qr_background_transparent',
+    'qr_background_color_mode',
+    'qr_background_gradient_type',
+    'qr_background_gradient_rotation',
+    'qr_background_gradient_color_1',
+    'qr_background_gradient_color_2',
+    'qr_dots_color',
+    'qr_dots_type',
+    'qr_dots_color_mode',
+    'qr_dots_gradient_type',
+    'qr_dots_gradient_rotation',
+    'qr_dots_gradient_color_1',
+    'qr_dots_gradient_color_2',
+    'qr_corners_square_color',
+    'qr_corners_square_type',
+    'qr_corners_square_color_mode',
+    'qr_corners_square_gradient_type',
+    'qr_corners_square_gradient_rotation',
+    'qr_corners_square_gradient_color_1',
+    'qr_corners_square_gradient_color_2',
+    'qr_corners_dot_color',
+    'qr_corners_dot_type',
+    'qr_corners_dot_color_mode',
+    'qr_corners_dot_gradient_type',
+    'qr_corners_dot_gradient_rotation',
+    'qr_corners_dot_gradient_color_1',
+    'qr_corners_dot_gradient_color_2',
+    'qr_image',
+    'qr_image_size',
+    'qr_image_margin',
+    'qr_image_hide_background_dots',
+    'qr_border_radius'
+  ];
+  const style = {};
+
+  styleKeys.forEach((key) => {
+    const fieldNames = [`region_${key}_${region.id}`, `${key}_${region.id}`];
+    let fieldName = fieldNames[0];
+    let hasSubmittedValue = false;
+    let submitted;
+
+    for (let index = 0; index < fieldNames.length; index += 1) {
+      const candidate = fieldNames[index];
+      if (Object.prototype.hasOwnProperty.call(body || {}, candidate)) {
+        fieldName = candidate;
+        hasSubmittedValue = true;
+        submitted = body[candidate];
+        break;
+      }
+    }
+
+    const value = String(submitted || '').trim();
+
+    if (key === 'qr_background_transparent' || key === 'qr_image_hide_background_dots') {
+      style[key] = hasSubmittedValue;
+      return;
+    }
+
+    if (key === 'qr_background_color_mode' || key === 'qr_dots_color_mode' || key === 'qr_corners_square_color_mode' || key === 'qr_corners_dot_color_mode' || key === 'qr_background_gradient_type' || key === 'qr_dots_gradient_type' || key === 'qr_corners_square_gradient_type' || key === 'qr_corners_dot_gradient_type') {
+      style[key] = value === 'none' ? 'none' : value;
+      return;
+    }
+
+    if (key === 'qr_image') {
+      style[key] = value;
+      return;
+    }
+
+    if (submitted === undefined) {
+      if (existing[key] !== undefined && existing[key] !== null && String(existing[key]).trim() !== '') {
+        style[key] = existing[key];
+      }
+      return;
+    }
+
+    if (value !== '') {
+      if (key === 'qr_margin') {
+        const parsedMargin = Number(value);
+        if (Number.isFinite(parsedMargin)) {
+          style[key] = Math.max(0, Math.round(parsedMargin));
+        }
+        return;
+      }
+
+      if (key === 'qr_image_size') {
+        const parsedSize = Number(value);
+        if (Number.isFinite(parsedSize)) {
+          style[key] = Math.max(0, Math.min(1, parsedSize));
+        }
+        return;
+      }
+
+      if (key === 'qr_image_margin' || key === 'qr_border_radius') {
+        const parsedImageMargin = Number(value);
+        if (Number.isFinite(parsedImageMargin)) {
+          style[key] = Math.max(0, Math.round(parsedImageMargin));
+        }
+        return;
+      }
+
+      style[key] = value;
+    }
+  });
+
+  return style;
+}
+
+async function getRssFeedItemCount(pool, feedId) {
+  const [rows] = await pool.query(
+    'SELECT COUNT(*) AS count FROM i_rss_feed_items WHERE rss_feed_id = ?',
+    [feedId]
+  );
+
+  return Number(rows && rows[0] && rows[0].count) || 0;
+}
+
+async function buildTemplateContent(pool, template, body, filesByField, existingContent) {
   const content = {};
-  template.regions.forEach((region) => {
+  for (const region of template.regions) {
     if (region.region_type === 'image') {
       const uploaded = filesByField[`region_image_${region.id}`];
       const existing = body[`existing_region_image_${region.id}`];
+      const current = existingContent && existingContent[region.region_key] ? existingContent[region.region_key].value : '';
       content[region.region_key] = {
         type: 'image',
-        value: uploaded ? `/media/${uploaded.filename}` : String(existing || '').trim() || ((existingContent && existingContent[region.region_key]) ? existingContent[region.region_key].value : '')
+        value: uploaded ? `/media/uploads/${uploaded.filename}` : getSubmittedValue(body, `existing_region_image_${region.id}`, current)
+      };
+    } else if (region.region_type === 'video') {
+      const uploaded = filesByField[`region_video_${region.id}`];
+      const existing = body[`existing_region_video_${region.id}`];
+      const durationValue = body[`existing_region_video_duration_${region.id}`];
+      const existingDuration = existingContent && existingContent[region.region_key] ? Number(existingContent[region.region_key].duration_seconds || 0) : 0;
+      const parsedDuration = Number(durationValue || existingDuration || 0);
+      const normalizedDuration = Math.round(parsedDuration * 1000) / 1000;
+      const current = existingContent && existingContent[region.region_key] ? existingContent[region.region_key].value : '';
+      content[region.region_key] = {
+        type: 'video',
+        value: uploaded ? `/media/uploads/${uploaded.filename}` : getSubmittedValue(body, `existing_region_video_${region.id}`, current),
+        duration_seconds: Number.isFinite(normalizedDuration) && normalizedDuration > 0 ? normalizedDuration : null
       };
     } else if (region.region_type === 'webpage') {
       const submitted = body[`region_webpage_${region.id}`];
@@ -99,6 +321,24 @@ function buildTemplateContent(template, body, filesByField, existingContent) {
         type: 'webpage',
         value: submitted === undefined ? current : String(submitted || '').trim()
       };
+    } else if (region.region_type === 'qr-code') {
+      const uploadedImage = filesByField[`region_qr_image_${region.id}`];
+      const submitted = body[`region_qr_code_${region.id}`];
+      const submittedSvg = body[`region_qr_svg_${region.id}`];
+      const submittedPreview = body[`region_qr_preview_${region.id}`];
+      const existingImage = body[`existing_region_qr_image_${region.id}`];
+      const current = existingContent && existingContent[region.region_key] ? existingContent[region.region_key] : {};
+      const nextValue = submitted === undefined ? String(current.value !== undefined ? current.value : current.qr_code || '').trim() : String(submitted || '').trim();
+      const qrStyle = getQrRegionStyle(body, region, existingContent);
+      delete qrStyle.qr_image;
+      content[region.region_key] = {
+        type: 'qr-code',
+        value: nextValue,
+        qr_svg: submittedSvg === undefined ? String(current.qr_svg || '').trim() : String(submittedSvg || '').trim(),
+        qr_preview: submittedPreview === undefined ? String(current.qr_preview || '').trim() : String(submittedPreview || '').trim(),
+        qr_image: uploadedImage ? `/media/uploads/${uploadedImage.filename}` : String(existingImage === undefined ? String(current.qr_image || '').trim() : String(existingImage || '').trim()),
+        ...qrStyle
+      };
     } else if (region.region_type === 'rtmp') {
       const submitted = body[`region_rtmp_${region.id}`];
       const current = existingContent && existingContent[region.region_key] ? existingContent[region.region_key] : {};
@@ -114,6 +354,58 @@ function buildTemplateContent(template, body, filesByField, existingContent) {
         type: 'html',
         value: submitted === undefined ? current : String(submitted || '')
       };
+    } else if (region.region_type === 'time-date') {
+      const submitted = body[`region_text_${region.id}`];
+      const current = existingContent && existingContent[region.region_key] ? existingContent[region.region_key] : {};
+      const timezoneValue = body[`region_timezone_${region.id}`];
+      content[region.region_key] = {
+        type: 'time-date',
+        value: submitted === undefined ? String(current.value !== undefined ? current.value : current.text !== undefined ? current.text : '') : String(submitted || ''),
+        timezone: timezoneValue === undefined || timezoneValue === null ? String(current.timezone || current.time_zone || '') : String(timezoneValue || '').trim()
+      };
+    } else if (region.region_type === 'timetable') {
+      const current = existingContent && existingContent[region.region_key] && typeof existingContent[region.region_key] === 'object' ? existingContent[region.region_key] : {};
+      const suffix = '_' + region.id;
+      const generic = {};
+      const submittedText = body[`region_text_${region.id}`];
+      const normalizedText = submittedText === undefined ? String(current.text !== undefined ? current.text : current.value !== undefined ? current.value : '') : String(submittedText || '');
+
+      Object.keys(body || {}).forEach((key) => {
+        if (!key.startsWith('region_') || !key.endsWith(suffix)) {
+          return;
+        }
+
+        const field = key.slice('region_'.length, -suffix.length);
+        if (!field || field === 'type' || field === 'key' || field === 'name' || field === 'label') {
+          return;
+        }
+
+        generic[field] = body[key];
+      });
+
+      if (Object.prototype.hasOwnProperty.call(generic, 'timetable_display_mode')) {
+        generic.display_mode = generic.timetable_display_mode;
+        delete generic.timetable_display_mode;
+      }
+
+      if (Object.prototype.hasOwnProperty.call(generic, 'timetable_max_items')) {
+        generic.max_items = generic.timetable_max_items;
+        delete generic.timetable_max_items;
+      }
+
+      Object.keys(current).forEach((key) => {
+        if (generic[key] === undefined) {
+          generic[key] = current[key];
+        }
+      });
+
+      delete generic.timetable_display_mode;
+      delete generic.timetable_max_items;
+
+      generic.text = normalizedText;
+      generic.value = normalizedText;
+      generic.type = region.region_type;
+      content[region.region_key] = generic;
     } else if (region.region_type === 'rss') {
       const submitted = body[`region_text_${region.id}`];
       const current = existingContent && existingContent[region.region_key] ? existingContent[region.region_key] : {};
@@ -121,11 +413,13 @@ function buildTemplateContent(template, body, filesByField, existingContent) {
       const feedId = body[`region_rss_feed_id_${region.id}`];
       const itemNumber = body[`region_rss_item_number_${region.id}`];
       const parsedItemNumber = Math.max(1, Number(itemNumber || current.item_number || 1));
+      const normalizedFeedId = feedId === undefined || feedId === null || feedId === '' ? Number(current.feed_id || 0) : Number(feedId);
+      const itemCount = normalizedFeedId > 0 ? Math.max(1, await getRssFeedItemCount(pool, normalizedFeedId) || 1) : 1;
       content[region.region_key] = {
         type: 'rss',
-        value: submitted === undefined ? String(current.value || '') : String(submitted || ''),
-        feed_id: feedId === undefined || feedId === null || feedId === '' ? (current.feed_id || null) : Number(feedId),
-        item_number: Number.isFinite(parsedItemNumber) && parsedItemNumber > 0 ? parsedItemNumber : 1,
+        value: stripEditorOnlyMarkup(normalizeEditorMarkup(submitted === undefined ? String(current.value || '') : String(submitted || ''))),
+        feed_id: feedId === undefined || feedId === null ? (current.feed_id || null) : (feedId === '' ? null : Number(feedId)),
+        item_number: Math.min(itemCount, Number.isFinite(parsedItemNumber) && parsedItemNumber > 0 ? parsedItemNumber : 1),
         variable_name: 'item',
         font_family: style.font_family,
         font_size: style.font_size,
@@ -137,35 +431,72 @@ function buildTemplateContent(template, body, filesByField, existingContent) {
       const style = getTextRegionStyle(body, region, existingContent);
       const sourceId = body[`region_api_source_id_${region.id}`];
       const itemNumber = body[`region_api_item_number_${region.id}`];
+      const itemsPath = body[`region_api_items_path_${region.id}`];
       const parsedItemNumber = Math.max(1, Number(itemNumber || current.item_number || 1));
       content[region.region_key] = {
         type: 'api',
-        value: submitted === undefined ? String(current.value || '') : String(submitted || ''),
-        source_id: sourceId === undefined || sourceId === null || sourceId === '' ? (current.source_id || null) : Number(sourceId),
+        value: stripEditorOnlyMarkup(normalizeEditorMarkup(submitted === undefined ? String(current.value || '') : String(submitted || ''))),
+        source_id: sourceId === undefined || sourceId === null ? (current.source_id || null) : (sourceId === '' ? null : Number(sourceId)),
         item_number: Number.isFinite(parsedItemNumber) && parsedItemNumber > 0 ? parsedItemNumber : 1,
+        items_path: itemsPath === undefined || itemsPath === null ? (current.items_path === undefined || current.items_path === null ? '' : String(current.items_path)) : String(itemsPath || '').trim(),
         variable_name: 'item',
         font_family: style.font_family,
         font_size: style.font_size,
         font_color: style.font_color
       };
+    } else if (!['text', 'image', 'video', 'webpage', 'qr-code', 'html', 'rtmp', 'rss', 'api'].includes(String(region.region_type || '').trim())) {
+      const current = existingContent && existingContent[region.region_key] && typeof existingContent[region.region_key] === 'object' ? existingContent[region.region_key] : {};
+      const suffix = '_' + region.id;
+      const generic = {};
+
+      Object.keys(body || {}).forEach((key) => {
+        if (!key.startsWith('region_') || !key.endsWith(suffix)) {
+          return;
+        }
+        const field = key.slice('region_'.length, -suffix.length);
+        if (!field || field === 'type' || field === 'key' || field === 'name' || field === 'label') {
+          return;
+        }
+        generic[field] = body[key];
+      });
+
+      Object.keys(filesByField || {}).forEach((fieldName) => {
+        if (!fieldName.startsWith('region_') || !fieldName.endsWith(suffix)) {
+          return;
+        }
+        const field = fieldName.slice('region_'.length, -suffix.length);
+        if (!field) {
+          return;
+        }
+        generic[field] = `/media/uploads/${filesByField[fieldName].filename}`;
+      });
+
+      Object.keys(current).forEach((key) => {
+        if (generic[key] === undefined) {
+          generic[key] = current[key];
+        }
+      });
+
+      generic.type = region.region_type;
+      content[region.region_key] = generic;
     } else {
       const submitted = body[`region_text_${region.id}`];
       const current = existingContent && existingContent[region.region_key] ? existingContent[region.region_key].value : '';
       const style = getTextRegionStyle(body, region, existingContent);
       content[region.region_key] = {
         type: 'text',
-        value: submitted === undefined ? current : String(submitted),
+        value: sanitizeRichText(stripEditorOnlyMarkup(normalizeEditorMarkup(submitted === undefined ? current : String(submitted || '')))),
         font_family: style.font_family,
         font_size: style.font_size,
         font_color: style.font_color
       };
     }
-  });
+  }
   return content;
 }
 
 async function buildSlidePayload(pool, req, existingSlide) {
-  const title = String(req.body.title || '').trim();
+  const title = validateMaxLength(req.body.title || '', TITLE_MAX_LENGTH, 'Slide title');
   const templateId = req.body.template_id ? Number(req.body.template_id) : null;
   const filesByField = getFilesByField(req.files || []);
   const template = templateId ? await fetchTemplateById(pool, templateId) : null;
@@ -184,23 +515,29 @@ async function buildSlidePayload(pool, req, existingSlide) {
   }
 
   if (template) {
+    const content = await buildTemplateContent(pool, template, req.body, filesByField, existingContent);
+    await Promise.all(Object.keys(content).map(async function (regionKey) {
+      const region = template.regions.find(function (item) {
+        return String(item.region_key || '').trim() === regionKey;
+      });
+      if (!region || region.region_type !== 'qr-code') {
+        return;
+      }
+
+      content[regionKey] = await buildQrCodeContent(content[regionKey]);
+    }));
+
     return {
       title,
-      body: existingSlide ? existingSlide.body : null,
       templateId: template.id,
-      contentJson: JSON.stringify(buildTemplateContent(template, req.body, filesByField, existingContent)),
-      mediaPath: null,
-      mediaType: null
+      contentJson: JSON.stringify(content)
     };
   }
 
   return {
     title,
-    body: existingSlide ? existingSlide.body : null,
     templateId: null,
-    contentJson: existingSlide ? existingSlide.content_json : null,
-    mediaPath: existingSlide ? existingSlide.media_path : null,
-    mediaType: existingSlide ? existingSlide.media_type : null
+    contentJson: existingSlide ? existingSlide.content_json : null
   };
 }
 

src/data/templates.js

@@ -1,7 +1,10 @@
-const { parseJsonSafe, readFormArray } = require('./utils');
+// Template data access helpers and region normalization logic.
 
-const ALLOWED_TEMPLATE_REGION_TYPES = ['text', 'image', 'webpage', 'html', 'rtmp', 'rss', 'api'];
-const FONT_FAMILY_REGION_TYPES = ['text', 'html', 'rss', 'api'];
+const { parseJsonSafe, readFormArray, validateMaxLength } = require('./utils');
+const animationPresets = require('../web/public/js/templates/animation-presets');
+
+const TEMPLATE_NAME_MAX_LENGTH = 255;
+const REGION_NAME_MAX_LENGTH = 255;
 
 function sanitizeBackgroundColor(value) {
   const raw = String(value || '').trim();
@@ -13,7 +16,7 @@ function sanitizeBackgroundColor(value) {
 
 function normalizeTemplateRegionType(value) {
   const rawType = String(value || 'text').trim();
-  return ALLOWED_TEMPLATE_REGION_TYPES.includes(rawType) ? rawType : 'text';
+  return rawType || 'text';
 }
 
 function normalizeTemplateRegionLockRatio(value) {
@@ -24,6 +27,61 @@ function normalizeTemplateRegionLockRatio(value) {
   return rawRatio.replace(/\s+/g, '');
 }
 
+function normalizeTemplateRegionAnimation(value) {
+  if (animationPresets && typeof animationPresets.normalize === 'function') {
+    return animationPresets.normalize(value);
+  }
+
+  const allowed = new Set(
+    Array.isArray(animationPresets && animationPresets.allValues) && animationPresets.allValues.length
+      ? animationPresets.allValues
+      : ['none', 'fadeIn', 'fadeInDown', 'fadeInLeft', 'fadeInRight', 'fadeInUp', 'zoomIn', 'zoomInDown', 'zoomInLeft', 'zoomInRight', 'zoomInUp', 'slideInDown', 'slideInLeft', 'slideInRight', 'slideInUp', 'fadeOut', 'fadeOutDown', 'fadeOutLeft', 'fadeOutRight', 'fadeOutUp', 'zoomOut', 'zoomOutDown', 'zoomOutLeft', 'zoomOutRight', 'zoomOutUp', 'slideOutDown', 'slideOutLeft', 'slideOutRight', 'slideOutUp', 'backInDown', 'backInLeft', 'backInRight', 'backInUp', 'backOutDown', 'backOutLeft', 'backOutRight', 'backOutUp', 'bounceIn', 'bounceInDown', 'bounceInLeft', 'bounceInRight', 'bounceInUp', 'bounceOut', 'bounceOutDown', 'bounceOutLeft', 'bounceOutRight', 'bounceOutUp', 'flip', 'flipInX', 'flipInY', 'flipOutX', 'flipOutY', 'lightSpeedInLeft', 'lightSpeedInRight', 'lightSpeedOutLeft', 'lightSpeedOutRight', 'rotateIn', 'rotateInDownLeft', 'rotateInDownRight', 'rotateInUpLeft', 'rotateInUpRight', 'rotateOut', 'rotateOutDownLeft', 'rotateOutDownRight', 'rotateOutUpLeft', 'rotateOutUpRight', 'hinge', 'jackInTheBox', 'rollIn', 'rollOut', 'flash', 'pulse', 'rubberBand', 'shakeX', 'shakeY', 'headShake', 'swing', 'tada', 'wobble', 'jello', 'heartBeat', 'bounce']
+  );
+  const raw = String(value || '').trim().toLowerCase();
+  return allowed.has(raw) ? raw : 'none';
+}
+
+function normalizeTemplateRegionAnimationStep(value, fallbackPreset) {
+  if (value && typeof value === 'object' && !Array.isArray(value)) {
+    const normalized = {};
+    Object.keys(value).forEach((key) => {
+      normalized[key] = value[key];
+    });
+    normalized.preset = normalizeTemplateRegionAnimation(value.preset !== undefined ? value.preset : fallbackPreset || 'none');
+    return normalized;
+  }
+
+  return {
+    preset: normalizeTemplateRegionAnimation(typeof value === 'string' ? value : fallbackPreset || 'none')
+  };
+}
+
+function normalizeTemplateRegionAnimationConfig(value) {
+  let raw = value;
+  if (typeof raw === 'string') {
+    const 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: normalizeTemplateRegionAnimationStep(raw.intro, 'none'),
+    outro: normalizeTemplateRegionAnimationStep(raw.outro !== undefined ? raw.outro : raw.out, 'none'),
+    loop: normalizeTemplateRegionAnimationStep(raw.loop, 'none')
+  };
+}
+
 function normalizeTemplateRegionName(value) {
   return String(value || '').trim();
 }
@@ -50,15 +108,15 @@ async function fetchTemplateById(pool, id) {
   const [templates] = await pool.query(`
     SELECT st.id, st.name, st.canvas_size_id, st.background_image_path, st.background_color, st.created_at, st.modified_at,
            cs.name AS canvas_size_name, cs.width AS canvas_size_width, cs.height AS canvas_size_height
-    FROM slide_templates st
-    LEFT JOIN canvas_sizes cs ON cs.id = st.canvas_size_id
+    FROM c_templates st
+    LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
     WHERE st.id = ?
   `, [id]);
   if (!templates.length) {
     return null;
   }
   const template = templates[0];
-  const [regions] = await pool.query('SELECT id, template_id, region_key, region_type, label, font_family, lock_ratio, x, y, width, height, z_index, created_at, modified_at, created_by, modified_by FROM slide_template_regions WHERE template_id = ? ORDER BY z_index ASC, id ASC', [id]);
+  const [regions] = await pool.query('SELECT id, template_id, region_key, region_type, label, lock_ratio, animation_json, x, y, width, height, z_index, created_at, modified_at, created_by, modified_by FROM c_template_regions WHERE template_id = ? ORDER BY z_index ASC, id ASC', [id]);
   template.regions = regions;
   return template;
 }
@@ -67,11 +125,11 @@ async function fetchTemplatesData(pool) {
   const [templates] = await pool.query(`
     SELECT st.id, st.name, st.canvas_size_id, st.background_image_path, st.background_color, st.created_at, st.modified_at,
            cs.name AS canvas_size_name, cs.width AS canvas_size_width, cs.height AS canvas_size_height
-    FROM slide_templates st
-    LEFT JOIN canvas_sizes cs ON cs.id = st.canvas_size_id
+    FROM c_templates st
+    LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
     ORDER BY st.id DESC
   `);
-  const [templateRegions] = await pool.query('SELECT id, template_id, region_key, region_type, label, font_family, lock_ratio, x, y, width, height, z_index, created_at, modified_at, created_by, modified_by FROM slide_template_regions ORDER BY template_id ASC, z_index ASC, id ASC');
+  const [templateRegions] = await pool.query('SELECT id, template_id, region_key, region_type, label, lock_ratio, animation_json, x, y, width, height, z_index, created_at, modified_at, created_by, modified_by FROM c_template_regions ORDER BY template_id ASC, z_index ASC, id ASC');
   return { templates, templateRegions };
 }
 
@@ -82,12 +140,13 @@ function extractTemplateRegions(body) {
     if (Array.isArray(parsed)) {
       return parsed.map((region) => {
         const regionType = normalizeTemplateRegionType(region.region_type);
+        const regionName = validateMaxLength(region.region_name || region.region_key || region.label || '', REGION_NAME_MAX_LENGTH, 'Region name');
         return {
-          region_key: String(region.region_name || region.region_key || region.label || '').trim(),
+          region_key: regionName,
           region_type: regionType,
-          label: String(region.region_name || region.label || region.region_key || '').trim(),
-          font_family: FONT_FAMILY_REGION_TYPES.includes(regionType) ? String(region.font_family || '').trim() || null : null,
+          label: regionName,
           lock_ratio: normalizeTemplateRegionLockRatio(region.lock_ratio),
+          animation_json: normalizeTemplateRegionAnimationConfig(region.animation_json),
           x: Number(region.x || 0),
           y: Number(region.y || 0),
           width: Number(region.width || 100),
@@ -103,16 +162,16 @@ function extractTemplateRegions(body) {
   const labels = readFormArray(body, 'region_label[]');
   const types = readFormArray(body, 'region_type[]');
   const ratios = readFormArray(body, 'region_lock_ratio[]');
+  const animationJsons = readFormArray(body, 'region_animation_json[]');
   const xs = readFormArray(body, 'region_x[]');
   const ys = readFormArray(body, 'region_y[]');
   const widths = readFormArray(body, 'region_width[]');
   const heights = readFormArray(body, 'region_height[]');
   const zs = readFormArray(body, 'region_z[]');
-  const fonts = readFormArray(body, 'font_family[]');
   const regions = [];
 
   for (let i = 0; i < keys.length; i += 1) {
-    const name = String(names[i] || keys[i] || labels[i] || '').trim();
+    const name = validateMaxLength(names[i] || keys[i] || labels[i] || '', REGION_NAME_MAX_LENGTH, 'Region name');
     const rawType = String(types[i] || 'text').trim();
     const regionType = normalizeTemplateRegionType(rawType);
     if (!name) {
@@ -122,8 +181,8 @@ function extractTemplateRegions(body) {
       region_key: name,
       region_type: regionType,
       label: name,
-      font_family: FONT_FAMILY_REGION_TYPES.includes(regionType) ? String(fonts[i] || 'Arial').trim() || 'Arial' : null,
       lock_ratio: normalizeTemplateRegionLockRatio(ratios[i]),
+      animation_json: normalizeTemplateRegionAnimationConfig(animationJsons[i]),
       x: Number(xs[i] || 0),
       y: Number(ys[i] || 0),
       width: Number(widths[i] || 100),
@@ -144,7 +203,7 @@ function getFilesByField(files) {
 }
 
 async function buildTemplatePayload(pool, req, existingTemplate) {
-  const name = String(req.body.name || '').trim();
+  const name = validateMaxLength(req.body.name || '', TEMPLATE_NAME_MAX_LENGTH, 'Template name');
   const canvasSizeId = req.body.canvas_size_id ? Number(req.body.canvas_size_id) : null;
   let canvasWidth = Math.max(1, Number((existingTemplate && existingTemplate.canvas_size_width) || 1920));
   let canvasHeight = Math.max(1, Number((existingTemplate && existingTemplate.canvas_size_height) || 1080));
@@ -154,7 +213,7 @@ async function buildTemplatePayload(pool, req, existingTemplate) {
   const removeBackgroundImage = Boolean(req.body.remove_background_image);
   const backgroundColor = sanitizeBackgroundColor(req.body.background_color || (existingTemplate && existingTemplate.background_color));
   const backgroundImagePath = backgroundImage
-    ? `/media/${backgroundImage.filename}`
+    ? `/media/uploads/${backgroundImage.filename}`
     : removeBackgroundImage
       ? null
       : String(req.body.existing_background_image_path || (existingTemplate && existingTemplate.background_image_path) || '').trim() || null;
@@ -167,7 +226,7 @@ async function buildTemplatePayload(pool, req, existingTemplate) {
 
   let resolvedCanvasSizeId = canvasSizeId;
   if (resolvedCanvasSizeId) {
-    const [canvasSizes] = await pool.query('SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM canvas_sizes WHERE id = ?', [resolvedCanvasSizeId]);
+    const [canvasSizes] = await pool.query('SELECT id, name, width, height, created_at, modified_at, created_by, modified_by FROM c_canvas_sizes WHERE id = ?', [resolvedCanvasSizeId]);
     const canvasSize = canvasSizes[0];
     if (!canvasSize) {
       const error = new Error('Canvas size not found.');

src/data/timetables.js

@@ -0,0 +1,144 @@
+// Timetable group and entry data access helpers.
+
+const { fetchPagedRows, validateMaxLength } = require('./utils');
+
+const NAME_MAX_LENGTH = 255;
+const DESCRIPTION_MAX_LENGTH = 255;
+const DEFAULT_TIME_ZONE = 'Europe/London';
+
+function normalizeTimeZone(value, fallback) {
+  const raw = String(value || '').trim();
+  if (!raw) {
+    return String(fallback || DEFAULT_TIME_ZONE).trim() || DEFAULT_TIME_ZONE;
+  }
+
+  try {
+    new Intl.DateTimeFormat('en-GB', { timeZone: raw }).format(new Date());
+    return raw;
+  } catch (_error) {
+    const error = new Error('Timetable time zone is invalid.');
+    error.statusCode = 400;
+    throw error;
+  }
+}
+
+function normalizeDisplayMode(value) {
+  const mode = String(value || 'upcoming').trim().toLowerCase();
+  if (mode === 'current' || mode === 'both') {
+    return mode;
+  }
+  return 'upcoming';
+}
+
+async function fetchTimetablesData(pool) {
+  const [timetableGroups] = await pool.query(`
+    SELECT g.id, g.name, g.short_description, g.timezone, g.created_at, g.modified_at, g.created_by, g.modified_by,
+           (SELECT COUNT(*) FROM i_timetable_entries e WHERE e.schedule_group_id = g.id) AS entry_count,
+           (SELECT MIN(e.start_datetime) FROM i_timetable_entries e WHERE e.schedule_group_id = g.id AND e.start_datetime IS NOT NULL) AS next_start_datetime
+    FROM i_timetable_groups g
+    ORDER BY g.modified_at DESC, g.id DESC
+  `);
+  const [timetableEntries] = await pool.query(`
+    SELECT id, schedule_group_id, title, short_description, start_datetime, end_datetime, created_at, modified_at, created_by, modified_by
+    FROM i_timetable_entries
+    ORDER BY schedule_group_id ASC, start_datetime ASC, id ASC
+  `);
+
+  const entriesByGroupId = new Map();
+  timetableEntries.forEach(function (entry) {
+    const groupId = Number(entry.schedule_group_id);
+    if (!entriesByGroupId.has(groupId)) {
+      entriesByGroupId.set(groupId, []);
+    }
+    entriesByGroupId.get(groupId).push(entry);
+  });
+
+  const groups = timetableGroups.map(function (group) {
+    return Object.assign({}, group, {
+      entries: entriesByGroupId.get(Number(group.id)) || []
+    });
+  });
+
+  return {
+    timetableGroups: groups,
+    timetableEntries: timetableEntries
+  };
+}
+
+async function fetchTimetableGroupsPage(pool, page, pageSize, searchTerm, sortKey, sortDirection) {
+  const paged = await fetchPagedRows(pool, {
+    selectSql: `SELECT g.id, g.name, g.short_description, g.timezone, g.created_at, g.modified_at, g.created_by, g.modified_by,
+        (SELECT COUNT(*) FROM i_timetable_entries e WHERE e.schedule_group_id = g.id) AS entry_count,
+        (SELECT MIN(e.start_datetime) FROM i_timetable_entries e WHERE e.schedule_group_id = g.id AND e.start_datetime IS NOT NULL) AS next_start_datetime
+      FROM i_timetable_groups g
+    ORDER BY g.modified_at DESC, g.id DESC`,
+      countSql: 'SELECT COUNT(*) AS count FROM i_timetable_groups',
+    searchColumns: ['g.name', 'g.short_description'],
+    searchTerm: searchTerm,
+    sortColumns: {
+      name: 'g.name',
+      description: 'g.short_description',
+      timezone: 'g.timezone',
+      entries: 'entry_count',
+      next_start: 'next_start_datetime',
+      created: 'g.created_at',
+      modified: 'g.modified_at'
+    },
+    sortKey: sortKey,
+    sortDirection: sortDirection,
+    page: page,
+    pageSize: pageSize
+  });
+
+  return Object.assign({ timetableGroups: paged.rows }, paged);
+}
+
+async function fetchTimetableGroupById(pool, id) {
+  const [rows] = await pool.query(
+    'SELECT id, name, short_description, timezone, created_at, modified_at, created_by, modified_by FROM i_timetable_groups WHERE id = ?',
+    [id]
+  );
+
+  return rows[0] || null;
+}
+
+async function fetchTimetableEntriesByGroupId(pool, timetableGroupId) {
+  const [rows] = await pool.query(
+    `SELECT id, schedule_group_id, title, short_description, start_datetime, end_datetime, created_at, modified_at, created_by, modified_by
+     FROM i_timetable_entries
+     WHERE schedule_group_id = ?
+     ORDER BY start_datetime ASC, id ASC`,
+    [timetableGroupId]
+  );
+
+  return rows;
+}
+
+function buildTimetableGroupPayload(req, existingTimetableGroup) {
+  const fallback = existingTimetableGroup || {};
+  const name = validateMaxLength(req.body.name || fallback.name || '', NAME_MAX_LENGTH, 'Timetable group name');
+  const shortDescription = validateMaxLength(req.body.short_description || req.body.shortDescription || fallback.short_description || '', DESCRIPTION_MAX_LENGTH, 'Timetable group description');
+  const timezone = normalizeTimeZone(req.body.timezone || req.body.time_zone || fallback.timezone || DEFAULT_TIME_ZONE, fallback.timezone || DEFAULT_TIME_ZONE);
+
+  if (!name) {
+    const error = new Error('Timetable group name is required.');
+    error.statusCode = 400;
+    throw error;
+  }
+
+  return {
+    name: name,
+    shortDescription: shortDescription,
+    timezone: timezone
+  };
+}
+
+module.exports = {
+  normalizeDisplayMode,
+  fetchTimetablesData,
+  fetchTimetableGroupsPage,
+  fetchTimetableGroupById,
+  fetchTimetableEntriesByGroupId,
+  buildTimetableGroupPayload,
+  normalizeTimeZone
+};

src/data/utils.js

@@ -1,3 +1,5 @@
+// Shared helpers for parsing JSON, reading form arrays, and duplicate-name checks.
+
 function parseJsonSafe(value) {
   if (!value) {
     return null;
@@ -22,6 +24,350 @@ function readFormArray(body, key) {
   return [body[key]];
 }
 
+function validateMaxLength(value, maxLength, fieldName) {
+  const text = String(value || '').trim();
+  const limit = Number(maxLength);
+  if (Number.isFinite(limit) && limit > 0 && text.length > limit) {
+    const error = new Error(fieldName + ' must be ' + limit + ' characters or fewer.');
+    error.statusCode = 400;
+    throw error;
+  }
+  return text;
+}
+
+function truncateToMaxLength(value, maxLength) {
+  const text = String(value || '').trim();
+  const limit = Number(maxLength);
+  if (!Number.isFinite(limit) || limit <= 0 || text.length <= limit) {
+    return text;
+  }
+  return text.slice(0, limit);
+}
+
+function normalizePageNumber(value) {
+  const pageNumber = Math.floor(Number(value) || 1);
+  return Math.max(1, pageNumber);
+}
+
+function escapeLikeValue(value) {
+  return String(value || '').replace(/[\\%_]/g, '\\$&');
+}
+
+function normalizeSortDirection(value) {
+  return String(value || '').trim().toLowerCase() === 'desc' ? 'desc' : 'asc';
+}
+
+function buildSortOrderClause(sortColumns, sortKey, sortDirection) {
+  const normalizedSortKey = String(sortKey || '').trim();
+  const normalizedSortDirection = normalizeSortDirection(sortDirection);
+  const sortColumnMap = sortColumns && typeof sortColumns === 'object' ? sortColumns : {};
+  const sortExpression = normalizedSortKey ? sortColumnMap[normalizedSortKey] : null;
+
+  if (!sortExpression) {
+    return {
+      clause: '',
+      sortKey: normalizedSortKey,
+      sortDirection: normalizedSortDirection
+    };
+  }
+
+  const expressions = Array.isArray(sortExpression) ? sortExpression : [sortExpression];
+  const orderBySql = expressions.map(function (expression) {
+    return `${expression} ${normalizedSortDirection.toUpperCase()}`;
+  }).join(', ');
+
+  return {
+    clause: ` ORDER BY ${orderBySql}`,
+    sortKey: normalizedSortKey,
+    sortDirection: normalizedSortDirection
+  };
+}
+
+function findTopLevelOrderByIndex(sql) {
+  const text = String(sql || '');
+  let depth = 0;
+  let inSingleQuote = false;
+  let inDoubleQuote = false;
+  let inBacktick = false;
+  let lastOrderByIndex = -1;
+
+  for (let index = 0; index < text.length; index += 1) {
+    const character = text[index];
+    const previousCharacter = index > 0 ? text[index - 1] : '';
+
+    if (inSingleQuote) {
+      if (character === '\'' && previousCharacter !== '\\') {
+        inSingleQuote = false;
+      }
+      continue;
+    }
+
+    if (inDoubleQuote) {
+      if (character === '"' && previousCharacter !== '\\') {
+        inDoubleQuote = false;
+      }
+      continue;
+    }
+
+    if (inBacktick) {
+      if (character === '`') {
+        inBacktick = false;
+      }
+      continue;
+    }
+
+    if (character === '\'') {
+      inSingleQuote = true;
+      continue;
+    }
+
+    if (character === '"') {
+      inDoubleQuote = true;
+      continue;
+    }
+
+    if (character === '`') {
+      inBacktick = true;
+      continue;
+    }
+
+    if (character === '(') {
+      depth += 1;
+      continue;
+    }
+
+    if (character === ')' && depth > 0) {
+      depth -= 1;
+      continue;
+    }
+
+    if (depth === 0 && /[oO]/.test(character)) {
+      const remaining = text.slice(index);
+      if (/^order\s+by\b/i.test(remaining)) {
+        lastOrderByIndex = index;
+      }
+    }
+  }
+
+  return lastOrderByIndex;
+}
+
+function findTopLevelWhereIndex(sql) {
+  const text = String(sql || '');
+  let depth = 0;
+  let inSingleQuote = false;
+  let inDoubleQuote = false;
+  let inBacktick = false;
+  let lastWhereIndex = -1;
+
+  for (let index = 0; index < text.length; index += 1) {
+    const character = text[index];
+    const previousCharacter = index > 0 ? text[index - 1] : '';
+
+    if (inSingleQuote) {
+      if (character === '\'' && previousCharacter !== '\\') {
+        inSingleQuote = false;
+      }
+      continue;
+    }
+
+    if (inDoubleQuote) {
+      if (character === '"' && previousCharacter !== '\\') {
+        inDoubleQuote = false;
+      }
+      continue;
+    }
+
+    if (inBacktick) {
+      if (character === '`') {
+        inBacktick = false;
+      }
+      continue;
+    }
+
+    if (character === '\'') {
+      inSingleQuote = true;
+      continue;
+    }
+
+    if (character === '"') {
+      inDoubleQuote = true;
+      continue;
+    }
+
+    if (character === '`') {
+      inBacktick = true;
+      continue;
+    }
+
+    if (character === '(') {
+      depth += 1;
+      continue;
+    }
+
+    if (character === ')' && depth > 0) {
+      depth -= 1;
+      continue;
+    }
+
+    if (depth === 0 && /[wW]/.test(character)) {
+      const remaining = text.slice(index);
+      if (/^where\b/i.test(remaining)) {
+        lastWhereIndex = index;
+      }
+    }
+  }
+
+  return lastWhereIndex;
+}
+
+function findTopLevelGroupByIndex(sql) {
+  const text = String(sql || '');
+  let depth = 0;
+  let inSingleQuote = false;
+  let inDoubleQuote = false;
+  let inBacktick = false;
+  let lastGroupByIndex = -1;
+
+  for (let index = 0; index < text.length; index += 1) {
+    const character = text[index];
+    const previousCharacter = index > 0 ? text[index - 1] : '';
+
+    if (inSingleQuote) {
+      if (character === '\'' && previousCharacter !== '\\') {
+        inSingleQuote = false;
+      }
+      continue;
+    }
+
+    if (inDoubleQuote) {
+      if (character === '"' && previousCharacter !== '\\') {
+        inDoubleQuote = false;
+      }
+      continue;
+    }
+
+    if (inBacktick) {
+      if (character === '`') {
+        inBacktick = false;
+      }
+      continue;
+    }
+
+    if (character === '\'') {
+      inSingleQuote = true;
+      continue;
+    }
+
+    if (character === '"') {
+      inDoubleQuote = true;
+      continue;
+    }
+
+    if (character === '`') {
+      inBacktick = true;
+      continue;
+    }
+
+    if (character === '(') {
+      depth += 1;
+      continue;
+    }
+
+    if (character === ')' && depth > 0) {
+      depth -= 1;
+      continue;
+    }
+
+    if (depth === 0 && /[gG]/.test(character)) {
+      const remaining = text.slice(index);
+      if (/^group\s+by\b/i.test(remaining)) {
+        lastGroupByIndex = index;
+      }
+    }
+  }
+
+  return lastGroupByIndex;
+}
+
+function buildSearchFilter(searchColumns, searchTerm) {
+  const columns = Array.isArray(searchColumns) ? searchColumns.map(function (column) {
+    return String(column || '').trim();
+  }).filter(Boolean) : [];
+  const normalizedSearchTerm = String(searchTerm || '').trim().toLowerCase();
+
+  if (!columns.length || !normalizedSearchTerm) {
+    return {
+      clause: '',
+      params: []
+    };
+  }
+
+  const likeValue = `%${escapeLikeValue(normalizedSearchTerm)}%`;
+  return {
+    clause: ` WHERE (${columns.map(function (column) {
+      return `LOWER(COALESCE(CAST(${column} AS CHAR), '')) LIKE ? ESCAPE '\\\\'`;
+    }).join(' OR ')})`,
+    params: columns.map(function () {
+      return likeValue;
+    })
+  };
+}
+
+async function fetchPagedRows(pool, options) {
+  const selectSql = String(options && options.selectSql || '').trim();
+  const countSql = String(options && options.countSql || '').trim();
+  const params = Array.isArray(options && options.params) ? options.params : [];
+  const searchFilter = buildSearchFilter(options && options.searchColumns, options && options.searchTerm);
+  const sortOrder = buildSortOrderClause(options && options.sortColumns, options && options.sortKey, options && options.sortDirection);
+  const pageSize = Math.max(1, Number(options && options.pageSize) || 10);
+  const currentPage = normalizePageNumber(options && options.page);
+
+  if (!selectSql || !countSql) {
+    throw new Error('fetchPagedRows requires selectSql and countSql.');
+  }
+  const orderByIndex = findTopLevelOrderByIndex(selectSql);
+  const groupByIndex = findTopLevelGroupByIndex(selectSql);
+  let baseSelectSql = selectSql;
+  let orderBySql = '';
+  let groupBySql = '';
+
+  if (orderByIndex >= 0) {
+    baseSelectSql = selectSql.slice(0, orderByIndex).trim();
+    orderBySql = selectSql.slice(orderByIndex).trim();
+  }
+
+  if (groupByIndex >= 0 && (orderByIndex < 0 || groupByIndex < orderByIndex)) {
+    baseSelectSql = selectSql.slice(0, groupByIndex).trim();
+    groupBySql = selectSql.slice(groupByIndex, orderByIndex >= 0 ? orderByIndex : selectSql.length).trim();
+  }
+
+  const hasTopLevelWhere = findTopLevelWhereIndex(baseSelectSql) >= 0;
+  const searchClause = searchFilter.clause ? (hasTopLevelWhere ? searchFilter.clause.replace(/^\s*WHERE\s+/i, ' AND ') : searchFilter.clause) : '';
+  const filteredSelectSql = `${baseSelectSql}${searchClause}${groupBySql ? ' ' + groupBySql : ''}`;
+  const countQuery = searchFilter.clause
+    ? `SELECT COUNT(*) AS count FROM (${filteredSelectSql}) AS filtered_rows`
+    : countSql;
+  const countParams = searchFilter.clause ? params.concat(searchFilter.params) : params;
+  const [countRows] = await pool.query(countQuery, countParams);
+  const totalItems = Number(countRows && countRows[0] && countRows[0].count) || 0;
+  const totalPages = Math.max(1, Math.ceil(totalItems / pageSize));
+  const safeCurrentPage = Math.min(currentPage, totalPages);
+  const offset = (safeCurrentPage - 1) * pageSize;
+
+  const activeOrderBySql = sortOrder.clause || (orderBySql ? ` ${orderBySql}` : '');
+  const selectQuery = `${filteredSelectSql}${activeOrderBySql} LIMIT ? OFFSET ?`;
+  const [rows] = await pool.query(selectQuery, params.concat(searchFilter.params, [pageSize, offset]));
+
+  return {
+    rows: rows || [],
+    totalItems: totalItems,
+    totalPages: totalPages,
+    currentPage: safeCurrentPage,
+    pageSize: pageSize
+  };
+}
+
 async function fetchDuplicateName(pool, tableName, name, excludeId, columnName) {
   const normalizedName = String(name || '').trim();
   if (!normalizedName) {
@@ -44,5 +390,14 @@ async function fetchDuplicateName(pool, tableName, name, excludeId, columnName)
 module.exports = {
   parseJsonSafe,
   readFormArray,
+  validateMaxLength,
+  truncateToMaxLength,
+  normalizePageNumber,
+  normalizeSortDirection,
+  buildSortOrderClause,
+  findTopLevelOrderByIndex,
+  findTopLevelGroupByIndex,
+  buildSearchFilter,
+  fetchPagedRows,
   fetchDuplicateName
 };

src/db/bootstrap.js

@@ -0,0 +1,107 @@
+const { hashPassword } = require('#src/auth');
+const { PERMISSIONS, DEFAULT_ROLE } = require('#src/rbac');
+
+async function bootstrapDatabase(pool) {
+  const [canvasSizeCountRows] = await pool.query('SELECT COUNT(*) AS canvas_size_count FROM c_canvas_sizes');
+  if (!canvasSizeCountRows.length || Number(canvasSizeCountRows[0].canvas_size_count) === 0) {
+    await pool.query(`
+      INSERT IGNORE INTO c_canvas_sizes (name, width, height) VALUES
+        ('Full HD', 1920, 1080),
+        ('HD', 1280, 720),
+        ('4K UHD', 3840, 2160),
+        ('Portrait Full HD', 1080, 1920),
+        ('Portrait HD', 720, 1280)
+    `);
+  }
+
+  for (const permission of PERMISSIONS) {
+    await pool.query(
+      `UPDATE a_permissions
+          SET name = ?, section_name = ?, description = ?, modified_by = ?
+        WHERE permission_key = ?`,
+      [permission.name, permission.sectionName, permission.description || null, null, permission.key]
+    );
+    await pool.query(
+      `INSERT INTO a_permissions (permission_key, name, section_name, description, created_by, modified_by)
+       SELECT ?, ?, ?, ?, ?, ?
+        WHERE NOT EXISTS (
+          SELECT 1 FROM a_permissions WHERE permission_key = ?
+        )`,
+      [permission.key, permission.name, permission.sectionName, permission.description || null, null, null, permission.key]
+    );
+  }
+
+  const [userCountRows] = await pool.query('SELECT COUNT(*) AS user_count FROM a_users');
+  const username = String(process.env.DEFAULT_ADMIN_USERNAME || 'admin').trim() || 'admin';
+  if (!userCountRows.length || Number(userCountRows[0].user_count) === 0) {
+    const name = String(process.env.DEFAULT_ADMIN_NAME || 'Admin').trim() || 'Admin';
+    const password = String(process.env.DEFAULT_ADMIN_PASSWORD || 'admin').trim() || 'admin';
+    const passwordRecord = hashPassword(password);
+    await pool.query(
+      'INSERT IGNORE INTO a_users (name, username, password_hash, password_salt, password_iterations, created_by, modified_by) VALUES (?, ?, ?, ?, ?, ?, ?)',
+      [name, username, passwordRecord.hash, passwordRecord.salt, passwordRecord.iterations, null, null]
+    );
+  }
+
+  const [legacyRoleRows] = await pool.query('SELECT id FROM a_roles WHERE role_key = ? LIMIT 1', ['administrators']);
+  const [currentRoleRows] = await pool.query('SELECT id FROM a_roles WHERE role_key = ? LIMIT 1', [DEFAULT_ROLE.key]);
+  if (legacyRoleRows.length && !currentRoleRows.length) {
+    await pool.query(
+      `UPDATE a_roles
+          SET role_key = ?, name = ?, description = ?, modified_by = ?
+        WHERE role_key = ?`,
+      [DEFAULT_ROLE.key, DEFAULT_ROLE.name, DEFAULT_ROLE.description || null, null, 'administrators']
+    );
+  }
+
+  await pool.query(
+    `INSERT INTO a_roles (role_key, name, description, created_by, modified_by)
+     SELECT ?, ?, ?, ?, ?
+      WHERE NOT EXISTS (
+        SELECT 1 FROM a_roles WHERE role_key = ?
+      )`,
+    [DEFAULT_ROLE.key, DEFAULT_ROLE.name, DEFAULT_ROLE.description || null, null, null, DEFAULT_ROLE.key]
+  );
+
+  const [defaultRoleRows] = await pool.query('SELECT id FROM a_roles WHERE role_key = ? LIMIT 1', [DEFAULT_ROLE.key]);
+  const defaultRoleId = defaultRoleRows.length ? Number(defaultRoleRows[0].id) : null;
+  if (defaultRoleId) {
+    await pool.query(
+      `INSERT INTO a_role_permissions (role_id, permission_id, created_by, modified_by)
+       SELECT ?, permissions.id, NULL, NULL
+         FROM a_permissions permissions
+         LEFT JOIN a_role_permissions existing
+           ON existing.role_id = ? AND existing.permission_id = permissions.id
+        WHERE existing.id IS NULL`,
+      [defaultRoleId, defaultRoleId]
+    );
+  }
+
+  if (!userCountRows.length || Number(userCountRows[0].user_count) === 0) {
+    if (defaultRoleId) {
+      await pool.query(
+        `INSERT IGNORE INTO a_user_roles (user_id, role_id, created_by, modified_by)
+         SELECT id, ?, NULL, NULL FROM a_users`,
+        [defaultRoleId]
+      );
+    }
+  }
+
+  const [defaultAdminRows] = await pool.query('SELECT id FROM a_users WHERE username = ? LIMIT 1', [username]);
+  if (defaultAdminRows.length) {
+    const defaultAdminId = Number(defaultAdminRows[0].id);
+    const [defaultAdminRoleRows] = await pool.query('SELECT COUNT(*) AS role_count FROM a_user_roles WHERE user_id = ?', [defaultAdminId]);
+    if (!defaultAdminRoleRows.length || Number(defaultAdminRoleRows[0].role_count) === 0) {
+      if (defaultRoleId) {
+        await pool.query(
+          'INSERT IGNORE INTO a_user_roles (user_id, role_id, created_by, modified_by) VALUES (?, ?, ?, ?)',
+          [defaultAdminId, defaultRoleId, null, null]
+        );
+      }
+    }
+  }
+}
+
+module.exports = {
+  bootstrapDatabase
+};

src/db/common.js

@@ -0,0 +1,27 @@
+const mysql = require('mysql2/promise');
+
+function createPool() {
+  return mysql.createPool({
+    host: process.env.DB_HOST || '127.0.0.1',
+    port: Number(process.env.DB_PORT || 3306),
+    user: process.env.DB_USER || 'signage_user',
+    password: process.env.DB_PASSWORD || 'signage_password',
+    database: process.env.DB_NAME || 'signage',
+    timezone: 'Z',
+    waitForConnections: true,
+    connectionLimit: 10,
+    namedPlaceholders: true
+  });
+}
+
+async function pruneStaleOnboardingDevices(pool) {
+  await pool.query(
+    `DELETE FROM d_onboarding_devices
+     WHERE modified_at < (CURRENT_TIMESTAMP - INTERVAL 1 MINUTE)`
+  );
+}
+
+module.exports = {
+  createPool,
+  pruneStaleOnboardingDevices
+};

src/db/index.js

@@ -1,31 +1,28 @@
-const mysql = require('mysql2/promise');
-const { hashPassword } = require('../auth');
-const { PERMISSIONS, DEFAULT_ROLE } = require('../rbac');
-const migrations = require('./migrations');
+const { version: appVersion } = require('#root/package.json');
+const { compareVersions, detectSchemaVersion, getPendingMigrations, recordSchemaVersion, runMigrations } = require('./migrations');
 
-function createPool() {
-  return mysql.createPool({
-    host: process.env.DB_HOST || '127.0.0.1',
-    port: Number(process.env.DB_PORT || 3306),
-    user: process.env.DB_USER || 'signage_user',
-    password: process.env.DB_PASSWORD || 'signage_password',
-    database: process.env.DB_NAME || 'signage',
-    waitForConnections: true,
-    connectionLimit: 10,
-    namedPlaceholders: true
-  });
-}
+// Snapshot only: keep this file aligned with the current schema state.
+async function ensureSchema(pool, options) {
+  const schemaLockName = 'pulse_signage_schema_lock';
+  const schemaConnection = await pool.getConnection();
 
-async function pruneStaleOnboardingDevices(pool) {
-  await pool.query(
-    `DELETE FROM player_onboarding_devices
-     WHERE modified_at < (CURRENT_TIMESTAMP - INTERVAL 1 MINUTE)`
-  );
-}
+  try {
+    pool = schemaConnection;
 
-async function ensureSchema(pool) {
-  await pool.query(`
-    CREATE TABLE IF NOT EXISTS canvas_sizes (
+    const [lockRows] = await pool.query('SELECT GET_LOCK(?, 120) AS lock_acquired', [schemaLockName]);
+    if (!Number(lockRows && lockRows[0] && lockRows[0].lock_acquired)) {
+      throw new Error('Unable to acquire the schema migration lock.');
+    }
+
+    try {
+      const currentVersion = await detectSchemaVersion(pool);
+      const pendingMigrations = await getPendingMigrations(pool, { currentVersion: currentVersion });
+      const updateRequired = pendingMigrations.length > 0;
+
+      console.info('[schema] previous=' + currentVersion + ' current=' + appVersion + ' update=' + (updateRequired ? 'yes' : 'no'));
+
+      await pool.query(`
+    CREATE TABLE IF NOT EXISTS c_canvas_sizes (
       id INT AUTO_INCREMENT PRIMARY KEY,
       name VARCHAR(255) NOT NULL,
       width INT NOT NULL,
@@ -39,19 +36,22 @@ async function ensureSchema(pool) {
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS playlists (
+    CREATE TABLE IF NOT EXISTS c_playlists (
       id INT AUTO_INCREMENT PRIMARY KEY,
       name VARCHAR(255) NOT NULL,
       fade_between_slides TINYINT(1) NOT NULL DEFAULT 0,
+      skip_unavailable_rtmp TINYINT(1) NOT NULL DEFAULT 0,
+      canvas_id INT 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,
-      modified_by INT NULL
+      modified_by INT NULL,
+      CONSTRAINT fk_playlists_canvas FOREIGN KEY (canvas_id) REFERENCES c_canvas_sizes(id) ON DELETE SET NULL
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS slide_templates (
+    CREATE TABLE IF NOT EXISTS c_templates (
       id INT AUTO_INCREMENT PRIMARY KEY,
       name VARCHAR(255) NOT NULL,
       canvas_size_id INT NULL,
@@ -65,22 +65,15 @@ async function ensureSchema(pool) {
   `);
 
   await pool.query(`
-    INSERT IGNORE INTO canvas_sizes (name, width, height) VALUES
-      ('Full HD', 1920, 1080),
-      ('HD', 1280, 720),
-      ('4K UHD', 3840, 2160),
-      ('Portrait Full HD', 1080, 1920),
-      ('Portrait HD', 720, 1280)
-  `);
-
-  await pool.query(`
-    CREATE TABLE IF NOT EXISTS slide_template_regions (
+    CREATE TABLE IF NOT EXISTS c_template_regions (
       id INT AUTO_INCREMENT PRIMARY KEY,
       template_id INT NOT NULL,
       region_key VARCHAR(100) NOT NULL,
       region_type VARCHAR(20) NOT NULL,
       label VARCHAR(255) NOT NULL,
+      font_family VARCHAR(100) NULL,
       lock_ratio VARCHAR(20) NULL,
+      animation_json JSON NULL,
       x INT NOT NULL DEFAULT 0,
       y INT NOT NULL DEFAULT 0,
       width INT NOT NULL DEFAULT 100,
@@ -94,14 +87,12 @@ async function ensureSchema(pool) {
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS slides (
+    CREATE TABLE IF NOT EXISTS c_slides (
       id INT AUTO_INCREMENT PRIMARY KEY,
       title VARCHAR(255) NOT NULL,
-      body TEXT NULL,
       template_id INT NULL,
       content_json JSON NULL,
-      media_path VARCHAR(512) NULL,
-      media_type VARCHAR(100) NULL,
+      thumbnail_path VARCHAR(512) 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,
@@ -110,29 +101,56 @@ async function ensureSchema(pool) {
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS playlist_slides (
+    CREATE TABLE IF NOT EXISTS c_playlist_slides (
       id INT AUTO_INCREMENT PRIMARY KEY,
       playlist_id INT NOT NULL,
       slide_id INT NOT NULL,
       position INT NOT NULL DEFAULT 0,
-      duration_seconds INT NOT NULL DEFAULT 10,
-      schedule_mode VARCHAR(20) NOT NULL DEFAULT 'always',
-      schedule_start_datetime DATETIME NULL,
-      schedule_end_datetime DATETIME NULL,
-      schedule_start_time TIME NULL,
-      schedule_end_time TIME NULL,
+      duration_seconds DECIMAL(10,3) NOT NULL DEFAULT 10.000,
+      use_video_duration TINYINT(1) NOT NULL DEFAULT 0,
+      disable_audio TINYINT(1) NOT NULL DEFAULT 1,
+      created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+      created_by INT NULL,
+      modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
+      modified_by INT NULL,
+      CONSTRAINT fk_playlist_slides_playlist FOREIGN KEY (playlist_id) REFERENCES c_playlists(id) ON DELETE CASCADE,
+      CONSTRAINT fk_playlist_slides_slide FOREIGN KEY (slide_id) REFERENCES c_slides(id) ON DELETE CASCADE
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
+
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS c_playlist_slide_schedule_rules (
+      id INT AUTO_INCREMENT PRIMARY KEY,
+      playlist_slide_id INT NOT NULL,
+      position INT NOT NULL DEFAULT 0,
+      start_datetime DATETIME NULL,
+      end_datetime DATETIME NULL,
+      start_time TIME NULL,
+      end_time TIME NULL,
       schedule_days_json JSON 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,
       modified_by INT NULL,
-      CONSTRAINT fk_playlist_slides_playlist FOREIGN KEY (playlist_id) REFERENCES playlists(id) ON DELETE CASCADE,
-      CONSTRAINT fk_playlist_slides_slide FOREIGN KEY (slide_id) REFERENCES slides(id) ON DELETE CASCADE
+      CONSTRAINT fk_playlist_slide_schedule_rules_slide FOREIGN KEY (playlist_slide_id) REFERENCES c_playlist_slides(id) ON DELETE CASCADE,
+      INDEX idx_playlist_slide_schedule_rules_slide_position (playlist_slide_id, position)
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS screens (
+    CREATE TABLE IF NOT EXISTS d_players (
+      id INT AUTO_INCREMENT PRIMARY KEY,
+      identifier VARCHAR(128) NOT NULL UNIQUE,
+      public_base_url VARCHAR(512) NULL,
+      internal_base_url VARCHAR(512) NULL,
+      last_seen_at TIMESTAMP NULL,
+      created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+      modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
+
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS d_screens (
       id INT AUTO_INCREMENT PRIMARY KEY,
       name VARCHAR(255) NOT NULL,
       slug VARCHAR(255) NOT NULL UNIQUE,
@@ -141,12 +159,47 @@ async function ensureSchema(pool) {
       created_by INT NULL,
       modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
       modified_by INT NULL,
-      CONSTRAINT fk_screens_playlist FOREIGN KEY (playlist_id) REFERENCES playlists(id) ON DELETE SET NULL
+      CONSTRAINT fk_screens_playlist FOREIGN KEY (playlist_id) REFERENCES c_playlists(id) ON DELETE SET NULL
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS rss_feeds (
+    CREATE TABLE IF NOT EXISTS d_announcements (
+      id INT AUTO_INCREMENT PRIMARY KEY,
+      message TEXT NOT NULL,
+      short_label VARCHAR(255) NOT NULL DEFAULT '',
+      announcement_type VARCHAR(32) NOT NULL DEFAULT 'lower-third',
+      color_key VARCHAR(32) NOT NULL DEFAULT 'primary',
+      icon_key VARCHAR(64) NOT NULL DEFAULT 'megaphone-fill',
+      duration_seconds INT NULL,
+      expires_at TIMESTAMP 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,
+      modified_by INT NULL,
+      INDEX idx_announcements_expires_at (expires_at),
+      INDEX idx_announcements_modified_at (modified_at)
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
+
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS d_announcement_screens (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
+      announcement_id INT NOT NULL,
+      screen_id INT NOT 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,
+      modified_by INT NULL,
+      UNIQUE KEY uq_announcement_screens_pair (announcement_id, screen_id),
+      INDEX idx_announcement_screens_screen_id (screen_id),
+      CONSTRAINT fk_announcement_screens_announcement FOREIGN KEY (announcement_id) REFERENCES d_announcements(id) ON DELETE CASCADE,
+      CONSTRAINT fk_announcement_screens_screen FOREIGN KEY (screen_id) REFERENCES d_screens(id) ON DELETE CASCADE
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
+
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS i_rss_feeds (
       id INT AUTO_INCREMENT PRIMARY KEY,
       name VARCHAR(255) NOT NULL,
       feed_url VARCHAR(1024) NOT NULL,
@@ -161,7 +214,7 @@ async function ensureSchema(pool) {
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS rss_feed_items (
+    CREATE TABLE IF NOT EXISTS i_rss_feed_items (
       id INT AUTO_INCREMENT PRIMARY KEY,
       rss_feed_id INT NOT NULL,
       position INT NOT NULL,
@@ -170,16 +223,30 @@ async function ensureSchema(pool) {
       created_by INT NULL,
       modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
       modified_by INT NULL,
-      CONSTRAINT fk_rss_feed_items_rss_feed FOREIGN KEY (rss_feed_id) REFERENCES rss_feeds(id) ON DELETE CASCADE,
+      CONSTRAINT fk_rss_feed_items_rss_feed FOREIGN KEY (rss_feed_id) REFERENCES i_rss_feeds(id) ON DELETE CASCADE,
       UNIQUE KEY uq_rss_feed_items_feed_position (rss_feed_id, position)
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS api_sources (
+    CREATE TABLE IF NOT EXISTS i_api_sources (
       id INT AUTO_INCREMENT PRIMARY KEY,
       name VARCHAR(255) NOT NULL,
       api_url VARCHAR(1024) NOT NULL,
+      request_method VARCHAR(10) NOT NULL DEFAULT 'GET',
+      request_body_json MEDIUMTEXT NULL,
+      auth_method VARCHAR(32) NOT NULL DEFAULT 'none',
+      auth_username VARCHAR(255) NULL,
+      auth_password MEDIUMTEXT NULL,
+      auth_bearer_token MEDIUMTEXT NULL,
+      auth_header_name VARCHAR(255) NULL,
+      auth_header_value MEDIUMTEXT NULL,
+      token_url VARCHAR(1024) NULL,
+      token_request_body_json MEDIUMTEXT NULL,
+      token_response_path VARCHAR(255) NULL DEFAULT 'access_token',
+      token_header_name VARCHAR(255) NULL DEFAULT 'Authorization',
+      token_header_prefix VARCHAR(64) NULL DEFAULT 'Bearer',
+      items_path VARCHAR(255) NULL,
       update_interval_value INT NOT NULL DEFAULT 60,
       update_interval_unit VARCHAR(10) NOT NULL DEFAULT 'minutes',
       last_pulled_at TIMESTAMP NULL,
@@ -195,26 +262,11 @@ async function ensureSchema(pool) {
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS player_onboarding_devices (
-      device_id VARCHAR(128) PRIMARY KEY,
-      client_name VARCHAR(255) NULL,
-      screen_id INT 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,
-      modified_by INT NULL,
-      CONSTRAINT fk_player_onboarding_devices_screen FOREIGN KEY (screen_id) REFERENCES screens(id) ON DELETE SET NULL
-    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
-  `);
-
-  await pool.query(`
-    CREATE TABLE IF NOT EXISTS users (
+    CREATE TABLE IF NOT EXISTS i_timetable_groups (
       id INT AUTO_INCREMENT PRIMARY KEY,
-      name VARCHAR(255) NULL,
-      username VARCHAR(255) NOT NULL UNIQUE,
-      password_hash CHAR(64) NOT NULL,
-      password_salt VARCHAR(64) NOT NULL,
-      password_iterations INT NOT NULL,
+      name VARCHAR(255) NOT NULL,
+      short_description VARCHAR(255) NULL,
+      timezone VARCHAR(64) NOT NULL DEFAULT 'Europe/London',
       created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
       created_by INT NULL,
       modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
@@ -223,7 +275,55 @@ async function ensureSchema(pool) {
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS roles (
+    CREATE TABLE IF NOT EXISTS i_timetable_entries (
+      id INT AUTO_INCREMENT PRIMARY KEY,
+      schedule_group_id INT NOT NULL,
+      title VARCHAR(255) NOT NULL,
+      short_description VARCHAR(255) NULL,
+      start_datetime DATETIME NOT NULL,
+      end_datetime DATETIME 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,
+      modified_by INT NULL,
+      CONSTRAINT fk_timetable_entries_group FOREIGN KEY (schedule_group_id) REFERENCES i_timetable_groups(id) ON DELETE CASCADE,
+      INDEX idx_timetable_entries_group_start (schedule_group_id, start_datetime)
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
+
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS d_onboarding_devices (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
+      device_id VARCHAR(128) NOT NULL UNIQUE,
+      client_name VARCHAR(255) NULL,
+      screen_id INT 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,
+      modified_by INT 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
+  `);
+
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS a_users (
+      id INT AUTO_INCREMENT PRIMARY KEY,
+      name VARCHAR(255) NULL,
+      username VARCHAR(255) NOT NULL UNIQUE,
+      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,
+      created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+      created_by INT NULL,
+      modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
+      modified_by INT NULL
+    ) 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,
       role_key VARCHAR(100) NOT NULL UNIQUE,
       name VARCHAR(255) NOT NULL,
@@ -236,7 +336,7 @@ async function ensureSchema(pool) {
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS permissions (
+    CREATE TABLE IF NOT EXISTS a_permissions (
       id INT AUTO_INCREMENT PRIMARY KEY,
       permission_key VARCHAR(100) NOT NULL UNIQUE,
       name VARCHAR(255) NOT NULL,
@@ -249,58 +349,66 @@ async function ensureSchema(pool) {
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
-  for (const permission of PERMISSIONS) {
-    await pool.query(
-      `INSERT INTO permissions (permission_key, name, section_name, description, created_by, modified_by)
-       VALUES (?, ?, ?, ?, ?, ?)
-       ON DUPLICATE KEY UPDATE name = VALUES(name), section_name = VALUES(section_name), description = VALUES(description), modified_by = VALUES(modified_by)` ,
-      [permission.key, permission.name, permission.sectionName, permission.description || null, null, null]
-    );
-  }
-
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS role_permissions (
+    CREATE TABLE IF NOT EXISTS a_role_permissions (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
       role_id INT NOT NULL,
       permission_id INT NOT 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,
       modified_by INT NULL,
-      PRIMARY KEY (role_id, permission_id),
-      CONSTRAINT fk_role_permissions_role FOREIGN KEY (role_id) REFERENCES roles(id) ON DELETE CASCADE,
-      CONSTRAINT fk_role_permissions_permission FOREIGN KEY (permission_id) REFERENCES permissions(id) ON DELETE CASCADE
+      UNIQUE KEY uq_role_permissions_pair (role_id, permission_id),
+      CONSTRAINT fk_role_permissions_role FOREIGN KEY (role_id) REFERENCES a_roles(id) ON DELETE CASCADE,
+      CONSTRAINT fk_role_permissions_permission FOREIGN KEY (permission_id) REFERENCES a_permissions(id) ON DELETE CASCADE
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS user_roles (
+    CREATE TABLE IF NOT EXISTS a_user_roles (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
       user_id INT NOT NULL,
       role_id INT NOT 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,
       modified_by INT NULL,
-      PRIMARY KEY (user_id, role_id),
-      CONSTRAINT fk_user_roles_user FOREIGN KEY (user_id) REFERENCES users(id) ON DELETE CASCADE,
-      CONSTRAINT fk_user_roles_role FOREIGN KEY (role_id) REFERENCES roles(id) ON DELETE CASCADE
+      UNIQUE KEY uq_user_roles_pair (user_id, role_id),
+      CONSTRAINT fk_user_roles_user FOREIGN KEY (user_id) REFERENCES a_users(id) ON DELETE CASCADE,
+      CONSTRAINT fk_user_roles_role FOREIGN KEY (role_id) REFERENCES a_roles(id) ON DELETE CASCADE
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS auth_sessions (
-      session_hash CHAR(64) PRIMARY KEY,
+    CREATE TABLE IF NOT EXISTS a_sessions (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
+      session_hash CHAR(64) NOT NULL UNIQUE,
       user_id INT NOT NULL,
+      ip_address VARCHAR(255) NULL,
+      user_agent VARCHAR(512) NULL,
       expires_at DATETIME NOT NULL,
       created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
       created_by INT NULL,
       last_used_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
       modified_by INT NULL,
-      CONSTRAINT fk_auth_sessions_user FOREIGN KEY (user_id) REFERENCES users(id) ON DELETE CASCADE
+      CONSTRAINT fk_auth_sessions_user FOREIGN KEY (user_id) REFERENCES a_users(id) ON DELETE CASCADE
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
   await pool.query(`
-    CREATE TABLE IF NOT EXISTS background_tasks (
+    CREATE TABLE IF NOT EXISTS a_login_attempts (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
+      rate_key VARCHAR(600) NOT NULL UNIQUE,
+      failed_count INT NOT NULL DEFAULT 0,
+      last_failed_at DATETIME NULL,
+      locked_until DATETIME NULL,
+      created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
+      modified_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
+
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS o_background_tasks (
       id BIGINT AUTO_INCREMENT PRIMARY KEY,
       task_key VARCHAR(191) NULL,
       task_type VARCHAR(100) NOT NULL,
@@ -320,60 +428,29 @@ async function ensureSchema(pool) {
     ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
   `);
 
-  const [userCountRows] = await pool.query('SELECT COUNT(*) AS user_count FROM users');
-  const username = String(process.env.DEFAULT_ADMIN_USERNAME || 'admin').trim() || 'admin';
-  if (!userCountRows.length || Number(userCountRows[0].user_count) === 0) {
-    const name = String(process.env.DEFAULT_ADMIN_NAME || 'Admin').trim() || 'Admin';
-    const password = String(process.env.DEFAULT_ADMIN_PASSWORD || 'admin').trim() || 'admin';
-    const passwordRecord = hashPassword(password);
-    await pool.query(
-      'INSERT INTO users (name, username, password_hash, password_salt, password_iterations, created_by, modified_by) VALUES (?, ?, ?, ?, ?, ?, ?)',
-      [name, username, passwordRecord.hash, passwordRecord.salt, passwordRecord.iterations, null, null]
-    );
-  }
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS o_app_settings (
+      id BIGINT AUTO_INCREMENT PRIMARY KEY,
+      setting_key VARCHAR(191) NOT NULL UNIQUE,
+      setting_value JSON NOT 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,
+      modified_by INT NULL
+    ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci
+  `);
 
-  await pool.query('UPDATE users SET name = username WHERE name IS NULL OR name = ""');
-
-  await pool.query(
-    `INSERT INTO roles (role_key, name, description, created_by, modified_by)
-     VALUES (?, ?, ?, ?, ?)
-     ON DUPLICATE KEY UPDATE name = VALUES(name), description = VALUES(description), modified_by = VALUES(modified_by)`,
-    [DEFAULT_ROLE.key, DEFAULT_ROLE.name, DEFAULT_ROLE.description || null, null, null]
-  );
-
-  await migrations.runMigrations(pool);
-
-  if (!userCountRows.length || Number(userCountRows[0].user_count) === 0) {
-    const [roleRows] = await pool.query('SELECT id FROM roles WHERE role_key = ? LIMIT 1', [DEFAULT_ROLE.key]);
-    const defaultRoleId = roleRows.length ? Number(roleRows[0].id) : null;
-    if (defaultRoleId) {
-      await pool.query(
-        `INSERT IGNORE INTO user_roles (user_id, role_id, created_by, modified_by)
-         SELECT id, ?, NULL, NULL FROM users`,
-        [defaultRoleId]
-      );
-    }
-  }
-
-  const [defaultAdminRows] = await pool.query('SELECT id FROM users WHERE username = ? LIMIT 1', [username]);
-  if (defaultAdminRows.length) {
-    const defaultAdminId = Number(defaultAdminRows[0].id);
-    const [defaultAdminRoleRows] = await pool.query('SELECT COUNT(*) AS role_count FROM user_roles WHERE user_id = ?', [defaultAdminId]);
-    if (!defaultAdminRoleRows.length || Number(defaultAdminRoleRows[0].role_count) === 0) {
-      const [roleRows] = await pool.query('SELECT id FROM roles WHERE role_key = ? LIMIT 1', [DEFAULT_ROLE.key]);
-      const defaultRoleId = roleRows.length ? Number(roleRows[0].id) : null;
-      if (defaultRoleId) {
-        await pool.query(
-          'INSERT IGNORE INTO user_roles (user_id, role_id, created_by, modified_by) VALUES (?, ?, ?, ?)',
-          [defaultAdminId, defaultRoleId, null, null]
-        );
-      }
+      await runMigrations(pool, Object.assign({}, options, { currentVersion: currentVersion }));
+      await recordSchemaVersion(pool, appVersion);
+    } finally {
+      await pool.query('SELECT RELEASE_LOCK(?)', [schemaLockName]).catch(function () {
+      });
     }
+  } finally {
+    schemaConnection.release();
   }
 }
 
 module.exports = {
-  createPool,
   ensureSchema,
-  pruneStaleOnboardingDevices
 };

src/player.js

@@ -2,6 +2,7 @@ const express = require('express');
 const fs = require('fs');
 const http = require('http');
 const path = require('path');
+const { WebSocket } = require('ws');
 const common = require('./common');
 const { createPlayerRuntime } = require('./player/runtime');
 const { createPlayerPlaylistService } = require('./player/playlist');
@@ -9,40 +10,302 @@ 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 { pruneStaleOnboardingDevices } = require('./db');
+const { ensureFontLibrary } = require('#src/web/lib/media/font-library');
+const { createRequestAuthHeaders } = require('#src/request-auth');
+const { getConfiguredPlayerIdentifier, recordPlayerHeartbeat } = require('#src/data/player-registry');
 
 
 // Player runtime, media API, and websocket wiring.
 async function start() {
   const app = express();
-  const pool = common.createPool();
-  const PORT = Number(process.env.PLAYER_PORT || 3001);
+  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 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_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');
   const MEDIA_DIR = path.join(__dirname, '..', 'media');
   const ONBOARDING_QUEUE_FILE = path.join(MEDIA_DIR, 'player-onboarding-queue.json');
   const DB_SYNC_INTERVAL_MS = Number(process.env.PLAYER_DB_SYNC_INTERVAL_MS || 15000);
+  const RECONNECT_SYNC_STALE_MS = 60 * 1000;
   const onboardingStore = createOnboardingStore(ONBOARDING_QUEUE_FILE);
+  let thinClientSocket = null;
+  let lastDisconnectAt = 0;
+  let playerPublicBaseUrl = PLAYER_PUBLIC_URL || null;
+  let refreshThinClientRegistration = null;
   const playerRuntime = createPlayerRuntime({
     pool: pool,
-    normalizeDeviceId: normalizeDeviceId
-  });
-  const playerPlaylistService = createPlayerPlaylistService({
-    pool: pool,
-    common: common,
-    snapshotDir: path.join(MEDIA_DIR, 'player-cache', 'screen-playlists')
+    normalizeDeviceId: normalizeDeviceId,
+    notifySnapshot: function (snapshot) {
+      if (!thinClientSocket || thinClientSocket.readyState !== WebSocket.OPEN) {
+        return;
+      }
+
+      try {
+        thinClientSocket.send(JSON.stringify({
+          type: 'snapshot',
+          deviceId: PLAYER_DEVICE_ID,
+          slug: snapshot && snapshot.slug ? String(snapshot.slug).trim() : '',
+          connections: Array.isArray(snapshot && snapshot.connections) ? snapshot.connections : []
+        }));
+      } catch (_error) {
+      }
+    }
   });
+  const playerPlaylistService = isRemotePlayer
+    ? null
+    : createPlayerPlaylistService({
+        pool: pool,
+        common: common,
+        mediaDir: MEDIA_DIR,
+        snapshotDir: path.join(MEDIA_DIR, 'player-cache', 'screen-playlists')
+      });
   const rtmpStreamService = createRtmpStreamService({
     mediaDir: MEDIA_DIR
   });
   const server = http.createServer(app);
   playerRuntime.installWebsocket(server);
   app.use(express.json());
+
+  let hasLoggedPlayerStartup = false;
+
+  function normalizePlayerPublicBaseUrl(value) {
+    const normalized = String(value || '').trim().replace(/\/$/, '');
+    if (!normalized) {
+      return null;
+    }
+
+    try {
+      return new URL(normalized).origin.replace(/\/$/, '');
+    } catch (_error) {
+      return normalized;
+    }
+  }
+
+  function setPlayerPublicBaseUrl(value) {
+    const nextBaseUrl = normalizePlayerPublicBaseUrl(value);
+    if (!nextBaseUrl || nextBaseUrl === playerPublicBaseUrl) {
+      return;
+    }
+
+    playerPublicBaseUrl = nextBaseUrl;
+    if (typeof refreshThinClientRegistration === 'function') {
+      refreshThinClientRegistration();
+    }
+  }
+
+  function getPlayerPublicBaseUrl() {
+    return playerPublicBaseUrl;
+  }
+
+  function logPlayerStartup(connectionState) {
+    if (hasLoggedPlayerStartup) {
+      return;
+    }
+
+    hasLoggedPlayerStartup = true;
+    console.info('[player] startup', {
+      mode: isRemotePlayer ? 'bridge client' : 'local',
+      connected: connectionState && typeof connectionState.connected === 'boolean' ? connectionState.connected : false,
+      publicBaseUrl: getPlayerPublicBaseUrl(),
+      bridgeBaseUrl: PLAYER_INTERNAL_URL || null,
+      bridgeWebSocketUrl: BRIDGE_PUBLIC_URL ? createThinClientWebSocketUrl() : null
+    });
+  }
+
+  fs.mkdirSync(MEDIA_DIR, { recursive: true });
+
+  function resolveLocalMediaFilePath(fileName) {
+    const relativePath = path.normalize(String(fileName || '').trim()).replace(/^([\\/])+/, '');
+    if (!relativePath || relativePath === '.' || relativePath.startsWith('..') || path.isAbsolute(relativePath)) {
+      return null;
+    }
+
+    const resolvedMediaDir = path.resolve(MEDIA_DIR);
+    const resolvedFilePath = path.resolve(MEDIA_DIR, relativePath);
+    if (resolvedFilePath !== resolvedMediaDir && !resolvedFilePath.startsWith(resolvedMediaDir + path.sep)) {
+      return null;
+    }
+
+    return resolvedFilePath;
+  }
+
+  async function triggerWebMediaSync() {
+    const syncBaseUrl = WEB_INTERNAL_URL || BRIDGE_PUBLIC_URL;
+    if (!isRemotePlayer || !syncBaseUrl) {
+      return false;
+    }
+
+    const requestBody = {
+      playerIdentifier: PLAYER_DEVICE_ID,
+      playerPublicBaseUrl: getPlayerPublicBaseUrl(),
+      playerInternalBaseUrl: PLAYER_INTERNAL_URL
+    };
+
+    try {
+      const authHeaders = createRequestAuthHeaders({
+        method: 'POST',
+        pathname: '/api/internal/sync/player-media',
+        body: requestBody
+      });
+      const response = await fetch(`${syncBaseUrl}/api/internal/sync/player-media`, {
+        method: 'POST',
+        headers: Object.assign({
+          Accept: 'application/json',
+          'Content-Type': 'application/json'
+        }, authHeaders),
+        body: JSON.stringify(requestBody)
+      });
+
+      return Boolean(response && response.ok);
+    } catch (_error) {
+      console.warn('[player] Startup media sync failed');
+      return false;
+    }
+  }
+
+  async function triggerWebFontSync() {
+    const syncBaseUrl = WEB_INTERNAL_URL || BRIDGE_PUBLIC_URL;
+    if (!isRemotePlayer || !syncBaseUrl) {
+      return false;
+    }
+
+    const requestBody = {
+      playerIdentifier: PLAYER_DEVICE_ID,
+      playerPublicBaseUrl: getPlayerPublicBaseUrl(),
+      playerInternalBaseUrl: PLAYER_INTERNAL_URL
+    };
+
+    try {
+      const authHeaders = createRequestAuthHeaders({
+        method: 'POST',
+        pathname: '/api/internal/sync/player-font',
+        body: requestBody
+      });
+      const response = await fetch(`${syncBaseUrl}/api/internal/sync/player-font`, {
+        method: 'POST',
+        headers: Object.assign({
+          Accept: 'application/json',
+          'Content-Type': 'application/json'
+        }, authHeaders),
+        body: JSON.stringify(requestBody)
+      });
+
+      return Boolean(response && response.ok);
+    } catch (_error) {
+      console.warn('[player] Startup font sync failed');
+      return false;
+    }
+  }
+
+  let webMediaSyncCompleted = false;
+  let webFontSyncCompleted = false;
+  let webFontSyncTriggered = false;
+
+  function shouldTriggerReconnectSync() {
+    if (!lastDisconnectAt) {
+      return true;
+    }
+
+    return Date.now() - lastDisconnectAt >= RECONNECT_SYNC_STALE_MS;
+  }
+
+  async function handleThinClientCommand(socket, rawMessage) {
+    let payload = null;
+    try {
+      payload = JSON.parse(String(rawMessage || ''));
+    } catch (_error) {
+      return;
+    }
+
+    if (!payload || typeof payload !== 'object' || Array.isArray(payload) || String(payload.type || '').trim() !== 'command') {
+      return;
+    }
+
+    const requestId = String(payload.requestId || '').trim() || null;
+    const command = String(payload.command || '').trim().toLowerCase();
+    const response = {
+      type: 'command-response',
+      requestId: requestId,
+      ok: false
+    };
+
+    try {
+      if (command === 'media-put') {
+        const relativePath = String(payload.relativePath || payload.filename || '').trim();
+        const filePath = resolveLocalMediaFilePath(relativePath);
+        const bodyBase64 = String(payload.bodyBase64 || '').trim();
+        if (!filePath || !bodyBase64) {
+          response.error = 'Invalid media payload.';
+        } else {
+          const bodyBuffer = Buffer.from(bodyBase64, 'base64');
+          await fs.promises.mkdir(path.dirname(filePath), { recursive: true });
+          await fs.promises.writeFile(filePath, bodyBuffer);
+          response.ok = true;
+        }
+      } else if (command === 'media-delete') {
+        const relativePath = String(payload.relativePath || payload.filename || '').trim();
+        const filePath = resolveLocalMediaFilePath(relativePath);
+        if (!filePath) {
+          response.error = 'Invalid media path.';
+        } else {
+          try {
+            await fs.promises.unlink(filePath);
+          } catch (error) {
+            if (!error || error.code !== 'ENOENT') {
+              throw error;
+            }
+          }
+          response.ok = true;
+        }
+      } else if (['refresh', 'reload', 'redirect', 'pause', 'blackout', 'previous', 'next', 'setclientname'].indexOf(command) !== -1) {
+        const screenSlug = String(payload.screenSlug || payload.slug || '').trim();
+        if (!screenSlug) {
+          response.error = 'Screen slug is required.';
+        } else if (payload.connectionId) {
+          const sent = await playerRuntime.sendCommandToConnection(screenSlug, String(payload.connectionId || '').trim(), payload);
+          response.ok = sent > 0;
+          if (!response.ok) {
+            response.error = 'Player is not connected.';
+          }
+        } else {
+          const sent = await playerRuntime.broadcastCommand(screenSlug, payload);
+          response.ok = sent > 0;
+          if (!response.ok) {
+            response.error = 'Player is not connected.';
+          }
+        }
+      } else {
+        response.error = 'Unsupported command.';
+      }
+    } catch (error) {
+      response.error = error && error.message ? error.message : 'Command failed.';
+    }
+
+    if (socket && socket.readyState === WebSocket.OPEN) {
+      socket.send(JSON.stringify(response));
+    }
+  }
+  app.use(function (error, _req, res, _next) {
+    console.error(error);
+    res.status(error.statusCode || 500).send(error.statusCode ? error.message : 'Internal server error');
+  });
+
+  await ensureFontLibrary(MEDIA_DIR);
+
   registerPlayerOnboardingRoutes(app, {
     pool: pool,
     common: common,
     playerRuntime: playerRuntime,
     onboardingStore: onboardingStore,
-    QRCode: require('qrcode')
+    playerPublicBaseUrl: getPlayerPublicBaseUrl(),
+    playerInternalBaseUrl: PLAYER_INTERNAL_URL,
+    bridgeBaseUrl: BRIDGE_PUBLIC_URL,
+    playerDeviceId: PLAYER_DEVICE_ID
   });
   registerPlayerRoutes(app, {
     pool: pool,
@@ -51,26 +314,240 @@ async function start() {
     assetDir: ASSET_DIR,
     playerRuntime: playerRuntime,
     playerPlaylistService: playerPlaylistService,
-    rtmpStreamService: rtmpStreamService
+    rtmpStreamService: rtmpStreamService,
+    playerInternalBaseUrl: PLAYER_INTERNAL_URL,
+    bridgeBaseUrl: BRIDGE_PUBLIC_URL,
+    playerDeviceId: PLAYER_DEVICE_ID,
+    onPlayerPublicBaseUrl: setPlayerPublicBaseUrl
   });
 
-  app.use(function (error, _req, res, _next) {
-    console.error(error);
-    res.status(error.statusCode || 500).send(error.statusCode ? error.message : 'Internal server error');
-  });
+  function createThinClientWebSocketUrl() {
+    if (!BRIDGE_PUBLIC_URL) {
+      return null;
+    }
 
-  fs.mkdirSync(MEDIA_DIR, { recursive: true });
+    return BRIDGE_PUBLIC_URL.replace(/^http:/i, 'ws:').replace(/^https:/i, 'wss:') + '/ws/players';
+  }
+
+  function startThinClientRegistration() {
+    const thinClientUrl = createThinClientWebSocketUrl();
+    if (!thinClientUrl) {
+      return null;
+    }
+
+    let socket = null;
+    let reconnectTimer = null;
+    let heartbeatTimer = null;
+
+    function clearTimers() {
+      if (reconnectTimer) {
+        clearTimeout(reconnectTimer);
+        reconnectTimer = null;
+      }
+      if (heartbeatTimer) {
+        clearInterval(heartbeatTimer);
+        heartbeatTimer = null;
+      }
+    }
+
+    function connect() {
+      clearTimers();
+      const timestamp = String(Date.now());
+      const authHeaders = createRequestAuthHeaders({
+        method: 'GET',
+        pathname: '/ws/players',
+        timestamp: timestamp
+      });
+      let webMediaSyncTriggered = false;
+      socket = new WebSocket(thinClientUrl, {
+        headers: Object.assign({
+          'x-pulse-request-timestamp': timestamp
+        }, authHeaders)
+      });
+      thinClientSocket = socket;
+
+      function sendHeartbeat() {
+        if (!socket || socket.readyState !== WebSocket.OPEN) {
+          return;
+        }
+
+        socket.send(JSON.stringify({
+          type: 'heartbeat',
+          deviceId: PLAYER_DEVICE_ID,
+          publicBaseUrl: getPlayerPublicBaseUrl(),
+          internalBaseUrl: PLAYER_INTERNAL_URL
+        }));
+      }
+
+      refreshThinClientRegistration = sendHeartbeat;
+
+      function triggerMediaSyncIfNeeded() {
+        if (webMediaSyncTriggered || webMediaSyncCompleted) {
+          return;
+        }
+
+        webMediaSyncTriggered = true;
+        triggerWebMediaSync().then(function (success) {
+          webMediaSyncCompleted = Boolean(success) || webMediaSyncCompleted;
+          if (!success) {
+            webMediaSyncTriggered = false;
+          }
+        }).catch(function () {
+          webMediaSyncTriggered = false;
+        });
+      }
+
+      function triggerFontSyncIfNeeded() {
+        if (webFontSyncTriggered || webFontSyncCompleted) {
+          return;
+        }
+
+        webFontSyncTriggered = true;
+        triggerWebFontSync().then(function (success) {
+          webFontSyncCompleted = Boolean(success) || webFontSyncCompleted;
+          if (!success) {
+            webFontSyncTriggered = false;
+          }
+        }).catch(function () {
+          webFontSyncTriggered = false;
+          webFontSyncCompleted = false;
+        });
+      }
+
+      function sendSnapshot(slug) {
+        if (!socket || socket.readyState !== WebSocket.OPEN) {
+          return;
+        }
+
+        try {
+          socket.send(JSON.stringify({
+            type: 'snapshot',
+            deviceId: PLAYER_DEVICE_ID,
+            slug: String(slug || '').trim(),
+            connections: playerRuntime.snapshotConnections(slug)
+          }));
+        } catch (_error) {
+        }
+      }
+
+      socket.on('open', function () {
+        logPlayerStartup({
+          connected: true
+        });
+
+        socket.send(JSON.stringify({
+          type: 'register',
+          deviceId: PLAYER_DEVICE_ID,
+          publicBaseUrl: getPlayerPublicBaseUrl(),
+          internalBaseUrl: PLAYER_INTERNAL_URL
+        }));
+
+        playerRuntime.snapshotSlugs().forEach(function (slug) {
+          sendSnapshot(slug);
+        });
+
+        heartbeatTimer = setInterval(function () {
+          sendHeartbeat();
+        }, DB_SYNC_INTERVAL_MS);
+      });
+
+      socket.on('message', function (rawMessage) {
+        let parsedMessage = null;
+        try {
+          parsedMessage = JSON.parse(String(rawMessage || '{}'));
+        } catch (_error) {
+          parsedMessage = null;
+        }
+
+        if (parsedMessage && String(parsedMessage.type || '').trim() === 'registered') {
+          sendHeartbeat();
+          return;
+        }
+
+        if (parsedMessage && String(parsedMessage.type || '').trim() === 'heartbeat-ack') {
+          if (shouldTriggerReconnectSync()) {
+            triggerMediaSyncIfNeeded();
+            triggerFontSyncIfNeeded();
+          }
+          return;
+        }
+
+        handleThinClientCommand(socket, rawMessage).catch(function (error) {
+          try {
+            socket.send(JSON.stringify({
+              type: 'command-response',
+              requestId: null,
+              ok: false,
+              error: error && error.message ? error.message : 'Command failed.'
+            }));
+          } catch (_sendError) {
+            // ignore send errors
+          }
+        });
+      });
+
+      socket.on('close', function () {
+        lastDisconnectAt = Date.now();
+        webFontSyncTriggered = false;
+        webFontSyncCompleted = false;
+        webMediaSyncCompleted = false;
+        clearTimers();
+        thinClientSocket = null;
+        refreshThinClientRegistration = null;
+        reconnectTimer = setTimeout(connect, PLAYER_AGENT_RECONNECT_DELAY_MS);
+      });
+
+      socket.on('error', function () {
+        try {
+          socket.close();
+        } catch (_error) {
+          // ignore reconnect noise
+        }
+      });
+    }
+
+    connect();
+    return function stop() {
+      clearTimers();
+      if (socket) {
+        try {
+          socket.close();
+        } catch (_error) {
+          // ignore close errors
+        }
+        socket = null;
+      }
+    };
+  }
+
+  if (!isRemotePlayer) {
+    logPlayerStartup({
+      connected: false
+    });
+  }
+
+  const stopThinClientRegistration = startThinClientRegistration();
 
   server.listen(PORT, function () {
     console.log(`Pulse Signage app listening on port ${PORT}`);
   });
 
   async function syncDatabaseState() {
+    if (isRemotePlayer) {
+      return;
+    }
+
     try {
-      await common.ensureSchema(pool);
+      await recordPlayerHeartbeat(pool, {
+        deviceId: PLAYER_DEVICE_ID,
+        publicBaseUrl: getPlayerPublicBaseUrl(),
+        internalBaseUrl: PLAYER_INTERNAL_URL
+      }).catch(function (error) {
+        console.error(error);
+      });
 
       if (playerRuntime.snapshotAllConnections().length > 0) {
-        await pruneStaleOnboardingDevices(pool);
+        await common.pruneStaleOnboardingDevices(pool);
       }
 
       await onboardingStore.flushBindings(function (entry) {
@@ -89,11 +566,28 @@ async function start() {
   }
 
   await syncDatabaseState();
+
+  if (PLAYER_DEVICE_ID && !isRemotePlayer) {
+    const { upsertPlayerRegistration } = require('./player/onboarding');
+    await upsertPlayerRegistration(pool, PLAYER_DEVICE_ID, getPlayerPublicBaseUrl(), PLAYER_INTERNAL_URL).catch(function (error) {
+      console.error(error);
+    });
+  }
+
   setInterval(function () {
+    if (isRemotePlayer) {
+      return;
+    }
     syncDatabaseState().catch(function (error) {
       console.error(error);
     });
   }, DB_SYNC_INTERVAL_MS);
+
+  process.on('exit', function () {
+    if (typeof stopThinClientRegistration === 'function') {
+      stopThinClientRegistration();
+    }
+  });
 }
 
 module.exports = { start };

src/player/announcement-templates/fullscreen.template.html

@@ -0,0 +1,55 @@
+<style>
+.player-announcement--fullscreen {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  display: grid;
+  place-items: center;
+  overflow: hidden;
+  color: {{FOREGROUND}};
+  background: {{ACCENT}};
+  --announcement-canvas-min: min(var(--player-canvas-width, 100vw), var(--player-canvas-height, 100vh));
+}
+
+.player-announcement--fullscreen .player-announcement__body {
+  width: 100%;
+  height: 100%;
+  display: grid;
+  place-items: center;
+  padding: clamp(36px, calc(var(--announcement-canvas-min) * 0.06), 96px);
+  box-sizing: border-box;
+}
+
+.player-announcement--fullscreen .player-announcement__stack {
+  display: grid;
+  justify-items: center;
+  align-content: center;
+  gap: clamp(12px, calc(var(--announcement-canvas-min) * 0.015), 24px);
+  text-align: center;
+}
+
+.player-announcement--fullscreen .player-announcement__icon {
+  width: clamp(6rem, calc(var(--announcement-canvas-min) * 0.16), 12rem);
+  height: clamp(6rem, calc(var(--announcement-canvas-min) * 0.16), 12rem);
+  display: grid;
+  place-items: center;
+  font-size: clamp(4rem, calc(var(--announcement-canvas-min) * 0.16), 10rem);
+  justify-content: center;
+}
+
+.player-announcement--fullscreen .player-announcement__message {
+  width: min(100%, calc(var(--announcement-canvas-min) * 1.35));
+  text-align: center;
+  font-size: clamp(2rem, calc(var(--announcement-canvas-min) * 0.065), 8rem);
+  font-weight: 900;
+  line-height: 1.08;
+}
+</style>
+<section class="player-announcement player-announcement--fullscreen player-announcement--color-{{COLOR_KEY}} shadow-lg" style="--announcement-accent: {{ACCENT}}; --announcement-foreground: {{FOREGROUND}}; --announcement-glow: {{GLOW}};">
+  <div class="player-announcement__body">
+    <div class="player-announcement__stack">
+      <div class="player-announcement__icon player-announcement__icon--fullscreen" aria-hidden="true"><i class="bi bi-{{ICON}}"></i></div>
+      <div class="player-announcement__message">{{MESSAGE}}</div>
+    </div>
+  </div>
+</section>

src/player/announcement-templates/lower-third.template.html

@@ -0,0 +1,186 @@
+<style>
+.player-announcement--lower-third {
+  position: relative;
+  width: 100%;
+  height: auto;
+  min-height: clamp(104px, calc(var(--announcement-canvas-min) * 0.098), 220px);
+  display: flex;
+  align-self: flex-end;
+  align-items: stretch;
+  overflow: hidden;
+  color: var(--announcement-foreground, #fff);
+  background: var(--announcement-accent, #0d6efd);
+  --announcement-canvas-min: min(var(--player-canvas-width), var(--player-canvas-height));
+}
+
+.player-announcement--lower-third .player-announcement__body {
+  position: relative;
+  width: 100%;
+  height: auto;
+  min-height: 0;
+  display: flex;
+  align-items: stretch;
+  overflow: hidden;
+  border-radius: inherit;
+}
+
+.player-announcement--lower-third .player-announcement__icon {
+  flex: 0 0 clamp(88px, calc(var(--announcement-canvas-min) * 0.08), 128px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  align-self: stretch;
+  padding: clamp(8px, calc(var(--announcement-canvas-min) * 0.01), 14px);
+  box-sizing: border-box;
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(0, 0, 0, 0.12)),
+    var(--announcement-accent, #0d6efd);
+  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.10) inset;
+}
+
+.player-announcement--lower-third .player-announcement__icon i {
+  font-size: clamp(2.2rem, calc(var(--announcement-canvas-min) * 0.032), 3rem);
+  color: rgba(255, 255, 255, 0.92);
+  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+}
+
+.player-announcement--lower-third .player-announcement__content {
+  position: relative;
+  flex: 1 1 auto;
+  min-width: 0;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  padding: clamp(6px, calc(var(--announcement-canvas-min) * 0.008), 12px) 0;
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.03)),
+    linear-gradient(90deg, rgba(255, 255, 255, 0.06), transparent 20%),
+    var(--announcement-accent, #0d6efd);
+  box-shadow:
+    inset 1px 0 0 rgba(255, 255, 255, 0.10),
+    0 0 0 1px rgba(255, 255, 255, 0.12) inset;
+}
+
+.player-announcement--lower-third .player-announcement__content::after {
+  content: '';
+  position: absolute;
+  inset: auto 0 0 0;
+  height: 3px;
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.68), transparent);
+  opacity: 0.75;
+}
+
+.player-announcement--lower-third .player-announcement__kicker {
+  position: relative;
+  z-index: 1;
+  margin-bottom: 6px;
+  color: rgba(255, 255, 255, 0.78);
+  font-size: clamp(0.8rem, calc(var(--announcement-canvas-min) * 0.009), 1rem);
+  font-weight: 900;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+}
+
+.player-announcement--lower-third .player-announcement__message {
+  position: relative;
+  z-index: 1;
+  width: 100%;
+  color: #fff;
+  font-size: clamp(2.5rem, calc(var(--announcement-canvas-min) * 0.028), 3.4rem);
+  font-weight: 700;
+  line-height: 1.05;
+  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.player-announcement--lower-third .player-announcement__message-track {
+  display: inline-flex;
+  align-items: center;
+  gap: 2.5rem;
+  width: max-content;
+  backface-visibility: hidden;
+  will-change: transform;
+  animation: lower-third-scroll var(--announcement-scroll-duration, 20s) linear infinite;
+}
+
+.player-announcement--lower-third .player-announcement__message-text {
+  display: inline-block;
+  flex: 0 0 auto;
+}
+
+@media (orientation: portrait) {
+  .player-announcement--lower-third {
+    min-height: clamp(76px, calc(var(--announcement-canvas-min) * 0.068), 142px);
+  }
+
+  .player-announcement--lower-third .player-announcement__icon {
+    flex-basis: clamp(56px, calc(var(--announcement-canvas-min) * 0.052), 84px);
+    padding: clamp(4px, calc(var(--announcement-canvas-min) * 0.005), 7px);
+  }
+
+  .player-announcement--lower-third .player-announcement__icon i {
+    font-size: clamp(1.6rem, calc(var(--announcement-canvas-min) * 0.022), 2.3rem);
+  }
+
+  .player-announcement--lower-third .player-announcement__content {
+    padding: clamp(4px, calc(var(--announcement-canvas-min) * 0.005), 7px) 0;
+  }
+
+  .player-announcement--lower-third .player-announcement__kicker {
+    margin-bottom: 2px;
+    font-size: clamp(0.68rem, calc(var(--announcement-canvas-min) * 0.007), 0.86rem);
+  }
+
+  .player-announcement--lower-third .player-announcement__message {
+    font-size: clamp(1.7rem, calc(var(--announcement-canvas-min) * 0.021), 2.35rem);
+  }
+
+  .player-announcement--lower-third .player-announcement__message-track {
+    gap: 1.25rem;
+  }
+}
+
+@keyframes lower-third-scroll {
+  from {
+    transform: translate3d(0, 0, 0);
+  }
+  to {
+    transform: translate3d(calc(-1 * var(--announcement-scroll-distance, 0px)), 0, 0);
+  }
+}
+</style>
+<section class="player-announcement player-announcement--lower-third player-announcement--color-{{COLOR_KEY}} shadow-lg" style="--announcement-accent: {{ACCENT}}; --announcement-foreground: {{FOREGROUND}}; --announcement-glow: {{GLOW}};">
+  <div class="player-announcement__body">
+    <div class="player-announcement__icon" aria-hidden="true">
+      <i class="bi bi-{{ICON}}"></i>
+    </div>
+    <div class="player-announcement__content">
+      <div class="player-announcement__message">
+        <span class="player-announcement__message-track" data-announcement-marquee-rate="88">
+          <span class="player-announcement__message-text">{{MESSAGE}}</span>
+          <span class="player-announcement__message-text" aria-hidden="true">{{MESSAGE}}</span>
+        </span>
+      </div>
+    </div>
+  </div>
+</section>
+<script>
+(function () {
+  var currentScript = document.currentScript;
+  var root = currentScript && currentScript.previousElementSibling && currentScript.previousElementSibling.classList && currentScript.previousElementSibling.classList.contains('player-announcement--lower-third')
+    ? currentScript.previousElementSibling
+    : null;
+  if (!root) {
+    return;
+  }
+
+  var track = root.querySelector('.player-announcement__message-track');
+  if (!track || typeof window.initPlayerAnnouncementMarquee !== 'function') {
+    return;
+  }
+
+  window.initPlayerAnnouncementMarquee(track, { container: root.querySelector('.player-announcement__message') || root });
+}());
+</script>

src/player/announcement-templates/top-banner.template.html

@@ -0,0 +1,188 @@
+<style>
+.player-announcement--top-banner {
+  position: absolute;
+  inset: 0 0 auto 0;
+  width: 100%;
+  height: auto;
+  min-height: clamp(104px, calc(var(--announcement-canvas-min) * 0.098), 220px);
+  display: flex;
+  align-self: flex-start;
+  align-items: stretch;
+  overflow: hidden;
+  color: var(--announcement-foreground, #fff);
+  background: var(--announcement-accent, #0d6efd);
+  --announcement-canvas-min: min(var(--player-canvas-width), var(--player-canvas-height));
+  z-index: 1;
+}
+
+.player-announcement--top-banner .player-announcement__body {
+  position: relative;
+  width: 100%;
+  height: auto;
+  min-height: 0;
+  display: flex;
+  align-items: stretch;
+  overflow: hidden;
+  border-radius: inherit;
+}
+
+.player-announcement--top-banner .player-announcement__icon {
+  flex: 0 0 clamp(88px, calc(var(--announcement-canvas-min) * 0.08), 128px);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  align-self: stretch;
+  padding: clamp(8px, calc(var(--announcement-canvas-min) * 0.01), 14px);
+  box-sizing: border-box;
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(0, 0, 0, 0.12)),
+    var(--announcement-accent, #0d6efd);
+  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.10) inset;
+}
+
+.player-announcement--top-banner .player-announcement__icon i {
+  font-size: clamp(2.2rem, calc(var(--announcement-canvas-min) * 0.032), 3rem);
+  color: rgba(255, 255, 255, 0.92);
+  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+}
+
+.player-announcement--top-banner .player-announcement__content {
+  position: relative;
+  flex: 1 1 auto;
+  min-width: 0;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  padding: clamp(6px, calc(var(--announcement-canvas-min) * 0.008), 12px) 0;
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.03)),
+    linear-gradient(90deg, rgba(255, 255, 255, 0.06), transparent 20%),
+    var(--announcement-accent, #0d6efd);
+  box-shadow:
+    inset 1px 0 0 rgba(255, 255, 255, 0.10),
+    0 0 0 1px rgba(255, 255, 255, 0.12) inset;
+}
+
+.player-announcement--top-banner .player-announcement__content::after {
+  content: '';
+  position: absolute;
+  inset: auto 0 0 0;
+  height: 3px;
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.68), transparent);
+  opacity: 0.75;
+}
+
+.player-announcement--top-banner .player-announcement__kicker {
+  position: relative;
+  z-index: 1;
+  margin-bottom: 6px;
+  color: rgba(255, 255, 255, 0.78);
+  font-size: clamp(0.8rem, calc(var(--announcement-canvas-min) * 0.009), 1rem);
+  font-weight: 900;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+}
+
+.player-announcement--top-banner .player-announcement__message {
+  position: relative;
+  z-index: 1;
+  width: 100%;
+  color: #fff;
+  font-size: clamp(2.5rem, calc(var(--announcement-canvas-min) * 0.028), 3.4rem);
+  font-weight: 700;
+  line-height: 1.05;
+  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.player-announcement--top-banner .player-announcement__message-track {
+  display: inline-flex;
+  align-items: center;
+  gap: 2.5rem;
+  width: max-content;
+  backface-visibility: hidden;
+  will-change: transform;
+  animation: top-banner-scroll var(--announcement-scroll-duration, 20s) linear infinite;
+}
+
+.player-announcement--top-banner .player-announcement__message-text {
+  display: inline-block;
+  flex: 0 0 auto;
+}
+
+@media (orientation: portrait) {
+  .player-announcement--top-banner {
+    min-height: clamp(76px, calc(var(--announcement-canvas-min) * 0.068), 142px);
+  }
+
+  .player-announcement--top-banner .player-announcement__icon {
+    flex-basis: clamp(56px, calc(var(--announcement-canvas-min) * 0.052), 84px);
+    padding: clamp(4px, calc(var(--announcement-canvas-min) * 0.005), 7px);
+  }
+
+  .player-announcement--top-banner .player-announcement__icon i {
+    font-size: clamp(1.6rem, calc(var(--announcement-canvas-min) * 0.022), 2.3rem);
+  }
+
+  .player-announcement--top-banner .player-announcement__content {
+    padding: clamp(4px, calc(var(--announcement-canvas-min) * 0.005), 7px) 0;
+  }
+
+  .player-announcement--top-banner .player-announcement__kicker {
+    margin-bottom: 2px;
+    font-size: clamp(0.68rem, calc(var(--announcement-canvas-min) * 0.007), 0.86rem);
+  }
+
+  .player-announcement--top-banner .player-announcement__message {
+    font-size: clamp(1.7rem, calc(var(--announcement-canvas-min) * 0.021), 2.35rem);
+  }
+
+  .player-announcement--top-banner .player-announcement__message-track {
+    gap: 1.25rem;
+  }
+}
+
+@keyframes top-banner-scroll {
+  from {
+    transform: translate3d(0, 0, 0);
+  }
+  to {
+    transform: translate3d(calc(-1 * var(--announcement-scroll-distance, 0px)), 0, 0);
+  }
+}
+</style>
+<section class="player-announcement player-announcement--top-banner player-announcement--color-{{COLOR_KEY}} shadow-lg" style="--announcement-accent: {{ACCENT}}; --announcement-foreground: {{FOREGROUND}}; --announcement-glow: {{GLOW}};">
+  <div class="player-announcement__body">
+    <div class="player-announcement__icon" aria-hidden="true">
+      <i class="bi bi-{{ICON}}"></i>
+    </div>
+    <div class="player-announcement__content">
+      <div class="player-announcement__message">
+        <span class="player-announcement__message-track" data-announcement-marquee-rate="88">
+          <span class="player-announcement__message-text">{{MESSAGE}}</span>
+          <span class="player-announcement__message-text" aria-hidden="true">{{MESSAGE}}</span>
+        </span>
+      </div>
+    </div>
+  </div>
+</section>
+<script>
+(function () {
+  var currentScript = document.currentScript;
+  var root = currentScript && currentScript.previousElementSibling && currentScript.previousElementSibling.classList && currentScript.previousElementSibling.classList.contains('player-announcement--top-banner')
+    ? currentScript.previousElementSibling
+    : null;
+  if (!root) {
+    return;
+  }
+
+  var track = root.querySelector('.player-announcement__message-track');
+  if (!track || typeof window.initPlayerAnnouncementMarquee !== 'function') {
+    return;
+  }
+
+  window.initPlayerAnnouncementMarquee(track, { container: root.querySelector('.player-announcement__message') || root });
+}());
+</script>

src/player/modules/rtmp-streams.js

@@ -1,3 +1,5 @@
+// RTMP stream session management and ffmpeg probe orchestration.
+
 const crypto = require('crypto');
 const fs = require('fs');
 const path = require('path');
@@ -6,7 +8,13 @@ const { spawn } = require('child_process');
 function createRtmpStreamService(options) {
   const mediaDir = options && options.mediaDir ? options.mediaDir : null;
   const ffmpegPath = options && options.ffmpegPath ? options.ffmpegPath : 'ffmpeg';
+  const ffprobePath = options && options.ffprobePath ? options.ffprobePath : 'ffprobe';
+  const probeIntervalMs = options && options.probeIntervalMs ? Number(options.probeIntervalMs) : 2000;
   const sessions = new Map();
+  const watchedSources = new Set();
+  const sourceStatusCache = new Map();
+  const sourceProbePromises = new Map();
+  let probeTimer = null;
 
   if (!mediaDir) {
     throw new Error('mediaDir is required');
@@ -48,6 +56,207 @@ function createRtmpStreamService(options) {
     return false;
   }
 
+  function runCommand(command, args, timeoutMs) {
+    return new Promise(function (resolve) {
+      var child = spawn(command, args, {
+        stdio: ['ignore', 'pipe', 'pipe']
+      });
+      var stdout = '';
+      var stderr = '';
+      var finished = false;
+      var timer = null;
+
+      function done(result) {
+        if (finished) {
+          return;
+        }
+        finished = true;
+        if (timer) {
+          clearTimeout(timer);
+          timer = null;
+        }
+        resolve(result);
+      }
+
+      child.stdout.on('data', function (chunk) {
+        stdout += String(chunk || '');
+      });
+
+      child.stderr.on('data', function (chunk) {
+        stderr += String(chunk || '');
+      });
+
+      child.on('error', function (error) {
+        done({ ok: false, error: error, stdout: stdout, stderr: stderr, timedOut: false });
+      });
+
+      child.on('exit', function (code, signal) {
+        done({ ok: code === 0, code: code, signal: signal, stdout: stdout, stderr: stderr, timedOut: false });
+      });
+
+      timer = setTimeout(function () {
+        try {
+          child.kill('SIGKILL');
+        } catch (_error) {
+          // ignore timeout cleanup errors
+        }
+        done({ ok: false, code: null, signal: 'SIGKILL', stdout: stdout, stderr: stderr, timedOut: true });
+      }, Math.max(1000, Number(timeoutMs || 0) || 4000));
+    });
+  }
+
+  async function probeSourceUrl(sourceUrl) {
+    const normalizedSource = normalizeSourceUrl(sourceUrl);
+    const result = await runCommand(ffprobePath, [
+      '-hide_banner',
+      '-loglevel', 'error',
+      '-rw_timeout', '3000000',
+      '-show_streams',
+      '-of', 'json',
+      normalizedSource
+    ], 4000);
+
+    if (!result.ok) {
+      return {
+        live: false,
+        timedOut: Boolean(result.timedOut),
+        stderr: String(result.stderr || '').trim()
+      };
+    }
+
+    try {
+      const parsed = JSON.parse(String(result.stdout || '{}'));
+      const streams = Array.isArray(parsed && parsed.streams) ? parsed.streams : [];
+      return {
+        live: streams.length > 0,
+        timedOut: false,
+        stderr: String(result.stderr || '').trim()
+      };
+    } catch (_error) {
+      return {
+        live: false,
+        timedOut: false,
+        stderr: String(result.stderr || '').trim()
+      };
+    }
+  }
+
+  function getSourceStatus(sourceUrl) {
+    return sourceStatusCache.get(String(sourceUrl || '').trim()) || null;
+  }
+
+  function setSourceStatus(sourceUrl, nextStatus) {
+    const normalizedSource = String(sourceUrl || '').trim();
+    if (!normalizedSource) {
+      return null;
+    }
+    const status = Object.assign({
+      live: false,
+      probing: false,
+      checkedAt: Date.now(),
+      timedOut: false,
+      stderr: ''
+    }, nextStatus || {});
+    status.live = Boolean(status.live);
+    status.probing = Boolean(status.probing);
+    status.checkedAt = Number(status.checkedAt || Date.now());
+    sourceStatusCache.set(normalizedSource, status);
+    return status;
+  }
+
+  function registerSourceWatch(sourceUrl) {
+    const normalizedSource = normalizeSourceUrl(sourceUrl);
+    watchedSources.add(normalizedSource);
+    return normalizedSource;
+  }
+
+  async function refreshSourceStatus(sourceUrl) {
+    const normalizedSource = registerSourceWatch(sourceUrl);
+    const existingPromise = sourceProbePromises.get(normalizedSource) || null;
+    if (existingPromise) {
+      return existingPromise;
+    }
+
+    setSourceStatus(normalizedSource, Object.assign({}, getSourceStatus(normalizedSource) || {}, {
+      probing: true
+    }));
+
+    const probePromise = probeSourceUrl(normalizedSource).then(function (probe) {
+      return setSourceStatus(normalizedSource, {
+        live: Boolean(probe.live),
+        probing: false,
+        checkedAt: Date.now(),
+        timedOut: Boolean(probe.timedOut),
+        stderr: String(probe.stderr || '')
+      });
+    }).catch(function (error) {
+      return setSourceStatus(normalizedSource, {
+        live: false,
+        probing: false,
+        checkedAt: Date.now(),
+        timedOut: false,
+        stderr: String(error && error.message ? error.message : '')
+      });
+    }).finally(function () {
+      sourceProbePromises.delete(normalizedSource);
+    });
+
+    sourceProbePromises.set(normalizedSource, probePromise);
+    return probePromise;
+  }
+
+  function scheduleSourceRefresh(sourceUrl) {
+    const normalizedSource = registerSourceWatch(sourceUrl);
+    const currentStatus = getSourceStatus(normalizedSource);
+    if (currentStatus && currentStatus.probing) {
+      return sourceProbePromises.get(normalizedSource) || Promise.resolve(currentStatus);
+    }
+    return refreshSourceStatus(normalizedSource);
+  }
+
+  function isSourceStatusFresh(status) {
+    if (!status || !status.checkedAt) {
+      return false;
+    }
+    return Date.now() - Number(status.checkedAt || 0) < probeIntervalMs;
+  }
+
+  function sweepWatchedSources() {
+    watchedSources.forEach(function (sourceUrl) {
+      const status = getSourceStatus(sourceUrl);
+      if (!status || !isSourceStatusFresh(status) || status.live === false) {
+        scheduleSourceRefresh(sourceUrl);
+      }
+    });
+  }
+
+  if (probeIntervalMs > 0) {
+    probeTimer = setInterval(function () {
+      sweepWatchedSources();
+    }, probeIntervalMs);
+    if (probeTimer && typeof probeTimer.unref === 'function') {
+      probeTimer.unref();
+    }
+  }
+
+  async function isSessionLive(session) {
+    if (!session || !session.process) {
+      return false;
+    }
+    if (session.exitCode !== undefined && session.exitCode !== null) {
+      return false;
+    }
+    if (session.exitSignal !== undefined && session.exitSignal !== null) {
+      return false;
+    }
+    try {
+      const stat = await fs.promises.stat(session.manifestPath);
+      return stat.isFile() && stat.size > 0;
+    } catch (_error) {
+      return false;
+    }
+  }
+
   function buildPlaylistUrl(key) {
     return '/api/rtmp/streams/' + encodeURIComponent(key) + '/index.m3u8';
   }
@@ -56,14 +265,30 @@ function createRtmpStreamService(options) {
     const normalizedSource = normalizeSourceUrl(sourceUrl);
     const normalizedDisableAudio = Boolean(disableAudio);
     const key = getSessionKey(normalizedSource, normalizedDisableAudio);
-
-    if (sessions.has(key)) {
-      return sessions.get(key);
-    }
-
     const directory = path.join(cacheRoot, key);
     const manifestPath = path.join(directory, 'index.m3u8');
 
+    const existingSession = sessions.get(key) || null;
+    if (existingSession && existingSession.process && existingSession.exitCode === null && existingSession.exitSignal === null) {
+      return existingSession;
+    }
+
+    if (existingSession) {
+      sessions.delete(key);
+      try {
+        if (existingSession.process && typeof existingSession.process.kill === 'function') {
+          existingSession.process.kill('SIGKILL');
+        }
+      } catch (_error) {
+        // ignore cleanup errors
+      }
+      try {
+        await fs.promises.rm(directory, { recursive: true, force: true });
+      } catch (_error2) {
+        // ignore cleanup errors
+      }
+    }
+
     await ensureDirectory(directory);
 
     const args = [
@@ -117,6 +342,8 @@ function createRtmpStreamService(options) {
       manifestPath: manifestPath,
       playlistUrl: buildPlaylistUrl(key),
       process: child,
+      exitCode: null,
+      exitSignal: null,
       ready: waitForFile(manifestPath, 5000)
     };
 
@@ -132,6 +359,51 @@ function createRtmpStreamService(options) {
     return session.playlistUrl + '?t=' + Date.now();
   }
 
+  async function getSessionStatus(sourceUrl, disableAudio) {
+    const normalizedSource = normalizeSourceUrl(sourceUrl);
+    const normalizedDisableAudio = Boolean(disableAudio);
+    registerSourceWatch(normalizedSource);
+
+    let sourceStatus = getSourceStatus(normalizedSource);
+    if (!sourceStatus) {
+      scheduleSourceRefresh(normalizedSource).catch(function (_error) {
+        return null;
+      });
+      sourceStatus = getSourceStatus(normalizedSource);
+    } else if (!isSourceStatusFresh(sourceStatus) && !sourceStatus.probing) {
+      scheduleSourceRefresh(normalizedSource).catch(function (_error) {
+        return null;
+      });
+    }
+
+    if (!sourceStatus || !sourceStatus.live) {
+      return {
+        session: null,
+        ready: false,
+        live: false,
+        probing: Boolean(sourceStatus && sourceStatus.probing),
+        checkedAt: sourceStatus ? sourceStatus.checkedAt : null,
+        timedOut: Boolean(sourceStatus && sourceStatus.timedOut),
+        stderr: String(sourceStatus && sourceStatus.stderr || '')
+      };
+    }
+
+    const session = await ensureSession(normalizedSource, normalizedDisableAudio);
+    const ready = await session.ready.catch(function () {
+      return false;
+    });
+    const live = ready && Boolean(session && session.process && session.exitCode === null && session.exitSignal === null);
+    return {
+      session: session,
+      ready: ready,
+      live: live,
+      probing: Boolean(sourceStatus && sourceStatus.probing),
+      checkedAt: sourceStatus ? sourceStatus.checkedAt : null,
+      timedOut: false,
+      stderr: ''
+    };
+  }
+
   function getSessionByKey(key) {
     return sessions.get(String(key || '').trim()) || null;
   }
@@ -141,9 +413,13 @@ function createRtmpStreamService(options) {
     if (!session) {
       return null;
     }
-    await session.ready.catch(function () {
-      return false;
-    });
+    if (!session.process || session.exitCode !== null || session.exitSignal !== null) {
+      return null;
+    }
+    const live = await isSessionLive(session);
+    if (!live) {
+      return null;
+    }
     return session.manifestPath;
   }
 
@@ -163,6 +439,11 @@ function createRtmpStreamService(options) {
     ensureSession: ensureSession,
     getPlaylistUrl: getPlaylistUrl,
     getSessionByKey: getSessionByKey,
+    isSessionLive: isSessionLive,
+    getSessionStatus: getSessionStatus,
+    refreshSourceStatus: refreshSourceStatus,
+    scheduleSourceRefresh: scheduleSourceRefresh,
+    getSourceStatus: getSourceStatus,
     getManifestFilePath: getManifestFilePath,
     getSegmentFilePath: getSegmentFilePath
   };

src/player/onboarding/index.js

@@ -1,5 +1,10 @@
-const { isClientNameAvailable, withClientNameReservation } = require('../../data/client-name-check');
-const { getSharedSecret, verifyPageAuthToken } = require('../../request-auth');
+// Player onboarding routes and signup flow helpers.
+
+const express = require('express');
+const { isClientNameAvailable, withClientNameReservation } = require('#src/data/client-name-check');
+const { createStyledQrCodeSvg } = require('#src/data/qr-code');
+const { getSharedSecret, verifyPageAuthToken, createRequestAuthHeaders } = require('#src/request-auth');
+const { resolvePlayerRegistration, upsertPlayerRegistration: upsertPlayerRegistrationRecord } = require('#src/data/player-registry');
 const { isTransientDbError } = require('./store');
 
 const ONBOARDING_SIGNUP_LIMIT_WINDOW_MS = 5 * 60 * 1000;
@@ -10,16 +15,17 @@ function normalizeDeviceId(value) {
   return String(value || '').trim().replace(/[^a-zA-Z0-9_-]/g, '').slice(0, 128);
 }
 
-function getPublicBaseUrl(req) {
-  const configured = String(process.env.PLAYER_PUBLIC_BASE_URL || process.env.PLAYER_BASE_URL || '').trim().replace(/\/$/, '');
-  if (configured) {
-    return configured;
-  }
+function getPublicBaseUrl(req, configuredUrl) {
   const forwardedProto = String(req.headers['x-forwarded-proto'] || '').trim().split(',')[0];
   const protocol = forwardedProto || (req.socket && req.socket.encrypted ? 'https' : 'http');
   const forwardedHost = String(req.headers['x-forwarded-host'] || '').trim().split(',')[0];
   const host = forwardedHost || String(req.headers.host || '').trim();
-  return `${protocol}://${host}`.replace(/\/$/, '');
+  if (host) {
+    return `${protocol}://${host}`.replace(/\/$/, '');
+  }
+
+  const configured = String(configuredUrl || process.env.PLAYER_PUBLIC_URL || process.env.PLAYER_BASE_URL || '').trim().replace(/\/$/, '');
+  return configured || null;
 }
 
 function getRequestIp(req) {
@@ -40,6 +46,15 @@ function getOnboardingLimitKey(req, deviceId) {
   return [getRequestIp(req), normalizeDeviceId(deviceId) || 'anonymous'].join('|');
 }
 
+function getPlayerPublicBaseUrl(req, configuredUrl) {
+  return getPublicBaseUrl(req, configuredUrl);
+}
+
+function getPlayerInternalBaseUrl(configuredUrl) {
+  const configured = String(configuredUrl || process.env.PLAYER_INTERNAL_URL || process.env.PLAYER_BASE_URL || '').trim().replace(/\/$/, '');
+  return configured || null;
+}
+
 function clearOnboardingSignupAttempts() {
   if (onboardingSignupAttempts.size > 1000) {
     onboardingSignupAttempts.clear();
@@ -74,8 +89,8 @@ async function getOnboardingStatus(pool, deviceId) {
 
   const [rows] = await pool.query(
     `SELECT d.device_id, d.client_name, d.screen_id, s.name AS screen_name, s.slug AS screen_slug, s.playlist_id
-     FROM player_onboarding_devices d
-     LEFT JOIN screens s ON s.id = d.screen_id
+    FROM d_onboarding_devices d
+    LEFT JOIN d_screens s ON s.id = d.screen_id
      WHERE d.device_id = ?`,
     [normalizedDeviceId]
   );
@@ -99,7 +114,7 @@ async function commitDeviceBinding(pool, deviceId, clientName, screenSlug, isNam
   }
 
   return withClientNameReservation(pool, normalizedClientName, async function () {
-    const [screenRows] = await pool.query('SELECT id, name, slug FROM screens WHERE slug = ?', [normalizedScreenSlug]);
+    const [screenRows] = await pool.query('SELECT id, name, slug FROM d_screens WHERE slug = ?', [normalizedScreenSlug]);
     if (!screenRows.length) {
       throw new Error('Screen not found.');
     }
@@ -113,14 +128,57 @@ async function commitDeviceBinding(pool, deviceId, clientName, screenSlug, isNam
     }
 
     await pool.query(
-      'INSERT INTO player_onboarding_devices (device_id, client_name, screen_id) VALUES (?, ?, ?) ON DUPLICATE KEY UPDATE client_name = VALUES(client_name), screen_id = VALUES(screen_id), modified_at = CURRENT_TIMESTAMP',
-      [normalizedDeviceId, normalizedClientName, screen.id]
+      `UPDATE d_onboarding_devices
+          SET client_name = ?, screen_id = ?, modified_at = CURRENT_TIMESTAMP
+        WHERE device_id = ?`,
+      [normalizedClientName, screen.id, normalizedDeviceId]
+    );
+    await pool.query(
+      `INSERT INTO d_onboarding_devices (device_id, client_name, screen_id)
+       SELECT ?, ?, ?
+        WHERE NOT EXISTS (
+          SELECT 1 FROM d_onboarding_devices WHERE device_id = ?
+        )`,
+      [normalizedDeviceId, normalizedClientName, screen.id, normalizedDeviceId]
     );
 
     return getOnboardingStatus(pool, normalizedDeviceId);
   });
 }
 
+async function upsertPlayerRegistration(pool, deviceId, publicBaseUrl, internalBaseUrl) {
+  const normalizedDeviceId = normalizeDeviceId(deviceId);
+  const normalizedPublicBaseUrl = String(publicBaseUrl || '').trim().replace(/\/$/, '');
+  const normalizedInternalBaseUrl = String(internalBaseUrl || '').trim().replace(/\/$/, '');
+  if (!normalizedDeviceId) {
+    return null;
+  }
+
+  return upsertPlayerRegistrationRecord(pool, {
+    identifier: normalizedDeviceId,
+    publicBaseUrl: normalizedPublicBaseUrl || null,
+    internalBaseUrl: normalizedInternalBaseUrl || null
+  });
+}
+
+async function bindPlayerToScreen(pool, deviceId, screenSlug) {
+  const normalizedDeviceId = normalizeDeviceId(deviceId);
+  const normalizedScreenSlug = String(screenSlug || '').trim();
+  if (!normalizedDeviceId || !normalizedScreenSlug) {
+    return null;
+  }
+
+  const [screenRows] = await pool.query('SELECT id FROM d_screens WHERE slug = ? LIMIT 1', [normalizedScreenSlug]);
+  if (!screenRows.length) {
+    return null;
+  }
+
+  return {
+    screen_id: Number(screenRows[0].id),
+    screen_slug: normalizedScreenSlug
+  };
+}
+
 async function bindDeviceToScreen(pool, deviceId, clientName, screenSlug, isNameAvailableOnScreen, playerRuntime, onboardingStore) {
   const liveConnections = playerRuntime && typeof playerRuntime.snapshotAllConnections === 'function'
     ? playerRuntime.snapshotAllConnections()
@@ -155,15 +213,67 @@ function registerPlayerOnboardingRoutes(app, options) {
   const pool = options && options.pool ? options.pool : null;
   const common = options && options.common ? options.common : null;
   const playerRuntime = options && options.playerRuntime ? options.playerRuntime : null;
-  const QRCode = options && options.QRCode ? options.QRCode : 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 bridgeBaseUrl = String(options && options.bridgeBaseUrl || process.env.BRIDGE_PUBLIC_URL || '').trim().replace(/\/$/, '');
+  const playerDeviceId = normalizeDeviceId(options && options.playerDeviceId);
 
-  if (!app || !pool || !common || !playerRuntime || !QRCode) {
-    throw new Error('registerPlayerOnboardingRoutes requires app, pool, common, playerRuntime, and QRCode.');
+  if (!app || !common) {
+    throw new Error('registerPlayerOnboardingRoutes requires app and common.');
+  }
+
+  if (!bridgeBaseUrl && (!pool || !playerRuntime)) {
+    throw new Error('registerPlayerOnboardingRoutes requires pool and playerRuntime unless bridgeBaseUrl is configured.');
   }
 
   const sharedSecret = getSharedSecret();
 
+  async function fetchThinClient(req, pathname, options) {
+    if (!bridgeBaseUrl) {
+      return null;
+    }
+
+    const requestOptions = options && typeof options === 'object' ? options : {};
+    const method = String(requestOptions.method || req.method || 'GET').trim().toUpperCase();
+    const body = Object.prototype.hasOwnProperty.call(requestOptions, 'body') ? requestOptions.body : undefined;
+    const requestPathname = String(pathname || '').split('?')[0];
+    const headers = Object.assign({}, requestOptions.headers || {}, createRequestAuthHeaders({
+      method: method,
+      pathname: requestPathname,
+      body: body
+    }));
+
+    if (req.headers['x-pulse-page-auth']) {
+      headers['x-pulse-page-auth'] = String(req.headers['x-pulse-page-auth']).trim();
+    }
+    if (requestOptions.contentType) {
+      headers['content-type'] = requestOptions.contentType;
+    }
+
+    return fetch(new URL(pathname, bridgeBaseUrl).toString(), {
+      method: method,
+      headers: headers,
+      body: body === undefined || body === null || method === 'GET' || method === 'HEAD' ? undefined : body
+    });
+  }
+
+  async function readJsonResponse(response) {
+    if (!response) {
+      return null;
+    }
+
+    const contentType = String(response.headers && typeof response.headers.get === 'function' ? response.headers.get('content-type') : '').toLowerCase();
+    if (contentType.indexOf('application/json') === -1 && contentType.indexOf('+json') === -1) {
+      return null;
+    }
+
+    try {
+      return await response.json();
+    } catch (_error) {
+      return null;
+    }
+  }
+
   function requireOnboardingPageAuth(req, res, next) {
     if (!sharedSecret) {
       return next();
@@ -184,9 +294,13 @@ function registerPlayerOnboardingRoutes(app, options) {
     res.send(common.renderPlayerOnboardingLandingPage());
   });
 
-  app.get('/onboard', function (req, res) {
+  app.get('/onboard', async function (req, res, next) {
     res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
-    res.send(common.renderPlayerOnboardingFormPage(String(req.query.deviceId || '').trim()));
+    try {
+      res.send(common.renderPlayerOnboardingFormPage(String(req.query.deviceId || playerDeviceId || '').trim()));
+    } catch (error) {
+      next(error);
+    }
   });
 
   app.get('/api/onboarding/status', function (req, res, next) {
@@ -201,15 +315,32 @@ function registerPlayerOnboardingRoutes(app, options) {
     next();
   }, async function (req, res, next) {
     try {
-      const status = await getOnboardingStatus(pool, req.query.deviceId);
+      const deviceId = normalizeDeviceId(req.query.deviceId) || playerDeviceId;
+      if (bridgeBaseUrl) {
+        const response = await fetchThinClient(req, '/api/onboarding/status?deviceId=' + encodeURIComponent(deviceId || ''), {
+          method: 'GET'
+        });
+        if (!response) {
+          return res.status(502).json({ error: 'Player bridge unavailable.' });
+        }
+        res.status(response.status);
+        const payload = await readJsonResponse(response);
+        if (!payload) {
+          return res.status(502).json({ error: 'Player bridge returned an invalid response.' });
+        }
+        payload.playerUrl = payload && payload.screenSlug ? `${getPublicBaseUrl(req, playerPublicUrl)}/screen/${encodeURIComponent(payload.screenSlug)}` : null;
+        return res.json(payload);
+      }
+
+      const status = await getOnboardingStatus(pool, deviceId);
       res.json({
-        deviceId: normalizeDeviceId(req.query.deviceId),
+        deviceId: normalizeDeviceId(deviceId),
         onboarded: Boolean(status && status.screen_id),
         clientName: status ? status.client_name : null,
         screenId: status ? status.screen_id : null,
         screenSlug: status ? status.screen_slug : null,
         screenName: status ? status.screen_name : null,
-        playerUrl: status && status.screen_slug ? `${getPublicBaseUrl(req)}/screen/${encodeURIComponent(status.screen_slug)}` : null
+        playerUrl: status && status.screen_slug ? `${getPublicBaseUrl(req, playerPublicUrl)}/screen/${encodeURIComponent(status.screen_slug)}` : null
       });
     } catch (error) {
       next(error);
@@ -218,7 +349,17 @@ function registerPlayerOnboardingRoutes(app, options) {
 
   app.get('/api/onboarding/screens', requireOnboardingPageAuth, async function (_req, res, next) {
     try {
-      const [rows] = await pool.query('SELECT id, name, slug FROM screens ORDER BY name ASC, id ASC');
+      if (bridgeBaseUrl) {
+        const response = await fetchThinClient(_req, '/api/onboarding/screens', {
+          method: 'GET'
+        });
+        res.status(response.status);
+        const text = await response.text();
+        res.type(response.headers.get('content-type') || 'application/json');
+        return res.send(text);
+      }
+
+      const [rows] = await pool.query('SELECT id, name, slug FROM d_screens ORDER BY name ASC, id ASC');
       res.json({ screens: rows });
     } catch (error) {
       next(error);
@@ -227,12 +368,12 @@ function registerPlayerOnboardingRoutes(app, options) {
 
   app.get('/api/onboarding/qr', async function (req, res, next) {
     try {
-      const deviceId = normalizeDeviceId(req.query.deviceId);
+      const deviceId = normalizeDeviceId(req.query.deviceId) || playerDeviceId;
       if (!deviceId) {
         return res.status(400).json({ error: 'Device ID is required' });
       }
-      const onboardingUrl = `${getPublicBaseUrl(req)}/onboard?deviceId=${encodeURIComponent(deviceId)}`;
-      const svg = await QRCode.toString(onboardingUrl, { type: 'svg', margin: 1, errorCorrectionLevel: 'M' });
+      const onboardingUrl = `${getPublicBaseUrl(req, playerPublicUrl)}/onboard?deviceId=${encodeURIComponent(deviceId)}`;
+      const svg = await createStyledQrCodeSvg({ value: onboardingUrl, qr_margin: 20 });
       res.set('Content-Type', 'image/svg+xml; charset=utf-8');
       res.set('Cache-Control', 'no-store');
       res.send(svg);
@@ -241,9 +382,9 @@ function registerPlayerOnboardingRoutes(app, options) {
     }
   });
 
-  app.post('/api/onboarding', requireOnboardingPageAuth, async function (req, res, next) {
+  app.post('/api/onboarding', requireOnboardingPageAuth, express.json(), async function (req, res, next) {
     try {
-      const deviceId = normalizeDeviceId(req.body && req.body.deviceId);
+      const deviceId = normalizeDeviceId(req.body && req.body.deviceId) || playerDeviceId;
       const clientName = String((req.body && req.body.clientName) || '').trim();
       const screenSlug = String((req.body && req.body.screenSlug) || '').trim();
       const retryAfterSeconds = isOnboardingSignupRateLimited(req, deviceId);
@@ -251,6 +392,30 @@ function registerPlayerOnboardingRoutes(app, options) {
         res.set('Retry-After', String(retryAfterSeconds));
         return res.status(429).json({ error: 'Too many onboarding attempts. Please try again later.' });
       }
+
+      if (bridgeBaseUrl) {
+        const forwardedBody = Object.assign({}, req.body || {}, {
+          deviceId: deviceId
+        });
+        const response = await fetch(new URL('/api/onboarding', bridgeBaseUrl).toString(), {
+          method: 'POST',
+          headers: Object.assign({
+            'content-type': 'application/json'
+          }, createRequestAuthHeaders({
+            method: 'POST',
+            pathname: '/api/onboarding',
+            body: forwardedBody
+          }), req.headers['x-pulse-page-auth'] ? { 'x-pulse-page-auth': String(req.headers['x-pulse-page-auth']).trim() } : {}),
+          body: JSON.stringify(forwardedBody)
+        });
+        res.status(response.status);
+        const payload = await readJsonResponse(response);
+        if (!payload) {
+          return res.status(502).json({ error: 'Player bridge returned an invalid response.' });
+        }
+        payload.playerUrl = payload && payload.screenSlug ? `${getPublicBaseUrl(req, playerPublicUrl)}/screen/${encodeURIComponent(payload.screenSlug)}` : `${getPublicBaseUrl(req, playerPublicUrl)}/screen/${encodeURIComponent(screenSlug)}`;
+        return res.json(payload);
+      }
       if (!deviceId) {
         return res.status(400).json({ error: 'Device ID is required' });
       }
@@ -262,17 +427,21 @@ function registerPlayerOnboardingRoutes(app, options) {
       }
 
       const status = await bindDeviceToScreen(pool, deviceId, clientName, screenSlug, playerRuntime.isClientNameAvailableOnScreen, playerRuntime, onboardingStore);
+      await bindPlayerToScreen(pool, deviceId, screenSlug);
       res.json({
         deviceId: deviceId,
         clientName: status ? status.client_name : clientName,
         screenId: status && status.screen_id ? status.screen_id : null,
         screenSlug: status ? status.screen_slug : screenSlug,
         screenName: status && status.screen_name ? status.screen_name : null,
-        playerUrl: status && status.screen_slug ? `${getPublicBaseUrl(req)}/screen/${encodeURIComponent(status.screen_slug)}` : `${getPublicBaseUrl(req)}/screen/${encodeURIComponent(screenSlug)}`,
+        playerUrl: status && status.screen_slug ? `${getPublicBaseUrl(req, playerPublicUrl)}/screen/${encodeURIComponent(status.screen_slug)}` : `${getPublicBaseUrl(req, playerPublicUrl)}/screen/${encodeURIComponent(screenSlug)}`,
         queued: Boolean(status && status.queued)
       });
     } catch (error) {
-      next(error);
+        const statusCode = Number(error && error.statusCode || error && error.status || 500);
+        res.status(Number.isFinite(statusCode) && statusCode >= 400 ? statusCode : 500).json({
+          error: error && error.message ? error.message : 'Onboarding failed.'
+        });
     }
   });
 }
@@ -280,8 +449,12 @@ function registerPlayerOnboardingRoutes(app, options) {
 module.exports = {
   normalizeDeviceId: normalizeDeviceId,
   getPublicBaseUrl: getPublicBaseUrl,
+  getPlayerPublicBaseUrl: getPlayerPublicBaseUrl,
+  getPlayerInternalBaseUrl: getPlayerInternalBaseUrl,
   getOnboardingStatus: getOnboardingStatus,
   commitDeviceBinding: commitDeviceBinding,
+  upsertPlayerRegistration: upsertPlayerRegistration,
+  bindPlayerToScreen: bindPlayerToScreen,
   bindDeviceToScreen: bindDeviceToScreen,
   registerPlayerOnboardingRoutes: registerPlayerOnboardingRoutes
 };

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

@@ -7,6 +7,12 @@
     var form = document.getElementById("onboarding-form");
     var message = document.getElementById("onboarding-message");
     var screenSelect = document.getElementById("onboarding-screen-select");
+    function getSessionStorageItem(key) {
+      try { return window.sessionStorage.getItem(key) || ""; } catch (_error) { return ""; }
+    }
+    function setSessionStorageItem(key, value) {
+      try { window.sessionStorage.setItem(key, value); } catch (_error) {}
+    }
     function setMessage(value) { if (message) { message.textContent = value || ""; } }
       function parseResponseError(response) {
         return response.text().then(function (text) {
@@ -39,15 +45,19 @@
           return screens;
         });
     }
-    if (!deviceId) { setMessage("Missing device id. Scan the QR code from the player screen again."); return; }
-    try { window.localStorage.setItem(deviceKey, deviceId); } catch (_error) {}
+    try {
+      if (!deviceId) {
+        deviceId = window.sessionStorage.getItem(deviceKey) || "";
+      }
+      if (deviceId) {
+        window.sessionStorage.setItem(deviceKey, deviceId);
+      }
+    } catch (_error) {}
     loadScreens().then(function () {
       try {
-        var storedClientName = window.localStorage.getItem(clientNameKey) || "";
-        var storedScreenSlug = window.localStorage.getItem(screenKey) || "";
+        var storedClientName = getSessionStorageItem(clientNameKey) || "";
         var clientNameInput = form.querySelector("input[name=\"clientName\"]");
         if (clientNameInput && storedClientName) { clientNameInput.value = storedClientName; }
-        if (screenSelect && storedScreenSlug) { screenSelect.value = storedScreenSlug; }
       } catch (_error) {}
     });
     form.addEventListener("submit", function (event) {
@@ -58,10 +68,14 @@
       if (!clientName) { setMessage("Client name is required."); return; }
       if (!screenSlug) { setMessage("Screen is required."); return; }
       setMessage("Saving client...");
+      var payload = { clientName: clientName, screenSlug: screenSlug };
+      if (deviceId) {
+        payload.deviceId = deviceId;
+      }
       fetch("/api/onboarding", {
         method: "POST",
         headers: { "Content-Type": "application/json", Accept: "application/json" },
-        body: JSON.stringify({ deviceId: deviceId, clientName: clientName, screenSlug: screenSlug })
+        body: JSON.stringify(payload)
       })
          .then(function (response) {
            if (response.ok) {
@@ -73,7 +87,7 @@
          })
         .then(function (payload) {
           if (!payload || !payload.screenSlug) { throw new Error("Unable to save onboarding."); }
-          if (payload.clientName) { try { window.localStorage.setItem(clientNameKey, payload.clientName); } catch (_error) {} }
+          if (payload.clientName) { setSessionStorageItem(clientNameKey, payload.clientName); }
           try { window.localStorage.setItem(screenKey, payload.screenSlug); } catch (_error) {}
           setMessage("Onboarding complete.");
           if (form) {

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

@@ -2,6 +2,12 @@
   (function () {
     var deviceKey = "pulse-signage-player-device-id";
     var clientNameKey = "pulse-signage-player-client-name";
+    function getSessionStorageItem(key) {
+      try { return window.sessionStorage.getItem(key) || ""; } catch (_error) { return ""; }
+    }
+    function setSessionStorageItem(key, value) {
+      try { window.sessionStorage.setItem(key, value); } catch (_error) {}
+    }
     function getClientNameStorageKey(_screenSlug) {
       return clientNameKey;
     }
@@ -11,6 +17,7 @@
     var localForm = document.getElementById("onboarding-local-form");
     var localMessage = document.getElementById("onboarding-message");
     var localScreenSelect = document.getElementById("onboarding-screen-select");
+    var qrPlaceholderSrc = "data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 320 320%22%3E%3Crect width=%22320%22 height=%22320%22 rx=%2224%22 fill=%22%23ffffff%22/%3E%3Crect x=%2230%22 y=%2230%22 width=%22260%22 height=%22260%22 rx=%2218%22 fill=%22%23f8fafc%22 stroke=%22%23cbd5e1%22 stroke-width=%223%22 stroke-dasharray=%2212 10%22/%3E%3Cpath d=%22M106 118h108M106 156h108M106 194h72%22 stroke=%22%2394a3b8%22 stroke-width=%2214%22 stroke-linecap=%22round%22/%3E%3Ccircle cx=%22128%22 cy=%22248%22 r=%2212%22 fill=%22%2394a3b8%22/%3E%3Ctext x=%22160%22 y=%2278%22 text-anchor=%22middle%22 fill=%22%230f172a%22 font-family=%22Arial,sans-serif%22 font-size=%2224%22 font-weight=%22700%22%3EQR code loading%3C/text%3E%3Ctext x=%22160%22 y=%22266%22 text-anchor=%22middle%22 fill=%22%234b5563%22 font-family=%22Arial,sans-serif%22 font-size=%2214%22%3EPlease wait%3C/text%3E%3C/svg%3E";
     function parseResponseError(response) {
       return response.text().then(function (text) {
         var fallbackMessage = text && text.trim() ? text.trim() : "Unable to save onboarding.";
@@ -24,10 +31,10 @@
     }
     function getDeviceId() {
       var stored = "";
-      try { stored = window.localStorage.getItem(deviceKey) || ""; } catch (_error) { stored = ""; }
+      try { stored = window.sessionStorage.getItem(deviceKey) || ""; } catch (_error) { stored = ""; }
       if (stored) { return stored; }
       var next = (window.crypto && window.crypto.randomUUID ? window.crypto.randomUUID() : "device-" + Date.now() + "-" + Math.random().toString(16).slice(2));
-      try { window.localStorage.setItem(deviceKey, next); } catch (_error2) {}
+      try { window.sessionStorage.setItem(deviceKey, next); } catch (_error2) {}
       return next;
     }
     function setStatus(message) { if (status) { status.textContent = message; } }
@@ -60,7 +67,11 @@
         .catch(function () { setSelectOptions(localScreenSelect, [], selectedSlug); return []; });
     }
     function loadQr(deviceId) {
-      if (qr) { qr.src = "/api/onboarding/qr?deviceId=" + encodeURIComponent(deviceId); }
+      if (!qr) { return; }
+      qr.onerror = function () {
+        qr.src = qrPlaceholderSrc;
+      };
+      qr.src = "/api/onboarding/qr?deviceId=" + encodeURIComponent(deviceId);
     }
     function submitOnboarding(deviceId, clientName, screenSlug) {
       return fetch("/api/onboarding", {
@@ -78,8 +89,8 @@
         })
         .then(function (payload) {
           if (!payload || !payload.screenSlug) { throw new Error("Unable to save onboarding."); }
-          if (payload.clientName) { try { window.localStorage.setItem(clientNameKey, payload.clientName); } catch (_error) {} }
-          if (payload.clientName && payload.screenSlug) { try { window.localStorage.setItem(getClientNameStorageKey(payload.screenSlug), payload.clientName); } catch (_error2) {} }
+          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) {}
           setLocalMessage("Onboarding complete.");
           if (localForm) {
@@ -94,8 +105,8 @@
         .then(function (response) { return response.ok ? response.json() : null; })
         .then(function (payload) {
           if (payload && payload.onboarded && payload.screenSlug) {
-            if (payload.clientName) { try { window.localStorage.setItem(clientNameKey, payload.clientName); } catch (_error) {} }
-            if (payload.clientName && payload.screenSlug) { try { window.localStorage.setItem(getClientNameStorageKey(payload.screenSlug), payload.clientName); } catch (_error2) {} }
+            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));
             return true;
@@ -121,18 +132,18 @@
     }
     loadScreens().then(function () {
       try {
-        var storedScreenSlug = window.localStorage.getItem(screenKey) || "";
-        var storedClientName = window.localStorage.getItem(clientNameKey) || "";
-        if (!storedClientName && storedScreenSlug) { storedClientName = window.localStorage.getItem(getClientNameStorageKey(storedScreenSlug)) || ""; }
+        var storedClientName = getSessionStorageItem(clientNameKey) || "";
         if (storedClientName && localForm) {
           var clientNameInput = localForm.querySelector("input[name=\"clientName\"]");
-          if (clientNameInput && !clientNameInput.value) { clientNameInput.value = storedClientName; }
+          if (clientNameInput) { clientNameInput.value = storedClientName; }
         }
-        if (storedScreenSlug && localScreenSelect) { localScreenSelect.value = storedScreenSlug; }
       } catch (_error) {}
     });
     redirectIfOnboarded(deviceId).then(function (redirected) {
       if (redirected) { return; }
+      if (qr && !qr.getAttribute("src")) {
+        qr.src = qrPlaceholderSrc;
+      }
       loadQr(deviceId);
       setStatus("Waiting for onboarding to finish.");
       window.setInterval(function () { redirectIfOnboarded(deviceId); }, 2000);

src/player/onboarding/store.js

@@ -1,3 +1,5 @@
+// File-backed storage for onboarding device mappings.
+
 const fs = require('fs');
 const path = require('path');
 

src/player/player-client-name.script.html

@@ -4,10 +4,31 @@
   const onboardingClientNameStorageKey = 'pulse-signage-player-client-name';
   const onboardingDeviceIdStorageKey = 'pulse-signage-player-device-id';
 
+  function getSessionStorageItem(key) {
+    try {
+      return window.sessionStorage.getItem(key) || '';
+    } catch (_error) {
+      return '';
+    }
+  }
+
+  function setSessionStorageItem(key, value) {
+    try {
+      window.sessionStorage.setItem(key, value);
+    } catch (_error) {
+      // ignore storage errors
+    }
+  }
+
   function getOnboardingDeviceId() {
     try {
-      var storedDeviceId = window.localStorage.getItem(onboardingDeviceIdStorageKey) || '';
-      return String(storedDeviceId || '').trim();
+      var storedDeviceId = getSessionStorageItem(onboardingDeviceIdStorageKey);
+      if (storedDeviceId) {
+        return String(storedDeviceId || '').trim();
+      }
+      var nextDeviceId = window.crypto && window.crypto.randomUUID ? window.crypto.randomUUID() : 'device-' + Date.now() + '-' + Math.random().toString(16).slice(2);
+      setSessionStorageItem(onboardingDeviceIdStorageKey, nextDeviceId);
+      return String(nextDeviceId || '').trim();
     } catch (_error) {
       return '';
     }
@@ -19,24 +40,14 @@
       return onboardingClientName;
     }
     try {
-      var storedClientName = window.localStorage.getItem(onboardingClientNameStorageKey);
+      var storedClientName = getSessionStorageItem(onboardingClientNameStorageKey);
       if (storedClientName) {
         onboardingClientName = storedClientName;
-        try {
-          window.localStorage.setItem('pulse-signage-player-client-name', storedClientName);
-        } catch (_mirrorError) {
-          // ignore storage errors
-        }
         return onboardingClientName;
       }
-      var genericClientName = window.localStorage.getItem('pulse-signage-player-client-name');
+      var genericClientName = getSessionStorageItem('pulse-signage-player-client-name');
       if (genericClientName) {
         onboardingClientName = genericClientName;
-        try {
-          window.localStorage.setItem(onboardingClientNameStorageKey, genericClientName);
-        } catch (_error) {
-          // ignore storage errors
-        }
         return onboardingClientName;
       }
     } catch (_error) {
@@ -51,14 +62,10 @@
       return;
     }
     onboardingClientName = normalizedName;
-    try {
-      window.localStorage.setItem('pulse-signage-player-client-name', normalizedName);
-      window.localStorage.setItem(onboardingClientNameStorageKey, normalizedName);
-    } catch (_error) {
-      // ignore storage errors
-    }
+    setSessionStorageItem('pulse-signage-player-client-name', normalizedName);
+    setSessionStorageItem(onboardingClientNameStorageKey, normalizedName);
     if (socket && socket.readyState === WebSocket.OPEN) {
-      sendCommandHello(socket);
+      sendCommandState(socket);
     }
   }
 

src/player/player-page-announcements.js

@@ -0,0 +1,260 @@
+// Announcement overlay polling and rendering helpers.
+
+(function () {
+  if (window.__pulseThumbnailPreview) {
+    return;
+  }
+
+  var announcementLayer = null;
+  var announcementRefreshTimer = null;
+  var announcementPollTimer = null;
+  var announcementSocket = null;
+  var announcementReconnectTimer = null;
+  var announcementRequestId = 0;
+  var announcementEtag = '';
+  var announcementHideTimer = null;
+  var announcementRevealTimer = null;
+  var announcementFadeDurationMs = 220;
+  var announcementSocketPath = '/ws/screens/' + encodeURIComponent(window.slug || '') + '/announcements';
+
+  function normalizeAnnouncementType(value) {
+    var normalized = String(value || '').trim().toLowerCase();
+    if (normalized === 'center-card') {
+      return 'fullscreen';
+    }
+    if (['lower-third', 'fullscreen', 'top-banner'].indexOf(normalized) !== -1) {
+      return normalized;
+    }
+    return 'lower-third';
+  }
+
+  function getAnnouncementLayer() {
+    if (announcementLayer) {
+      return announcementLayer;
+    }
+    announcementLayer = document.getElementById('player-announcement-layer');
+    if (!announcementLayer) {
+      announcementLayer = document.createElement('div');
+      announcementLayer.id = 'player-announcement-layer';
+      announcementLayer.className = 'player-announcement-layer';
+      announcementLayer.setAttribute('aria-live', 'polite');
+      announcementLayer.setAttribute('aria-atomic', 'true');
+      document.body.appendChild(announcementLayer);
+    }
+    return announcementLayer;
+  }
+
+  function clearAnnouncementHideTimer() {
+    if (announcementHideTimer) {
+      window.clearTimeout(announcementHideTimer);
+      announcementHideTimer = null;
+    }
+  }
+
+  function clearAnnouncementRevealTimer() {
+    if (announcementRevealTimer) {
+      window.cancelAnimationFrame(announcementRevealTimer);
+      announcementRevealTimer = null;
+    }
+  }
+
+  function activateInjectedScripts(layer) {
+    if (!layer) {
+      return;
+    }
+
+    var scripts = layer.querySelectorAll('script');
+    scripts.forEach(function (originalScript) {
+      var replacement = document.createElement('script');
+
+      Array.prototype.slice.call(originalScript.attributes || []).forEach(function (attribute) {
+        replacement.setAttribute(attribute.name, attribute.value);
+      });
+
+      replacement.text = originalScript.textContent || '';
+      originalScript.parentNode.replaceChild(replacement, originalScript);
+    });
+  }
+
+  function hideAnnouncement() {
+    var layer = getAnnouncementLayer();
+    clearAnnouncementRevealTimer();
+    clearAnnouncementHideTimer();
+    layer.classList.add('is-closing');
+    layer.classList.remove('is-visible');
+    announcementHideTimer = window.setTimeout(function () {
+      layer.innerHTML = '';
+      layer.hidden = true;
+      layer.classList.remove('is-closing');
+      announcementHideTimer = null;
+    }, announcementFadeDurationMs);
+  }
+
+  function renderAnnouncement(announcement) {
+    var layer = getAnnouncementLayer();
+    if (!announcement || !announcement.message) {
+      hideAnnouncement();
+      return;
+    }
+
+    var type = normalizeAnnouncementType(announcement.announcement_type);
+
+    clearAnnouncementRevealTimer();
+    clearAnnouncementHideTimer();
+    layer.hidden = false;
+    layer.className = 'player-announcement-layer player-announcement-layer--' + type;
+    layer.classList.remove('is-closing');
+    layer.innerHTML = window.renderPlayerAnnouncementMarkup ? window.renderPlayerAnnouncementMarkup(announcement) : '';
+    activateInjectedScripts(layer);
+    announcementRevealTimer = window.requestAnimationFrame(function () {
+      announcementRevealTimer = null;
+      layer.classList.add('is-visible');
+    });
+  }
+
+  function scheduleAnnouncementRefresh(delayMs) {
+    if (announcementRefreshTimer) {
+      window.clearTimeout(announcementRefreshTimer);
+    }
+    announcementRefreshTimer = window.setTimeout(function () {
+      announcementRefreshTimer = null;
+      void refreshAnnouncementOverlay();
+    }, Math.max(0, Number(delayMs || 0)));
+  }
+
+  async function refreshAnnouncementOverlay() {
+    var requestId = ++announcementRequestId;
+    var request = new XMLHttpRequest();
+    var url = window.location.origin + '/api/screens/' + encodeURIComponent(window.slug || '') + '/announcement?ts=' + Date.now();
+    request.open('GET', url, true);
+    request.timeout = 2500;
+    if (window.__pulsePageAuthToken) {
+      request.setRequestHeader('x-pulse-page-auth', window.__pulsePageAuthToken);
+    }
+    if (announcementEtag) {
+      request.setRequestHeader('If-None-Match', announcementEtag);
+    }
+    request.onreadystatechange = function () {
+      if (request.readyState !== 4 || requestId !== announcementRequestId) {
+        return;
+      }
+      if (request.status === 304) {
+        return;
+      }
+      if (request.status < 200 || request.status >= 300) {
+        scheduleAnnouncementRefresh(15000);
+        return;
+      }
+
+      try {
+        var responseEtag = String(request.getResponseHeader('ETag') || '').trim();
+        var data = JSON.parse(request.responseText || '{}');
+        var announcement = data && data.announcement ? data.announcement : null;
+
+        if (responseEtag) {
+          announcementEtag = responseEtag;
+        }
+
+        if (!announcement) {
+          hideAnnouncement();
+        } else {
+          renderAnnouncement(announcement);
+        }
+      } catch (_error) {
+        scheduleAnnouncementRefresh(15000);
+      }
+    };
+    request.onerror = function () {
+      scheduleAnnouncementRefresh(15000);
+    };
+    request.ontimeout = function () {
+      scheduleAnnouncementRefresh(15000);
+    };
+    request.send();
+  }
+
+  function scheduleAnnouncementPolling() {
+    if (announcementPollTimer) {
+      window.clearInterval(announcementPollTimer);
+    }
+    announcementPollTimer = window.setInterval(function () {
+      void refreshAnnouncementOverlay();
+    }, 15000);
+  }
+
+  function scheduleAnnouncementReconnect() {
+    if (announcementReconnectTimer) {
+      return;
+    }
+    announcementReconnectTimer = window.setTimeout(function () {
+      announcementReconnectTimer = null;
+      connectAnnouncementSocket();
+    }, 5000);
+  }
+
+  function handleAnnouncementSocketMessage(rawMessage) {
+    var payload;
+    try {
+      payload = JSON.parse(String(rawMessage || ''));
+    } catch (_error) {
+      return;
+    }
+
+    if (!payload || payload.type !== 'announcement-refresh') {
+      return;
+    }
+
+    void refreshAnnouncementOverlay();
+  }
+
+  function connectAnnouncementSocket() {
+    if (!window.WebSocket) {
+      return;
+    }
+    if (announcementSocket && (announcementSocket.readyState === WebSocket.OPEN || announcementSocket.readyState === WebSocket.CONNECTING)) {
+      return;
+    }
+
+    var socket = new WebSocket(new URL(announcementSocketPath, window.location.origin).toString());
+    announcementSocket = socket;
+
+    socket.onopen = function () {
+      void refreshAnnouncementOverlay();
+    };
+
+    socket.onmessage = function (event) {
+      handleAnnouncementSocketMessage(event.data);
+    };
+
+    socket.onclose = function () {
+      announcementSocket = null;
+      scheduleAnnouncementReconnect();
+    };
+
+    socket.onerror = function () {
+      try {
+        socket.close();
+      } catch (_error) {
+        // ignore socket close errors
+      }
+    };
+  }
+
+  window.refreshAnnouncementOverlay = refreshAnnouncementOverlay;
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', function () {
+      void refreshAnnouncementOverlay();
+      scheduleAnnouncementPolling();
+      connectAnnouncementSocket();
+    }, { once: true });
+  } else {
+    void refreshAnnouncementOverlay();
+    scheduleAnnouncementPolling();
+    connectAnnouncementSocket();
+  }
+
+  window.addEventListener('focus', function () {
+    void refreshAnnouncementOverlay();
+  });
+})();

src/player/player-page.script.html

@@ -1,21 +1,58 @@
 <script>
   const slug = {{SLUG_JSON}};
   const 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 = '';
   let currentPlaylistFadeBetweenSlides = false;
+  let currentPlaylistSkipUnavailableRtmp = false;
   let pendingPlaylistUpdate = null;
   let activeSlidesCacheKey = '';
   let activeSlidesCacheValue = [];
   let slideMarkupCache = Object.create(null);
   let templateLayoutCache = Object.create(null);
   let templateRenderPlanCache = Object.create(null);
+  let videoRegionRenderVersion = 0;
   let renderCacheViewportKey = '';
   let index = 0;
   let timer = null;
   let slideTransitionTimer = null;
+  let slideRenderRequestId = 0;
   let preloadContainer = null;
   let preloadSignature = '';
   let commandSocket = null;
@@ -69,13 +106,13 @@
   }
 
   // Announce the player to the command websocket.
-  function sendCommandHello(socket) {
+  function sendPlayerBootstrapState(socket) {
     if (!socket || socket.readyState !== WebSocket.OPEN) {
       return;
     }
     var clientName = getOnboardingClientName();
     socket.send(JSON.stringify({
-      type: 'hello',
+      type: 'state',
       clientId: getCommandClientId(),
       clientName: clientName || null,
       deviceId: getOnboardingDeviceId() || null,
@@ -154,16 +191,18 @@
     }
     if (initialData && initialData.playlist) {
       currentPlaylistFadeBetweenSlides = Boolean(initialData.playlist.fade_between_slides);
+      currentPlaylistSkipUnavailableRtmp = Boolean(initialData.playlist.skip_unavailable_rtmp);
     }
     savePlaylistSnapshot({
       slides: slides,
       signature: currentPlaylistSignature,
       fadeBetweenSlides: currentPlaylistFadeBetweenSlides,
+      skipUnavailableRtmp: currentPlaylistSkipUnavailableRtmp,
       etag: currentPlaylistEtag
     });
     syncWebpagePreloads(getActiveSlidesFrom(slides), index);
-    if (typeof syncRtmpPreloads === 'function') {
-      syncRtmpPreloads(getActiveSlidesFrom(slides), index);
+    if (typeof syncRtmpWarmups === 'function') {
+      syncRtmpWarmups(getActiveSlidesFrom(slides), index);
     }
     syncBlackoutState();
     showCurrent();

src/player/player-page.template.html

@@ -5,7 +5,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>{{TITLE}}</title>
     <link rel="icon" type="image/png" href="/assets/favicon.png" />
-    <link rel="stylesheet" href="/assets/css/player.css" />
+    <link rel="stylesheet" href="/assets/adminlte/bootstrap-icons/css/bootstrap-icons.min.css" />
+    <link rel="stylesheet" href="/assets/vendor/animate.css/animate.min.css" />
+    <link rel="stylesheet" href="/assets/css/player.css?v=37" />
+    {{{STYLESHEETS}}}
   </head>
   <body class="{{BODY_CLASS}}">
     {{{BODY}}}

src/player/playlist.js

@@ -1,11 +1,16 @@
+// Player playlist assembly, snapshot persistence, and playlist revision helpers.
+
 const crypto = require('crypto');
 const fs = require('fs');
 const path = require('path');
+const { createStyledQrCodeDataUrl } = require('../data/qr-code');
 
 function createPlayerPlaylistService(options) {
   const pool = options && options.pool ? options.pool : null;
   const common = options && options.common ? options.common : null;
   const snapshotDir = options && options.snapshotDir ? options.snapshotDir : null;
+  const mediaDir = options && options.mediaDir ? path.resolve(String(options.mediaDir)) : null;
+  const remoteImageCacheDir = mediaDir ? path.join(mediaDir, 'player-cache', 'remote-images') : null;
 
   if (!pool) {
     throw new Error('pool is required');
@@ -54,11 +59,114 @@ function createPlayerPlaylistService(options) {
     await fs.promises.writeFile(filePath, JSON.stringify(payload, null, 2), 'utf8');
   }
 
+  async function createQrPreviewDataUrl(value) {
+    return createStyledQrCodeDataUrl(value);
+  }
+
+  function getPlaceholderImageExpressions(value, output) {
+    const expressions = output || [];
+    const source = String(value || '');
+    const pattern = /\{\{\s*([^{}]*?\.image\s*\([^{}]*\)[^{}]*?)\s*\}\}/gi;
+    let match = null;
+    while ((match = pattern.exec(source))) {
+      expressions.push(String(match[1] || '').trim());
+    }
+    return expressions;
+  }
+
+  function resolvePathValue(value, expression) {
+    const parsed = String(expression || '').replace(/\.image\s*\([^)]*\)\s*$/i, '').trim();
+    return parsed.split('.').reduce(function (current, segment) {
+      return current === undefined || current === null ? '' : current[segment];
+    }, value);
+  }
+
+  function getApiItems(responseJson, itemsPath) {
+    let current = responseJson;
+    const pathValue = String(itemsPath || '').trim();
+    if (pathValue) {
+      pathValue.split('.').forEach(function (segment) {
+        current = current === undefined || current === null ? '' : current[segment];
+      });
+      return Array.isArray(current) ? current : [];
+    }
+    if (Array.isArray(responseJson)) return responseJson;
+    if (responseJson && Array.isArray(responseJson.items)) return responseJson.items;
+    if (responseJson && Array.isArray(responseJson.results)) return responseJson.results;
+    if (responseJson && Array.isArray(responseJson.data)) return responseJson.data;
+    return responseJson ? [responseJson] : [];
+  }
+
+  async function cacheRemoteImage(url) {
+    const remoteUrl = String(url || '').trim();
+    if (!remoteImageCacheDir || !/^https?:\/\//i.test(remoteUrl)) return '';
+    const hash = crypto.createHash('sha256').update(remoteUrl).digest('hex');
+    await fs.promises.mkdir(remoteImageCacheDir, { recursive: true });
+    const existing = (await fs.promises.readdir(remoteImageCacheDir)).find(function (name) { return name.startsWith(hash + '.'); });
+    if (existing) return '/media/player-cache/remote-images/' + existing;
+    try {
+      const response = await fetch(remoteUrl, { signal: AbortSignal.timeout(15000) });
+      if (!response.ok || !String(response.headers.get('content-type') || '').toLowerCase().startsWith('image/')) return '';
+      const bytes = Buffer.from(await response.arrayBuffer());
+      if (bytes.length > 10 * 1024 * 1024) return '';
+      const contentType = String(response.headers.get('content-type') || '').toLowerCase();
+      const extension = contentType.includes('svg') ? '.svg' : contentType.includes('png') ? '.png' : contentType.includes('webp') ? '.webp' : contentType.includes('gif') ? '.gif' : '.jpg';
+      const fileName = hash + extension;
+      const filePath = path.join(remoteImageCacheDir, fileName);
+      await fs.promises.writeFile(filePath, bytes);
+      return '/media/player-cache/remote-images/' + fileName;
+    } catch (_error) {
+      return '';
+    }
+  }
+
+  async function cachePlaceholderImages(slides, rssFeeds, apiSources) {
+    if (!remoteImageCacheDir) return;
+    const usedPaths = new Set();
+    const allSlideRows = await pool.query('SELECT content_json FROM c_slides').then(function (result) { return result[0] || []; });
+    const allContents = allSlideRows.map(function (row) { return common.parseJsonSafe(row.content_json) || {}; });
+    const sourceContent = allContents.concat((slides || []).map(function (slide) { return slide.content || {}; }));
+    const cacheSource = async function (source, item, expressions) {
+      if (!source || !item) return;
+      for (const expression of expressions) {
+        const remoteUrl = String(resolvePathValue(item, expression) || '').trim();
+        const localPath = await cacheRemoteImage(remoteUrl);
+        if (localPath) {
+          source.imageCache = source.imageCache || {};
+          source.imageCache[remoteUrl] = localPath;
+          usedPaths.add(localPath);
+        }
+      }
+    };
+    for (const content of sourceContent) {
+      for (const key of Object.keys(content || {})) {
+        const region = content[key];
+        if (!region || typeof region !== 'object') continue;
+        const expressions = getPlaceholderImageExpressions(region.value, []);
+        if (!expressions.length) continue;
+        const itemNumber = Math.max(1, Number(region.item_number || 1)) - 1;
+        if (String(region.type || '').toLowerCase() === 'api') {
+          const source = (apiSources || []).find(function (entry) { return Number(entry.id) === Number(region.source_id); });
+          const items = source ? getApiItems(source.responseJson, region.items_path) : [];
+          await cacheSource(source, items[itemNumber], expressions);
+        }
+        if (String(region.type || '').toLowerCase() === 'rss') {
+          const feed = (rssFeeds || []).find(function (entry) { return Number(entry.id) === Number(region.feed_id); });
+          await cacheSource(feed, feed && feed.items && feed.items[itemNumber], expressions);
+        }
+      }
+    }
+    const files = await fs.promises.readdir(remoteImageCacheDir).catch(function () { return []; });
+    await Promise.all(files.filter(function (file) { return !usedPaths.has('/media/player-cache/remote-images/' + file); }).map(function (file) {
+      return fs.promises.unlink(path.join(remoteImageCacheDir, file)).catch(function () {});
+    }));
+  }
+
   async function buildScreenPlaylist(slug) {
     try {
-      const [screenRows] = await pool.query('SELECT id, name, slug, playlist_id, created_at, modified_at, created_by, modified_by FROM screens WHERE slug = ?', [slug]);
+      const [screenRows] = await pool.query('SELECT id, name, slug, playlist_id, created_at, modified_at, created_by, modified_by FROM d_screens WHERE slug = ?', [slug]);
       if (!screenRows.length) {
-        return { screen: null, playlist: null, slides: [], rssFeeds: [], apiSources: [] };
+        return { screen: null, playlist: null, slides: [], rssFeeds: [], apiSources: [], timetableGroups: [] };
       }
 
       const screen = screenRows[0];
@@ -67,25 +175,43 @@ function createPlayerPlaylistService(options) {
           screen: screen,
           playlist: null,
           slides: [],
-          revision: getPlaylistRevision(screen, null, [], [], [], [], [])
+          rssFeeds: [],
+          apiSources: [],
+          timetableGroups: [],
+          revision: getPlaylistRevision(screen, null, [], [], [], [], [], [])
         };
         await writeSnapshot(slug, payloadWithoutPlaylist);
         return payloadWithoutPlaylist;
       }
 
-      const [playlistRows] = await pool.query('SELECT id, name, fade_between_slides, created_at, modified_at, created_by, modified_by FROM playlists WHERE id = ?', [screen.playlist_id]);
+            const [playlistRows] = await pool.query('SELECT id, name, fade_between_slides, skip_unavailable_rtmp, created_at, modified_at, created_by, modified_by FROM c_playlists WHERE id = ?', [screen.playlist_id]);
       const playlist = playlistRows[0] || null;
       const [slideRows] = await pool.query(`
-        SELECT sl.id, sl.title, sl.body, sl.template_id, sl.content_json, sl.media_path, sl.media_type, sl.created_at, sl.modified_at,
-               ps.position, ps.duration_seconds AS duration_seconds, ps.schedule_mode, ps.schedule_start_datetime, ps.schedule_end_datetime, ps.schedule_start_time, ps.schedule_end_time, ps.schedule_days_json,
+        SELECT sl.id, sl.title, sl.template_id, sl.content_json, sl.created_at, sl.modified_at,
+           ps.position, ps.duration_seconds AS duration_seconds, ps.use_video_duration, ps.disable_audio,
                st.name AS template_name, cs.name AS canvas_size_name, cs.width AS canvas_size_width, cs.height AS canvas_size_height, cs.width AS canvas_width, cs.height AS canvas_height
-        FROM playlist_slides ps
-        JOIN slides sl ON sl.id = ps.slide_id
-        LEFT JOIN slide_templates st ON st.id = sl.template_id
-        LEFT JOIN canvas_sizes cs ON cs.id = st.canvas_size_id
+        FROM c_playlist_slides ps
+        JOIN c_slides sl ON sl.id = ps.slide_id
+        LEFT JOIN c_templates st ON st.id = sl.template_id
+        LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
         WHERE ps.playlist_id = ?
         ORDER BY ps.position ASC, ps.id ASC
       `, [screen.playlist_id]);
+      const [scheduleRuleRows] = await pool.query(`
+        SELECT r.id, r.playlist_slide_id, r.position, r.start_datetime, r.end_datetime, r.start_time, r.end_time, r.schedule_days_json, r.created_at, r.modified_at, r.created_by, r.modified_by
+        FROM c_playlist_slide_schedule_rules r
+        JOIN c_playlist_slides ps ON ps.id = r.playlist_slide_id
+        WHERE ps.playlist_id = ?
+        ORDER BY r.playlist_slide_id ASC, r.position ASC, r.id ASC
+      `, [screen.playlist_id]);
+      const rulesBySlideId = {};
+      scheduleRuleRows.forEach(function (rule) {
+        const slideId = Number(rule.playlist_slide_id);
+        if (!rulesBySlideId[slideId]) {
+          rulesBySlideId[slideId] = [];
+        }
+        rulesBySlideId[slideId].push(rule);
+      });
 
       const templateIds = slideRows
         .filter(function (slide) { return slide.template_id; })
@@ -97,37 +223,95 @@ function createPlayerPlaylistService(options) {
         [templateRows] = await pool.query(`
                 SELECT st.id, st.name, st.canvas_size_id, st.background_image_path, st.background_color, st.created_at, st.modified_at,
                  cs.name AS canvas_size_name, cs.width AS canvas_size_width, cs.height AS canvas_size_height, cs.width AS canvas_width, cs.height AS canvas_height
-          FROM slide_templates st
-          LEFT JOIN canvas_sizes cs ON cs.id = st.canvas_size_id
+          FROM c_templates st
+          LEFT JOIN c_canvas_sizes cs ON cs.id = st.canvas_size_id
           WHERE st.id IN (?)
         `, [templateIds]);
-        [regionRows] = await pool.query('SELECT id, template_id, region_key, region_type, label, font_family, lock_ratio, x, y, width, height, z_index, created_at, modified_at, created_by, modified_by FROM slide_template_regions WHERE template_id IN (?) ORDER BY template_id ASC, z_index ASC, id ASC', [templateIds]);
+        [regionRows] = await pool.query('SELECT id, template_id, region_key, region_type, label, lock_ratio, animation_json, x, y, width, height, z_index, created_at, modified_at, created_by, modified_by FROM c_template_regions WHERE template_id IN (?) ORDER BY template_id ASC, z_index ASC, id ASC', [templateIds]);
         templateRows.forEach(function (template) {
           template.regions = regionRows.filter(function (region) { return region.template_id === template.id; });
           templatesById[template.id] = template;
         });
       }
 
-      const slides = slideRows.map(function (slide) {
+      function getVideoRegionDurationSeconds(contentJson) {
+        if (!contentJson) {
+          return null;
+        }
+
+        try {
+          const parsed = common.parseJsonSafe(contentJson) || {};
+          if (!parsed || typeof parsed !== 'object') {
+            return null;
+          }
+
+          const videoRegions = Object.keys(parsed).map(function (key) { return parsed[key]; }).filter(function (region) {
+            return region && typeof region === 'object' && String(region.type || '').trim().toLowerCase() === 'video' && Number(region.duration_seconds || 0) > 0;
+          });
+
+          const duration = videoRegions.reduce(function (longest, region) {
+            const regionDuration = Math.round(Number(region.duration_seconds || 0) * 1000) / 1000;
+            return regionDuration > longest ? regionDuration : longest;
+          }, 0);
+          return Number.isFinite(duration) && duration > 0 ? duration : null;
+        } catch (_error) {
+          return null;
+        }
+      }
+
+      const slides = await Promise.all(slideRows.map(async function (slide) {
+        const storedDuration = Number(slide.duration_seconds || 0);
+        const videoDuration = slide.use_video_duration ? getVideoRegionDurationSeconds(slide.content_json) : null;
+        const disableAudio = slide.disable_audio === undefined || slide.disable_audio === null ? true : Boolean(slide.disable_audio);
+        const videoCacheBust = String(slide.modified_at || slide.content_json || slide.id || '');
+        const content = common.parseJsonSafe(slide.content_json) || {};
+        const qrBackfillTasks = [];
+        Object.keys(content).forEach(function (key) {
+          const region = content[key];
+          if (region && typeof region === 'object') {
+            const regionType = String(region.type || '').trim().toLowerCase();
+            if (regionType === 'video' || regionType === 'rtmp') {
+              region.disable_audio = disableAudio;
+            }
+          }
+          if (region && typeof region === 'object' && String(region.type || '').trim().toLowerCase() === 'video') {
+            region.cache_bust = videoCacheBust;
+          }
+        });
+
+        Object.keys(content).forEach(function (key) {
+          const region = content[key];
+          if (!region || typeof region !== 'object' || String(region.type || '').trim().toLowerCase() !== 'qr-code') {
+            return;
+          }
+
+          if (region.qr_preview && /^data:image\//i.test(String(region.qr_preview || '').trim())) {
+            return;
+          }
+
+          qrBackfillTasks.push(createQrPreviewDataUrl(region.value).then(function (preview) {
+            if (preview) {
+              region.qr_preview = preview;
+            }
+            return null;
+          }).catch(function () {
+            return null;
+          }));
+        });
+        await Promise.all(qrBackfillTasks);
         return {
           id: slide.id,
           title: slide.title,
-          body: slide.body,
-          duration_seconds: slide.duration_seconds,
-          schedule_mode: slide.schedule_mode,
-          schedule_start_datetime: slide.schedule_start_datetime,
-          schedule_end_datetime: slide.schedule_end_datetime,
-          schedule_start_time: slide.schedule_start_time,
-          schedule_end_time: slide.schedule_end_time,
-          schedule_days_json: slide.schedule_days_json,
-          media_url: slide.media_path,
-          media_type: slide.media_type,
-          kind: common.mediaKind(slide.media_path),
+          modified_at: slide.modified_at,
+          duration_seconds: videoDuration || storedDuration,
+          use_video_duration: Boolean(slide.use_video_duration),
+          disable_audio: disableAudio,
+          scheduleRules: rulesBySlideId[Number(slide.id)] || [],
           template_id: slide.template_id,
           template: slide.template_id ? templatesById[slide.template_id] || null : null,
-          content: common.parseJsonSafe(slide.content_json) || {}
+          content: content
         };
-      });
+      }));
 
       let rssFeeds = [];
       if (typeof common.fetchRssFeedsData === 'function' && typeof common.fetchRssFeedItemsByFeedId === 'function') {
@@ -152,8 +336,16 @@ function createPlayerPlaylistService(options) {
         });
       }
 
-      const revision = getPlaylistRevision(screen, playlist, slideRows, templateRows, regionRows, rssFeeds, apiSources);
-      const payload = { screen: screen, playlist: playlist, slides: slides, rssFeeds: rssFeeds, apiSources: apiSources, revision: revision };
+      let timetableGroups = [];
+      if (typeof common.fetchTimetablesData === 'function') {
+        const timetableData = await common.fetchTimetablesData(pool);
+        timetableGroups = Array.isArray(timetableData && timetableData.timetableGroups) ? timetableData.timetableGroups : [];
+      }
+
+      await cachePlaceholderImages(slides, rssFeeds, apiSources);
+
+      const revision = getPlaylistRevision(screen, playlist, slideRows, scheduleRuleRows, templateRows, regionRows, rssFeeds, apiSources, timetableGroups);
+      const payload = { screen: screen, playlist: playlist, slides: slides, rssFeeds: rssFeeds, apiSources: apiSources, timetableGroups: timetableGroups, revision: revision };
       await writeSnapshot(slug, payload);
       return payload;
     } catch (error) {
@@ -170,7 +362,7 @@ function createPlayerPlaylistService(options) {
     hash.update('\0');
   }
 
-  function getPlaylistRevision(screen, playlist, slideRows, templateRows, regionRows, rssFeeds, apiSources) {
+  function getPlaylistRevision(screen, playlist, slideRows, scheduleRuleRows, templateRows, regionRows, rssFeeds, apiSources, timetableGroups) {
     const hash = crypto.createHash('sha1');
 
     updatePlaylistRevisionHash(hash, screen && screen.id);
@@ -180,24 +372,29 @@ function createPlayerPlaylistService(options) {
     updatePlaylistRevisionHash(hash, playlist && playlist.id);
     updatePlaylistRevisionHash(hash, playlist && playlist.modified_at);
     updatePlaylistRevisionHash(hash, playlist && playlist.fade_between_slides);
+    updatePlaylistRevisionHash(hash, playlist && playlist.skip_unavailable_rtmp);
 
     (Array.isArray(slideRows) ? slideRows : []).forEach(function (slide) {
       updatePlaylistRevisionHash(hash, slide.id);
       updatePlaylistRevisionHash(hash, slide.title);
-      updatePlaylistRevisionHash(hash, slide.body);
       updatePlaylistRevisionHash(hash, slide.template_id);
       updatePlaylistRevisionHash(hash, slide.content_json);
-      updatePlaylistRevisionHash(hash, slide.media_path);
-      updatePlaylistRevisionHash(hash, slide.media_type);
       updatePlaylistRevisionHash(hash, slide.modified_at);
       updatePlaylistRevisionHash(hash, slide.position);
       updatePlaylistRevisionHash(hash, slide.duration_seconds);
-      updatePlaylistRevisionHash(hash, slide.schedule_mode);
-      updatePlaylistRevisionHash(hash, slide.schedule_start_datetime);
-      updatePlaylistRevisionHash(hash, slide.schedule_end_datetime);
-      updatePlaylistRevisionHash(hash, slide.schedule_start_time);
-      updatePlaylistRevisionHash(hash, slide.schedule_end_time);
-      updatePlaylistRevisionHash(hash, slide.schedule_days_json);
+      updatePlaylistRevisionHash(hash, slide.use_video_duration);
+      updatePlaylistRevisionHash(hash, slide.disable_audio);
+    });
+
+    (Array.isArray(scheduleRuleRows) ? scheduleRuleRows : []).forEach(function (rule) {
+      updatePlaylistRevisionHash(hash, rule.id);
+      updatePlaylistRevisionHash(hash, rule.playlist_slide_id);
+      updatePlaylistRevisionHash(hash, rule.position);
+      updatePlaylistRevisionHash(hash, rule.start_datetime);
+      updatePlaylistRevisionHash(hash, rule.end_datetime);
+      updatePlaylistRevisionHash(hash, rule.start_time);
+      updatePlaylistRevisionHash(hash, rule.end_time);
+      updatePlaylistRevisionHash(hash, rule.schedule_days_json);
     });
 
     (Array.isArray(templateRows) ? templateRows : []).forEach(function (template) {
@@ -228,6 +425,7 @@ function createPlayerPlaylistService(options) {
 
     updatePlaylistRevisionHash(hash, JSON.stringify(rssFeeds || []));
     updatePlaylistRevisionHash(hash, JSON.stringify(apiSources || []));
+    updatePlaylistRevisionHash(hash, JSON.stringify(timetableGroups || []));
 
     return hash.digest('hex');
   }

src/player/public/css/player.css

@@ -4,7 +4,7 @@ body {
   width: 100%;
   height: 100%;
   overflow: hidden;
-  background: #111;
+  background: #0a0a0a;
   color: #fff;
   font-family: Arial, sans-serif;
 }
@@ -22,13 +22,28 @@ 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%;
   display: flex;
   align-items: center;
   justify-content: center;
-  background: #111;
+  background: #0a0a0a;
   position: relative;
 }
 
@@ -101,6 +116,8 @@ body.onboarding-page #app {
   display: block;
   background: #fff;
   border-radius: 18px;
+  padding: 16px;
+  box-sizing: border-box;
 }
 
 .onboarding-form {
@@ -199,6 +216,8 @@ body.onboarding-page #app {
   height: 100%;
   opacity: 0;
   transition: opacity 560ms ease;
+  will-change: opacity;
+  backface-visibility: hidden;
 }
 
 .slide-shell.is-visible {
@@ -220,6 +239,31 @@ body.screen-blackout #app {
   opacity: 0;
 }
 
+.player-announcement-layer {
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  width: var(--player-canvas-width, 100vw);
+  height: var(--player-canvas-height, 100vh);
+  max-width: 100vw;
+  max-height: 100vh;
+  transform: translate3d(-50%, -50%, 0);
+  backface-visibility: hidden;
+  z-index: 9999;
+  pointer-events: none;
+  display: flex;
+  opacity: 0;
+  transition: opacity 220ms ease;
+}
+
+.player-announcement-layer.is-visible {
+  opacity: 1;
+}
+
+.player-announcement-layer.is-closing {
+  opacity: 0;
+}
+
 .slide {
   width: 100%;
   height: 100%;
@@ -250,15 +294,6 @@ body.screen-blackout #app {
   display: block;
 }
 
-.slide img,
-.slide video,
-.slide iframe {
-  width: 100%;
-  height: 100%;
-  object-fit: contain;
-  border: 0;
-}
-
 .body {
   position: absolute;
   left: 5%;
@@ -312,7 +347,9 @@ body.screen-blackout #app {
   box-sizing: border-box;
 }
 
-.template-region.text {
+.template-region.text,
+.template-region.api,
+.template-region.rss {
   color: #fff;
   display: block;
   padding: 0;
@@ -322,38 +359,39 @@ body.screen-blackout #app {
   line-height: 1.35;
 }
 
-.template-region.text .template-region-text-scale {
+.template-region .template-region-text-scale {
   display: block;
   transform-origin: top left;
+  overflow: hidden;
 }
 
-.template-region.text .template-region-text-scale > * {
-  margin: 0;
+.template-region .template-region-text-scale > * {
+  margin: 1em 0;
 }
 
-.template-region.text .template-region-text-scale > * + * {
-  margin-top: 0.5em;
+.template-region .template-region-text-scale > *:first-child {
+  margin-top: 0;
 }
 
-.template-region.text .template-region-text-scale ul,
-.template-region.text .template-region-text-scale ol {
+.template-region .template-region-text-scale > *:last-child {
+  margin-bottom: 1em;
+}
+
+.template-region .template-region-text-scale ul,
+.template-region .template-region-text-scale ol {
   padding-left: 1.2em;
 }
 
-.template-region.text .template-region-text-scale code {
+.template-region .template-region-text-scale code {
   white-space: pre-wrap;
 }
 
-.template-region.text > * {
-  margin: 0;
-}
-
-.template-region.text > * + * {
-  margin-top: 0.5em;
-}
-
 .template-region.text ul,
-.template-region.text ol {
+.template-region.text ol,
+.template-region.api ul,
+.template-region.api ol,
+.template-region.rss ul,
+.template-region.rss ol {
   padding-left: 1.2em;
 }
 
@@ -364,6 +402,19 @@ body.screen-blackout #app {
   display: block;
 }
 
+.template-region.video {
+  background: transparent;
+}
+
+.template-region.video video {
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  display: block;
+  pointer-events: none;
+  background: transparent;
+}
+
 .template-region.webpage iframe {
   width: 100%;
   height: 100%;
@@ -373,6 +424,14 @@ body.screen-blackout #app {
   overflow: hidden;
 }
 
+.template-region.qr-code img {
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  display: block;
+  background: #fff;
+}
+
 .template-region.html iframe {
   width: 100%;
   height: 100%;
@@ -397,6 +456,7 @@ body.screen-blackout #app {
 .template-region-rtmp-placeholder {
   position: absolute;
   inset: 0;
+  display: flex;
 }
 
 .template-region-placeholder {
@@ -410,29 +470,6 @@ body.screen-blackout #app {
   font-size: 0.9rem;
 }
 
-.template-region.text table,
-.template-region.text th,
-.template-region.text td {
-  border: 1px solid rgba(255, 255, 255, 0.35);
-  border-collapse: collapse;
-}
-
-.template-region.text table {
-  width: 100%;
-  border-spacing: 0;
-}
-
-.template-region.text th,
-.template-region.text td {
-  padding: 0.35em 0.5em;
-  text-align: left;
-  vertical-align: top;
-}
-
-.template-region.text th {
-  font-weight: 700;
-}
-
 .webpage-preloads {
   position: fixed;
   width: 1px;
@@ -450,3 +487,20 @@ body.screen-blackout #app {
   border: 0;
   display: block;
 }
+
+.template-region table {
+  width: 100%;
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+.template-region th,
+.template-region td {
+  padding: 0.35em 0.5em;
+  text-align: left;
+  vertical-align: top;
+}
+
+.template-region th {
+  font-weight: 700;
+}

src/player/public/js/player-announcement-templates.js

@@ -0,0 +1,137 @@
+(function () {
+  var ANNOUNCEMENT_TYPES = ['lower-third', 'fullscreen', 'top-banner'];
+  var ANNOUNCEMENT_ICONS = Array.isArray(window.pulseAnnouncementIconKeys) ? window.pulseAnnouncementIconKeys : [];
+  var DEFAULT_ANNOUNCEMENT_ICON = String(window.pulseAnnouncementDefaultIconKey || ANNOUNCEMENT_ICONS[0] || '').trim().toLowerCase();
+
+  function escapeHtml(value) {
+    return String(value ?? '')
+      .replace(/&/g, '&')
+      .replace(/</g, '&lt;')
+      .replace(/>/g, '&gt;')
+      .replace(/"/g, '&quot;')
+      .replace(/'/g, '&#39;');
+  }
+
+  function normalizeAnnouncementType(value) {
+    var normalized = String(value || '').trim().toLowerCase();
+    if (normalized === 'center-card') {
+      return 'fullscreen';
+    }
+    return ANNOUNCEMENT_TYPES.indexOf(normalized) !== -1 ? normalized : 'lower-third';
+  }
+
+  function normalizeAnnouncementColor(value) {
+    var normalized = String(value || '').trim().toLowerCase();
+    if (['primary', 'secondary', 'success', 'info', 'warning', 'danger', 'dark', 'light'].indexOf(normalized) !== -1) {
+      return normalized;
+    }
+    return 'primary';
+  }
+
+  function normalizeAnnouncementIcon(value) {
+    var normalized = String(value || '').trim().toLowerCase();
+    return ANNOUNCEMENT_ICONS.indexOf(normalized) !== -1 ? normalized : DEFAULT_ANNOUNCEMENT_ICON;
+  }
+
+  function getAnnouncementColorTokens(colorKey) {
+    var tokens = {
+      primary: { accent: '#0d6efd', foreground: '#ffffff', glow: 'rgba(13, 110, 253, 0.32)' },
+      secondary: { accent: '#6c757d', foreground: '#ffffff', glow: 'rgba(108, 117, 125, 0.30)' },
+      success: { accent: '#198754', foreground: '#ffffff', glow: 'rgba(25, 135, 84, 0.34)' },
+      info: { accent: '#0dcaf0', foreground: '#052c36', glow: 'rgba(13, 202, 240, 0.28)' },
+      warning: { accent: '#ffc107', foreground: '#201400', glow: 'rgba(255, 193, 7, 0.30)' },
+      danger: { accent: '#dc3545', foreground: '#ffffff', glow: 'rgba(220, 53, 69, 0.34)' },
+      dark: { accent: '#212529', foreground: '#ffffff', glow: 'rgba(33, 37, 41, 0.34)' },
+      light: { accent: '#f8f9fa', foreground: '#1f2937', glow: 'rgba(248, 249, 250, 0.34)' }
+    };
+
+    return tokens[colorKey] || tokens.primary;
+  }
+
+  function replaceTemplate(template, replacements) {
+    return String(template || '').replace(/{{([A-Z0-9_]+)}}/g, function (_match, key) {
+      return Object.prototype.hasOwnProperty.call(replacements, key) ? String(replacements[key]) : '';
+    });
+  }
+
+  function getComputedGapWidth(track) {
+    if (!track || !window.getComputedStyle) {
+      return 0;
+    }
+
+    var computedStyle = window.getComputedStyle(track);
+    var gapValue = String(computedStyle.columnGap || computedStyle.gap || '0').trim();
+    var gap = Number.parseFloat(gapValue);
+    return Number.isFinite(gap) ? gap : 0;
+  }
+
+  function getElementWidth(element) {
+    if (!element || !element.getBoundingClientRect) {
+      return 0;
+    }
+
+    return Math.max(0, element.getBoundingClientRect().width || 0);
+  }
+
+  function initPlayerAnnouncementMarquee(track, options) {
+    if (!track || track.dataset.marqueeMeasured === 'true') {
+      return;
+    }
+
+    var settings = options || {};
+    var rate = Number(settings.rate || track.getAttribute('data-announcement-marquee-rate') || 44) || 44;
+    var textSelector = String(settings.textSelector || '.player-announcement__message-text').trim() || '.player-announcement__message-text';
+    var textNodes = Array.prototype.slice.call(track.querySelectorAll(textSelector));
+    if (!textNodes.length) {
+      return;
+    }
+
+    var container = settings.container || track.parentElement || track;
+    var containerWidth = Math.max(1, getElementWidth(container) || 0);
+    var gapWidth = getComputedGapWidth(track);
+    var firstItemWidth = Math.max(1, getElementWidth(textNodes[0]) || 0);
+    var cycleWidth = Math.max(1, firstItemWidth + gapWidth);
+    var minimumTrackWidth = Math.max(containerWidth + cycleWidth, cycleWidth * 2);
+    var cloneIndex = 0;
+
+    while (getElementWidth(track) < minimumTrackWidth && cloneIndex < 8) {
+      var clone = textNodes[cloneIndex % textNodes.length].cloneNode(true);
+      clone.setAttribute('aria-hidden', 'true');
+      track.appendChild(clone);
+      cloneIndex += 1;
+    }
+
+    var durationSeconds = Math.max(8, cycleWidth / rate);
+    var durationValue = durationSeconds.toFixed(2) + 's';
+
+    track.dataset.marqueeMeasured = 'true';
+    track.style.setProperty('--announcement-scroll-distance', cycleWidth.toFixed(2) + 'px');
+    track.style.setProperty('--announcement-scroll-duration', durationValue);
+    track.style.animationDuration = durationValue;
+  }
+
+  function renderPlayerAnnouncementMarkup(announcement) {
+    var normalizedType = normalizeAnnouncementType(announcement && announcement.announcement_type);
+    var colorKey = normalizeAnnouncementColor(announcement && announcement.color_key);
+    var colorTokens = getAnnouncementColorTokens(colorKey);
+    var iconKey = normalizeAnnouncementIcon(announcement && announcement.icon_key);
+    var text = escapeHtml(String(announcement && announcement.message || '').trim()).replace(/[\r\n]+/g, ' ');
+    var titleText = escapeHtml(String(announcement && announcement.short_label || 'Announcement').trim() || 'Announcement');
+    var templates = window.playerAnnouncementTemplates || {};
+    var templateName = normalizedType === 'fullscreen' ? 'fullscreen' : normalizedType === 'top-banner' ? 'topBanner' : 'lowerThird';
+    var template = templates[templateName] || '';
+
+    return replaceTemplate(template, {
+      ACCENT: colorTokens.accent,
+      FOREGROUND: colorTokens.foreground,
+      GLOW: colorTokens.glow,
+      ICON: iconKey,
+      COLOR_KEY: colorKey,
+      TITLE: titleText,
+      MESSAGE: text
+    });
+  }
+
+  window.renderPlayerAnnouncementMarkup = renderPlayerAnnouncementMarkup;
+  window.initPlayerAnnouncementMarquee = initPlayerAnnouncementMarquee;
+})();

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

@@ -6,6 +6,8 @@ function getCurrentViewport() {
   };
 }
 
+var slideOutroTimers = [];
+
 // Command websocket and player-state helpers.
 // Send the current playback state to the command websocket.
 function sendCommandState(currentSlide) {
@@ -65,6 +67,56 @@ function clearSlideTimer() {
     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.
@@ -72,13 +124,16 @@ 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) {
-      refresh();
+      showCurrent();
       return;
     }
     if (index >= activeSlides.length) {
@@ -89,6 +144,12 @@ function scheduleSlideAdvance(delayMs) {
   }, 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) {
@@ -97,17 +158,138 @@ function clearSlideTransitionTimer() {
   }
 }
 
+function getPlayerRegionModules() {
+  if (!window.pulsePlayerRegionTypes || typeof window.pulsePlayerRegionTypes.list !== 'function') {
+    return [];
+  }
+
+  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') {
+      return;
+    }
+
+    try {
+      module[lifecycleName](root);
+    } catch (_error) {
+      // Keep slide rendering resilient if a region lifecycle hook fails.
+    }
+  });
+}
+
+function destroyRegionInstances(root) {
+  runRegionLifecycle(root, 'destroyRegion');
+}
+
+function initializeRegionInstances(root) {
+  runRegionLifecycle(root, 'initRegion');
+}
+
 // Swap slide markup with optional fade animation.
 function renderSlideMarkup(markup, shouldFade) {
   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 });
+    });
+  }
+
+  function schedulePostRenderSetup(root, delayMs) {
+    if (!root) {
+      return;
+    }
+
+    if (root.isConnected === false) {
+      return;
+    }
+
+    if (typeof syncRtmpRegions === 'function') {
+      syncRtmpRegions(root);
+    }
+
+    if (!isThumbnailPreview()) {
+      initializeRegionInstances(root);
+    }
+
+    initializeRenderedVideoPlayback(root, delayMs);
+
+    if (typeof playRegionAnimations === 'function') {
+      playRegionAnimations(root, 'intro');
+    }
+  }
+
   if (!shouldFade) {
     app.innerHTML = markup;
-    if (typeof syncRtmpRegions === 'function') {
-      syncRtmpRegions(app);
-    }
+    schedulePostRenderSetup(app, 0);
     return app.firstElementChild;
   }
 
@@ -125,6 +307,28 @@ 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.style.opacity = '0';
@@ -134,9 +338,7 @@ function renderSlideMarkup(markup, shouldFade) {
     app.innerHTML = '';
     nextShell.style.opacity = '1';
     app.appendChild(nextShell);
-    if (typeof syncRtmpRegions === 'function') {
-      syncRtmpRegions(nextShell);
-    }
+    schedulePostRenderSetup(nextShell, slideFadeDurationMs / 2);
     return nextShell;
   }
 
@@ -144,18 +346,15 @@ function renderSlideMarkup(markup, shouldFade) {
     previousShell.classList.add('slide-shell');
   }
   previousShell.style.opacity = '1';
+  pauseRenderedVideoPlayback(previousShell, slideFadeDurationMs / 2);
 
   app.appendChild(nextShell);
-  void nextShell.offsetHeight;
   window.requestAnimationFrame(function () {
     nextShell.style.opacity = '1';
     previousShell.style.opacity = '0';
+    schedulePostRenderSetup(nextShell, slideFadeDurationMs / 2);
   });
 
-  if (typeof syncRtmpRegions === 'function') {
-    syncRtmpRegions(nextShell);
-  }
-
   slideTransitionTimer = window.setTimeout(function () {
     if (previousShell && previousShell.parentNode) {
       previousShell.parentNode.removeChild(previousShell);
@@ -228,6 +427,42 @@ function normalizeBoolean(value) {
   return null;
 }
 
+function isEditableTarget(target) {
+  if (!target) {
+    return false;
+  }
+
+  if (target.isContentEditable) {
+    return true;
+  }
+
+  var tagName = String(target.tagName || '').toUpperCase();
+  return ['INPUT', 'TEXTAREA', 'SELECT', 'OPTION'].indexOf(tagName) !== -1;
+}
+
+function handlePlayerKeydown(event) {
+  if (!event || event.defaultPrevented || event.altKey || event.ctrlKey || event.metaKey) {
+    return;
+  }
+
+  if (isEditableTarget(event.target)) {
+    return;
+  }
+
+  if (event.key === 'ArrowLeft') {
+    event.preventDefault();
+    navigateSlides(-1);
+    return;
+  }
+
+  if (event.key === 'ArrowRight') {
+    event.preventDefault();
+    navigateSlides(1);
+  }
+}
+
+window.addEventListener('keydown', handlePlayerKeydown);
+
 // Move to the previous or next active slide.
 function navigateSlides(offset) {
   const manualSlides = getCurrentActiveSlides();
@@ -274,7 +509,12 @@ function handleCommandMessage(rawMessage) {
       }
       return;
     case 'pause':
-      setPaused(!isPaused);
+      var desiredPause = normalizeBoolean(payload.paused);
+      if (desiredPause !== null) {
+        setPaused(desiredPause);
+      } else {
+        setPaused(!isPaused);
+      }
       return;
     case 'blackout':
       var desiredBlackout = normalizeBoolean(payload.blackout);
@@ -285,16 +525,19 @@ function handleCommandMessage(rawMessage) {
       }
       return;
     case 'previous':
-    case 'left':
       navigateSlides(-1);
       return;
     case 'next':
-    case 'right':
       navigateSlides(1);
       return;
     case 'reload':
       window.location.reload();
       return;
+    case 'announcement-refresh':
+      if (typeof refreshAnnouncementOverlay === 'function') {
+        refreshAnnouncementOverlay();
+      }
+      return;
   }
 }
 
@@ -317,22 +560,17 @@ function connectCommandSocket() {
   if (commandSocket && (commandSocket.readyState === WebSocket.OPEN || commandSocket.readyState === WebSocket.CONNECTING)) {
     return;
   }
-  var protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
-  var socketUrl = new URL(commandSocketPath, window.location.origin);
-  if (window.__pulsePageAuthToken) {
-    socketUrl.searchParams.set('auth', window.__pulsePageAuthToken);
-  }
-  var socket = new WebSocket(socketUrl.toString());
+  var socket = new WebSocket(new URL(commandSocketPath, window.location.origin).toString());
   commandSocket = socket;
 
   socket.onopen = function () {
     if (typeof syncOnboardingClientNameFromServer === 'function') {
       syncOnboardingClientNameFromServer(socket).then(function () {
-        sendCommandHello(socket);
+        sendCommandState(socket);
       });
       return;
     }
-    sendCommandHello(socket);
+    sendCommandState(socket);
   };
 
   socket.onmessage = function (event) {

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

@@ -1,5 +1,8 @@
 // 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) {
@@ -38,6 +41,9 @@ 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;
@@ -57,6 +63,9 @@ 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.
-function renderSlideAtIndex(sourceSlides, targetIndex) {
+async function renderSlideAtIndex(sourceSlides, targetIndex) {
   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.');
@@ -11,18 +11,55 @@ function renderSlideAtIndex(sourceSlides, targetIndex) {
   if (!Number.isFinite(normalizedIndex) || normalizedIndex < 0 || normalizedIndex >= availableSlides.length) {
   }
 
-  const slide = availableSlides[normalizedIndex];
+  var slideCount = availableSlides.length;
+  var currentIndex = normalizedIndex;
+  var slide = null;
+  var attempts = 0;
+  var renderRequestId = ++slideRenderRequestId;
+
+  while (attempts < slideCount) {
+    slide = availableSlides[currentIndex];
+    if (!slide) {
+      break;
+    }
+    if (currentPlaylistSkipUnavailableRtmp && typeof probeRtmpSlideAvailability === 'function') {
+      var isAvailable = await probeRtmpSlideAvailability(slide);
+      if (!isAvailable) {
+        if (renderRequestId !== slideRenderRequestId) {
+          return false;
+        }
+        currentIndex = (currentIndex + 1) % slideCount;
+        attempts += 1;
+        slide = null;
+        continue;
+      }
+    }
+    if (renderRequestId !== slideRenderRequestId) {
+      break;
+    }
+    break;
+  }
+
   if (!slide) {
+    if (currentPlaylistSkipUnavailableRtmp) {
+      renderEmpty(slides.length ? 'No RTMP slides are currently available.' : 'No slides assigned to this screen yet.');
+      lastRenderedViewKey = getCurrentRenderKey(availableSlides);
+      scheduleRefreshRetry();
+      return false;
+    }
     renderEmpty(slides.length ? 'No slides are scheduled for this time.' : 'No slides assigned to this screen yet.');
     return false;
   }
 
-  index = normalizedIndex;
+  index = currentIndex;
   var markup = buildSlideMarkup(slide);
   renderSlideMarkup(markup, currentPlaylistFadeBetweenSlides);
+  if (typeof scheduleSlideMarkupPreload === 'function') {
+    scheduleSlideMarkupPreload(availableSlides, currentIndex);
+  }
   sendCommandState(slide);
   if (!isPaused) {
-    scheduleSlideAdvance(Math.max(1, Number(slide.duration_seconds || 10)) * 1000);
+    scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(slide.duration_seconds || 10)) * 1000));
   }
   lastRenderedViewKey = getCurrentRenderKey(availableSlides);
   return true;
@@ -33,16 +70,22 @@ function applyPendingPlaylistUpdate() {
   if (!pendingPlaylistUpdate) {
     return false;
   }
+  var nextIndex = Number(index || 0);
   slides = pendingPlaylistUpdate.slides;
   currentPlaylistSignature = pendingPlaylistUpdate.signature;
   currentPlaylistFadeBetweenSlides = pendingPlaylistUpdate.fadeBetweenSlides;
+  currentPlaylistSkipUnavailableRtmp = Boolean(pendingPlaylistUpdate.skipUnavailableRtmp);
   pendingPlaylistUpdate = null;
   clearActiveSlidesCache();
   slideMarkupCache = Object.create(null);
   templateLayoutCache = Object.create(null);
   templateRenderPlanCache = Object.create(null);
   renderCacheViewportKey = window.innerWidth + 'x' + window.innerHeight;
-  index = 0;
+  const activeSlides = getCurrentActiveSlides();
+  if (!Number.isFinite(nextIndex) || nextIndex < 0) {
+    nextIndex = 0;
+  }
+  index = activeSlides.length ? Math.min(nextIndex, activeSlides.length - 1) : 0;
   logDebug('Applied updated playlist on slide transition.');
   return true;
 }
@@ -50,21 +93,60 @@ function applyPendingPlaylistUpdate() {
 // Render the current active slide or the empty state.
 function showCurrent() {
   clearSlideTimer();
-  applyPendingPlaylistUpdate();
   const activeSlides = getCurrentActiveSlides();
   syncWebpagePreloads(activeSlides, index);
-  if (typeof syncRtmpPreloads === 'function') {
-    syncRtmpPreloads(activeSlides, index);
+  if (typeof syncRtmpWarmups === 'function') {
+    syncRtmpWarmups(activeSlides, index);
+  }
+  if (typeof scheduleSlideMarkupPreload === 'function') {
+    scheduleSlideMarkupPreload(activeSlides, index);
   }
   if (!activeSlides.length) {
     renderEmpty(slides.length ? 'No slides are scheduled for this time.' : 'No slides assigned to this screen yet.');
     lastRenderedViewKey = getCurrentRenderKey(activeSlides);
     return;
   }
-  renderSlideAtIndex(activeSlides, index);
+  void renderSlideAtIndex(activeSlides, index);
   lastRenderedViewKey = getCurrentRenderKey(activeSlides);
 }
 
+function isSlideInList(slide, slideList) {
+  if (!slide || !Array.isArray(slideList)) {
+    return false;
+  }
+
+  return slideList.some(function (item) {
+    return item && Number(item.id) === Number(slide.id);
+  });
+}
+
+// Skip the current slide when an RTMP feed is unavailable and the playlist asks for it.
+function handleRtmpPlaybackFailure(message, options) {
+  if (!currentPlaylistSkipUnavailableRtmp) {
+    return false;
+  }
+
+  var silent = Boolean(options && options.silent);
+  const activeSlides = getCurrentActiveSlides();
+  if (!activeSlides.length) {
+    return false;
+  }
+
+  clearSlideTimer();
+  if (!silent) {
+    logDebug('Skipping RTMP slide because the stream is unavailable.', String(message || ''), 'error');
+  }
+
+  const nextIndex = (Number(index || 0) + 1) % activeSlides.length;
+  window.setTimeout(function () {
+    if (!getCurrentActiveSlides().length) {
+      return;
+    }
+    void renderSlideAtIndex(getCurrentActiveSlides(), nextIndex);
+  }, 0);
+  return true;
+}
+
 // Fetch the latest playlist and queue any updates.
 function refresh() {
   var request = new XMLHttpRequest();
@@ -85,7 +167,7 @@ function refresh() {
       markRefreshHealthy();
       setOfflineBannerVisible(false);
       if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
-        scheduleSlideAdvance(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000);
+          scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
       }
       return;
     }
@@ -104,11 +186,23 @@ function refresh() {
       const data = JSON.parse(request.responseText || '{}');
       const nextSignature = getPlaylistRevision(data);
       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);
+      if (window.initialData && typeof window.initialData === 'object') {
+        window.initialData.screen = data.screen || window.initialData.screen || null;
+        window.initialData.playlist = data.playlist || null;
+        window.initialData.slides = nextSlides;
+        window.initialData.rssFeeds = Array.isArray(data.rssFeeds) ? data.rssFeeds : [];
+        window.initialData.apiSources = Array.isArray(data.apiSources) ? data.apiSources : [];
+        window.initialData.timetableGroups = Array.isArray(data.timetableGroups) ? data.timetableGroups : [];
+        window.initialData.revision = nextSignature;
+      }
       savePlaylistSnapshot({
         slides: nextSlides,
         signature: nextSignature,
         fadeBetweenSlides: nextFadeBetweenSlides,
+        skipUnavailableRtmp: nextSkipUnavailableRtmp,
         etag: responseEtag
       });
       markRefreshHealthy();
@@ -121,6 +215,7 @@ function refresh() {
         slides = nextSlides;
         currentPlaylistSignature = nextSignature;
         currentPlaylistFadeBetweenSlides = nextFadeBetweenSlides;
+        currentPlaylistSkipUnavailableRtmp = nextSkipUnavailableRtmp;
         index = 0;
         showCurrent();
         sendCommandState(lastRenderedSlide);
@@ -128,28 +223,37 @@ function refresh() {
       }
       if (nextSignature === currentPlaylistSignature || (pendingPlaylistUpdate && nextSignature === pendingPlaylistUpdate.signature)) {
         if (currentActiveSlides.length < 2 && lastRenderedSlide) {
-          scheduleSlideAdvance(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000);
+          scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
         }
         return;
       }
-      syncWebpagePreloads(getActiveSlidesFrom(nextSlides), index);
-      if (typeof syncRtmpPreloads === 'function') {
-        syncRtmpPreloads(getActiveSlidesFrom(nextSlides), index);
+      syncWebpagePreloads(nextActiveSlides, index);
+      if (typeof syncRtmpWarmups === 'function') {
+        syncRtmpWarmups(nextActiveSlides, index);
       }
-      if (currentActiveSlides.length < 2) {
-        slides = nextSlides;
-        currentPlaylistSignature = nextSignature;
-        currentPlaylistFadeBetweenSlides = nextFadeBetweenSlides;
-        pendingPlaylistUpdate = null;
-        index = 0;
-        showCurrent();
-        sendCommandState(lastRenderedSlide);
+      if (typeof scheduleSlideMarkupPreload === 'function') {
+        scheduleSlideMarkupPreload(nextActiveSlides, index);
+      }
+      if (nextActiveSlides.length < 2) {
+        pendingPlaylistUpdate = {
+          slides: nextSlides,
+          signature: nextSignature,
+          fadeBetweenSlides: nextFadeBetweenSlides,
+          skipUnavailableRtmp: nextSkipUnavailableRtmp
+        };
+        if (!isSlideInList(lastRenderedSlide, nextSlides)) {
+          applyPendingPlaylistUpdate();
+          showCurrent();
+          return;
+        }
+        logDebug('Playlist update detected; applying on next slide transition.');
         return;
       }
       pendingPlaylistUpdate = {
         slides: nextSlides,
         signature: nextSignature,
-        fadeBetweenSlides: nextFadeBetweenSlides
+        fadeBetweenSlides: nextFadeBetweenSlides,
+        skipUnavailableRtmp: nextSkipUnavailableRtmp
       };
       logDebug('Playlist update detected; applying on next slide transition.');
     } catch (_error) {
@@ -171,7 +275,7 @@ function refresh() {
       setOfflineBannerVisible(true);
       scheduleRefreshRetry();
     if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
-      scheduleSlideAdvance(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000);
+      scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
     }
   };
   request.ontimeout = function () {
@@ -183,7 +287,7 @@ function refresh() {
     setOfflineBannerVisible(true);
     scheduleRefreshRetry();
     if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
-      scheduleSlideAdvance(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000);
+      scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
     }
   };
   request.send();

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

@@ -84,7 +84,7 @@ function getCurrentRenderKey(activeSlides) {
   return [currentPlaylistSignature || '', viewportKey, 'slide', slide && slide.id ? slide.id : ''].join('|');
 }
 
-// Pick the current slide and the next slide for webpage preloading.
+// Pick the next slide for webpage preloading.
 function getWebpagePreloadSlides(sourceSlides, targetIndex) {
   const availableSlides = Array.isArray(sourceSlides) ? sourceSlides : [];
   if (!availableSlides.length) {
@@ -97,19 +97,71 @@ function getWebpagePreloadSlides(sourceSlides, targetIndex) {
   }
 
   const preloadSlides = [];
-  const currentSlide = availableSlides[normalizedIndex];
   const nextSlide = availableSlides[normalizedIndex + 1];
 
-  if (currentSlide) {
-    preloadSlides.push(currentSlide);
-  }
-  if (nextSlide && nextSlide !== currentSlide) {
+  if (nextSlide) {
     preloadSlides.push(nextSlide);
   }
 
   return preloadSlides;
 }
 
+// Pick the next slide to warm its markup before it becomes visible.
+function getSlideMarkupPreloadSlides(sourceSlides, targetIndex) {
+  const availableSlides = Array.isArray(sourceSlides) ? sourceSlides : [];
+  if (!availableSlides.length) {
+    return [];
+  }
+
+  let normalizedIndex = Number(targetIndex || 0);
+  if (!Number.isFinite(normalizedIndex) || normalizedIndex < 0 || normalizedIndex >= availableSlides.length) {
+    normalizedIndex = 0;
+  }
+
+  const preloadSlides = [];
+  const nextSlide = availableSlides[normalizedIndex + 1];
+
+  if (nextSlide) {
+    preloadSlides.push(nextSlide);
+  }
+
+  return preloadSlides;
+}
+
+function scheduleSlideMarkupPreload(sourceSlides, targetIndex) {
+  if (window.__pulseThumbnailPreview) {
+    return;
+  }
+
+  const preloadSlides = getSlideMarkupPreloadSlides(sourceSlides, targetIndex);
+  if (!preloadSlides.length || typeof primeSlideMarkup !== 'function') {
+    return;
+  }
+
+  const slide = preloadSlides[0];
+  const preloadSignature = [
+    currentPlaylistSignature || '',
+    slide && slide.id ? slide.id : '',
+    slide && slide.template_id ? slide.template_id : '',
+    slide && slide.modified_at ? slide.modified_at : '',
+    window.innerWidth + 'x' + window.innerHeight,
+    videoRegionRenderVersion || 0
+  ].join('|');
+
+  if (scheduleSlideMarkupPreload.signature === preloadSignature) {
+    return;
+  }
+
+  scheduleSlideMarkupPreload.signature = preloadSignature;
+
+  window.setTimeout(function () {
+    if (scheduleSlideMarkupPreload.signature !== preloadSignature) {
+      return;
+    }
+    primeSlideMarkup(slide);
+  }, 0);
+}
+
 // Mount hidden iframe preloads for the chosen webpage URLs.
 function syncWebpagePreloads(sourceSlides, targetIndex) {
   const urls = getWebpageUrls(getWebpagePreloadSlides(sourceSlides, targetIndex));
@@ -136,13 +188,13 @@ function syncWebpagePreloads(sourceSlides, targetIndex) {
   preloadSignature = signature;
 }
 
-// Return a stable client id for this browser session.
+// Return a stable client id for this screen session.
 function getCommandClientId() {
   if (commandClientId) {
     return commandClientId;
   }
   try {
-    var storedClientId = window.localStorage.getItem(commandClientStorageKey);
+    var storedClientId = window.sessionStorage.getItem(commandClientStorageKey);
     if (storedClientId) {
       commandClientId = storedClientId;
       return commandClientId;
@@ -152,7 +204,7 @@ function getCommandClientId() {
   }
   commandClientId = (window.crypto && window.crypto.randomUUID ? window.crypto.randomUUID() : 'client-' + Date.now() + '-' + Math.random().toString(16).slice(2));
   try {
-    window.localStorage.setItem(commandClientStorageKey, commandClientId);
+    window.sessionStorage.setItem(commandClientStorageKey, commandClientId);
   } catch (_error2) {
     // ignore storage errors
   }

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

@@ -4,6 +4,14 @@ function sanitizeFontFamily(value) {
   return String(value || '').replace(/[^a-zA-Z0-9 ,\"-]/g, '').trim();
 }
 
+function normalizeStyleAttributeValue(value) {
+  return String(value || '')
+    .replace(/"/g, '"')
+    .replace(/'/g, "'")
+    .replace(/"/g, '"')
+    .replace(/'/g, "'");
+}
+
 // Clamp font size to the supported range.
 function sanitizeFontSize(value) {
   return Math.max(8, Number(value || 0) || 24);
@@ -53,7 +61,288 @@ function fitCanvasSize(canvasWidth, canvasHeight, maxWidth, maxHeight) {
   };
 }
 
-const ALLOWED_RICH_TEXT_TAGS = ['a', 'b', 'blockquote', 'br', 'code', 'div', 'em', 'figure', 'figcaption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'i', 'li', 'ol', 'p', 'pre', 'span', 'strong', 'sub', 'sup', 'table', 'tbody', 'td', 'th', 'thead', 'tr', 'u', 'ul'];
+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';
+  }));
+}
+
+function decorateRegionMarkup(markup, region) {
+  if (!markup || !region || !hasPlayerAnimation(region.animationConfig)) {
+    return markup;
+  }
+
+  var animationJson = escapeHtml(JSON.stringify(region.animationConfig));
+  return markup.replace(/^(\s*)<([a-z0-9-]+)(\s[^>]*)?>/i, function (match, leadingWhitespace, tagName, attributes) {
+    return leadingWhitespace + '<' + tagName + (attributes || '') + ' data-animation-json="' + animationJson + '">';
+  });
+}
+
+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;
+  }
+
+  var width = Math.max(1, Math.round(Number(canvasWidth) || 0) || 0);
+  var height = Math.max(1, Math.round(Number(canvasHeight) || 0) || 0);
+  document.documentElement.style.setProperty('--player-canvas-width', width + 'px');
+  document.documentElement.style.setProperty('--player-canvas-height', height + 'px');
+}
+
+const ALLOWED_RICH_TEXT_TAGS = ['a', 'b', 'blockquote', 'br', 'code', 'col', 'colgroup', 'div', 'em', 'figure', 'figcaption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'i', 'img', 'li', 'ol', 'p', 'pre', 'span', 'strong', 'sub', 'sup', 'table', 'tbody', 'td', 'th', 'thead', 'tr', 'u', 'ul'];
 
 function sanitizeRichTextAttributes(tagName, attrText) {
   const allowedAttributes = {
@@ -68,14 +357,19 @@ function sanitizeRichTextAttributes(tagName, attrText) {
     h4: ['class', 'style'],
     h5: ['class', 'style'],
     h6: ['class', 'style'],
+    img: ['src', 'alt', 'title', 'width', 'height', 'class', 'style', 'loading', 'decoding'],
+    col: ['class', 'style', 'span', 'width'],
+    colgroup: ['class', 'style', 'span'],
     li: ['class', 'style'],
     ol: ['class', 'style', 'start'],
     p: ['class', 'style'],
     pre: ['class', 'style'],
     span: ['class', 'style'],
     table: ['class', 'style'],
+    tbody: ['class', 'style'],
     td: ['class', 'style', 'colspan', 'rowspan'],
     th: ['class', 'style', 'colspan', 'rowspan', 'scope'],
+    thead: ['class', 'style'],
     tr: ['class', 'style'],
     ul: ['class', 'style']
   };
@@ -84,6 +378,14 @@ function sanitizeRichTextAttributes(tagName, attrText) {
     return '';
   }
 
+  if (tagName === 'img') {
+    const srcMatch = String(attrText || '').match(/\bsrc\s*=\s*("([^"]*)"|'([^']*)'|([^\s"'>/=`]+))/i);
+    const srcValue = srcMatch ? String(srcMatch[2] !== undefined ? srcMatch[2] : srcMatch[3] !== undefined ? srcMatch[3] : srcMatch[4] !== undefined ? srcMatch[4] : '').trim() : '';
+    if (!srcValue || !/^(?:https?:\/\/|\/media\/|\/assets\/|\/[^/]|data:image\/)/i.test(srcValue)) {
+      return '';
+    }
+  }
+
   const attrs = [];
   String(attrText || '').replace(/([a-zA-Z0-9:-]+)(?:\s*=\s*("([^"]*)"|'([^']*)'|([^\s"'>/=`]+)))?/g, (_full, key, _valuePart, doubleQuoted, singleQuoted, bareValue) => {
     const lowerKey = String(key || '').toLowerCase();
@@ -107,14 +409,14 @@ function sanitizeRichTextAttributes(tagName, attrText) {
         return '';
       }
     }
-    attrs.push(' ' + lowerKey + '="' + escapeHtml(value) + '"');
+    attrs.push(' ' + lowerKey + '="' + escapeHtml(lowerKey === 'style' ? normalizeStyleAttributeValue(value) : value) + '"');
     return '';
   });
 
   return attrs.join('');
 }
 
-// Remove unsafe markup while preserving richer CKEditor formatting.
+// Remove unsafe markup while preserving richer rich-text formatting.
 function sanitizeRichText(html) {
   var output = String(html || '');
   output = output.replace(/<script[\s\S]*?<\/script>/gi, '');
@@ -202,6 +504,17 @@ function renderEditorJsTable(data) {
   return '<table class="ck-content-table">' + tableRows + '</table>';
 }
 
+function wrapRichTextParagraph(html) {
+  var raw = String(html || '').trim();
+  if (!raw) {
+    return '';
+  }
+  if (/^<\s*(?:p|div|h[1-6]|ul|ol|pre|table|blockquote|figure|hr|li)\b/i.test(raw)) {
+    return raw;
+  }
+  return '<p>' + raw + '</p>';
+}
+
 // Render Editor.js JSON or plain content safely.
 function renderEditorJsContent(value) {
   if (value && typeof value === 'object') {
@@ -221,7 +534,7 @@ function renderEditorJsContent(value) {
   } catch (_error) {
     // fall through to legacy HTML rendering
   }
-  return sanitizeRichText(raw);
+  return wrapRichTextParagraph(sanitizeRichText(raw));
 }
 
 // Parse string values that look like JSON.
@@ -318,31 +631,82 @@ function parseTimeToMinutes(value) {
   return Number(match[1]) * 60 + Number(match[2]);
 }
 
-// Determine whether a slide should be shown at the current time.
-function isSlideActive(slide, now) {
-  const mode = String(slide.schedule_mode || 'always');
-  if (mode === 'always') {
-    return true;
+function normalizeScheduleRule(rule) {
+  const input = rule && typeof rule === 'object' ? rule : {};
+  const startDatetime = String(input.start_datetime || input.startDateTime || '').trim();
+  const endDatetime = String(input.end_datetime || input.endDateTime || '').trim();
+  const startTime = String(input.start_time || input.startTime || '').trim();
+  const endTime = String(input.end_time || input.endTime || '').trim();
+  const days = parseScheduleDays(input.days);
+
+  if (startDatetime || endDatetime) {
+    if (!startDatetime || !endDatetime) {
+      return null;
+    }
   }
-  if (mode === 'dates') {
-    const start = slide.schedule_start_datetime ? new Date(slide.schedule_start_datetime) : null;
-    const end = slide.schedule_end_datetime ? new Date(slide.schedule_end_datetime) : null;
-    if (!start || !end || Number.isNaN(start.getTime()) || Number.isNaN(end.getTime())) {
-      return false;
+  if (startTime || endTime) {
+    if (!startTime || !endTime) {
+      return null;
     }
-    return now >= start && now <= end;
   }
-  if (mode === 'times') {
-    const days = parseScheduleDays(slide.schedule_days_json);
-    if (!days.length) {
+  if (!startDatetime && !endDatetime && !startTime && !endTime && !days.length) {
+    return null;
+  }
+
+  return {
+    start_datetime: startDatetime || null,
+    end_datetime: endDatetime || null,
+    start_time: startTime || null,
+    end_time: endTime || null,
+    days: days
+  };
+}
+
+function parseScheduleRules(value) {
+  let rawRules = [];
+
+  if (Array.isArray(value)) {
+    rawRules = value;
+  } else {
+    const raw = String(value || '').trim();
+    if (!raw) {
+      return [];
+    }
+    try {
+      const parsed = JSON.parse(raw);
+      rawRules = Array.isArray(parsed) ? parsed : [];
+    } catch (_error) {
+      return [];
+    }
+  }
+
+  return rawRules.map(normalizeScheduleRule).filter(Boolean);
+}
+
+function matchesScheduleRule(rule, now) {
+  const normalized = normalizeScheduleRule(rule);
+  if (!normalized) {
+    return false;
+  }
+
+  if (normalized.start_datetime && normalized.end_datetime) {
+    const start = new Date(normalized.start_datetime);
+    const end = new Date(normalized.end_datetime);
+    if (Number.isNaN(start.getTime()) || Number.isNaN(end.getTime())) {
       return false;
     }
-    const day = now.getDay();
-    if (days.indexOf(day) === -1) {
+    if (now < start || now > end) {
       return false;
     }
-    const startMinutes = parseTimeToMinutes(slide.schedule_start_time);
-    const endMinutes = parseTimeToMinutes(slide.schedule_end_time);
+  }
+
+  if (normalized.days.length && normalized.days.indexOf(now.getDay()) === -1) {
+    return false;
+  }
+
+  if (normalized.start_time && normalized.end_time) {
+    const startMinutes = parseTimeToMinutes(normalized.start_time);
+    const endMinutes = parseTimeToMinutes(normalized.end_time);
     if (startMinutes === null || endMinutes === null) {
       return false;
     }
@@ -352,8 +716,20 @@ function isSlideActive(slide, now) {
     }
     return nowMinutes >= startMinutes || nowMinutes <= endMinutes;
   }
+
   return true;
 }
+
+// Determine whether a slide should be shown at the current time.
+function isSlideActive(slide, now) {
+  const rules = Array.isArray(slide.scheduleRules) ? slide.scheduleRules : [];
+  if (!rules.length) {
+    return true;
+  }
+  return rules.some(function (rule) {
+    return matchesScheduleRule(rule, now);
+  });
+}
 // Build the cache key for a template layout.
 function getTemplateLayoutCacheKey(template) {
   var viewportKey = window.innerWidth + 'x' + window.innerHeight;
@@ -389,6 +765,7 @@ function getTemplateLayout(template) {
       regionKey: region.region_key,
       regionType: region.region_type,
       label: region.label,
+      animationJson: region.animation_json || null,
       baseStyle: baseStyle,
       pixelWidth: pixelWidth,
       pixelHeight: pixelHeight,
@@ -411,6 +788,21 @@ function getTemplateLayout(template) {
   return layout;
 }
 
+// Build a dark backdrop style for template and media canvases.
+function buildBackdropStyle(backgroundColor, backgroundImagePath) {
+  var color = String(backgroundColor || '#111111').trim() || '#111111';
+  var style = 'background-color:' + escapeHtml(color) + ';';
+
+  if (backgroundImagePath) {
+    style += 'background-image:url("' + escapeHtml(backgroundImagePath) + '");';
+    style += 'background-position:center;background-size:contain;background-repeat:no-repeat;';
+    return style;
+  }
+
+  style += 'background-image:none;background-position:center;background-size:cover;background-repeat:no-repeat;';
+  return style;
+}
+
 // Build the cache key for a template render plan.
 function getTemplateRenderPlanCacheKey(template) {
   return getTemplateLayoutCacheKey(template);
@@ -430,12 +822,23 @@ function getTemplateRenderPlan(template) {
   }
 
   var layout = getTemplateLayout(template);
+  function getPlayerRegionModule(regionType) {
+    return window.pulsePlayerRegionTypes && typeof window.pulsePlayerRegionTypes.get === 'function' ? window.pulsePlayerRegionTypes.get(regionType) : null;
+  }
+
   var plan = {
     layout: layout,
     renderRegion: function (region, regionContent) {
+      var regionModule = getPlayerRegionModule(region.regionType);
+      if (regionModule && typeof regionModule.renderRegion === 'function') {
+        return regionModule.renderRegion(region, regionContent);
+      }
       if (region.regionType === 'image') {
         return renderImageRegion(region, regionContent);
       }
+      if (region.regionType === 'video') {
+        return renderVideoRegion(region, regionContent);
+      }
       if (region.regionType === 'webpage') {
         return renderWebpageRegion(region, regionContent);
       }
@@ -467,9 +870,15 @@ function renderTemplateSlideMarkup(slide) {
   const layout = plan ? plan.layout : null;
   const regions = layout ? layout.regions.map(function (region) {
     const regionContent = content[region.regionKey] || {};
-    return plan.renderRegion(region, regionContent);
+    const markup = plan.renderRegion(region, regionContent);
+    return decorateRegionMarkup(markup, {
+      animationConfig: normalizePlayerAnimationConfig(region.animationJson)
+    });
   }).join('') : '';
-  const stageStyle = layout ? 'background-color:' + escapeHtml(layout.backgroundColor || '#111111') + ';' : '';
+  const stageStyle = layout ? buildBackdropStyle(layout.backgroundColor || '#111111', template.background_image_path) : '';
+  if (layout) {
+    setPlayerCanvasDimensions(layout.canvasWidth, layout.canvasHeight);
+  }
   return renderSlideShell(slide, '', (layout ? layout.canvasWidth : 0) + 'px', (layout ? layout.canvasHeight : 0) + 'px', '<div class="template-stage" style="' + stageStyle + '">' + (layout ? layout.background : '') + regions + '</div>');
 }
 
@@ -486,22 +895,76 @@ function renderMediaSlideContent(slide) {
 function renderMediaSlideMarkup(slide) {
   const canvasSize = fitCanvasSize(16, 9, window.innerWidth, window.innerHeight);
   const media = renderMediaSlideContent(slide);
-  return renderSlideShell(slide, 'slide-media', canvasSize.width + 'px', canvasSize.height + 'px', media);
+  const canvasStyle = slide.kind === 'image' ? buildBackdropStyle('#111111', slide.media_url) : '';
+  setPlayerCanvasDimensions(canvasSize.width, canvasSize.height);
+  return renderSlideShell(slide, 'slide-media', canvasSize.width + 'px', canvasSize.height + 'px', media, canvasStyle);
 }
 
 // Render the shared slide shell around slide-specific inner content.
-function renderSlideShell(slide, canvasClass, canvasWidth, canvasHeight, innerHtml) {
+function renderSlideShell(slide, canvasClass, canvasWidth, canvasHeight, innerHtml, canvasStyle) {
   const body = slide.body ? '<div class="body">' + escapeHtml(slide.body) + '</div>' : '';
   const className = canvasClass ? 'slide-canvas ' + canvasClass : 'slide-canvas';
-  return '<div class="slide"><div class="' + className + '" style="width:' + canvasWidth + ';height:' + canvasHeight + ';">' + innerHtml + body + '</div></div>';
+  const style = 'width:' + canvasWidth + ';height:' + canvasHeight + ';' + (canvasStyle || '');
+  return '<div class="slide"><div class="' + className + '" style="' + style + '">' + innerHtml + body + '</div></div>';
 }
 
 // Build the cache key for rendered slide markup.
 function getSlideMarkupCacheKey(slide) {
   var viewportKey = window.innerWidth + 'x' + window.innerHeight;
-  return [currentPlaylistSignature || '', slide && slide.id ? slide.id : '', slide && slide.template_id ? slide.template_id : '', viewportKey].join('|');
+  return [currentPlaylistSignature || '', slide && slide.id ? slide.id : '', slide && slide.template_id ? slide.template_id : '', slide && slide.modified_at ? slide.modified_at : '', viewportKey, videoRegionRenderVersion || 0].join('|');
 }
 
+function restorePlayerCanvasDimensions(width, height) {
+  if (!document || !document.documentElement) {
+    return;
+  }
+
+  var style = document.documentElement.style;
+  if (width) {
+    style.setProperty('--player-canvas-width', width);
+  } else {
+    style.removeProperty('--player-canvas-width');
+  }
+
+  if (height) {
+    style.setProperty('--player-canvas-height', height);
+  } else {
+    style.removeProperty('--player-canvas-height');
+  }
+}
+
+function primeSlideMarkup(slide) {
+  if (!slide) {
+    return '';
+  }
+
+  var cachedMarkup = getCachedSlideMarkup(slide);
+  if (cachedMarkup) {
+    return cachedMarkup;
+  }
+
+  var previousWidth = document && document.documentElement && document.documentElement.style ? String(document.documentElement.style.getPropertyValue('--player-canvas-width') || '') : '';
+  var previousHeight = document && document.documentElement && document.documentElement.style ? String(document.documentElement.style.getPropertyValue('--player-canvas-height') || '') : '';
+
+  try {
+    return buildSlideMarkupForState(slide, false);
+  } finally {
+    restorePlayerCanvasDimensions(previousWidth.trim(), previousHeight.trim());
+  }
+}
+
+function notifyVideoRegionSourceReady() {
+  if (typeof videoRegionRenderVersion === 'number') {
+    videoRegionRenderVersion += 1;
+  }
+  slideMarkupCache = Object.create(null);
+  if (typeof showCurrent === 'function' && slides && slides.length) {
+    showCurrent();
+  }
+}
+
+window.notifyVideoRegionSourceReady = notifyVideoRegionSourceReady;
+
 // Look up a previously rendered slide in the cache.
 function getCachedSlideMarkup(slide) {
   var cacheKey = getSlideMarkupCacheKey(slide);
@@ -516,9 +979,12 @@ function setCachedSlideMarkup(slide, markup) {
 
 // Slide rendering and markup cache helpers.
 // Choose the right slide renderer and cache the result.
-function buildSlideMarkup(slide) {
-  lastRenderedSlide = slide || null;
-  syncBlackoutState();
+function buildSlideMarkupForState(slide, updateCurrentState) {
+  if (updateCurrentState) {
+    lastRenderedSlide = slide || null;
+    syncBlackoutState();
+  }
+
   var cachedMarkup = getCachedSlideMarkup(slide);
   if (cachedMarkup) {
     return cachedMarkup;
@@ -535,3 +1001,7 @@ function buildSlideMarkup(slide) {
   setCachedSlideMarkup(slide, markup);
   return markup;
 }
+
+function buildSlideMarkup(slide) {
+  return buildSlideMarkupForState(slide, true);
+}

src/player/public/sw.js

@@ -1,4 +1,6 @@
-const CACHE_VERSION = 'v1';
+// Service worker cache strategy for player pages, assets, media, and playlists.
+
+const CACHE_VERSION = 'v38';
 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}`;
@@ -14,6 +16,20 @@ function normalizeRequest(request) {
   });
 }
 
+function shouldBypassCache(request) {
+  if (!request) {
+    return false;
+  }
+
+  if (request.cache === 'reload' || request.cache === 'no-store') {
+    return true;
+  }
+
+  const cacheControl = String(request.headers.get('cache-control') || '').toLowerCase();
+  const pragma = String(request.headers.get('pragma') || '').toLowerCase();
+  return cacheControl.includes('no-cache') || cacheControl.includes('max-age=0') || pragma.includes('no-cache');
+}
+
 async function cacheResponse(cacheName, request, response, cacheKeyRequest) {
   if (!response || !response.ok) {
     return;
@@ -45,7 +61,7 @@ async function networkFirst(request, cacheName, cacheKeyRequest) {
     if (cached) {
       return cached;
     }
-    throw _error;
+    return new Response('', { status: 504, statusText: 'Offline' });
   }
 }
 
@@ -87,6 +103,10 @@ async function staleWhileRevalidate(request, cacheName) {
   return new Response('', { status: 504, statusText: 'Offline' });
 }
 
+async function networkOnly(request) {
+  return fetch(request);
+}
+
 self.addEventListener('install', function (event) {
   self.skipWaiting();
   event.waitUntil(Promise.resolve());
@@ -120,13 +140,18 @@ self.addEventListener('fetch', function (event) {
     return;
   }
 
+  if (shouldBypassCache(request)) {
+    event.respondWith(networkOnly(request));
+    return;
+  }
+
   if (url.pathname.startsWith('/assets/')) {
     event.respondWith(cacheFirst(request, ASSET_CACHE));
     return;
   }
 
   if (url.pathname.startsWith('/media/')) {
-    event.respondWith(staleWhileRevalidate(request, MEDIA_CACHE));
+    event.respondWith(networkOnly(request));
     return;
   }
 

src/player/regions/api.js

@@ -1,3 +1,8 @@
+// API region helpers for resolving source data and nested values.
+
+var registry = window.pulsePlayerRegionTypes;
+var placeholderUtils = window.placeholderUtils || {};
+
 function getApiSourceById(sourceId) {
   var sources = Array.isArray(initialData && initialData.apiSources) ? initialData.apiSources : [];
   var normalizedId = Number(sourceId || 0);
@@ -6,9 +11,29 @@ function getApiSourceById(sourceId) {
   }) || null;
 }
 
-function getApiSourceItems(sourceId) {
+function getApiSourceItemsPath(source, overridePath) {
+  if (overridePath === undefined || overridePath === null) {
+    return String(source && (source.items_path || source.itemsPath) || '').trim();
+  }
+
+  return String(overridePath || '').trim();
+}
+
+function getApiSourceItems(sourceId, itemsPathOverride) {
   var source = getApiSourceById(sourceId);
   var responseJson = source && source.responseJson && typeof source.responseJson === 'object' ? source.responseJson : null;
+  var itemsPath = getApiSourceItemsPath(source, itemsPathOverride);
+  if (itemsPath !== undefined && itemsPath !== null && itemsPath !== '') {
+    var current = responseJson;
+    String(itemsPath).split('.').forEach(function (segment) {
+      if (current === undefined || current === null) {
+        current = '';
+        return;
+      }
+      current = current[segment];
+    });
+    return Array.isArray(current) ? current : [];
+  }
   if (Array.isArray(responseJson)) {
     return responseJson;
   }
@@ -24,44 +49,49 @@ function getApiSourceItems(sourceId) {
   return responseJson ? [responseJson] : [];
 }
 
-function getApiItem(sourceId, itemNumber) {
-  var items = getApiSourceItems(sourceId);
+function getApiItem(sourceId, itemNumber, itemsPathOverride) {
+  var items = getApiSourceItems(sourceId, itemsPathOverride);
   var parsedItemNumber = Math.max(1, Number(itemNumber || 1));
   var index = Number.isFinite(parsedItemNumber) && parsedItemNumber > 0 ? parsedItemNumber - 1 : 0;
   return items[index] || null;
 }
 
-function resolveApiPath(value, path) {
-  var current = value;
-  if (!path) {
-    return current;
-  }
-
-  String(path).split('.').forEach(function (segment) {
-    if (current === undefined || current === null) {
-      current = '';
-      return;
-    }
-    current = current[segment];
-  });
-
-  return current === undefined || current === null ? '' : current;
-}
-
-function substituteApiVariables(html, item) {
+function substituteApiVariables(html, item, sourceId) {
   var source = String(html || '');
-  return source.replace(/\{\{\s*([a-zA-Z0-9_]+)(?:\.([a-zA-Z0-9_.]+))?\s*\}\}/g, function (_match, tokenName, tokenPath) {
+  return source.replace(/\{\{\s*([^{}]+?)\s*\}\}/g, function (_match, expression) {
     if (!item || typeof item !== 'object') {
       return '';
     }
-    var key = tokenName === 'item' && tokenPath ? tokenPath : tokenName;
-    return escapeHtml(resolveApiPath(item, key || ''));
+
+    if (typeof placeholderUtils.resolvePlaceholderExpression !== 'function' || typeof placeholderUtils.formatPlaceholderValue !== 'function') {
+      return '';
+    }
+
+    var resolved = placeholderUtils.resolvePlaceholderExpression(item, expression);
+    if (typeof placeholderUtils.isImagePlaceholderExpression === 'function' && placeholderUtils.isImagePlaceholderExpression(expression)) {
+      var imageSource = placeholderUtils.formatPlaceholderValue(resolved);
+      var source = getApiSourceById(sourceId);
+      imageSource = source && source.imageCache && source.imageCache[imageSource] ? source.imageCache[imageSource] : imageSource;
+      if (!/^(?:https?:\/\/|\/media\/|\/assets\/|\/[^/])/i.test(imageSource)) {
+        return '';
+      }
+      var imageConfig = typeof placeholderUtils.getImagePlaceholderConfig === 'function' ? placeholderUtils.getImagePlaceholderConfig(expression) : {};
+      var hasImageBounds = imageConfig.width && imageConfig.height;
+      var imageStyle = hasImageBounds
+        ? 'display:block;width:100%;height:100%;object-fit:contain;'
+        : 'display:block;width:auto;height:auto;' + (imageConfig.width ? 'max-width:' + imageConfig.width + 'px;' : '') + (imageConfig.height ? 'max-height:' + imageConfig.height + 'px;' : '');
+      var image = '<img src="' + escapeHtml(imageSource) + '" alt="" style="' + imageStyle + '" />';
+      return hasImageBounds
+        ? '<span style="display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:' + imageConfig.width + 'px;height:' + imageConfig.height + 'px;">' + image + '</span>'
+        : image;
+    }
+    return escapeHtml(placeholderUtils.formatPlaceholderValue(resolved));
   });
 }
 
 function getApiPreviewFallback(item) {
   if (!item || typeof item !== 'object') {
-    return '<div class="template-region-placeholder">API item</div>';
+    return '';
   }
 
   var title = String(item.title || item.name || '').trim();
@@ -74,24 +104,50 @@ function getApiPreviewFallback(item) {
     summary.push('<div>' + sanitizeRichText(description) + '</div>');
   }
   if (!summary.length) {
-    return '<div class="template-region-placeholder">API item</div>';
+    return '';
   }
   return summary.join('');
 }
 
+function normalizeRenderableValue(value) {
+  if (value && typeof value === 'object') {
+    if (value.value !== undefined) {
+      return value.value;
+    }
+    if (value.text !== undefined) {
+      return value.text;
+    }
+    if (value.html !== undefined) {
+      return value.html;
+    }
+    try {
+      return JSON.stringify(value);
+    } catch (_error) {
+      return '';
+    }
+  }
+  return value;
+}
+
 function renderApiRegion(region, regionContent) {
-  var content = regionContent && regionContent.value !== undefined ? regionContent.value : '';
+  var content = normalizeRenderableValue(regionContent && regionContent.value !== undefined ? regionContent.value : '');
   var sourceId = regionContent && regionContent.source_id !== undefined ? regionContent.source_id : null;
   var itemNumber = regionContent && regionContent.item_number !== undefined ? regionContent.item_number : 1;
+  var itemsPath = regionContent && regionContent.items_path !== undefined ? regionContent.items_path : '';
   var fontFamily = sanitizeFontFamily(regionContent.font_family || region.fontFamily);
   var fontSize = sanitizeFontSize(regionContent.font_size || region.fontSize);
   var fontColor = sanitizeTextColor(regionContent.font_color || region.fontColor);
-  var item = getApiItem(sourceId, itemNumber);
-  var body = item ? substituteApiVariables(content, item) : '';
-  if (!body && item) {
-    body = getApiPreviewFallback(item);
-  }
+  var item = getApiItem(sourceId, itemNumber, itemsPath);
+  var hasSource = String(sourceId === undefined || sourceId === null ? '' : sourceId).trim() !== '';
+  var body = hasSource ? (item ? substituteApiVariables(content, item, sourceId) : '') : content;
   var contentStyle = 'width:' + region.pixelWidth + 'px;height:' + region.pixelHeight + 'px;transform:scale(' + region.canvasScale + ');transform-origin:top left;' + (fontFamily ? 'font-family:' + escapeHtml(fontFamily) + ';' : '') + 'font-size:' + fontSize + 'px;color:' + escapeHtml(fontColor) + ';';
-  var renderedBody = body ? renderEditorJsContent(body) : '<div class="template-region-placeholder">API item</div>';
-  return '<div class="template-region api" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + '">' + renderedBody + '</div></div>';
-}
+  if (!body) {
+    return '';
+  }
+  var renderedBody = renderEditorJsContent(body);
+  return renderedBody ? '<div class="template-region api" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + '">' + renderedBody + '</div></div>' : '';
+}
+
+registry.register('api', {
+  renderRegion: renderApiRegion
+});

src/player/regions/html.js

@@ -1,11 +1,55 @@
-function renderHtmlRegionContent(value) {
-  var html = String(value || '').trim();
-  if (!html) {
-    return '<div class="template-region-placeholder">HTML</div>';
+// HTML region rendering with sandboxed iframe output.
+
+var registry = window.pulsePlayerRegionTypes;
+
+function normalizeRenderableValue(value) {
+  if (value && typeof value === 'object') {
+    if (value.value !== undefined) {
+      return normalizeRenderableValue(value.value);
+    }
+    if (value.text !== undefined) {
+      return normalizeRenderableValue(value.text);
+    }
+    if (value.html !== undefined) {
+      return normalizeRenderableValue(value.html);
+    }
+    if (value.content !== undefined) {
+      return normalizeRenderableValue(value.content);
+    }
+    return '';
   }
-  return '<iframe class="template-region-html-frame" sandbox="" scrolling="no" srcdoc="<!doctype html><html><head><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:transparent;}</style></head><body>' + escapeHtml(html) + '</body></html>" title="HTML region" loading="eager"></iframe>';
+
+  return String(value === undefined || value === null ? '' : value);
+}
+
+function buildHtmlDocument(html) {
+  var raw = String(html || '').trim();
+  if (!raw) {
+    return '';
+  }
+
+  if (/^<!doctype\b/i.test(raw) || /^<html\b/i.test(raw)) {
+    return raw;
+  }
+
+  return '<!doctype html><html><head><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:transparent;}html,body{background:transparent !important;}</style></head><body>' + raw + '</body></html>';
+}
+
+function renderHtmlRegionContent(value) {
+  var html = normalizeRenderableValue(value).trim();
+  if (!html) {
+    return '';
+  }
+  if (/^<!doctype\b/i.test(html) || /^<html\b/i.test(html)) {
+    return '<iframe class="template-region-html-frame" sandbox="" allowtransparency="true" scrolling="no" srcdoc="' + escapeHtml(html) + '" title="HTML region" loading="eager" style="width:100%;height:100%;border:0;display:block;background:transparent;overflow:hidden;"></iframe>';
+  }
+  return '<div class="template-region-html-content" style="width:100%;height:100%;overflow:hidden;background:transparent;">' + html + '</div>';
 }
 
 function renderHtmlRegion(region, regionContent) {
-  return '<div class="template-region html" style="' + region.baseStyle + '">' + renderHtmlRegionContent(regionContent.value || '') + '</div>';
-}
+  return '<div class="template-region html" style="' + region.baseStyle + '">' + renderHtmlRegionContent(regionContent && regionContent.value !== undefined ? regionContent.value : '') + '</div>';
+}
+
+registry.register('html', {
+  renderRegion: renderHtmlRegion
+});

src/player/regions/image.js

@@ -1,4 +1,15 @@
+// Image region rendering for direct slide media references.
+
+var registry = window.pulsePlayerRegionTypes;
+
 function renderImageRegion(region, regionContent) {
   var src = regionContent.value || '';
+  if (!String(src || '').trim()) {
+    return '';
+  }
   return '<div class="template-region image" style="' + region.baseStyle + '"><img src="' + escapeHtml(src) + '" alt="' + escapeHtml(region.label) + '" /></div>';
-}
+}
+
+registry.register('image', {
+  renderRegion: renderImageRegion
+});

src/player/regions/qr-code.js

@@ -0,0 +1,20 @@
+// QR code region rendering for embedded URL-to-image output.
+
+var registry = window.pulsePlayerRegionTypes;
+
+function renderQrCodeRegion(region, regionContent) {
+  var borderRadius = Math.max(0, Math.round(Number(regionContent && regionContent.qr_border_radius || 0)));
+  var radiusStyle = borderRadius > 0 ? 'border-radius:' + borderRadius + 'px;overflow:hidden;' : '';
+  var preview = String(regionContent && regionContent.qr_preview || '').trim();
+
+  if (!preview) {
+    return '';
+  }
+
+  return '<div class="template-region qr-code" style="' + region.baseStyle + radiusStyle + '"><img class="template-region-qr-code-image" src="' + escapeHtml(preview) + '" alt="QR code" role="img" draggable="false" style="background:transparent;display:block;width:100%;height:100%;object-fit:contain;' + radiusStyle + '" /></div>';
+}
+
+registry.register('qr-code', {
+  renderRegion: renderQrCodeRegion,
+  initRegion: function () {}
+});

src/player/regions/rss.js

@@ -1,3 +1,36 @@
+// RSS region helpers for resolving feeds, items, and nested values.
+
+var registry = window.pulsePlayerRegionTypes;
+var placeholderUtils = window.placeholderUtils || {};
+
+function getDefaultStyle() {
+  return {
+    font_family: 'Arial',
+    font_size: 32,
+    font_color: '#000000'
+  };
+}
+
+function normalizeRenderableValue(value) {
+  if (value && typeof value === 'object') {
+    if (value.value !== undefined) {
+      return value.value;
+    }
+    if (value.text !== undefined) {
+      return value.text;
+    }
+    if (value.html !== undefined) {
+      return value.html;
+    }
+    try {
+      return JSON.stringify(value);
+    } catch (_error) {
+      return '';
+    }
+  }
+  return value;
+}
+
 function getRssFeedById(feedId) {
   var feeds = Array.isArray(initialData && initialData.rssFeeds) ? initialData.rssFeeds : [];
   var normalizedId = Number(feedId || 0);
@@ -31,37 +64,57 @@ function resolveRssPath(value, path) {
   return current === undefined || current === null ? '' : current;
 }
 
-function substituteRssVariables(html, item) {
+function substituteRssVariables(html, item, feedId) {
   var source = String(html || '');
-  return source.replace(/\{\{\s*([a-zA-Z0-9_]+)(?:\.([a-zA-Z0-9_.]+))?\s*\}\}/g, function (_match, tokenName, tokenPath) {
+  return source.replace(/\{\{\s*([^{}]+?)\s*\}\}/g, function (_match, expression) {
     if (!item || typeof item !== 'object') {
       return '';
     }
-    var key = tokenName === 'item' && tokenPath ? tokenPath : tokenName;
-    return escapeHtml(resolveRssPath(item, key || ''));
+    if (typeof placeholderUtils.resolvePlaceholderExpression !== 'function' || typeof placeholderUtils.formatPlaceholderValue !== 'function') {
+      return '';
+    }
+    var resolved = placeholderUtils.resolvePlaceholderExpression(item, expression);
+    if (typeof placeholderUtils.isImagePlaceholderExpression === 'function' && placeholderUtils.isImagePlaceholderExpression(expression)) {
+      var imageSource = placeholderUtils.formatPlaceholderValue(resolved);
+      var feed = getRssFeedById(feedId);
+      imageSource = feed && feed.imageCache && feed.imageCache[imageSource] ? feed.imageCache[imageSource] : imageSource;
+      if (!/^(?:https?:\/\/|\/media\/|\/assets\/|\/[^/])/i.test(imageSource)) {
+        return '';
+      }
+      var imageConfig = typeof placeholderUtils.getImagePlaceholderConfig === 'function' ? placeholderUtils.getImagePlaceholderConfig(expression) : {};
+      var hasImageBounds = imageConfig.width && imageConfig.height;
+      var imageStyle = hasImageBounds
+        ? 'display:block;width:100%;height:100%;object-fit:contain;'
+        : 'display:block;width:auto;height:auto;' + (imageConfig.width ? 'max-width:' + imageConfig.width + 'px;' : '') + (imageConfig.height ? 'max-height:' + imageConfig.height + 'px;' : '');
+      var image = '<img src="' + escapeHtml(imageSource) + '" alt="" style="' + imageStyle + '" />';
+      return hasImageBounds
+        ? '<span style="display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:' + imageConfig.width + 'px;height:' + imageConfig.height + 'px;">' + image + '</span>'
+        : image;
+    }
+    return escapeHtml(placeholderUtils.formatPlaceholderValue(resolved));
   });
 }
 
 function renderRssRegion(region, regionContent) {
-  var content = regionContent && regionContent.value !== undefined ? regionContent.value : '';
+  var content = normalizeRenderableValue(regionContent && regionContent.value !== undefined ? regionContent.value : '');
   var feedId = regionContent && regionContent.feed_id !== undefined ? regionContent.feed_id : null;
   var itemNumber = regionContent && regionContent.item_number !== undefined ? regionContent.item_number : 1;
-  var fontFamily = sanitizeFontFamily(regionContent.font_family || region.fontFamily);
-  var fontSize = sanitizeFontSize(regionContent.font_size || region.fontSize);
-  var fontColor = sanitizeTextColor(regionContent.font_color || region.fontColor);
+  var defaultStyle = getDefaultStyle();
+  var fontFamily = sanitizeFontFamily(regionContent.font_family || region.fontFamily || defaultStyle.font_family);
+  var fontSize = sanitizeFontSize(regionContent.font_size || region.fontSize || defaultStyle.font_size);
+  var fontColor = sanitizeTextColor(regionContent.font_color || region.fontColor || defaultStyle.font_color);
   var item = getRssFeedItem(feedId, itemNumber);
-  var body = item ? substituteRssVariables(content, item) : '';
-  if (!body && item) {
-    var summaryParts = [];
-    if (item.title) {
-      summaryParts.push('<h3>' + escapeHtml(item.title) + '</h3>');
-    }
-    if (item.description) {
-      summaryParts.push('<div>' + sanitizeRichText(item.description) + '</div>');
-    }
-    body = summaryParts.join('');
-  }
+  var hasFeed = String(feedId === undefined || feedId === null ? '' : feedId).trim() !== '';
+  var body = hasFeed ? (item ? substituteRssVariables(content, item, feedId) : '') : content;
   var contentStyle = 'width:' + region.pixelWidth + 'px;height:' + region.pixelHeight + 'px;transform:scale(' + region.canvasScale + ');transform-origin:top left;' + (fontFamily ? 'font-family:' + escapeHtml(fontFamily) + ';' : '') + 'font-size:' + fontSize + 'px;color:' + escapeHtml(fontColor) + ';';
-  var renderedBody = body ? renderEditorJsContent(body) : '<div class="template-region-placeholder">RSS item</div>';
-  return '<div class="template-region rss" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + '">' + renderedBody + '</div></div>';
+  if (!body) {
+    return '';
+  }
+  var renderedBody = renderEditorJsContent(body);
+  return renderedBody ? '<div class="template-region rss" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + '">' + renderedBody + '</div></div>' : '';
 }
+
+registry.register('rss', {
+  getDefaultStyle: getDefaultStyle,
+  renderRegion: renderRssRegion
+});

src/player/regions/rtmp.js

@@ -1,20 +1,298 @@
+var registry = window.pulsePlayerRegionTypes;
+
 function renderRtmpRegion(region, regionContent) {
   var url = String(regionContent.value || '').trim();
   var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
+  var skipUnavailable = Boolean(currentPlaylistSkipUnavailableRtmp);
   if (!url) {
-    return '<div class="template-region rtmp" style="' + region.baseStyle + '"><div class="template-region-placeholder">RTMP stream</div></div>';
+    return '';
   }
 
-  return '<div class="template-region rtmp" style="' + region.baseStyle + '"><video class="template-region-rtmp-video" data-rtmp-source="' + escapeHtml(url) + '" data-rtmp-disable-audio="' + (disableAudio ? '1' : '0') + '" autoplay playsinline preload="auto" tabindex="-1" disablepictureinpicture></video><div class="template-region-placeholder template-region-rtmp-placeholder">Loading RTMP stream...</div></div>';
+  return '<div class="template-region rtmp" style="' + region.baseStyle + '"><video class="template-region-rtmp-video" data-rtmp-source="' + escapeHtml(url) + '" data-rtmp-disable-audio="' + (disableAudio ? '1' : '0') + '" data-rtmp-skip-unavailable="' + (skipUnavailable ? '1' : '0') + '" autoplay playsinline preload="auto" tabindex="-1" disablepictureinpicture' + (disableAudio ? ' muted' : '') + '></video><div class="template-region-placeholder template-region-rtmp-placeholder">Loading RTMP stream...</div></div>';
 }
 
 function getRtmpSessionUrl(sourceUrl, disableAudio) {
   return '/api/rtmp/session?source=' + encodeURIComponent(sourceUrl) + '&disableAudio=' + (disableAudio ? '1' : '0');
 }
 
-var rtmpPreloadSignature = '';
+var rtmpAvailabilityCache = Object.create(null);
+var rtmpAvailabilityRetryMs = 5000;
+var rtmpWarmupTimers = Object.create(null);
+var rtmpBrowserReadyCache = Object.create(null);
+var rtmpBrowserWarmupTimers = Object.create(null);
+var rtmpBrowserWarmupContainer = null;
+var rtmpBrowserWarmupStates = Object.create(null);
 
-function getRtmpPreloadSlides(sourceSlides, targetIndex) {
+function getRtmpAvailabilityKey(sourceUrl, disableAudio) {
+  return String(sourceUrl || '').trim() + '\n' + (disableAudio ? '1' : '0');
+}
+
+function setRtmpAvailability(sourceUrl, disableAudio, available) {
+  var key = getRtmpAvailabilityKey(sourceUrl, disableAudio);
+  rtmpAvailabilityCache[key] = {
+    available: available === null ? null : Boolean(available),
+    pending: available === null,
+    checkedAt: Date.now()
+  };
+}
+
+function getRtmpAvailability(sourceUrl, disableAudio) {
+  return rtmpAvailabilityCache[getRtmpAvailabilityKey(sourceUrl, disableAudio)] || null;
+}
+
+function isRtmpAvailabilityStale(status) {
+  if (!status || !status.checkedAt) {
+    return true;
+  }
+  return Date.now() - Number(status.checkedAt || 0) >= rtmpAvailabilityRetryMs;
+}
+
+function isRtmpSlideUnavailable(slide) {
+  if (!slide || !slide.template || !Array.isArray(slide.template.regions)) {
+    return false;
+  }
+
+  var content = slide.content || {};
+  return slide.template.regions.some(function (region) {
+    if (region.region_type !== 'rtmp') {
+      return false;
+    }
+
+    var regionContent = content[region.region_key] || {};
+    var sourceUrl = String(regionContent.value || '').trim();
+    if (!sourceUrl) {
+      return false;
+    }
+
+    var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
+    var serverStatus = getRtmpAvailability(sourceUrl, disableAudio);
+    return Boolean(!serverStatus || isRtmpAvailabilityStale(serverStatus) || serverStatus.available !== true);
+  });
+}
+
+function clearRtmpAvailabilityForSlide(slide) {
+  if (!slide || !slide.template || !Array.isArray(slide.template.regions)) {
+    return;
+  }
+
+  var content = slide.content || {};
+  slide.template.regions.forEach(function (region) {
+    if (region.region_type !== 'rtmp') {
+      return;
+    }
+
+    var regionContent = content[region.region_key] || {};
+    var sourceUrl = String(regionContent.value || '').trim();
+    if (!sourceUrl) {
+      return;
+    }
+
+    var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
+    setRtmpAvailability(sourceUrl, disableAudio, null);
+  });
+}
+
+function setRtmpBrowserReady(sourceUrl, disableAudio, ready) {
+  var key = getRtmpAvailabilityKey(sourceUrl, disableAudio);
+  rtmpBrowserReadyCache[key] = {
+    ready: ready === null ? null : Boolean(ready),
+    checkedAt: Date.now()
+  };
+}
+
+function getRtmpBrowserReady(sourceUrl, disableAudio) {
+  return rtmpBrowserReadyCache[getRtmpAvailabilityKey(sourceUrl, disableAudio)] || null;
+}
+
+function isRtmpBrowserReadyStale(status) {
+  if (!status || !status.checkedAt) {
+    return true;
+  }
+  return Date.now() - Number(status.checkedAt || 0) >= rtmpAvailabilityRetryMs;
+}
+
+function ensureRtmpBrowserWarmupContainer() {
+  if (rtmpBrowserWarmupContainer) {
+    return rtmpBrowserWarmupContainer;
+  }
+
+  rtmpBrowserWarmupContainer = document.createElement('div');
+  rtmpBrowserWarmupContainer.className = 'rtmp-browser-warmups';
+  rtmpBrowserWarmupContainer.setAttribute('aria-hidden', 'true');
+  document.body.appendChild(rtmpBrowserWarmupContainer);
+  return rtmpBrowserWarmupContainer;
+}
+
+function getRtmpBrowserWarmupState(sourceUrl, disableAudio) {
+  return rtmpBrowserWarmupStates[getRtmpAvailabilityKey(sourceUrl, disableAudio)] || null;
+}
+
+function clearRtmpBrowserWarmupState(sourceUrl, disableAudio) {
+  var key = getRtmpAvailabilityKey(sourceUrl, disableAudio);
+  var state = rtmpBrowserWarmupStates[key];
+  if (!state) {
+    return;
+  }
+
+  if (state.video && state.video.__rtmpBrowserWarmupTimer) {
+    window.clearTimeout(state.video.__rtmpBrowserWarmupTimer);
+    state.video.__rtmpBrowserWarmupTimer = null;
+  }
+  if (state.video && state.video.__rtmpHls) {
+    try {
+      state.video.__rtmpHls.destroy();
+    } catch (_error) {
+      // ignore cleanup errors
+    }
+    state.video.__rtmpHls = null;
+  }
+  if (state.wrapper && state.wrapper.parentNode) {
+    state.wrapper.parentNode.removeChild(state.wrapper);
+  }
+  delete rtmpBrowserWarmupStates[key];
+}
+
+function warmupRtmpBrowser(sourceUrl, disableAudio) {
+  var key = getRtmpAvailabilityKey(sourceUrl, disableAudio);
+  var existing = rtmpBrowserWarmupStates[key];
+  if (existing) {
+    return existing;
+  }
+
+  var wrapper = document.createElement('div');
+  wrapper.className = 'rtmp-browser-warmup-entry';
+  wrapper.setAttribute('aria-hidden', 'true');
+
+  var video = document.createElement('video');
+  video.className = 'template-region-rtmp-video';
+  video.dataset.rtmpSource = sourceUrl;
+  video.dataset.rtmpDisableAudio = disableAudio ? '1' : '0';
+  video.autoplay = true;
+  video.playsInline = true;
+  video.preload = 'auto';
+  video.tabIndex = -1;
+  video.disablePictureInPicture = true;
+  video.muted = disableAudio;
+
+  wrapper.appendChild(video);
+  ensureRtmpBrowserWarmupContainer().appendChild(wrapper);
+
+  var state = {
+    wrapper: wrapper,
+    video: video,
+    sourceUrl: sourceUrl,
+    disableAudio: disableAudio
+  };
+  rtmpBrowserWarmupStates[key] = state;
+  setRtmpBrowserReady(sourceUrl, disableAudio, null);
+
+  var markReady = function () {
+    setRtmpBrowserReady(sourceUrl, disableAudio, true);
+    clearRtmpBrowserWarmupState(sourceUrl, disableAudio);
+  };
+
+  var markNotReady = function () {
+    setRtmpBrowserReady(sourceUrl, disableAudio, false);
+  };
+
+  video.addEventListener('canplay', markReady, { once: true });
+  video.addEventListener('playing', markReady, { once: true });
+  video.addEventListener('error', markNotReady, { once: true });
+
+  if (window.Hls && window.Hls.isSupported && window.Hls.isSupported()) {
+    var hls = new window.Hls({
+      enableWorker: true,
+      lowLatencyMode: true,
+      liveSyncDurationCount: 4,
+      liveMaxLatencyDurationCount: 8,
+      maxBufferLength: 10,
+      maxLiveSyncPlaybackRate: 1,
+      backBufferLength: 10
+    });
+    video.__rtmpHls = hls;
+    hls.attachMedia(video);
+    hls.on(window.Hls.Events.MEDIA_ATTACHED, function () {
+      requestWarmupPlaylist(sourceUrl, disableAudio, video, markNotReady);
+    });
+    hls.on(window.Hls.Events.ERROR, function (_event, data) {
+      if (data && data.fatal) {
+        markNotReady();
+        clearRtmpBrowserWarmupState(sourceUrl, disableAudio);
+      }
+    });
+    return state;
+  }
+
+  if (video.canPlayType && video.canPlayType('application/vnd.apple.mpegurl')) {
+    requestWarmupPlaylist(sourceUrl, disableAudio, video, markNotReady);
+    return state;
+  }
+
+  markNotReady();
+  return state;
+}
+
+function requestWarmupPlaylist(sourceUrl, disableAudio, video, onFailure) {
+  fetch(getRtmpSessionUrl(sourceUrl, disableAudio), {
+    credentials: 'same-origin'
+  }).then(function (response) {
+    return response.json().catch(function () {
+      return null;
+    }).then(function (payload) {
+      return {
+        response: response,
+        payload: payload
+      };
+    });
+  }).then(function (result) {
+    if (!result || !result.response) {
+      throw new Error('Unable to initialize RTMP stream.');
+    }
+
+    var response = result.response;
+    var payload = result.payload || null;
+    var playlistUrl = payload && payload.playlistUrl ? String(payload.playlistUrl).trim() : '';
+
+    if (!response.ok) {
+      if (response.status === 503 && payload && payload.probing) {
+        setRtmpBrowserReady(sourceUrl, disableAudio, null);
+        if (video && !video.__rtmpBrowserWarmupTimer) {
+          video.__rtmpBrowserWarmupTimer = window.setTimeout(function () {
+            video.__rtmpBrowserWarmupTimer = null;
+            requestWarmupPlaylist(sourceUrl, disableAudio, video, onFailure);
+          }, 500);
+        }
+        return;
+      }
+      throw new Error('Unable to initialize RTMP stream.');
+    }
+
+    if (!playlistUrl) {
+      throw new Error('RTMP playlist URL was not returned.');
+    }
+
+    setRtmpBrowserReady(sourceUrl, disableAudio, false);
+
+    if (video.__rtmpHls && window.Hls && window.Hls.isSupported && window.Hls.isSupported()) {
+      video.__rtmpHls.loadSource(playlistUrl);
+      return;
+    }
+
+    if (video) {
+      video.src = playlistUrl;
+      video.play().catch(function () {
+        return null;
+      });
+    }
+  }).catch(function () {
+    setRtmpBrowserReady(sourceUrl, disableAudio, false);
+    if (typeof onFailure === 'function') {
+      onFailure();
+    }
+  });
+}
+
+function getRtmpWarmupSlides(sourceSlides, targetIndex) {
   var availableSlides = Array.isArray(sourceSlides) ? sourceSlides : [];
   if (!availableSlides.length) {
     return [];
@@ -25,21 +303,17 @@ function getRtmpPreloadSlides(sourceSlides, targetIndex) {
     normalizedIndex = 0;
   }
 
-  var preloadSlides = [];
-  var currentSlide = availableSlides[normalizedIndex];
+  var warmupSlides = [];
   var nextSlide = availableSlides[normalizedIndex + 1];
 
-  if (currentSlide) {
-    preloadSlides.push(currentSlide);
-  }
-  if (nextSlide && nextSlide !== currentSlide) {
-    preloadSlides.push(nextSlide);
+  if (nextSlide) {
+    warmupSlides.push(nextSlide);
   }
 
-  return preloadSlides;
+  return warmupSlides;
 }
 
-function getRtmpPreloadEntries(sourceSlides) {
+function getRtmpWarmupEntries(sourceSlides) {
   var entries = [];
   var seen = Object.create(null);
 
@@ -50,20 +324,24 @@ function getRtmpPreloadEntries(sourceSlides) {
       if (region.region_type !== 'rtmp') {
         return;
       }
+
       var regionContent = content[region.region_key] || {};
       var url = String(regionContent.value || '').trim();
       if (!url) {
         return;
       }
+
       var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
-      var key = url + '\n' + (disableAudio ? '1' : '0');
+      var key = getRtmpAvailabilityKey(url, disableAudio);
       if (seen[key]) {
         return;
       }
+
       seen[key] = true;
       entries.push({
         url: url,
-        disableAudio: disableAudio
+        disableAudio: disableAudio,
+        key: key
       });
     });
   });
@@ -71,30 +349,396 @@ function getRtmpPreloadEntries(sourceSlides) {
   return entries;
 }
 
-function syncRtmpPreloads(sourceSlides, targetIndex) {
-  var entries = getRtmpPreloadEntries(getRtmpPreloadSlides(sourceSlides, targetIndex));
-  var signature = entries.map(function (entry) {
-    return entry.url + '\n' + (entry.disableAudio ? '1' : '0');
-  }).join('\n');
-
-  if (signature === rtmpPreloadSignature) {
-    return;
-  }
-
-  rtmpPreloadSignature = signature;
-  if (!entries.length) {
-    return;
-  }
+function syncRtmpWarmups(sourceSlides, targetIndex) {
+  var entries = getRtmpWarmupEntries(getRtmpWarmupSlides(sourceSlides, targetIndex));
 
   entries.forEach(function (entry) {
-    fetch(getRtmpSessionUrl(entry.url, entry.disableAudio), {
-      credentials: 'same-origin'
-    }).catch(function () {
-      return null;
-    });
+    var status = getRtmpAvailability(entry.url, entry.disableAudio);
+    if (status && !isRtmpAvailabilityStale(status) && status.available === true) {
+      return;
+    }
+
+    if (rtmpWarmupTimers[entry.key]) {
+      return;
+    }
+
+    function requestWarmup() {
+      fetch(getRtmpSessionUrl(entry.url, entry.disableAudio), {
+        credentials: 'same-origin'
+      }).then(function (response) {
+        return response.json().catch(function () {
+          return null;
+        }).then(function (payload) {
+          return {
+            response: response,
+            payload: payload
+          };
+        });
+      }).then(function (result) {
+        rtmpWarmupTimers[entry.key] = null;
+        if (!result || !result.response) {
+          setRtmpAvailability(entry.url, entry.disableAudio, false);
+          return;
+        }
+
+        if (!result.response.ok) {
+          if (result.response.status === 503 && result.payload && result.payload.probing) {
+            setRtmpAvailability(entry.url, entry.disableAudio, null);
+            rtmpWarmupTimers[entry.key] = window.setTimeout(function () {
+              rtmpWarmupTimers[entry.key] = null;
+              requestWarmup();
+            }, 500);
+            return;
+          }
+          setRtmpAvailability(entry.url, entry.disableAudio, false);
+          return;
+        }
+
+        setRtmpAvailability(entry.url, entry.disableAudio, true);
+      }).catch(function () {
+        rtmpWarmupTimers[entry.key] = null;
+        setRtmpAvailability(entry.url, entry.disableAudio, false);
+      });
+    }
+
+    setRtmpAvailability(entry.url, entry.disableAudio, null);
+    requestWarmup();
   });
 }
 
+async function probeRtmpSlideAvailability(slide) {
+  var entries = getRtmpWarmupEntries([slide]);
+  if (!entries.length) {
+    return true;
+  }
+
+  var results = await Promise.all(entries.map(function (entry) {
+    setRtmpAvailability(entry.url, entry.disableAudio, null);
+    return fetch(getRtmpSessionUrl(entry.url, entry.disableAudio), {
+      credentials: 'same-origin'
+    }).then(function (response) {
+      return response.json().catch(function () {
+        return null;
+      }).then(function (payload) {
+        return {
+          response: response,
+          payload: payload
+        };
+      });
+    }).then(function (result) {
+      if (!result || !result.response) {
+        setRtmpAvailability(entry.url, entry.disableAudio, false);
+        return false;
+      }
+
+      if (!result.response.ok) {
+        if (result.response.status === 503 && result.payload && result.payload.probing) {
+          setRtmpAvailability(entry.url, entry.disableAudio, null);
+          return false;
+        }
+        setRtmpAvailability(entry.url, entry.disableAudio, false);
+        return false;
+      }
+
+      setRtmpAvailability(entry.url, entry.disableAudio, true);
+      return true;
+    }).catch(function () {
+      setRtmpAvailability(entry.url, entry.disableAudio, false);
+      return false;
+    });
+  }));
+
+  return results.every(function (value) {
+    return Boolean(value);
+  });
+}
+
+function syncRtmpBrowserWarmups(sourceSlides, targetIndex) {
+  return;
+}
+
+function isRtmpBrowserUnavailable(slide) {
+  if (!slide || !slide.template || !Array.isArray(slide.template.regions)) {
+    return false;
+  }
+
+  var content = slide.content || {};
+  return slide.template.regions.some(function (region) {
+    if (region.region_type !== 'rtmp') {
+      return false;
+    }
+
+    var regionContent = content[region.region_key] || {};
+    var sourceUrl = String(regionContent.value || '').trim();
+    if (!sourceUrl) {
+      return false;
+    }
+
+    var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
+    var status = getRtmpBrowserReady(sourceUrl, disableAudio);
+    return Boolean(!status || isRtmpBrowserReadyStale(status) || status.ready !== true);
+  });
+}
+
+function bindRtmpVideoPlaceholder(video, placeholder) {
+  if (!video) {
+    return;
+  }
+
+  var markReady = function () {
+    if (placeholder) {
+      placeholder.style.display = 'none';
+    }
+  };
+
+  video.addEventListener('canplay', markReady, { once: true });
+  video.addEventListener('playing', markReady, { once: true });
+  if (video.readyState >= 2) {
+    markReady();
+  }
+}
+
+function startRtmpPlayback(video, sourceUrl, disableAudio, skipUnavailable, placeholder, isPreload, onFailure) {
+  var startupTimeoutMs = skipUnavailable ? 6000 : 0;
+  var startupTimer = null;
+  var probeRetryTimer = null;
+  var webReceiveTimer = null;
+  var webReceiveRetryUsed = false;
+
+  function failPlayback(message, silent) {
+    if (video.dataset.rtmpFailureHandled === '1') {
+      return;
+    }
+    video.dataset.rtmpFailureHandled = '1';
+    if (typeof onFailure === 'function') {
+      onFailure(message, silent);
+      return;
+    }
+    if (!isPreload && skipUnavailable && typeof handleRtmpPlaybackFailure === 'function' && handleRtmpPlaybackFailure(message, { silent: Boolean(silent) })) {
+      return;
+    }
+    if (placeholder) {
+      placeholder.style.display = 'flex';
+      placeholder.textContent = message;
+    }
+  }
+
+  function clearStartupTimer() {
+    if (startupTimer) {
+      window.clearTimeout(startupTimer);
+      startupTimer = null;
+    }
+    if (video.__rtmpStartupTimer) {
+      video.__rtmpStartupTimer = null;
+    }
+    if (probeRetryTimer) {
+      window.clearTimeout(probeRetryTimer);
+      probeRetryTimer = null;
+    }
+    if (video.__rtmpProbeRetryTimer) {
+      video.__rtmpProbeRetryTimer = null;
+    }
+    if (webReceiveTimer) {
+      window.clearTimeout(webReceiveTimer);
+      webReceiveTimer = null;
+    }
+    if (video.__rtmpWebReceiveTimer) {
+      video.__rtmpWebReceiveTimer = null;
+    }
+  }
+
+  function tryPlay() {
+    if (video && typeof video.play === 'function') {
+      video.play().catch(function () {
+        return null;
+      });
+    }
+  }
+
+  function markReceiving() {
+    if (webReceiveTimer) {
+      window.clearTimeout(webReceiveTimer);
+      webReceiveTimer = null;
+    }
+    if (video.__rtmpWebReceiveTimer) {
+      video.__rtmpWebReceiveTimer = null;
+    }
+  }
+
+  function scheduleReceiveRetry() {
+    if (isPreload || webReceiveRetryUsed || video.dataset.rtmpFailureHandled === '1') {
+      return;
+    }
+    if (webReceiveTimer) {
+      return;
+    }
+    webReceiveTimer = window.setTimeout(function () {
+      webReceiveTimer = null;
+      video.__rtmpWebReceiveTimer = null;
+      if (video.dataset.rtmpFailureHandled === '1' || webReceiveRetryUsed) {
+        return;
+      }
+      if (video.readyState >= 2) {
+        return;
+      }
+      webReceiveRetryUsed = true;
+      clearStartupTimer();
+      try {
+        if (video.__rtmpHls) {
+          video.__rtmpHls.destroy();
+        }
+      } catch (_error) {
+        // ignore cleanup errors
+      }
+      video.__rtmpHls = null;
+      requestSession();
+    }, 1200);
+    video.__rtmpWebReceiveTimer = webReceiveTimer;
+  }
+
+  function retryWebReceiveOrFail(message, silent) {
+    if (isPreload || video.dataset.rtmpFailureHandled === '1') {
+      return;
+    }
+    if (!webReceiveRetryUsed) {
+      webReceiveRetryUsed = true;
+      clearStartupTimer();
+      if (webReceiveTimer) {
+        window.clearTimeout(webReceiveTimer);
+        webReceiveTimer = null;
+      }
+      if (video.__rtmpWebReceiveTimer) {
+        video.__rtmpWebReceiveTimer = null;
+      }
+      window.setTimeout(function () {
+        requestSession();
+      }, 500);
+      return;
+    }
+    failPlayback(message, silent);
+  }
+
+  video.dataset.rtmpInitialized = '1';
+  video.muted = disableAudio;
+  video.controls = false;
+  video.playsInline = true;
+  video.autoplay = true;
+
+  bindRtmpVideoPlaceholder(video, placeholder);
+  video.addEventListener('canplay', markReceiving, { once: true });
+  video.addEventListener('playing', markReceiving, { once: true });
+
+  if (startupTimeoutMs > 0) {
+    startupTimer = window.setTimeout(function () {
+      startupTimer = null;
+      video.__rtmpStartupTimer = null;
+      failPlayback('Unable to load RTMP stream.', true);
+    }, startupTimeoutMs);
+    video.__rtmpStartupTimer = startupTimer;
+  }
+
+  function retryWhileProbing() {
+    if (probeRetryTimer || video.dataset.rtmpFailureHandled === '1') {
+      return;
+    }
+    probeRetryTimer = window.setTimeout(function () {
+      probeRetryTimer = null;
+      video.__rtmpProbeRetryTimer = null;
+      requestSession();
+    }, 500);
+    video.__rtmpProbeRetryTimer = probeRetryTimer;
+  }
+
+  function requestSession() {
+    fetch(getRtmpSessionUrl(sourceUrl, disableAudio), {
+      credentials: 'same-origin'
+    }).then(function (response) {
+      return response.json().catch(function () {
+        return null;
+      }).then(function (payload) {
+        return {
+          response: response,
+          payload: payload
+        };
+      });
+    }).then(function (result) {
+      if (!result || !result.response) {
+        throw new Error('Unable to initialize RTMP stream.');
+      }
+
+      var response = result.response;
+      var payload = result.payload || null;
+      var playlistUrl = payload && payload.playlistUrl ? String(payload.playlistUrl).trim() : '';
+
+      if (!response.ok) {
+        if (response.status === 503 && payload && payload.probing) {
+          setRtmpAvailability(sourceUrl, disableAudio, null);
+          retryWhileProbing();
+          return null;
+        }
+        setRtmpAvailability(sourceUrl, disableAudio, false);
+        retryWebReceiveOrFail('Unable to load RTMP stream.', true);
+        return null;
+      }
+
+      setRtmpAvailability(sourceUrl, disableAudio, true);
+      if (!playlistUrl) {
+        throw new Error('RTMP playlist URL was not returned.');
+      }
+
+    if (window.Hls && window.Hls.isSupported && window.Hls.isSupported()) {
+      var hls = new window.Hls({
+        enableWorker: true,
+        liveSyncDurationCount: 6,
+        liveMaxLatencyDurationCount: 12,
+        maxBufferLength: 30,
+        maxLiveSyncPlaybackRate: 1,
+        backBufferLength: 60
+      });
+      video.__rtmpHls = hls;
+      hls.attachMedia(video);
+      hls.on(window.Hls.Events.MEDIA_ATTACHED, function () {
+        hls.loadSource(playlistUrl);
+        scheduleReceiveRetry();
+      });
+      hls.on(window.Hls.Events.MANIFEST_PARSED, function () {
+        tryPlay();
+      });
+      hls.on(window.Hls.Events.ERROR, function (_event, data) {
+        if (data && data.fatal) {
+          clearStartupTimer();
+          setRtmpAvailability(sourceUrl, disableAudio, false);
+          try {
+            hls.destroy();
+          } catch (_error) {
+            // ignore cleanup errors
+          }
+          video.__rtmpHls = null;
+          retryWebReceiveOrFail('RTMP playback failed.', true);
+        }
+      });
+      return;
+    }
+
+    if (video.canPlayType && video.canPlayType('application/vnd.apple.mpegurl')) {
+      video.src = playlistUrl;
+      tryPlay();
+      scheduleReceiveRetry();
+      return;
+    }
+
+    failPlayback('RTMP playback is not supported in this browser.', true);
+        return null;
+      }).catch(function () {
+        clearStartupTimer();
+        setRtmpAvailability(sourceUrl, disableAudio, false);
+        retryWebReceiveOrFail('Unable to load RTMP stream.', true);
+      });
+  }
+
+  requestSession();
+}
+
 function syncRtmpRegions(root) {
   if (!root) {
     return;
@@ -118,93 +762,32 @@ function syncRtmpRegions(root) {
       return;
     }
 
-    video.dataset.rtmpInitialized = '1';
-    video.muted = disableAudio;
-    video.controls = false;
-    video.playsInline = true;
-    video.autoplay = true;
+    var skipUnavailable = String(video.dataset.rtmpSkipUnavailable || '0') === '1';
+    var startupTimer = null;
 
-    var markReady = function () {
-      if (placeholder) {
-        placeholder.style.display = 'none';
-      }
-    };
-
-    var tryPlay = function () {
-      if (video && typeof video.play === 'function') {
-        video.play().catch(function () {
-          return null;
-        });
-      }
-    };
-
-    video.addEventListener('canplay', markReady, { once: true });
-    video.addEventListener('playing', markReady, { once: true });
-
-    fetch(getRtmpSessionUrl(sourceUrl, disableAudio), {
-      credentials: 'same-origin'
-    }).then(function (response) {
-      if (!response.ok) {
-        throw new Error('Unable to initialize RTMP stream.');
-      }
-      return response.json();
-    }).then(function (payload) {
-      var playlistUrl = payload && payload.playlistUrl ? String(payload.playlistUrl).trim() : '';
-      if (!playlistUrl) {
-        throw new Error('RTMP playlist URL was not returned.');
-      }
-
-      if (window.Hls && window.Hls.isSupported && window.Hls.isSupported()) {
-        var hls = new window.Hls({
-          enableWorker: true,
-          lowLatencyMode: true,
-          liveSyncDurationCount: 4,
-          liveMaxLatencyDurationCount: 8,
-          maxBufferLength: 20,
-          maxLiveSyncPlaybackRate: 1,
-          backBufferLength: 30
-        });
-        video.__rtmpHls = hls;
-        hls.attachMedia(video);
-        hls.on(window.Hls.Events.MEDIA_ATTACHED, function () {
-          hls.loadSource(playlistUrl);
-        });
-        hls.on(window.Hls.Events.MANIFEST_PARSED, function () {
-          tryPlay();
-        });
-        hls.on(window.Hls.Events.ERROR, function (_event, data) {
-          if (data && data.fatal) {
-            try {
-              hls.destroy();
-            } catch (_error) {
-              // ignore cleanup errors
-            }
-            video.__rtmpHls = null;
-            if (placeholder) {
-              placeholder.style.display = 'flex';
-              placeholder.textContent = 'RTMP playback failed.';
-            }
-          }
-        });
+    if (skipUnavailable) {
+      var preflightStatus = getRtmpAvailability(sourceUrl, disableAudio);
+      if (preflightStatus && !isRtmpAvailabilityStale(preflightStatus) && preflightStatus.available === false) {
+        failPlayback('Unable to load RTMP stream.', true);
         return;
       }
+    }
 
-      if (video.canPlayType && video.canPlayType('application/vnd.apple.mpegurl')) {
-        video.src = playlistUrl;
-        tryPlay();
+    function failPlayback(message, silent) {
+      if (video.dataset.rtmpFailureHandled === '1') {
         return;
       }
+      video.dataset.rtmpFailureHandled = '1';
+      if (skipUnavailable && typeof handleRtmpPlaybackFailure === 'function' && handleRtmpPlaybackFailure(message, { silent: Boolean(silent) })) {
+        return;
+      }
+      if (placeholder) {
+        placeholder.style.display = 'flex';
+        placeholder.textContent = message;
+      }
+    }
 
-      if (placeholder) {
-        placeholder.style.display = 'flex';
-        placeholder.textContent = 'RTMP playback is not supported in this browser.';
-      }
-    }).catch(function (_error) {
-      if (placeholder) {
-        placeholder.style.display = 'flex';
-        placeholder.textContent = 'Unable to load RTMP stream.';
-      }
-    });
+    startRtmpPlayback(video, sourceUrl, disableAudio, skipUnavailable, placeholder, false);
   });
 }
 
@@ -215,6 +798,18 @@ function destroyRtmpRegions(root) {
 
   var videos = root.querySelectorAll('video[data-rtmp-source]');
   Array.prototype.forEach.call(videos, function (video) {
+    if (video.__rtmpStartupTimer) {
+      window.clearTimeout(video.__rtmpStartupTimer);
+      video.__rtmpStartupTimer = null;
+    }
+    if (video.__rtmpProbeRetryTimer) {
+      window.clearTimeout(video.__rtmpProbeRetryTimer);
+      video.__rtmpProbeRetryTimer = null;
+    }
+    if (video.__rtmpWebReceiveTimer) {
+      window.clearTimeout(video.__rtmpWebReceiveTimer);
+      video.__rtmpWebReceiveTimer = null;
+    }
     if (video.__rtmpHls) {
       try {
         video.__rtmpHls.destroy();
@@ -224,4 +819,8 @@ function destroyRtmpRegions(root) {
       video.__rtmpHls = null;
     }
   });
-}
+}
+
+registry.register('rtmp', {
+  renderRegion: renderRtmpRegion
+});

src/player/regions/text.js

@@ -1,7 +1,51 @@
+// Text region rendering with font and color normalization.
+
+var registry = window.pulsePlayerRegionTypes;
+
+function getDefaultStyle() {
+  return {
+    font_family: 'Arial',
+    font_size: 32,
+    font_color: '#000000'
+  };
+}
+
+function normalizeRenderableValue(value) {
+  if (value && typeof value === 'object') {
+    if (value.value !== undefined) {
+      return value.value;
+    }
+    if (value.text !== undefined) {
+      return value.text;
+    }
+    if (value.html !== undefined) {
+      return value.html;
+    }
+    try {
+      return JSON.stringify(value);
+    } catch (_error) {
+      return '';
+    }
+  }
+  return value;
+}
+
 function renderTextRegion(region, regionContent) {
-  var fontFamily = sanitizeFontFamily(regionContent.font_family || region.fontFamily);
-  var fontSize = sanitizeFontSize(regionContent.font_size || region.fontSize);
-  var fontColor = sanitizeTextColor(regionContent.font_color || region.fontColor);
-  var contentStyle = 'width:' + region.pixelWidth + 'px;height:' + region.pixelHeight + 'px;transform:scale(' + region.canvasScale + ');transform-origin:top left;' + (fontFamily ? 'font-family:' + escapeHtml(fontFamily) + ';' : '') + 'font-size:' + fontSize + 'px;color:' + escapeHtml(fontColor) + ';';
-  return '<div class="template-region text" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + '">' + renderEditorJsContent(regionContent.value || '') + '</div></div>';
-}
+  var rawValue = normalizeRenderableValue(regionContent && regionContent.value !== undefined ? regionContent.value : '');
+  if (!String(rawValue || '').trim()) {
+    return '';
+  }
+
+  var defaultStyle = getDefaultStyle();
+  var fontFamily = sanitizeFontFamily(regionContent.font_family || region.fontFamily || defaultStyle.font_family);
+  var fontSize = sanitizeFontSize(regionContent.font_size || region.fontSize || defaultStyle.font_size);
+  var fontColor = sanitizeTextColor(regionContent.font_color || region.fontColor || defaultStyle.font_color);
+  var contentStyle = 'width:' + region.pixelWidth + 'px;height:' + region.pixelHeight + 'px;transform:scale(' + region.canvasScale + ');transform-origin:top left;line-height:1.5;' + (fontFamily ? 'font-family:' + escapeHtml(fontFamily) + ';' : '') + 'font-size:' + fontSize + 'px;color:' + escapeHtml(fontColor) + ';';
+  var renderedBody = renderEditorJsContent(rawValue);
+  return renderedBody ? '<div class="template-region text" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + '">' + renderedBody + '</div></div>' : '';
+}
+
+registry.register('text', {
+  getDefaultStyle: getDefaultStyle,
+  renderRegion: renderTextRegion
+});

src/player/regions/time-date.js

@@ -0,0 +1,330 @@
+// Time/date region rendering and live updates.
+
+var registry = window.pulsePlayerRegionTypes;
+var placeholderUtils = window.placeholderUtils || {};
+var DEFAULT_FORMAT = '{{hh}}:{{mm}}';
+var DEFAULT_STYLE = {
+  font_family: 'Arial',
+  font_size: 32,
+  font_color: '#000000'
+};
+var timeDateFormatterCache = Object.create(null);
+
+function sanitizeTagAttributes(tagName, attrText) {
+  var allowedAttributes = {
+    a: ['href', 'title', 'target', 'rel', 'class', 'style'],
+    blockquote: ['class', 'style'],
+    div: ['class', 'style'],
+    figure: ['class', 'style'],
+    figcaption: ['class', 'style'],
+    h1: ['class', 'style'],
+    h2: ['class', 'style'],
+    h3: ['class', 'style'],
+    h4: ['class', 'style'],
+    h5: ['class', 'style'],
+    h6: ['class', 'style'],
+    li: ['class', 'style'],
+    ol: ['class', 'style', 'start'],
+    p: ['class', 'style'],
+    pre: ['class', 'style'],
+    span: ['class', 'style'],
+    table: ['class', 'style'],
+    td: ['class', 'style', 'colspan', 'rowspan'],
+    th: ['class', 'style', 'colspan', 'rowspan', 'scope'],
+    tr: ['class', 'style'],
+    ul: ['class', 'style']
+  };
+  var allowed = allowedAttributes[tagName] || [];
+  if (!allowed.length) {
+    return '';
+  }
+
+  var attrs = [];
+  String(attrText || '').replace(/([a-zA-Z0-9:-]+)(?:\s*=\s*("([^"]*)"|'([^']*)'|([^\s"'>/=`]+)))?/g, function (_full, key, _valuePart, doubleQuoted, singleQuoted, bareValue) {
+    var lowerKey = String(key || '').toLowerCase();
+    if (allowed.indexOf(lowerKey) === -1) {
+      return '';
+    }
+
+    var value = doubleQuoted !== undefined ? doubleQuoted : singleQuoted !== undefined ? singleQuoted : bareValue !== undefined ? bareValue : '';
+    if (lowerKey === 'href' && /^(?:\s*javascript:|\s*data:)/i.test(String(value || ''))) {
+      return '';
+    }
+    if (lowerKey === 'style' && /(?:expression\s*\(|javascript:|url\s*\()/i.test(String(value || ''))) {
+      return '';
+    }
+    if (lowerKey === 'target') {
+      var targetValue = String(value || '').trim();
+      if (targetValue === '_blank') {
+        attrs.push(' target="_blank"');
+        if (attrs.indexOf(' rel="noreferrer noopener"') === -1) {
+          attrs.push(' rel="noreferrer noopener"');
+        }
+        return '';
+      }
+    }
+    attrs.push(' ' + lowerKey + '="' + escapeHtml(value) + '"');
+    return '';
+  });
+
+  return attrs.join('');
+}
+
+function sanitizePreviewHtml(html) {
+  var output = String(html || '');
+  output = output.replace(/<script[\s\S]*?<\/script>/gi, '');
+  output = output.replace(/<style[\s\S]*?<\/style>/gi, '');
+  return output.replace(/<[^>]+>/g, function (tag) {
+    var match = tag.match(/^<\s*(\/?)\s*([a-z0-9]+)([\s\S]*?)(\/?)>$/i);
+    if (!match) {
+      return '';
+    }
+
+    var closing = Boolean(match[1]);
+    var name = String(match[2] || '').toLowerCase();
+    var allowed = ['a', 'b', 'blockquote', 'br', 'code', 'div', 'em', 'figure', 'figcaption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'i', 'li', 'ol', 'p', 'pre', 'span', 'strong', 'sub', 'sup', 'table', 'tbody', 'td', 'th', 'thead', 'tr', 'u', 'ul'];
+    if (allowed.indexOf(name) === -1) {
+      return '';
+    }
+
+    if (closing) {
+      return '</' + name + '>';
+    }
+
+    return '<' + name + sanitizeTagAttributes(name, String(match[3] || '')) + '>';
+  });
+}
+
+function getDefaultStyle() {
+  return {
+    font_family: DEFAULT_STYLE.font_family,
+    font_size: DEFAULT_STYLE.font_size,
+    font_color: DEFAULT_STYLE.font_color
+  };
+}
+
+function getDefaultTimeZone() {
+  try {
+    return Intl.DateTimeFormat().resolvedOptions().timeZone || 'UTC';
+  } catch (_error) {
+    return 'UTC';
+  }
+}
+
+function resolveTimeZone(value) {
+  var raw = String(value || '').trim();
+  if (!raw) {
+    return getDefaultTimeZone();
+  }
+
+  try {
+    new Intl.DateTimeFormat('en-GB', { timeZone: raw }).format(new Date());
+    return raw;
+  } catch (_error) {
+    return getDefaultTimeZone();
+  }
+}
+
+function getTimeDateFormatter(key, options) {
+  if (!timeDateFormatterCache[key]) {
+    timeDateFormatterCache[key] = new Intl.DateTimeFormat('en-GB', options);
+  }
+
+  return timeDateFormatterCache[key];
+}
+
+function getTimeDateFormattedParts(timeZone, date) {
+  var targetDate = date instanceof Date ? date : new Date();
+  var resolvedTimeZone = resolveTimeZone(timeZone);
+  var numericParts = getTimeDateFormatter('numeric:' + resolvedTimeZone, {
+    timeZone: resolvedTimeZone,
+    hour12: false,
+    hour: '2-digit',
+    minute: '2-digit',
+    second: '2-digit',
+    day: '2-digit',
+    month: '2-digit',
+    year: 'numeric'
+  }).formatToParts(targetDate);
+  var weekdayLong = getTimeDateFormatter('weekday-long:' + resolvedTimeZone, {
+    timeZone: resolvedTimeZone,
+    weekday: 'long'
+  }).formatToParts(targetDate);
+  var weekdayShort = getTimeDateFormatter('weekday-short:' + resolvedTimeZone, {
+    timeZone: resolvedTimeZone,
+    weekday: 'short'
+  }).formatToParts(targetDate);
+  var monthLong = getTimeDateFormatter('month-long:' + resolvedTimeZone, {
+    timeZone: resolvedTimeZone,
+    month: 'long'
+  }).formatToParts(targetDate);
+  var monthShort = getTimeDateFormatter('month-short:' + resolvedTimeZone, {
+    timeZone: resolvedTimeZone,
+    month: 'short'
+  }).formatToParts(targetDate);
+  var ampm = getTimeDateFormatter('ampm:' + resolvedTimeZone, {
+    timeZone: resolvedTimeZone,
+    hour12: true,
+    hour: '2-digit',
+    minute: '2-digit'
+  }).formatToParts(targetDate);
+  var timezoneShort = getTimeDateFormatter('tz-short:' + resolvedTimeZone, {
+    timeZone: resolvedTimeZone,
+    timeZoneName: 'short'
+  }).formatToParts(targetDate);
+
+  function getPart(parts, type) {
+    var match = parts.find(function (part) {
+      return part && part.type === type;
+    });
+    return match ? String(match.value || '') : '';
+  }
+
+  function toTitleCase(value) {
+    return String(value || '').toLowerCase().replace(/\b([a-z])/g, function (match, letter) {
+      return String(letter || '').toUpperCase();
+    });
+  }
+
+  return {
+    h: String(Number(getPart(numericParts, 'hour')) || 0),
+    hh: getPart(numericParts, 'hour'),
+    m: String(Number(getPart(numericParts, 'minute')) || 0),
+    mm: getPart(numericParts, 'minute'),
+    s: String(Number(getPart(numericParts, 'second')) || 0),
+    ss: getPart(numericParts, 'second'),
+    d: String(Number(getPart(numericParts, 'day')) || 0),
+    dd: getPart(numericParts, 'day'),
+    M: String(Number(getPart(numericParts, 'month')) || 0),
+    MM: getPart(numericParts, 'month'),
+    y: String(Number(getPart(numericParts, 'year')) || 0),
+    yyyy: getPart(numericParts, 'year'),
+    yy: String(Number(String(getPart(numericParts, 'year')).slice(-2)) || 0).padStart(2, '0'),
+    ddd: toTitleCase(getPart(weekdayShort, 'weekday')),
+    dddd: toTitleCase(getPart(weekdayLong, 'weekday')),
+    MMM: toTitleCase(getPart(monthShort, 'month')),
+    MMMM: toTitleCase(getPart(monthLong, 'month')),
+    a: toTitleCase(getPart(ampm, 'dayPeriod')),
+      tz: getPart(timezoneShort, 'timeZoneName'),
+      tz_long: resolvedTimeZone,
+    date: getPart(numericParts, 'year') + '-' + getPart(numericParts, 'month') + '-' + getPart(numericParts, 'day'),
+    time: getPart(numericParts, 'hour') + ':' + getPart(numericParts, 'minute') + ':' + getPart(numericParts, 'second')
+  };
+}
+
+function resolveTimeDateTemplatePlaceholder(values, expression) {
+  var currentPlaceholderUtils = window.placeholderUtils || placeholderUtils || {};
+  if (typeof currentPlaceholderUtils.resolvePlaceholderExpression === 'function' && typeof currentPlaceholderUtils.formatPlaceholderValue === 'function') {
+    return currentPlaceholderUtils.formatPlaceholderValue(currentPlaceholderUtils.resolvePlaceholderExpression(values, expression));
+  }
+
+  var parsed = String(expression || '').trim();
+  return Object.prototype.hasOwnProperty.call(values, parsed) ? values[parsed] : '';
+}
+
+function renderTimeDateTemplate(format, timeZone, date) {
+  var template = String(format || '').trim() || DEFAULT_FORMAT;
+  var values = getTimeDateFormattedParts(timeZone, date);
+  return template.replace(/\{\{\s*([a-zA-Z0-9_.()\-]+)\s*\}\}/g, function (_match, key) {
+    return String(resolveTimeDateTemplatePlaceholder(values, key, { timeZone: timeZone }) || '');
+  });
+}
+
+
+
+function getTextStyle(regionContent, region) {
+  var defaultStyle = getDefaultStyle();
+  return {
+    font_family: regionContent.font_family || region.fontFamily || defaultStyle.font_family,
+    font_size: regionContent.font_size || region.fontSize || defaultStyle.font_size,
+    font_color: regionContent.font_color || region.fontColor || defaultStyle.font_color
+  };
+}
+
+function renderTimeDateRegion(region, regionContent) {
+  var content = regionContent && typeof regionContent === 'object' ? regionContent : {};
+  var format = String(content.value !== undefined ? content.value : content.text || '').trim() || DEFAULT_FORMAT;
+  var timeZone = resolveTimeZone(content.timezone || content.time_zone || '');
+  var style = getTextStyle(content, region);
+  var fontFamily = style.font_family ? 'font-family:' + escapeHtml(style.font_family) + ';' : '';
+  var fontSize = style.font_size ? 'font-size:' + Math.max(1, Math.round(Number(style.font_size))) + 'px;' : '';
+  var fontColor = style.font_color ? 'color:' + escapeHtml(style.font_color) + ';' : '';
+  var contentStyle = 'width:' + region.pixelWidth + 'px;height:' + region.pixelHeight + 'px;transform:scale(' + region.canvasScale + ');transform-origin:top left;' + (fontFamily ? fontFamily : '') + fontSize + fontColor + 'white-space:pre-wrap;line-height:1.1;';
+  var renderedText = renderTimeDateTemplate(format, timeZone, new Date());
+  return '<div class="template-region time-date" data-time-date-format="' + escapeHtml(format) + '" data-time-date-timezone="' + escapeHtml(timeZone) + '" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + '">' + renderEditorJsContent(renderedText) + '</div></div>';
+}
+
+function updateTimeDateRegion(element) {
+  if (!element) {
+    return;
+  }
+
+  var format = String(element.dataset.timeDateFormat || '').trim() || DEFAULT_FORMAT;
+  var timeZone = String(element.dataset.timeDateTimezone || '').trim();
+  var scaleWrapper = element.querySelector('.template-region-text-scale');
+  if (!scaleWrapper) {
+    return;
+  }
+
+  scaleWrapper.innerHTML = renderEditorJsContent(renderTimeDateTemplate(format, timeZone, new Date()));
+}
+
+function scheduleTimeDateRegionUpdate(element) {
+  if (!element) {
+    return;
+  }
+
+  if (element.__timeDateTimer) {
+    window.clearTimeout(element.__timeDateTimer);
+    element.__timeDateTimer = null;
+  }
+
+  function tick() {
+    if (!element.isConnected) {
+      if (element.__timeDateTimer) {
+        window.clearTimeout(element.__timeDateTimer);
+        element.__timeDateTimer = null;
+      }
+      return;
+    }
+
+    updateTimeDateRegion(element);
+    element.__timeDateTimer = window.setTimeout(tick, Math.max(100, 1000 - (Date.now() % 1000)));
+  }
+
+  tick();
+}
+
+function destroyTimeDateRegions(root) {
+  if (!root) {
+    return;
+  }
+
+  Array.prototype.forEach.call(root.querySelectorAll('.template-region.time-date'), function (element) {
+    if (element && element.__timeDateTimer) {
+      window.clearTimeout(element.__timeDateTimer);
+      element.__timeDateTimer = null;
+    }
+  });
+}
+
+function initializeTimeDateRegions(root) {
+  if (!root) {
+    return;
+  }
+
+  Array.prototype.forEach.call(root.querySelectorAll('.template-region.time-date'), function (element) {
+    scheduleTimeDateRegionUpdate(element);
+  });
+}
+
+registry.register('time-date', {
+  label: 'Time / Date',
+  getDefaultStyle: getDefaultStyle,
+  getDefaultRegionSize: function () {
+    return { width: 420, height: 180 };
+  },
+  renderRegion: renderTimeDateRegion,
+  initRegion: initializeTimeDateRegions,
+  destroyRegion: destroyTimeDateRegions
+});

src/player/regions/timetable.js

@@ -0,0 +1,160 @@
+// Timetable region rendering for live playback.
+
+var registry = window.pulsePlayerRegionTypes;
+
+function substituteTimetableVariables(html, entry) {
+  var source = String(html || '');
+  return source.replace(/\{\{\s*([^{}]+?)\s*\}\}/g, function (_match, expression) {
+    if (!entry || typeof entry !== 'object') {
+      return '';
+    }
+
+    if (!window.placeholderUtils || typeof window.placeholderUtils.resolvePlaceholderExpression !== 'function' || typeof window.placeholderUtils.formatPlaceholderValue !== 'function') {
+      return '';
+    }
+
+    return escapeHtml(window.placeholderUtils.formatPlaceholderValue(window.placeholderUtils.resolvePlaceholderExpression(entry, expression)));
+  });
+}
+
+function renderTemplate(template, context) {
+  var source = String(template || '');
+  if (!source) {
+    return '';
+  }
+  return substituteTimetableVariables(source, context);
+}
+
+function getTimetableGroups() {
+  return Array.isArray(initialData && initialData.timetableGroups) ? initialData.timetableGroups : [];
+}
+
+function getGroupById(groupId, groups) {
+  var normalizedId = Number(groupId || 0);
+  return (Array.isArray(groups) ? groups : getTimetableGroups()).find(function (group) {
+    return Number(group.id) === normalizedId;
+  }) || null;
+}
+
+function getEntries(groupId, groups) {
+  var group = getGroupById(groupId, groups);
+  return group && Array.isArray(group.entries) ? group.entries : [];
+}
+
+function toDate(value) {
+  if (!value) {
+    return null;
+  }
+  var date = value instanceof Date ? value : new Date(value);
+  return Number.isNaN(date.getTime()) ? null : date;
+}
+
+function isUpcoming(entry, now) {
+  var start = toDate(entry && entry.start_datetime);
+  return Boolean(start && now < start);
+}
+
+function isLive(entry, now) {
+  var start = toDate(entry && entry.start_datetime);
+  var end = toDate(entry && entry.end_datetime);
+  return Boolean(start && end && now >= start && now < end);
+}
+
+function getVisibleEntries(groupId, displayMode, maxItems, groups) {
+  var now = new Date();
+  var entries = getEntries(groupId, groups).slice().sort(function (left, right) {
+    var leftStart = toDate(left && left.start_datetime);
+    var rightStart = toDate(right && right.start_datetime);
+    return (leftStart ? leftStart.getTime() : 0) - (rightStart ? rightStart.getTime() : 0) || Number(left.id || 0) - Number(right.id || 0);
+  });
+  var mode = String(displayMode || 'upcoming').trim().toLowerCase();
+
+  entries = entries.filter(function (entry) {
+    if (mode === 'current') {
+      return isLive(entry, now);
+    }
+    if (mode === 'both') {
+      return isUpcoming(entry, now) || isLive(entry, now);
+    }
+    return isUpcoming(entry, now);
+  });
+
+  if (!entries.length && mode === 'upcoming') {
+    entries = getEntries(groupId, groups).filter(function (entry) {
+      return isLive(entry, now);
+    });
+  }
+
+  return entries.slice(0, Math.max(1, Number(maxItems || 5)));
+}
+
+function formatDateTime(value) {
+  var date = toDate(value);
+  if (!date) {
+    return '';
+  }
+
+  try {
+    return new Intl.DateTimeFormat(undefined, {
+      month: 'short',
+      day: '2-digit',
+      hour: 'numeric',
+      minute: '2-digit'
+    }).format(date);
+  } catch (_error) {
+    return date.toLocaleString();
+  }
+}
+
+function getDefaultStyle() {
+  return {
+    font_family: 'Arial',
+    font_size: 28,
+    font_color: '#000000'
+  };
+}
+
+function getTextStyle(region, regionContent) {
+  var current = regionContent && typeof regionContent === 'object' ? regionContent : {};
+  var defaultStyle = getDefaultStyle();
+  return {
+    font_family: String(current.font_family || region.font_family || defaultStyle.font_family || 'Arial').trim() || 'Arial',
+    font_size: Math.max(8, Number(current.font_size || region.font_size || defaultStyle.font_size || 28)),
+    font_color: String(current.font_color || region.font_color || defaultStyle.font_color || '#000000').trim() || '#000000'
+  };
+}
+
+function renderRegion(region, regionContent) {
+  var value = String(regionContent && (regionContent.value !== undefined ? regionContent.value : regionContent.text !== undefined ? regionContent.text : '') || '').trim();
+  var style = getTextStyle(region, regionContent || {});
+  var groups = getTimetableGroups();
+  var groupId = regionContent && regionContent.timetable_group_id !== undefined ? regionContent.timetable_group_id : '';
+  var displayMode = regionContent && regionContent.display_mode ? regionContent.display_mode : 'upcoming';
+  var maxItems = regionContent && regionContent.max_items !== undefined ? regionContent.max_items : 5;
+  var group = getGroupById(groupId, groups);
+  var entries = getVisibleEntries(groupId, displayMode, maxItems, groups);
+  var timeZone = group && (group.timezone || group.time_zone) ? String(group.timezone || group.time_zone) : '';
+  var width = Math.max(1, Math.round(Number(region && region.pixelWidth ? region.pixelWidth : 0) || 1));
+  var height = Math.max(1, Math.round(Number(region && region.pixelHeight ? region.pixelHeight : 0) || 1));
+  var canvasScale = Number(region && region.canvasScale ? region.canvasScale : 1) || 1;
+  var contentStyle = 'width:' + width + 'px;height:' + height + 'px;transform:scale(' + canvasScale + ');transform-origin:top left;' + (style.font_family ? 'font-family:' + escapeHtml(style.font_family) + ';' : '') + (style.font_size ? 'font-size:' + Math.max(1, Math.round(Number(style.font_size))) + 'px;' : '') + (style.font_color ? 'color:' + escapeHtml(style.font_color) + ';' : '');
+
+  if (!value) {
+    return '<div class="template-region timetable" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + ' overflow:hidden;"></div></div>';
+  }
+
+  return '<div class="template-region timetable" style="' + region.baseStyle + '"><div class="template-region-text-scale" style="' + contentStyle + ' overflow:hidden;">' + entries.map(function (entry, index) {
+    return '<div class="timetable-region-entry" data-timetable-entry-index="' + index + '">' + sanitizeRichText(substituteTimetableVariables(value, Object.assign({}, entry || {}, {
+      start: entry && entry.start_datetime !== undefined ? entry.start_datetime : '',
+      end: entry && entry.end_datetime !== undefined ? entry.end_datetime : '',
+      timeZone: timeZone,
+      group: group || {},
+      entries: entries,
+      index: index + 1
+    }))) + '</div>';
+  }).join('') + '</div></div>';
+}
+
+registry.register('timetable', {
+  renderRegion: renderRegion
+});

src/player/regions/video.js

@@ -0,0 +1,154 @@
+// Video region playback, retry, and source probe helpers.
+
+var videoRegionLastGoodSrcCache = Object.create(null);
+var videoRegionProbeStateCache = Object.create(null);
+var videoRegionProbeTimerCache = Object.create(null);
+var VIDEO_REGION_RETRY_DELAY_MS = 5000;
+
+function getVideoRegionCacheKey(region) {
+  return String(region && (region.regionKey || region.label) || '').trim();
+}
+
+function isDirectlyRenderableSource(src) {
+  return /^(?:https?:)?\/\//i.test(src) || /^data:/i.test(src) || /^blob:/i.test(src) || /^\/media\//i.test(src);
+}
+
+function appendCacheBust(src, cacheBust) {
+  var key = String(cacheBust || '').trim();
+  var raw = String(src || '').trim();
+  if (!raw || !key) {
+    return raw;
+  }
+  return raw + (raw.indexOf('?') === -1 ? '?' : '&') + 'v=' + encodeURIComponent(key);
+}
+
+function getVideoSourceAvailability(src) {
+  return videoRegionProbeStateCache[String(src || '').trim()] || null;
+}
+
+function setVideoSourceAvailability(src, available) {
+  var key = String(src || '').trim();
+  if (!key) {
+    return;
+  }
+  videoRegionProbeStateCache[key] = {
+    available: available === null ? null : Boolean(available),
+    checkedAt: Date.now()
+  };
+}
+
+function logVideoRegionStatus(message, details, level) {
+  if (typeof logDebug === 'function') {
+    logDebug(message, details || '', level || 'info');
+  }
+}
+
+function triggerVideoRegionSourceRefresh() {
+  if (typeof window.notifyVideoRegionSourceReady === 'function') {
+    window.notifyVideoRegionSourceReady();
+    return;
+  }
+
+  if (typeof videoRegionRenderVersion === 'number') {
+    videoRegionRenderVersion += 1;
+  }
+  slideMarkupCache = Object.create(null);
+  if (typeof showCurrent === 'function' && slides && slides.length) {
+    showCurrent();
+  }
+}
+
+function scheduleVideoSourceProbe(regionKey, src, isRetry) {
+  var key = String(src || '').trim();
+  if (!regionKey || !key || isDirectlyRenderableSource(key)) {
+    if (key) {
+      setVideoSourceAvailability(key, true);
+    }
+    return;
+  }
+
+  if (videoRegionProbeTimerCache[key]) {
+    return;
+  }
+
+  if (!isRetry) {
+    logVideoRegionStatus('Video source changed; probing mirrored file before swapping.', 'region=' + regionKey + ' src=' + key);
+  } else {
+    logVideoRegionStatus('Video source still unavailable; retrying mirrored file probe.', 'region=' + regionKey + ' src=' + key, 'warn');
+  }
+
+  videoRegionProbeTimerCache[key] = window.setTimeout(function () {
+    delete videoRegionProbeTimerCache[key];
+    fetch(key, {
+      method: 'HEAD',
+      cache: 'no-store',
+      credentials: 'same-origin'
+    }).then(function (response) {
+      if (response && response.ok) {
+        setVideoSourceAvailability(key, true);
+        if (videoRegionLastGoodSrcCache[regionKey] !== key) {
+          videoRegionLastGoodSrcCache[regionKey] = key;
+          logVideoRegionStatus('Mirrored video is ready; switching to the new source.', 'region=' + regionKey + ' src=' + key);
+          triggerVideoRegionSourceRefresh();
+        }
+        return;
+      }
+
+      setVideoSourceAvailability(key, false);
+      logVideoRegionStatus('Mirrored video probe returned unavailable; keeping the old source for now.', 'region=' + regionKey + ' src=' + key, 'warn');
+      scheduleVideoSourceProbe(regionKey, key, true);
+    }).catch(function () {
+      setVideoSourceAvailability(key, false);
+      logVideoRegionStatus('Mirrored video probe failed; keeping the old source for now.', 'region=' + regionKey + ' src=' + key, 'warn');
+      scheduleVideoSourceProbe(regionKey, key, true);
+    });
+  }, isRetry ? VIDEO_REGION_RETRY_DELAY_MS : 0);
+}
+
+function renderVideoRegion(region, regionContent) {
+  var requestedSrc = String(regionContent && regionContent.value || '').trim();
+  var requestedSrcVersioned = appendCacheBust(requestedSrc, regionContent && regionContent.cache_bust);
+  var regionKey = getVideoRegionCacheKey(region);
+  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);
+
+  if (!requestedSrc) {
+    return '';
+  }
+
+  if (isDirectlyRenderableSource(requestedSrc)) {
+    if (regionKey) {
+      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>';
+  }
+
+  var requestedState = getVideoSourceAvailability(requestedSrc);
+  var requestedReady = Boolean(requestedState && requestedState.available === true);
+
+  if (requestedReady) {
+    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>';
+  }
+
+  scheduleVideoSourceProbe(regionKey, requestedSrc, false);
+
+  if (cachedSrc) {
+    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 '';
+}
+
+if (window.pulsePlayerRegionTypes && typeof window.pulsePlayerRegionTypes.register === 'function') {
+  window.pulsePlayerRegionTypes.register('video', {
+    renderRegion: renderVideoRegion
+  });
+}

src/player/regions/webpage.js

@@ -1,5 +1,41 @@
+// Webpage region rendering for embedded live URLs.
+
+var registry = window.pulsePlayerRegionTypes;
+
+function normalizeRenderableValue(value) {
+  if (value && typeof value === 'object') {
+    if (value.value !== undefined) {
+      return normalizeRenderableValue(value.value);
+    }
+    if (value.text !== undefined) {
+      return normalizeRenderableValue(value.text);
+    }
+    if (value.url !== undefined) {
+      return normalizeRenderableValue(value.url);
+    }
+    if (value.href !== undefined) {
+      return normalizeRenderableValue(value.href);
+    }
+    if (value.src !== undefined) {
+      return normalizeRenderableValue(value.src);
+    }
+    if (value.content !== undefined) {
+      return normalizeRenderableValue(value.content);
+    }
+    return '';
+  }
+
+  return String(value === undefined || value === null ? '' : value);
+}
+
 function renderWebpageRegion(region, regionContent) {
-  var url = String(regionContent.value || '').trim();
-  var iframe = url ? '<iframe src="' + escapeHtml(url) + '" title="' + escapeHtml(region.label) + '" loading="eager" referrerpolicy="no-referrer" scrolling="no"></iframe>' : '<div class="template-region-placeholder">Webpage</div>';
-  return '<div class="template-region webpage" style="' + region.baseStyle + '">' + iframe + '</div>';
-}
+  var url = normalizeRenderableValue(regionContent && regionContent.value !== undefined ? regionContent.value : '').trim();
+  if (!url) {
+    return '';
+  }
+  return '<div class="template-region webpage" style="' + region.baseStyle + '"><iframe src="' + escapeHtml(url) + '" title="' + escapeHtml(region.label) + '" loading="eager" referrerpolicy="no-referrer" scrolling="no" style="width:100%;height:100%;border:0;display:block;background:#fff;overflow:hidden;"></iframe></div>';
+}
+
+registry.register('webpage', {
+  renderRegion: renderWebpageRegion
+});

src/player/render-helpers.js

@@ -1,5 +1,6 @@
 const fs = require('fs');
 const path = require('path');
+const announcementIcons = require('#src/data/announcement-icons');
 
 function mediaKind(mediaPath) {
   const ext = path.extname(mediaPath || '').toLowerCase();
@@ -24,6 +25,14 @@ function escapeHtml(value) {
     .replace(/'/g, ''');
 }
 
+function normalizeStyleAttributeValue(value) {
+  return String(value || '')
+    .replace(/"/g, '"')
+    .replace(/'/g, "'")
+    .replace(/"/g, '"')
+    .replace(/'/g, "'");
+}
+
 function sanitizeFontFamily(value) {
   return String(value || '').replace(/[^a-zA-Z0-9 ,"-]/g, '').trim();
 }
@@ -40,7 +49,7 @@ function sanitizeTextColor(value, fallback) {
   return fallback || '#000000';
 }
 
-const ALLOWED_RICH_TEXT_TAGS = ['a', 'b', 'blockquote', 'br', 'code', 'div', 'em', 'figure', 'figcaption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'i', 'li', 'ol', 'p', 'pre', 'span', 'strong', 'sub', 'sup', 'table', 'tbody', 'td', 'th', 'thead', 'tr', 'u', 'ul'];
+const ALLOWED_RICH_TEXT_TAGS = ['a', 'b', 'blockquote', 'br', 'code', 'col', 'colgroup', 'div', 'em', 'figure', 'figcaption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'i', 'img', 'li', 'ol', 'p', 'pre', 'span', 'strong', 'sub', 'sup', 'table', 'tbody', 'td', 'th', 'thead', 'tr', 'u', 'ul'];
 
 function sanitizeRichTextAttributes(tagName, attrText) {
   const allowedAttributes = {
@@ -55,6 +64,9 @@ function sanitizeRichTextAttributes(tagName, attrText) {
     h4: ['class', 'style'],
     h5: ['class', 'style'],
     h6: ['class', 'style'],
+    img: ['src', 'alt', 'title', 'width', 'height', 'class', 'style', 'loading', 'decoding'],
+    col: ['class', 'style', 'span', 'width'],
+    colgroup: ['class', 'style', 'span'],
     li: ['class', 'style'],
     ol: ['class', 'style', 'start'],
     p: ['class', 'style'],
@@ -71,6 +83,14 @@ function sanitizeRichTextAttributes(tagName, attrText) {
     return '';
   }
 
+  if (tagName === 'img') {
+    const srcMatch = String(attrText || '').match(/\bsrc\s*=\s*("([^"]*)"|'([^']*)'|([^\s"'>/=`]+))/i);
+    const srcValue = srcMatch ? String(srcMatch[2] !== undefined ? srcMatch[2] : srcMatch[3] !== undefined ? srcMatch[3] : srcMatch[4] !== undefined ? srcMatch[4] : '').trim() : '';
+    if (!srcValue || !/^(?:https?:\/\/|\/media\/|\/assets\/|\/[^/]|data:image\/)/i.test(srcValue)) {
+      return '';
+    }
+  }
+
   const attrs = [];
   String(attrText || '').replace(/([a-zA-Z0-9:-]+)(?:\s*=\s*("([^"]*)"|'([^']*)'|([^\s"'>/=`]+)))?/g, (_full, key, _valuePart, doubleQuoted, singleQuoted, bareValue) => {
     const lowerKey = String(key || '').toLowerCase();
@@ -94,7 +114,7 @@ function sanitizeRichTextAttributes(tagName, attrText) {
         return '';
       }
     }
-    attrs.push(' ' + lowerKey + '="' + escapeHtml(value) + '"');
+    attrs.push(' ' + lowerKey + '="' + escapeHtml(lowerKey === 'style' ? normalizeStyleAttributeValue(value) : value) + '"');
     return '';
   });
 
@@ -235,6 +255,17 @@ function renderEditorJsTable(data) {
   return '<table class="ck-content-table">' + tableRows + '</table>';
 }
 
+function wrapRichTextParagraph(html) {
+  const raw = String(html || '').trim();
+  if (!raw) {
+    return '';
+  }
+  if (/^<\s*(?:p|div|h[1-6]|ul|ol|pre|table|blockquote|figure|hr|li)\b/i.test(raw)) {
+    return raw;
+  }
+  return '<p>' + raw + '</p>';
+}
+
 function renderEditorJsContent(value) {
   if (value && typeof value === 'object') {
     if (Array.isArray(value.blocks)) {
@@ -253,15 +284,48 @@ function renderEditorJsContent(value) {
   } catch (_error) {
     // fall through to legacy HTML rendering
   }
-  return sanitizeRichText(raw);
+  return wrapRichTextParagraph(sanitizeRichText(raw));
+}
+
+function buildHtmlDocument(html) {
+  const raw = String(html || '').trim();
+  if (!raw) {
+    return '';
+  }
+
+  if (/^<!doctype\b/i.test(raw) || /^<html\b/i.test(raw)) {
+    return raw;
+  }
+
+  return '<!doctype html><html><head><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:transparent;}</style></head><body>' + raw + '</body></html>';
 }
 
 function renderHtmlRegionContent(value) {
-  const html = String(value || '').trim();
+  const html = normalizeRenderableValue(value).trim();
   if (!html) {
     return '<div class="template-region-placeholder">HTML</div>';
   }
-  return '<iframe class="template-region-html-frame" sandbox="" srcdoc="' + escapeHtml(html) + '" title="HTML region" loading="eager"></iframe>';
+  return '<iframe class="template-region-html-frame" sandbox="" srcdoc="' + escapeHtml(buildHtmlDocument(html)) + '" title="HTML region" loading="eager" style="width:100%;height:100%;border:0;display:block;background:transparent;overflow:hidden;"></iframe>';
+}
+
+function normalizeRenderableValue(value) {
+  if (value && typeof value === 'object') {
+    if (value.value !== undefined) {
+      return normalizeRenderableValue(value.value);
+    }
+    if (value.text !== undefined) {
+      return normalizeRenderableValue(value.text);
+    }
+    if (value.html !== undefined) {
+      return normalizeRenderableValue(value.html);
+    }
+    if (value.content !== undefined) {
+      return normalizeRenderableValue(value.content);
+    }
+    return '';
+  }
+
+  return String(value === undefined || value === null ? '' : value);
 }
 
 function fitCanvasSize(canvasWidth, canvasHeight, maxWidth, maxHeight) {
@@ -283,16 +347,13 @@ const playerPagePlaylistScriptPath = path.join(__dirname, 'public', 'js', 'playe
 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');
+const playerAnnouncementTemplatesScriptPath = path.join(__dirname, 'public', 'js', 'player-announcement-templates.js');
+const playerAnnouncementLowerThirdTemplatePath = path.join(__dirname, 'announcement-templates', 'lower-third.template.html');
+const playerAnnouncementTopBannerTemplatePath = path.join(__dirname, 'announcement-templates', 'top-banner.template.html');
+const playerAnnouncementFullscreenTemplatePath = path.join(__dirname, 'announcement-templates', 'fullscreen.template.html');
+const playerPageAnnouncementsScriptPath = path.join(__dirname, 'player-page-announcements.js');
 const playerPageScriptPath = path.join(__dirname, 'player-page.script.html');
-const playerRegionScriptPaths = [
-  path.join(__dirname, 'regions', 'image.js'),
-  path.join(__dirname, 'regions', 'webpage.js'),
-  path.join(__dirname, 'regions', 'html.js'),
-  path.join(__dirname, 'regions', 'rtmp.js'),
-  path.join(__dirname, 'regions', 'rss.js'),
-  path.join(__dirname, 'regions', 'api.js'),
-  path.join(__dirname, 'regions', 'text.js')
-];
+const playerRegionScriptDir = path.join(__dirname, 'regions');
 const playerOnboardingLandingScriptPath = path.join(__dirname, 'onboarding', 'player-onboarding-landing.script.html');
 const playerOnboardingFormScriptPath = path.join(__dirname, 'onboarding', 'player-onboarding-form.script.html');
 let playerPageTemplateCache = null;
@@ -302,6 +363,9 @@ let playerPagePlaylistScriptCache = null;
 let playerPageCommandsScriptCache = null;
 let playerPageRenderingScriptCache = null;
 let playerPagePlaybackScriptCache = null;
+let playerAnnouncementTemplatesScriptCache = null;
+let playerAnnouncementTemplatesDataScriptCache = null;
+let playerPageAnnouncementsScriptCache = null;
 let playerPageScriptCache = null;
 let playerRegionScriptsCache = null;
 let playerOnboardingLandingScriptCache = null;
@@ -346,19 +410,101 @@ function getPlayerPagePlaybackScript() {
   return loadTemplate(playerPagePlaybackScriptPath, playerPagePlaybackScriptCache || (playerPagePlaybackScriptCache = {}));
 }
 
+function getPlayerAnnouncementTemplatesScript() {
+  if (playerAnnouncementTemplatesScriptCache && playerAnnouncementTemplatesScriptCache.path === playerAnnouncementTemplatesScriptPath) {
+    return playerAnnouncementTemplatesScriptCache.value;
+  }
+
+  const value = fs.readFileSync(playerAnnouncementTemplatesScriptPath, 'utf8').trim();
+  playerAnnouncementTemplatesScriptCache = {
+    path: playerAnnouncementTemplatesScriptPath,
+    value: value
+  };
+  return value;
+}
+
+function getAnnouncementIconsDataScript() {
+  return [
+    '(function () {',
+    '  window.pulseAnnouncementIconKeys = ' + safeJsonForScript(announcementIcons.ANNOUNCEMENT_ICON_KEYS) + ';',
+    '  window.pulseAnnouncementDefaultIconKey = ' + safeJsonForScript(announcementIcons.DEFAULT_ANNOUNCEMENT_ICON) + ';',
+    '}());'
+  ].join('\n');
+}
+
+function loadAnnouncementTemplate(filePath) {
+  return fs.readFileSync(filePath, 'utf8').trim();
+}
+
+function getPlayerAnnouncementTemplatesDataScript() {
+  const templatePaths = [
+    playerAnnouncementLowerThirdTemplatePath,
+    playerAnnouncementTopBannerTemplatePath,
+    playerAnnouncementFullscreenTemplatePath
+  ];
+  const signature = templatePaths.map(function (filePath) {
+    return fs.statSync(filePath).mtimeMs;
+  }).join('|');
+
+  if (playerAnnouncementTemplatesDataScriptCache && playerAnnouncementTemplatesDataScriptCache.signature === signature) {
+    return playerAnnouncementTemplatesDataScriptCache.value;
+  }
+
+  const value = [
+    '(function () {',
+    '  window.playerAnnouncementTemplates = {',
+    '    lowerThird: ' + safeJsonForScript(loadAnnouncementTemplate(playerAnnouncementLowerThirdTemplatePath)) + ',',
+    '    topBanner: ' + safeJsonForScript(loadAnnouncementTemplate(playerAnnouncementTopBannerTemplatePath)) + ',',
+    '    fullscreen: ' + safeJsonForScript(loadAnnouncementTemplate(playerAnnouncementFullscreenTemplatePath)),
+    '  };',
+    '}());'
+  ].join('\n');
+
+  playerAnnouncementTemplatesDataScriptCache = {
+    signature: signature,
+    value: value
+  };
+  return value;
+}
+
+function getPlayerPageAnnouncementsScript() {
+  return loadTemplate(playerPageAnnouncementsScriptPath, playerPageAnnouncementsScriptCache || (playerPageAnnouncementsScriptCache = {}));
+}
+
 function getPlayerPageScript() {
   return loadTemplate(playerPageScriptPath, playerPageScriptCache || (playerPageScriptCache = {}));
 }
 
+function getPlayerRegionScriptPaths() {
+  if (!fs.existsSync(playerRegionScriptDir)) {
+    return [];
+  }
+
+  return fs.readdirSync(playerRegionScriptDir, { withFileTypes: true })
+    .filter(function (entry) {
+      return entry.isFile() && entry.name.toLowerCase().endsWith('.js');
+    })
+    .map(function (entry) {
+      return path.join(playerRegionScriptDir, entry.name);
+    })
+    .sort(function (left, right) {
+      return left.localeCompare(right);
+    });
+}
+
 function getPlayerRegionScripts() {
-  const statSignature = playerRegionScriptPaths.map(function (filePath) {
+  const sharedPlaceholderUtilsPath = path.join(__dirname, '..', 'web', 'public', 'js', 'shared', 'placeholder-utils.js');
+  const sharedQrSvgUtilsPath = path.join(__dirname, '..', 'web', 'public', 'js', 'shared', 'qr-code-svg.js');
+  const playerRegionScriptPaths = getPlayerRegionScriptPaths();
+  const scriptPaths = [sharedPlaceholderUtilsPath, sharedQrSvgUtilsPath].concat(playerRegionScriptPaths);
+  const statSignature = scriptPaths.map(function (filePath) {
     return fs.statSync(filePath).mtimeMs;
   }).join('|');
   if (playerRegionScriptsCache && playerRegionScriptsCache.signature === statSignature) {
     return playerRegionScriptsCache.value;
   }
 
-  const value = playerRegionScriptPaths.map(function (filePath) {
+  const value = scriptPaths.map(function (filePath) {
     return fs.readFileSync(filePath, 'utf8').trim();
   }).join('\n\n');
   playerRegionScriptsCache = {
@@ -402,6 +548,10 @@ module.exports = {
   getPlayerPageCommandsScript: getPlayerPageCommandsScript,
   getPlayerPageRenderingScript: getPlayerPageRenderingScript,
   getPlayerPagePlaybackScript: getPlayerPagePlaybackScript,
+  getAnnouncementIconsDataScript: getAnnouncementIconsDataScript,
+  getPlayerAnnouncementTemplatesDataScript: getPlayerAnnouncementTemplatesDataScript,
+  getPlayerAnnouncementTemplatesScript: getPlayerAnnouncementTemplatesScript,
+  getPlayerPageAnnouncementsScript: getPlayerPageAnnouncementsScript,
   getPlayerPageScript: getPlayerPageScript,
   getPlayerRegionScripts: getPlayerRegionScripts,
   getPlayerOnboardingLandingScript: getPlayerOnboardingLandingScript,

src/player/render.js

@@ -1,12 +1,23 @@
+// Player page rendering and bootstrap script assembly.
+
 const Handlebars = require('handlebars');
-const { mediaKind, safeJsonForScript, getPlayerPageTemplate, getPlayerClientNameScript, getPlayerPageOfflineScript, getPlayerPagePlaylistScript, getPlayerPageCommandsScript, getPlayerPageRenderingScript, getPlayerPagePlaybackScript, getPlayerPageScript, getPlayerRegionScripts, getPlayerOnboardingLandingScript, getPlayerOnboardingFormScript } = require('./render-helpers');
-const { createPageAuthBundle, createPageFetchAuthScript } = require('../request-auth');
+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 { createPageAuthBundle, createPageFetchAuthScript } = require('#src/request-auth');
+const { getFontStylesheetHref } = require('#src/web/lib/media/font-library');
+
+const PLAYER_MEDIA_DIR = path.join(__dirname, '..', '..', 'media');
 
 function renderPage(template, options) {
+  const stylesheetLinks = Array.isArray(options && options.stylesheets) ? options.stylesheets : [];
   return template({
     TITLE: options.title,
     BODY_CLASS: options.bodyClass || '',
     BODY: new Handlebars.SafeString(options.body || ''),
+    STYLESHEETS: new Handlebars.SafeString(stylesheetLinks.map(function (href) {
+      return `<link rel="stylesheet" href="${Handlebars.escapeExpression(href)}" />`;
+    }).join('')),
     SCRIPT_BLOCK: new Handlebars.SafeString(options.script || '')
   });
 }
@@ -16,7 +27,7 @@ function getPlayerServiceWorkerRegistrationScript() {
     '<script>',
     '  if ("serviceWorker" in navigator) {',
     '    window.addEventListener("load", function () {',
-    '      navigator.serviceWorker.register("/sw.js").catch(function () {',
+      '      navigator.serviceWorker.register("/sw.js?v=38").catch(function () {',
     '        return null;',
     '      });',
     '    });',
@@ -35,7 +46,7 @@ function renderOnboardingLandingBody() {
     '    <div class="onboarding-layout">',
     '      <div class="onboarding-qr-pane">',
     '        <div class="onboarding-qr-frame">',
-    '          <img id="onboarding-qr" alt="Onboarding QR code" />',
+    '          <img id="onboarding-qr" alt="Onboarding QR code" src="data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 320 320%22%3E%3Crect width=%22320%22 height=%22320%22 rx=%2224%22 fill=%22%23ffffff%22/%3E%3Crect x=%2230%22 y=%2230%22 width=%22260%22 height=%22260%22 rx=%2218%22 fill=%22%23f8fafc%22 stroke=%22%23cbd5e1%22 stroke-width=%223%22 stroke-dasharray=%2212 10%22/%3E%3Cpath d=%22M106 118h108M106 156h108M106 194h72%22 stroke=%22%2394a3b8%22 stroke-width=%2214%22 stroke-linecap=%22round%22/%3E%3Ccircle cx=%22128%22 cy=%22248%22 r=%2212%22 fill=%22%2394a3b8%22/%3E%3Ctext x=%22160%22 y=%2278%22 text-anchor=%22middle%22 fill=%22%230f172a%22 font-family=%22Arial,sans-serif%22 font-size=%2224%22 font-weight=%22700%22%3EQR code loading%3C/text%3E%3Ctext x=%22160%22 y=%22266%22 text-anchor=%22middle%22 fill=%22%234b5563%22 font-family=%22Arial,sans-serif%22 font-size=%2214%22%3EPlease wait%3C/text%3E%3C/svg%3E" />',
     '        </div>',
     '        <div id="onboarding-status" class="onboarding-status">Preparing onboarding link...</div>',
     '      </div>',
@@ -108,6 +119,8 @@ function renderPlayerPage(slug, initialData) {
   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()({
     SLUG_JSON: new Handlebars.SafeString(JSON.stringify(slug)),
     INITIAL_DATA_JSON: new Handlebars.SafeString(safeJsonForScript(initialData || null)),
@@ -116,27 +129,33 @@ function renderPlayerPage(slug, initialData) {
 
   return renderPage(template, {
     title: 'Screen ' + slug,
+    bodyClass: bodyClass,
     body: '<div id="app"><div class="empty">Loading screen...</div></div>',
-    script: createPageFetchAuthScript(pageAuthToken) + hlsScriptTag + serviceWorkerScript + '<script>' + offlineScript + '</script>' + '<script>' + playlistScript + '</script>' + '<script>' + commandScript + '</script>' + '<script>' + renderingScript + '</script>' + '<script>' + playbackScript + '</script>' + onboardingScript + script
+    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>'
   });
 }
 
 function renderPlayerOnboardingLandingPage() {
   const pageAuthToken = createPageAuthBundle({ scope: 'onboarding' });
+  const fontStylesheetHref = getFontStylesheetHref(PLAYER_MEDIA_DIR);
   return renderPage(getPlayerPageTemplate(), {
     title: 'Onboard player',
     bodyClass: 'onboarding-page',
     body: renderOnboardingLandingBody(),
+    stylesheets: fontStylesheetHref ? [fontStylesheetHref] : [],
     script: createPageFetchAuthScript(pageAuthToken) + getPlayerServiceWorkerRegistrationScript() + renderOnboardingLandingScript()
   });
 }
 
 function renderPlayerOnboardingFormPage(deviceId) {
   const pageAuthToken = createPageAuthBundle({ scope: 'onboarding', deviceId: String(deviceId || '').trim() });
+  const fontStylesheetHref = getFontStylesheetHref(PLAYER_MEDIA_DIR);
   return renderPage(getPlayerPageTemplate(), {
     title: 'Onboard screen',
     bodyClass: 'onboarding-page',
     body: renderOnboardingFormBody(deviceId),
+    stylesheets: fontStylesheetHref ? [fontStylesheetHref] : [],
     script: createPageFetchAuthScript(pageAuthToken) + getPlayerServiceWorkerRegistrationScript() + renderOnboardingFormScript(deviceId)
   });
 }

src/player/routes.js

@@ -1,7 +1,11 @@
+// Player route registration and filesystem-backed media helpers.
+
 const fs = require('fs');
 const express = require('express');
 const path = require('path');
-const { getSharedSecret, createPageAuthBundle, verifyPageAuthToken, verifyRequestAuth } = require('../request-auth');
+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'];
 
@@ -9,6 +13,17 @@ function isTransientDbError(error) {
   return Boolean(error && TRANSIENT_DB_ERROR_CODES.indexOf(String(error.code || '').trim()) !== -1);
 }
 
+function isBridgeFetchError(error) {
+  const message = String(error && error.message || '').toLowerCase();
+  return Boolean(error && (
+    message.indexOf('fetch failed') !== -1 ||
+    message.indexOf('network error') !== -1 ||
+    message.indexOf('econnreset') !== -1 ||
+    message.indexOf('econnrefused') !== -1 ||
+    message.indexOf('enotfound') !== -1
+  ));
+}
+
 function registerPlayerRoutes(app, options) {
   const pool = options && options.pool ? options.pool : null;
   const common = options && options.common ? options.common : null;
@@ -17,13 +32,70 @@ 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 bridgeBaseUrl = String(options && options.bridgeBaseUrl || process.env.BRIDGE_PUBLIC_URL || '').trim().replace(/\/$/, '');
+  const playerDeviceId = String(options && options.playerDeviceId || '').trim() || null;
+  const onPlayerPublicBaseUrl = typeof options.onPlayerPublicBaseUrl === 'function' ? options.onPlayerPublicBaseUrl : null;
 
-  if (!app || !pool || !common || !mediaDir || !assetDir || !playerRuntime || !playerPlaylistService || !rtmpStreamService) {
-    throw new Error('registerPlayerRoutes requires app, pool, common, mediaDir, assetDir, playerRuntime, playerPlaylistService, and rtmpStreamService.');
+  if (!app || !common || !mediaDir || !assetDir || !playerRuntime || !rtmpStreamService) {
+    throw new Error('registerPlayerRoutes requires app, common, mediaDir, assetDir, playerRuntime, and rtmpStreamService.');
+  }
+
+  if (!bridgeBaseUrl && (!pool || !playerPlaylistService)) {
+    throw new Error('registerPlayerRoutes requires pool and playerPlaylistService unless bridgeBaseUrl is configured.');
   }
 
   const sharedSecret = getSharedSecret();
 
+  async function fetchBridge(req, pathname, options) {
+    if (!bridgeBaseUrl) {
+      return null;
+    }
+
+    const requestOptions = options && typeof options === 'object' ? options : {};
+    const method = String(requestOptions.method || req.method || 'GET').trim().toUpperCase();
+    const body = Object.prototype.hasOwnProperty.call(requestOptions, 'body') ? requestOptions.body : undefined;
+    const requestPathname = String(pathname || '').split('?')[0];
+    const headers = Object.assign({}, requestOptions.headers || {}, createRequestAuthHeaders({
+      method: method,
+      pathname: requestPathname,
+      body: body
+    }));
+
+    if (req.headers['x-pulse-page-auth']) {
+      headers['x-pulse-page-auth'] = String(req.headers['x-pulse-page-auth']).trim();
+    }
+    if (req.headers['if-none-match']) {
+      headers['if-none-match'] = String(req.headers['if-none-match']).trim();
+    }
+    if (requestOptions.contentType) {
+      headers['content-type'] = requestOptions.contentType;
+    }
+
+    return fetch(new URL(pathname, bridgeBaseUrl).toString(), {
+      method: method,
+      headers: headers,
+      body: body === undefined || body === null || method === 'GET' || method === 'HEAD' ? undefined : body
+    });
+  }
+
+  async function readJsonResponse(response) {
+    if (!response) {
+      return null;
+    }
+
+    const contentType = String(response.headers && typeof response.headers.get === 'function' ? response.headers.get('content-type') : '').toLowerCase();
+    if (contentType.indexOf('application/json') === -1 && contentType.indexOf('+json') === -1) {
+      return null;
+    }
+
+    try {
+      return await response.json();
+    } catch (_error) {
+      return null;
+    }
+  }
+
   function requirePageAuth(allowedScopes) {
     return function (req, res, next) {
       if (!sharedSecret) {
@@ -58,7 +130,23 @@ function registerPlayerRoutes(app, options) {
     next();
   }
 
+  function resolveMediaFilePath(fileName) {
+    const relativePath = path.normalize(String(fileName || '').trim()).replace(/^([\\/])+/, '');
+    if (!relativePath || relativePath === '.' || relativePath.startsWith('..') || path.isAbsolute(relativePath)) {
+      return null;
+    }
+
+    const resolvedMediaDir = path.resolve(mediaDir);
+    const resolvedFilePath = path.resolve(mediaDir, relativePath);
+    if (resolvedFilePath !== resolvedMediaDir && !resolvedFilePath.startsWith(resolvedMediaDir + path.sep)) {
+      return null;
+    }
+
+    return resolvedFilePath;
+  }
+
   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));
   app.use('/assets/vendor', express.static(path.join(__dirname, '..', '..', 'node_modules', 'hls.js', 'dist')));
 
@@ -92,22 +180,42 @@ function registerPlayerRoutes(app, options) {
   });
 
   app.get('/api/media/config', requireRequestAuth, function (_req, res) {
+    if (bridgeBaseUrl) {
+      void fetch(new URL('/api/media/config', bridgeBaseUrl).toString(), {
+        method: 'GET',
+        headers: createRequestAuthHeaders({
+          method: 'GET',
+          pathname: '/api/media/config'
+        })
+      }).then(async function (response) {
+        res.status(response.status);
+        const contentType = response.headers.get('content-type');
+        if (contentType) {
+          res.type(contentType);
+        }
+        res.send(await response.text());
+      }).catch(function (_error) {
+        res.status(502).json({ error: 'Thin client unavailable.' });
+      });
+      return;
+    }
+
     res.json({
-      mediaDir: mediaDir
+      mediaDir: mediaDir,
+      uploadDir: path.join(mediaDir, 'uploads')
     });
   });
 
-  app.put('/api/media/:filename', express.raw({ type: '*/*', limit: '100mb' }), requireRequestAuth, async function (req, res, next) {
+  app.put('/api/media/:filename', express.raw({ type: '*/*', limit: '1gb' }), requireRequestAuth, async function (req, res, next) {
     try {
-      const filename = require('path').basename(String(req.params.filename || '').trim());
-      if (!filename) {
+      const filePath = resolveMediaFilePath(req.params.filename);
+      if (!filePath) {
         return res.status(400).json({ error: 'Filename is required' });
       }
-      const filePath = require('path').join(mediaDir, filename);
       const body = Buffer.isBuffer(req.body) ? req.body : Buffer.from(req.body || '');
-      await fs.promises.mkdir(mediaDir, { recursive: true });
+      await fs.promises.mkdir(path.dirname(filePath), { recursive: true });
       await fs.promises.writeFile(filePath, body);
-      res.json({ ok: true, filename: filename });
+      res.json({ ok: true, filename: req.params.filename });
     } catch (error) {
       next(error);
     }
@@ -115,11 +223,10 @@ function registerPlayerRoutes(app, options) {
 
   app.delete('/api/media/:filename', requireRequestAuth, async function (req, res, next) {
     try {
-      const filename = require('path').basename(String(req.params.filename || '').trim());
-      if (!filename) {
+      const filePath = resolveMediaFilePath(req.params.filename);
+      if (!filePath) {
         return res.status(400).json({ error: 'Filename is required' });
       }
-      const filePath = require('path').join(mediaDir, filename);
       try {
         await fs.promises.unlink(filePath);
       } catch (error) {
@@ -127,7 +234,7 @@ function registerPlayerRoutes(app, options) {
           throw error;
         }
       }
-      res.json({ ok: true, filename: filename });
+      res.json({ ok: true, filename: req.params.filename });
     } catch (error) {
       next(error);
     }
@@ -138,16 +245,25 @@ function registerPlayerRoutes(app, options) {
       const source = String(req.query.source || '').trim();
       const disableAudio = String(req.query.disableAudio || '').trim().toLowerCase();
       const useMutedOutput = disableAudio === '1' || disableAudio === 'true' || disableAudio === 'yes' || disableAudio === 'on';
-      const session = await rtmpStreamService.ensureSession(source, useMutedOutput);
-      await session.ready.catch(function () {
-        return false;
-      });
+      const status = await rtmpStreamService.getSessionStatus(source, useMutedOutput);
+      const session = status.session;
+      const ready = Boolean(status.ready);
+      const live = Boolean(status.live);
       res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
+      if (!ready || !live) {
+        return res.status(503).json({
+          ready: false,
+          live: false,
+          timedOut: Boolean(status.timedOut),
+          stderr: String(status.stderr || '')
+        });
+      }
       res.json({
         key: session.key,
         playlistUrl: session.playlistUrl,
         disableAudio: session.disableAudio,
-        ready: true
+        ready: true,
+        live: true
       });
     } catch (error) {
       next(error);
@@ -181,8 +297,48 @@ function registerPlayerRoutes(app, options) {
   });
 
   app.get('/screen/:slug', function (req, res) {
+    if (onPlayerPublicBaseUrl) {
+      try {
+        onPlayerPublicBaseUrl(getPlayerPublicBaseUrl(req, null));
+      } catch (_error) {
+      }
+    }
+
     res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
     res.set('Pragma', 'no-cache');
+    if (bridgeBaseUrl) {
+      const pageAuthToken = createPageAuthBundle({ scope: 'player', slug: String(req.params.slug || '').trim() }).token;
+      void fetchBridge(req, '/api/screens/' + encodeURIComponent(req.params.slug) + '/playlist?ts=' + Date.now(), {
+        method: 'GET',
+        headers: pageAuthToken ? { 'x-pulse-page-auth': pageAuthToken } : {}
+      }).then(async function (response) {
+        if (!response || response.status >= 400) {
+          res.set('X-Player-Offline', '1');
+          return res.send(common.renderPlayerPage(req.params.slug, null));
+        }
+        const data = await readJsonResponse(response);
+        if (!data) {
+          res.set('X-Player-Offline', '1');
+          return res.send(common.renderPlayerPage(req.params.slug, null));
+        }
+        res.send(common.renderPlayerPage(req.params.slug, data));
+      }).catch(function (error) {
+        if (!isBridgeFetchError(error)) {
+          console.error(error);
+        }
+        res.set('X-Player-Offline', '1');
+        res.send(common.renderPlayerPage(req.params.slug, null));
+      });
+      return;
+    }
+
+    const { bindPlayerToScreen } = require('./onboarding');
+    if (playerDeviceId) {
+      void bindPlayerToScreen(pool, playerDeviceId, req.params.slug)
+        .catch(function (error) {
+          console.error(error);
+        });
+    }
     playerPlaylistService.buildScreenPlaylist(req.params.slug).then(function (data) {
       res.send(common.renderPlayerPage(req.params.slug, data));
     }).catch(function (error) {
@@ -192,8 +348,86 @@ 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 (bridgeBaseUrl) {
+        const response = await fetchBridge(req, '/api/screens/' + encodeURIComponent(req.params.slug) + '/playlist', {
+          method: 'GET'
+        });
+        if (!response) {
+          return res.status(502).json({ error: 'Thin client unavailable.' });
+        }
+        res.status(response.status);
+        const etag = response.headers.get('etag');
+        const cacheControl = response.headers.get('cache-control');
+        if (etag) {
+          res.set('ETag', etag);
+        }
+        if (cacheControl) {
+          res.set('Cache-Control', cacheControl);
+        }
+        if (response.status === 304) {
+          return res.end();
+        }
+        res.type(response.headers.get('content-type') || 'application/json');
+        return res.send(await response.text());
+      }
+
       res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
       const data = await playerPlaylistService.buildScreenPlaylist(req.params.slug);
       if (!data.screen) {
@@ -212,18 +446,82 @@ function registerPlayerRoutes(app, options) {
     }
   });
 
+  app.get('/api/screens/:slug/announcement', requirePageAuth(['player']), async function (req, res, next) {
+    try {
+      if (bridgeBaseUrl) {
+        const response = await fetchBridge(req, '/api/screens/' + encodeURIComponent(req.params.slug) + '/announcement', {
+          method: 'GET'
+        });
+        if (!response) {
+          return res.status(502).json({ error: 'Thin client unavailable.' });
+        }
+        res.status(response.status);
+        const etag = response.headers.get('etag');
+        const cacheControl = response.headers.get('cache-control');
+        if (etag) {
+          res.set('ETag', etag);
+        }
+        if (cacheControl) {
+          res.set('Cache-Control', cacheControl);
+        }
+        if (response.status === 304) {
+          return res.end();
+        }
+        res.type(response.headers.get('content-type') || 'application/json');
+        return res.send(await response.text());
+      }
+
+      res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
+      const announcement = typeof common.fetchActiveAnnouncement === 'function'
+        ? await common.fetchActiveAnnouncement(pool, req.params.slug)
+        : null;
+      const revision = announcement
+        ? [announcement.id, announcement.modified_at || '', announcement.expires_at || '', announcement.enabled ? '1' : '0'].join(':')
+        : 'none';
+      const etag = '"' + String(revision || 'none') + '"';
+      res.set('ETag', etag);
+      if (String(req.headers['if-none-match'] || '').split(',').map(function (value) {
+        return String(value || '').trim();
+      }).includes(etag)) {
+        return res.status(304).end();
+      }
+      res.json({
+        announcement: announcement,
+        revision: revision
+      });
+    } catch (error) {
+      if (isTransientDbError(error)) {
+        return res.status(503).json({ error: 'Announcement state unavailable.' });
+      }
+      next(error);
+    }
+  });
+
+  app.post('/api/screens/:slug/announcements/refresh', requireRequestAuth, async function (req, res, next) {
+    try {
+      const sent = typeof playerRuntime.broadcastAnnouncementRefresh === 'function'
+        ? playerRuntime.broadcastAnnouncementRefresh(req.params.slug)
+        : 0;
+      res.json({ ok: true, screenSlug: req.params.slug, sent: sent });
+    } catch (error) {
+      next(error);
+    }
+  });
+
   app.get(['/api/screens/:slug/connections', '/api/screens/:slug/clients'], requireRequestAuth, async function (req, res, next) {
     try {
       const connections = playerRuntime.snapshotConnections(req.params.slug);
       let screen = null;
       let screenLookupFailed = false;
-      try {
-        const [screenRows] = await pool.query('SELECT id, name, slug FROM screens WHERE slug = ?', [req.params.slug]);
-        screen = screenRows[0] || null;
-      } catch (error) {
-        screenLookupFailed = isTransientDbError(error);
-        if (!screenLookupFailed) {
-          throw error;
+      if (pool && typeof pool.query === 'function') {
+        try {
+          const [screenRows] = await pool.query('SELECT id, name, slug FROM d_screens WHERE slug = ?', [req.params.slug]);
+          screen = screenRows[0] || null;
+        } catch (error) {
+          screenLookupFailed = isTransientDbError(error);
+          if (!screenLookupFailed) {
+            throw error;
+          }
         }
       }
       res.json({
@@ -248,7 +546,7 @@ function registerPlayerRoutes(app, options) {
       if (!command) {
         return res.status(400).json({ error: 'Command is required' });
       }
-      if (['refresh', 'reload', 'redirect', 'pause', 'blackout', 'previous', 'next', 'left', 'right', 'setclientname'].indexOf(command) === -1) {
+      if (['refresh', 'reload', 'redirect', 'pause', 'blackout', 'previous', 'next', 'setclientname'].indexOf(command) === -1) {
         return res.status(400).json({ error: 'Unsupported command' });
       }
 
@@ -256,9 +554,9 @@ function registerPlayerRoutes(app, options) {
       const isRedirectCommand = command === 'redirect';
       let screen = null;
       let screenLookupFailed = false;
-      if (!isRedirectCommand) {
+      if (!isRedirectCommand && pool && typeof pool.query === 'function') {
         try {
-          const [screenRows] = await pool.query('SELECT id, name, slug FROM screens WHERE slug = ?', [req.params.slug]);
+          const [screenRows] = await pool.query('SELECT id, name, slug FROM d_screens WHERE slug = ?', [req.params.slug]);
           screen = screenRows[0] || null;
         } catch (error) {
           screenLookupFailed = isTransientDbError(error);

src/player/runtime.js

@@ -1,10 +1,27 @@
+// Player runtime state, websocket connections, and request-auth enforcement.
+
 const crypto = require('crypto');
 const { WebSocketServer, WebSocket } = require('ws');
-const { isClientNameAvailable } = require('../data/client-name-check');
-const { verifyPageAuthToken, verifyRequestAuth } = require('../request-auth');
+const { isClientNameAvailable } = require('#src/data/client-name-check');
+const { verifyPageAuthToken, verifyRequestAuth } = require('#src/request-auth');
+const PAGE_AUTH_COOKIE_NAME = 'pulse_page_auth';
+
+function normalizePlayerPublicBaseUrl(pageUrl) {
+  const value = String(pageUrl || '').trim();
+  if (!value) {
+    return null;
+  }
+
+  try {
+    return new URL(value).origin.replace(/\/$/, '');
+  } catch (_error) {
+    return null;
+  }
+}
 
 function createPlayerRuntime(options) {
   const pool = options && options.pool ? options.pool : null;
+  const notifySnapshot = typeof options.notifySnapshot === 'function' ? options.notifySnapshot : null;
   const normalizeDeviceId = typeof options.normalizeDeviceId === 'function'
     ? options.normalizeDeviceId
     : function (value) {
@@ -12,6 +29,7 @@ function createPlayerRuntime(options) {
     };
   const connectionsBySlug = new Map();
   const dashboardListenersBySlug = new Map();
+  const announcementListenersBySlug = new Map();
   const wss = new WebSocketServer({ noServer: true });
 
   function normalizeClientIp(value) {
@@ -27,6 +45,104 @@ function createPlayerRuntime(options) {
     return ip;
   }
 
+  function firstHeaderValue(value) {
+    return String(value || '').trim().split(',')[0].trim();
+  }
+
+  function isPrivateOrReservedIp(ip) {
+    const normalized = normalizeClientIp(ip);
+    if (!normalized) {
+      return true;
+    }
+
+    const lower = normalized.toLowerCase();
+    if (lower === 'localhost' || lower === '::1') {
+      return true;
+    }
+
+    if (/^10\./.test(lower) || /^192\.168\./.test(lower) || /^127\./.test(lower) || /^169\.254\./.test(lower)) {
+      return true;
+    }
+
+    if (/^172\.(1[6-9]|2\d|3[0-1])\./.test(lower)) {
+      return true;
+    }
+
+    if (lower.startsWith('fc') || lower.startsWith('fd') || lower.startsWith('fe80:') || lower.startsWith('::ffff:127.')) {
+      return true;
+    }
+
+    return false;
+  }
+
+  function pickForwardedIp(candidates) {
+    const normalizedCandidates = Array.isArray(candidates)
+      ? candidates.map(function (candidate) {
+        return normalizeClientIp(candidate);
+      }).filter(Boolean)
+      : [];
+
+    const publicCandidate = normalizedCandidates.find(function (candidate) {
+      return !isPrivateOrReservedIp(candidate);
+    });
+
+    return publicCandidate || normalizedCandidates[0] || null;
+  }
+
+  function resolveRequestIp(request) {
+    const forwardedFor = String(request && request.headers && request.headers['x-forwarded-for'] || '').split(',');
+    const forwardedForIp = pickForwardedIp(forwardedFor);
+    if (forwardedForIp) {
+      return forwardedForIp;
+    }
+
+    const realIp = pickForwardedIp([firstHeaderValue(request && request.headers && request.headers['x-real-ip'])]);
+    if (realIp) {
+      return realIp;
+    }
+
+    const forwarded = firstHeaderValue(request && request.headers && request.headers.forwarded);
+    if (forwarded) {
+      const forwardedMatches = Array.from(forwarded.matchAll(/(?:^|,\s*|;\s*)for=(?:"?\[?)([^"\];,\s]+)/gi)).map(function (match) {
+        return match[1];
+      });
+      const forwardedIp = pickForwardedIp(forwardedMatches);
+      if (forwardedIp) {
+        return forwardedIp;
+      }
+    }
+
+    return normalizeClientIp(request && request.socket && request.socket.remoteAddress);
+  }
+
+  function parseCookies(cookieHeader) {
+    return String(cookieHeader || '').split(/;\s*/).reduce(function (cookies, pair) {
+      if (!pair) {
+        return cookies;
+      }
+      const separatorIndex = pair.indexOf('=');
+      if (separatorIndex === -1) {
+        return cookies;
+      }
+      const name = decodeURIComponent(pair.slice(0, separatorIndex).trim());
+      const value = decodeURIComponent(pair.slice(separatorIndex + 1).trim());
+      if (name) {
+        cookies[name] = value;
+      }
+      return cookies;
+    }, {});
+  }
+
+  function readPageAuthToken(request) {
+    const queryToken = String(new URL(request.url, 'http://localhost').searchParams.get('auth') || '').trim();
+    if (queryToken) {
+      return queryToken;
+    }
+
+    const cookies = parseCookies(request.headers && request.headers.cookie || '');
+    return String(cookies[PAGE_AUTH_COOKIE_NAME] || '').trim();
+  }
+
   function getConnectionBucket(slug) {
     const key = String(slug || '').trim();
     if (!key) {
@@ -72,11 +188,33 @@ function createPlayerRuntime(options) {
     }
   }
 
+  function getAnnouncementListenerBucket(slug) {
+    const key = String(slug || '').trim();
+    if (!key) {
+      return null;
+    }
+    if (!announcementListenersBySlug.has(key)) {
+      announcementListenersBySlug.set(key, new Set());
+    }
+    return announcementListenersBySlug.get(key);
+  }
+
+  function removeAnnouncementListener(slug, socket) {
+    const key = String(slug || '').trim();
+    const bucket = announcementListenersBySlug.get(key);
+    if (!bucket) {
+      return;
+    }
+    bucket.delete(socket);
+    if (!bucket.size) {
+      announcementListenersBySlug.delete(key);
+    }
+  }
+
   function buildClientLabel(connection) {
     const clientName = String(connection.clientName || '').trim();
     const clientId = String(connection.clientId || '').trim();
     const userAgent = String(connection.userAgent || '').trim();
-    const clientIp = String(connection.clientIp || '').trim();
     const viewport = connection.viewport && typeof connection.viewport === 'object'
       ? connection.viewport
       : null;
@@ -92,10 +230,6 @@ function createPlayerRuntime(options) {
       labelParts.push(`id ${clientId.slice(-6)}`);
     }
 
-    if (clientIp) {
-      labelParts.push(clientIp);
-    }
-
     if (viewport && Number.isFinite(Number(viewport.width)) && Number.isFinite(Number(viewport.height))) {
       labelParts.push(`${Number(viewport.width)}x${Number(viewport.height)}`);
     }
@@ -123,13 +257,12 @@ function createPlayerRuntime(options) {
         userAgent: connection.userAgent || null,
         viewport: connection.viewport || null,
         page: connection.page || null,
+        playerPublicBaseUrl: connection.playerPublicBaseUrl || null,
         currentSlide: connection.currentSlide || null,
         paused: Boolean(connection.paused),
         blackout: Boolean(connection.blackout),
         currentSlideId: connection.currentSlide && connection.currentSlide.id ? connection.currentSlide.id : null,
         currentSlideTitle: connection.currentSlide && connection.currentSlide.title ? connection.currentSlide.title : null,
-        clientIp: connection.clientIp || null,
-        remoteAddress: connection.remoteAddress || null,
         connectedAt: connection.connectedAt ? connection.connectedAt.toISOString() : null,
         lastSeenAt: connection.lastSeenAt ? connection.lastSeenAt.toISOString() : null
       };
@@ -153,6 +286,10 @@ function createPlayerRuntime(options) {
     return allConnections;
   }
 
+  function snapshotSlugs() {
+    return Array.from(connectionsBySlug.keys());
+  }
+
   async function isClientNameAvailableOnScreen(poolArg, clientName, excludeDeviceId) {
     return isClientNameAvailable(poolArg || pool, clientName, excludeDeviceId, snapshotAllConnections());
   }
@@ -160,6 +297,16 @@ function createPlayerRuntime(options) {
   function broadcastConnectionSnapshot(slug) {
     const key = String(slug || '').trim();
     const bucket = dashboardListenersBySlug.get(key);
+    const connections = snapshotConnections(slug);
+    if (notifySnapshot) {
+      try {
+        notifySnapshot({
+          slug: key,
+          connections: connections
+        });
+      } catch (_error) {
+      }
+    }
     if (!bucket || !bucket.size) {
       return;
     }
@@ -167,7 +314,7 @@ function createPlayerRuntime(options) {
     const payload = JSON.stringify({
       type: 'snapshot',
       slug: key,
-      connections: snapshotConnections(slug),
+      connections: connections,
       sentAt: new Date().toISOString()
     });
 
@@ -178,6 +325,30 @@ function createPlayerRuntime(options) {
     });
   }
 
+  function broadcastAnnouncementRefresh(slug) {
+    const key = String(slug || '').trim();
+    const bucket = announcementListenersBySlug.get(key);
+    if (!bucket || !bucket.size) {
+      return 0;
+    }
+
+    const payload = JSON.stringify({
+      type: 'announcement-refresh',
+      slug: key,
+      sentAt: new Date().toISOString()
+    });
+
+    let sent = 0;
+    bucket.forEach(function (socket) {
+      if (socket.readyState === WebSocket.OPEN) {
+        socket.send(payload);
+        sent += 1;
+      }
+    });
+
+    return sent;
+  }
+
   async function sendCommandToConnection(slug, connectionId, commandOrPayload) {
     const bucket = connectionsBySlug.get(String(slug || '').trim());
     if (!bucket || !bucket.size) {
@@ -235,7 +406,9 @@ function createPlayerRuntime(options) {
 
     const dashboardMatch = pathname.match(/^\/ws\/screens\/([^/]+)\/events$/);
     const playerMatch = pathname.match(/^\/ws\/screens\/([^/]+)$/);
-    if (!dashboardMatch && !playerMatch) {
+    const announcementMatch = pathname.match(/^\/ws\/screens\/([^/]+)\/announcements$/);
+
+    if (!dashboardMatch && !playerMatch && !announcementMatch) {
       socket.destroy();
       return;
     }
@@ -248,7 +421,7 @@ function createPlayerRuntime(options) {
     }
 
     if (playerMatch) {
-      const authToken = String(new URL(request.url, 'http://localhost').searchParams.get('auth') || '').trim();
+      const authToken = readPageAuthToken(request);
       const payload = verifyPageAuthToken(authToken);
       if (!payload || String(payload.scope || '').trim() !== 'player') {
         socket.destroy();
@@ -256,9 +429,18 @@ function createPlayerRuntime(options) {
       }
     }
 
-    const slug = decodeURIComponent((dashboardMatch || playerMatch)[1]);
+    if (announcementMatch) {
+      const authToken = readPageAuthToken(request);
+      const payload = verifyPageAuthToken(authToken);
+      if (!payload || String(payload.scope || '').trim() !== 'player') {
+        socket.destroy();
+        return;
+      }
+    }
+
+    const slug = decodeURIComponent((dashboardMatch || playerMatch || announcementMatch)[1]);
     wss.handleUpgrade(request, socket, head, function (ws) {
-      wss.emit('connection', ws, request, slug, dashboardMatch ? 'dashboard' : 'player');
+      wss.emit('connection', ws, request, slug, dashboardMatch ? 'dashboard' : announcementMatch ? 'announcements' : 'player');
     });
   }
 
@@ -288,9 +470,30 @@ function createPlayerRuntime(options) {
       return;
     }
 
-    const remoteAddress = request.socket && request.socket.remoteAddress ? request.socket.remoteAddress : null;
-    const forwardedFor = normalizeClientIp(String(request.headers['x-forwarded-for'] || '').split(',')[0]);
-    const normalizedRemoteAddress = normalizeClientIp(remoteAddress);
+    if (role === 'announcements') {
+      const listenerBucket = getAnnouncementListenerBucket(slug);
+      if (!listenerBucket) {
+        socket.close();
+        return;
+      }
+
+      listenerBucket.add(socket);
+      socket.send(JSON.stringify({
+        type: 'announcement-ready',
+        slug: String(slug || '').trim(),
+        sentAt: new Date().toISOString()
+      }));
+
+      socket.on('close', function () {
+        removeAnnouncementListener(slug, socket);
+      });
+
+      socket.on('error', function () {
+        removeAnnouncementListener(slug, socket);
+      });
+      return;
+    }
+
     const connectionId = crypto.randomUUID();
     const connection = {
       id: connectionId,
@@ -304,9 +507,8 @@ function createPlayerRuntime(options) {
       page: null,
       paused: false,
       blackout: false,
-      clientIp: forwardedFor || normalizedRemoteAddress,
-      remoteAddress: normalizedRemoteAddress,
-      label: forwardedFor || normalizedRemoteAddress || 'connected client',
+      playerPublicBaseUrl: null,
+      label: 'connected client',
       connectedAt: new Date(),
       lastSeenAt: new Date()
     };
@@ -328,7 +530,7 @@ function createPlayerRuntime(options) {
         return;
       }
 
-      if (!payload || (payload.type !== 'hello' && payload.type !== 'state')) {
+      if (!payload || payload.type !== 'state') {
         return;
       }
 
@@ -341,9 +543,12 @@ function createPlayerRuntime(options) {
       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;
+      const nextPlayerPublicBaseUrl = normalizePlayerPublicBaseUrl(payload.page);
+      if (nextPlayerPublicBaseUrl && nextPlayerPublicBaseUrl !== connection.playerPublicBaseUrl) {
+        connection.playerPublicBaseUrl = nextPlayerPublicBaseUrl;
+      }
       connection.paused = Boolean(payload.paused);
       connection.blackout = Boolean(payload.blackout);
-      connection.clientIp = payload.clientIp ? normalizeClientIp(payload.clientIp) || connection.clientIp : connection.clientIp;
       connection.currentSlide = payload.currentSlide && typeof payload.currentSlide === 'object' ? {
         id: payload.currentSlide.id || null,
         title: payload.currentSlide.title || '',
@@ -372,8 +577,10 @@ function createPlayerRuntime(options) {
 
   return {
     installWebsocket: installWebsocket,
+    broadcastAnnouncementRefresh: broadcastAnnouncementRefresh,
     snapshotConnections: snapshotConnections,
     snapshotAllConnections: snapshotAllConnections,
+    snapshotSlugs: snapshotSlugs,
     isClientNameAvailableOnScreen: isClientNameAvailableOnScreen,
     sendCommandToConnection: sendCommandToConnection,
     broadcastCommand: broadcastCommand

src/player/thumbnail-preview.js

@@ -0,0 +1,30 @@
+// 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

@@ -1,162 +1,243 @@
+// Permission section definitions and normalization helpers for RBAC.
+
 const PERMISSION_SECTIONS = [
   {
-    key: 'dashboard',
+    sectionName: 'Main navigation',
     order: 10,
-    name: 'Dashboard',
-    sectionName: 'Main navigation',
-    actions: [
-      { key: 'read', name: 'Read', description: 'Access the dashboard overview.' },
-      { key: 'allow', name: 'Allow', description: 'Send global player commands.' }
+    permissions: [
+      {
+        key: 'dashboard',
+        order: 10,
+        name: 'Dashboard',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'Access the dashboard overview.' },
+          { key: 'allow', name: 'Allow', description: 'Send global player commands.' }
+        ]
+      },
+      {
+        key: 'clients',
+        order: 20,
+        name: 'Connected clients',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View connected player clients and live status.' },
+          { key: 'allow', name: 'Allow', description: 'Use the connected client command buttons.' }
+        ]
+      }
     ]
   },
   {
-    key: 'clients',
+    sectionName: 'Content',
     order: 20,
-    name: 'Connected clients',
-    sectionName: 'Main navigation',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View connected player clients and live status.' },
-      { key: 'allow', name: 'Allow', description: 'Use the connected client command buttons.' }
+    permissions: [
+      {
+        key: 'screens',
+        order: 10,
+        name: 'Screens',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View the screen list and open screen details.' },
+          { key: 'create', name: 'Create', description: 'Create new screens.' },
+          { key: 'update', name: 'Update', description: 'Update screens.' },
+          { key: 'delete', name: 'Delete', description: 'Delete screens.' }
+        ]
+      },
+      {
+        key: 'playlists',
+        order: 20,
+        name: 'Playlists',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View playlists and playlist contents.' },
+          { key: 'create', name: 'Create', description: 'Create new playlists.' },
+          { key: 'update', name: 'Update', description: 'Update playlists and playlist slides.' },
+          { key: 'delete', name: 'Delete', description: 'Delete playlists.' }
+        ]
+      },
+      {
+        key: 'slides',
+        order: 30,
+        name: 'Slides',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View slides.' },
+          { key: 'create', name: 'Create', description: 'Create new slides.' },
+          { key: 'update', name: 'Update', description: 'Update slide content.' },
+          { key: 'delete', name: 'Delete', description: 'Delete slides.' }
+        ]
+      },
+      {
+        key: 'templates',
+        order: 40,
+        name: 'Slide templates',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View slide templates.' },
+          { key: 'create', name: 'Create', description: 'Create new slide templates.' },
+          { key: 'update', name: 'Update', description: 'Update slide templates.' },
+          { key: 'delete', name: 'Delete', description: 'Delete slide templates.' }
+        ]
+      },
+      {
+        key: 'canvas-sizes',
+        order: 50,
+        name: 'Canvas sizes',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View canvas sizes.' },
+          { key: 'create', name: 'Create', description: 'Create new canvas sizes.' },
+          { key: 'update', name: 'Update', description: 'Update canvas sizes.' },
+          { key: 'delete', name: 'Delete', description: 'Delete canvas sizes.' }
+        ]
+      },
+      {
+        key: 'announcements',
+        order: 60,
+        name: 'Announcements',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View announcements.' },
+          { key: 'create', name: 'Create', description: 'Create new announcements.' },
+          { key: 'update', name: 'Update', description: 'Update announcements.' },
+          { key: 'delete', name: 'Delete', description: 'Delete announcements.' }
+        ]
+      }
     ]
   },
   {
-    key: 'screens',
+    sectionName: 'Data Sources',
     order: 30,
-    name: 'Screens',
-    sectionName: 'Content',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View the screen list and open screen details.' },
-      { key: 'create', name: 'Create', description: 'Create new screens.' },
-      { key: 'update', name: 'Update', description: 'Update screens.' },
-      { key: 'delete', name: 'Delete', description: 'Delete screens.' }
+    permissions: [
+      {
+        key: 'rss-feeds',
+        order: 10,
+        name: 'RSS feeds',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View configured RSS feeds.' },
+          { key: 'create', name: 'Create', description: 'Create new RSS feeds.' },
+          { key: 'update', name: 'Update', description: 'Update RSS feeds.' },
+          { key: 'delete', name: 'Delete', description: 'Delete RSS feeds.' }
+        ]
+      },
+      {
+        key: 'api-sources',
+        order: 20,
+        name: 'API sources',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View configured API sources.' },
+          { key: 'create', name: 'Create', description: 'Create new API sources.' },
+          { key: 'update', name: 'Update', description: 'Update API sources.' },
+          { key: 'delete', name: 'Delete', description: 'Delete API sources.' }
+        ]
+      },
+      {
+        key: 'timetables',
+        order: 30,
+        name: 'Timetables',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View configured timetable groups.' },
+          { key: 'create', name: 'Create', description: 'Create new timetable groups.' },
+          { key: 'update', name: 'Update', description: 'Update timetable groups and entries.' },
+          { key: 'delete', name: 'Delete', description: 'Delete timetable groups.' }
+        ]
+      }
     ]
   },
   {
-    key: 'playlists',
+    sectionName: 'Settings',
     order: 40,
-    name: 'Playlists',
-    sectionName: 'Content',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View playlists and playlist contents.' },
-      { key: 'create', name: 'Create', description: 'Create new playlists.' },
-      { key: 'update', name: 'Update', description: 'Update playlists and playlist slides.' },
-      { key: 'delete', name: 'Delete', description: 'Delete playlists.' }
-    ]
-  },
-  {
-    key: 'slides',
-    order: 50,
-    name: 'Slides',
-    sectionName: 'Content',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View slides.' },
-      { key: 'create', name: 'Create', description: 'Create new slides.' },
-      { key: 'update', name: 'Update', description: 'Update slide content.' },
-      { key: 'delete', name: 'Delete', description: 'Delete slides.' }
-    ]
-  },
-  {
-    key: 'templates',
-    order: 60,
-    name: 'Slide templates',
-    sectionName: 'Content',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View slide templates.' },
-      { key: 'create', name: 'Create', description: 'Create new slide templates.' },
-      { key: 'update', name: 'Update', description: 'Update slide templates.' },
-      { key: 'delete', name: 'Delete', description: 'Delete slide templates.' }
-    ]
-  },
-  {
-    key: 'canvas-sizes',
-    order: 70,
-    name: 'Canvas sizes',
-    sectionName: 'Content',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View canvas sizes.' },
-      { key: 'create', name: 'Create', description: 'Create new canvas sizes.' },
-      { key: 'update', name: 'Update', description: 'Update canvas sizes.' },
-      { key: 'delete', name: 'Delete', description: 'Delete canvas sizes.' }
-    ]
-  },
-  {
-    key: 'rss-feeds',
-    order: 75,
-    name: 'RSS feeds',
-    sectionName: 'Data Sources',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View configured RSS feeds.' },
-      { key: 'create', name: 'Create', description: 'Create new RSS feeds.' },
-      { key: 'update', name: 'Update', description: 'Update RSS feeds.' },
-      { key: 'delete', name: 'Delete', description: 'Delete RSS feeds.' }
-    ]
-  },
-  {
-    key: 'api-sources',
-    order: 76,
-    name: 'API sources',
-    sectionName: 'Data Sources',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View configured API sources.' },
-      { key: 'create', name: 'Create', description: 'Create new API sources.' },
-      { key: 'update', name: 'Update', description: 'Update API sources.' },
-      { key: 'delete', name: 'Delete', description: 'Delete API sources.' }
-    ]
-  },
-  {
-    key: 'background-tasks',
-    order: 100,
-    name: 'Background tasks',
-    sectionName: 'Settings',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View background tasks and scheduled refreshes.' },
-      { key: 'allow', name: 'Allow', description: 'Manage queued background tasks and clear finished items.' }
-    ]
-  },
-  {
-    key: 'users',
-    order: 80,
-    name: 'Users',
-    sectionName: 'Settings',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View users and role assignments.' },
-      { key: 'create', name: 'Create', description: 'Create new users.' },
-      { key: 'update', name: 'Update', description: 'Update users, passwords, and role assignments.' },
-      { key: 'delete', name: 'Delete', description: 'Delete users.' }
-    ]
-  },
-  {
-    key: 'rbac',
-    order: 90,
-    name: 'Roles and permissions',
-    sectionName: 'Settings',
-    actions: [
-      { key: 'read', name: 'Read', description: 'View roles and permissions.' },
-      { key: 'create', name: 'Create', description: 'Create new roles.' },
-      { key: 'update', name: 'Update', description: 'Update role details and permissions.' },
-      { key: 'delete', name: 'Delete', description: 'Delete roles.' }
+    permissions: [
+      {
+        key: 'system-settings',
+        order: 70,
+        name: 'System settings',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View global application settings.' },
+          { key: 'update', name: 'Update', description: 'Update global application settings.' }
+        ]
+      },
+      {
+        key: 'audit-log',
+        order: 60,
+        name: 'Audit log',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View security and session audit events.' },
+          { key: 'allow', name: 'Allow', description: 'Download filtered audit events.' }
+        ]
+      },
+      {
+        key: 'users',
+        order: 10,
+        name: 'Users',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View users and role assignments.' },
+          { key: 'create', name: 'Create', description: 'Create new users.' },
+          { key: 'update', name: 'Update', description: 'Update users, passwords, and role assignments.' },
+          { key: 'delete', name: 'Delete', description: 'Delete users.' }
+        ]
+      },
+      {
+        key: 'rbac',
+        order: 20,
+        name: 'Roles and permissions',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View roles and permissions.' },
+          { key: 'create', name: 'Create', description: 'Create new roles.' },
+          { key: 'update', name: 'Update', description: 'Update role details and permissions.' },
+          { key: 'delete', name: 'Delete', description: 'Delete roles.' }
+        ]
+      },
+      {
+        key: 'fonts',
+        order: 30,
+        name: 'Fonts',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View managed fonts.' },
+          { key: 'create', name: 'Create', description: 'Upload managed fonts.' },
+          { key: 'delete', name: 'Delete', description: 'Remove managed fonts.' }
+        ]
+      },
+      {
+        key: 'background-tasks',
+        order: 40,
+        name: 'Task Queue',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View queued background tasks.' },
+          { key: 'allow', name: 'Allow', description: 'Manage queued background tasks and clear finished items.' }
+        ]
+      },
+      {
+        key: 'scheduled-tasks',
+        order: 50,
+        name: 'Scheduled tasks',
+        permissions: [
+          { key: 'read', name: 'Read', description: 'View scheduled refresh tasks.' },
+          { key: 'allow', name: 'Allow', description: 'Run scheduled refreshes manually.' }
+        ]
+      }
     ]
   }
 ];
 
-const PERMISSIONS = PERMISSION_SECTIONS.flatMap(function (section) {
-  return section.actions.map(function (action) {
-    return {
-      key: `${section.key}.${action.key}`,
-      name: section.name,
-      sectionOrder: section.order,
-      actionName: action.name,
-      sectionName: section.sectionName,
-      sectionKey: section.key,
-      actionKey: action.key,
-      description: action.description
-    };
+const PERMISSIONS = PERMISSION_SECTIONS.flatMap(function (section, sectionIndex) {
+  return (Array.isArray(section.permissions) ? section.permissions : []).flatMap(function (resource, resourceIndex) {
+    return (Array.isArray(resource.permissions) ? resource.permissions : []).map(function (action, actionIndex) {
+      return {
+        key: `${resource.key}.${action.key}`,
+        name: resource.name,
+        sectionOrder: section.order,
+        sectionIndex: sectionIndex,
+        actionName: action.name,
+        permissionOrder: actionIndex + 1,
+        permissionIndex: actionIndex,
+        sectionName: section.sectionName,
+        resourceKey: resource.key,
+        resourceOrder: resource.order,
+        resourceIndex: resourceIndex,
+        resourceName: resource.name,
+        actionKey: action.key,
+        description: action.description
+      };
+    });
   });
 });
 
 const DEFAULT_ROLE = {
-  key: 'administrators',
-  name: 'Administrators',
+  key: 'super-admin',
+  name: 'Super Admin',
   description: 'Full access to the admin interface.'
 };
 
@@ -164,6 +245,8 @@ function normalizePermissionKey(permissionKey) {
   return String(permissionKey || '').trim();
 }
 
+const PERMISSION_DENIED_MESSAGE = 'You do not have permissions to do this.';
+
 function normalizePermissionKeys(permissionKeys) {
   const normalized = [];
 
@@ -226,22 +309,29 @@ function hasAnyPermission(currentUser, permissionKeys) {
   });
 }
 
-function requirePermission(permissionKey) {
+function requirePermission(permissionKey, options) {
   const normalizedPermissionKey = normalizePermissionKey(permissionKey);
   if (!normalizedPermissionKey) {
     throw new Error('requirePermission requires a permission key.');
   }
 
+  const setAuthMessageCookie = options && options.setAuthMessageCookie;
+
   return function (req, res, next) {
     if (!req.currentUser) {
-      return res.redirect('/login?message=' + encodeURIComponent('Please sign in to continue.'));
+      if (typeof setAuthMessageCookie === 'function') {
+        setAuthMessageCookie(res, 'Please sign in to continue.');
+        return res.redirect('/login');
+      }
+
+      return res.redirect('/login');
     }
 
     if (hasPermission(req.currentUser, normalizedPermissionKey)) {
       return next();
     }
 
-    const error = new Error('You do not have permission to access this area.');
+    const error = new Error(PERMISSION_DENIED_MESSAGE);
     error.statusCode = 403;
     error.expose = true;
     next(error);
@@ -255,5 +345,6 @@ module.exports = {
   hasPermission,
   hasAnyPermission,
   requirePermission,
-  normalizePermissionKeys
+  normalizePermissionKeys,
+  PERMISSION_DENIED_MESSAGE
 };

src/request-auth.js

@@ -1,3 +1,5 @@
+// Page and request authentication signing helpers.
+
 const crypto = require('crypto');
 
 const PAGE_TOKEN_HEADER = 'x-pulse-page-auth';
@@ -47,6 +49,19 @@ function canonicalize(value) {
   return value === undefined ? undefined : value;
 }
 
+function normalizeRequestPath(pathValue) {
+  const value = String(pathValue || '').trim();
+  if (!value) {
+    return '';
+  }
+
+  try {
+    return decodeURIComponent(value);
+  } catch (_error) {
+    return value;
+  }
+}
+
 function stableJson(value) {
   return JSON.stringify(canonicalize(value));
 }
@@ -56,10 +71,38 @@ function hashPayload(value) {
   return crypto.createHash('sha256').update(normalized).digest('hex');
 }
 
+function normalizeRequestAuthBody(req) {
+  if (!req) {
+    return null;
+  }
+
+  const body = req.body;
+  if (body === undefined || body === null) {
+    return null;
+  }
+
+  if (Buffer.isBuffer(body)) {
+    return body;
+  }
+
+  if (typeof body === 'object' && !Array.isArray(body)) {
+    const hasFields = Object.keys(body).length > 0;
+    if (!hasFields) {
+      const contentLength = Number(String(req.headers && req.headers['content-length'] || '').trim() || 0);
+      const contentType = String(req.headers && req.headers['content-type'] || '').trim();
+      if (!contentLength || !contentType) {
+        return null;
+      }
+    }
+  }
+
+  return body;
+}
+
 function getRequestPath(req) {
   const explicitPath = String(req && req.path ? req.path : '').trim();
   if (explicitPath) {
-    return explicitPath;
+    return normalizeRequestPath(explicitPath);
   }
 
   const rawUrl = String(req && req.url ? req.url : '').trim();
@@ -68,9 +111,9 @@ function getRequestPath(req) {
   }
 
   try {
-    return new URL(rawUrl, 'http://localhost').pathname;
+    return normalizeRequestPath(new URL(rawUrl, 'http://localhost').pathname);
   } catch (_error) {
-    return rawUrl.split('?')[0] || '';
+    return normalizeRequestPath(rawUrl.split('?')[0] || '');
   }
 }
 
@@ -167,7 +210,7 @@ function createRequestAuthHeaders(options) {
   }
 
   const method = String(options && options.method || 'GET').trim().toUpperCase();
-  const pathname = String(options && options.pathname || '').trim();
+  const pathname = normalizeRequestPath(options && options.pathname || '');
   const timestamp = String(options && options.timestamp || Date.now()).trim();
   const bodyDigest = hashPayload(options && Object.prototype.hasOwnProperty.call(options, 'body') ? options.body : null);
   const signature = signText(secret, `request\n${method}\n${pathname}\n${timestamp}\n${bodyDigest}`);
@@ -199,16 +242,17 @@ function verifyRequestAuth(req) {
     return false;
   }
 
-  const expectedSignature = signText(secret, `request\n${String(req.method || 'GET').trim().toUpperCase()}\n${getRequestPath(req)}\n${timestamp}\n${hashPayload(req.body)}`);
+  const expectedSignature = signText(secret, `request\n${String(req.method || 'GET').trim().toUpperCase()}\n${getRequestPath(req)}\n${timestamp}\n${hashPayload(normalizeRequestAuthBody(req))}`);
   return timingSafeEqualHex(expectedSignature, signature);
 }
 
-function createPageFetchAuthScript(token) {
+function createPageFetchAuthScript(token, cookiePath) {
   const normalizedToken = String(token && typeof token === 'object' ? token.token : token || '').trim();
   if (!normalizedToken) {
     return '';
   }
 
+  const normalizedCookiePath = String(cookiePath || '').trim();
   const pageAuthExpiresAt = token && typeof token === 'object' && Number.isFinite(Number(token.expiresAt))
     ? Number(token.expiresAt)
     : null;
@@ -219,6 +263,8 @@ function createPageFetchAuthScript(token) {
     '  (function () {',
     '    var pageAuthToken = ' + JSON.stringify(normalizedToken) + ';',
     '    var pageAuthExpiresAt = ' + JSON.stringify(pageAuthExpiresAt) + ';',
+    '    var pageAuthCookiePath = ' + JSON.stringify(normalizedCookiePath) + ';',
+    '    var pageAuthCookieName = "pulse_page_auth";',
     '    var pageAuthRenewalTimer = null;',
     '    var pageAuthRenewalInFlight = null;',
     '    var pageAuthRenewalSkewMs = ' + JSON.stringify(renewSkewMs) + ';',
@@ -244,11 +290,28 @@ function createPageFetchAuthScript(token) {
     '        });',
     '      }, delayMs);',
     '    }',
+    '    function writePageAuthCookie(nextToken, nextExpiresAt) {',
+    '      if (!pageAuthCookiePath) {',
+    '        return;',
+    '      }',
+    '      var cookieParts = [pageAuthCookieName + "=" + encodeURIComponent(String(nextToken || "").trim()), "Path=" + pageAuthCookiePath, "SameSite=Lax"];',
+    '      var expiresInMs = Number(nextExpiresAt || 0) - Date.now();',
+    '      if (Number.isFinite(expiresInMs) && expiresInMs > 0) {',
+    '        cookieParts.push("Max-Age=" + Math.max(1, Math.floor(expiresInMs / 1000)));',
+    '      } else {',
+    '        cookieParts.push("Max-Age=0");',
+    '      }',
+    '      if (window.location.protocol === "https:") {',
+    '        cookieParts.push("Secure");',
+    '      }',
+    '      document.cookie = cookieParts.join("; ");',
+    '    }',
     '    function setPageAuthToken(nextToken, nextExpiresAt) {',
     '      pageAuthToken = String(nextToken || "").trim();',
     '      pageAuthExpiresAt = Number(nextExpiresAt || 0) || null;',
     '      window.__pulsePageAuthToken = pageAuthToken;',
     '      window.__pulsePageAuthExpiresAt = pageAuthExpiresAt;',
+    '      writePageAuthCookie(pageAuthToken, pageAuthExpiresAt);',
     '      schedulePageAuthRenewal();',
     '    }',
     '    async function renewPageAuthToken() {',
@@ -283,6 +346,7 @@ function createPageFetchAuthScript(token) {
     '    window.__pulseRenewPageAuthToken = renewPageAuthToken;',
     '    window.__pulsePageAuthToken = pageAuthToken;',
     '    window.__pulsePageAuthExpiresAt = pageAuthExpiresAt;',
+    '    writePageAuthCookie(pageAuthToken, pageAuthExpiresAt);',
     '    window.addEventListener("focus", function () {',
     '      schedulePageAuthRenewal();',
     '    });',

src/web.js

@@ -1,29 +1,33 @@
+// Main web application bootstrap, route wiring, and lifecycle setup.
+
 const express = require('express');
 const http = require('http');
 const multer = require('multer');
 const fs = require('fs');
-const path = require('path');
 const crypto = require('crypto');
 const common = require('./common');
-const { verifyPassword, createSessionToken, hashSessionToken, hashPassword } = require('./auth');
-const pages = require('./web/pages');
-const registerAuthRoutes = require('./web/routes/auth');
-const registerAdminPagesRoutes = require('./web/routes/admin/pages');
-const registerAdminAccountRoutes = require('./web/routes/admin/account');
-const registerAdminUsersRoutes = require('./web/routes/admin/users');
-const registerAdminManageRoutes = require('./web/routes/admin/manage');
-const registerAdminScreenCommandRoutes = require('./web/routes/admin/client-commands');
-const registerAdminContentRoutes = require('./web/routes/admin/content');
-const registerAdminDataSourceRoutes = require('./web/routes/data-sources');
-const registerAdminSettingsRoutes = require('./web/routes/settings/background-tasks');
-const { createBackgroundTaskQueue, normalizeIntervalMs } = require('./web/lib/background-task-queue');
-const { refreshApiSource, refreshRssFeed } = require('./web/lib/data-source-refresh');
-const { createWebBootstrap } = require('./web/bootstrap');
-const { requirePermission } = require('./rbac');
-const rbacData = require('./web/lib/rbac-data');
-const { createPlayerActionService } = require('./web/lib/player-actions');
-const { isClientNameAvailable, withClientNameReservation } = require('./data/client-name-check');
-const { createSessionService } = require('./web/lib/session');
+const { verifyPassword, createSessionToken, hashSessionToken, hashPassword, validatePasswordStrength } = require('#src/auth');
+const pages = require('#src/web/pages');
+const registerMiddleware = require('#src/web/middleware');
+const registerNotFoundHandler = require('#src/web/middleware/not-found');
+const { createBackgroundTaskQueue } = require('#src/web/lib/background-tasks/queue');
+const { initializeBackgroundTasks } = require('#src/web/lib/background-tasks');
+const { createDataSourceTaskService } = require('#src/web/lib/background-tasks/tasks-scheduled/data-source-refresh');
+const { captureSlideThumbnail } = require('#src/web/lib/media');
+const { createWebBootstrap } = require('#src/web/bootstrap');
+const { registerRoutes } = require('#src/web/routes/register');
+const { createNotifyPlayerScreens } = require('#src/web/lib/notify-player-screens');
+const { initializeWebServer } = require('#src/web/lib/web-startup');
+const { createWebConfig } = require('#src/web/lib/config');
+const { requirePermission: createRequirePermission, PERMISSION_DENIED_MESSAGE } = require('#src/rbac');
+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 { fetchAppSettings } = require('#src/data/app-settings');
+const { recordRequestAuditEvent } = require('#src/data/audit-log');
+const { hasAnyPermission } = require('#src/rbac');
+const { ensureFontLibrary } = require('#src/web/lib/media/font-library');
 const {
   formatDashboardDate,
   readArrayField,
@@ -32,292 +36,165 @@ const {
   normalizeScheduleMode,
   getAuditUserId,
   getCanvasSignature,
-  fetchPlaylistCanvasSignature,
+  fetchPlaylistCanvasId,
   fetchScreensByPlaylistId,
   fetchScreensBySlideId,
   fetchScreensByTemplateId,
   fetchOrderedPlaylistSlides,
   redirectAfterSave
-} = require('./web/lib/helpers');
-const PLAYER_INTERNAL_BASE_URL = (process.env.PLAYER_INTERNAL_BASE_URL || process.env.PLAYER_BASE_URL || 'http://player:3001').replace(/\/$/, '');
-const PLAYER_PUBLIC_BASE_URL = (process.env.PLAYER_PUBLIC_BASE_URL || process.env.PLAYER_BASE_URL || 'http://localhost:3001').replace(/\/$/, '');
-const PLAYER_WS_BASE_URL = PLAYER_INTERNAL_BASE_URL.replace(/^http/, 'ws');
-const SESSION_COOKIE_NAME = 'digital_signage_session';
-const SESSION_MAX_AGE_DAYS = Number(process.env.SESSION_MAX_AGE_DAYS || 14);
-const SESSION_MAX_AGE_MS = (Number.isFinite(SESSION_MAX_AGE_DAYS) && SESSION_MAX_AGE_DAYS > 0 ? SESSION_MAX_AGE_DAYS : 14) * 24 * 60 * 60 * 1000;
+} = require('#src/web/lib/helpers');
 
 async function start() {
+  // Core app and filesystem setup.
   const app = express();
   const server = http.createServer(app);
   const pool = common.createPool();
-  const PORT = Number(process.env.WEB_PORT || 3000);
-  const MEDIA_DIR = path.join(__dirname, '..', 'media');
-  const ASSET_DIR = path.join(__dirname, 'web', 'public');
+  const webConfig = createWebConfig();
+
+  // Background services and request forwarding helpers.
   const backgroundTaskQueue = createBackgroundTaskQueue({
     pool: pool,
     maxConcurrent: 1
   });
-  const playerActionService = createPlayerActionService({
+  const dataSourceTasks = createDataSourceTaskService({
+    pool: pool,
     common: common,
-    playerInternalBaseUrl: PLAYER_INTERNAL_BASE_URL
+    backgroundTaskQueue: backgroundTaskQueue
   });
-  const notifyPlayerScreens = function (slugs, commandOrPayload) {
-    const uniqueSlugs = Array.from(new Set((slugs || []).map(function (slug) {
-      return String(slug || '').trim();
-    }).filter(Boolean)));
+  const playerActionService = createPlayerActionService({
+    pool: pool,
+    common: common,
+    playerInternalBaseUrl: webConfig.playerInternalUrl,
+    bridgeInternalBaseUrl: webConfig.bridgeInternalUrl
+  });
+  const notifyPlayerScreens = createNotifyPlayerScreens(playerActionService.forwardPlayerCommand);
 
-    if (!uniqueSlugs.length) {
-      return Promise.resolve(0);
-    }
-
-    return Promise.allSettled(uniqueSlugs.map(function (slug) {
-      return playerActionService.forwardPlayerCommand(slug, commandOrPayload || 'refresh');
-    })).then(function (results) {
-      return results.filter(function (result) {
-        return result.status === 'fulfilled';
-      }).length;
-    });
-  };
+  // Centralized dashboard/player bootstrap.
   const webBootstrap = createWebBootstrap({
     pool: pool,
     common: common,
-    playerInternalBaseUrl: PLAYER_INTERNAL_BASE_URL,
-    playerPublicBaseUrl: PLAYER_PUBLIC_BASE_URL,
-    uploadDir: MEDIA_DIR,
-    dashboardRefreshIntervalMs: Number(process.env.DASHBOARD_REFRESH_INTERVAL_MS || 2000),
+    playerInternalBaseUrl: webConfig.playerInternalUrl,
+    bridgeInternalBaseUrl: webConfig.bridgeInternalUrl,
+    uploadDir: webConfig.uploadsDir,
     formatDashboardDate: formatDashboardDate,
     notifyPlayerScreens: notifyPlayerScreens,
-    backgroundTaskQueue: backgroundTaskQueue
+    backgroundTaskQueue: backgroundTaskQueue,
+    hasAnyPermission: hasAnyPermission,
   });
   const upload = webBootstrap.upload;
   const collectUploadReferencesFromSlide = webBootstrap.collectUploadReferencesFromSlide;
   const collectUploadReferencesFromTemplate = webBootstrap.collectUploadReferencesFromTemplate;
   const collectUploadReferencesFromPayload = webBootstrap.collectUploadReferencesFromPayload;
+  const removeUnusedUploadFiles = webBootstrap.removeUnusedUploadFiles;
   const syncPlaylistUploadsOnChange = webBootstrap.syncPlaylistUploadsOnChange;
-  const syncExistingUploadsToPlayer = webBootstrap.syncExistingUploadsToPlayer;
-  const runMediaSyncTask = webBootstrap.runMediaSyncTask;
+
+  // Background task initialization.
+  // Session and auth helpers for route registration.
   const broadcastDashboardState = webBootstrap.broadcastDashboardState;
   const sessionService = createSessionService({
-    sessionCookieName: SESSION_COOKIE_NAME,
-    sessionMaxAgeMs: SESSION_MAX_AGE_MS,
+    sessionCookieName: webConfig.sessionCookieName,
+    sessionMaxAgeMs: webConfig.sessionMaxAgeMs,
+    getConfiguredSessionMaxAgeMs: async function () {
+      const settings = await fetchAppSettings(pool);
+      return Number(settings['security.session_lifetime_days']) * 24 * 60 * 60 * 1000;
+    },
+    getConfiguredMaxActiveSessions: async function () {
+      const settings = await fetchAppSettings(pool);
+      return Number(settings['security.max_active_sessions']);
+    },
     hashSessionToken: hashSessionToken,
     createSessionToken: createSessionToken
   });
   const parseCookies = sessionService.parseCookies;
+  const createUserSession = sessionService.createUserSession;
   const clearSessionCookie = sessionService.clearSessionCookie;
   const setSessionCookie = sessionService.setSessionCookie;
+  const getSessionMaxAgeMs = sessionService.getSessionMaxAgeMs;
+  const setAuthMessageCookie = sessionService.setAuthMessageCookie;
+  const consumeAuthMessageCookie = sessionService.consumeAuthMessageCookie;
   const loadCurrentUser = sessionService.loadCurrentUser;
-  const createUserSession = sessionService.createUserSession;
   const requireAuth = sessionService.requireAuth;
-
-  backgroundTaskQueue.setTaskHandler('media-sync', function (task) {
-    return runMediaSyncTask(task && task.payload ? task.payload : task);
-  });
-
-  backgroundTaskQueue.setTaskHandler('data-source-refresh', async function (task) {
-    const payload = task && task.payload ? task.payload : {};
-    const sourceType = String(payload.sourceType || '').trim();
-    const sourceId = Number(payload.sourceId || 0);
-
-    if (sourceType === 'api-source') {
-      const apiSource = await common.fetchApiSourceById(pool, sourceId);
-      if (!apiSource) {
-        throw new Error('API source not found.');
-      }
-      return refreshApiSource(pool, common, apiSource.id, apiSource.api_url, Number(payload.actorId) || null);
-    }
-
-    if (sourceType === 'rss-feed') {
-      const rssFeed = await common.fetchRssFeedById(pool, sourceId);
-      if (!rssFeed) {
-        throw new Error('RSS feed not found.');
-      }
-      return refreshRssFeed(pool, common, rssFeed.id, rssFeed.feed_url, rssFeed.item_limit, Number(payload.actorId) || null);
-    }
-
-    throw new Error('Unsupported data source refresh task.');
-  });
-
-  app.use(express.urlencoded({ extended: true }));
-  app.use(express.json());
-  app.use('/assets', express.static(ASSET_DIR));
-  app.use('/media', express.static(MEDIA_DIR));
-
-  app.use(async function (req, _res, next) {
-    try {
-      req.currentUser = await loadCurrentUser(pool, req);
-      next();
-    } catch (error) {
-      next(error);
-    }
-  });
-
-  app.use(function (req, res, next) {
-    if (req.path === '/' || req.path === '/login' || req.path === '/logout') {
-      return next();
-    }
-
-    return requireAuth(req, res, next);
-  });
-
-  registerAuthRoutes(app, {
+  // Middleware and route registration.
+  registerMiddleware(app, {
     pool: pool,
-    pages: pages,
-    createUserSession: createUserSession,
-    setSessionCookie: setSessionCookie,
-    clearSessionCookie: clearSessionCookie,
-    parseCookies: parseCookies,
-    hashSessionToken: hashSessionToken,
-    verifyPassword: verifyPassword,
-    sessionCookieName: SESSION_COOKIE_NAME
+    loadCurrentUser: loadCurrentUser,
+    requireAuth: requireAuth,
+    MEDIA_DIR: webConfig.mediaDir,
+    UPLOADS_DIR: webConfig.uploadsDir,
+    THUMBNAILS_DIR: webConfig.thumbnailsDir,
+    ASSET_DIR: webConfig.assetDir
   });
 
-  registerAdminPagesRoutes(app, {
-    pool: pool,
-    common: common,
-    pages: pages,
-    requirePermission: requirePermission,
-    buildDashboardState: webBootstrap.buildDashboardState
-  });
-
-  registerAdminAccountRoutes(app, {
-    pool: pool,
-    common: common,
-    pages: pages,
-    formatDashboardDate: formatDashboardDate,
-    getAuditUserId: getAuditUserId,
-    verifyPassword: verifyPassword,
-    hashPassword: hashPassword,
-    createUserSession: createUserSession,
-    setSessionCookie: setSessionCookie
-  });
-
-  registerAdminUsersRoutes(app, {
-    pool: pool,
-    common: common,
-    pages: pages,
-    formatDashboardDate: formatDashboardDate,
-    getAuditUserId: getAuditUserId,
-    hashPassword: hashPassword,
-    readArrayField: readArrayField,
-    rbacData: rbacData,
-    requirePermission: requirePermission
-  });
-
-  registerAdminManageRoutes(app, {
-    pool: pool,
-    common: common,
-    pages: pages,
-    fetchOrderedPlaylistSlides: fetchOrderedPlaylistSlides,
-    fetchScreensByPlaylistId: fetchScreensByPlaylistId,
-    fetchPlaylistCanvasSignature: fetchPlaylistCanvasSignature,
-    getCanvasSignature: getCanvasSignature,
-    normalizeScheduleMode: normalizeScheduleMode,
-    parseDateTimeLocal: parseDateTimeLocal,
-    parseTimeLocal: parseTimeLocal,
-    readArrayField: readArrayField,
-    getAuditUserId: getAuditUserId,
-    redirectAfterSave: redirectAfterSave,
-    notifyPlayerScreens: notifyPlayerScreens,
-    broadcastDashboardState: broadcastDashboardState,
-    getScreenDeleteBlockMessage: playerActionService.getScreenDeleteBlockMessage,
-    getScreenConnections: playerActionService.getScreenConnections,
-    getPlaylistDeleteBlockMessage: playerActionService.getPlaylistDeleteBlockMessage,
-    forwardPlayerCommand: playerActionService.forwardPlayerCommand,
-    playerPublicBaseUrl: PLAYER_PUBLIC_BASE_URL,
-    requirePermission: requirePermission
-  });
-
-  registerAdminScreenCommandRoutes(app, {
-    pool: pool,
-    forwardPlayerCommand: playerActionService.forwardPlayerCommand,
-    getScreenConnections: playerActionService.getScreenConnections,
-    isClientNameAvailable: isClientNameAvailable,
-    withClientNameReservation: withClientNameReservation,
-    requirePermission: requirePermission
-  });
-
-  const registerAdminRbacRoutes = require('./web/routes/admin/rbac');
-  registerAdminRbacRoutes(app, {
-    pool: pool,
-    common: common,
-    pages: pages,
-    getAuditUserId: getAuditUserId,
-    rbacData: rbacData,
-    readArrayField: readArrayField,
-    permissions: require('./rbac').PERMISSIONS,
-    normalizePermissionKeys: require('./rbac').normalizePermissionKeys,
-    requirePermission: requirePermission
-  });
-
-  registerAdminContentRoutes(app, {
+  registerRoutes(app, {
     pool: pool,
     common: common,
     pages: pages,
     upload: upload,
-    uploadDir: MEDIA_DIR,
+    mediaDir: webConfig.mediaDir,
+    uploadDir: webConfig.uploadsDir,
+    createUserSession: createUserSession,
+    setSessionCookie: setSessionCookie,
+    getSessionMaxAgeMs: getSessionMaxAgeMs,
+    clearSessionCookie: clearSessionCookie,
+    setAuthMessageCookie: setAuthMessageCookie,
+    consumeAuthMessageCookie: consumeAuthMessageCookie,
+    parseCookies: parseCookies,
+    hashSessionToken: hashSessionToken,
+    verifyPassword: verifyPassword,
+    sessionCookieName: webConfig.sessionCookieName,
+    formatDashboardDate: formatDashboardDate,
+    getAuditUserId: getAuditUserId,
+    recordRequestAuditEvent: recordRequestAuditEvent,
+    hashPassword: hashPassword,
+    validatePasswordStrength: validatePasswordStrength,
+    readArrayField: readArrayField,
+    rbacData: rbacData,
+    fetchOrderedPlaylistSlides: fetchOrderedPlaylistSlides,
+    fetchScreensByPlaylistId: fetchScreensByPlaylistId,
     fetchScreensBySlideId: fetchScreensBySlideId,
     fetchScreensByTemplateId: fetchScreensByTemplateId,
-    collectUploadReferencesFromSlide: collectUploadReferencesFromSlide,
-    collectUploadReferencesFromTemplate: collectUploadReferencesFromTemplate,
-    collectUploadReferencesFromPayload: collectUploadReferencesFromPayload,
-    syncPlaylistUploadsOnChange: syncPlaylistUploadsOnChange,
-    getAuditUserId: getAuditUserId,
+    fetchPlaylistCanvasId: fetchPlaylistCanvasId,
+    getCanvasSignature: getCanvasSignature,
+    normalizeScheduleMode: normalizeScheduleMode,
+    parseDateTimeLocal: parseDateTimeLocal,
+    parseTimeLocal: parseTimeLocal,
     redirectAfterSave: redirectAfterSave,
     notifyPlayerScreens: notifyPlayerScreens,
     broadcastDashboardState: broadcastDashboardState,
-    getSlideDeleteBlockMessage: playerActionService.getSlideDeleteBlockMessage,
-    getTemplateDeleteBlockMessage: playerActionService.getTemplateDeleteBlockMessage,
-    getCanvasSizeDeleteBlockMessage: playerActionService.getCanvasSizeDeleteBlockMessage,
-    requirePermission: requirePermission
-  });
-
-  registerAdminDataSourceRoutes(app, {
-    pool: pool,
-    common: common,
-    pages: pages,
-    formatDashboardDate: formatDashboardDate,
-    getAuditUserId: getAuditUserId,
-    redirectAfterSave: redirectAfterSave,
-    fetchRssFeedItems: common.fetchRssFeedItems,
+    dataSourceTasks: dataSourceTasks,
+    playerActionService: playerActionService,
+    isClientNameAvailable: isClientNameAvailable,
+    withClientNameReservation: withClientNameReservation,
+    requirePermission: function (permissionKey, options) {
+      return createRequirePermission(permissionKey, Object.assign({ setAuthMessageCookie: setAuthMessageCookie }, options));
+    },
+    hasAnyPermission: hasAnyPermission,
     backgroundTaskQueue: backgroundTaskQueue,
-    requirePermission: requirePermission
+    uploadSyncService: webBootstrap.uploadSyncService,
+    collectUploadReferencesFromSlide: collectUploadReferencesFromSlide,
+    collectUploadReferencesFromTemplate: collectUploadReferencesFromTemplate,
+    collectUploadReferencesFromPayload: collectUploadReferencesFromPayload,
+    removeUnusedUploadFiles: removeUnusedUploadFiles,
+    syncPlaylistUploadsOnChange: syncPlaylistUploadsOnChange,
+    buildDashboardState: webBootstrap.buildDashboardState
   });
 
-  registerAdminSettingsRoutes(app, {
-    pages: pages,
-    backgroundTaskQueue: backgroundTaskQueue
-  });
-
-
-  app.use(function (req, res, next) {
-    const pathName = String(req.originalUrl || '');
-    const wantsHtml = !pathName.startsWith('/api/') && (!req.accepts || req.accepts('html'));
-
-    if (!wantsHtml) {
-      return next();
-    }
-
-    return res.status(404).send(pages.renderErrorPage({
-      statusCode: 404,
-      title: 'Not found',
-      errorTitle: 'Oops! Page not found.',
-      message: 'We could not find the page you were looking for.',
-      backUrl: req.currentUser ? '/dashboard' : '/login',
-      backLabel: req.currentUser ? 'Back to dashboard' : 'Sign in'
-    }, req.currentUser));
-  });
+  registerNotFoundHandler(app);
 
   app.use(function (error, req, res, _next) {
-    console.error(error);
     const statusCode = Number(error && (error.statusCode || error.status)) || 500;
+    if (statusCode >= 500) {
+      console.error(error);
+    } else if (statusCode >= 400 && statusCode !== 404) {
+      console.warn(error && error.message ? error.message : 'Request failed.', { statusCode: statusCode });
+    }
     const isXhr = String(req.get && req.get('X-Requested-With') || '').toLowerCase() === 'xmlhttprequest';
     const wantsHtml = !isXhr && !String(req.originalUrl || '').startsWith('/api/') && (!req.accepts || req.accepts('html'));
 
     if (wantsHtml && pages.renderErrorPage) {
       const isPermissionError = statusCode === 403;
       const message = isPermissionError
-        ? String(error && error.message ? error.message : 'You do not have permission to access this area.')
+        ? String(error && error.message ? error.message : PERMISSION_DENIED_MESSAGE)
         : String(error && error.message ? error.message : 'An unexpected error occurred.');
       const title = isPermissionError
         ? 'Access denied'
@@ -339,58 +216,26 @@ async function start() {
     res.status(statusCode).send(statusCode >= 500 ? 'Internal server error' : String(error && error.message ? error.message : 'Error'));
   });
 
-  // Ensure schema and mirror media before the web service starts handling traffic.
-  await common.ensureSchema(pool);
-  await backgroundTaskQueue.initialize();
-
-  async function syncRecurringRefreshes() {
-    const apiSourcesData = await common.fetchApiSourcesData(pool);
-    (apiSourcesData.apiSources || []).forEach(function (apiSource) {
-      backgroundTaskQueue.registerRecurringTask({
-        key: 'api-source-refresh:' + Number(apiSource.id),
-        title: 'API source refresh',
-        category: 'data-source',
-        intervalMs: normalizeIntervalMs(apiSource.update_interval_value, apiSource.update_interval_unit),
-        metadata: {
-          sourceType: 'api-source',
-          sourceId: Number(apiSource.id),
-          sourceName: apiSource.name
-        },
-        run: function () {
-          return refreshApiSource(pool, common, apiSource.id, apiSource.api_url, null);
-        }
-      });
-    });
-
-    const rssFeedsData = await common.fetchRssFeedsData(pool);
-    (rssFeedsData.rssFeeds || []).forEach(function (rssFeed) {
-      backgroundTaskQueue.registerRecurringTask({
-        key: 'rss-feed-refresh:' + Number(rssFeed.id),
-        title: 'RSS feed refresh',
-        category: 'data-source',
-        intervalMs: normalizeIntervalMs(rssFeed.update_interval_value, rssFeed.update_interval_unit),
-        metadata: {
-          sourceType: 'rss-feed',
-          sourceId: Number(rssFeed.id),
-          sourceName: rssFeed.name
-        },
-        run: function () {
-          return refreshRssFeed(pool, common, rssFeed.id, rssFeed.feed_url, rssFeed.item_limit, null);
-        }
-      });
-    });
-  }
-
-  await syncRecurringRefreshes();
-
-  fs.mkdirSync(MEDIA_DIR, { recursive: true });
-  await syncExistingUploadsToPlayer(pool, MEDIA_DIR).catch(function (error) {
-    console.warn('Unable to sync existing media to player:', error);
+  // Bootstrap and startup tasks.
+  fs.mkdirSync(webConfig.mediaDir, { recursive: true });
+  await ensureFontLibrary(webConfig.mediaDir);
+  await initializeWebServer({
+    common: common,
+    pool: pool,
+    mediaDir: webConfig.mediaDir,
+    backgroundTaskQueue: backgroundTaskQueue,
+    webBootstrap: webBootstrap,
+    notifyPlayerScreens: notifyPlayerScreens,
+    loadCurrentUser: loadCurrentUser,
+    initializeBackgroundTasks: initializeBackgroundTasks,
+    captureSlideThumbnail: captureSlideThumbnail,
+    server: server,
+    webBaseUrl: webConfig.webInternalUrl,
+    dataSourceStartupRefreshStaggerMs: webConfig.dataSourceStartupRefreshStaggerMs
   });
-  webBootstrap.installDashboardWebsocket(server, loadCurrentUser);
 
-  server.listen(PORT, function () {
-    console.log(`Pulse Signage app listening on port ${PORT}`);
+  server.listen(webConfig.port, function () {
+    console.log(`Pulse Signage app listening on port ${webConfig.port}`);
   });
 
 }

src/web/bootstrap.js

@@ -1,15 +1,17 @@
+// Web-to-player websocket bridge and dashboard state synchronizer.
+
 const { WebSocketServer, WebSocket } = require('ws');
 const { createDashboardStateService } = require('./lib/dashboard-state');
-const { createUploadSyncService } = require('./lib/upload-sync');
-const { createRequestAuthHeaders } = require('../request-auth');
+const { createUploadSyncService } = require('./lib/media');
+const { createRequestAuthHeaders } = require('#src/request-auth');
 
 function createWebBootstrap(options) {
   const pool = options && options.pool;
   const common = options && options.common;
-  const playerInternalBaseUrl = String(options && options.playerInternalBaseUrl || '').replace(/\/$/, '');
-  const playerPublicBaseUrl = String(options && options.playerPublicBaseUrl || '').replace(/\/$/, '');
+  const configuredPlayerInternalUrl = String(options && options.playerInternalBaseUrl || '').replace(/\/$/, '');
+  const configuredBridgeInternalUrl = String(options && options.bridgeInternalBaseUrl || process.env.BRIDGE_INTERNAL_URL || '').trim().replace(/\/$/, '');
   const uploadDir = String(options && options.uploadDir || '').trim();
-  const dashboardRefreshIntervalMs = Number(options && options.dashboardRefreshIntervalMs || 2000);
+  const dashboardRefreshIntervalMs = 5000;
   const formatDashboardDate = options && options.formatDashboardDate;
   const notifyPlayerScreens = options && options.notifyPlayerScreens;
   const backgroundTaskQueue = options && options.backgroundTaskQueue;
@@ -20,89 +22,97 @@ function createWebBootstrap(options) {
 
   const dashboardWs = new WebSocketServer({ noServer: true });
   const dashboardClients = new Set();
-  const playerSnapshotCache = new Map();
-  const playerSnapshotSockets = new Map();
+  const playerSnapshotCache = options && options.playerSnapshotCache ? options.playerSnapshotCache : new Map();
+  const playerSnapshotSockets = options && options.playerSnapshotSockets ? options.playerSnapshotSockets : new Map();
   let dashboardRefreshInFlight = null;
   let broadcastDashboardState = null;
-
   function getPlayerSnapshotSocketUrl(slug) {
-    const url = new URL(playerInternalBaseUrl.replace(/^http/, 'ws'));
+    const resolvedPlayerInternalBaseUrl = configuredBridgeInternalUrl || configuredPlayerInternalUrl;
+    if (!resolvedPlayerInternalBaseUrl) {
+      throw new Error('Unable to resolve the player internal base URL.');
+    }
+
+    const url = new URL(resolvedPlayerInternalBaseUrl.replace(/^http/, 'ws'));
     url.pathname = `/ws/screens/${encodeURIComponent(slug)}/events`;
     url.search = '';
     return url.toString();
   }
 
-  function storePlayerSnapshot(slug, connections) {
-    const normalizedSlug = String(slug || '').trim();
-    const normalizedConnections = Array.isArray(connections) ? connections : [];
-    playerSnapshotCache.set(normalizedSlug, {
-      slug: normalizedSlug,
-      count: normalizedConnections.length,
-      connections: normalizedConnections
-    });
-  }
-
   function clearPlayerSnapshotSocket(slug) {
     const key = String(slug || '').trim();
     playerSnapshotSockets.delete(key);
   }
 
   function ensurePlayerSnapshotSubscription(slug) {
+    if (options && typeof options.ensurePlayerSnapshotSubscription === 'function' && options.ensurePlayerSnapshotSubscription !== ensurePlayerSnapshotSubscription) {
+      return options.ensurePlayerSnapshotSubscription(slug);
+    }
+
     const key = String(slug || '').trim();
     if (!key || playerSnapshotSockets.has(key)) {
       return;
     }
 
-    const socketUrl = getPlayerSnapshotSocketUrl(key);
+    playerSnapshotSockets.set(key, null);
     const authHeaders = createRequestAuthHeaders({
       method: 'GET',
       pathname: `/ws/screens/${encodeURIComponent(key)}/events`
     });
-    const socket = new WebSocket(socketUrl, {
-      headers: authHeaders
-    });
-    playerSnapshotSockets.set(key, socket);
 
-    socket.onmessage = function (event) {
-      try {
-        const payload = JSON.parse(String(event.data || '{}'));
-        if (!payload || payload.type !== 'snapshot' || payload.slug !== key) {
-          return;
-        }
-        storePlayerSnapshot(key, payload.connections || []);
-        if (broadcastDashboardState) {
-          broadcastDashboardState().catch(function (error) {
-            console.error(error);
+    Promise.resolve(getPlayerSnapshotSocketUrl(key)).then(function (socketUrl) {
+      const socket = new WebSocket(socketUrl, {
+        headers: authHeaders
+      });
+      playerSnapshotSockets.set(key, socket);
+
+      socket.onmessage = function (event) {
+        try {
+          const payload = JSON.parse(String(event.data || '{}'));
+          if (!payload || payload.type !== 'snapshot' || payload.slug !== key) {
+            return;
+          }
+          playerSnapshotCache.set(key, {
+            slug: key,
+            count: Array.isArray(payload.connections) ? payload.connections.length : 0,
+            connections: Array.isArray(payload.connections) ? payload.connections : []
           });
+          if (broadcastDashboardState) {
+            broadcastDashboardState().catch(function (error) {
+              console.error(error);
+            });
+          }
+        } catch (_error) {
+          // Ignore malformed player snapshot payloads.
         }
-      } catch (_error) {
-        // Ignore malformed player snapshot payloads.
-      }
-    };
+      };
 
-    socket.onclose = function () {
+      socket.onclose = function () {
+        clearPlayerSnapshotSocket(key);
+        setTimeout(function () {
+          ensurePlayerSnapshotSubscription(key);
+        }, 2000);
+      };
+
+      socket.onerror = function () {
+        try {
+          socket.close();
+        } catch (_error) {
+          // ignore close errors
+        }
+      };
+    }).catch(function (error) {
       clearPlayerSnapshotSocket(key);
-      setTimeout(function () {
-        ensurePlayerSnapshotSubscription(key);
-      }, 2000);
-    };
-
-    socket.onerror = function () {
-      try {
-        socket.close();
-      } catch (_error) {
-        // ignore close errors
-      }
-    };
+      console.error(error);
+    });
   }
 
   const dashboardStateService = createDashboardStateService({
     pool: pool,
     common: common,
+    thinClientBaseUrl: configuredBridgeInternalUrl,
     playerSnapshotCache: playerSnapshotCache,
     playerSnapshotSockets: playerSnapshotSockets,
     ensurePlayerSnapshotSubscription: ensurePlayerSnapshotSubscription,
-    playerPublicBaseUrl: playerPublicBaseUrl,
     formatDashboardDate: formatDashboardDate
   });
   const buildDashboardState = dashboardStateService.buildDashboardState;
@@ -110,7 +120,7 @@ function createWebBootstrap(options) {
   const uploadSyncService = createUploadSyncService({
     pool: pool,
     common: common,
-    playerInternalBaseUrl: playerInternalBaseUrl,
+    playerInternalBaseUrl: configuredPlayerInternalUrl,
     playerSnapshotCache: playerSnapshotCache,
     notifyPlayerScreens: notifyPlayerScreens,
     backgroundTaskQueue: backgroundTaskQueue
@@ -120,15 +130,48 @@ function createWebBootstrap(options) {
   const collectUploadReferencesFromSlide = uploadSyncService.collectUploadReferencesFromSlide;
   const collectUploadReferencesFromTemplate = uploadSyncService.collectUploadReferencesFromTemplate;
   const collectUploadReferencesFromPayload = uploadSyncService.collectUploadReferencesFromPayload;
+  const removeUnusedUploadFiles = uploadSyncService.removeUnusedUploadFiles;
+  const collectUploadPathsFromDirectory = uploadSyncService.collectUploadPathsFromDirectory;
   const syncPlaylistUploadsOnChange = uploadSyncService.syncPlaylistUploadsOnChange;
-  const syncExistingUploadsToPlayer = uploadSyncService.syncExistingUploadsToPlayer;
   const runMediaSyncTask = uploadSyncService.runMediaSyncTask;
+  let lastDashboardState = null;
+
+  function getFallbackDashboardState() {
+    return lastDashboardState || {
+      playlists: [],
+      screens: [],
+      clients: [],
+      kioskPlayers: [],
+      slides: [],
+      playerServiceConnected: false,
+      connectedPlayersCount: 0,
+      connectedClientsCount: 0
+    };
+  }
+
+  async function resolveDashboardState() {
+    try {
+      const state = await buildDashboardState();
+      lastDashboardState = state;
+      return state;
+    } catch (error) {
+      if (lastDashboardState) {
+        console.error(error);
+        return lastDashboardState;
+      }
+
+      throw error;
+    }
+  }
 
   async function sendDashboardStateToSocket(socket) {
     if (!socket || socket.readyState !== WebSocket.OPEN) {
       return;
     }
-    const state = await buildDashboardState();
+    const state = await resolveDashboardState().catch(function (error) {
+      console.error(error);
+      return getFallbackDashboardState();
+    });
     socket.send(JSON.stringify({ type: 'dashboard-state', state: state }));
   }
 
@@ -138,7 +181,10 @@ function createWebBootstrap(options) {
     }
 
     dashboardRefreshInFlight = (async function () {
-      const state = await buildDashboardState();
+      const state = await resolveDashboardState().catch(function (error) {
+        console.error(error);
+        return getFallbackDashboardState();
+      });
       const payload = JSON.stringify({ type: 'dashboard-state', state: state });
       for (const socket of dashboardClients) {
         if (socket && socket.readyState === WebSocket.OPEN) {
@@ -206,12 +252,15 @@ function createWebBootstrap(options) {
 
   return {
     upload: upload,
+    uploadSyncService: uploadSyncService,
+    playerInternalBaseUrl: configuredPlayerInternalUrl || null,
     buildDashboardState: buildDashboardState,
     collectUploadReferencesFromSlide: collectUploadReferencesFromSlide,
     collectUploadReferencesFromTemplate: collectUploadReferencesFromTemplate,
     collectUploadReferencesFromPayload: collectUploadReferencesFromPayload,
+    removeUnusedUploadFiles: removeUnusedUploadFiles,
+    collectUploadPathsFromDirectory: collectUploadPathsFromDirectory,
     syncPlaylistUploadsOnChange: syncPlaylistUploadsOnChange,
-    syncExistingUploadsToPlayer: syncExistingUploadsToPlayer,
     runMediaSyncTask: runMediaSyncTask,
     broadcastDashboardState: broadcastDashboardState,
     installDashboardWebsocket: installDashboardWebsocket

src/web/handlebars.js

@@ -0,0 +1,204 @@
+const fs = require('fs');
+const path = require('path');
+
+// General-purpose helpers used across the admin UI.
+function registerGeneralHelpers(Handlebars) {
+  Handlebars.registerHelper('eq', function (left, right) {
+    return left === right;
+  });
+
+  Handlebars.registerHelper('gt', function (left, right) {
+    return left > right;
+  });
+
+  Handlebars.registerHelper('lt', function (left, right) {
+    return left < right;
+  });
+
+  Handlebars.registerHelper('json', function (value) {
+    return new Handlebars.SafeString(JSON.stringify(value).replace(/</g, '\\u003c'));
+  });
+
+  Handlebars.registerHelper('truncateText', function (value, maxLength) {
+    const text = String(value || '').trim();
+    const limit = Number(maxLength);
+    if (!text || !Number.isFinite(limit) || limit <= 0 || text.length <= limit) {
+      return text;
+    }
+
+    return `${text.slice(0, Math.max(0, limit - 1)).trimEnd()}…`;
+  });
+
+  Handlebars.registerHelper('textLengthAttrs', function (maxLength) {
+    const limit = Number(maxLength);
+    if (!Number.isFinite(limit) || limit < 1) {
+      return '';
+    }
+
+    return new Handlebars.SafeString(`maxlength="${Handlebars.escapeExpression(String(Math.floor(limit)))}" data-limit-text-length`);
+  });
+}
+
+// URL helpers for generating links and external URL checks.
+function registerUrlHelpers(Handlebars) {
+
+  Handlebars.registerHelper('isExternalUrl', function (value) {
+    return /^https?:\/\//i.test(String(value || ''));
+  });
+
+  Handlebars.registerHelper('assetHref', function (value) {
+    const href = String(value || '').trim();
+    if (!href) {
+      return '';
+    }
+    if (/^https?:\/\//i.test(href) || href.startsWith('/')) {
+      return href;
+    }
+    return `/assets/${href}`;
+  });
+
+  Handlebars.registerHelper('playerUrl', function (slug) {
+    const base = String(arguments[1] || '').trim().replace(/\/$/, '');
+    if (!base) {
+      return '';
+    }
+
+    return `${base}/screen/${encodeURIComponent(slug)}`;
+  });
+}
+
+// Permission helpers delegate to the RBAC layer.
+function registerPermissionHelpers(Handlebars, deps) {
+  const hasPermission = deps && deps.hasPermission;
+  const hasAnyPermission = deps && deps.hasAnyPermission;
+
+  Handlebars.registerHelper('hasPermission', function (currentUser, permissionKey) {
+    return hasPermission(currentUser, permissionKey);
+  });
+
+  Handlebars.registerHelper('anyPermission', function (currentUser) {
+    const args = Array.prototype.slice.call(arguments, 1);
+    args.pop();
+    return hasAnyPermission(currentUser, args);
+  });
+}
+
+function registerUserHelpers(Handlebars) {
+  Handlebars.registerHelper('userInitial', function (name) {
+    const text = String(name || '').trim();
+    return text ? text.charAt(0).toUpperCase() : 'A';
+  });
+}
+
+// Action button helpers keep form submit controls consistent.
+function registerActionHelpers(Handlebars) {
+  Handlebars.registerHelper('saveActionButtons', function (options) {
+    const hash = options && options.hash ? options.hash : {};
+    const formId = String(hash.formId || '').trim();
+
+    const save = {
+      label: String(hash.saveLabel || 'Save'),
+      className: String(hash.saveButtonClass || 'btn btn-success'),
+      actionName: String(hash.saveActionName || 'save_action'),
+      actionValue: String(hash.saveActionValue || 'save'),
+      closeLabel: String(hash.saveAndCloseLabel || 'Save and Close'),
+      closeValue: String(hash.saveAndCloseValue || 'close'),
+      newLabel: String(hash.saveAndNewLabel || 'Save and New'),
+      newValue: String(hash.saveAndNewValue || 'new')
+    };
+
+    const showSaveAndClose = hash.showSaveAndClose === undefined ? true : String(hash.showSaveAndClose).toLowerCase() !== 'false';
+    const showSaveAndNew = hash.showSaveAndNew === undefined ? true : String(hash.showSaveAndNew).toLowerCase() !== 'false';
+    const showDelete = hash.showDelete === undefined ? true : String(hash.showDelete).toLowerCase() !== 'false';
+    const hasSecondaryActions = showSaveAndClose || showSaveAndNew;
+    const ariaLabel = String(hash.ariaLabel || 'Save actions');
+    const saveUrl = String(hash.saveUrl || '').trim();
+
+    const cancel = {
+      label: String(hash.cancelLabel || 'Cancel'),
+      className: String(hash.cancelClass || 'btn btn-warning'),
+      url: String(hash.cancelUrl || '').trim(),
+      confirmMessage: String(hash.cancelConfirmMessage || hash.cancelConfirm || 'You have unsaved changes. Leave this page?')
+    };
+
+    const deleteAction = {
+      label: String(hash.deleteLabel || 'Delete'),
+      className: String(hash.deleteClass || 'btn btn-danger'),
+      url: String(hash.deleteUrl || '').trim(),
+      formId: String(hash.deleteFormId || '').trim(),
+      confirmMessage: String(hash.deleteConfirmMessage || '').trim(),
+      disabled: hash.deleteDisabled === undefined ? false : String(hash.deleteDisabled).toLowerCase() !== 'false',
+      title: String(hash.deleteTitle || '')
+    };
+
+    const resolvedDeleteUrl = deleteAction.url || (!deleteAction.disabled && saveUrl ? saveUrl.replace(/\/+$/, '') + '/delete' : '');
+    const resolvedDeleteFormId = deleteAction.formId || '';
+
+    if (!formId) {
+      return '';
+    }
+
+    const escape = Handlebars.escapeExpression;
+    const formAttr = ` form="${escape(formId)}"`;
+
+    const parts = [
+      '<div class="btn-group save-action-group" role="group">',
+      `<button type="submit" class="${escape(save.className)}"${formAttr} name="${escape(save.actionName)}" value="${escape(save.actionValue)}">${escape(save.label)}</button>`,
+      hasSecondaryActions ? `<button type="button" class="btn btn-success dropdown-toggle dropdown-toggle-split rounded-0" data-bs-toggle="dropdown" aria-expanded="false"><span class="visually-hidden">${escape(ariaLabel)}</span></button>` : '',
+      hasSecondaryActions ? '<div class="dropdown-menu dropdown-menu-end">' : '',
+      hasSecondaryActions && showSaveAndClose ? `<button type="submit" class="dropdown-item"${formAttr} name="${escape(save.actionName)}" value="${escape(save.closeValue)}">${escape(save.closeLabel)}</button>` : '',
+      hasSecondaryActions && showSaveAndNew ? `<button type="submit" class="dropdown-item"${formAttr} name="${escape(save.actionName)}" value="${escape(save.newValue)}">${escape(save.newLabel)}</button>` : '',
+      hasSecondaryActions ? '</div>' : '',
+    ];
+
+    if (cancel.url) {
+      parts.push(`<a class="${escape(cancel.className)}" href="${escape(cancel.url)}" data-confirm-unsaved="${escape(cancel.confirmMessage)}">${escape(cancel.label)}</a>`);
+    }
+
+    if (showDelete && (deleteAction.disabled || resolvedDeleteUrl)) {
+      const deleteActionAttr = resolvedDeleteUrl && !resolvedDeleteFormId ? ` data-delete-action-url="${escape(resolvedDeleteUrl)}"` : '';
+      const deleteFormAttr = resolvedDeleteFormId ? ` form="${escape(resolvedDeleteFormId)}"` : '';
+      const confirmAttr = deleteAction.confirmMessage ? ` data-confirm-message="${escape(deleteAction.confirmMessage)}"` : '';
+      const titleAttr = deleteAction.disabled && deleteAction.title ? ` title="${escape(deleteAction.title)}"` : '';
+      parts.push(`<button type="${resolvedDeleteFormId ? 'submit' : 'button'}" class="${escape(deleteAction.className)}"${deleteFormAttr}${deleteActionAttr}${confirmAttr}${deleteAction.disabled ? ' disabled' : ''}${titleAttr}>${escape(deleteAction.label)}</button>`);
+    }
+
+    parts.push('</div>');
+
+    return new Handlebars.SafeString(parts.join(''));
+  });
+}
+
+// Shared partials are registered once at startup.
+function registerPartials(Handlebars, viewsRoot) {
+  Handlebars.registerPartial('modal-shell', fs.readFileSync(path.join(viewsRoot, 'shared', 'modal-shell.hbs'), 'utf8'));
+  Handlebars.registerPartial('table-pagination', fs.readFileSync(path.join(viewsRoot, 'shared', 'table', 'table-pagination.hbs'), 'utf8'));
+  Handlebars.registerPartial('playlists/form', fs.readFileSync(path.join(viewsRoot, 'signage', 'playlists', 'form.hbs'), 'utf8'));
+  Handlebars.registerPartial('signage/playlists/slide-row', fs.readFileSync(path.join(viewsRoot, 'signage', 'playlists', 'slide-row.hbs'), 'utf8'));
+  Handlebars.registerPartial('signage/playlists/schedule-rule-card', fs.readFileSync(path.join(viewsRoot, 'signage', 'playlists', 'schedule-rule-card.hbs'), 'utf8'));
+  Handlebars.registerPartial('signage/templates/animation-advanced-modal', fs.readFileSync(path.join(viewsRoot, 'signage', 'templates', 'animation-advanced-modal.hbs'), 'utf8'));
+  Handlebars.registerPartial('data-sources/api-sources/form', fs.readFileSync(path.join(viewsRoot, 'data-sources', 'api-sources', 'form.hbs'), 'utf8'));
+  Handlebars.registerPartial('data-sources/rss-feeds/form', fs.readFileSync(path.join(viewsRoot, 'data-sources', 'rss-feeds', 'form.hbs'), 'utf8'));
+}
+
+// One entry point keeps Handlebars bootstrap centralized.
+function registerHandlebars(Handlebars, deps) {
+  const viewsRoot = String(deps && deps.viewsRoot || '').trim();
+  const hasPermission = deps && deps.hasPermission;
+  const hasAnyPermission = deps && deps.hasAnyPermission;
+
+  if (!Handlebars || !viewsRoot || typeof hasPermission !== 'function' || typeof hasAnyPermission !== 'function') {
+    throw new Error('registerHandlebars requires Handlebars, viewsRoot, hasPermission, and hasAnyPermission.');
+  }
+
+  registerGeneralHelpers(Handlebars);
+  registerUrlHelpers(Handlebars);
+  registerPermissionHelpers(Handlebars, { hasPermission: hasPermission, hasAnyPermission: hasAnyPermission });
+  registerUserHelpers(Handlebars);
+  registerActionHelpers(Handlebars);
+  registerPartials(Handlebars, viewsRoot);
+}
+
+module.exports = {
+  registerHandlebars: registerHandlebars
+};

src/web/lib/auth/index.js

@@ -0,0 +1,6 @@
+// Entry point for the web auth helper modules.
+
+module.exports = {
+  createSessionService: require('./session').createSessionService,
+  rbacData: require('./rbac-data')
+};