From c3299abaac24fcb63eb5058b44ace3281e975837 Mon Sep 17 00:00:00 2001 From: Mark Rapson Date: Sun, 11 Oct 2026 18:54:43 +0100 Subject: [PATCH] Release v2.14.1 --- CHANGELOG.md | 44 ++ build/package.player.json | 6 +- build/package.web.json | 6 +- package-lock.json | 23 +- package.json | 7 +- src/common.js | 27 +- src/data/admin.js | 2 +- src/data/announcements.js | 6 +- src/data/api-sources.js | 2 +- src/data/app-settings.js | 2 +- src/data/audit-log.js | 2 +- src/data/canvas-sizes.js | 2 +- src/data/index.js | 28 +- src/data/player-registry.js | 33 ++ src/data/rss-feeds.js | 2 +- src/data/slides.js | 65 ++- src/data/templates.js | 7 +- src/data/timetables.js | 2 +- src/data/weather.js | 4 +- src/db/index.js | 2 +- src/player-bridge/connection-state.js | 191 ++++++++ src/player-bridge/index.js | 182 +------- src/player.js | 20 +- src/player/onboarding/index.js | 2 +- src/player/player-page-announcements.js | 17 +- src/player/player-page.script.html | 8 +- src/player/playlist.js | 47 +- .../js/player-announcement-templates.js | 10 +- src/player/public/js/player-page-commands.js | 166 +------ src/player/public/js/player-page-media.js | 75 +++- src/player/public/js/player-page-playback.js | 87 ++-- src/player/public/js/player-page-playlist.js | 202 +++++++++ src/player/public/js/player-page-rendering.js | 344 ++------------- .../public/js/player-page-transition.js | 189 +++++++- .../public/js/player-region-registry.js | 37 +- src/player/public/sw.js | 31 +- src/player/regions/api.js | 22 +- src/player/regions/chart.js | 55 +++ src/player/regions/html.js | 37 +- src/player/regions/image.js | 2 +- src/player/regions/rss.js | 22 +- src/player/regions/text.js | 22 +- src/player/regions/video.js | 6 +- src/player/regions/webpage.js | 28 +- src/player/render-helpers.js | 361 +-------------- src/player/render.js | 28 +- src/player/rendering-shared.js | 376 ++++++++++++++++ src/player/routes.js | 12 +- src/web.js | 12 +- src/web/bootstrap.js | 4 +- src/web/lib/auth/index.js | 6 +- .../tasks-adhoc/data-source-refresh.js | 2 +- .../tasks-scheduled/data-source-refresh.js | 4 +- .../tasks-scheduled/font-sweep.js | 2 +- .../tasks-scheduled/player-control-sync.js | 2 +- .../tasks-startup/data-source-refresh.js | 4 +- .../tasks-startup/font-sync.js | 13 +- .../tasks-startup/media-sync.js | 12 +- src/web/lib/dashboard-state.js | 11 +- src/web/lib/media/index.js | 6 +- src/web/lib/media/library.js | 124 ++++++ src/web/lib/media/slide-thumbnail-preview.js | 5 + src/web/lib/media/upload-sync.js | 130 +++--- src/web/lib/player-actions.js | 41 +- src/web/lib/region-scripts.js | 2 +- src/web/pages/index.js | 2 +- src/web/public/css/theme-custom.css | 6 - src/web/public/js/media-picker.js | 138 ++++++ src/web/public/js/regions/chart-data.js | 257 +++++++++++ src/web/public/js/regions/type/chart.js | 271 ++++++++++++ src/web/public/js/settings/media-library.js | 22 +- src/web/public/js/shared/upload-utils.js | 21 + src/web/public/js/slides/slide-form-editor.js | 2 +- .../public/js/slides/slide-form-regions.js | 16 +- src/web/public/js/slides/slide-form.js | 21 +- .../public/js/templates/template-designer.js | 3 + src/web/public/vendor/chart.js/chart.umd.js | 14 + src/web/routes/account/password.js | 2 +- src/web/routes/admin/client-commands.js | 24 +- src/web/routes/admin/content.js | 106 ++++- src/web/routes/admin/manage.js | 13 +- src/web/routes/admin/pages.js | 14 +- src/web/routes/admin/rbac.js | 4 +- src/web/routes/admin/users.js | 4 +- src/web/routes/auth/accept-invite.js | 2 +- .../routes/auth/email-verification-error.js | 2 +- src/web/routes/auth/email-verified.js | 2 +- src/web/routes/auth/forgot-password.js | 2 +- src/web/routes/auth/index.js | 2 +- src/web/routes/auth/login.js | 2 +- src/web/routes/auth/reset-password.js | 2 +- .../routes/data-sources/api-sources/add.js | 4 +- .../routes/data-sources/api-sources/edit.js | 4 +- .../routes/data-sources/api-sources/list.js | 2 +- .../routes/data-sources/api-sources/routes.js | 10 +- src/web/routes/data-sources/rss-feeds/add.js | 4 +- src/web/routes/data-sources/rss-feeds/edit.js | 4 +- src/web/routes/data-sources/rss-feeds/list.js | 2 +- .../routes/data-sources/rss-feeds/routes.js | 10 +- src/web/routes/data-sources/timetables/add.js | 4 +- .../routes/data-sources/timetables/edit.js | 4 +- .../routes/data-sources/timetables/list.js | 2 +- .../routes/data-sources/timetables/routes.js | 10 +- src/web/routes/data-sources/weather.js | 14 +- src/web/routes/data-sources/weather/add.js | 4 +- src/web/routes/data-sources/weather/edit.js | 4 +- .../data-sources/weather/form-view-model.js | 2 +- src/web/routes/data-sources/weather/list.js | 2 +- src/web/routes/internal/sync.js | 2 +- src/web/routes/onboarding.js | 2 +- src/web/routes/register.js | 48 +- src/web/routes/settings/about/index.js | 2 +- src/web/routes/settings/fonts.js | 4 +- src/web/routes/settings/fonts/list.js | 2 +- src/web/routes/settings/index.js | 2 +- src/web/routes/settings/invitations/list.js | 2 +- src/web/routes/settings/media-library.js | 2 + src/web/routes/settings/media-library/list.js | 2 +- src/web/routes/settings/rbac/add.js | 4 +- src/web/routes/settings/rbac/edit.js | 4 +- src/web/routes/settings/rbac/list.js | 2 +- src/web/routes/settings/users/add.js | 4 +- src/web/routes/settings/users/edit.js | 4 +- src/web/routes/settings/users/invite.js | 2 +- src/web/routes/settings/users/list.js | 2 +- src/web/routes/signage/announcements/add.js | 4 +- src/web/routes/signage/announcements/edit.js | 4 +- src/web/routes/signage/announcements/list.js | 2 +- .../routes/signage/announcements/routes.js | 4 +- src/web/routes/signage/canvas-sizes/add.js | 4 +- src/web/routes/signage/canvas-sizes/edit.js | 4 +- .../signage/canvas-sizes/form-view-model.js | 2 +- src/web/routes/signage/canvas-sizes/list.js | 2 +- src/web/routes/signage/canvas-sizes/routes.js | 2 +- src/web/routes/signage/clients/list.js | 2 +- src/web/routes/signage/clients/routes.js | 4 +- src/web/routes/signage/dashboard/index.js | 2 +- src/web/routes/signage/playlists/add.js | 4 +- src/web/routes/signage/playlists/edit.js | 2 +- src/web/routes/signage/playlists/form-page.js | 4 +- src/web/routes/signage/playlists/list.js | 2 +- src/web/routes/signage/playlists/routes.js | 4 +- .../routes/signage/playlists/slide-config.js | 2 +- src/web/routes/signage/screens/add.js | 4 +- src/web/routes/signage/screens/edit.js | 4 +- src/web/routes/signage/screens/list.js | 2 +- src/web/routes/signage/screens/routes.js | 2 +- src/web/routes/signage/slides/add.js | 4 +- src/web/routes/signage/slides/edit.js | 4 +- .../routes/signage/slides/form-view-model.js | 2 +- src/web/routes/signage/slides/list.js | 2 +- src/web/routes/signage/slides/routes.js | 5 +- src/web/routes/signage/templates/add.js | 8 +- src/web/routes/signage/templates/edit.js | 8 +- .../signage/templates/form-view-model.js | 7 +- src/web/routes/signage/templates/list.js | 2 +- src/web/routes/signage/templates/routes.js | 2 +- src/web/view.js | 6 +- src/web/views/settings/media-library/list.hbs | 1 + src/web/views/signage/slides/form.hbs | 1 + .../views/signage/slides/popup-preview.hbs | 40 ++ src/web/views/signage/templates/form.hbs | 3 +- test/chart-data.test.js | 215 +++++++++ test/media-library.test.js | 52 +++ test/player-announcement-marquee.test.js | 83 +++- test/player-bridge-state.test.js | 28 ++ test/player-markup-preload.test.js | 2 + test/player-page-commands-performance.test.js | 270 ++++++++++-- test/player-page-playback.test.js | 417 +++++++++++++++++- test/player-preload-helpers.test.js | 203 +++++++++ test/player-render-helpers.test.js | 207 ++++++++- test/player-service-worker.test.js | 161 +++++++ test/player-time-date-region.test.js | 2 + test/slide-form-editor.test.js | 8 + 174 files changed, 4483 insertions(+), 1687 deletions(-) create mode 100644 src/player-bridge/connection-state.js create mode 100644 src/player/regions/chart.js create mode 100644 src/player/rendering-shared.js create mode 100644 src/web/public/js/regions/chart-data.js create mode 100644 src/web/public/js/regions/type/chart.js create mode 100644 src/web/public/js/shared/upload-utils.js create mode 100644 src/web/public/vendor/chart.js/chart.umd.js create mode 100644 test/chart-data.test.js create mode 100644 test/player-bridge-state.test.js create mode 100644 test/player-service-worker.test.js diff --git a/CHANGELOG.md b/CHANGELOG.md index 895c21b..e335a34 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,50 @@ All notable changes to this project will be documented in this file. +## 2.14.1 - 2026-10-11 + +### Added + +- Added a configurable text size for chart axis labels, legends, and tooltips. + +### Changed + +- Standardized first-party Node.js imports on native `#src` and `#root` package aliases across the application and player/web bundle manifests, removing the process-wide resolver shim. +- Extracted player bridge socket and screen-snapshot state into a dedicated module. +- Consolidated player rich-text rendering, slide normalization, and media helpers so server and browser paths share implementations. +- Warmed the next slide's video element and promoted that same element when the slide becomes active, avoiding a duplicate video request. +- Deferred playlist updates until the current slide reaches its next transition, including forced refresh notifications. +- Limited announcement polling to WebSocket fallback and coalesced duplicate playlist refresh requests. +- Added content fingerprints to player runtime script URLs and refreshed those scripts network-first while retaining offline cache fallback. + +### Fixed + +- Restored missing player rendering helpers used by template slides, including animation decoration, media-source selection, and canvas sizing. +- Avoided a redundant playlist fetch on reload when cached playlist metadata is missing source data. +- Kept player reloads on the current screen when a reconnect encounters a transient client-ID conflict. +- Preserved safe video startup, pause, and resume behavior while applying queued playlist changes. + +## 2.14.0 - 2026-10-03 + +### Added + +- Added configurable chart data sources, multi-series line charts, chart type and source options, value ordering, grid line colors, and text colors across editor, popout preview, and player rendering. +- Added player playlist and playback recovery for cached snapshots, offline states, stalled media, failed image/video loads, and service-worker cache failures. +- Added deterministic image derivatives for large uploads while preserving the original file and preventing generated variants from exceeding the original dimensions or file size. +- Added immediate template background uploads with shared media validation, variant generation, cleanup of abandoned uploads, and permission checks. + +### Changed + +- Improved player handling of large images and videos across mixed-resolution deployments, including 8K displays. +- Hardened player render cancellation, preload cleanup, offline playlist options, and service-worker cache retention, and consolidated slide timing in the transition module. +- Separated player command handling from DOM transitions and region lifecycle dispatch. +- Cancelled obsolete video starts and readiness listeners during teardown, preserved outgoing video frames through crossfades, and guarded interrupted transitions against stale callbacks. +- Kept playlist refreshes from restarting active or paused slide timers and made service-worker cache writes best-effort so storage failures do not discard successful network responses. +- Updated upload validation to reject oversized files immediately and include the active configured limit in warning messages. +- Centralized shared browser upload formatting and notification helpers used by the media library, slide editor, and template editor. +- Removed the obsolete image-dimension setting and aligned media upload behavior across slides, templates, and the Media Library. +- Updated template background previews to reflect server-accepted uploads only, with failed and abandoned uploads cleaned up through the shared flow. + ## 2.13.3 - 2026-09-13 ### Fixed diff --git a/build/package.player.json b/build/package.player.json index c3d5beb..cee110d 100644 --- a/build/package.player.json +++ b/build/package.player.json @@ -1,12 +1,16 @@ { "name": "pulse-signage-player", - "version": "2.13.3", + "version": "2.14.1", "private": false, "description": "Pulse Signage player application bundle", "engines": { "node": ">=26.0.0" }, "main": "src/common.js", + "imports": { + "#src/*": "./src/*.js", + "#root/*": "./*" + }, "scripts": { "start": "node -r dotenv/config src/player.js", "start:player": "node -r dotenv/config src/player.js" diff --git a/build/package.web.json b/build/package.web.json index f3b1fde..0130e5c 100644 --- a/build/package.web.json +++ b/build/package.web.json @@ -1,12 +1,16 @@ { "name": "pulse-signage-web", - "version": "2.13.3", + "version": "2.14.1", "private": false, "description": "Pulse Signage web and bridge application bundle", "engines": { "node": ">=26.0.0" }, "main": "src/common.js", + "imports": { + "#src/*": "./src/*.js", + "#root/*": "./*" + }, "scripts": { "start": "node -r dotenv/config src/web.js", "start:web": "node -r dotenv/config src/web.js" diff --git a/package-lock.json b/package-lock.json index c2305ba..1094af5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,16 +1,17 @@ { "name": "pulse-signage", - "version": "2.13.3", + "version": "2.14.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "pulse-signage", - "version": "2.13.3", + "version": "2.14.1", "dependencies": { "@sparticuz/chromium": "^149.0.0", "animate.css": "^4.1.1", "bootstrap-icons": "1.13.1", + "chart.js": "^4.5.1", "cropperjs": "^1.6.2", "dotenv": "^17.4.2", "express": "^5.2.1", @@ -589,6 +590,12 @@ "url": "https://opencollective.com/libvips" } }, + "node_modules/@kurkle/color": { + "version": "0.3.4", + "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.4.tgz", + "integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==", + "license": "MIT" + }, "node_modules/@puppeteer/browsers": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-3.2.0.tgz", @@ -1043,6 +1050,18 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/chart.js": { + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.5.1.tgz", + "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==", + "license": "MIT", + "dependencies": { + "@kurkle/color": "^0.3.0" + }, + "engines": { + "pnpm": ">=8" + } + }, "node_modules/chokidar": { "version": "3.6.0", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", diff --git a/package.json b/package.json index e414858..ce98c55 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pulse-signage", - "version": "2.13.3", + "version": "2.14.1", "private": false, "description": "Pulse Signage application with MySQL and media storage", "engines": { @@ -11,6 +11,10 @@ "url": "https://git.lzstealth.com/LZStealth/pulse-signage.git" }, "main": "src/common.js", + "imports": { + "#src/*": "./src/*.js", + "#root/*": "./*" + }, "scripts": { "start": "node -r dotenv/config src/web.js", "start:web": "node -r dotenv/config src/web.js", @@ -23,6 +27,7 @@ "@sparticuz/chromium": "^149.0.0", "animate.css": "^4.1.1", "bootstrap-icons": "1.13.1", + "chart.js": "^4.5.1", "cropperjs": "^1.6.2", "dotenv": "^17.4.2", "express": "^5.2.1", diff --git a/src/common.js b/src/common.js index 4075c17..9f5854a 100644 --- a/src/common.js +++ b/src/common.js @@ -1,30 +1,7 @@ -// 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 db = require('#src/db/index'); const dbBootstrap = require('#src/db/bootstrap'); -const data = require('#src/data'); +const data = require('#src/data/index'); const player = require('#src/player/render'); const listQuery = require('#src/web/lib/list-query'); const { fetchPlaylistCanvasId } = require('#src/web/lib/helpers'); diff --git a/src/data/admin.js b/src/data/admin.js index 4ec6cfd..4853cad 100644 --- a/src/data/admin.js +++ b/src/data/admin.js @@ -1,6 +1,6 @@ // Admin data aggregation helpers for dashboards, playlists, slides, templates, and screens. -const { fetchPagedRows } = require('./utils'); +const { fetchPagedRows } = require('#src/data/utils'); async function fetchAdminData(pool) { 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'); diff --git a/src/data/announcements.js b/src/data/announcements.js index b625eee..2ba2e57 100644 --- a/src/data/announcements.js +++ b/src/data/announcements.js @@ -1,12 +1,12 @@ // Announcement data access helpers. -const { fetchPagedRows } = require('./utils'); +const { fetchPagedRows } = require('#src/data/utils'); const { ANNOUNCEMENT_ICON_KEYS, DEFAULT_ANNOUNCEMENT_ICON, normalizeAnnouncementIcon: normalizeAnnouncementIconFromConfig -} = require('./announcement-icons'); -const { validateMaxLength } = require('./utils'); +} = require('#src/data/announcement-icons'); +const { validateMaxLength } = require('#src/data/utils'); const SHORT_LABEL_MAX_LENGTH = 255; diff --git a/src/data/api-sources.js b/src/data/api-sources.js index c7991f2..89cec0f 100644 --- a/src/data/api-sources.js +++ b/src/data/api-sources.js @@ -2,7 +2,7 @@ const http = require('http'); const https = require('https'); -const { fetchPagedRows, validateMaxLength } = require('./utils'); +const { fetchPagedRows, validateMaxLength } = require('#src/data/utils'); const NAME_MAX_LENGTH = 255; const URL_MAX_LENGTH = 1024; diff --git a/src/data/app-settings.js b/src/data/app-settings.js index d696745..f0d1620 100644 --- a/src/data/app-settings.js +++ b/src/data/app-settings.js @@ -1,6 +1,6 @@ // Application-wide settings defaults and persistence helpers. -const { DEFAULT_ANNOUNCEMENT_ICON_KEYS } = require('./announcement-icons'); +const { DEFAULT_ANNOUNCEMENT_ICON_KEYS } = require('#src/data/announcement-icons'); const SETTING_DEFINITIONS = [ { key: 'app.name', type: 'string', defaultValue: 'Pulse Signage' }, diff --git a/src/data/audit-log.js b/src/data/audit-log.js index d132c02..4c16134 100644 --- a/src/data/audit-log.js +++ b/src/data/audit-log.js @@ -48,7 +48,7 @@ const SCREEN_CONTROL_COMMAND_LABELS = Object.freeze({ moveclient: 'Move client', setclientname: 'Rename client' }); -const { fetchAppSettings } = require('./app-settings'); +const { fetchAppSettings } = require('#src/data/app-settings'); function formatUserAgentLabel(userAgent) { const value = String(userAgent || '').trim(); diff --git a/src/data/canvas-sizes.js b/src/data/canvas-sizes.js index 2e9ae01..636fa7c 100644 --- a/src/data/canvas-sizes.js +++ b/src/data/canvas-sizes.js @@ -1,6 +1,6 @@ // Canvas size data access and pagination helpers. -const { fetchPagedRows } = require('./utils'); +const { fetchPagedRows } = require('#src/data/utils'); const MAX_CANVAS_SIZE_DIMENSION = 16384; async function fetchCanvasSizesData(pool) { diff --git a/src/data/index.js b/src/data/index.js index 0bedcfe..4afba27 100644 --- a/src/data/index.js +++ b/src/data/index.js @@ -1,19 +1,19 @@ // 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 { 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 { fetchWeatherLocationsData, fetchWeatherLocationsPage, fetchWeatherLocationById, fetchWeatherLocationSuggestions, fetchWeatherLocationForecast, buildWeatherLocationPayload } = require('./weather'); -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, MAX_CANVAS_SIZE_DIMENSION } = require('./canvas-sizes'); -const { fetchSlideById, buildSlidePayload } = require('./slides'); -const { parseJsonSafe, fetchDuplicateName, validateMaxLength, truncateToMaxLength } = require('./utils'); +const { fetchAdminData, fetchPlaylistsPage, fetchSlidesPage, fetchTemplatesPage, fetchCanvasSizesPage, fetchScreensPage } = require('#src/data/admin'); +const { ANNOUNCEMENT_TYPES, ANNOUNCEMENT_COLORS, ANNOUNCEMENT_ICONS, DEFAULT_ANNOUNCEMENT_ICON, normalizeAnnouncementType, normalizeAnnouncementColor, normalizeAnnouncementIcon, fetchAnnouncementsPage, fetchAnnouncementById, fetchActiveAnnouncement, buildAnnouncementPayload } = require('#src/data/announcements'); +const { ANNOUNCEMENT_ICON_OPTIONS, ANNOUNCEMENT_ICON_LABELS } = require('#src/data/announcement-icons'); +const { fetchPlaylistById } = require('#src/data/playlists'); +const { normalizeDisplayMode, fetchTimetablesData, fetchTimetableGroupsPage, fetchTimetableGroupById, fetchTimetableEntriesByGroupId, buildTimetableGroupPayload } = require('#src/data/timetables'); +const { fetchApiSourcesData, fetchApiSourcesPage, fetchApiSourceById, fetchApiSourceResponse, buildApiSourcePayload } = require('#src/data/api-sources'); +const { fetchRssFeedsData, fetchRssFeedsPage, fetchRssFeedById, fetchRssFeedItemsByFeedId, normalizeRssFeedItem, buildRssFeedPayload, fetchRssFeedItems, replaceRssFeedItems } = require('#src/data/rss-feeds'); +const { fetchWeatherLocationsData, fetchWeatherLocationsPage, fetchWeatherLocationById, fetchWeatherLocationSuggestions, fetchWeatherLocationForecast, buildWeatherLocationPayload } = require('#src/data/weather'); +const { slugify, uniqueScreenSlug, fetchScreenById, fetchScreenEditData, fetchScreenPlayerUrls, fetchPlayerPublicBaseUrl, fetchScreenPlayerRecord, fetchPlayerRecordByIdentifier } = require('#src/data/screens'); +const { fetchPlayerRegistrations } = require('#src/data/player-registry'); +const { fetchTemplateById, fetchTemplatesData, extractTemplateRegions, buildTemplatePayload } = require('#src/data/templates'); +const { fetchCanvasSizesData, fetchCanvasSizeById, buildCanvasSizePayload, MAX_CANVAS_SIZE_DIMENSION } = require('#src/data/canvas-sizes'); +const { fetchSlideById, buildSlidePayload } = require('#src/data/slides'); +const { parseJsonSafe, fetchDuplicateName, validateMaxLength, truncateToMaxLength } = require('#src/data/utils'); module.exports = { slugify, diff --git a/src/data/player-registry.js b/src/data/player-registry.js index e84b3ad..1ae58ee 100644 --- a/src/data/player-registry.js +++ b/src/data/player-registry.js @@ -1,4 +1,6 @@ // Persistent player registration and heartbeat helpers shared by the web app and bridge. +// These utilities intentionally keep URL normalization and heartbeat staleness rules in one place +// so the web routing logic and media sync tasks all make the same decision about a live player. function normalizeDeviceId(value) { return String(value || '') @@ -11,6 +13,34 @@ function normalizeBaseUrl(value) { return String(value || '').trim().replace(/\/$/, ''); } +function isLocalLikeBaseUrl(value) { + let host = ''; + try { + host = new URL(String(value || '').trim().replace(/\/$/, '')).hostname.toLowerCase(); + } catch (_error) { + return false; + } + + return host === 'localhost' + || host === '127.0.0.1' + || host === '::1' + || host === 'host.docker.internal' + || host === 'player' + || host === 'web' + || host === 'player-bridge' + || host.endsWith('.local') + || host.endsWith('.internal') + || host.endsWith('.docker.internal'); +} + +function isRecentPlayerRegistration(player, staleSeconds) { + const lastSeenAt = player && player.last_seen_at; + const lastSeenAtValue = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime(); + const cutoffTime = Date.now() - Math.max(30, Number(staleSeconds || 60)) * 1000; + + return Number.isFinite(lastSeenAtValue) && lastSeenAtValue >= cutoffTime; +} + function normalizeIdentifier(value) { return String(value || '').trim().slice(0, 255); } @@ -143,6 +173,9 @@ async function recordPlayerHeartbeat(pool, options) { } module.exports = { + normalizeBaseUrl: normalizeBaseUrl, + isLocalLikeBaseUrl: isLocalLikeBaseUrl, + isRecentPlayerRegistration: isRecentPlayerRegistration, normalizeDeviceId: normalizeDeviceId, normalizeIdentifier: normalizeIdentifier, getConfiguredPlayerIdentifier: getConfiguredPlayerIdentifier, diff --git a/src/data/rss-feeds.js b/src/data/rss-feeds.js index 0bdf68b..c0fddf7 100644 --- a/src/data/rss-feeds.js +++ b/src/data/rss-feeds.js @@ -2,7 +2,7 @@ const http = require('http'); const https = require('https'); -const { fetchPagedRows, validateMaxLength } = require('./utils'); +const { fetchPagedRows, validateMaxLength } = require('#src/data/utils'); const NAME_MAX_LENGTH = 255; const URL_MAX_LENGTH = 1024; diff --git a/src/data/slides.js b/src/data/slides.js index 5f092cd..a0746a7 100644 --- a/src/data/slides.js +++ b/src/data/slides.js @@ -1,10 +1,10 @@ // Slide data access helpers, including rich-text normalization and payload building. -const { fetchTemplateById } = require('./templates'); -const { parseJsonSafe, validateMaxLength } = require('./utils'); +const { fetchTemplateById } = require('#src/data/templates'); +const { parseJsonSafe, validateMaxLength } = require('#src/data/utils'); const TITLE_MAX_LENGTH = 255; -const { buildQrCodeContent } = require('./qr-code'); +const { buildQrCodeContent } = require('#src/data/qr-code'); const DEFAULT_FONT_SIZE = 32; @@ -474,7 +474,64 @@ async function buildTemplateContent(pool, template, body, filesByField, existing font_size: style.font_size, font_color: style.font_color }; - } else if (!['text', 'image', 'video', 'webpage', 'qr-code', 'html', 'rtmp', 'rss', 'api', 'weather'].includes(String(region.region_type || '').trim())) { + } else if (region.region_type === 'chart') { + const current = existingContent && existingContent[region.region_key] && typeof existingContent[region.region_key] === 'object' ? existingContent[region.region_key] : {}; + let manualRows = []; + let datasets = []; + try { + const parsedRows = JSON.parse(String(body[`region_chart_manual_rows_${region.id}`] || '[]')); + manualRows = Array.isArray(parsedRows) ? parsedRows.slice(0, 500) : []; + } catch (_error) { + manualRows = Array.isArray(current.manual_rows) ? current.manual_rows : []; + } + try { + const parsedDatasets = JSON.parse(String(body[`region_chart_datasets_${region.id}`] || '[]')); + datasets = Array.isArray(parsedDatasets) ? parsedDatasets.slice(0, 12) : []; + } catch (_error) { + datasets = Array.isArray(current.datasets) ? current.datasets : []; + } + const colors = String(body[`region_chart_colors_${region.id}`] === undefined ? (Array.isArray(current.colors) ? current.colors.join(',') : '') : body[`region_chart_colors_${region.id}`] || '') + .split(',') + .map((color) => String(color || '').trim()) + .filter((color) => /^#[0-9a-fA-F]{3,8}$/.test(color)) + .slice(0, 24); + const chartSourceKind = String(body[`region_chart_source_kind_${region.id}`] || current.source_kind || 'manual') === 'api' ? 'api' : 'manual'; + const chartOptions = { + legend: ['automatic', 'show', 'hide'].includes(String(body[`region_chart_legend_${region.id}`] || current.chart_options?.legend || 'automatic')) ? String(body[`region_chart_legend_${region.id}`] || current.chart_options?.legend || 'automatic') : 'automatic', + begin_at_zero: body[`region_chart_begin_at_zero_control_${region.id}`] === undefined ? current.chart_options?.begin_at_zero !== false : body[`region_chart_begin_at_zero_${region.id}`] === 'on', + y_axis_min: String(body[`region_chart_y_axis_min_${region.id}`] === undefined ? current.chart_options?.y_axis_min || '' : body[`region_chart_y_axis_min_${region.id}`] || '').trim(), + y_axis_max: String(body[`region_chart_y_axis_max_${region.id}`] === undefined ? current.chart_options?.y_axis_max || '' : body[`region_chart_y_axis_max_${region.id}`] || '').trim(), + line_points: ['automatic', 'show', 'hide'].includes(String(body[`region_chart_line_points_${region.id}`] || current.chart_options?.line_points || 'automatic')) ? String(body[`region_chart_line_points_${region.id}`] || current.chart_options?.line_points || 'automatic') : 'automatic', + line_fill: body[`region_chart_line_fill_${region.id}`] === 'on', + bar_orientation: String(body[`region_chart_bar_orientation_${region.id}`] || current.chart_options?.bar_orientation || 'vertical') === 'horizontal' ? 'horizontal' : 'vertical', + value_format: ['number', 'percent', 'currency'].includes(String(body[`region_chart_value_format_${region.id}`] || current.chart_options?.value_format || 'number')) ? String(body[`region_chart_value_format_${region.id}`] || current.chart_options?.value_format || 'number') : 'number', + decimal_places: Math.max(0, Math.min(4, Number(body[`region_chart_decimal_places_${region.id}`] === undefined ? current.chart_options?.decimal_places || 0 : body[`region_chart_decimal_places_${region.id}`] || 0) || 0)), + text_size: Math.max(8, Math.min(48, Number(body[`region_chart_text_size_${region.id}`] === undefined ? current.chart_options?.text_size || 12 : body[`region_chart_text_size_${region.id}`] || 12) || 12)), + grid_color: /^#[0-9a-fA-F]{6}$/.test(String(body[`region_chart_grid_color_${region.id}`] || current.chart_options?.grid_color || '')) ? String(body[`region_chart_grid_color_${region.id}`] || current.chart_options?.grid_color) : '#000000', + text_color: /^#[0-9a-fA-F]{6}$/.test(String(body[`region_chart_text_color_${region.id}`] || current.chart_options?.text_color || '')) ? String(body[`region_chart_text_color_${region.id}`] || current.chart_options?.text_color) : '#000000' + }; + const sourceOptions = { + sort: ['none', 'reverse-original', 'value-ascending', 'value-descending'].includes(String(body[`region_chart_source_sort_${region.id}`] || current.source_options?.sort || 'none')) ? String(body[`region_chart_source_sort_${region.id}`] || current.source_options?.sort || 'none') : 'none', + limit: Math.max(0, Math.min(500, Number(body[`region_chart_source_limit_${region.id}`] === undefined ? current.source_options?.limit || 0 : body[`region_chart_source_limit_${region.id}`] || 0) || 0)), + missing: ['skip', 'zero', 'gap'].includes(String(body[`region_chart_source_missing_${region.id}`] || current.source_options?.missing || 'gap')) ? String(body[`region_chart_source_missing_${region.id}`] || current.source_options?.missing || 'gap') : 'gap' + }; + content[region.region_key] = { + type: 'chart', + chart_type: ['line', 'bar', 'doughnut', 'pie'].includes(String(body[`region_chart_type_${region.id}`] || current.chart_type || 'bar')) ? String(body[`region_chart_type_${region.id}`] || current.chart_type || 'bar') : 'bar', + source_kind: chartSourceKind, + source_id: chartSourceKind === 'api' ? (body[`region_chart_source_id_${region.id}`] === undefined ? (current.source_id || null) : (body[`region_chart_source_id_${region.id}`] === '' ? null : Number(body[`region_chart_source_id_${region.id}`]))) : null, + items_path: String(body[`region_chart_items_path_${region.id}`] === undefined ? current.items_path || '' : body[`region_chart_items_path_${region.id}`] || '').trim(), + label_path: String(body[`region_chart_label_path_${region.id}`] === undefined ? current.label_path || '' : body[`region_chart_label_path_${region.id}`] || '').trim(), + value_path: String(body[`region_chart_value_path_${region.id}`] === undefined ? current.value_path || '' : body[`region_chart_value_path_${region.id}`] || '').trim(), + dataset_label: String(body[`region_chart_dataset_label_${region.id}`] === undefined ? current.dataset_label || 'Value' : body[`region_chart_dataset_label_${region.id}`] || 'Value').trim() || 'Value', + color: /^#[0-9a-fA-F]{3,8}$/.test(String(body[`region_chart_color_${region.id}`] || current.color || '')) ? String(body[`region_chart_color_${region.id}`]) : (current.color || '#36a269'), + datasets, + colors, + manual_rows: manualRows, + chart_options: chartOptions, + source_options: sourceOptions + }; + } else if (!['text', 'image', 'video', 'webpage', 'qr-code', 'html', 'rtmp', 'rss', 'api', 'weather', 'chart'].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 = {}; diff --git a/src/data/templates.js b/src/data/templates.js index 418897a..596f75f 100644 --- a/src/data/templates.js +++ b/src/data/templates.js @@ -1,7 +1,7 @@ // Template data access helpers and region normalization logic. -const { parseJsonSafe, readFormArray, validateMaxLength } = require('./utils'); -const animationPresets = require('../web/public/js/templates/animation-presets'); +const { parseJsonSafe, readFormArray, validateMaxLength } = require('#src/data/utils'); +const animationPresets = require('#src/web/public/js/templates/animation-presets'); const TEMPLATE_NAME_MAX_LENGTH = 255; const REGION_NAME_MAX_LENGTH = 255; @@ -49,7 +49,8 @@ function normalizeBackgroundGradient(value) { function normalizeTemplateRegionType(value) { const rawType = String(value || 'text').trim(); - return rawType || 'text'; + const normalizedType = rawType.toLowerCase(); + return ['text', 'image', 'video', 'webpage', 'qr-code', 'html', 'rtmp', 'rss', 'api', 'weather', 'timetable', 'time-date', 'chart'].includes(normalizedType) ? rawType : 'text'; } function normalizeTemplateRegionLockRatio(value) { diff --git a/src/data/timetables.js b/src/data/timetables.js index d57534f..1103144 100644 --- a/src/data/timetables.js +++ b/src/data/timetables.js @@ -1,6 +1,6 @@ // Timetable group and entry data access helpers. -const { fetchPagedRows, validateMaxLength } = require('./utils'); +const { fetchPagedRows, validateMaxLength } = require('#src/data/utils'); const NAME_MAX_LENGTH = 255; const DESCRIPTION_MAX_LENGTH = 255; diff --git a/src/data/weather.js b/src/data/weather.js index db1a6de..a28ea85 100644 --- a/src/data/weather.js +++ b/src/data/weather.js @@ -1,7 +1,7 @@ // Weather location data access and form normalization. -const { fetchPagedRows, validateMaxLength } = require('./utils'); -const { fetchAppSettings } = require('./app-settings'); +const { fetchPagedRows, validateMaxLength } = require('#src/data/utils'); +const { fetchAppSettings } = require('#src/data/app-settings'); const NAME_MAX_LENGTH = 255; const LOCATION_MAX_LENGTH = 255; diff --git a/src/db/index.js b/src/db/index.js index 97dfdb8..c5d4ee9 100644 --- a/src/db/index.js +++ b/src/db/index.js @@ -1,7 +1,7 @@ // Schema initialization, migration execution, and database bootstrap helpers. const { version: appVersion } = require('#root/package.json'); -const { compareVersions, detectSchemaVersion, getPendingMigrations, recordSchemaVersion, runMigrations } = require('./migrations'); +const { compareVersions, detectSchemaVersion, getPendingMigrations, recordSchemaVersion, runMigrations } = require('#src/db/migrations'); // Snapshot only: keep this file aligned with the current schema state. async function ensureSchema(pool, options) { diff --git a/src/player-bridge/connection-state.js b/src/player-bridge/connection-state.js new file mode 100644 index 0000000..06ca85e --- /dev/null +++ b/src/player-bridge/connection-state.js @@ -0,0 +1,191 @@ +'use strict'; + +// This bridge state owns the in-memory socket and screen snapshot lifecycle so the +// HTTP/WebSocket bootstrap stays focused on routing instead of mutable state. +const { WebSocket } = require('ws'); + +function createPlayerBridgeState() { + const playerSockets = new Map(); + const screenSnapshotCache = new Map(); + const screenSnapshotSourcesBySlug = new Map(); + const screenSnapshotSubscribersBySlug = new Map(); + const screenPlayerDeviceIds = new Map(); + + function getScreenSnapshotSourceBucket(slug) { + const key = String(slug || '').trim(); + if (!key) { + return null; + } + + if (!screenSnapshotSourcesBySlug.has(key)) { + screenSnapshotSourcesBySlug.set(key, new Map()); + } + + return screenSnapshotSourcesBySlug.get(key); + } + + function getScreenSnapshotSubscriberBucket(slug) { + const key = String(slug || '').trim(); + if (!key) { + return null; + } + + if (!screenSnapshotSubscribersBySlug.has(key)) { + screenSnapshotSubscribersBySlug.set(key, new Set()); + } + + return screenSnapshotSubscribersBySlug.get(key); + } + + function storeScreenSnapshot(slug, connections, deviceIds) { + const key = String(slug || '').trim(); + const normalizedConnections = []; + const connectionIndexes = new Map(); + + (Array.isArray(connections) ? connections : []).forEach(function (connection) { + const identity = connection && typeof connection === 'object' + ? [String(connection.deviceId || '').trim(), String(connection.clientId || '').trim()].join('|') + : ''; + if (!identity || !connectionIndexes.has(identity)) { + if (identity) { + connectionIndexes.set(identity, normalizedConnections.length); + } + normalizedConnections.push(connection); + return; + } + normalizedConnections[connectionIndexes.get(identity)] = connection; + }); + + const normalizedDeviceIds = Array.isArray(deviceIds) ? deviceIds.filter(Boolean).map(function (value) { + return String(value || '').trim(); + }).filter(Boolean) : []; + + screenSnapshotCache.set(key, { + slug: key, + count: normalizedConnections.length, + connections: normalizedConnections + }); + screenPlayerDeviceIds.set(key, Array.from(new Set(normalizedDeviceIds))); + } + + function buildMergedScreenSnapshot(slug) { + const key = String(slug || '').trim(); + const sourceBucket = screenSnapshotSourcesBySlug.get(key); + const connections = []; + const deviceIds = []; + + if (sourceBucket && typeof sourceBucket.forEach === 'function') { + sourceBucket.forEach(function (payload) { + if (payload && Array.isArray(payload.connections)) { + connections.push.apply(connections, payload.connections); + } + }); + sourceBucket.forEach(function (_payload, sourceKey) { + deviceIds.push(sourceKey); + }); + } + + return { + slug: key, + count: connections.length, + connections: connections, + deviceIds: deviceIds + }; + } + + function broadcastScreenSnapshot(slug) { + const key = String(slug || '').trim(); + const snapshot = buildMergedScreenSnapshot(key); + storeScreenSnapshot(key, snapshot.connections, snapshot.deviceIds); + + const bucket = screenSnapshotSubscribersBySlug.get(key); + if (!bucket || !bucket.size) { + return; + } + + const payload = JSON.stringify({ + type: 'snapshot', + slug: key, + connections: snapshot.connections, + sentAt: new Date().toISOString() + }); + + bucket.forEach(function (socket) { + if (socket && socket.readyState === WebSocket.OPEN) { + socket.send(payload); + } + }); + } + + function setScreenSnapshotSource(slug, sourceKey, connections) { + const key = String(slug || '').trim(); + const normalizedSourceKey = String(sourceKey || '').trim(); + if (!key || !normalizedSourceKey) { + return; + } + + const bucket = getScreenSnapshotSourceBucket(key); + if (!bucket) { + return; + } + + bucket.set(normalizedSourceKey, { + slug: key, + connections: Array.isArray(connections) ? connections : [] + }); + broadcastScreenSnapshot(key); + } + + function clearScreenSnapshotSource(slug, sourceKey) { + const key = String(slug || '').trim(); + const normalizedSourceKey = String(sourceKey || '').trim(); + const bucket = screenSnapshotSourcesBySlug.get(key); + if (!bucket || !normalizedSourceKey || !bucket.has(normalizedSourceKey)) { + return; + } + + bucket.delete(normalizedSourceKey); + if (!bucket.size) { + screenSnapshotSourcesBySlug.delete(key); + } + + broadcastScreenSnapshot(key); + } + + function clearPlayerSnapshotSources(sourceKey) { + const normalizedSourceKey = String(sourceKey || '').trim(); + if (!normalizedSourceKey) { + return; + } + + Array.from(screenSnapshotSourcesBySlug.keys()).forEach(function (slug) { + clearScreenSnapshotSource(slug, normalizedSourceKey); + }); + } + + function getScreenSnapshotCount(slug) { + const snapshot = screenSnapshotCache.get(String(slug || '').trim()) || { count: 0 }; + return Number(snapshot.count || 0); + } + + return { + playerSockets: playerSockets, + screenSnapshotCache: screenSnapshotCache, + screenSnapshotSourcesBySlug: screenSnapshotSourcesBySlug, + screenSnapshotSubscribersBySlug: screenSnapshotSubscribersBySlug, + screenPlayerDeviceIds: screenPlayerDeviceIds, + getScreenSnapshotSourceBucket: getScreenSnapshotSourceBucket, + getScreenSnapshotSubscriberBucket: getScreenSnapshotSubscriberBucket, + storeScreenSnapshot: storeScreenSnapshot, + buildMergedScreenSnapshot: buildMergedScreenSnapshot, + broadcastScreenSnapshot: broadcastScreenSnapshot, + setScreenSnapshotSource: setScreenSnapshotSource, + clearScreenSnapshotSource: clearScreenSnapshotSource, + clearPlayerSnapshotSources: clearPlayerSnapshotSources, + getScreenSnapshotCount: getScreenSnapshotCount + }; +} + +module.exports = { + createPlayerBridgeState: createPlayerBridgeState +}; \ No newline at end of file diff --git a/src/player-bridge/index.js b/src/player-bridge/index.js index 94e9883..3b4f41a 100644 --- a/src/player-bridge/index.js +++ b/src/player-bridge/index.js @@ -6,14 +6,14 @@ const fs = require('fs'); const http = require('http'); const path = require('path'); const { WebSocketServer, WebSocket } = require('ws'); -const common = require('../common'); -const { verifyRequestAuth, createRequestAuthHeaders } = require('#src/request-auth'); +const common = require('#src/common'); +const { verifyRequestAuth, createRequestAuthHeaders, verifyPageAuthToken } = require('#src/request-auth'); const { normalizeDeviceId, upsertPlayerRegistration, recordPlayerHeartbeat } = require('#src/data/player-registry'); -const { createPlayerPlaylistService } = require('../player/playlist'); -const { commitDeviceBinding, bindPlayerToScreen, getOnboardingStatus, getPlayerPublicBaseUrl } = require('../player/onboarding'); -const { createStyledQrCodeSvg } = require('../data/qr-code'); -const { verifyPageAuthToken } = require('#src/request-auth'); -const { collectLocalControlUsers } = require('../web/lib/local-control-users'); +const { createPlayerBridgeState } = require('#src/player-bridge/connection-state'); +const { createPlayerPlaylistService } = require('#src/player/playlist'); +const { commitDeviceBinding, bindPlayerToScreen, getOnboardingStatus, getPlayerPublicBaseUrl } = require('#src/player/onboarding/index'); +const { createStyledQrCodeSvg } = require('#src/data/qr-code'); +const { collectLocalControlUsers } = require('#src/web/lib/local-control-users'); function createThinClientConfig() { @@ -187,6 +187,7 @@ async function start() { const server = http.createServer(app); const pool = common.createPool(); const config = createThinClientConfig(); + const bridgeState = createPlayerBridgeState(); const localPlayerInternalUrl = String(process.env.LOCAL_PLAYER_INTERNAL_URL || process.env.PLAYER_INTERNAL_URL || '').trim().replace(/\/$/, ''); const playerPlaylistService = createPlayerPlaylistService({ pool: pool, @@ -197,133 +198,21 @@ async function start() { app.use(express.json()); const playersWs = new WebSocketServer({ noServer: true }); const screenSnapshotsWs = new WebSocketServer({ noServer: true }); - const playerSockets = new Map(); - const screenSnapshotCache = new Map(); - const screenSnapshotSourcesBySlug = new Map(); - const screenSnapshotSubscribersBySlug = new Map(); - const screenPlayerDeviceIds = new Map(); + const playerSockets = bridgeState.playerSockets; + const screenSnapshotCache = bridgeState.screenSnapshotCache; + const screenSnapshotSourcesBySlug = bridgeState.screenSnapshotSourcesBySlug; + const screenSnapshotSubscribersBySlug = bridgeState.screenSnapshotSubscribersBySlug; + const screenPlayerDeviceIds = bridgeState.screenPlayerDeviceIds; const pendingPlayerCommands = new Map(); - function getScreenSnapshotSourceBucket(slug) { - const key = String(slug || '').trim(); - if (!key) { - return null; - } - - if (!screenSnapshotSourcesBySlug.has(key)) { - screenSnapshotSourcesBySlug.set(key, new Map()); - } - - return screenSnapshotSourcesBySlug.get(key); - } - - function getScreenSnapshotSubscriberBucket(slug) { - const key = String(slug || '').trim(); - if (!key) { - return null; - } - - if (!screenSnapshotSubscribersBySlug.has(key)) { - screenSnapshotSubscribersBySlug.set(key, new Set()); - } - - return screenSnapshotSubscribersBySlug.get(key); - } - - function buildMergedScreenSnapshot(slug) { - const key = String(slug || '').trim(); - const sourceBucket = screenSnapshotSourcesBySlug.get(key); - const connections = []; - const deviceIds = []; - - if (sourceBucket && typeof sourceBucket.forEach === 'function') { - sourceBucket.forEach(function (payload) { - if (payload && Array.isArray(payload.connections)) { - connections.push.apply(connections, payload.connections); - } - }); - sourceBucket.forEach(function (_payload, sourceKey) { - deviceIds.push(sourceKey); - }); - } - - return { - slug: key, - count: connections.length, - connections: connections, - deviceIds: deviceIds - }; - } - - function broadcastScreenSnapshot(slug) { - const key = String(slug || '').trim(); - const snapshot = buildMergedScreenSnapshot(key); - storeScreenSnapshot(key, snapshot.connections, snapshot.deviceIds); - - const bucket = screenSnapshotSubscribersBySlug.get(key); - if (!bucket || !bucket.size) { - return; - } - - const payload = JSON.stringify({ - type: 'snapshot', - slug: key, - connections: snapshot.connections, - sentAt: new Date().toISOString() - }); - - bucket.forEach(function (socket) { - if (socket && socket.readyState === WebSocket.OPEN) { - socket.send(payload); - } - }); - } - - function setScreenSnapshotSource(slug, sourceKey, connections) { - const key = String(slug || '').trim(); - const normalizedSourceKey = String(sourceKey || '').trim(); - if (!key || !normalizedSourceKey) { - return; - } - - const bucket = getScreenSnapshotSourceBucket(key); - if (!bucket) { - return; - } - - bucket.set(normalizedSourceKey, { - slug: key, - connections: Array.isArray(connections) ? connections : [] - }); - broadcastScreenSnapshot(key); - } - - function clearScreenSnapshotSource(slug, sourceKey) { - const key = String(slug || '').trim(); - const normalizedSourceKey = String(sourceKey || '').trim(); - const bucket = screenSnapshotSourcesBySlug.get(key); - if (!bucket || !normalizedSourceKey || !bucket.has(normalizedSourceKey)) { - return; - } - - bucket.delete(normalizedSourceKey); - if (!bucket.size) { - screenSnapshotSourcesBySlug.delete(key); - } - - broadcastScreenSnapshot(key); - } - - function clearPlayerSnapshotSources(sourceKey) { - const normalizedSourceKey = String(sourceKey || '').trim(); - if (!normalizedSourceKey) { - return; - } - - Array.from(screenSnapshotSourcesBySlug.keys()).forEach(function (slug) { - clearScreenSnapshotSource(slug, normalizedSourceKey); - }); - } + const getScreenSnapshotSourceBucket = bridgeState.getScreenSnapshotSourceBucket; + const getScreenSnapshotSubscriberBucket = bridgeState.getScreenSnapshotSubscriberBucket; + const buildMergedScreenSnapshot = bridgeState.buildMergedScreenSnapshot; + const broadcastScreenSnapshot = bridgeState.broadcastScreenSnapshot; + const setScreenSnapshotSource = bridgeState.setScreenSnapshotSource; + const clearScreenSnapshotSource = bridgeState.clearScreenSnapshotSource; + const clearPlayerSnapshotSources = bridgeState.clearPlayerSnapshotSources; + const storeScreenSnapshot = bridgeState.storeScreenSnapshot; async function fetchPlayerSnapshotRegistrations() { if (typeof common.fetchPlayerRegistrations === 'function') { @@ -471,35 +360,6 @@ async function start() { return Array.isArray(deviceIds) ? deviceIds.slice() : []; } - function storeScreenSnapshot(slug, connections, deviceIds) { - const key = String(slug || '').trim(); - const normalizedConnections = []; - const connectionIndexes = new Map(); - (Array.isArray(connections) ? connections : []).forEach(function (connection) { - const identity = connection && typeof connection === 'object' - ? [String(connection.deviceId || '').trim(), String(connection.clientId || '').trim()].join('|') - : ''; - if (!identity || !connectionIndexes.has(identity)) { - if (identity) { - connectionIndexes.set(identity, normalizedConnections.length); - } - normalizedConnections.push(connection); - return; - } - normalizedConnections[connectionIndexes.get(identity)] = connection; - }); - const normalizedDeviceIds = Array.isArray(deviceIds) ? deviceIds.map(function (value) { - return normalizeDeviceId(value); - }).filter(Boolean) : []; - - screenSnapshotCache.set(key, { - slug: key, - count: normalizedConnections.length, - connections: normalizedConnections - }); - screenPlayerDeviceIds.set(key, Array.from(new Set(normalizedDeviceIds))); - } - app.get('/health', function (_req, res) { res.json({ ok: true, service: 'player-bridge' }); }); diff --git a/src/player.js b/src/player.js index 14fae33..72a92a4 100644 --- a/src/player.js +++ b/src/player.js @@ -5,19 +5,19 @@ 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'); -const { createRtmpStreamService } = require('./player/modules/rtmp-streams'); -const { normalizeDeviceId, registerPlayerOnboardingRoutes, commitDeviceBinding } = require('./player/onboarding'); -const { createOnboardingStore } = require('./player/onboarding/store'); -const { registerPlayerRoutes } = require('./player/routes'); -const { getPlayerRuntimeScripts } = require('./player/render-helpers'); +const common = require('#src/common'); +const { createPlayerRuntime } = require('#src/player/runtime'); +const { createPlayerPlaylistService } = require('#src/player/playlist'); +const { createRtmpStreamService } = require('#src/player/modules/rtmp-streams'); +const { normalizeDeviceId, registerPlayerOnboardingRoutes, commitDeviceBinding } = require('#src/player/onboarding/index'); +const { createOnboardingStore } = require('#src/player/onboarding/store'); +const { registerPlayerRoutes } = require('#src/player/routes'); +const { getPlayerRuntimeScripts } = require('#src/player/render-helpers'); const { ensureFontLibrary } = require('#src/web/lib/media/font-library'); const { createRequestAuthHeaders } = require('#src/request-auth'); const { withClientNameReservation } = require('#src/data/client-name-check'); const { getConfiguredPlayerIdentifier, recordPlayerHeartbeat } = require('#src/data/player-registry'); -const { createLocalControlService } = require('./player/local-control'); +const { createLocalControlService } = require('#src/player/local-control'); // Player runtime, media API, and websocket wiring. @@ -627,7 +627,7 @@ async function start() { await syncDatabaseState(); if (PLAYER_DEVICE_ID && !isRemotePlayer) { - const { upsertPlayerRegistration } = require('./player/onboarding'); + const { upsertPlayerRegistration } = require('#src/player/onboarding/index'); await upsertPlayerRegistration(pool, PLAYER_DEVICE_ID, getPlayerPublicBaseUrl(), PLAYER_INTERNAL_URL).catch(function (error) { console.error(error); }); diff --git a/src/player/onboarding/index.js b/src/player/onboarding/index.js index b12bba0..da9ad47 100644 --- a/src/player/onboarding/index.js +++ b/src/player/onboarding/index.js @@ -6,7 +6,7 @@ const { findAvailableClientName, withClientNameReservation } = require('#src/dat const { createStyledQrCodeSvg } = require('#src/data/qr-code'); const { getSharedSecret, verifyPageAuthToken, verifyRequestAuth, createRequestAuthHeaders } = require('#src/request-auth'); const { resolvePlayerRegistration, upsertPlayerRegistration: upsertPlayerRegistrationRecord } = require('#src/data/player-registry'); -const { isTransientDbError } = require('./store'); +const { isTransientDbError } = require('#src/player/onboarding/store'); const ONBOARDING_SIGNUP_LIMIT_WINDOW_MS = 5 * 60 * 1000; const ONBOARDING_SIGNUP_LIMIT_MAX_ATTEMPTS = 8; diff --git a/src/player/player-page-announcements.js b/src/player/player-page-announcements.js index 1102211..b13b858 100644 --- a/src/player/player-page-announcements.js +++ b/src/player/player-page-announcements.js @@ -185,6 +185,13 @@ }, 15000); } + function stopAnnouncementPolling() { + if (announcementPollTimer) { + window.clearInterval(announcementPollTimer); + announcementPollTimer = null; + } + } + function scheduleAnnouncementReconnect() { if (announcementReconnectTimer) { return; @@ -222,6 +229,7 @@ announcementSocket = socket; socket.onopen = function () { + stopAnnouncementPolling(); void refreshAnnouncementOverlay(); }; @@ -231,6 +239,7 @@ socket.onclose = function () { announcementSocket = null; + scheduleAnnouncementPolling(); scheduleAnnouncementReconnect(); }; @@ -247,14 +256,18 @@ if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', function () { - void refreshAnnouncementOverlay(); scheduleAnnouncementPolling(); connectAnnouncementSocket(); + if (!window.WebSocket) { + void refreshAnnouncementOverlay(); + } }, { once: true }); } else { - void refreshAnnouncementOverlay(); scheduleAnnouncementPolling(); connectAnnouncementSocket(); + if (!window.WebSocket) { + void refreshAnnouncementOverlay(); + } } window.addEventListener('focus', function () { diff --git a/src/player/player-page.script.html b/src/player/player-page.script.html index 81d23cd..c2cdcac 100644 --- a/src/player/player-page.script.html +++ b/src/player/player-page.script.html @@ -25,6 +25,8 @@ let slideRenderRequestId = 0; let preloadContainer = null; let preloadSignature = ''; + let mediaPreloadSignature = ''; + let mediaPreloadElements = []; let commandSocket = null; let commandReconnectTimer = null; let commandStateTimer = null; @@ -47,6 +49,7 @@ const commandSocketPath = '/ws/screens/' + encodeURIComponent(slug); const commandClientStorageKey = 'pulse-signage-player-client-id'; const playlistSnapshotStorageKey = 'pulse-signage-player-playlist-snapshot:' + slug; + const playbackStateStorageKey = 'pulse-signage-player-playback-state:' + slug; const initialPlaylistSnapshot = loadPlaylistSnapshot(); let offlineBanner = null; let offlineBannerVisible = false; @@ -104,6 +107,7 @@ })); } + startPlayerWatchdog(); window.addEventListener('error', function (event) { logDebug('Player script error.', String(event.message || event.error || 'unknown error'), 'error'); }); @@ -134,7 +138,6 @@ window.addEventListener('online', function () { syncOfflineBanner(); - markRefreshHealthy(); refresh(); }); @@ -147,7 +150,6 @@ syncOfflineBanner(); syncScreenWakeLock(); if (document.visibilityState === 'visible') { - markRefreshHealthy(); refresh(); } }); @@ -175,6 +177,7 @@ skipUnavailableRtmp: currentPlaylistSkipUnavailableRtmp, etag: currentPlaylistEtag }); + restorePlaybackState(); syncWebpagePreloads(getActiveSlidesFrom(slides), index); if (typeof syncRtmpWarmups === 'function') { syncRtmpWarmups(getActiveSlidesFrom(slides), index); @@ -185,6 +188,7 @@ } else { if (initialPlaylistSnapshot && applyPlaylistSnapshot(initialPlaylistSnapshot)) { currentPlaylistSkipUnavailableRtmp = Boolean(initialPlaylistSnapshot.skipUnavailableRtmp); + restorePlaybackState(); showCurrent(); } syncBlackoutState(); diff --git a/src/player/playlist.js b/src/player/playlist.js index 4f7edf0..e8ccc3a 100644 --- a/src/player/playlist.js +++ b/src/player/playlist.js @@ -4,7 +4,9 @@ const crypto = require('crypto'); const { convertWeatherSnapshot } = require('#src/data/weather-units'); const fs = require('fs'); const path = require('path'); -const { createStyledQrCodeDataUrl } = require('../data/qr-code'); +const { createStyledQrCodeDataUrl } = require('#src/data/qr-code'); + +const IMAGE_VARIANT_DIMENSIONS = [2048, 4096, 8192, 16384]; function createPlayerPlaylistService(options) { const pool = options && options.pool ? options.pool : null; @@ -64,6 +66,28 @@ function createPlayerPlaylistService(options) { return createStyledQrCodeDataUrl(value); } + async function getImageVariants(mediaPath) { + const normalizedPath = String(mediaPath || '').trim().split(/[?#]/)[0]; + if (!mediaDir || !/^\/media\/uploads\/[^/]+\.(?:jpe?g|png|webp)$/i.test(normalizedPath)) { + return []; + } + + const fileName = path.basename(normalizedPath); + const extension = path.extname(fileName); + const baseName = path.basename(fileName, extension); + const variants = []; + for (const width of IMAGE_VARIANT_DIMENSIONS) { + const variantName = baseName + '.variant-' + width + extension; + const variantPath = path.join(mediaDir, 'uploads', variantName); + try { + await fs.promises.access(variantPath, fs.constants.F_OK); + variants.push({ width: width, url: '/media/uploads/' + variantName }); + } catch (_error) { + } + } + return variants; + } + function getPlaceholderImageExpressions(value, output) { const expressions = output || []; const source = String(value || ''); @@ -281,6 +305,25 @@ function createPlayerPlaylistService(options) { } }); + await Promise.all(Object.keys(content).map(async function (key) { + const region = content[key]; + if (!region || typeof region !== 'object' || !['image', 'video'].includes(String(region.type || '').trim().toLowerCase())) { + return; + } + const variants = await getImageVariants(region.value); + if (variants.length) { + region.media_variants = variants; + } + })); + + const template = slide.template_id ? templatesById[slide.template_id] || null : null; + if (template && template.background_image_path && !template.background_image_variants) { + const variants = await getImageVariants(template.background_image_path); + if (variants.length) { + template.background_image_variants = variants; + } + } + Object.keys(content).forEach(function (key) { const region = content[key]; if (!region || typeof region !== 'object' || String(region.type || '').trim().toLowerCase() !== 'qr-code') { @@ -310,7 +353,7 @@ function createPlayerPlaylistService(options) { disable_audio: disableAudio, scheduleRules: rulesBySlideId[Number(slide.id)] || [], template_id: slide.template_id, - template: slide.template_id ? templatesById[slide.template_id] || null : null, + template: template, content: content }; })); diff --git a/src/player/public/js/player-announcement-templates.js b/src/player/public/js/player-announcement-templates.js index 03b9d43..8de9ac3 100644 --- a/src/player/public/js/player-announcement-templates.js +++ b/src/player/public/js/player-announcement-templates.js @@ -2,15 +2,7 @@ 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, '>') - .replace(/"/g, '"') - .replace(/'/g, '''); - } + var escapeHtml = window.pulsePlayerRenderingShared.escapeHtml; function normalizeAnnouncementType(value) { var normalized = String(value || '').trim().toLowerCase(); diff --git a/src/player/public/js/player-page-commands.js b/src/player/public/js/player-page-commands.js index f6bf79b..3467ed8 100644 --- a/src/player/public/js/player-page-commands.js +++ b/src/player/public/js/player-page-commands.js @@ -7,6 +7,7 @@ function getCurrentViewport() { } var commandHeartbeatTimer = null; +var commandReconnectDelayMs = 0; // Command websocket and player-state helpers. // Send the current playback state to the command websocket. @@ -61,137 +62,6 @@ function scheduleViewportRenderUpdate() { }, 150); } -function getPlayerRegionModules() { - if (!window.pulsePlayerRegionTypes || typeof window.pulsePlayerRegionTypes.list !== 'function') { - return []; - } - - return window.pulsePlayerRegionTypes.list(); -} - -function runRegionLifecycle(root, lifecycleName) { - if (!root) { - 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, mediaDelayMs) { - clearSlideTransitionTimer(); - destroyRegionInstances(app); - if (typeof destroySlideMedia === 'function') { - destroySlideMedia(app); - } - - function schedulePostRenderSetup(root, delayMs) { - if (!root) { - return; - } - - if (root.isConnected === false) { - return; - } - - initializeRegionInstances(root); - if (typeof initializeSlideMedia === 'function') { - initializeSlideMedia(root, delayMs); - } - - if (typeof playRegionAnimations === 'function') { - playRegionAnimations(root, 'intro'); - } - } - - if (!shouldFade) { - app.innerHTML = markup; - schedulePostRenderSetup(app, 0); - return app.firstElementChild; - } - - var topLevelChildren = Array.prototype.slice.call(app.children || []); - var existingShells = topLevelChildren.filter(function (child) { - return child && child.classList && child.classList.contains('slide-shell'); - }); - var previousShell = existingShells.length ? existingShells[existingShells.length - 1] : app.firstElementChild; - - if (existingShells.length > 1) { - existingShells.slice(0, -1).forEach(function (shell) { - if (shell && shell.parentNode) { - shell.parentNode.removeChild(shell); - } - }); - } - - var nextShell = document.createElement('div'); - nextShell.className = 'slide-shell slide-shell-entering'; - nextShell.style.zIndex = '0'; - nextShell.style.opacity = '0'; - nextShell.innerHTML = markup; - - if (!previousShell || (previousShell.classList && previousShell.classList.contains('empty'))) { - app.innerHTML = ''; - nextShell.style.opacity = '1'; - nextShell.classList.remove('slide-shell-entering'); - nextShell.classList.add('is-visible'); - app.appendChild(nextShell); - schedulePostRenderSetup(nextShell, mediaDelayMs === undefined ? slideFadeOffsetMs : mediaDelayMs); - return nextShell; - } - - if (!previousShell.classList.contains('slide-shell')) { - previousShell.classList.add('slide-shell'); - } - previousShell.classList.remove('is-visible'); - previousShell.classList.add('is-exiting'); - previousShell.style.zIndex = '1'; - previousShell.style.opacity = '1'; - - app.appendChild(nextShell); - window.requestAnimationFrame(function () { - nextShell.style.opacity = '1'; - previousShell.style.opacity = '0'; - nextShell.classList.remove('slide-shell-entering'); - nextShell.classList.add('is-visible'); - schedulePostRenderSetup(nextShell, mediaDelayMs === undefined ? slideFadeOffsetMs : mediaDelayMs); - }); - - slideTransitionTimer = window.setTimeout(function () { - if (previousShell && previousShell.parentNode) { - previousShell.parentNode.removeChild(previousShell); - } - if (nextShell) { - nextShell.style.zIndex = '1'; - nextShell.style.opacity = '1'; - nextShell.classList.remove('slide-shell-entering'); - nextShell.classList.add('is-visible'); - } - slideTransitionTimer = null; - }, slideFadeLengthMs); - - return nextShell; -} - // Mirror blackout state onto the document body. function syncBlackoutState() { document.body.classList.toggle('screen-blackout', isBlackout); @@ -207,11 +77,13 @@ function setPaused(nextPaused) { pausedRemainingMs = slideExpiresAt ? Math.max(0, slideExpiresAt - Date.now()) : null; isPaused = true; clearSlideTimer(); + savePlaybackState(); sendCommandState(lastRenderedSlide); return; } isPaused = false; + savePlaybackState(); sendCommandState(lastRenderedSlide); if (!slides.length || !lastRenderedSlide) { return; @@ -230,6 +102,7 @@ function setBlackout(nextBlackout) { } isBlackout = normalized; syncBlackoutState(); + savePlaybackState(); sendCommandState(lastRenderedSlide); } @@ -357,10 +230,6 @@ function handleCommandMessage(rawMessage) { } catch (_error) { return; } - if (payload && payload.type === 'client-id-conflict') { - handleClientIdConflict(); - return; - } if (payload && payload.type === 'client-name-updated') { if (payload.clientName) { applyOnboardingClientName(payload.clientName, commandSocket); @@ -437,23 +306,31 @@ function handleCommandMessage(rawMessage) { } } -function handleClientIdConflict() { - var replacementClientId = regenerateCommandClientId(); - var onboardingUrl = new URL('/', window.location.origin); - window.location.replace(onboardingUrl.toString()); -} - // Retry the command websocket after a disconnect. function scheduleCommandReconnect() { if (commandReconnectTimer) { return; } + var baseDelayMs = commandReconnectDelayMs + ? Math.min(commandReconnectDelayMs * 2, 30000) + : 1000; + commandReconnectDelayMs = baseDelayMs; + var jitteredDelayMs = Math.round(baseDelayMs * (0.75 + Math.random() * 0.5)); commandReconnectTimer = window.setTimeout(function () { commandReconnectTimer = null; connectCommandSocket(); - }, 5000); + }, jitteredDelayMs); } +window.addEventListener('online', function () { + if (commandReconnectTimer) { + window.clearTimeout(commandReconnectTimer); + commandReconnectTimer = null; + } + commandReconnectDelayMs = 0; + connectCommandSocket(); +}); + // Open and wire the command websocket connection. function connectCommandSocket() { if (!window.WebSocket) { @@ -466,6 +343,7 @@ function connectCommandSocket() { commandSocket = socket; socket.onopen = function () { + commandReconnectDelayMs = 0; if (commandHeartbeatTimer) { window.clearInterval(commandHeartbeatTimer); } @@ -495,7 +373,9 @@ function connectCommandSocket() { } commandSocket = null; if (event && event.code === 4009) { - handleClientIdConflict(); + regenerateCommandClientId(); + commandReconnectDelayMs = 0; + scheduleCommandReconnect(); return; } scheduleCommandReconnect(); diff --git a/src/player/public/js/player-page-media.js b/src/player/public/js/player-page-media.js index bc2921a..3cbf8b0 100644 --- a/src/player/public/js/player-page-media.js +++ b/src/player/public/js/player-page-media.js @@ -1,5 +1,15 @@ // Slide media startup and teardown helpers. +var renderedVideoPlaybackCleanup = new WeakMap(); + +function cancelRenderedVideoPlayback(video) { + var cleanup = renderedVideoPlaybackCleanup.get(video); + if (cleanup) { + cleanup(); + renderedVideoPlaybackCleanup.delete(video); + } +} + function initializeRenderedVideoPlayback(root, delayMs) { if (!root) { return; @@ -12,14 +22,37 @@ function initializeRenderedVideoPlayback(root, delayMs) { return; } + cancelRenderedVideoPlayback(video); var playbackScheduled = false; + var playbackCancelled = false; + var playbackTimer = null; + function removeReadinessListeners() { + video.removeEventListener('canplay', schedulePlaybackStart); + video.removeEventListener('loadedmetadata', onLoadedMetadata); + } + + // A cancelled callback can already be queued for dispatch, so it also checks this flag. + renderedVideoPlaybackCleanup.set(video, function () { + playbackCancelled = true; + if (playbackTimer !== null) { + window.clearTimeout(playbackTimer); + playbackTimer = null; + } + removeReadinessListeners(); + }); + + // Script-controlled startup aligns playback with the incoming slide's fade timing. video.autoplay = false; video.loop = !(video.dataset && video.dataset.loop === '0'); video.muted = !(video.dataset && video.dataset.disableAudio === '0'); video.playsInline = true; function startPlayback() { + playbackTimer = null; + if (playbackCancelled || video.isConnected === false || root.isConnected === false) { + return; + } var playPromise = video.play && video.play(); if (playPromise && typeof playPromise.catch === 'function') { playPromise.catch(function () { @@ -29,28 +62,33 @@ function initializeRenderedVideoPlayback(root, delayMs) { } function schedulePlaybackStart() { - if (playbackScheduled) { + // Metadata and canplay can both fire; schedule only one start for this video. + if (playbackCancelled || playbackScheduled) { return; } playbackScheduled = true; + removeReadinessListeners(); if (startDelayMs > 0) { - window.setTimeout(startPlayback, startDelayMs); + playbackTimer = window.setTimeout(startPlayback, startDelayMs); return; } startPlayback(); } + function onLoadedMetadata() { + if (video.readyState >= 2) { + schedulePlaybackStart(); + } + } + + // HAVE_CURRENT_DATA means a frame is available, not just the video's metadata. if (video.readyState >= 2) { schedulePlaybackStart(); return; } video.addEventListener('canplay', schedulePlaybackStart, { once: true }); - video.addEventListener('loadedmetadata', function () { - if (video.readyState >= 2) { - schedulePlaybackStart(); - } - }, { once: true }); + video.addEventListener('loadedmetadata', onLoadedMetadata, { once: true }); }); } @@ -87,7 +125,28 @@ function initializeSlideMedia(root, delayMs) { initializeRenderedVideoPlayback(root, delayMs); } -function destroySlideMedia(root) { +function destroySlideMedia(root, options) { + if (!root) { + return; + } + + var preserveVideoFrame = Boolean(options && options.preserveVideoFrame); + var videos = root.querySelectorAll('.template-region.video video, .slide-media video'); + Array.prototype.forEach.call(videos, function (video) { + cancelRenderedVideoPlayback(video); + if (typeof video.pause === 'function') { + video.pause(); + } + // Keep the paused frame through a crossfade; release decoder/network resources at removal. + if (!preserveVideoFrame) { + video.removeAttribute('src'); + if (typeof video.load === 'function') { + video.load(); + } + } + }); + + // RTMP players hold independent HLS resources beyond the lifetime of their DOM nodes. if (typeof destroyRtmpRegions === 'function') { destroyRtmpRegions(root); } diff --git a/src/player/public/js/player-page-playback.js b/src/player/public/js/player-page-playback.js index 84a69b2..cc40e1b 100644 --- a/src/player/public/js/player-page-playback.js +++ b/src/player/public/js/player-page-playback.js @@ -1,5 +1,8 @@ +var playlistRefreshInFlight = false; + // Render the slide at the requested index within the active set. async function renderSlideAtIndex(sourceSlides, targetIndex, options) { + var renderRequestId = ++slideRenderRequestId; 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.'); @@ -8,14 +11,14 @@ async function renderSlideAtIndex(sourceSlides, targetIndex, options) { } let normalizedIndex = Number(targetIndex || 0); - if (!Number.isFinite(normalizedIndex) || normalizedIndex < 0 || normalizedIndex >= availableSlides.length) { + if (!Number.isInteger(normalizedIndex) || normalizedIndex < 0 || normalizedIndex >= availableSlides.length) { + normalizedIndex = 0; } var slideCount = availableSlides.length; var currentIndex = normalizedIndex; var slide = null; var attempts = 0; - var renderRequestId = ++slideRenderRequestId; while (attempts < slideCount) { slide = availableSlides[currentIndex]; @@ -35,7 +38,7 @@ async function renderSlideAtIndex(sourceSlides, targetIndex, options) { } } if (renderRequestId !== slideRenderRequestId) { - break; + return false; } break; } @@ -56,6 +59,13 @@ async function renderSlideAtIndex(sourceSlides, targetIndex, options) { var shouldFade = !(options && options.skipFade) && currentPlaylistFadeBetweenSlides; var mediaDelayMs = slide && slide.use_video_duration ? 0 : undefined; renderSlideMarkup(markup, shouldFade, mediaDelayMs); + if (typeof syncSlideMediaPreloads === 'function') { + syncSlideMediaPreloads(availableSlides, currentIndex); + } + if (typeof markPlayerPlaybackProgress === 'function') { + markPlayerPlaybackProgress(); + } + savePlaybackState(); if (typeof scheduleSlideMarkupPreload === 'function') { scheduleSlideMarkupPreload(availableSlides, currentIndex); } @@ -67,20 +77,6 @@ async function renderSlideAtIndex(sourceSlides, targetIndex, options) { return true; } -// Calculate the configured time from slide entry to the next transition. -function getSlideAdvanceDelay(slide) { - var durationMs = Math.max(1, Number(slide && slide.duration_seconds || 10)) * 1000; - if (slide && slide.use_video_duration) { - return currentPlaylistFadeBetweenSlides - ? getSlideHoldDelay(Math.max(1, durationMs - slideFadeLengthMs)) - : getSlideHoldDelay(durationMs); - } - if (currentPlaylistFadeBetweenSlides) { - return getSlideHoldDelay(Math.max(1, durationMs - slideFadeOffsetMs)); - } - return getSlideHoldDelay(durationMs); -} - // Promote a deferred playlist update at the next safe point. function applyPendingPlaylistUpdate() { if (!pendingPlaylistUpdate) { @@ -117,15 +113,12 @@ function showCurrent(options) { 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; - } void renderSlideAtIndex(activeSlides, index, options); lastRenderedViewKey = getCurrentRenderKey(activeSlides); } +var lastPlaylistRefreshAt = 0; + function isSlideInList(slide, slideList) { if (!slide || !Array.isArray(slideList)) { return false; @@ -163,8 +156,16 @@ function handleRtmpPlaybackFailure(message, options) { return true; } -// Fetch the latest playlist and queue any updates. -function refresh(applyImmediately) { +// Fetch and queue data updates; rendering and pause/resume own the slide timer. +function refresh(applyImmediately, bypassDebounce) { + if (playlistRefreshInFlight) { + return; + } + if (!bypassDebounce && Date.now() - lastPlaylistRefreshAt < 1000) { + return; + } + playlistRefreshInFlight = true; + lastPlaylistRefreshAt = Date.now(); var request = new XMLHttpRequest(); var url = window.location.origin + '/api/screens/' + encodeURIComponent(slug) + '/playlist?ts=' + Date.now(); request.open('GET', url, true); @@ -175,25 +176,26 @@ function refresh(applyImmediately) { if (typeof getCommandClientId === 'function') { request.setRequestHeader('x-pulse-client-id', getCommandClientId()); } - if (currentPlaylistEtag) { + if (currentPlaylistEtag + && initialData + && Array.isArray(initialData.apiSources) + && Array.isArray(initialData.weatherLocations)) { request.setRequestHeader('If-None-Match', currentPlaylistEtag); } request.onreadystatechange = function () { if (request.readyState !== 4) { return; } + playlistRefreshInFlight = false; if (request.status === 304) { if (!initialData || !Array.isArray(initialData.apiSources) || !Array.isArray(initialData.weatherLocations)) { currentPlaylistEtag = ''; - refresh(applyImmediately); + refresh(applyImmediately, true); return; } logDebug('Playlist refresh completed with no changes.'); markRefreshHealthy(); setOfflineBannerVisible(false); - if (lastRenderedSlide && getCurrentActiveSlides().length < 2) { - scheduleSlideAdvance(getSlideAdvanceDelay(lastRenderedSlide)); - } return; } if (request.status < 200 || request.status >= 300) { @@ -249,7 +251,6 @@ function refresh(applyImmediately) { }); markRefreshHealthy(); setOfflineBannerVisible(false); - const currentActiveSlides = getCurrentActiveSlides(); if (responseEtag) { currentPlaylistEtag = responseEtag; } @@ -268,9 +269,6 @@ function refresh(applyImmediately) { showCurrent({ skipFade: true }); return; } - if (currentActiveSlides.length < 2 && lastRenderedSlide) { - scheduleSlideAdvance(getSlideAdvanceDelay(lastRenderedSlide)); - } return; } syncWebpagePreloads(nextActiveSlides, index); @@ -287,16 +285,6 @@ function refresh(applyImmediately) { fadeBetweenSlides: nextFadeBetweenSlides, skipUnavailableRtmp: nextSkipUnavailableRtmp }; - if (applyImmediately) { - applyPendingPlaylistUpdate(); - showCurrent(); - return; - } - if (!isSlideInList(lastRenderedSlide, nextSlides)) { - applyPendingPlaylistUpdate(); - showCurrent(); - return; - } logDebug('Playlist update detected; applying on next slide transition.'); return; } @@ -306,11 +294,6 @@ function refresh(applyImmediately) { fadeBetweenSlides: nextFadeBetweenSlides, skipUnavailableRtmp: nextSkipUnavailableRtmp }; - if (applyImmediately) { - applyPendingPlaylistUpdate(); - showCurrent(); - return; - } logDebug('Playlist update detected; applying on next slide transition.'); } catch (_error) { logDebug( @@ -323,6 +306,7 @@ function refresh(applyImmediately) { } }; request.onerror = function () { + playlistRefreshInFlight = false; logDebug( 'Unable to load screen playlist.', ['URL: ' + url, 'Network error during request.'].join(' | '), @@ -330,11 +314,9 @@ function refresh(applyImmediately) { ); setOfflineBannerVisible(true); scheduleRefreshRetry(); - if (lastRenderedSlide && getCurrentActiveSlides().length < 2) { - scheduleSlideAdvance(getSlideAdvanceDelay(lastRenderedSlide)); - } }; request.ontimeout = function () { + playlistRefreshInFlight = false; logDebug( 'Playlist refresh timed out.', ['URL: ' + url, 'Timeout after ' + request.timeout + 'ms'].join(' | '), @@ -342,9 +324,6 @@ function refresh(applyImmediately) { ); setOfflineBannerVisible(true); scheduleRefreshRetry(); - if (lastRenderedSlide && getCurrentActiveSlides().length < 2) { - scheduleSlideAdvance(getSlideAdvanceDelay(lastRenderedSlide)); - } }; request.send(); } diff --git a/src/player/public/js/player-page-playlist.js b/src/player/public/js/player-page-playlist.js index 73706d2..9a3ccee 100644 --- a/src/player/public/js/player-page-playlist.js +++ b/src/player/public/js/player-page-playlist.js @@ -158,6 +158,148 @@ function scheduleSlideMarkupPreload(sourceSlides, targetIndex) { }, 0); } +function deferVideoSourcesForPreload(markup) { + return String(markup || '').replace(/(]*?)\s+src=("([^"]*)"|'([^']*)')/gi, function (_match, openingTag, quote, doubleQuoted, singleQuoted) { + const source = doubleQuoted !== undefined ? doubleQuoted : singleQuoted; + return openingTag + ' data-pulse-video-src=' + quote + source + quote; + }); +} + +function clearSlideMediaPreloads() { + mediaPreloadElements.forEach(function (element) { + if (!element || element.tagName !== 'VIDEO' || element.parentNode) { + return; + } + if (typeof element.pause === 'function') { + element.pause(); + } + if (typeof element.removeAttribute === 'function') { + element.removeAttribute('src'); + } + if (typeof element.load === 'function') { + element.load(); + } + }); + mediaPreloadElements = []; + mediaPreloadSignature = ''; +} + +function promotePreloadedVideoElements(root, slideId) { + if (!root || typeof root.querySelectorAll !== 'function') { + return 0; + } + + var normalizedSlideId = String(slideId || ''); + var promotedElements = []; + Array.prototype.forEach.call(root.querySelectorAll('.template-region.video video, .slide-media video'), function (activeVideo) { + var activeSource = String(activeVideo && (activeVideo.getAttribute('data-pulse-video-src') || activeVideo.getAttribute('src') || activeVideo.src) || '').trim(); + if (!activeSource || !activeVideo.parentNode) { + return; + } + var absoluteSource = new URL(activeSource, window.location.origin).toString(); + var preloadedVideo = mediaPreloadElements.find(function (element) { + return element && element.tagName === 'VIDEO' + && String(element.__pulsePreloadSlideId || '') === normalizedSlideId + && String(element.src || '').trim() === absoluteSource; + }); + if (!preloadedVideo) { + if (activeVideo.getAttribute('data-pulse-video-src')) { + activeVideo.removeAttribute('data-pulse-video-src'); + activeVideo.setAttribute('src', activeSource); + } + return; + } + + Array.prototype.forEach.call(activeVideo.attributes || [], function (attribute) { + var attributeName = String(attribute.name || '').toLowerCase(); + if (attributeName !== 'src' && attributeName !== 'data-pulse-video-src') { + preloadedVideo.setAttribute(attribute.name, attribute.value); + } + }); + preloadedVideo.preload = activeVideo.preload || 'auto'; + preloadedVideo.muted = Boolean(activeVideo.muted); + preloadedVideo.loop = Boolean(activeVideo.loop); + preloadedVideo.playsInline = Boolean(activeVideo.playsInline); + preloadedVideo.autoplay = Boolean(activeVideo.autoplay); + preloadedVideo.removeAttribute('data-pulse-video-src'); + if (String(preloadedVideo.src || '').trim() !== absoluteSource) { + preloadedVideo.src = absoluteSource; + } + activeVideo.parentNode.replaceChild(preloadedVideo, activeVideo); + promotedElements.push(preloadedVideo); + }); + + if (promotedElements.length) { + mediaPreloadElements = mediaPreloadElements.filter(function (element) { + return promotedElements.indexOf(element) === -1; + }); + } + + return promotedElements.length; +} + +function syncSlideMediaPreloads(sourceSlides, targetIndex) { + var availableSlides = Array.isArray(sourceSlides) ? sourceSlides : []; + if (availableSlides.length < 2) { + clearSlideMediaPreloads(); + return; + } + var currentIndex = Math.min(availableSlides.length - 1, Math.max(0, Number(targetIndex || 0))); + var nextSlide = availableSlides[(currentIndex + 1) % availableSlides.length]; + if (!nextSlide || typeof primeSlideMarkup !== 'function' || typeof document === 'undefined') { + clearSlideMediaPreloads(); + return; + } + + var signature = [ + currentPlaylistSignature || '', + nextSlide.id || '', + nextSlide.modified_at || '', + window.innerWidth + 'x' + window.innerHeight + ].join('|'); + if (signature === mediaPreloadSignature) { + return; + } + + clearSlideMediaPreloads(); + mediaPreloadSignature = signature; + + var holder = document.createElement('div'); + holder.innerHTML = deferVideoSourcesForPreload(primeSlideMarkup(nextSlide) || ''); + var mediaUrls = []; + Array.prototype.forEach.call(holder.querySelectorAll('img[src], video[data-pulse-video-src]'), function (element) { + var isVideo = element.tagName === 'VIDEO'; + var src = String(element.getAttribute(isVideo ? 'data-pulse-video-src' : 'src') || '').trim(); + if (!src || mediaUrls.indexOf(src) !== -1) { + return; + } + mediaUrls.push(src); + var absoluteUrl = new URL(src, window.location.origin).toString(); + if (element.tagName === 'VIDEO') { + var video = document.createElement('video'); + Array.prototype.forEach.call(element.attributes || [], function (attribute) { + if (String(attribute.name || '').toLowerCase() !== 'src') { + video.setAttribute(attribute.name, attribute.value); + } + }); + video.preload = 'auto'; + video.muted = true; + video.playsInline = true; + video.__pulsePreloadSlideId = String(nextSlide.id || ''); + video.src = absoluteUrl; + if (typeof video.load === 'function') { + video.load(); + } + mediaPreloadElements.push(video); + return; + } + var image = new Image(); + image.decoding = 'async'; + image.src = absoluteUrl; + mediaPreloadElements.push(image); + }); +} + // Mount hidden iframe preloads for the chosen webpage URLs. function syncWebpagePreloads(sourceSlides, targetIndex) { const urls = getWebpageUrls(getWebpagePreloadSlides(sourceSlides, targetIndex)); @@ -247,6 +389,7 @@ function savePlaylistSnapshot(data) { slides: Array.isArray(data && data.slides) ? data.slides : [], signature: String(data && data.signature || ''), fadeBetweenSlides: Boolean(data && data.fadeBetweenSlides), + skipUnavailableRtmp: Boolean(data && data.skipUnavailableRtmp), etag: String(data && data.etag || ''), savedAt: new Date().toISOString() })); @@ -263,6 +406,7 @@ function applyPlaylistSnapshot(data) { slides = data.slides.map(normalizeSlide); currentPlaylistSignature = String(data.signature || ''); currentPlaylistFadeBetweenSlides = Boolean(data.fadeBetweenSlides); + currentPlaylistSkipUnavailableRtmp = Boolean(data.skipUnavailableRtmp); currentPlaylistEtag = String(data.etag || ''); pendingPlaylistUpdate = null; clearActiveSlidesCache(); @@ -272,4 +416,62 @@ function applyPlaylistSnapshot(data) { renderCacheViewportKey = ''; index = 0; return true; +} + +function loadPlaybackState() { + try { + var raw = window.localStorage.getItem(playbackStateStorageKey); + if (!raw) { + return null; + } + var parsed = JSON.parse(raw); + if (!parsed || typeof parsed !== 'object') { + return null; + } + return { + signature: String(parsed.signature || ''), + slideId: parsed.slideId === null || parsed.slideId === undefined ? null : String(parsed.slideId), + index: Number.isFinite(Number(parsed.index)) ? Number(parsed.index) : 0, + paused: Boolean(parsed.paused), + blackout: Boolean(parsed.blackout) + }; + } catch (_error) { + return null; + } +} + +function savePlaybackState() { + try { + window.localStorage.setItem(playbackStateStorageKey, JSON.stringify({ + signature: String(currentPlaylistSignature || ''), + slideId: lastRenderedSlide && lastRenderedSlide.id !== undefined ? String(lastRenderedSlide.id) : null, + index: Number(index || 0), + paused: Boolean(isPaused), + blackout: Boolean(isBlackout), + savedAt: new Date().toISOString() + })); + } catch (_error) { + // Ignore storage errors so playback remains unaffected. + } +} + +function restorePlaybackState() { + var state = loadPlaybackState(); + if (!state || state.signature !== String(currentPlaylistSignature || '')) { + return false; + } + + var restoredIndex = state.index; + var matchingSlideIndex = slides.findIndex(function (slide) { + return slide && state.slideId !== null && String(slide.id) === state.slideId; + }); + if (matchingSlideIndex >= 0) { + restoredIndex = matchingSlideIndex; + } + if (slides.length) { + index = Math.min(Math.max(0, Number(restoredIndex) || 0), slides.length - 1); + } + isPaused = state.paused; + isBlackout = state.blackout; + return true; } \ No newline at end of file diff --git a/src/player/public/js/player-page-rendering.js b/src/player/public/js/player-page-rendering.js index 1e5bd9a..9755fea 100644 --- a/src/player/public/js/player-page-rendering.js +++ b/src/player/public/js/player-page-rendering.js @@ -1,28 +1,21 @@ // General sanitization and sizing helpers. // Strip unsupported characters from a font family string. -function sanitizeFontFamily(value) { - return String(value || '').replace(/[^a-zA-Z0-9 ,\"-]/g, '').trim(); -} - -function normalizeStyleAttributeValue(value) { - return String(value || '') - .replace(/"/g, '"') - .replace(/'/g, "'") - .replace(/&quot;/g, '"') - .replace(/&#39;/g, "'"); -} - -function sanitizeFontSize(value) { - return Math.max(8, Number(value || 0) || 24); -} - -function sanitizeTextColor(value, fallback) { - var raw = String(value || '').trim(); - if (/^#[0-9a-fA-F]{6}$/.test(raw) || /^#[0-9a-fA-F]{3}$/.test(raw)) { - return raw; - } - return fallback || '#000000'; -} +var playerRenderingShared = window.pulsePlayerRenderingShared; +var escapeHtml = playerRenderingShared.escapeHtml; +var normalizeStyleAttributeValue = playerRenderingShared.normalizeStyleAttributeValue; +var sanitizeFontFamily = playerRenderingShared.sanitizeFontFamily; +var sanitizeFontSize = playerRenderingShared.sanitizeFontSize; +var sanitizeTextColor = playerRenderingShared.sanitizeTextColor; +var sanitizeRichTextAttributes = playerRenderingShared.sanitizeRichTextAttributes; +var sanitizeRichText = playerRenderingShared.sanitizeRichText; +var renderEditorJsBlock = playerRenderingShared.renderEditorJsBlock; +var renderEditorJsListItem = playerRenderingShared.renderEditorJsListItem; +var renderEditorJsTable = playerRenderingShared.renderEditorJsTable; +var renderEditorJsContent = playerRenderingShared.renderEditorJsContent; +var parseMaybeJson = playerRenderingShared.parseMaybeJson; +var normalizeContentValue = playerRenderingShared.normalizeContentValue; +var fitCanvasSize = playerRenderingShared.fitCanvasSize; +var decorateRegionMarkup = playerRenderingShared.decorateRegionMarkup; function getTemplateCanvasSize(template) { return { @@ -31,6 +24,17 @@ function getTemplateCanvasSize(template) { }; } +function selectPlayerMediaSource(originalSource, variants, targetDimension) { + var original = String(originalSource || '').trim(); + var target = Math.max(1, Number(targetDimension || 0) || 1); + var candidates = (Array.isArray(variants) ? variants : []).filter(function (variant) { + return variant && String(variant.url || '').trim() && Number(variant.width) >= target; + }).sort(function (left, right) { + return Number(left.width) - Number(right.width); + }); + return candidates.length ? String(candidates[0].url) : original; +} + function getPlaylistRevision(data) { if (data && data.revision) { return String(data.revision); @@ -44,36 +48,6 @@ function getPlaylistRevision(data) { return String(Date.now()); } -function fitCanvasSize(canvasWidth, canvasHeight, maxWidth, maxHeight) { - var width = Math.max(1, Number(canvasWidth || 0) || 1920); - var height = Math.max(1, Number(canvasHeight || 0) || 1080); - var viewportWidth = Math.max(1, Number(maxWidth || 0) || width); - var viewportHeight = Math.max(1, Number(maxHeight || 0) || height); - var scale = Math.min(viewportWidth / width, viewportHeight / height); - return { - width: Math.round(width * scale), - height: Math.round(height * scale) - }; -} - -function hasPlayerAnimation(config) { - return Boolean(config && ['intro', 'outro', 'loop'].some(function (stepName) { - var preset = String((config[stepName] && config[stepName].preset) || '').trim(); - return preset && preset !== '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 setPlayerCanvasDimensions(canvasWidth, canvasHeight) { if (!document || !document.documentElement) { return; @@ -85,264 +59,9 @@ function setPlayerCanvasDimensions(canvasWidth, canvasHeight) { 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 = { - 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'], - i: ['class', 'style', 'aria-hidden'], - 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'] - }; - const allowed = allowedAttributes[tagName] || []; - if (!allowed.length) { - 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(); - 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 + '="' + escapeHtml(lowerKey === 'style' ? normalizeStyleAttributeValue(value) : value) + '"'); - return ''; - }); - - return attrs.join(''); -} - -// Remove unsafe markup while preserving richer rich-text formatting. -function sanitizeRichText(html) { - var output = String(html || ''); - output = output.replace(//gi, ''); - output = output.replace(//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 attrText = String(match[3] || ''); - if (ALLOWED_RICH_TEXT_TAGS.indexOf(name) === -1) { - return ''; - } - if (closing) { - return ''; - } - return '<' + name + sanitizeRichTextAttributes(name, attrText) + '>'; - }); -} - -// Render a single Editor.js block to HTML. -function renderEditorJsBlock(block) { - if (!block || !block.type || !block.data) { - return ''; - } - - if (block.type === 'header') { - var level = Math.max(1, Math.min(6, Number(block.data.level || 2))); - return '' + sanitizeRichText(block.data.text || '') + ''; - } - - if (block.type === 'list') { - var tag = block.data.style === 'ordered' ? 'ol' : 'ul'; - var items = Array.isArray(block.data.items) ? block.data.items : []; - return '<' + tag + ' style="list-style-type:' + (tag === 'ol' ? 'decimal' : 'disc') + ';padding-left:1.4em;">' + items.map(function (item) { return renderEditorJsListItem(item, tag); }).join('') + ''; - } - - if (block.type === 'delimiter') { - return '
'; - } - - if (block.type === 'code') { - return '
' + escapeHtml(block.data.code || '') + '
'; - } - - if (block.type === 'table') { - return renderEditorJsTable(block.data); - } - - if (block.type === 'paragraph') { - return '

' + sanitizeRichText(block.data.text || '') + '

'; - } - - return ''; -} - -// Render a list item and any nested sub-items. -function renderEditorJsListItem(item, tag) { - if (item && typeof item === 'object') { - var content = item.content !== undefined ? item.content : (item.text !== undefined ? item.text : item.value !== undefined ? item.value : ''); - var children = Array.isArray(item.items) ? item.items : Array.isArray(item.subItems) ? item.subItems : Array.isArray(item.children) ? item.children : []; - var nested = children.length ? '<' + tag + ' style="list-style-type:' + (tag === 'ol' ? 'decimal' : 'disc') + ';padding-left:1.4em;">' + children.map(function (child) { return renderEditorJsListItem(child, tag); }).join('') + '' : ''; - return '
  • ' + sanitizeRichText(content || '') + nested + '
    • '; - } - return '
  • ' + sanitizeRichText(item || '') + '
    • '; -} - -// Render an Editor.js table block. -function renderEditorJsTable(data) { - var rows = Array.isArray(data.content) ? data.content : Array.isArray(data.rows) ? data.rows : []; - if (!rows.length) { - return ''; - } - var hasHeadings = Boolean(data.withHeadings); - var tableRows = rows.map(function (row, rowIndex) { - var cells = Array.isArray(row) ? row : []; - var cellTag = hasHeadings && rowIndex === 0 ? 'th' : 'td'; - var cellAttrs = cellTag === 'th' ? ' scope="col"' : ''; - return '' + cells.map(function (cell) { - return '<' + cellTag + cellAttrs + '>' + sanitizeRichText(cell || '') + ''; - }).join('') + ''; - }).join(''); - return '' + tableRows + '
    '; -} - -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 '

    ' + raw + '

    '; -} - -// Render Editor.js JSON or plain content safely. -function renderEditorJsContent(value) { - if (value && typeof value === 'object') { - if (Array.isArray(value.blocks)) { - return value.blocks.map(renderEditorJsBlock).join(''); - } - if (value.value !== undefined) { - return renderEditorJsContent(value.value); - } - } - var raw = String(value || ''); - try { - var parsed = JSON.parse(raw); - if (parsed && Array.isArray(parsed.blocks)) { - return parsed.blocks.map(renderEditorJsBlock).join(''); - } - } catch (_error) { - // fall through to legacy HTML rendering - } - return wrapRichTextParagraph(sanitizeRichText(raw)); -} - -// Parse string values that look like JSON. -function parseMaybeJson(value) { - if (typeof value !== 'string') { - return value; - } - var raw = value.trim(); - if (!raw) { - return value; - } - if (raw.charAt(0) !== '{' && raw.charAt(0) !== '[') { - return value; - } - try { - return JSON.parse(raw); - } catch (_error) { - return value; - } -} - -// Normalize a slide region's stored content value. -function normalizeContentValue(value) { - var normalized; - if (!value || typeof value !== 'object') { - return { - type: 'text', - value: parseMaybeJson(value) - }; - } - normalized = {}; - Object.keys(value).forEach(function (key) { - normalized[key] = value[key]; - }); - if (normalized.value !== undefined) { - normalized.value = parseMaybeJson(normalized.value); - } - if (normalized.font_family !== undefined && normalized.font_family !== null) { - normalized.font_family = sanitizeFontFamily(normalized.font_family); - } - if (normalized.font_size !== undefined && normalized.font_size !== null) { - normalized.font_size = sanitizeFontSize(normalized.font_size); - } - if (normalized.font_color !== undefined && normalized.font_color !== null) { - normalized.font_color = sanitizeTextColor(normalized.font_color); - } - if (!normalized.type) { - normalized.type = 'text'; - } - return normalized; -} - // Normalize a slide and its nested region content. function normalizeSlide(slide) { - var normalized = {}; - var content; - Object.keys(slide || {}).forEach(function (key) { - normalized[key] = slide[key]; - }); - normalized.content = {}; - content = slide && slide.content && typeof slide.content === 'object' ? slide.content : {}; - Object.keys(content).forEach(function (regionKey) { - normalized.content[regionKey] = normalizeContentValue(content[regionKey]); - }); + var normalized = playerRenderingShared.normalizeSlide(slide); if (normalized.use_video_duration && normalized.template && Array.isArray(normalized.template.regions)) { normalized.template.regions.forEach(function (region) { if (region && region.region_type === 'video' && normalized.content[region.region_key]) { @@ -520,6 +239,8 @@ function getTemplateLayout(template) { baseStyle: baseStyle, pixelWidth: pixelWidth, pixelHeight: pixelHeight, + canvasWidth: templateCanvas.width, + canvasHeight: templateCanvas.height, fontFamily: region.font_family || null, fontSize: region.font_size || null, fontColor: region.font_color || null, @@ -530,7 +251,7 @@ function getTemplateLayout(template) { var layout = { canvasWidth: canvasSize.width, canvasHeight: canvasSize.height, - background: template.background_image_path ? '' : '', + background: template.background_image_path ? '' : '', backgroundColor: template.background_color || '#111111', backgroundGradient: template.background_gradient || '', regions: regions @@ -641,7 +362,8 @@ function renderTemplateSlideMarkup(slide) { animationConfig: normalizePlayerAnimationConfig(region.animationJson) }); }).join('') : ''; - const stageStyle = layout ? buildBackdropStyle(layout.backgroundColor || '#111111', template.background_image_path, layout.backgroundGradient) : ''; + const backgroundPath = layout ? selectPlayerMediaSource(template.background_image_path, template.background_image_variants, Math.max(layout.canvasWidth, layout.canvasHeight)) : ''; + const stageStyle = layout ? buildBackdropStyle(layout.backgroundColor || '#111111', backgroundPath, layout.backgroundGradient) : ''; if (layout) { setPlayerCanvasDimensions(layout.canvasWidth, layout.canvasHeight); } diff --git a/src/player/public/js/player-page-transition.js b/src/player/public/js/player-page-transition.js index 52ce3d8..7e05a43 100644 --- a/src/player/public/js/player-page-transition.js +++ b/src/player/public/js/player-page-transition.js @@ -1,6 +1,56 @@ // Slide transition timing, cancellation, and outgoing animation coordination. var slideOutroTimers = []; +var slideTransitionRequestId = 0; +var playerWatchdogTimer = null; +var playerLastProgressAt = Date.now(); +var playerWatchdogRecoveryKey = 'pulse-signage-player-watchdog-recoveries'; + +function markPlayerPlaybackProgress() { + playerLastProgressAt = Date.now(); + try { + window.sessionStorage.removeItem(playerWatchdogRecoveryKey); + } catch (_error) { + // Session storage may be unavailable in restricted kiosk profiles. + } +} + +function startPlayerWatchdog() { + if (playerWatchdogTimer || typeof window.setInterval !== 'function') { + return; + } + + playerWatchdogTimer = window.setInterval(function () { + if (document.visibilityState === 'hidden' || isPaused || !slides.length || !lastRenderedSlide) { + return; + } + + var expectedDurationMs = Math.max(10000, Number(getSlideAdvanceDelay(lastRenderedSlide) || 10000)); + if (Date.now() - playerLastProgressAt <= (expectedDurationMs * 2) + 15000) { + return; + } + + var recoveryCount = 0; + try { + recoveryCount = Number(window.sessionStorage.getItem(playerWatchdogRecoveryKey) || 0); + } catch (_error) { + recoveryCount = 0; + } + if (recoveryCount >= 2) { + return; + } + + try { + window.sessionStorage.setItem(playerWatchdogRecoveryKey, String(recoveryCount + 1)); + } catch (_error) { + // Continue with the reload if session storage is unavailable. + } + if (typeof logDebug === 'function') { + logDebug('Player watchdog is reloading a stalled playback page.', 'No slide progress detected.', 'error'); + } + window.location.reload(); + }, 30000); +} // Cancel the current slide-advance timer. function clearSlideTimer() { @@ -92,13 +142,148 @@ function getSlideHoldDelay(delayMs) { // Calculate the configured time from slide entry to the next transition. function getSlideAdvanceDelay(slide) { - return getSlideHoldDelay(Math.max(1, Number(slide && slide.duration_seconds || 10)) * 1000); + var durationMs = Math.max(1, Number(slide && slide.duration_seconds || 10)) * 1000; + // Video-duration slides start immediately; other slides start midway through the fade. + if (slide && slide.use_video_duration) { + return currentPlaylistFadeBetweenSlides + ? getSlideHoldDelay(Math.max(1, durationMs - slideFadeLengthMs)) + : getSlideHoldDelay(durationMs); + } + if (currentPlaylistFadeBetweenSlides) { + return getSlideHoldDelay(Math.max(1, durationMs - slideFadeOffsetMs)); + } + return getSlideHoldDelay(durationMs); } -// Cancel any pending fade-transition cleanup. +// Cancel fade cleanup and invalidate callbacks already queued for an older transition. function clearSlideTransitionTimer() { + slideTransitionRequestId += 1; if (slideTransitionTimer) { window.clearTimeout(slideTransitionTimer); slideTransitionTimer = null; } } + +// Swap slide markup with optional fade animation. +function renderSlideMarkup(markup, shouldFade, mediaDelayMs) { + clearSlideTransitionTimer(); + var transitionRequestId = slideTransitionRequestId; + if (typeof deferVideoSourcesForPreload === 'function') { + markup = deferVideoSourcesForPreload(markup); + } + // Stop outgoing region activity before overlapping its shell with the incoming slide. + destroyRegionInstances(app); + if (typeof destroySlideMedia === 'function') { + destroySlideMedia(app, { preserveVideoFrame: shouldFade }); + } + + function schedulePostRenderSetup(root, delayMs) { + if (!root) { + return; + } + + if (root.isConnected === false) { + return; + } + + initializeRegionInstances(root); + if (typeof initializeSlideMedia === 'function') { + initializeSlideMedia(root, delayMs); + } + + if (typeof playRegionAnimations === 'function') { + playRegionAnimations(root, 'intro'); + } + } + + if (!shouldFade) { + app.innerHTML = markup; + if (typeof promotePreloadedVideoElements === 'function') { + promotePreloadedVideoElements(app, lastRenderedSlide && lastRenderedSlide.id); + } + schedulePostRenderSetup(app, 0); + return app.firstElementChild; + } + + var topLevelChildren = Array.prototype.slice.call(app.children || []); + var existingShells = topLevelChildren.filter(function (child) { + return child && child.classList && child.classList.contains('slide-shell'); + }); + var previousShell = existingShells.length ? existingShells[existingShells.length - 1] : app.firstElementChild; + + if (existingShells.length > 1) { + // Rapid navigation can interrupt cleanup, leaving older crossfade shells behind. + existingShells.slice(0, -1).forEach(function (shell) { + if (shell && shell.parentNode) { + if (typeof destroySlideMedia === 'function') { + destroySlideMedia(shell); + } + shell.parentNode.removeChild(shell); + } + }); + } + + var nextShell = document.createElement('div'); + nextShell.className = 'slide-shell slide-shell-entering'; + nextShell.style.zIndex = '0'; + nextShell.style.opacity = '0'; + nextShell.innerHTML = markup; + if (typeof promotePreloadedVideoElements === 'function') { + promotePreloadedVideoElements(nextShell, lastRenderedSlide && lastRenderedSlide.id); + } + + if (!previousShell || (previousShell.classList && previousShell.classList.contains('empty'))) { + if (previousShell && typeof destroySlideMedia === 'function') { + destroySlideMedia(app); + } + app.innerHTML = ''; + nextShell.style.opacity = '1'; + nextShell.classList.remove('slide-shell-entering'); + nextShell.classList.add('is-visible'); + app.appendChild(nextShell); + schedulePostRenderSetup(nextShell, mediaDelayMs === undefined ? slideFadeOffsetMs : mediaDelayMs); + return nextShell; + } + + if (!previousShell.classList.contains('slide-shell')) { + previousShell.classList.add('slide-shell'); + } + previousShell.classList.remove('is-visible'); + previousShell.classList.add('is-exiting'); + previousShell.style.zIndex = '1'; + previousShell.style.opacity = '1'; + + app.appendChild(nextShell); + // Commit the initial opacity before starting the crossfade on the next paint frame. + window.requestAnimationFrame(function () { + if (transitionRequestId !== slideTransitionRequestId) { + return; + } + nextShell.style.opacity = '1'; + previousShell.style.opacity = '0'; + nextShell.classList.remove('slide-shell-entering'); + nextShell.classList.add('is-visible'); + schedulePostRenderSetup(nextShell, mediaDelayMs === undefined ? slideFadeOffsetMs : mediaDelayMs); + }); + + slideTransitionTimer = window.setTimeout(function () { + if (transitionRequestId !== slideTransitionRequestId) { + return; + } + if (previousShell && previousShell.parentNode) { + if (typeof destroySlideMedia === 'function') { + destroySlideMedia(previousShell); + } + previousShell.parentNode.removeChild(previousShell); + } + if (nextShell) { + nextShell.style.zIndex = '1'; + nextShell.style.opacity = '1'; + nextShell.classList.remove('slide-shell-entering'); + nextShell.classList.add('is-visible'); + } + slideTransitionTimer = null; + }, slideFadeLengthMs); + + return nextShell; +} diff --git a/src/player/public/js/player-region-registry.js b/src/player/public/js/player-region-registry.js index 2f6c914..c51fbdf 100644 --- a/src/player/public/js/player-region-registry.js +++ b/src/player/public/js/player-region-registry.js @@ -31,4 +31,39 @@ get: get, list: list }; -}()); \ No newline at end of file +}()); + +function getPlayerRegionModules() { + if (!window.pulsePlayerRegionTypes || typeof window.pulsePlayerRegionTypes.list !== 'function') { + return []; + } + + return window.pulsePlayerRegionTypes.list(); +} + +function runRegionLifecycle(root, lifecycleName) { + if (!root) { + 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'); +} \ No newline at end of file diff --git a/src/player/public/sw.js b/src/player/public/sw.js index b1af83a..1d79a2e 100644 --- a/src/player/public/sw.js +++ b/src/player/public/sw.js @@ -5,6 +5,7 @@ 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}`; const PLAYLIST_CACHE = `pulse-signage-player-playlists-${CACHE_VERSION}`; +const PLAYER_CACHE_PREFIX = 'pulse-signage-player-'; function normalizeRequest(request) { const url = new URL(request.url); @@ -34,8 +35,13 @@ async function cacheResponse(cacheName, request, response, cacheKeyRequest) { if (!response || !response.ok) { return; } - const cache = await caches.open(cacheName); - await cache.put(cacheKeyRequest || request, response.clone()); + // Cache storage is best-effort; quota or storage failures must not discard a live response. + try { + const cache = await caches.open(cacheName); + await cache.put(cacheKeyRequest || request, response.clone()); + } catch (_error) { + return; + } } async function networkFirst(request, cacheName, cacheKeyRequest) { @@ -114,10 +120,22 @@ self.addEventListener('install', function (event) { self.addEventListener('activate', function (event) { event.waitUntil((async function () { - const expected = [PAGE_CACHE, ASSET_CACHE, MEDIA_CACHE, PLAYLIST_CACHE]; const keys = await caches.keys(); + const playerCacheVersions = keys.filter(function (key) { + return key.startsWith(PLAYER_CACHE_PREFIX); + }).map(function (key) { + return key.slice(PLAYER_CACHE_PREFIX.length).replace(/^(?:pages|assets|media|playlists)-/, ''); + }).filter(Boolean); + const previousVersion = playerCacheVersions.reverse().find(function (version) { + return version !== CACHE_VERSION; + }); + const retainedVersions = new Set([CACHE_VERSION, previousVersion].filter(Boolean)); await Promise.all(keys.filter(function (key) { - return expected.indexOf(key) === -1; + if (!key.startsWith(PLAYER_CACHE_PREFIX)) { + return false; + } + const version = key.slice(PLAYER_CACHE_PREFIX.length).replace(/^(?:pages|assets|media|playlists)-/, ''); + return !retainedVersions.has(version); }).map(function (key) { return caches.delete(key); })); @@ -145,6 +163,11 @@ self.addEventListener('fetch', function (event) { return; } + if (url.pathname.startsWith('/assets/player-script/')) { + event.respondWith(networkFirst(request, ASSET_CACHE)); + return; + } + if (url.pathname.startsWith('/assets/')) { event.respondWith(cacheFirst(request, ASSET_CACHE)); return; diff --git a/src/player/regions/api.js b/src/player/regions/api.js index fe0db28..e6acb7e 100644 --- a/src/player/regions/api.js +++ b/src/player/regions/api.js @@ -112,28 +112,8 @@ function getApiPreviewFallback(item) { 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 = normalizeRenderableValue(regionContent && regionContent.value !== undefined ? regionContent.value : ''); + var content = window.pulsePlayerRenderingShared.normalizeRegionValue(regionContent && regionContent.value !== undefined ? regionContent.value : '', ['value', 'text', 'html']); 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 : ''; diff --git a/src/player/regions/chart.js b/src/player/regions/chart.js new file mode 100644 index 0000000..2becead --- /dev/null +++ b/src/player/regions/chart.js @@ -0,0 +1,55 @@ +// Chart region rendering and lifecycle management. + +var registry = window.pulsePlayerRegionTypes; +var chartInstances = []; + +function getChartData(regionContent) { + var sources = Array.isArray(window.initialData && window.initialData.apiSources) ? window.initialData.apiSources : []; + return window.pulseChartData.fromContent(regionContent || {}, sources); +} + +function renderChartRegion(region, regionContent) { + var canvasId = 'player-chart-' + String(region && (region.regionKey || region.label) || '').replace(/[^a-zA-Z0-9_-]/g, '-'); + var chartJson = escapeHtml(JSON.stringify(regionContent || {})); + return '
    '; +} + +function initChartRegions(root) { + if (typeof window.Chart !== 'function' || !window.pulseChartData || !root || !root.querySelectorAll) { + return; + } + + root.querySelectorAll('.template-region.chart canvas').forEach(function (canvas) { + var region = canvas.parentElement; + var regionKey = region && region.getAttribute('data-region-key'); + var content = {}; + try { + content = JSON.parse(canvas.getAttribute('data-chart-json') || '{}'); + } catch (_error) { + content = {}; + } + var chartData = getChartData(content); + var chart = new window.Chart(canvas.getContext('2d'), { + type: chartData.type, + data: { labels: chartData.labels, datasets: chartData.datasets }, + options: window.pulseChartData.getChartOptions(chartData) + }); + chartInstances.push({ canvas: canvas, chart: chart, regionKey: regionKey }); + }); +} + +function destroyChartRegions(root) { + chartInstances = chartInstances.filter(function (entry) { + if (!entry || !entry.canvas || !root || !root.contains(entry.canvas)) { + return true; + } + entry.chart.destroy(); + return false; + }); +} + +registry.register('chart', { + renderRegion: renderChartRegion, + initRegion: initChartRegions, + destroyRegion: destroyChartRegions +}); diff --git a/src/player/regions/html.js b/src/player/regions/html.js index a54efb4..b2625a4 100644 --- a/src/player/regions/html.js +++ b/src/player/regions/html.js @@ -2,46 +2,13 @@ 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 String(value === undefined || value === null ? '' : value); -} - -function buildHtmlDocument(html) { - var raw = String(html || '').trim(); - if (!raw) { - return ''; - } - - if (/^' + raw + ''; -} - function renderHtmlRegionContent(value) { - var html = normalizeRenderableValue(value).trim(); + var html = window.pulsePlayerRenderingShared.normalizeRenderableString(value, ['value', 'text', 'html', 'content']).trim(); if (!html) { return ''; } if (/^'; + return ''; } return '
    ' + html + '
    '; } diff --git a/src/player/regions/image.js b/src/player/regions/image.js index f5811f0..b01790a 100644 --- a/src/player/regions/image.js +++ b/src/player/regions/image.js @@ -3,7 +3,7 @@ var registry = window.pulsePlayerRegionTypes; function renderImageRegion(region, regionContent) { - var src = regionContent.value || ''; + var src = selectPlayerMediaSource(regionContent.value || '', regionContent.media_variants, Math.max(region.canvasWidth || 0, region.canvasHeight || 0)); if (!String(src || '').trim()) { return ''; } diff --git a/src/player/regions/rss.js b/src/player/regions/rss.js index 6fd3992..d8b8a22 100644 --- a/src/player/regions/rss.js +++ b/src/player/regions/rss.js @@ -11,26 +11,6 @@ function getDefaultStyle() { }; } -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); @@ -99,7 +79,7 @@ function substituteRssVariables(html, item, feedId) { } function renderRssRegion(region, regionContent) { - var content = normalizeRenderableValue(regionContent && regionContent.value !== undefined ? regionContent.value : ''); + var content = window.pulsePlayerRenderingShared.normalizeRegionValue(regionContent && regionContent.value !== undefined ? regionContent.value : '', ['value', 'text', 'html']); var feedId = regionContent && regionContent.feed_id !== undefined ? regionContent.feed_id : null; var itemNumber = regionContent && regionContent.item_number !== undefined ? regionContent.item_number : 1; var defaultStyle = getDefaultStyle(); diff --git a/src/player/regions/text.js b/src/player/regions/text.js index e2b235b..4c341f6 100644 --- a/src/player/regions/text.js +++ b/src/player/regions/text.js @@ -10,28 +10,8 @@ function getDefaultStyle() { }; } -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 rawValue = normalizeRenderableValue(regionContent && regionContent.value !== undefined ? regionContent.value : ''); + var rawValue = window.pulsePlayerRenderingShared.normalizeRegionValue(regionContent && regionContent.value !== undefined ? regionContent.value : '', ['value', 'text', 'html']); if (!String(rawValue || '').trim()) { return ''; } diff --git a/src/player/regions/video.js b/src/player/regions/video.js index 6cba3cc..64ba6a1 100644 --- a/src/player/regions/video.js +++ b/src/player/regions/video.js @@ -1,5 +1,6 @@ // Video region playback, retry, and source probe helpers. +// These page-lifetime caches retain fallback sources while mirrored replacements are probed. var videoRegionLastGoodSrcCache = Object.create(null); var videoRegionProbeStateCache = Object.create(null); var videoRegionProbeTimerCache = Object.create(null); @@ -10,6 +11,7 @@ function getVideoRegionCacheKey(region) { } function isDirectlyRenderableSource(src) { + // URL-shaped sources go directly to the browser; this bypass is not a readiness check. return /^(?:https?:)?\/\//i.test(src) || /^data:/i.test(src) || /^blob:/i.test(src) || /^\/media\//i.test(src); } @@ -67,6 +69,7 @@ function scheduleVideoSourceProbe(regionKey, src, isRetry) { return; } + // Regions sharing a source also share its pending probe, avoiding duplicate HEAD requests. if (videoRegionProbeTimerCache[key]) { return; } @@ -106,7 +109,7 @@ function scheduleVideoSourceProbe(regionKey, src, isRetry) { } function renderVideoRegion(region, regionContent) { - var requestedSrc = String(regionContent && regionContent.value || '').trim(); + var requestedSrc = selectPlayerMediaSource(regionContent && regionContent.value || '', regionContent && regionContent.media_variants, Math.max(region.canvasWidth || 0, region.canvasHeight || 0)); var requestedSrcVersioned = appendCacheBust(requestedSrc, regionContent && regionContent.cache_bust); var regionKey = getVideoRegionCacheKey(region); var cachedSrc = regionKey ? String(videoRegionLastGoodSrcCache[regionKey] || '').trim() : ''; @@ -139,6 +142,7 @@ function renderVideoRegion(region, regionContent) { scheduleVideoSourceProbe(regionKey, requestedSrc, false); + // Keep the previous source visible while the requested mirrored file is unavailable. if (cachedSrc) { if (cachedSrc !== requestedSrc) { logVideoRegionStatus('Keeping the previous playable video until the new mirrored file finishes transferring.', 'region=' + regionKey + ' old=' + cachedSrc + ' new=' + requestedSrc); diff --git a/src/player/regions/webpage.js b/src/player/regions/webpage.js index dbbccad..d5cec84 100644 --- a/src/player/regions/webpage.js +++ b/src/player/regions/webpage.js @@ -2,34 +2,8 @@ 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 = normalizeRenderableValue(regionContent && regionContent.value !== undefined ? regionContent.value : '').trim(); + var url = window.pulsePlayerRenderingShared.normalizeRenderableString(regionContent && regionContent.value !== undefined ? regionContent.value : '', ['value', 'text', 'url', 'href', 'src', 'content']).trim(); if (!url) { return ''; } diff --git a/src/player/render-helpers.js b/src/player/render-helpers.js index 7bf5acb..e8f5dee 100644 --- a/src/player/render-helpers.js +++ b/src/player/render-helpers.js @@ -3,6 +3,25 @@ const fs = require('fs'); const path = require('path'); const announcementIcons = require('#src/data/announcement-icons'); +const renderingShared = require('#src/player/rendering-shared'); +const { + escapeHtml, + sanitizeRichTextAttributes, + sanitizeRichText, + renderEditorJsBlock, + renderEditorJsListItem, + renderEditorJsTable, + renderEditorJsContent, + normalizeRenderableString, + buildHtmlDocument, + sanitizeFontFamily, + sanitizeFontSize, + sanitizeTextColor, + parseMaybeJson, + normalizeContentValue, + normalizeSlide, + fitCanvasSize +} = renderingShared; function mediaKind(mediaPath) { const ext = path.extname(mediaPath || '').toLowerCase(); @@ -18,331 +37,18 @@ function mediaKind(mediaPath) { return 'file'; } -function escapeHtml(value) { - return String(value ?? '') - .replace(/&/g, '&') - .replace(//g, '>') - .replace(/"/g, '"') - .replace(/'/g, '''); -} - -function normalizeStyleAttributeValue(value) { - return String(value || '') - .replace(/"/g, '"') - .replace(/'/g, "'") - .replace(/&quot;/g, '"') - .replace(/&#39;/g, "'"); -} - -function sanitizeFontFamily(value) { - return String(value || '').replace(/[^a-zA-Z0-9 ,"-]/g, '').trim(); -} - -function sanitizeFontSize(value) { - return Math.max(8, Number(value || 0) || 24); -} - -function sanitizeTextColor(value, fallback) { - const raw = String(value || '').trim(); - if (/^#[0-9a-fA-F]{6}$/.test(raw) || /^#[0-9a-fA-F]{3}$/.test(raw)) { - return raw; - } - return fallback || '#000000'; -} - -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 = { - 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'], - i: ['class', 'style', 'aria-hidden'], - 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'], - 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 ''; - } - - 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(); - 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 + '="' + escapeHtml(lowerKey === 'style' ? normalizeStyleAttributeValue(value) : value) + '"'); - return ''; - }); - - return attrs.join(''); -} - function safeJsonForScript(value) { return JSON.stringify(value === undefined ? null : value).replace(//gi, ''); - output = output.replace(//gi, ''); - return output.replace(/<[^>]+>/g, (tag) => { - 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 (closing) { - return ``; - } - return `<${name}${sanitizeRichTextAttributes(name, attrText)}>`; - }); -} - -function renderEditorJsBlock(block) { - if (!block || !block.type || !block.data) { - return ''; - } - - if (block.type === 'header') { - const level = Math.max(1, Math.min(6, Number(block.data.level || 2))); - return '' + sanitizeRichText(block.data.text || '') + ''; - } else if (block.type === 'list') { - const tag = block.data.style === 'ordered' ? 'ol' : 'ul'; - const items = Array.isArray(block.data.items) ? block.data.items : []; - return '<' + tag + ' style="list-style-type:' + (tag === 'ol' ? 'decimal' : 'disc') + ';padding-left:1.4em;">' + items.map((item) => renderEditorJsListItem(item, tag)).join('') + ''; - } else if (block.type === 'delimiter') { - return '
    '; - } else if (block.type === 'code') { - return '
    ' + escapeHtml(block.data.code || '') + '
    '; - } else if (block.type === 'table') { - return renderEditorJsTable(block.data); - } else if (block.type === 'paragraph') { - return '

    ' + sanitizeRichText(block.data.text || '') + '

    '; - } - - return ''; -} - -function renderEditorJsListItem(item, tag) { - if (item && typeof item === 'object') { - const content = item.content !== undefined ? item.content : (item.text !== undefined ? item.text : item.value !== undefined ? item.value : ''); - const children = Array.isArray(item.items) ? item.items : Array.isArray(item.subItems) ? item.subItems : Array.isArray(item.children) ? item.children : []; - const nested = children.length ? '<' + tag + ' style="list-style-type:' + (tag === 'ol' ? 'decimal' : 'disc') + ';padding-left:1.4em;">' + children.map((child) => renderEditorJsListItem(child, tag)).join('') + '' : ''; - return '
  • ' + sanitizeRichText(content || '') + nested + '
    • '; - } - return '
  • ' + sanitizeRichText(item || '') + '
    • '; -} - -function renderEditorJsTable(data) { - const rows = Array.isArray(data.content) ? data.content : Array.isArray(data.rows) ? data.rows : []; - if (!rows.length) { - return ''; - } - const hasHeadings = Boolean(data.withHeadings); - const tableRows = rows.map(function (row, rowIndex) { - const cells = Array.isArray(row) ? row : []; - const cellTag = hasHeadings && rowIndex === 0 ? 'th' : 'td'; - const cellAttrs = cellTag === 'th' ? ' scope="col"' : ''; - return '' + cells.map(function (cell) { - return '<' + cellTag + cellAttrs + '>' + sanitizeRichText(cell || '') + ''; - }).join('') + ''; - }).join(''); - return '' + tableRows + '
    '; -} - -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 '

    ' + raw + '

    '; -} - -function renderEditorJsContent(value) { - if (value && typeof value === 'object') { - if (Array.isArray(value.blocks)) { - return value.blocks.map(renderEditorJsBlock).join(''); - } - if (value.value !== undefined) { - return renderEditorJsContent(value.value); - } - } - const raw = String(value || ''); - try { - const parsed = JSON.parse(raw); - if (parsed && Array.isArray(parsed.blocks)) { - return parsed.blocks.map(renderEditorJsBlock).join(''); - } - } catch (_error) { - // fall through to legacy HTML rendering - } - return wrapRichTextParagraph(sanitizeRichText(raw)); -} - -function buildHtmlDocument(html) { - const raw = String(html || '').trim(); - if (!raw) { - return ''; - } - - if (/^' + raw + ''; -} - function renderHtmlRegionContent(value) { - const html = normalizeRenderableValue(value).trim(); + const html = normalizeRenderableString(value, ['value', 'text', 'html', 'content']).trim(); if (!html) { return '
    HTML
    '; } return ''; } -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) { - const width = Math.max(1, Number(canvasWidth || 0) || 1920); - const height = Math.max(1, Number(canvasHeight || 0) || 1080); - const viewportWidth = Math.max(1, Number(maxWidth || 0) || width); - const viewportHeight = Math.max(1, Number(maxHeight || 0) || height); - const scale = Math.min(viewportWidth / width, viewportHeight / height); - return { - width: Math.round(width * scale), - height: Math.round(height * scale) - }; -} - const playerPageTemplatePath = path.join(__dirname, 'player-page.template.html'); const playerClientNameScriptPath = path.join(__dirname, 'player-client-name.script.html'); const playerPageOfflineScriptPath = path.join(__dirname, 'public', 'js', 'player-page-offline.js'); @@ -359,6 +65,7 @@ const playerAnnouncementTopBannerTemplatePath = path.join(__dirname, 'announceme 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 playerRenderingSharedScriptPath = path.join(__dirname, 'rendering-shared.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'); @@ -373,7 +80,6 @@ let playerAnnouncementTemplatesScriptCache = null; let playerAnnouncementTemplatesDataScriptCache = null; let playerPageAnnouncementsScriptCache = null; let playerPageScriptCache = null; -let playerRegionScriptsCache = null; let playerOnboardingLandingScriptCache = null; let playerOnboardingFormScriptCache = null; @@ -498,28 +204,6 @@ function getPlayerRegionScriptPaths() { }); } -function getPlayerRegionScripts() { - 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 = scriptPaths.map(function (filePath) { - return fs.readFileSync(filePath, 'utf8').trim(); - }).join('\n\n'); - playerRegionScriptsCache = { - signature: statSignature, - value: value - }; - return value; -} - function getPlayerOnboardingLandingScript() { return loadTemplate(playerOnboardingLandingScriptPath, playerOnboardingLandingScriptCache || (playerOnboardingLandingScriptCache = {})); } @@ -539,7 +223,9 @@ function getPlayerRuntimeScripts() { return [ ['region-registry', fs.readFileSync(path.join(__dirname, 'public', 'js', 'player-region-registry.js'), 'utf8').trim()], ['placeholder-utils', fs.readFileSync(path.join(__dirname, '..', 'web', 'public', 'js', 'shared', 'placeholder-utils.js'), 'utf8').trim()], + ['chart-data', fs.readFileSync(path.join(__dirname, '..', 'web', 'public', 'js', 'regions', 'chart-data.js'), 'utf8').trim()], ['qr-code-svg', fs.readFileSync(path.join(__dirname, '..', 'web', 'public', 'js', 'shared', 'qr-code-svg.js'), 'utf8').trim()], + ['rendering-shared', fs.readFileSync(playerRenderingSharedScriptPath, 'utf8').trim()], ['client-name', getScriptBody(getPlayerClientNameScript()())], ['offline', getScriptBody(getPlayerPageOfflineScript()())], ['playlist', getScriptBody(getPlayerPagePlaylistScript()())], @@ -588,7 +274,6 @@ module.exports = { getPlayerAnnouncementTemplatesScript: getPlayerAnnouncementTemplatesScript, getPlayerPageAnnouncementsScript: getPlayerPageAnnouncementsScript, getPlayerPageScript: getPlayerPageScript, - getPlayerRegionScripts: getPlayerRegionScripts, getPlayerOnboardingLandingScript: getPlayerOnboardingLandingScript, getPlayerOnboardingFormScript: getPlayerOnboardingFormScript, getPlayerRuntimeScripts: getPlayerRuntimeScripts diff --git a/src/player/render.js b/src/player/render.js index 1c627b1..8747b97 100644 --- a/src/player/render.js +++ b/src/player/render.js @@ -1,9 +1,10 @@ // Player page rendering and bootstrap script assembly. const Handlebars = require('handlebars'); +const crypto = require('crypto'); const path = require('path'); -const packageMetadata = require('../../package.json'); -const { mediaKind, safeJsonForScript, getPlayerPageTemplate, getPlayerPageAnnouncementsScript, getPlayerPageScript, getPlayerOnboardingLandingScript, getPlayerOnboardingFormScript, getPlayerRuntimeScripts } = require('./render-helpers'); +const packageMetadata = require('#root/package.json'); +const { mediaKind, safeJsonForScript, getPlayerPageTemplate, getPlayerPageAnnouncementsScript, getPlayerPageScript, getPlayerOnboardingLandingScript, getPlayerOnboardingFormScript, getPlayerRuntimeScripts } = require('#src/player/render-helpers'); const { createPageAuthBundle, createPageFetchAuthScript } = require('#src/request-auth'); const { getFontStylesheetHref } = require('#src/web/lib/media/font-library'); @@ -100,20 +101,11 @@ function renderOnboardingFormBody(deviceId) { } -function renderOnboardingLandingScript() { - return getPlayerOnboardingLandingScript()(); -} - -function renderOnboardingFormScript(deviceId) { - return getPlayerOnboardingFormScript()({ - DEVICE_ID_JSON: new Handlebars.SafeString(JSON.stringify(deviceId || '')) - }); -} - function renderPlayerPage(slug, initialData) { const serviceWorkerScript = getPlayerServiceWorkerRegistrationScript(); const template = getPlayerPageTemplate(); const hlsScriptTag = ''; + const chartScriptTag = ''; const pageAuthToken = createPageAuthBundle({ scope: 'player', slug: String(slug || '').trim() }); const fontStylesheetHref = getFontStylesheetHref(PLAYER_MEDIA_DIR); const bootstrapScript = getPlayerPageScript()({ @@ -122,7 +114,9 @@ function renderPlayerPage(slug, initialData) { REGION_SCRIPTS: '' }); const runtimeScriptTags = getPlayerRuntimeScripts().map(function (entry) { - return ''; + const scriptRevision = crypto.createHash('sha256').update(entry[1]).digest('hex').slice(0, 12); + const assetVersion = String(packageMetadata.version || 'development') + '-' + scriptRevision; + return ''; }).join(''); return renderPage(template, { @@ -130,7 +124,7 @@ function renderPlayerPage(slug, initialData) { bodyClass: '', body: '
    Loading screen...
    ', stylesheets: fontStylesheetHref ? [fontStylesheetHref] : [], - script: createPageFetchAuthScript(pageAuthToken, '/ws/screens/' + encodeURIComponent(slug || '')) + hlsScriptTag + serviceWorkerScript + runtimeScriptTags + bootstrapScript + '' + script: createPageFetchAuthScript(pageAuthToken, '/ws/screens/' + encodeURIComponent(slug || '')) + hlsScriptTag + chartScriptTag + serviceWorkerScript + runtimeScriptTags + bootstrapScript + '' }); } @@ -142,7 +136,7 @@ function renderPlayerOnboardingLandingPage(options) { bodyClass: 'onboarding-page', body: renderOnboardingLandingBody(options), stylesheets: fontStylesheetHref ? [fontStylesheetHref] : [], - script: createPageFetchAuthScript(pageAuthToken) + getPlayerServiceWorkerRegistrationScript() + renderOnboardingLandingScript() + script: createPageFetchAuthScript(pageAuthToken) + getPlayerServiceWorkerRegistrationScript() + getPlayerOnboardingLandingScript()() }); } @@ -154,7 +148,9 @@ function renderPlayerOnboardingFormPage(deviceId) { bodyClass: 'onboarding-page', body: renderOnboardingFormBody(deviceId), stylesheets: fontStylesheetHref ? [fontStylesheetHref] : [], - script: createPageFetchAuthScript(pageAuthToken) + getPlayerServiceWorkerRegistrationScript() + renderOnboardingFormScript(deviceId) + script: createPageFetchAuthScript(pageAuthToken) + getPlayerServiceWorkerRegistrationScript() + getPlayerOnboardingFormScript()({ + DEVICE_ID_JSON: new Handlebars.SafeString(JSON.stringify(deviceId || '')) + }) }); } diff --git a/src/player/rendering-shared.js b/src/player/rendering-shared.js new file mode 100644 index 0000000..1293c08 --- /dev/null +++ b/src/player/rendering-shared.js @@ -0,0 +1,376 @@ +(function (root, factory) { + const shared = factory(); + if (typeof module === 'object' && module.exports) { + module.exports = shared; + } else if (root) { + root.pulsePlayerRenderingShared = shared; + } +}(typeof window !== 'undefined' ? window : globalThis, function () { + const allowedTags = ['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 escapeHtml(value) { + return String(value ?? '') + .replace(/&/g, '&') + .replace(//g, '>') + .replace(/"/g, '"') + .replace(/'/g, '''); + } + + function normalizeStyleAttributeValue(value) { + return String(value || '') + .replace(/"/g, '"') + .replace(/'/g, "'") + .replace(/&quot;/g, '"') + .replace(/&#39;/g, "'"); + } + + 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'], + i: ['class', 'style', 'aria-hidden'], + 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'] + }; + const allowed = allowedAttributes[tagName] || []; + if (!allowed.length) { + 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, function (_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' && String(value || '').trim() === '_blank') { + attrs.push(' target="_blank"'); + if (!attrs.includes(' rel="noreferrer noopener"')) { + attrs.push(' rel="noreferrer noopener"'); + } + return ''; + } + attrs.push(' ' + lowerKey + '="' + escapeHtml(lowerKey === 'style' ? normalizeStyleAttributeValue(value) : value) + '"'); + return ''; + }); + + return attrs.join(''); + } + + function sanitizeRichText(html) { + let output = String(html || ''); + output = output.replace(//gi, ''); + output = output.replace(//gi, ''); + return output.replace(/<[^>]+>/g, function (tag) { + 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 (!allowedTags.includes(name)) { + return ''; + } + if (closing) { + return ''; + } + return '<' + name + sanitizeRichTextAttributes(name, attrText) + '>'; + }); + } + + function renderEditorJsListItem(item, tag) { + if (item && typeof item === 'object') { + const content = item.content !== undefined ? item.content : (item.text !== undefined ? item.text : item.value !== undefined ? item.value : ''); + const children = Array.isArray(item.items) ? item.items : Array.isArray(item.subItems) ? item.subItems : Array.isArray(item.children) ? item.children : []; + const nested = children.length ? '<' + tag + ' style="list-style-type:' + (tag === 'ol' ? 'decimal' : 'disc') + ';padding-left:1.4em;">' + children.map(function (child) { return renderEditorJsListItem(child, tag); }).join('') + '' : ''; + return '
  • ' + sanitizeRichText(content || '') + nested + '
    • '; + } + return '
  • ' + sanitizeRichText(item || '') + '
    • '; + } + + function renderEditorJsTable(data) { + const rows = Array.isArray(data.content) ? data.content : Array.isArray(data.rows) ? data.rows : []; + if (!rows.length) { + return ''; + } + const hasHeadings = Boolean(data.withHeadings); + const tableRows = rows.map(function (row, rowIndex) { + const cells = Array.isArray(row) ? row : []; + const cellTag = hasHeadings && rowIndex === 0 ? 'th' : 'td'; + const cellAttrs = cellTag === 'th' ? ' scope="col"' : ''; + return '' + cells.map(function (cell) { + return '<' + cellTag + cellAttrs + '>' + sanitizeRichText(cell || '') + ''; + }).join('') + ''; + }).join(''); + return '' + tableRows + '
    '; + } + + function renderEditorJsBlock(block) { + if (!block || !block.type || !block.data) { + return ''; + } + + if (block.type === 'header') { + const level = Math.max(1, Math.min(6, Number(block.data.level || 2))); + return '' + sanitizeRichText(block.data.text || '') + ''; + } + if (block.type === 'list') { + const tag = block.data.style === 'ordered' ? 'ol' : 'ul'; + const items = Array.isArray(block.data.items) ? block.data.items : []; + return '<' + tag + ' style="list-style-type:' + (tag === 'ol' ? 'decimal' : 'disc') + ';padding-left:1.4em;">' + items.map(function (item) { return renderEditorJsListItem(item, tag); }).join('') + ''; + } + if (block.type === 'delimiter') { + return '
    '; + } + if (block.type === 'code') { + return '
    ' + escapeHtml(block.data.code || '') + '
    '; + } + if (block.type === 'table') { + return renderEditorJsTable(block.data); + } + if (block.type === 'paragraph') { + return '

    ' + sanitizeRichText(block.data.text || '') + '

    '; + } + return ''; + } + + 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 '

    ' + raw + '

    '; + } + + function renderEditorJsContent(value) { + if (value && typeof value === 'object') { + if (Array.isArray(value.blocks)) { + return value.blocks.map(renderEditorJsBlock).join(''); + } + if (value.value !== undefined) { + return renderEditorJsContent(value.value); + } + } + const raw = String(value || ''); + try { + const parsed = JSON.parse(raw); + if (parsed && Array.isArray(parsed.blocks)) { + return parsed.blocks.map(renderEditorJsBlock).join(''); + } + } catch (_error) { + // Continue with legacy HTML content when the value is not Editor.js JSON. + } + return wrapRichTextParagraph(sanitizeRichText(raw)); + } + + function normalizeRenderableString(value, propertyKeys) { + if (value && typeof value === 'object') { + const keys = Array.isArray(propertyKeys) ? propertyKeys : ['value', 'text', 'html', 'content']; + for (const key of keys) { + if (value[key] !== undefined) { + return normalizeRenderableString(value[key], keys); + } + } + return ''; + } + return String(value === undefined || value === null ? '' : value); + } + + function normalizeRegionValue(value, propertyKeys) { + if (value && typeof value === 'object') { + const keys = Array.isArray(propertyKeys) ? propertyKeys : ['value', 'text', 'html']; + for (const key of keys) { + if (value[key] !== undefined) { + return value[key]; + } + } + try { + return JSON.stringify(value); + } catch (_error) { + return ''; + } + } + return value; + } + + function buildHtmlDocument(html, forceTransparentBackground) { + const raw = String(html || '').trim(); + if (!raw) { + return ''; + } + if (/^' + raw + ''; + } + + function sanitizeFontFamily(value) { + return String(value || '').replace(/[^a-zA-Z0-9 ,"-]/g, '').trim(); + } + + function sanitizeFontSize(value) { + return Math.max(8, Number(value || 0) || 24); + } + + function sanitizeTextColor(value, fallback) { + const raw = String(value || '').trim(); + if (/^#[0-9a-fA-F]{6}$/.test(raw) || /^#[0-9a-fA-F]{3}$/.test(raw)) { + return raw; + } + return fallback || '#000000'; + } + + function parseMaybeJson(value) { + if (typeof value !== 'string') { + return value; + } + const raw = value.trim(); + if (!raw || (raw[0] !== '{' && raw[0] !== '[')) { + return value; + } + try { + return JSON.parse(raw); + } catch (_error) { + return value; + } + } + + function normalizeContentValue(value) { + if (!value || typeof value !== 'object') { + return { + type: 'text', + value: parseMaybeJson(value) + }; + } + const normalized = {}; + Object.keys(value).forEach(function (key) { + normalized[key] = value[key]; + }); + if (normalized.value !== undefined) { + normalized.value = parseMaybeJson(normalized.value); + } + if (normalized.font_family !== undefined && normalized.font_family !== null) { + normalized.font_family = sanitizeFontFamily(normalized.font_family); + } + if (normalized.font_size !== undefined && normalized.font_size !== null) { + normalized.font_size = sanitizeFontSize(normalized.font_size); + } + if (normalized.font_color !== undefined && normalized.font_color !== null) { + normalized.font_color = sanitizeTextColor(normalized.font_color); + } + if (!normalized.type) { + normalized.type = 'text'; + } + return normalized; + } + + function normalizeSlide(slide) { + const normalized = {}; + Object.keys(slide || {}).forEach(function (key) { + normalized[key] = slide[key]; + }); + normalized.content = {}; + const content = slide && slide.content && typeof slide.content === 'object' ? slide.content : {}; + Object.keys(content).forEach(function (regionKey) { + normalized.content[regionKey] = normalizeContentValue(content[regionKey]); + }); + return normalized; + } + + function fitCanvasSize(canvasWidth, canvasHeight, maxWidth, maxHeight) { + const width = Math.max(1, Number(canvasWidth || 0) || 1920); + const height = Math.max(1, Number(canvasHeight || 0) || 1080); + const viewportWidth = Math.max(1, Number(maxWidth || 0) || width); + const viewportHeight = Math.max(1, Number(maxHeight || 0) || height); + const scale = Math.min(viewportWidth / width, viewportHeight / height); + return { + width: Math.round(width * scale), + height: Math.round(height * scale) + }; + } + + function hasPlayerAnimation(config) { + return Boolean(config && ['intro', 'outro', 'loop'].some(function (stepName) { + const preset = String((config[stepName] && config[stepName].preset) || '').trim(); + return preset && preset !== 'none'; + })); + } + + function decorateRegionMarkup(markup, region) { + if (!markup || !region || !hasPlayerAnimation(region.animationConfig)) { + return markup; + } + + const 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 + '">'; + }); + } + + return { + escapeHtml: escapeHtml, + normalizeStyleAttributeValue: normalizeStyleAttributeValue, + sanitizeRichTextAttributes: sanitizeRichTextAttributes, + sanitizeRichText: sanitizeRichText, + renderEditorJsBlock: renderEditorJsBlock, + renderEditorJsListItem: renderEditorJsListItem, + renderEditorJsTable: renderEditorJsTable, + renderEditorJsContent: renderEditorJsContent, + normalizeRenderableString: normalizeRenderableString, + normalizeRegionValue: normalizeRegionValue, + buildHtmlDocument: buildHtmlDocument, + sanitizeFontFamily: sanitizeFontFamily, + sanitizeFontSize: sanitizeFontSize, + sanitizeTextColor: sanitizeTextColor, + parseMaybeJson: parseMaybeJson, + normalizeContentValue: normalizeContentValue, + normalizeSlide: normalizeSlide, + fitCanvasSize: fitCanvasSize, + hasPlayerAnimation: hasPlayerAnimation, + decorateRegionMarkup: decorateRegionMarkup + }; +})); \ No newline at end of file diff --git a/src/player/routes.js b/src/player/routes.js index a4b2391..ff9ef99 100644 --- a/src/player/routes.js +++ b/src/player/routes.js @@ -3,8 +3,9 @@ const fs = require('fs'); const express = require('express'); const path = require('path'); +const crypto = require('crypto'); const { getSharedSecret, createPageAuthBundle, verifyPageAuthToken, verifyRequestAuth, createRequestAuthHeaders } = require('#src/request-auth'); -const { getPlayerPublicBaseUrl } = require('./onboarding'); +const { getPlayerPublicBaseUrl } = require('#src/player/onboarding/index'); const TRANSIENT_DB_ERROR_CODES = ['ECONNREFUSED', 'ECONNRESET', 'ETIMEDOUT', 'EPIPE', 'ENOTFOUND', 'PROTOCOL_CONNECTION_LOST', 'POOL_CLOSED', 'ERR_POOL_CLOSED']; @@ -269,6 +270,7 @@ function registerPlayerRoutes(app, options) { app.use('/assets', express.static(assetDir)); app.use('/assets/adminlte/bootstrap-icons', express.static(path.join(__dirname, '..', 'web', 'public', 'adminlte', 'bootstrap-icons'))); + app.use('/assets/vendor/chart.js', express.static(path.join(__dirname, '..', 'web', 'public', 'vendor', 'chart.js'))); app.use('/media', express.static(mediaDir)); app.use('/assets/vendor', express.static(path.join(__dirname, '..', '..', 'node_modules', 'hls.js', 'dist'))); @@ -336,7 +338,13 @@ function registerPlayerRoutes(app, options) { } const body = Buffer.isBuffer(req.body) ? req.body : Buffer.from(req.body || ''); await fs.promises.mkdir(path.dirname(filePath), { recursive: true }); - await fs.promises.writeFile(filePath, body); + const temporaryFilePath = filePath + '.partial-' + crypto.randomUUID(); + try { + await fs.promises.writeFile(temporaryFilePath, body); + await fs.promises.rename(temporaryFilePath, filePath); + } finally { + await fs.promises.unlink(temporaryFilePath).catch(function () {}); + } res.json({ ok: true, filename: req.params.filename }); } catch (error) { next(error); diff --git a/src/web.js b/src/web.js index cbb5fdb..b8c5772 100644 --- a/src/web.js +++ b/src/web.js @@ -5,25 +5,25 @@ const http = require('http'); const multer = require('multer'); const fs = require('fs'); const crypto = require('crypto'); -const common = require('./common'); +const common = require('#src/common'); const { verifyPassword, createSessionToken, hashSessionToken, hashPassword, validatePasswordStrength, createOneTimeToken } = require('#src/auth'); -const pages = require('#src/web/pages'); +const pages = require('#src/web/pages/index'); 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 { initializeBackgroundTasks } = require('#src/web/lib/background-tasks/index'); const { createDataSourceTaskService } = require('#src/web/lib/background-tasks/tasks-scheduled/data-source-refresh'); -const { captureSlideThumbnail } = require('#src/web/lib/media'); +const { captureSlideThumbnail } = require('#src/web/lib/media/index'); 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 { rbacData } = require('#src/web/lib/auth/index'); const { createPlayerActionService } = require('#src/web/lib/player-actions'); const { isClientNameAvailable, withClientNameReservation } = require('#src/data/client-name-check'); -const { createSessionService, getRequestOrigin } = require('#src/web/lib/auth'); +const { createSessionService, getRequestOrigin } = require('#src/web/lib/auth/index'); const { fetchAppSettings } = require('#src/data/app-settings'); const { sendAccountEmail } = require('#src/data/mailer'); const { recordRequestAuditEvent } = require('#src/data/audit-log'); diff --git a/src/web/bootstrap.js b/src/web/bootstrap.js index 443a573..06ee5d3 100644 --- a/src/web/bootstrap.js +++ b/src/web/bootstrap.js @@ -1,8 +1,8 @@ // Web-to-player websocket bridge and dashboard state synchronizer. const { WebSocketServer, WebSocket } = require('ws'); -const { createDashboardStateService } = require('./lib/dashboard-state'); -const { createUploadSyncService } = require('./lib/media'); +const { createDashboardStateService } = require('#src/web/lib/dashboard-state'); +const { createUploadSyncService } = require('#src/web/lib/media/index'); const { createRequestAuthHeaders } = require('#src/request-auth'); function createWebBootstrap(options) { diff --git a/src/web/lib/auth/index.js b/src/web/lib/auth/index.js index a26509f..fa71420 100644 --- a/src/web/lib/auth/index.js +++ b/src/web/lib/auth/index.js @@ -1,7 +1,7 @@ // Entry point for the web auth helper modules. module.exports = { - createSessionService: require('./session').createSessionService, - getRequestOrigin: require('./session').getRequestOrigin, - rbacData: require('./rbac-data') + createSessionService: require('#src/web/lib/auth/session').createSessionService, + getRequestOrigin: require('#src/web/lib/auth/session').getRequestOrigin, + rbacData: require('#src/web/lib/auth/rbac-data') }; \ No newline at end of file diff --git a/src/web/lib/background-tasks/tasks-adhoc/data-source-refresh.js b/src/web/lib/background-tasks/tasks-adhoc/data-source-refresh.js index 773c145..4ce1201 100644 --- a/src/web/lib/background-tasks/tasks-adhoc/data-source-refresh.js +++ b/src/web/lib/background-tasks/tasks-adhoc/data-source-refresh.js @@ -1,4 +1,4 @@ -const { refreshApiSource, refreshRssFeed, refreshWeatherLocation } = require('../../data-source-refresh'); +const { refreshApiSource, refreshRssFeed, refreshWeatherLocation } = require('#src/web/lib/data-source-refresh'); const TASK = { taskType: 'data-source-refresh' diff --git a/src/web/lib/background-tasks/tasks-scheduled/data-source-refresh.js b/src/web/lib/background-tasks/tasks-scheduled/data-source-refresh.js index 815bb9e..e4ab784 100644 --- a/src/web/lib/background-tasks/tasks-scheduled/data-source-refresh.js +++ b/src/web/lib/background-tasks/tasks-scheduled/data-source-refresh.js @@ -8,8 +8,8 @@ const TASK = { intervalMs: null }; -const { normalizeIntervalMs } = require('../queue'); -const { refreshApiSource, refreshRssFeed, refreshWeatherLocation } = require('../../data-source-refresh'); +const { normalizeIntervalMs } = require('#src/web/lib/background-tasks/queue'); +const { refreshApiSource, refreshRssFeed, refreshWeatherLocation } = require('#src/web/lib/data-source-refresh'); function registerRecurringDataSourceRefreshes(options) { const pool = options && options.pool; diff --git a/src/web/lib/background-tasks/tasks-scheduled/font-sweep.js b/src/web/lib/background-tasks/tasks-scheduled/font-sweep.js index 95f787c..5e50108 100644 --- a/src/web/lib/background-tasks/tasks-scheduled/font-sweep.js +++ b/src/web/lib/background-tasks/tasks-scheduled/font-sweep.js @@ -11,7 +11,7 @@ const TASK = { const { collectFontLibraryDirectoryUploadPaths, collectFontLibrarySyncOperations -} = require('../../media/font-library'); +} = require('#src/web/lib/media/font-library'); function registerFontSweepTask(options) { const backgroundTaskQueue = options && options.backgroundTaskQueue; diff --git a/src/web/lib/background-tasks/tasks-scheduled/player-control-sync.js b/src/web/lib/background-tasks/tasks-scheduled/player-control-sync.js index 2bf0630..9be2568 100644 --- a/src/web/lib/background-tasks/tasks-scheduled/player-control-sync.js +++ b/src/web/lib/background-tasks/tasks-scheduled/player-control-sync.js @@ -1,4 +1,4 @@ -const { collectLocalControlUsers } = require('../../local-control-users'); +const { collectLocalControlUsers } = require('#src/web/lib/local-control-users'); const TASK = { key: 'player-control-sync', diff --git a/src/web/lib/background-tasks/tasks-startup/data-source-refresh.js b/src/web/lib/background-tasks/tasks-startup/data-source-refresh.js index 812a8d2..7153934 100644 --- a/src/web/lib/background-tasks/tasks-startup/data-source-refresh.js +++ b/src/web/lib/background-tasks/tasks-startup/data-source-refresh.js @@ -1,5 +1,5 @@ -const { refreshApiSource, refreshRssFeed, refreshWeatherLocation } = require('../../data-source-refresh'); -const { normalizeIntervalMs } = require('../queue'); +const { refreshApiSource, refreshRssFeed, refreshWeatherLocation } = require('#src/web/lib/data-source-refresh'); +const { normalizeIntervalMs } = require('#src/web/lib/background-tasks/queue'); const TASK = { key: 'startup-data-source-refresh', diff --git a/src/web/lib/background-tasks/tasks-startup/font-sync.js b/src/web/lib/background-tasks/tasks-startup/font-sync.js index 00a9aba..33e8c16 100644 --- a/src/web/lib/background-tasks/tasks-startup/font-sync.js +++ b/src/web/lib/background-tasks/tasks-startup/font-sync.js @@ -1,18 +1,13 @@ -const { collectFontLibrarySyncOperations } = require('../../media/font-library'); -const { fetchPlayerRegistrations } = require('#src/data/player-registry'); +const { collectFontLibrarySyncOperations } = require('#src/web/lib/media/font-library'); +const { fetchPlayerRegistrations, isRecentPlayerRegistration } = require('#src/data/player-registry'); const TASK = { key: 'initial-font-sync', category: 'fonts' }; -function isRecentPlayerRegistration(player, staleSeconds) { - const lastSeenAt = player && player.last_seen_at; - const lastSeenAtValue = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime(); - const cutoffTime = Date.now() - Math.max(30, Number(staleSeconds || 60)) * 1000; - - return Number.isFinite(lastSeenAtValue) && lastSeenAtValue >= cutoffTime; -} +// Queue a one-off font sync for each live player on startup. The task keeps the resolved player +// metadata in the payload so retries and background workers do not need to rediscover the same URL. function normalizePlayerMetadata(player) { const playerIdentifier = String(player && player.identifier || '').trim(); diff --git a/src/web/lib/background-tasks/tasks-startup/media-sync.js b/src/web/lib/background-tasks/tasks-startup/media-sync.js index 94ec988..9c7afc7 100644 --- a/src/web/lib/background-tasks/tasks-startup/media-sync.js +++ b/src/web/lib/background-tasks/tasks-startup/media-sync.js @@ -3,15 +3,11 @@ const TASK = { category: 'media-sync', }; -const { fetchPlayerRegistrations } = require('#src/data/player-registry'); +// Queue a one-off media sync for each live player when the web app starts up. We intentionally +// do the target selection here rather than inside the task itself so the task payload remains +// explicit and reusable for later retries. -function isRecentPlayerRegistration(player, staleSeconds) { - const lastSeenAt = player && player.last_seen_at; - const lastSeenAtValue = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime(); - const cutoffTime = Date.now() - Math.max(30, Number(staleSeconds || 60)) * 1000; - - return Number.isFinite(lastSeenAtValue) && lastSeenAtValue >= cutoffTime; -} +const { fetchPlayerRegistrations, isRecentPlayerRegistration } = require('#src/data/player-registry'); function normalizePlayerMetadata(player) { const playerIdentifier = String(player && player.identifier || '').trim(); diff --git a/src/web/lib/dashboard-state.js b/src/web/lib/dashboard-state.js index 71d7134..9563a8e 100644 --- a/src/web/lib/dashboard-state.js +++ b/src/web/lib/dashboard-state.js @@ -1,6 +1,7 @@ // Helpers for normalizing dashboard state and date values. const { WebSocket } = require('ws'); +const { isRecentPlayerRegistration } = require('#src/data/player-registry'); function normalizeClientName(value) { return String(value || '').trim(); @@ -52,14 +53,8 @@ function buildClientRows(screens, connectionsBySlug, onboardingNameBySlug, onboa }); } -function isRecentPlayerRegistration(player, staleSeconds) { - const lastSeenAt = player && player.last_seen_at; - const lastSeenAtValue = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime(); - const cutoffTime = Date.now() - Math.max(30, Number(staleSeconds || 60)) * 1000; - - return Number.isFinite(lastSeenAtValue) && lastSeenAtValue >= cutoffTime; -} - +// Only build launcher entries for recent registrations with a public URL. This keeps the kiosk +// dashboard list focused on active devices and avoids presenting stale players as launch targets. function buildKioskLauncherPlayers(playerRegistrations, staleSeconds) { return (Array.isArray(playerRegistrations) ? playerRegistrations : []) .filter(function (player) { diff --git a/src/web/lib/media/index.js b/src/web/lib/media/index.js index 9c6fc46..d4e916c 100644 --- a/src/web/lib/media/index.js +++ b/src/web/lib/media/index.js @@ -1,9 +1,9 @@ // Media helper entry point for upload sync and thumbnail capture. module.exports = { - createUploadSyncService: require('./upload-sync').createUploadSyncService, + createUploadSyncService: require('#src/web/lib/media/upload-sync').createUploadSyncService, captureSlideThumbnail: function captureSlideThumbnail(options) { - return require('./slide-thumbnails').captureSlideThumbnail(options); + return require('#src/web/lib/media/slide-thumbnails').captureSlideThumbnail(options); }, - fontLibrary: require('./font-library') + fontLibrary: require('#src/web/lib/media/font-library') }; \ No newline at end of file diff --git a/src/web/lib/media/library.js b/src/web/lib/media/library.js index 477afb4..e6b60ea 100644 --- a/src/web/lib/media/library.js +++ b/src/web/lib/media/library.js @@ -2,6 +2,8 @@ const fs = require('fs'); const path = require('path'); +const crypto = require('crypto'); +const sharp = require('sharp'); const MEDIA_MIME_TYPES = { '.gif': 'image/gif', @@ -17,6 +19,121 @@ const MEDIA_MIME_TYPES = { '.webm': 'video/webm' }; +const OPTIMIZABLE_IMAGE_EXTENSIONS = new Set(['.jpg', '.jpeg', '.png', '.webp']); +const IMAGE_VARIANT_DIMENSIONS = [2048, 4096, 8192, 16384]; + +function getImageVariantPath(filePath, dimension) { + const extension = path.extname(filePath); + const baseName = path.basename(filePath, extension); + return path.join(path.dirname(filePath), baseName + '.variant-' + dimension + extension); +} + +async function removeImageVariants(filePath) { + const normalizedPath = String(filePath || '').trim(); + const extension = path.extname(normalizedPath).toLowerCase(); + if (!normalizedPath || !OPTIMIZABLE_IMAGE_EXTENSIONS.has(extension)) { + return; + } + await Promise.all(IMAGE_VARIANT_DIMENSIONS.map(function (dimension) { + return fs.promises.unlink(getImageVariantPath(normalizedPath, dimension)).catch(function (error) { + if (error && error.code !== 'ENOENT') { + throw error; + } + }); + })); +} + +async function createImageVariants(file) { + const filePath = String(file && file.path || '').trim(); + const extension = path.extname(filePath).toLowerCase(); + if (!filePath || !OPTIMIZABLE_IMAGE_EXTENSIONS.has(extension)) { + return []; + } + + const maxDimension = Math.max.apply(null, IMAGE_VARIANT_DIMENSIONS); + const originalStats = await fs.promises.stat(filePath); + const metadata = await sharp(filePath, { failOn: 'none' }).metadata(); + const sourceDimension = Math.max(Number(metadata.width) || 0, Number(metadata.height) || 0); + const variants = []; + + for (const dimension of IMAGE_VARIANT_DIMENSIONS) { + if (dimension > maxDimension || dimension >= sourceDimension) { + continue; + } + + const transformer = sharp(filePath, { failOn: 'none' }) + .rotate() + .resize({ width: dimension, height: dimension, fit: 'inside', withoutEnlargement: true }); + if (extension === '.jpg' || extension === '.jpeg') { + transformer.jpeg({ quality: 82, progressive: true, mozjpeg: true }); + } else if (extension === '.png') { + transformer.png({ compressionLevel: 9, adaptiveFiltering: true }); + } else { + transformer.webp({ quality: 82, effort: 5 }); + } + + const variantBuffer = await transformer.toBuffer(); + if (!variantBuffer.length || variantBuffer.length >= originalStats.size) { + continue; + } + + const variantPath = getImageVariantPath(filePath, dimension); + const temporaryPath = variantPath + '.partial-' + crypto.randomUUID(); + try { + await fs.promises.writeFile(temporaryPath, variantBuffer); + await fs.promises.rename(temporaryPath, variantPath); + variants.push({ + width: dimension, + path: '/media/uploads/' + path.basename(variantPath), + fileSize: variantBuffer.length + }); + } finally { + await fs.promises.unlink(temporaryPath).catch(function () {}); + } + } + + return variants; +} + +async function optimizeUploadedImage(file, options) { + const filePath = String(file && file.path || '').trim(); + const extension = path.extname(filePath).toLowerCase(); + if (!filePath || !OPTIMIZABLE_IMAGE_EXTENSIONS.has(extension)) { + return file; + } + + const requestedMaxDimension = Number(options && options.maxDimension); + const maxDimension = Number.isInteger(requestedMaxDimension) && requestedMaxDimension > 0 + ? requestedMaxDimension + : 4096; + const originalStats = await fs.promises.stat(filePath); + const transformer = sharp(filePath, { failOn: 'none' }) + .rotate() + .resize({ width: maxDimension, height: maxDimension, fit: 'inside', withoutEnlargement: true }); + if (extension === '.jpg' || extension === '.jpeg') { + transformer.jpeg({ quality: 82, progressive: true, mozjpeg: true }); + } else if (extension === '.png') { + transformer.png({ compressionLevel: 9, adaptiveFiltering: true }); + } else { + transformer.webp({ quality: 82, effort: 5 }); + } + + const optimizedBuffer = await transformer.toBuffer(); + if (!optimizedBuffer.length || optimizedBuffer.length >= originalStats.size) { + return file; + } + + const temporaryPath = filePath + '.optimized-' + crypto.randomUUID(); + try { + await fs.promises.writeFile(temporaryPath, optimizedBuffer); + await fs.promises.rename(temporaryPath, filePath); + file.size = optimizedBuffer.length; + return file; + } finally { + await fs.promises.unlink(temporaryPath).catch(function () {}); + } +} + function normalizeMediaPath(value) { const mediaPath = String(value || '').trim(); return mediaPath.startsWith('/media/') ? mediaPath : null; @@ -103,6 +220,9 @@ async function syncMediaAssetsFromDirectory(pool, uploadDir, userId) { continue; } const originalName = String(entry.name || '').trim(); + if (/\.variant-\d+\.(?:jpe?g|png|webp)$/i.test(originalName)) { + continue; + } const mimeType = MEDIA_MIME_TYPES[path.extname(originalName).toLowerCase()]; if (!mimeType) { continue; @@ -163,11 +283,15 @@ async function removePendingMediaAssets(pool, uploadDir, mediaPaths) { throw error; } }); + await removeImageVariants(filePath); } } module.exports = { normalizeMediaPath, + createImageVariants, + removeImageVariants, + optimizeUploadedImage, registerMediaAsset, registerMediaAssets, fetchMediaAssets, diff --git a/src/web/lib/media/slide-thumbnail-preview.js b/src/web/lib/media/slide-thumbnail-preview.js index 94c6335..afa6f82 100644 --- a/src/web/lib/media/slide-thumbnail-preview.js +++ b/src/web/lib/media/slide-thumbnail-preview.js @@ -156,6 +156,10 @@ function buildRegionInnerHtml(region, regionContent, baseUrl) { return '
    ' + escapeHtml(label) + '
    '; } + if (regionType === 'chart') { + return '
    '; + } + return buildTextRegionMarkup(region, regionContent); } @@ -188,6 +192,7 @@ function buildThumbnailPreviewPayload(slide, options) { backgroundColor: template && template.background_color ? String(template.background_color) : '#111111', backgroundGradient: template && template.background_gradient ? String(template.background_gradient) : '', backgroundImagePath: template && template.background_image_path ? String(template.background_image_path) : '', + apiSources: Array.isArray(options && options.apiSources) ? options.apiSources : [], fontStylesheetHref: String(options && options.fontStylesheetHref || '').trim(), html: buildThumbnailPreviewMarkup(slide, options && options.baseUrl) }; diff --git a/src/web/lib/media/upload-sync.js b/src/web/lib/media/upload-sync.js index 3088898..7bec2d8 100644 --- a/src/web/lib/media/upload-sync.js +++ b/src/web/lib/media/upload-sync.js @@ -1,53 +1,29 @@ // Upload sync helpers for mirroring web media to player storage. +// This service owns the upload queue and deferred player-target selection, while the shared +// player registry helper owns the repeated URL/heartbeat resolution rules used elsewhere. const fs = require('fs'); const path = require('path'); const crypto = require('crypto'); const multer = require('multer'); const { createRequestAuthHeaders } = require('#src/request-auth'); -const { collectFontLibrarySyncOperations } = require('./font-library'); -const { fetchPlayerRegistrations, getConfiguredPlayerIdentifier } = require('#src/data/player-registry'); +const { collectFontLibrarySyncOperations } = require('#src/web/lib/media/font-library'); +const { + fetchPlayerRegistrations, + getConfiguredPlayerIdentifier, + isLocalLikeBaseUrl, + isRecentPlayerRegistration, + normalizeBaseUrl +} = require('#src/data/player-registry'); function normalizeUploadRoot(uploadDir) { return path.resolve(String(uploadDir || '').trim()); } -function isLocalLikeBaseUrl(value) { - let host = ''; - try { - host = new URL(String(value || '').trim().replace(/\/$/, '')).hostname.toLowerCase(); - } catch (_error) { - return false; - } - - return host === 'localhost' - || host === '127.0.0.1' - || host === '::1' - || host === 'host.docker.internal' - || host === 'player' - || host === 'web' - || host === 'player-bridge' - || host.endsWith('.local') - || host.endsWith('.internal') - || host.endsWith('.docker.internal'); -} - -function normalizeBaseUrl(value) { - return String(value || '').trim().replace(/\/$/, ''); -} - function normalizePlayerRowBaseUrl(player) { return normalizeBaseUrl(player && player.internal_base_url); } -function isRecentPlayerRegistration(player, staleSeconds) { - const lastSeenAt = player && player.last_seen_at; - const lastSeenAtValue = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime(); - const cutoffTime = Date.now() - Math.max(30, Number(staleSeconds || 60)) * 1000; - - return Number.isFinite(lastSeenAtValue) && lastSeenAtValue >= cutoffTime; -} - function createUploadSyncService(options) { const pool = options && options.pool; const common = options && options.common; @@ -297,6 +273,30 @@ function createUploadSyncService(options) { return path.join(mediaRoot, relativePath); } + async function getUploadPathsWithVariants(uploadPath, uploadDir) { + const normalizedPath = normalizeUploadReference(uploadPath); + const sourcePath = resolveUploadFilePath(uploadDir, normalizedPath); + if (!normalizedPath || !sourcePath || !/\.(?:jpe?g|png|webp)$/i.test(normalizedPath)) { + return normalizedPath ? [normalizedPath] : []; + } + + const extension = path.extname(sourcePath); + const baseName = path.basename(sourcePath, extension); + const directory = path.dirname(sourcePath); + let entries = []; + try { + entries = await fs.promises.readdir(directory, { withFileTypes: true }); + } catch (_error) { + return [normalizedPath]; + } + + const variantPattern = new RegExp('^' + baseName.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\$&') + '\\.variant-\\d+' + extension.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\$&') + '$', 'i'); + return [normalizedPath].concat(entries + .filter(function (entry) { return entry && entry.isFile() && variantPattern.test(entry.name); }) + .map(function (entry) { return normalizedPath.replace(/[^/]+$/, entry.name); }) + .sort()); + } + function collectUploadReferencesFromValue(value, refs) { if (!value) { return refs; @@ -584,8 +584,8 @@ function createUploadSyncService(options) { } } - async function removeUploadFileFromPlayer(uploadPath, localUploadDir, resolvedPlayerInternalBaseUrl, preferredPlayerIdentifier) { - if (!uploadPath || !shouldMirrorUploads(localUploadDir)) { + async function removeSingleUploadFileFromPlayer(uploadPath, resolvedPlayerInternalBaseUrl, preferredPlayerIdentifier) { + if (!uploadPath) { return false; } @@ -632,6 +632,17 @@ function createUploadSyncService(options) { } } + async function removeUploadFileFromPlayer(uploadPath, localUploadDir, resolvedPlayerInternalBaseUrl, preferredPlayerIdentifier) { + const uploadPaths = await getUploadPathsWithVariants(uploadPath, localUploadDir); + let success = true; + for (let index = 0; index < uploadPaths.length; index += 1) { + if (!await removeSingleUploadFileFromPlayer(uploadPaths[index], resolvedPlayerInternalBaseUrl, preferredPlayerIdentifier)) { + success = false; + } + } + return success; + } + async function syncUploadRefsToPlayer(uploadRefs, localUploadDir, preferredPlayerIdentifier, preferredPlayerInternalBaseUrl) { if (!shouldMirrorUploads(localUploadDir)) { return; @@ -640,19 +651,23 @@ function createUploadSyncService(options) { const resolvedPlayerInternalBaseUrl = await getPlayerInternalBaseUrl(preferredPlayerIdentifier, preferredPlayerInternalBaseUrl); const uniqueRefs = Array.from(new Set((uploadRefs || []).map(normalizeUploadReference).filter(Boolean))); for (let i = 0; i < uniqueRefs.length; i += 1) { - const success = await pushUploadFileToPlayer(uniqueRefs[i], localUploadDir, resolvedPlayerInternalBaseUrl, preferredPlayerIdentifier); - if (!success) { - queuePlayerUploadSync({ - type: 'put', - uploadPath: uniqueRefs[i], - uploadDir: localUploadDir, - playerIdentifier: preferredPlayerIdentifier, - playerInternalBaseUrl: preferredPlayerInternalBaseUrl, - metadata: preferredPlayerIdentifier || preferredPlayerInternalBaseUrl ? { - playerIdentifier: preferredPlayerIdentifier || null, - playerInternalBaseUrl: preferredPlayerInternalBaseUrl || null - } : null - }); + const uploadPaths = await getUploadPathsWithVariants(uniqueRefs[i], localUploadDir); + for (let pathIndex = 0; pathIndex < uploadPaths.length; pathIndex += 1) { + const uploadPath = uploadPaths[pathIndex]; + const success = await pushUploadFileToPlayer(uploadPath, localUploadDir, resolvedPlayerInternalBaseUrl, preferredPlayerIdentifier); + if (!success) { + queuePlayerUploadSync({ + type: 'put', + uploadPath: uploadPath, + uploadDir: localUploadDir, + playerIdentifier: preferredPlayerIdentifier, + playerInternalBaseUrl: preferredPlayerInternalBaseUrl, + metadata: preferredPlayerIdentifier || preferredPlayerInternalBaseUrl ? { + playerIdentifier: preferredPlayerIdentifier || null, + playerInternalBaseUrl: preferredPlayerInternalBaseUrl || null + } : null + }); + } } } } @@ -938,14 +953,17 @@ function createUploadSyncService(options) { }).forEach(function (uploadPath) { uploadRefs.add(uploadPath); }); - Array.from(uploadRefs).forEach(function (uploadPath) { - queuePlayerUploadSync({ - type: 'put', - uploadPath: uploadPath, - uploadDir: uploadDir, - metadata: playerMetadata + for (const uploadPath of uploadRefs) { + const uploadPaths = await getUploadPathsWithVariants(uploadPath, uploadDir); + uploadPaths.forEach(function (variantPath) { + queuePlayerUploadSync({ + type: 'put', + uploadPath: variantPath, + uploadDir: uploadDir, + metadata: playerMetadata + }); }); - }); + } fontLibraryOperations.forEach(function (operation) { if (!operation || !operation.uploadPath) { return; diff --git a/src/web/lib/player-actions.js b/src/web/lib/player-actions.js index 81df924..6af2bc6 100644 --- a/src/web/lib/player-actions.js +++ b/src/web/lib/player-actions.js @@ -1,39 +1,14 @@ // Commands and synchronization actions forwarded from the web app to players. +// Keep the routing layer separate from the actual player device commands so the web app can +// resolve a target player URL without mixing in connection or device-specific logic. const { createRequestAuthHeaders } = require('#src/request-auth'); -const { getConfiguredPlayerIdentifier } = require('#src/data/player-registry'); - -function isLocalLikeBaseUrl(value) { - let host = ''; - try { - host = new URL(String(value || '').trim().replace(/\/$/, '')).hostname.toLowerCase(); - } catch (_error) { - return false; - } - - return host === 'localhost' - || host === '127.0.0.1' - || host === '::1' - || host === 'host.docker.internal' - || host === 'player' - || host === 'web' - || host === 'player-bridge' - || host.endsWith('.local') - || host.endsWith('.internal') - || host.endsWith('.docker.internal'); -} - -function normalizeBaseUrl(value) { - return String(value || '').trim().replace(/\/$/, ''); -} - -function isRecentPlayerRegistration(player, staleSeconds) { - const lastSeenAt = player && player.last_seen_at; - const lastSeenAtValue = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime(); - const cutoffTime = Date.now() - Math.max(30, Number(staleSeconds || 60)) * 1000; - - return Number.isFinite(lastSeenAtValue) && lastSeenAtValue >= cutoffTime; -} +const { + getConfiguredPlayerIdentifier, + isLocalLikeBaseUrl, + isRecentPlayerRegistration, + normalizeBaseUrl +} = require('#src/data/player-registry'); function createPlayerActionService(options) { const pool = options && options.pool; diff --git a/src/web/lib/region-scripts.js b/src/web/lib/region-scripts.js index dde8a14..6269389 100644 --- a/src/web/lib/region-scripts.js +++ b/src/web/lib/region-scripts.js @@ -6,7 +6,7 @@ const path = require('path'); const PUBLIC_JS_ROOT = path.join(__dirname, '..', 'public', 'js'); const REGION_ROOT_DIR = path.join(PUBLIC_JS_ROOT, 'regions'); const REGION_TYPE_DIR = path.join(REGION_ROOT_DIR, 'type'); -const REGION_CORE_SCRIPTS = ['js/shared/placeholder-utils.js', 'js/shared/placeholder-chips.js', 'js/shared/placeholder-info.js', 'js/shared/time-date-placeholders.js', 'js/regions/region-utils.js', 'js/regions/region-types.js']; +const REGION_CORE_SCRIPTS = ['js/shared/placeholder-utils.js', 'js/shared/placeholder-chips.js', 'js/shared/placeholder-info.js', 'js/shared/time-date-placeholders.js', 'js/regions/region-utils.js', 'js/regions/region-types.js', 'js/regions/chart-data.js', 'vendor/chart.js/chart.umd.js']; function withAssetVersion(scriptPath, assetVersion) { if (!assetVersion) { diff --git a/src/web/pages/index.js b/src/web/pages/index.js index fb80a45..18d39b0 100644 --- a/src/web/pages/index.js +++ b/src/web/pages/index.js @@ -58,7 +58,7 @@ module.exports = { renderMediaLibraryPage: require(routePath('settings', 'media-library', 'list')), renderBackgroundTasksPage: require(routePath('settings', 'background-tasks-page')).renderBackgroundTasksPage, renderBackgroundTasksScheduledPage: require(routePath('settings', 'background-tasks-page')).renderBackgroundTasksScheduledPage, - renderErrorPage: require('./error'), + renderErrorPage: require('#src/web/pages/error'), renderRbacPage: require(routePath('settings', 'rbac', 'list')), renderRbacAddPage: require(routePath('settings', 'rbac', 'add')), renderRbacEditPage: require(routePath('settings', 'rbac', 'edit')) diff --git a/src/web/public/css/theme-custom.css b/src/web/public/css/theme-custom.css index 5063b80..418d84f 100644 --- a/src/web/public/css/theme-custom.css +++ b/src/web/public/css/theme-custom.css @@ -162,12 +162,6 @@ width: 100%; height: 100%; object-fit: cover; - transition: transform .2s ease; -} - -.media-gallery-preview:hover img, -.media-gallery-preview:hover video { - transform: scale(1.03); } .media-gallery-preview:focus-visible { diff --git a/src/web/public/js/media-picker.js b/src/web/public/js/media-picker.js index a6fc79c..08725b0 100644 --- a/src/web/public/js/media-picker.js +++ b/src/web/public/js/media-picker.js @@ -204,6 +204,87 @@ } } + function queueUploadCleanup(input, uploadPath) { + var path = String(uploadPath || '').trim(); + var cleanupUrl = String(input && input.dataset.uploadCleanupUrl || '').trim(); + if (!path || !cleanupUrl) { + return; + } + var payload = JSON.stringify({ uploadPaths: [path] }); + if (navigator.sendBeacon) { + try { + navigator.sendBeacon(cleanupUrl, new Blob([payload], { type: 'application/json' })); + return; + } catch (_error) { + // Fall through to fetch when sendBeacon is unavailable. + } + } + fetch(cleanupUrl, { + method: 'POST', + headers: { 'Content-Type': 'application/json', Accept: 'application/json' }, + body: payload, + credentials: 'same-origin', + keepalive: true + }).catch(function () {}); + } + + async function uploadSelectedFile(input, file) { + var uploadUrl = String(input.dataset.uploadUrl || '').trim(); + var hidden = document.getElementById(String(input.dataset.uploadHidden || '').trim()); + if (!uploadUrl || !hidden || !file) { + return; + } + + var maxBytes = Number(input.dataset.imageMaxBytes || 0); + if (maxBytes > 0 && file.size > maxBytes) { + input.value = ''; + window.PulseUpload.showMessage('This file is larger than the current upload limit of ' + window.PulseUpload.formatUploadLimit(maxBytes) + '.'); + return; + } + + var formData = new FormData(); + formData.append('file', file, file.name || 'upload'); + input.setCustomValidity('Upload is still in progress.'); + try { + var response = await fetch(uploadUrl, { + method: 'POST', + body: formData, + credentials: 'same-origin', + headers: { Accept: 'application/json', 'X-Requested-With': 'XMLHttpRequest' } + }); + var payload = await response.json().catch(function () { return {}; }); + if (!response.ok || !payload.path) { + throw new Error(payload.error || 'Unable to upload media.'); + } + var previousPath = String(input.dataset.uploadedPath || '').trim(); + if (previousPath && previousPath !== payload.path) { + queueUploadCleanup(input, previousPath); + } + input.dataset.uploadedPath = payload.path; + input.dataset.uploadedNeedsCleanup = '1'; + input.value = ''; + input.setCustomValidity(''); + hidden.value = payload.path; + hidden.dispatchEvent(new Event('change', { bubbles: true })); + updatePreview(hidden, payload.path, 'image'); + } catch (error) { + input.value = ''; + var currentPath = String(hidden.value || '').trim(); + var backgroundPreview = document.getElementById('background-preview'); + var backgroundEmpty = document.getElementById('background-empty'); + if (currentPath) { + updatePreview(hidden, currentPath, 'image'); + } else if (backgroundPreview) { + backgroundPreview.removeAttribute('src'); + backgroundPreview.style.display = 'none'; + if (backgroundEmpty) backgroundEmpty.style.display = 'flex'; + } + input.setCustomValidity(''); + window.PulseUpload.showMessage(error.message || 'Unable to upload media.'); + } finally { + } + } + document.addEventListener('click', function (event) { var uploadTrigger = event.target && event.target.closest ? event.target.closest('[data-media-picker-upload]') : null; if (uploadTrigger) { @@ -247,8 +328,46 @@ updateSelection(); }); + document.addEventListener('click', function (event) { + var removeBackground = event.target && event.target.closest ? event.target.closest('#remove-background-image') : null; + if (!removeBackground) { + return; + } + var input = document.getElementById('background-image'); + if (input && input.dataset.uploadedNeedsCleanup === '1') { + queueUploadCleanup(input, input.dataset.uploadedPath); + delete input.dataset.uploadedNeedsCleanup; + delete input.dataset.uploadedPath; + } + }); + if (search) search.addEventListener('input', resetVisibleItemLimit); if (sort) sort.addEventListener('change', resetVisibleItemLimit); + document.addEventListener('change', function (event) { + var input = event.target; + if (!input || input.type !== 'file' || !input.dataset) { + return; + } + var file = input.files && input.files[0]; + if (input.dataset.uploadUrl) { + input.setCustomValidity(''); + if (file) { + uploadSelectedFile(input, file); + } + return; + } + if (!input.dataset.uploadMaxBytes) { + return; + } + var maxBytes = Number(input.dataset.uploadMaxBytes); + if (!file || !Number.isFinite(maxBytes) || maxBytes <= 0 || file.size <= maxBytes) { + input.setCustomValidity(''); + return; + } + input.value = ''; + input.setCustomValidity('Image must be ' + Math.round(maxBytes / 1024 / 1024) + ' MB or smaller.'); + input.reportValidity(); + }); if (loadMoreButton) loadMoreButton.addEventListener('click', async function () { loadMoreButton.disabled = true; try { @@ -274,12 +393,31 @@ closePicker(); return; } + var input = getActiveFileInput(); + if (input && input.dataset.uploadedNeedsCleanup === '1' && input.dataset.uploadedPath !== pendingPath) { + queueUploadCleanup(input, input.dataset.uploadedPath); + delete input.dataset.uploadedNeedsCleanup; + delete input.dataset.uploadedPath; + } hidden.value = pendingPath; updatePreview(hidden, pendingPath, pendingType); hidden.dispatchEvent(new Event('change', { bubbles: true })); closePicker(); }); if (cancelButton) cancelButton.addEventListener('click', closePicker); + document.querySelectorAll('input[type="file"][data-upload-url]').forEach(function (input) { + var form = input.form; + if (form) { + form.addEventListener('submit', function () { + delete input.dataset.uploadedNeedsCleanup; + }); + } + }); + window.addEventListener('beforeunload', function () { + document.querySelectorAll('input[type="file"][data-upload-url][data-uploaded-needs-cleanup="1"]').forEach(function (input) { + queueUploadCleanup(input, input.dataset.uploadedPath); + }); + }); modal.addEventListener('hidden.bs.modal', function () { activeButton = null; currentPath = ''; diff --git a/src/web/public/js/regions/chart-data.js b/src/web/public/js/regions/chart-data.js new file mode 100644 index 0000000..c8a54cb --- /dev/null +++ b/src/web/public/js/regions/chart-data.js @@ -0,0 +1,257 @@ +// Normalize chart configurations and source snapshots for editor previews and player playback. + +(function () { + var root = window; + var allowedTypes = ['line', 'bar', 'doughnut', 'pie']; + + function getPath(value, path) { + var current = value; + var parts = String(path || '').trim().replace(/\[([0-9]+)\]/g, '.$1').split('.').filter(Boolean); + for (var index = 0; index < parts.length; index += 1) { + if (current === undefined || current === null) { + return undefined; + } + current = current[parts[index]]; + } + return current; + } + + function toNumber(value) { + if (typeof value === 'number') { + return Number.isFinite(value) ? value : null; + } + var normalized = String(value === undefined || value === null ? '' : value).replace(/,/g, '').trim(); + if (!normalized) { + return null; + } + var parsed = Number(normalized); + return Number.isFinite(parsed) ? parsed : null; + } + + function normalizeChartType(value) { + var type = String(value || 'bar').trim().toLowerCase(); + return allowedTypes.indexOf(type) !== -1 ? type : 'bar'; + } + + function getApiItems(response, itemsPath) { + var selected = itemsPath ? getPath(response, itemsPath) : response; + if (Array.isArray(selected)) { + return selected; + } + if (Array.isArray(response)) { + return response; + } + if (response && Array.isArray(response.items)) return response.items; + if (response && Array.isArray(response.results)) return response.results; + if (response && Array.isArray(response.data)) return response.data; + return response && typeof response === 'object' ? [response] : []; + } + + function normalizeRows(rows, mapping) { + var labels = []; + var values = []; + var labelPath = String(mapping && (mapping.label || mapping.label_path) || 'label').trim(); + var valuePath = String(mapping && (mapping.value || mapping.value_path) || 'value').trim(); + (Array.isArray(rows) ? rows : []).forEach(function (row, index) { + var label = getPath(row, labelPath); + var value = toNumber(getPath(row, valuePath)); + if (value === null) { + return; + } + labels.push(label === undefined || label === null || label === '' ? String(index + 1) : String(label)); + values.push(value); + }); + return { labels: labels, values: values }; + } + + function normalizeConfig(content) { + var current = content && typeof content === 'object' ? content : {}; + var mapping = current.mapping && typeof current.mapping === 'object' ? current.mapping : {}; + var rawDatasets = Array.isArray(current.datasets) ? current.datasets : []; + var datasets = rawDatasets.slice(0, 12).map(function (dataset, index) { + var item = dataset && typeof dataset === 'object' ? dataset : {}; + return { + label: String(item.label || 'Series ' + (index + 1)).trim() || 'Series ' + (index + 1), + value_path: String(item.value_path || item.value || '').trim(), + color: /^#[0-9a-fA-F]{3,8}$/.test(String(item.color || '').trim()) ? String(item.color).trim() : '' + }; + }).filter(function (dataset) { return dataset.value_path; }); + var palette = Array.isArray(current.colors) + ? current.colors + : String(current.color_palette || '').split(','); + palette = palette.map(function (color) { + return String(color || '').trim(); + }).filter(function (color) { + return /^#[0-9a-fA-F]{3,8}$/.test(color); + }).slice(0, 24); + var fallbackColor = /^#[0-9a-fA-F]{3,8}$/.test(String(current.color || '').trim()) ? String(current.color).trim() : '#36a269'; + var chartOptions = current.chart_options && typeof current.chart_options === 'object' ? current.chart_options : {}; + var sourceOptions = current.source_options && typeof current.source_options === 'object' ? current.source_options : {}; + return { + type: normalizeChartType(current.chart_type || current.chartType), + source_kind: String(current.source_kind || current.sourceKind || 'manual').trim().toLowerCase() === 'api' ? 'api' : 'manual', + source_id: current.source_id === undefined || current.source_id === '' ? '' : Number(current.source_id), + items_path: String(current.items_path || '').trim(), + label_path: String(current.label_path || mapping.label || '').trim(), + value_path: String(current.value_path || mapping.value || '').trim(), + dataset_label: String(current.dataset_label || 'Value').trim() || 'Value', + color: fallbackColor, + datasets: datasets, + colors: palette.length ? palette : [fallbackColor, '#3b82f6', '#f59e0b', '#ef4444', '#8b5cf6', '#14b8a6'], + manual_rows: Array.isArray(current.manual_rows) ? current.manual_rows : [], + chart_options: { + legend: ['automatic', 'show', 'hide'].indexOf(String(chartOptions.legend || 'automatic')) !== -1 ? String(chartOptions.legend || 'automatic') : 'automatic', + begin_at_zero: chartOptions.begin_at_zero !== false, + y_axis_min: chartOptions.y_axis_min === undefined || chartOptions.y_axis_min === '' ? '' : Number(chartOptions.y_axis_min), + y_axis_max: chartOptions.y_axis_max === undefined || chartOptions.y_axis_max === '' ? '' : Number(chartOptions.y_axis_max), + line_points: ['automatic', 'show', 'hide'].indexOf(String(chartOptions.line_points || 'automatic')) !== -1 ? String(chartOptions.line_points || 'automatic') : 'automatic', + line_fill: chartOptions.line_fill === true, + bar_orientation: chartOptions.bar_orientation === 'horizontal' ? 'horizontal' : 'vertical', + value_format: ['number', 'percent', 'currency'].indexOf(String(chartOptions.value_format || 'number')) !== -1 ? String(chartOptions.value_format || 'number') : 'number', + decimal_places: Math.max(0, Math.min(4, Number(chartOptions.decimal_places) || 0)), + text_size: Math.max(8, Math.min(48, Number(chartOptions.text_size) || 12)), + grid_color: /^#[0-9a-fA-F]{6}$/.test(String(chartOptions.grid_color || '').trim()) ? String(chartOptions.grid_color).trim() : '#000000', + text_color: /^#[0-9a-fA-F]{6}$/.test(String(chartOptions.text_color || '').trim()) ? String(chartOptions.text_color).trim() : '#000000' + }, + source_options: { + sort: ['none', 'reverse-original', 'value-ascending', 'value-descending'].indexOf(String(sourceOptions.sort || 'none')) !== -1 ? String(sourceOptions.sort || 'none') : 'none', + limit: Math.max(0, Math.min(500, Number(sourceOptions.limit) || 0)), + missing: ['skip', 'zero', 'gap'].indexOf(String(sourceOptions.missing || 'gap')) !== -1 ? String(sourceOptions.missing || 'gap') : 'gap' + } + }; + } + + function isColor(value) { + return /^#[0-9a-fA-F]{3,8}$/.test(String(value || '').trim()); + } + + function getSeries(config) { + if (config.type === 'line' && config.datasets.length) { + return config.datasets; + } + var firstDataset = config.datasets[0] || {}; + return [{ + label: config.dataset_label, + value_path: config.value_path || firstDataset.value_path || 'value', + color: config.color || firstDataset.color + }]; + } + + function normalizeSeries(rows, config) { + var series = getSeries(config); + var labels = []; + var values = series.map(function () { return []; }); + var colors = []; + var sourceOptions = config.source_options || {}; + var sourceRows = (Array.isArray(rows) ? rows : []).slice(); + if (sourceOptions.sort !== 'none' && sourceOptions.sort !== 'reverse-original') { + sourceRows.sort(function (left, right) { + var firstSeries = series[0] || {}; + var leftValue = toNumber(getPath(left, firstSeries.value_path)); + var rightValue = toNumber(getPath(right, firstSeries.value_path)); + if (leftValue === null) return 1; + if (rightValue === null) return -1; + return (leftValue - rightValue) * (sourceOptions.sort === 'value-descending' ? -1 : 1); + }); + } + if (sourceOptions.sort === 'reverse-original') sourceRows.reverse(); + if (sourceOptions.limit > 0) sourceRows = sourceRows.slice(0, sourceOptions.limit); + sourceRows.forEach(function (row, rowIndex) { + var rowValues = series.map(function (dataset) { + return toNumber(getPath(row, dataset.value_path)); + }); + if (!rowValues.some(function (value) { return value !== null; })) { + return; + } + if (sourceOptions.missing === 'skip' && rowValues.some(function (value) { return value === null; })) { + return; + } + if (sourceOptions.missing === 'zero') { + rowValues = rowValues.map(function (value) { return value === null ? 0 : value; }); + } + var label = getPath(row, config.label_path || 'label'); + labels.push(label === undefined || label === null || label === '' ? String(rowIndex + 1) : String(label)); + rowValues.forEach(function (value, datasetIndex) { + values[datasetIndex].push(value); + }); + colors.push(isColor(row && row.color) ? String(row.color).trim() : config.colors[rowIndex % config.colors.length]); + }); + return { labels: labels, values: values, colors: colors }; + } + + function fromContent(content, sources) { + var config = normalizeConfig(content); + var rows = config.manual_rows; + if (config.source_kind === 'api') { + var source = (Array.isArray(sources) ? sources : []).find(function (entry) { + return Number(entry.id) === Number(config.source_id); + }); + rows = getApiItems(source && source.responseJson, config.items_path || source && (source.items_path || source.itemsPath) || ''); + } + var normalizedRows = normalizeSeries(rows, config); + var series = getSeries(config); + var linePointRadius = config.chart_options.line_points === 'show' ? 3 : config.chart_options.line_points === 'hide' ? 0 : undefined; + return { + type: config.type, + options: { chart_options: config.chart_options }, + labels: normalizedRows.labels, + datasets: series.map(function (dataset, index) { + var color = dataset.color || config.colors[index % config.colors.length]; + var pointColors = config.type === 'bar' || config.type === 'pie' || config.type === 'doughnut' ? normalizedRows.colors : null; + return { + label: dataset.label, + data: normalizedRows.values[index], + backgroundColor: pointColors || color, + borderColor: pointColors || color, + borderWidth: 2, + tension: 0.25, + fill: config.type === 'line' && config.chart_options.line_fill, + pointRadius: linePointRadius + }; + }) + }; + } + + function getChartOptions(chartData) { + var chartOptions = chartData.options && chartData.options.chart_options || {}; + var textSize = Math.max(8, Math.min(48, Number(chartOptions.text_size) || 12)); + var legendDefault = chartData.type !== 'bar' && (chartData.type !== 'line' || (chartData.datasets || []).length > 1); + var legendDisplay = chartOptions.legend === 'show' ? true : chartOptions.legend === 'hide' ? false : legendDefault; + var scales = {}; + var ticks = { color: chartOptions.text_color || '#000000', font: { size: textSize } }; + if (chartData.type !== 'pie' && chartData.type !== 'doughnut') { + var valueScale = { beginAtZero: chartOptions.begin_at_zero !== false, grid: { color: chartOptions.grid_color || '#000000' }, ticks: ticks }; + if (chartOptions.y_axis_min !== '') valueScale.min = chartOptions.y_axis_min; + if (chartOptions.y_axis_max !== '') valueScale.max = chartOptions.y_axis_max; + scales[chartData.type === 'bar' && chartOptions.bar_orientation === 'horizontal' ? 'x' : 'y'] = valueScale; + if (chartData.type === 'bar' && chartOptions.bar_orientation === 'horizontal') scales.y = { beginAtZero: true, grid: { color: chartOptions.grid_color || '#000000' }, ticks: ticks }; + if (!scales.x) scales.x = { grid: { color: chartOptions.grid_color || '#000000' }, ticks: ticks }; + if (!scales.y) scales.y = { grid: { color: chartOptions.grid_color || '#000000' }, ticks: ticks }; + } + var tooltipLabel = function (context) { + var value = context.parsed && (context.parsed.y === undefined ? context.parsed : context.parsed.y); + var decimals = Number(chartOptions.decimal_places) || 0; + if (chartOptions.value_format === 'percent') return Number(value).toFixed(decimals) + '%'; + if (chartOptions.value_format === 'currency') return '$' + Number(value).toFixed(decimals); + return Number(value).toLocaleString(undefined, { maximumFractionDigits: decimals }); + }; + return { + responsive: true, + maintainAspectRatio: false, + animation: false, + indexAxis: chartData.type === 'bar' && chartOptions.bar_orientation === 'horizontal' ? 'y' : 'x', + color: chartOptions.text_color || '#000000', + font: { size: textSize }, + plugins: { legend: { display: legendDisplay, labels: { color: chartOptions.text_color || '#000000', font: { size: textSize } } }, tooltip: { titleColor: chartOptions.text_color || '#000000', bodyColor: chartOptions.text_color || '#000000', footerColor: chartOptions.text_color || '#000000', titleFont: { size: textSize }, bodyFont: { size: textSize }, footerFont: { size: textSize }, callbacks: { label: tooltipLabel } } }, + scales: scales + }; + } + + root.pulseChartData = { + getPath: getPath, + normalizeConfig: normalizeConfig, + normalizeRows: normalizeRows, + fromContent: fromContent, + getChartOptions: getChartOptions + }; +}()); diff --git a/src/web/public/js/regions/type/chart.js b/src/web/public/js/regions/type/chart.js new file mode 100644 index 0000000..387e9c2 --- /dev/null +++ b/src/web/public/js/regions/type/chart.js @@ -0,0 +1,271 @@ +// Chart region editor and preview helpers. + +(function () { + var registry = window.pulseRegionTypes; + var chartData = window.pulseChartData; + var defaultSeriesColors = ['#36a269', '#3b82f6', '#f59e0b', '#ef4444', '#8b5cf6', '#14b8a6']; + + function escapeHtml(value) { + return window.pulseRegionUtils && window.pulseRegionUtils.escapeHtml + ? window.pulseRegionUtils.escapeHtml(value) + : String(value === undefined || value === null ? '' : value); + } + + function parseRows(value) { + try { + var parsed = JSON.parse(String(value || '[]')); + return Array.isArray(parsed) ? parsed : []; + } catch (_error) { + return []; + } + } + + function getCurrentConfig(region, existingContent) { + var current = existingContent && existingContent[region.region_key] ? existingContent[region.region_key] : {}; + var config = chartData.normalizeConfig(current); + config.manual_rows_json = JSON.stringify(config.manual_rows, null, 2); + config.datasets_json = JSON.stringify(config.datasets, null, 2); + return config; + } + + function renderPreview(region, content, context) { + var normalized = chartData.fromContent(content || {}, context && context.sources || []); + var chartId = 'chart-preview-' + region.id; + var label = escapeHtml((content && content.dataset_label) || 'Value'); + return '
    ' + + '' + + '
    '; + } + + function initPreview(root) { + if (typeof window.Chart !== 'function' || !root || !root.querySelectorAll) { + return; + } + root.querySelectorAll('.template-region.chart canvas').forEach(function (canvas) { + var data = {}; + try { data = JSON.parse(canvas.getAttribute('data-chart-json') || '{}'); } catch (_error) { data = {}; } + new window.Chart(canvas.getContext('2d'), { + type: data.type || 'bar', + data: { labels: data.labels || [], datasets: data.datasets || [] }, + options: chartData.getChartOptions(data) + }); + }); + } + + function syncSourceFields(card) { + if (!card || !card.querySelector) { + return; + } + var sourceKind = card.querySelector('[name^="region_chart_source_kind_"]'); + var isApi = sourceKind && sourceKind.value === 'api'; + card.querySelectorAll('[data-chart-source-panel="api"], [data-chart-source-panel="manual"]').forEach(function (panel) { + var visible = panel.getAttribute('data-chart-source-panel') === (isApi ? 'api' : 'manual'); + panel.hidden = !visible; + panel.querySelectorAll('input, select, textarea').forEach(function (input) { + input.disabled = !visible; + }); + }); + } + + function renderDatasetRow(dataset, index, regionId) { + var current = dataset || {}; + var hasColor = /^#[0-9a-fA-F]{3,8}$/.test(String(current.color || '').trim()); + return '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    '; + } + + function bindEditorCard(context) { + var card = context && context.card; + if (!card) { + return; + } + var sourceKind = card.querySelector('[name^="region_chart_source_kind_"]'); + var chartType = card.querySelector('[name^="region_chart_type_"]'); + var datasetEditor = card.querySelector('[data-chart-dataset-editor]'); + var singleValueFields = card.querySelectorAll('[data-chart-single-value-field]'); + if (sourceKind) { + sourceKind.addEventListener('change', function () { + syncSourceFields(card); + if (context.requestPreviewRender) context.requestPreviewRender(); + }); + } + function syncDatasetEditor() { + var usesDatasets = chartType && chartType.value === 'line'; + if (datasetEditor) { + datasetEditor.hidden = !usesDatasets; + } + singleValueFields.forEach(function (field) { + field.hidden = usesDatasets; + }); + card.querySelectorAll('[data-chart-option-types]').forEach(function (field) { + var types = String(field.getAttribute('data-chart-option-types') || '').split(' '); + var hidden = !chartType || types.indexOf(chartType.value) === -1; + field.hidden = hidden; + field.classList.toggle('d-none', hidden); + }); + } + if (chartType) { + chartType.addEventListener('change', function () { + syncDatasetEditor(); + if (context.requestPreviewRender) context.requestPreviewRender(); + }); + } + var regionId = card.getAttribute('data-region-id'); + var datasetList = card.querySelector('[data-chart-datasets]'); + var datasetInput = card.querySelector('[name="region_chart_datasets_' + regionId + '"]'); + var addDatasetButton = card.querySelector('[data-chart-dataset-add]'); + function syncDatasets() { + var datasets = []; + card.querySelectorAll('[data-chart-dataset-row]').forEach(function (row) { + var label = row.querySelector('[data-chart-dataset-label]'); + var valuePath = row.querySelector('[data-chart-dataset-value]'); + var color = row.querySelector('[data-chart-dataset-color]'); + var explicitColor = color && color.getAttribute('data-chart-dataset-color-explicit') === 'true'; + if (valuePath && valuePath.value.trim()) { + datasets.push({ label: label && label.value.trim() || 'Series ' + (datasets.length + 1), value_path: valuePath.value.trim(), color: explicitColor ? color.value : '' }); + } + }); + if (datasetInput) datasetInput.value = JSON.stringify(datasets); + if (context.requestPreviewRender) context.requestPreviewRender(); + } + if (addDatasetButton && datasetList) { + addDatasetButton.addEventListener('click', function () { + var index = datasetList.querySelectorAll('[data-chart-dataset-row]').length; + datasetList.insertAdjacentHTML('beforeend', renderDatasetRow({ label: 'Series ' + (index + 1), value_path: '' }, index, regionId)); + syncDatasets(); + }); + } + if (datasetList) { + datasetList.addEventListener('input', function (event) { + if (event.target.matches('[data-chart-dataset-color]')) { + event.target.setAttribute('data-chart-dataset-color-explicit', 'true'); + } + syncDatasets(); + }); + datasetList.addEventListener('change', syncDatasets); + datasetList.addEventListener('click', function (event) { + var removeButton = event.target.closest('[data-chart-dataset-remove]'); + if (!removeButton) return; + var rows = datasetList.querySelectorAll('[data-chart-dataset-row]'); + if (rows.length > 1) removeButton.closest('[data-chart-dataset-row]').remove(); + syncDatasets(); + }); + syncDatasets(); + } + syncSourceFields(card); + syncDatasetEditor(); + } + + function renderEditorCard(context) { + var region = context.region; + var current = context.current || {}; + var config = context.config || {}; + var chartOptions = config.chart_options || {}; + var sourceOptions = config.source_options || {}; + var datasets = config.datasets && config.datasets.length ? config.datasets : [{ label: config.dataset_label || 'Value', value_path: config.value_path || 'value', color: '' }]; + var datasetRows = datasets.map(function (dataset, index) { return renderDatasetRow(dataset, index, region.id); }).join(''); + var accordionId = 'region-chart-options-' + region.id; + return '' + + '
    ' + + '
    ' + escapeHtml(region.label) + '
    Chart
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    Rows use a label and one or more mapped values, for example [{"label":"Mon","value":12,"color":"#36a269"}].
    ' + + '
    ' + datasetRows + '
    Add one section per API field or manual value. Set the color for each series here.
    ' + + '
    ' + + '
    ' + + '

    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '

    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    '; + } + + function buildPreviewRenderContext(region, card, existingContent, sources) { + var current = getCurrentConfig(region, existingContent || {}); + function value(name, fallback) { + var input = card && card.querySelector ? card.querySelector('[name="' + name + '_' + region.id + '"]') : null; + return input ? input.value : fallback; + } + function checked(name, fallback) { + var input = card && card.querySelector ? card.querySelector('[name="' + name + '_' + region.id + '"]') : null; + return input ? input.checked : fallback; + } + return { + type: 'chart', + chart_type: value('region_chart_type', current.type), + source_kind: value('region_chart_source_kind', current.source_kind), + source_id: value('region_chart_source_id', current.source_id), + items_path: value('region_chart_items_path', current.items_path), + label_path: value('region_chart_label_path', current.label_path), + value_path: value('region_chart_value_path', current.value_path), + dataset_label: value('region_chart_dataset_label', current.dataset_label), + color: value('region_chart_color', current.color), + datasets: parseRows(value('region_chart_datasets', current.datasets_json)), + manual_rows: parseRows(value('region_chart_manual_rows', current.manual_rows_json)), + chart_options: { + legend: value('region_chart_legend', current.chart_options.legend), + begin_at_zero: checked('region_chart_begin_at_zero', current.chart_options.begin_at_zero), + y_axis_min: value('region_chart_y_axis_min', current.chart_options.y_axis_min), + y_axis_max: value('region_chart_y_axis_max', current.chart_options.y_axis_max), + line_points: value('region_chart_line_points', current.chart_options.line_points), + line_fill: checked('region_chart_line_fill', current.chart_options.line_fill), + bar_orientation: value('region_chart_bar_orientation', current.chart_options.bar_orientation), + value_format: value('region_chart_value_format', current.chart_options.value_format), + decimal_places: value('region_chart_decimal_places', current.chart_options.decimal_places), + text_size: value('region_chart_text_size', current.chart_options.text_size), + grid_color: value('region_chart_grid_color', current.chart_options.grid_color), + text_color: value('region_chart_text_color', current.chart_options.text_color) + }, + source_options: { + sort: value('region_chart_source_sort', current.source_options.sort), + limit: value('region_chart_source_limit', current.source_options.limit), + reverse: false, + missing: value('region_chart_source_missing', current.source_options.missing) + }, + sources: Array.isArray(sources) ? sources : [] + }; + } + + registry.register('chart', { + label: 'Chart', + getDefaultRegionSize: function () { return { width: 480, height: 280 }; }, + getCurrentConfig: getCurrentConfig, + renderPreview: renderPreview, + initPreview: initPreview, + bindEditorCard: bindEditorCard, + renderEditorCard: renderEditorCard, + buildPreviewRenderContext: buildPreviewRenderContext + }); +}()); diff --git a/src/web/public/js/settings/media-library.js b/src/web/public/js/settings/media-library.js index 92a43ba..35c09e4 100644 --- a/src/web/public/js/settings/media-library.js +++ b/src/web/public/js/settings/media-library.js @@ -42,14 +42,6 @@ function getColumnsPerRow() { return window.innerWidth >= 1200 ? 6 : window.innerWidth >= 992 ? 3 : window.innerWidth >= 576 ? 2 : 1; } -function showUploadMessage(message) { - if (typeof window.showToast === 'function') { - window.showToast(message, 'warning'); - return; - } - window.alert(message); -} - function showModal(target) { if (window.pulseModal && typeof window.pulseModal.show === 'function') { window.pulseModal.show(target); @@ -229,12 +221,12 @@ function setUploadFile(file, shouldCrop) { const matchesType = allowedTypes.length === 0 || allowedTypes.indexOf(fileType) !== -1; const maxBytes = fileType.indexOf('video/') === 0 ? Number(uploadInput.dataset.videoMaxBytes) : Number(uploadInput.dataset.imageMaxBytes); if (!matchesType) { - showUploadMessage('This media type is disabled in Media Uploads settings.'); + window.PulseUpload.showMessage('This media type is disabled in Media Uploads settings.'); uploadInput.value = ''; return; } if (maxBytes && file.size > maxBytes) { - showUploadMessage('This file is larger than the configured upload limit.'); + window.PulseUpload.showMessage('This file is larger than the current upload limit of ' + window.PulseUpload.formatUploadLimit(maxBytes) + '.'); uploadInput.value = ''; return; } @@ -310,7 +302,7 @@ if (cropApply) { const outputType = cropSourceFile.type === 'image/jpeg' || cropSourceFile.type === 'image/webp' ? cropSourceFile.type : 'image/png'; cropper.getCroppedCanvas().toBlob(function (blob) { if (!blob) { - showUploadMessage('Unable to crop this image.'); + window.PulseUpload.showMessage('Unable to crop this image.'); return; } const extension = outputType === 'image/jpeg' ? '.jpg' : outputType === 'image/webp' ? '.webp' : '.png'; @@ -372,7 +364,7 @@ if (uploadForm) { uploadForm.addEventListener('submit', function (event) { if (uploadInput && !uploadInput.files.length) { event.preventDefault(); - showUploadMessage('Choose an image or video to upload.'); + window.PulseUpload.showMessage('Choose an image or video to upload.'); } }); } @@ -476,7 +468,7 @@ async function refreshGallery() { visibleRowLimit = 4; updateSearchResults(); } catch (error) { - showUploadMessage(error.message || 'Unable to refresh media.'); + window.PulseUpload.showMessage(error.message || 'Unable to refresh media.'); } } @@ -499,7 +491,7 @@ if (gallery) { event.preventDefault(); event.stopPropagation(); if (column.dataset.mediaUsed === 'true') { - showUploadMessage('This media is in use and cannot be selected.'); + window.PulseUpload.showMessage('This media is in use and cannot be selected.'); return; } const id = String(column.dataset.mediaId || ''); @@ -525,7 +517,7 @@ if (loadMoreButton) { visibleRowLimit += 4; updateSearchResults(); } catch (error) { - showUploadMessage(error.message || 'Unable to load more media.'); + window.PulseUpload.showMessage(error.message || 'Unable to load more media.'); } finally { loadMoreButton.disabled = false; } diff --git a/src/web/public/js/shared/upload-utils.js b/src/web/public/js/shared/upload-utils.js new file mode 100644 index 0000000..5a067e6 --- /dev/null +++ b/src/web/public/js/shared/upload-utils.js @@ -0,0 +1,21 @@ +(function (window) { + var uploadUtils = window.PulseUpload || {}; + + uploadUtils.formatUploadLimit = function (bytes) { + var megabytes = Number(bytes || 0) / 1024 / 1024; + if (megabytes >= 1024 && megabytes % 1024 === 0) { + return (megabytes / 1024) + ' GB'; + } + return (Number.isInteger(megabytes) ? megabytes : megabytes.toFixed(2).replace(/0+$/, '').replace(/\.$/, '')) + ' MB'; + }; + + uploadUtils.showMessage = function (message) { + if (typeof window.showToast === 'function') { + window.showToast(message, 'warning'); + return; + } + window.alert(message); + }; + + window.PulseUpload = uploadUtils; +})(window); diff --git a/src/web/public/js/slides/slide-form-editor.js b/src/web/public/js/slides/slide-form-editor.js index 4119a2e..7b6c0c7 100644 --- a/src/web/public/js/slides/slide-form-editor.js +++ b/src/web/public/js/slides/slide-form-editor.js @@ -615,7 +615,7 @@ export function createSlideFormEditorController(options) { promotion: false, relative_urls: false, remove_script_host: false, - convert_urls: true, + convert_urls: false, paste_data_images: false, paste_block_drop: true, resize: false, diff --git a/src/web/public/js/slides/slide-form-regions.js b/src/web/public/js/slides/slide-form-regions.js index cb9c0f2..36dc3c4 100644 --- a/src/web/public/js/slides/slide-form-regions.js +++ b/src/web/public/js/slides/slide-form-regions.js @@ -539,7 +539,7 @@ export function createSlideFormRegionHelpers(options) { if (module && typeof module.buildEditorCardContext === 'function') { return module.buildEditorCardContext({ region: region, - current: region.region_type === 'rss' || region.region_type === 'api' || region.region_type === 'time-date' || region.region_type === 'timetable' || region.region_type === 'weather' ? (existingContent[region.region_key] || {}) : getCurrentRegionValue(region), + current: region.region_type === 'rss' || region.region_type === 'api' || region.region_type === 'time-date' || region.region_type === 'timetable' || region.region_type === 'weather' || region.region_type === 'chart' ? (existingContent[region.region_key] || {}) : getCurrentRegionValue(region), currentDuration: getCurrentRegionVideoDuration(region), regionRatio: reduceAspectRatio(region.width, region.height), uploadMaxLabel: uploadMaxLabel, @@ -548,7 +548,7 @@ export function createSlideFormRegionHelpers(options) { uploadVideoMaxBytes: uploadVideoMaxBytes, uploadMimeTypes: uploadMimeTypes, disableAudio: (existingContent[region.region_key] || {}).disable_audio, - config: region.region_type === 'api' ? getCurrentApiConfig(region) : region.region_type === 'timetable' ? getCurrentTimetableConfig(region) : region.region_type === 'weather' ? { weather_location_id: (existingContent[region.region_key] || {}).weather_location_id || '' } : getCurrentRssConfig(region), + config: region.region_type === 'api' ? getCurrentApiConfig(region) : region.region_type === 'timetable' ? getCurrentTimetableConfig(region) : region.region_type === 'weather' ? { weather_location_id: (existingContent[region.region_key] || {}).weather_location_id || '' } : region.region_type === 'chart' && module && typeof module.getCurrentConfig === 'function' ? module.getCurrentConfig(region, existingContent) : getCurrentRssConfig(region), style: getCurrentTextStyle(region), fontSize: getCurrentTextStyle(region).font_size, feedOptions: rssFeeds.map(function (feed) { @@ -584,7 +584,7 @@ export function createSlideFormRegionHelpers(options) { return { region: region, - current: region.region_type === 'rss' || region.region_type === 'api' || region.region_type === 'weather' ? currentContent : getCurrentRegionValue(region), + current: region.region_type === 'rss' || region.region_type === 'api' || region.region_type === 'weather' || region.region_type === 'chart' ? currentContent : getCurrentRegionValue(region), currentDuration: getCurrentRegionVideoDuration(region), regionRatio: reduceAspectRatio(region.width, region.height), uploadMaxLabel: uploadMaxLabel, @@ -593,7 +593,7 @@ export function createSlideFormRegionHelpers(options) { uploadVideoMaxBytes: uploadVideoMaxBytes, uploadMimeTypes: uploadMimeTypes, disableAudio: currentContent.disable_audio, - config: region.region_type === 'api' ? apiConfig : region.region_type === 'timetable' ? getCurrentTimetableConfig(region) : region.region_type === 'weather' ? { weather_location_id: currentContent.weather_location_id || '' } : rssConfig, + config: region.region_type === 'api' ? apiConfig : region.region_type === 'timetable' ? getCurrentTimetableConfig(region) : region.region_type === 'weather' ? { weather_location_id: currentContent.weather_location_id || '' } : region.region_type === 'chart' ? ((getRegionTypeModule('chart') || {}).getCurrentConfig ? getRegionTypeModule('chart').getCurrentConfig(region, existingContent) : {}) : rssConfig, style: textStyle, fontSize: textStyle.font_size, feedOptions: rssFeeds.map(function (feed) { @@ -636,11 +636,15 @@ export function createSlideFormRegionHelpers(options) { Array.prototype.forEach.call(templateFields.querySelectorAll('[data-region-id]'), function (card) { var module = null; - if (!card || !card.querySelector || !card.querySelector('input[type="url"][name^="region_qr_code_"]')) { + if (!card || !card.querySelector) { return; } - module = getRegionTypeModule('qr-code'); + if (card.querySelector('input[type="url"][name^="region_qr_code_"]')) { + module = getRegionTypeModule('qr-code'); + } else if (card.querySelector('select[name^="region_chart_source_kind_"]')) { + module = getRegionTypeModule('chart'); + } if (module && typeof module.bindEditorCard === 'function') { module.bindEditorCard({ diff --git a/src/web/public/js/slides/slide-form.js b/src/web/public/js/slides/slide-form.js index 2da2a86..2946437 100644 --- a/src/web/public/js/slides/slide-form.js +++ b/src/web/public/js/slides/slide-form.js @@ -6,14 +6,6 @@ import { createSlideFormPreviewHelpers } from '/assets/js/slides/slide-form-prev (function () { var DEFAULT_FONT_SIZE = 32; - function formatUploadLimitLabel(bytes) { - var megabytes = Number(bytes || 0) / 1024 / 1024; - if (megabytes >= 1024 && megabytes % 1024 === 0) { - return String(megabytes / 1024) + ' GB'; - } - return (Number.isInteger(megabytes) ? String(megabytes) : megabytes.toFixed(2).replace(/0+$/, '').replace(/\.$/, '')) + ' MB'; - } - var dataElement = document.getElementById('slide-editor-data'); if (!dataElement) { return; @@ -48,11 +40,11 @@ import { createSlideFormPreviewHelpers } from '/assets/js/slides/slide-form-prev var openPreviewPopupButton = document.getElementById('open-preview-popup'); var uploadLimits = slideEditorData.uploadLimits || {}; var uploadMaxBytes = Number(uploadLimits.imageMaxBytes || 100 * 1024 * 1024); - var uploadMaxLabel = formatUploadLimitLabel(uploadMaxBytes); + var uploadMaxLabel = window.PulseUpload.formatUploadLimit(uploadMaxBytes); var uploadVideoMaxBytes = Number(uploadLimits.videoMaxBytes || 1024 * 1024 * 1024); - var uploadVideoMaxLabel = formatUploadLimitLabel(uploadVideoMaxBytes); + var uploadVideoMaxLabel = window.PulseUpload.formatUploadLimit(uploadVideoMaxBytes); var wysiwygImageUploadMaxBytes = Number(uploadLimits.wysiwygImageMaxBytes || 2 * 1024 * 1024); - var wysiwygImageUploadLimitLabel = formatUploadLimitLabel(wysiwygImageUploadMaxBytes); + var wysiwygImageUploadLimitLabel = window.PulseUpload.formatUploadLimit(wysiwygImageUploadMaxBytes); var uploadMimeTypes = Array.isArray(uploadLimits.allowedMimeTypes) ? uploadLimits.allowedMimeTypes : []; var videoDurationCache = Object.create(null); var previewRenderFrame = 0; @@ -690,6 +682,13 @@ import { createSlideFormPreviewHelpers } from '/assets/js/slides/slide-form-prev return '
    ' + content + '
    '; }).join(''); + regions.forEach(function (region) { + var typeModule = getRegionTypeModule(region.region_type); + if (typeModule && typeof typeModule.initPreview === 'function') { + typeModule.initPreview(slidePreviewOverlay); + } + }); + startPreviewVideoPlayback(slidePreviewOverlay); syncPopupPreview(); diff --git a/src/web/public/js/templates/template-designer.js b/src/web/public/js/templates/template-designer.js index 357b7fd..2c1fb8e 100644 --- a/src/web/public/js/templates/template-designer.js +++ b/src/web/public/js/templates/template-designer.js @@ -1778,6 +1778,9 @@ } if (backgroundInput) { backgroundInput.addEventListener('change', function () { + if (backgroundInput.dataset.uploadUrl) { + return; + } var file = backgroundInput.files && backgroundInput.files[0]; if (file) { updateBackgroundPreview(file); diff --git a/src/web/public/vendor/chart.js/chart.umd.js b/src/web/public/vendor/chart.js/chart.umd.js new file mode 100644 index 0000000..4cfce5c --- /dev/null +++ b/src/web/public/vendor/chart.js/chart.umd.js @@ -0,0 +1,14 @@ +/*! + * Chart.js v4.5.1 + * https://www.chartjs.org + * (c) 2025 Chart.js Contributors + * Released under the MIT License + */ +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).Chart=e()}(this,(function(){"use strict";var t=Object.freeze({__proto__:null,get Colors(){return Jo},get Decimation(){return ta},get Filler(){return ba},get Legend(){return Ma},get SubTitle(){return Pa},get Title(){return ka},get Tooltip(){return Na}});function e(){}const i=(()=>{let t=0;return()=>t++})();function s(t){return null==t}function n(t){if(Array.isArray&&Array.isArray(t))return!0;const e=Object.prototype.toString.call(t);return"[object"===e.slice(0,7)&&"Array]"===e.slice(-6)}function o(t){return null!==t&&"[object Object]"===Object.prototype.toString.call(t)}function a(t){return("number"==typeof t||t instanceof Number)&&isFinite(+t)}function r(t,e){return a(t)?t:e}function l(t,e){return void 0===t?e:t}const h=(t,e)=>"string"==typeof t&&t.endsWith("%")?parseFloat(t)/100:+t/e,c=(t,e)=>"string"==typeof t&&t.endsWith("%")?parseFloat(t)/100*e:+t;function d(t,e,i){if(t&&"function"==typeof t.call)return t.apply(i,e)}function u(t,e,i,s){let a,r,l;if(n(t))if(r=t.length,s)for(a=r-1;a>=0;a--)e.call(i,t[a],a);else for(a=0;at,x:t=>t.x,y:t=>t.y};function v(t){const e=t.split("."),i=[];let s="";for(const t of e)s+=t,s.endsWith("\\")?s=s.slice(0,-1)+".":(i.push(s),s="");return i}function M(t,e){const i=y[e]||(y[e]=function(t){const e=v(t);return t=>{for(const i of e){if(""===i)break;t=t&&t[i]}return t}}(e));return i(t)}function w(t){return t.charAt(0).toUpperCase()+t.slice(1)}const k=t=>void 0!==t,S=t=>"function"==typeof t,P=(t,e)=>{if(t.size!==e.size)return!1;for(const i of t)if(!e.has(i))return!1;return!0};function D(t){return"mouseup"===t.type||"click"===t.type||"contextmenu"===t.type}const C=Math.PI,O=2*C,A=O+C,T=Number.POSITIVE_INFINITY,L=C/180,E=C/2,R=C/4,I=2*C/3,z=Math.log10,F=Math.sign;function V(t,e,i){return Math.abs(t-e)t-e)).pop(),e}function N(t){return!function(t){return"symbol"==typeof t||"object"==typeof t&&null!==t&&!(Symbol.toPrimitive in t||"toString"in t||"valueOf"in t)}(t)&&!isNaN(parseFloat(t))&&isFinite(t)}function H(t,e){const i=Math.round(t);return i-e<=t&&i+e>=t}function j(t,e,i){let s,n,o;for(s=0,n=t.length;sl&&h=Math.min(e,i)-s&&t<=Math.max(e,i)+s}function et(t,e,i){i=i||(i=>t[i]1;)s=o+n>>1,i(s)?o=s:n=s;return{lo:o,hi:n}}const it=(t,e,i,s)=>et(t,i,s?s=>{const n=t[s][e];return nt[s][e]et(t,i,(s=>t[s][e]>=i));function nt(t,e,i){let s=0,n=t.length;for(;ss&&t[n-1]>i;)n--;return s>0||n{const i="_onData"+w(e),s=t[e];Object.defineProperty(t,e,{configurable:!0,enumerable:!1,value(...e){const n=s.apply(this,e);return t._chartjs.listeners.forEach((t=>{"function"==typeof t[i]&&t[i](...e)})),n}})})))}function rt(t,e){const i=t._chartjs;if(!i)return;const s=i.listeners,n=s.indexOf(e);-1!==n&&s.splice(n,1),s.length>0||(ot.forEach((e=>{delete t[e]})),delete t._chartjs)}function lt(t){const e=new Set(t);return e.size===t.length?t:Array.from(e)}const ht="undefined"==typeof window?function(t){return t()}:window.requestAnimationFrame;function ct(t,e){let i=[],s=!1;return function(...n){i=n,s||(s=!0,ht.call(window,(()=>{s=!1,t.apply(e,i)})))}}function dt(t,e){let i;return function(...s){return e?(clearTimeout(i),i=setTimeout(t,e,s)):t.apply(this,s),e}}const ut=t=>"start"===t?"left":"end"===t?"right":"center",ft=(t,e,i)=>"start"===t?e:"end"===t?i:(e+i)/2,gt=(t,e,i,s)=>t===(s?"left":"right")?i:"center"===t?(e+i)/2:e;function pt(t,e,i){const n=e.length;let o=0,a=n;if(t._sorted){const{iScale:r,vScale:l,_parsed:h}=t,c=t.dataset&&t.dataset.options?t.dataset.options.spanGaps:null,d=r.axis,{min:u,max:f,minDefined:g,maxDefined:p}=r.getUserBounds();if(g){if(o=Math.min(it(h,d,u).lo,i?n:it(e,d,r.getPixelForValue(u)).lo),c){const t=h.slice(0,o+1).reverse().findIndex((t=>!s(t[l.axis])));o-=Math.max(0,t)}o=Z(o,0,n-1)}if(p){let t=Math.max(it(h,r.axis,f,!0).hi+1,i?0:it(e,d,r.getPixelForValue(f),!0).hi+1);if(c){const e=h.slice(t-1).findIndex((t=>!s(t[l.axis])));t+=Math.max(0,e)}a=Z(t,o,n)-o}else a=n-o}return{start:o,count:a}}function mt(t){const{xScale:e,yScale:i,_scaleRanges:s}=t,n={xmin:e.min,xmax:e.max,ymin:i.min,ymax:i.max};if(!s)return t._scaleRanges=n,!0;const o=s.xmin!==e.min||s.xmax!==e.max||s.ymin!==i.min||s.ymax!==i.max;return Object.assign(s,n),o}class xt{constructor(){this._request=null,this._charts=new Map,this._running=!1,this._lastDate=void 0}_notify(t,e,i,s){const n=e.listeners[s],o=e.duration;n.forEach((s=>s({chart:t,initial:e.initial,numSteps:o,currentStep:Math.min(i-e.start,o)})))}_refresh(){this._request||(this._running=!0,this._request=ht.call(window,(()=>{this._update(),this._request=null,this._running&&this._refresh()})))}_update(t=Date.now()){let e=0;this._charts.forEach(((i,s)=>{if(!i.running||!i.items.length)return;const n=i.items;let o,a=n.length-1,r=!1;for(;a>=0;--a)o=n[a],o._active?(o._total>i.duration&&(i.duration=o._total),o.tick(t),r=!0):(n[a]=n[n.length-1],n.pop());r&&(s.draw(),this._notify(s,i,t,"progress")),n.length||(i.running=!1,this._notify(s,i,t,"complete"),i.initial=!1),e+=n.length})),this._lastDate=t,0===e&&(this._running=!1)}_getAnims(t){const e=this._charts;let i=e.get(t);return i||(i={running:!1,initial:!0,items:[],listeners:{complete:[],progress:[]}},e.set(t,i)),i}listen(t,e,i){this._getAnims(t).listeners[e].push(i)}add(t,e){e&&e.length&&this._getAnims(t).items.push(...e)}has(t){return this._getAnims(t).items.length>0}start(t){const e=this._charts.get(t);e&&(e.running=!0,e.start=Date.now(),e.duration=e.items.reduce(((t,e)=>Math.max(t,e._duration)),0),this._refresh())}running(t){if(!this._running)return!1;const e=this._charts.get(t);return!!(e&&e.running&&e.items.length)}stop(t){const e=this._charts.get(t);if(!e||!e.items.length)return;const i=e.items;let s=i.length-1;for(;s>=0;--s)i[s].cancel();e.items=[],this._notify(t,e,Date.now(),"complete")}remove(t){return this._charts.delete(t)}}var bt=new xt; +/*! + * @kurkle/color v0.3.2 + * https://github.com/kurkle/color#readme + * (c) 2023 Jukka Kurkela + * Released under the MIT License + */function _t(t){return t+.5|0}const yt=(t,e,i)=>Math.max(Math.min(t,i),e);function vt(t){return yt(_t(2.55*t),0,255)}function Mt(t){return yt(_t(255*t),0,255)}function wt(t){return yt(_t(t/2.55)/100,0,1)}function kt(t){return yt(_t(100*t),0,100)}const St={0:0,1:1,2:2,3:3,4:4,5:5,6:6,7:7,8:8,9:9,A:10,B:11,C:12,D:13,E:14,F:15,a:10,b:11,c:12,d:13,e:14,f:15},Pt=[..."0123456789ABCDEF"],Dt=t=>Pt[15&t],Ct=t=>Pt[(240&t)>>4]+Pt[15&t],Ot=t=>(240&t)>>4==(15&t);function At(t){var e=(t=>Ot(t.r)&&Ot(t.g)&&Ot(t.b)&&Ot(t.a))(t)?Dt:Ct;return t?"#"+e(t.r)+e(t.g)+e(t.b)+((t,e)=>t<255?e(t):"")(t.a,e):void 0}const Tt=/^(hsla?|hwb|hsv)\(\s*([-+.e\d]+)(?:deg)?[\s,]+([-+.e\d]+)%[\s,]+([-+.e\d]+)%(?:[\s,]+([-+.e\d]+)(%)?)?\s*\)$/;function Lt(t,e,i){const s=e*Math.min(i,1-i),n=(e,n=(e+t/30)%12)=>i-s*Math.max(Math.min(n-3,9-n,1),-1);return[n(0),n(8),n(4)]}function Et(t,e,i){const s=(s,n=(s+t/60)%6)=>i-i*e*Math.max(Math.min(n,4-n,1),0);return[s(5),s(3),s(1)]}function Rt(t,e,i){const s=Lt(t,1,.5);let n;for(e+i>1&&(n=1/(e+i),e*=n,i*=n),n=0;n<3;n++)s[n]*=1-e-i,s[n]+=e;return s}function It(t){const e=t.r/255,i=t.g/255,s=t.b/255,n=Math.max(e,i,s),o=Math.min(e,i,s),a=(n+o)/2;let r,l,h;return n!==o&&(h=n-o,l=a>.5?h/(2-n-o):h/(n+o),r=function(t,e,i,s,n){return t===n?(e-i)/s+(e>16&255,o>>8&255,255&o]}return t}(),Ht.transparent=[0,0,0,0]);const e=Ht[t.toLowerCase()];return e&&{r:e[0],g:e[1],b:e[2],a:4===e.length?e[3]:255}}const $t=/^rgba?\(\s*([-+.\d]+)(%)?[\s,]+([-+.e\d]+)(%)?[\s,]+([-+.e\d]+)(%)?(?:[\s,/]+([-+.e\d]+)(%)?)?\s*\)$/;const Yt=t=>t<=.0031308?12.92*t:1.055*Math.pow(t,1/2.4)-.055,Ut=t=>t<=.04045?t/12.92:Math.pow((t+.055)/1.055,2.4);function Xt(t,e,i){if(t){let s=It(t);s[e]=Math.max(0,Math.min(s[e]+s[e]*i,0===e?360:1)),s=Ft(s),t.r=s[0],t.g=s[1],t.b=s[2]}}function qt(t,e){return t?Object.assign(e||{},t):t}function Kt(t){var e={r:0,g:0,b:0,a:255};return Array.isArray(t)?t.length>=3&&(e={r:t[0],g:t[1],b:t[2],a:255},t.length>3&&(e.a=Mt(t[3]))):(e=qt(t,{r:0,g:0,b:0,a:1})).a=Mt(e.a),e}function Gt(t){return"r"===t.charAt(0)?function(t){const e=$t.exec(t);let i,s,n,o=255;if(e){if(e[7]!==i){const t=+e[7];o=e[8]?vt(t):yt(255*t,0,255)}return i=+e[1],s=+e[3],n=+e[5],i=255&(e[2]?vt(i):yt(i,0,255)),s=255&(e[4]?vt(s):yt(s,0,255)),n=255&(e[6]?vt(n):yt(n,0,255)),{r:i,g:s,b:n,a:o}}}(t):Bt(t)}class Jt{constructor(t){if(t instanceof Jt)return t;const e=typeof t;let i;var s,n,o;"object"===e?i=Kt(t):"string"===e&&(o=(s=t).length,"#"===s[0]&&(4===o||5===o?n={r:255&17*St[s[1]],g:255&17*St[s[2]],b:255&17*St[s[3]],a:5===o?17*St[s[4]]:255}:7!==o&&9!==o||(n={r:St[s[1]]<<4|St[s[2]],g:St[s[3]]<<4|St[s[4]],b:St[s[5]]<<4|St[s[6]],a:9===o?St[s[7]]<<4|St[s[8]]:255})),i=n||jt(t)||Gt(t)),this._rgb=i,this._valid=!!i}get valid(){return this._valid}get rgb(){var t=qt(this._rgb);return t&&(t.a=wt(t.a)),t}set rgb(t){this._rgb=Kt(t)}rgbString(){return this._valid?(t=this._rgb)&&(t.a<255?`rgba(${t.r}, ${t.g}, ${t.b}, ${wt(t.a)})`:`rgb(${t.r}, ${t.g}, ${t.b})`):void 0;var t}hexString(){return this._valid?At(this._rgb):void 0}hslString(){return this._valid?function(t){if(!t)return;const e=It(t),i=e[0],s=kt(e[1]),n=kt(e[2]);return t.a<255?`hsla(${i}, ${s}%, ${n}%, ${wt(t.a)})`:`hsl(${i}, ${s}%, ${n}%)`}(this._rgb):void 0}mix(t,e){if(t){const i=this.rgb,s=t.rgb;let n;const o=e===n?.5:e,a=2*o-1,r=i.a-s.a,l=((a*r==-1?a:(a+r)/(1+a*r))+1)/2;n=1-l,i.r=255&l*i.r+n*s.r+.5,i.g=255&l*i.g+n*s.g+.5,i.b=255&l*i.b+n*s.b+.5,i.a=o*i.a+(1-o)*s.a,this.rgb=i}return this}interpolate(t,e){return t&&(this._rgb=function(t,e,i){const s=Ut(wt(t.r)),n=Ut(wt(t.g)),o=Ut(wt(t.b));return{r:Mt(Yt(s+i*(Ut(wt(e.r))-s))),g:Mt(Yt(n+i*(Ut(wt(e.g))-n))),b:Mt(Yt(o+i*(Ut(wt(e.b))-o))),a:t.a+i*(e.a-t.a)}}(this._rgb,t._rgb,e)),this}clone(){return new Jt(this.rgb)}alpha(t){return this._rgb.a=Mt(t),this}clearer(t){return this._rgb.a*=1-t,this}greyscale(){const t=this._rgb,e=_t(.3*t.r+.59*t.g+.11*t.b);return t.r=t.g=t.b=e,this}opaquer(t){return this._rgb.a*=1+t,this}negate(){const t=this._rgb;return t.r=255-t.r,t.g=255-t.g,t.b=255-t.b,this}lighten(t){return Xt(this._rgb,2,t),this}darken(t){return Xt(this._rgb,2,-t),this}saturate(t){return Xt(this._rgb,1,t),this}desaturate(t){return Xt(this._rgb,1,-t),this}rotate(t){return function(t,e){var i=It(t);i[0]=Vt(i[0]+e),i=Ft(i),t.r=i[0],t.g=i[1],t.b=i[2]}(this._rgb,t),this}}function Zt(t){if(t&&"object"==typeof t){const e=t.toString();return"[object CanvasPattern]"===e||"[object CanvasGradient]"===e}return!1}function Qt(t){return Zt(t)?t:new Jt(t)}function te(t){return Zt(t)?t:new Jt(t).saturate(.5).darken(.1).hexString()}const ee=["x","y","borderWidth","radius","tension"],ie=["color","borderColor","backgroundColor"];const se=new Map;function ne(t,e,i){return function(t,e){e=e||{};const i=t+JSON.stringify(e);let s=se.get(i);return s||(s=new Intl.NumberFormat(t,e),se.set(i,s)),s}(e,i).format(t)}const oe={values:t=>n(t)?t:""+t,numeric(t,e,i){if(0===t)return"0";const s=this.chart.options.locale;let n,o=t;if(i.length>1){const e=Math.max(Math.abs(i[0].value),Math.abs(i[i.length-1].value));(e<1e-4||e>1e15)&&(n="scientific"),o=function(t,e){let i=e.length>3?e[2].value-e[1].value:e[1].value-e[0].value;Math.abs(i)>=1&&t!==Math.floor(t)&&(i=t-Math.floor(t));return i}(t,i)}const a=z(Math.abs(o)),r=isNaN(a)?1:Math.max(Math.min(-1*Math.floor(a),20),0),l={notation:n,minimumFractionDigits:r,maximumFractionDigits:r};return Object.assign(l,this.options.ticks.format),ne(t,s,l)},logarithmic(t,e,i){if(0===t)return"0";const s=i[e].significand||t/Math.pow(10,Math.floor(z(t)));return[1,2,3,5,10,15].includes(s)||e>.8*i.length?oe.numeric.call(this,t,e,i):""}};var ae={formatters:oe};const re=Object.create(null),le=Object.create(null);function he(t,e){if(!e)return t;const i=e.split(".");for(let e=0,s=i.length;et.chart.platform.getDevicePixelRatio(),this.elements={},this.events=["mousemove","mouseout","click","touchstart","touchmove"],this.font={family:"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",size:12,style:"normal",lineHeight:1.2,weight:null},this.hover={},this.hoverBackgroundColor=(t,e)=>te(e.backgroundColor),this.hoverBorderColor=(t,e)=>te(e.borderColor),this.hoverColor=(t,e)=>te(e.color),this.indexAxis="x",this.interaction={mode:"nearest",intersect:!0,includeInvisible:!1},this.maintainAspectRatio=!0,this.onHover=null,this.onClick=null,this.parsing=!0,this.plugins={},this.responsive=!0,this.scale=void 0,this.scales={},this.showLine=!0,this.drawActiveElementsOnTop=!0,this.describe(t),this.apply(e)}set(t,e){return ce(this,t,e)}get(t){return he(this,t)}describe(t,e){return ce(le,t,e)}override(t,e){return ce(re,t,e)}route(t,e,i,s){const n=he(this,t),a=he(this,i),r="_"+e;Object.defineProperties(n,{[r]:{value:n[e],writable:!0},[e]:{enumerable:!0,get(){const t=this[r],e=a[s];return o(t)?Object.assign({},e,t):l(t,e)},set(t){this[r]=t}}})}apply(t){t.forEach((t=>t(this)))}}var ue=new de({_scriptable:t=>!t.startsWith("on"),_indexable:t=>"events"!==t,hover:{_fallback:"interaction"},interaction:{_scriptable:!1,_indexable:!1}},[function(t){t.set("animation",{delay:void 0,duration:1e3,easing:"easeOutQuart",fn:void 0,from:void 0,loop:void 0,to:void 0,type:void 0}),t.describe("animation",{_fallback:!1,_indexable:!1,_scriptable:t=>"onProgress"!==t&&"onComplete"!==t&&"fn"!==t}),t.set("animations",{colors:{type:"color",properties:ie},numbers:{type:"number",properties:ee}}),t.describe("animations",{_fallback:"animation"}),t.set("transitions",{active:{animation:{duration:400}},resize:{animation:{duration:0}},show:{animations:{colors:{from:"transparent"},visible:{type:"boolean",duration:0}}},hide:{animations:{colors:{to:"transparent"},visible:{type:"boolean",easing:"linear",fn:t=>0|t}}}})},function(t){t.set("layout",{autoPadding:!0,padding:{top:0,right:0,bottom:0,left:0}})},function(t){t.set("scale",{display:!0,offset:!1,reverse:!1,beginAtZero:!1,bounds:"ticks",clip:!0,grace:0,grid:{display:!0,lineWidth:1,drawOnChartArea:!0,drawTicks:!0,tickLength:8,tickWidth:(t,e)=>e.lineWidth,tickColor:(t,e)=>e.color,offset:!1},border:{display:!0,dash:[],dashOffset:0,width:1},title:{display:!1,text:"",padding:{top:4,bottom:4}},ticks:{minRotation:0,maxRotation:50,mirror:!1,textStrokeWidth:0,textStrokeColor:"",padding:3,display:!0,autoSkip:!0,autoSkipPadding:3,labelOffset:0,callback:ae.formatters.values,minor:{},major:{},align:"center",crossAlign:"near",showLabelBackdrop:!1,backdropColor:"rgba(255, 255, 255, 0.75)",backdropPadding:2}}),t.route("scale.ticks","color","","color"),t.route("scale.grid","color","","borderColor"),t.route("scale.border","color","","borderColor"),t.route("scale.title","color","","color"),t.describe("scale",{_fallback:!1,_scriptable:t=>!t.startsWith("before")&&!t.startsWith("after")&&"callback"!==t&&"parser"!==t,_indexable:t=>"borderDash"!==t&&"tickBorderDash"!==t&&"dash"!==t}),t.describe("scales",{_fallback:"scale"}),t.describe("scale.ticks",{_scriptable:t=>"backdropPadding"!==t&&"callback"!==t,_indexable:t=>"backdropPadding"!==t})}]);function fe(){return"undefined"!=typeof window&&"undefined"!=typeof document}function ge(t){let e=t.parentNode;return e&&"[object ShadowRoot]"===e.toString()&&(e=e.host),e}function pe(t,e,i){let s;return"string"==typeof t?(s=parseInt(t,10),-1!==t.indexOf("%")&&(s=s/100*e.parentNode[i])):s=t,s}const me=t=>t.ownerDocument.defaultView.getComputedStyle(t,null);function xe(t,e){return me(t).getPropertyValue(e)}const be=["top","right","bottom","left"];function _e(t,e,i){const s={};i=i?"-"+i:"";for(let n=0;n<4;n++){const o=be[n];s[o]=parseFloat(t[e+"-"+o+i])||0}return s.width=s.left+s.right,s.height=s.top+s.bottom,s}const ye=(t,e,i)=>(t>0||e>0)&&(!i||!i.shadowRoot);function ve(t,e){if("native"in t)return t;const{canvas:i,currentDevicePixelRatio:s}=e,n=me(i),o="border-box"===n.boxSizing,a=_e(n,"padding"),r=_e(n,"border","width"),{x:l,y:h,box:c}=function(t,e){const i=t.touches,s=i&&i.length?i[0]:t,{offsetX:n,offsetY:o}=s;let a,r,l=!1;if(ye(n,o,t.target))a=n,r=o;else{const t=e.getBoundingClientRect();a=s.clientX-t.left,r=s.clientY-t.top,l=!0}return{x:a,y:r,box:l}}(t,i),d=a.left+(c&&r.left),u=a.top+(c&&r.top);let{width:f,height:g}=e;return o&&(f-=a.width+r.width,g-=a.height+r.height),{x:Math.round((l-d)/f*i.width/s),y:Math.round((h-u)/g*i.height/s)}}const Me=t=>Math.round(10*t)/10;function we(t,e,i,s){const n=me(t),o=_e(n,"margin"),a=pe(n.maxWidth,t,"clientWidth")||T,r=pe(n.maxHeight,t,"clientHeight")||T,l=function(t,e,i){let s,n;if(void 0===e||void 0===i){const o=t&&ge(t);if(o){const t=o.getBoundingClientRect(),a=me(o),r=_e(a,"border","width"),l=_e(a,"padding");e=t.width-l.width-r.width,i=t.height-l.height-r.height,s=pe(a.maxWidth,o,"clientWidth"),n=pe(a.maxHeight,o,"clientHeight")}else e=t.clientWidth,i=t.clientHeight}return{width:e,height:i,maxWidth:s||T,maxHeight:n||T}}(t,e,i);let{width:h,height:c}=l;if("content-box"===n.boxSizing){const t=_e(n,"border","width"),e=_e(n,"padding");h-=e.width+t.width,c-=e.height+t.height}h=Math.max(0,h-o.width),c=Math.max(0,s?h/s:c-o.height),h=Me(Math.min(h,a,l.maxWidth)),c=Me(Math.min(c,r,l.maxHeight)),h&&!c&&(c=Me(h/2));return(void 0!==e||void 0!==i)&&s&&l.height&&c>l.height&&(c=l.height,h=Me(Math.floor(c*s))),{width:h,height:c}}function ke(t,e,i){const s=e||1,n=Me(t.height*s),o=Me(t.width*s);t.height=Me(t.height),t.width=Me(t.width);const a=t.canvas;return a.style&&(i||!a.style.height&&!a.style.width)&&(a.style.height=`${t.height}px`,a.style.width=`${t.width}px`),(t.currentDevicePixelRatio!==s||a.height!==n||a.width!==o)&&(t.currentDevicePixelRatio=s,a.height=n,a.width=o,t.ctx.setTransform(s,0,0,s,0,0),!0)}const Se=function(){let t=!1;try{const e={get passive(){return t=!0,!1}};fe()&&(window.addEventListener("test",null,e),window.removeEventListener("test",null,e))}catch(t){}return t}();function Pe(t,e){const i=xe(t,e),s=i&&i.match(/^(\d+)(\.\d+)?px$/);return s?+s[1]:void 0}function De(t){return!t||s(t.size)||s(t.family)?null:(t.style?t.style+" ":"")+(t.weight?t.weight+" ":"")+t.size+"px "+t.family}function Ce(t,e,i,s,n){let o=e[n];return o||(o=e[n]=t.measureText(n).width,i.push(n)),o>s&&(s=o),s}function Oe(t,e,i,s){let o=(s=s||{}).data=s.data||{},a=s.garbageCollect=s.garbageCollect||[];s.font!==e&&(o=s.data={},a=s.garbageCollect=[],s.font=e),t.save(),t.font=e;let r=0;const l=i.length;let h,c,d,u,f;for(h=0;hi.length){for(h=0;h0&&t.stroke()}}function Re(t,e,i){return i=i||.5,!e||t&&t.x>e.left-i&&t.xe.top-i&&t.y0&&""!==r.strokeColor;let c,d;for(t.save(),t.font=a.string,function(t,e){e.translation&&t.translate(e.translation[0],e.translation[1]),s(e.rotation)||t.rotate(e.rotation),e.color&&(t.fillStyle=e.color),e.textAlign&&(t.textAlign=e.textAlign),e.textBaseline&&(t.textBaseline=e.textBaseline)}(t,r),c=0;ct[0])){const o=i||t;void 0===s&&(s=ti("_fallback",t));const a={[Symbol.toStringTag]:"Object",_cacheable:!0,_scopes:t,_rootScopes:o,_fallback:s,_getTarget:n,override:i=>je([i,...t],e,o,s)};return new Proxy(a,{deleteProperty:(e,i)=>(delete e[i],delete e._keys,delete t[0][i],!0),get:(i,s)=>qe(i,s,(()=>function(t,e,i,s){let n;for(const o of e)if(n=ti(Ue(o,t),i),void 0!==n)return Xe(t,n)?Ze(i,s,t,n):n}(s,e,t,i))),getOwnPropertyDescriptor:(t,e)=>Reflect.getOwnPropertyDescriptor(t._scopes[0],e),getPrototypeOf:()=>Reflect.getPrototypeOf(t[0]),has:(t,e)=>ei(t).includes(e),ownKeys:t=>ei(t),set(t,e,i){const s=t._storage||(t._storage=n());return t[e]=s[e]=i,delete t._keys,!0}})}function $e(t,e,i,s){const a={_cacheable:!1,_proxy:t,_context:e,_subProxy:i,_stack:new Set,_descriptors:Ye(t,s),setContext:e=>$e(t,e,i,s),override:n=>$e(t.override(n),e,i,s)};return new Proxy(a,{deleteProperty:(e,i)=>(delete e[i],delete t[i],!0),get:(t,e,i)=>qe(t,e,(()=>function(t,e,i){const{_proxy:s,_context:a,_subProxy:r,_descriptors:l}=t;let h=s[e];S(h)&&l.isScriptable(e)&&(h=function(t,e,i,s){const{_proxy:n,_context:o,_subProxy:a,_stack:r}=i;if(r.has(t))throw new Error("Recursion detected: "+Array.from(r).join("->")+"->"+t);r.add(t);let l=e(o,a||s);r.delete(t),Xe(t,l)&&(l=Ze(n._scopes,n,t,l));return l}(e,h,t,i));n(h)&&h.length&&(h=function(t,e,i,s){const{_proxy:n,_context:a,_subProxy:r,_descriptors:l}=i;if(void 0!==a.index&&s(t))return e[a.index%e.length];if(o(e[0])){const i=e,s=n._scopes.filter((t=>t!==i));e=[];for(const o of i){const i=Ze(s,n,t,o);e.push($e(i,a,r&&r[t],l))}}return e}(e,h,t,l.isIndexable));Xe(e,h)&&(h=$e(h,a,r&&r[e],l));return h}(t,e,i))),getOwnPropertyDescriptor:(e,i)=>e._descriptors.allKeys?Reflect.has(t,i)?{enumerable:!0,configurable:!0}:void 0:Reflect.getOwnPropertyDescriptor(t,i),getPrototypeOf:()=>Reflect.getPrototypeOf(t),has:(e,i)=>Reflect.has(t,i),ownKeys:()=>Reflect.ownKeys(t),set:(e,i,s)=>(t[i]=s,delete e[i],!0)})}function Ye(t,e={scriptable:!0,indexable:!0}){const{_scriptable:i=e.scriptable,_indexable:s=e.indexable,_allKeys:n=e.allKeys}=t;return{allKeys:n,scriptable:i,indexable:s,isScriptable:S(i)?i:()=>i,isIndexable:S(s)?s:()=>s}}const Ue=(t,e)=>t?t+w(e):e,Xe=(t,e)=>o(e)&&"adapters"!==t&&(null===Object.getPrototypeOf(e)||e.constructor===Object);function qe(t,e,i){if(Object.prototype.hasOwnProperty.call(t,e)||"constructor"===e)return t[e];const s=i();return t[e]=s,s}function Ke(t,e,i){return S(t)?t(e,i):t}const Ge=(t,e)=>!0===t?e:"string"==typeof t?M(e,t):void 0;function Je(t,e,i,s,n){for(const o of e){const e=Ge(i,o);if(e){t.add(e);const o=Ke(e._fallback,i,n);if(void 0!==o&&o!==i&&o!==s)return o}else if(!1===e&&void 0!==s&&i!==s)return null}return!1}function Ze(t,e,i,s){const a=e._rootScopes,r=Ke(e._fallback,i,s),l=[...t,...a],h=new Set;h.add(s);let c=Qe(h,l,i,r||i,s);return null!==c&&((void 0===r||r===i||(c=Qe(h,l,r,c,s),null!==c))&&je(Array.from(h),[""],a,r,(()=>function(t,e,i){const s=t._getTarget();e in s||(s[e]={});const a=s[e];if(n(a)&&o(i))return i;return a||{}}(e,i,s))))}function Qe(t,e,i,s,n){for(;i;)i=Je(t,e,i,s,n);return i}function ti(t,e){for(const i of e){if(!i)continue;const e=i[t];if(void 0!==e)return e}}function ei(t){let e=t._keys;return e||(e=t._keys=function(t){const e=new Set;for(const i of t)for(const t of Object.keys(i).filter((t=>!t.startsWith("_"))))e.add(t);return Array.from(e)}(t._scopes)),e}function ii(t,e,i,s){const{iScale:n}=t,{key:o="r"}=this._parsing,a=new Array(s);let r,l,h,c;for(r=0,l=s;re"x"===t?"y":"x";function ai(t,e,i,s){const n=t.skip?e:t,o=e,a=i.skip?e:i,r=q(o,n),l=q(a,o);let h=r/(r+l),c=l/(r+l);h=isNaN(h)?0:h,c=isNaN(c)?0:c;const d=s*h,u=s*c;return{previous:{x:o.x-d*(a.x-n.x),y:o.y-d*(a.y-n.y)},next:{x:o.x+u*(a.x-n.x),y:o.y+u*(a.y-n.y)}}}function ri(t,e="x"){const i=oi(e),s=t.length,n=Array(s).fill(0),o=Array(s);let a,r,l,h=ni(t,0);for(a=0;a!t.skip))),"monotone"===e.cubicInterpolationMode)ri(t,n);else{let i=s?t[t.length-1]:t[0];for(o=0,a=t.length;o0===t||1===t,di=(t,e,i)=>-Math.pow(2,10*(t-=1))*Math.sin((t-e)*O/i),ui=(t,e,i)=>Math.pow(2,-10*t)*Math.sin((t-e)*O/i)+1,fi={linear:t=>t,easeInQuad:t=>t*t,easeOutQuad:t=>-t*(t-2),easeInOutQuad:t=>(t/=.5)<1?.5*t*t:-.5*(--t*(t-2)-1),easeInCubic:t=>t*t*t,easeOutCubic:t=>(t-=1)*t*t+1,easeInOutCubic:t=>(t/=.5)<1?.5*t*t*t:.5*((t-=2)*t*t+2),easeInQuart:t=>t*t*t*t,easeOutQuart:t=>-((t-=1)*t*t*t-1),easeInOutQuart:t=>(t/=.5)<1?.5*t*t*t*t:-.5*((t-=2)*t*t*t-2),easeInQuint:t=>t*t*t*t*t,easeOutQuint:t=>(t-=1)*t*t*t*t+1,easeInOutQuint:t=>(t/=.5)<1?.5*t*t*t*t*t:.5*((t-=2)*t*t*t*t+2),easeInSine:t=>1-Math.cos(t*E),easeOutSine:t=>Math.sin(t*E),easeInOutSine:t=>-.5*(Math.cos(C*t)-1),easeInExpo:t=>0===t?0:Math.pow(2,10*(t-1)),easeOutExpo:t=>1===t?1:1-Math.pow(2,-10*t),easeInOutExpo:t=>ci(t)?t:t<.5?.5*Math.pow(2,10*(2*t-1)):.5*(2-Math.pow(2,-10*(2*t-1))),easeInCirc:t=>t>=1?t:-(Math.sqrt(1-t*t)-1),easeOutCirc:t=>Math.sqrt(1-(t-=1)*t),easeInOutCirc:t=>(t/=.5)<1?-.5*(Math.sqrt(1-t*t)-1):.5*(Math.sqrt(1-(t-=2)*t)+1),easeInElastic:t=>ci(t)?t:di(t,.075,.3),easeOutElastic:t=>ci(t)?t:ui(t,.075,.3),easeInOutElastic(t){const e=.1125;return ci(t)?t:t<.5?.5*di(2*t,e,.45):.5+.5*ui(2*t-1,e,.45)},easeInBack(t){const e=1.70158;return t*t*((e+1)*t-e)},easeOutBack(t){const e=1.70158;return(t-=1)*t*((e+1)*t+e)+1},easeInOutBack(t){let e=1.70158;return(t/=.5)<1?t*t*((1+(e*=1.525))*t-e)*.5:.5*((t-=2)*t*((1+(e*=1.525))*t+e)+2)},easeInBounce:t=>1-fi.easeOutBounce(1-t),easeOutBounce(t){const e=7.5625,i=2.75;return t<1/i?e*t*t:t<2/i?e*(t-=1.5/i)*t+.75:t<2.5/i?e*(t-=2.25/i)*t+.9375:e*(t-=2.625/i)*t+.984375},easeInOutBounce:t=>t<.5?.5*fi.easeInBounce(2*t):.5*fi.easeOutBounce(2*t-1)+.5};function gi(t,e,i,s){return{x:t.x+i*(e.x-t.x),y:t.y+i*(e.y-t.y)}}function pi(t,e,i,s){return{x:t.x+i*(e.x-t.x),y:"middle"===s?i<.5?t.y:e.y:"after"===s?i<1?t.y:e.y:i>0?e.y:t.y}}function mi(t,e,i,s){const n={x:t.cp2x,y:t.cp2y},o={x:e.cp1x,y:e.cp1y},a=gi(t,n,i),r=gi(n,o,i),l=gi(o,e,i),h=gi(a,r,i),c=gi(r,l,i);return gi(h,c,i)}const xi=/^(normal|(\d+(?:\.\d+)?)(px|em|%)?)$/,bi=/^(normal|italic|initial|inherit|unset|(oblique( -?[0-9]?[0-9]deg)?))$/;function _i(t,e){const i=(""+t).match(xi);if(!i||"normal"===i[1])return 1.2*e;switch(t=+i[2],i[3]){case"px":return t;case"%":t/=100}return e*t}const yi=t=>+t||0;function vi(t,e){const i={},s=o(e),n=s?Object.keys(e):e,a=o(t)?s?i=>l(t[i],t[e[i]]):e=>t[e]:()=>t;for(const t of n)i[t]=yi(a(t));return i}function Mi(t){return vi(t,{top:"y",right:"x",bottom:"y",left:"x"})}function wi(t){return vi(t,["topLeft","topRight","bottomLeft","bottomRight"])}function ki(t){const e=Mi(t);return e.width=e.left+e.right,e.height=e.top+e.bottom,e}function Si(t,e){t=t||{},e=e||ue.font;let i=l(t.size,e.size);"string"==typeof i&&(i=parseInt(i,10));let s=l(t.style,e.style);s&&!(""+s).match(bi)&&(console.warn('Invalid font style specified: "'+s+'"'),s=void 0);const n={family:l(t.family,e.family),lineHeight:_i(l(t.lineHeight,e.lineHeight),i),size:i,style:s,weight:l(t.weight,e.weight),string:""};return n.string=De(n),n}function Pi(t,e,i,s){let o,a,r,l=!0;for(o=0,a=t.length;oi&&0===t?0:t+e;return{min:a(s,-Math.abs(o)),max:a(n,o)}}function Ci(t,e){return Object.assign(Object.create(t),e)}function Oi(t,e,i){return t?function(t,e){return{x:i=>t+t+e-i,setWidth(t){e=t},textAlign:t=>"center"===t?t:"right"===t?"left":"right",xPlus:(t,e)=>t-e,leftForLtr:(t,e)=>t-e}}(e,i):{x:t=>t,setWidth(t){},textAlign:t=>t,xPlus:(t,e)=>t+e,leftForLtr:(t,e)=>t}}function Ai(t,e){let i,s;"ltr"!==e&&"rtl"!==e||(i=t.canvas.style,s=[i.getPropertyValue("direction"),i.getPropertyPriority("direction")],i.setProperty("direction",e,"important"),t.prevTextDirection=s)}function Ti(t,e){void 0!==e&&(delete t.prevTextDirection,t.canvas.style.setProperty("direction",e[0],e[1]))}function Li(t){return"angle"===t?{between:J,compare:K,normalize:G}:{between:tt,compare:(t,e)=>t-e,normalize:t=>t}}function Ei({start:t,end:e,count:i,loop:s,style:n}){return{start:t%i,end:e%i,loop:s&&(e-t+1)%i==0,style:n}}function Ri(t,e,i){if(!i)return[t];const{property:s,start:n,end:o}=i,a=e.length,{compare:r,between:l,normalize:h}=Li(s),{start:c,end:d,loop:u,style:f}=function(t,e,i){const{property:s,start:n,end:o}=i,{between:a,normalize:r}=Li(s),l=e.length;let h,c,{start:d,end:u,loop:f}=t;if(f){for(d+=l,u+=l,h=0,c=l;hb||l(n,x,p)&&0!==r(n,x),v=()=>!b||0===r(o,p)||l(o,x,p);for(let t=c,i=c;t<=d;++t)m=e[t%a],m.skip||(p=h(m[s]),p!==x&&(b=l(p,n,o),null===_&&y()&&(_=0===r(p,n)?t:i),null!==_&&v()&&(g.push(Ei({start:_,end:t,loop:u,count:a,style:f})),_=null),i=t,x=p));return null!==_&&g.push(Ei({start:_,end:d,loop:u,count:a,style:f})),g}function Ii(t,e){const i=[],s=t.segments;for(let n=0;nn&&t[o%e].skip;)o--;return o%=e,{start:n,end:o}}(i,n,o,s);if(!0===s)return Fi(t,[{start:a,end:r,loop:o}],i,e);return Fi(t,function(t,e,i,s){const n=t.length,o=[];let a,r=e,l=t[e];for(a=e+1;a<=i;++a){const i=t[a%n];i.skip||i.stop?l.skip||(s=!1,o.push({start:e%n,end:(a-1)%n,loop:s}),e=r=i.stop?a:null):(r=a,l.skip&&(e=a)),l=i}return null!==r&&o.push({start:e%n,end:r%n,loop:s}),o}(i,a,r!s(t[e.axis])));n.lo-=Math.max(0,a);const r=i.slice(n.hi).findIndex((t=>!s(t[e.axis])));n.hi+=Math.max(0,r)}return n}if(o._sharedOptions){const t=a[0],s="function"==typeof t.getRange&&t.getRange(e);if(s){const t=r(a,e,i-s),n=r(a,e,i+s);return{lo:t.lo,hi:n.hi}}}}return{lo:0,hi:a.length-1}}function $i(t,e,i,s,n){const o=t.getSortedVisibleDatasetMetas(),a=i[e];for(let t=0,i=o.length;t{t[a]&&t[a](e[i],n)&&(o.push({element:t,datasetIndex:s,index:l}),r=r||t.inRange(e.x,e.y,n))})),s&&!r?[]:o}var Ki={evaluateInteractionItems:$i,modes:{index(t,e,i,s){const n=ve(e,t),o=i.axis||"x",a=i.includeInvisible||!1,r=i.intersect?Yi(t,n,o,s,a):Xi(t,n,o,!1,s,a),l=[];return r.length?(t.getSortedVisibleDatasetMetas().forEach((t=>{const e=r[0].index,i=t.data[e];i&&!i.skip&&l.push({element:i,datasetIndex:t.index,index:e})})),l):[]},dataset(t,e,i,s){const n=ve(e,t),o=i.axis||"xy",a=i.includeInvisible||!1;let r=i.intersect?Yi(t,n,o,s,a):Xi(t,n,o,!1,s,a);if(r.length>0){const e=r[0].datasetIndex,i=t.getDatasetMeta(e).data;r=[];for(let t=0;tYi(t,ve(e,t),i.axis||"xy",s,i.includeInvisible||!1),nearest(t,e,i,s){const n=ve(e,t),o=i.axis||"xy",a=i.includeInvisible||!1;return Xi(t,n,o,i.intersect,s,a)},x:(t,e,i,s)=>qi(t,ve(e,t),"x",i.intersect,s),y:(t,e,i,s)=>qi(t,ve(e,t),"y",i.intersect,s)}};const Gi=["left","top","right","bottom"];function Ji(t,e){return t.filter((t=>t.pos===e))}function Zi(t,e){return t.filter((t=>-1===Gi.indexOf(t.pos)&&t.box.axis===e))}function Qi(t,e){return t.sort(((t,i)=>{const s=e?i:t,n=e?t:i;return s.weight===n.weight?s.index-n.index:s.weight-n.weight}))}function ts(t,e){const i=function(t){const e={};for(const i of t){const{stack:t,pos:s,stackWeight:n}=i;if(!t||!Gi.includes(s))continue;const o=e[t]||(e[t]={count:0,placed:0,weight:0,size:0});o.count++,o.weight+=n}return e}(t),{vBoxMaxWidth:s,hBoxMaxHeight:n}=e;let o,a,r;for(o=0,a=t.length;o{s[t]=Math.max(e[t],i[t])})),s}return s(t?["left","right"]:["top","bottom"])}function os(t,e,i,s){const n=[];let o,a,r,l,h,c;for(o=0,a=t.length,h=0;ot.box.fullSize)),!0),s=Qi(Ji(e,"left"),!0),n=Qi(Ji(e,"right")),o=Qi(Ji(e,"top"),!0),a=Qi(Ji(e,"bottom")),r=Zi(e,"x"),l=Zi(e,"y");return{fullSize:i,leftAndTop:s.concat(o),rightAndBottom:n.concat(l).concat(a).concat(r),chartArea:Ji(e,"chartArea"),vertical:s.concat(n).concat(l),horizontal:o.concat(a).concat(r)}}(t.boxes),l=r.vertical,h=r.horizontal;u(t.boxes,(t=>{"function"==typeof t.beforeLayout&&t.beforeLayout()}));const c=l.reduce(((t,e)=>e.box.options&&!1===e.box.options.display?t:t+1),0)||1,d=Object.freeze({outerWidth:e,outerHeight:i,padding:n,availableWidth:o,availableHeight:a,vBoxMaxWidth:o/2/c,hBoxMaxHeight:a/2}),f=Object.assign({},n);is(f,ki(s));const g=Object.assign({maxPadding:f,w:o,h:a,x:n.left,y:n.top},n),p=ts(l.concat(h),d);os(r.fullSize,g,d,p),os(l,g,d,p),os(h,g,d,p)&&os(l,g,d,p),function(t){const e=t.maxPadding;function i(i){const s=Math.max(e[i]-t[i],0);return t[i]+=s,s}t.y+=i("top"),t.x+=i("left"),i("right"),i("bottom")}(g),rs(r.leftAndTop,g,d,p),g.x+=g.w,g.y+=g.h,rs(r.rightAndBottom,g,d,p),t.chartArea={left:g.left,top:g.top,right:g.left+g.w,bottom:g.top+g.h,height:g.h,width:g.w},u(r.chartArea,(e=>{const i=e.box;Object.assign(i,t.chartArea),i.update(g.w,g.h,{left:0,top:0,right:0,bottom:0})}))}};class hs{acquireContext(t,e){}releaseContext(t){return!1}addEventListener(t,e,i){}removeEventListener(t,e,i){}getDevicePixelRatio(){return 1}getMaximumSize(t,e,i,s){return e=Math.max(0,e||t.width),i=i||t.height,{width:e,height:Math.max(0,s?Math.floor(e/s):i)}}isAttached(t){return!0}updateConfig(t){}}class cs extends hs{acquireContext(t){return t&&t.getContext&&t.getContext("2d")||null}updateConfig(t){t.options.animation=!1}}const ds="$chartjs",us={touchstart:"mousedown",touchmove:"mousemove",touchend:"mouseup",pointerenter:"mouseenter",pointerdown:"mousedown",pointermove:"mousemove",pointerup:"mouseup",pointerleave:"mouseout",pointerout:"mouseout"},fs=t=>null===t||""===t;const gs=!!Se&&{passive:!0};function ps(t,e,i){t&&t.canvas&&t.canvas.removeEventListener(e,i,gs)}function ms(t,e){for(const i of t)if(i===e||i.contains(e))return!0}function xs(t,e,i){const s=t.canvas,n=new MutationObserver((t=>{let e=!1;for(const i of t)e=e||ms(i.addedNodes,s),e=e&&!ms(i.removedNodes,s);e&&i()}));return n.observe(document,{childList:!0,subtree:!0}),n}function bs(t,e,i){const s=t.canvas,n=new MutationObserver((t=>{let e=!1;for(const i of t)e=e||ms(i.removedNodes,s),e=e&&!ms(i.addedNodes,s);e&&i()}));return n.observe(document,{childList:!0,subtree:!0}),n}const _s=new Map;let ys=0;function vs(){const t=window.devicePixelRatio;t!==ys&&(ys=t,_s.forEach(((e,i)=>{i.currentDevicePixelRatio!==t&&e()})))}function Ms(t,e,i){const s=t.canvas,n=s&&ge(s);if(!n)return;const o=ct(((t,e)=>{const s=n.clientWidth;i(t,e),s{const e=t[0],i=e.contentRect.width,s=e.contentRect.height;0===i&&0===s||o(i,s)}));return a.observe(n),function(t,e){_s.size||window.addEventListener("resize",vs),_s.set(t,e)}(t,o),a}function ws(t,e,i){i&&i.disconnect(),"resize"===e&&function(t){_s.delete(t),_s.size||window.removeEventListener("resize",vs)}(t)}function ks(t,e,i){const s=t.canvas,n=ct((e=>{null!==t.ctx&&i(function(t,e){const i=us[t.type]||t.type,{x:s,y:n}=ve(t,e);return{type:i,chart:e,native:t,x:void 0!==s?s:null,y:void 0!==n?n:null}}(e,t))}),t);return function(t,e,i){t&&t.addEventListener(e,i,gs)}(s,e,n),n}class Ss extends hs{acquireContext(t,e){const i=t&&t.getContext&&t.getContext("2d");return i&&i.canvas===t?(function(t,e){const i=t.style,s=t.getAttribute("height"),n=t.getAttribute("width");if(t[ds]={initial:{height:s,width:n,style:{display:i.display,height:i.height,width:i.width}}},i.display=i.display||"block",i.boxSizing=i.boxSizing||"border-box",fs(n)){const e=Pe(t,"width");void 0!==e&&(t.width=e)}if(fs(s))if(""===t.style.height)t.height=t.width/(e||2);else{const e=Pe(t,"height");void 0!==e&&(t.height=e)}}(t,e),i):null}releaseContext(t){const e=t.canvas;if(!e[ds])return!1;const i=e[ds].initial;["height","width"].forEach((t=>{const n=i[t];s(n)?e.removeAttribute(t):e.setAttribute(t,n)}));const n=i.style||{};return Object.keys(n).forEach((t=>{e.style[t]=n[t]})),e.width=e.width,delete e[ds],!0}addEventListener(t,e,i){this.removeEventListener(t,e);const s=t.$proxies||(t.$proxies={}),n={attach:xs,detach:bs,resize:Ms}[e]||ks;s[e]=n(t,e,i)}removeEventListener(t,e){const i=t.$proxies||(t.$proxies={}),s=i[e];if(!s)return;({attach:ws,detach:ws,resize:ws}[e]||ps)(t,e,s),i[e]=void 0}getDevicePixelRatio(){return window.devicePixelRatio}getMaximumSize(t,e,i,s){return we(t,e,i,s)}isAttached(t){const e=t&&ge(t);return!(!e||!e.isConnected)}}function Ps(t){return!fe()||"undefined"!=typeof OffscreenCanvas&&t instanceof OffscreenCanvas?cs:Ss}var Ds=Object.freeze({__proto__:null,BasePlatform:hs,BasicPlatform:cs,DomPlatform:Ss,_detectPlatform:Ps});const Cs="transparent",Os={boolean:(t,e,i)=>i>.5?e:t,color(t,e,i){const s=Qt(t||Cs),n=s.valid&&Qt(e||Cs);return n&&n.valid?n.mix(s,i).hexString():e},number:(t,e,i)=>t+(e-t)*i};class As{constructor(t,e,i,s){const n=e[i];s=Pi([t.to,s,n,t.from]);const o=Pi([t.from,n,s]);this._active=!0,this._fn=t.fn||Os[t.type||typeof o],this._easing=fi[t.easing]||fi.linear,this._start=Math.floor(Date.now()+(t.delay||0)),this._duration=this._total=Math.floor(t.duration),this._loop=!!t.loop,this._target=e,this._prop=i,this._from=o,this._to=s,this._promises=void 0}active(){return this._active}update(t,e,i){if(this._active){this._notify(!1);const s=this._target[this._prop],n=i-this._start,o=this._duration-n;this._start=i,this._duration=Math.floor(Math.max(o,t.duration)),this._total+=n,this._loop=!!t.loop,this._to=Pi([t.to,e,s,t.from]),this._from=Pi([t.from,s,e])}}cancel(){this._active&&(this.tick(Date.now()),this._active=!1,this._notify(!1))}tick(t){const e=t-this._start,i=this._duration,s=this._prop,n=this._from,o=this._loop,a=this._to;let r;if(this._active=n!==a&&(o||e1?2-r:r,r=this._easing(Math.min(1,Math.max(0,r))),this._target[s]=this._fn(n,a,r))}wait(){const t=this._promises||(this._promises=[]);return new Promise(((e,i)=>{t.push({res:e,rej:i})}))}_notify(t){const e=t?"res":"rej",i=this._promises||[];for(let t=0;t{const a=t[s];if(!o(a))return;const r={};for(const t of e)r[t]=a[t];(n(a.properties)&&a.properties||[s]).forEach((t=>{t!==s&&i.has(t)||i.set(t,r)}))}))}_animateOptions(t,e){const i=e.options,s=function(t,e){if(!e)return;let i=t.options;if(!i)return void(t.options=e);i.$shared&&(t.options=i=Object.assign({},i,{$shared:!1,$animations:{}}));return i}(t,i);if(!s)return[];const n=this._createAnimations(s,i);return i.$shared&&function(t,e){const i=[],s=Object.keys(e);for(let e=0;e{t.options=i}),(()=>{})),n}_createAnimations(t,e){const i=this._properties,s=[],n=t.$animations||(t.$animations={}),o=Object.keys(e),a=Date.now();let r;for(r=o.length-1;r>=0;--r){const l=o[r];if("$"===l.charAt(0))continue;if("options"===l){s.push(...this._animateOptions(t,e));continue}const h=e[l];let c=n[l];const d=i.get(l);if(c){if(d&&c.active()){c.update(d,h,a);continue}c.cancel()}d&&d.duration?(n[l]=c=new As(d,t,l,h),s.push(c)):t[l]=h}return s}update(t,e){if(0===this._properties.size)return void Object.assign(t,e);const i=this._createAnimations(t,e);return i.length?(bt.add(this._chart,i),!0):void 0}}function Ls(t,e){const i=t&&t.options||{},s=i.reverse,n=void 0===i.min?e:0,o=void 0===i.max?e:0;return{start:s?o:n,end:s?n:o}}function Es(t,e){const i=[],s=t._getSortedDatasetMetas(e);let n,o;for(n=0,o=s.length;n0||!i&&e<0)return n.index}return null}function Vs(t,e){const{chart:i,_cachedMeta:s}=t,n=i._stacks||(i._stacks={}),{iScale:o,vScale:a,index:r}=s,l=o.axis,h=a.axis,c=function(t,e,i){return`${t.id}.${e.id}.${i.stack||i.type}`}(o,a,s),d=e.length;let u;for(let t=0;ti[t].axis===e)).shift()}function Ws(t,e){const i=t.controller.index,s=t.vScale&&t.vScale.axis;if(s){e=e||t._parsed;for(const t of e){const e=t._stacks;if(!e||void 0===e[s]||void 0===e[s][i])return;delete e[s][i],void 0!==e[s]._visualValues&&void 0!==e[s]._visualValues[i]&&delete e[s]._visualValues[i]}}}const Ns=t=>"reset"===t||"none"===t,Hs=(t,e)=>e?t:Object.assign({},t);class js{static defaults={};static datasetElementType=null;static dataElementType=null;constructor(t,e){this.chart=t,this._ctx=t.ctx,this.index=e,this._cachedDataOpts={},this._cachedMeta=this.getMeta(),this._type=this._cachedMeta.type,this.options=void 0,this._parsing=!1,this._data=void 0,this._objectData=void 0,this._sharedOptions=void 0,this._drawStart=void 0,this._drawCount=void 0,this.enableOptionSharing=!1,this.supportsDecimation=!1,this.$context=void 0,this._syncList=[],this.datasetElementType=new.target.datasetElementType,this.dataElementType=new.target.dataElementType,this.initialize()}initialize(){const t=this._cachedMeta;this.configure(),this.linkScales(),t._stacked=Is(t.vScale,t),this.addElements(),this.options.fill&&!this.chart.isPluginEnabled("filler")&&console.warn("Tried to use the 'fill' option without the 'Filler' plugin enabled. Please import and register the 'Filler' plugin and make sure it is not disabled in the options")}updateIndex(t){this.index!==t&&Ws(this._cachedMeta),this.index=t}linkScales(){const t=this.chart,e=this._cachedMeta,i=this.getDataset(),s=(t,e,i,s)=>"x"===t?e:"r"===t?s:i,n=e.xAxisID=l(i.xAxisID,Bs(t,"x")),o=e.yAxisID=l(i.yAxisID,Bs(t,"y")),a=e.rAxisID=l(i.rAxisID,Bs(t,"r")),r=e.indexAxis,h=e.iAxisID=s(r,n,o,a),c=e.vAxisID=s(r,o,n,a);e.xScale=this.getScaleForId(n),e.yScale=this.getScaleForId(o),e.rScale=this.getScaleForId(a),e.iScale=this.getScaleForId(h),e.vScale=this.getScaleForId(c)}getDataset(){return this.chart.data.datasets[this.index]}getMeta(){return this.chart.getDatasetMeta(this.index)}getScaleForId(t){return this.chart.scales[t]}_getOtherScale(t){const e=this._cachedMeta;return t===e.iScale?e.vScale:e.iScale}reset(){this._update("reset")}_destroy(){const t=this._cachedMeta;this._data&&rt(this._data,this),t._stacked&&Ws(t)}_dataCheck(){const t=this.getDataset(),e=t.data||(t.data=[]),i=this._data;if(o(e)){const t=this._cachedMeta;this._data=function(t,e){const{iScale:i,vScale:s}=e,n="x"===i.axis?"x":"y",o="x"===s.axis?"x":"y",a=Object.keys(t),r=new Array(a.length);let l,h,c;for(l=0,h=a.length;l0&&i._parsed[t-1];if(!1===this._parsing)i._parsed=s,i._sorted=!0,d=s;else{d=n(s[t])?this.parseArrayData(i,s,t,e):o(s[t])?this.parseObjectData(i,s,t,e):this.parsePrimitiveData(i,s,t,e);const a=()=>null===c[l]||f&&c[l]t&&!e.hidden&&e._stacked&&{keys:Es(i,!0),values:null})(e,i,this.chart),h={min:Number.POSITIVE_INFINITY,max:Number.NEGATIVE_INFINITY},{min:c,max:d}=function(t){const{min:e,max:i,minDefined:s,maxDefined:n}=t.getUserBounds();return{min:s?e:Number.NEGATIVE_INFINITY,max:n?i:Number.POSITIVE_INFINITY}}(r);let u,f;function g(){f=s[u];const e=f[r.axis];return!a(f[t.axis])||c>e||d=0;--u)if(!g()){this.updateRangeFromParsed(h,t,f,l);break}return h}getAllParsedValues(t){const e=this._cachedMeta._parsed,i=[];let s,n,o;for(s=0,n=e.length;s=0&&tthis.getContext(i,s,e)),c);return f.$shared&&(f.$shared=r,n[o]=Object.freeze(Hs(f,r))),f}_resolveAnimations(t,e,i){const s=this.chart,n=this._cachedDataOpts,o=`animation-${e}`,a=n[o];if(a)return a;let r;if(!1!==s.options.animation){const s=this.chart.config,n=s.datasetAnimationScopeKeys(this._type,e),o=s.getOptionScopes(this.getDataset(),n);r=s.createResolver(o,this.getContext(t,i,e))}const l=new Ts(s,r&&r.animations);return r&&r._cacheable&&(n[o]=Object.freeze(l)),l}getSharedOptions(t){if(t.$shared)return this._sharedOptions||(this._sharedOptions=Object.assign({},t))}includeOptions(t,e){return!e||Ns(t)||this.chart._animationsDisabled}_getSharedOptions(t,e){const i=this.resolveDataElementOptions(t,e),s=this._sharedOptions,n=this.getSharedOptions(i),o=this.includeOptions(e,n)||n!==s;return this.updateSharedOptions(n,e,i),{sharedOptions:n,includeOptions:o}}updateElement(t,e,i,s){Ns(s)?Object.assign(t,i):this._resolveAnimations(e,s).update(t,i)}updateSharedOptions(t,e,i){t&&!Ns(e)&&this._resolveAnimations(void 0,e).update(t,i)}_setStyle(t,e,i,s){t.active=s;const n=this.getStyle(e,s);this._resolveAnimations(e,i,s).update(t,{options:!s&&this.getSharedOptions(n)||n})}removeHoverStyle(t,e,i){this._setStyle(t,i,"active",!1)}setHoverStyle(t,e,i){this._setStyle(t,i,"active",!0)}_removeDatasetHoverStyle(){const t=this._cachedMeta.dataset;t&&this._setStyle(t,void 0,"active",!1)}_setDatasetHoverStyle(){const t=this._cachedMeta.dataset;t&&this._setStyle(t,void 0,"active",!0)}_resyncElements(t){const e=this._data,i=this._cachedMeta.data;for(const[t,e,i]of this._syncList)this[t](e,i);this._syncList=[];const s=i.length,n=e.length,o=Math.min(n,s);o&&this.parse(0,o),n>s?this._insertElements(s,n-s,t):n{for(t.length+=e,a=t.length-1;a>=o;a--)t[a]=t[a-e]};for(r(n),a=t;a{s[t]=i[t]&&i[t].active()?i[t]._to:this[t]})),s}}function Ys(t,e){const i=t.options.ticks,n=function(t){const e=t.options.offset,i=t._tickSize(),s=t._length/i+(e?0:1),n=t._maxLength/i;return Math.floor(Math.min(s,n))}(t),o=Math.min(i.maxTicksLimit||n,n),a=i.major.enabled?function(t){const e=[];let i,s;for(i=0,s=t.length;io)return function(t,e,i,s){let n,o=0,a=i[0];for(s=Math.ceil(s),n=0;nn)return e}return Math.max(n,1)}(a,e,o);if(r>0){let t,i;const n=r>1?Math.round((h-l)/(r-1)):null;for(Us(e,c,d,s(n)?0:l-n,l),t=0,i=r-1;t"top"===e||"left"===e?t[e]+i:t[e]-i,qs=(t,e)=>Math.min(e||t,t);function Ks(t,e){const i=[],s=t.length/e,n=t.length;let o=0;for(;oa+r)))return h}function Js(t){return t.drawTicks?t.tickLength:0}function Zs(t,e){if(!t.display)return 0;const i=Si(t.font,e),s=ki(t.padding);return(n(t.text)?t.text.length:1)*i.lineHeight+s.height}function Qs(t,e,i){let s=ut(t);return(i&&"right"!==e||!i&&"right"===e)&&(s=(t=>"left"===t?"right":"right"===t?"left":t)(s)),s}class tn extends $s{constructor(t){super(),this.id=t.id,this.type=t.type,this.options=void 0,this.ctx=t.ctx,this.chart=t.chart,this.top=void 0,this.bottom=void 0,this.left=void 0,this.right=void 0,this.width=void 0,this.height=void 0,this._margins={left:0,right:0,top:0,bottom:0},this.maxWidth=void 0,this.maxHeight=void 0,this.paddingTop=void 0,this.paddingBottom=void 0,this.paddingLeft=void 0,this.paddingRight=void 0,this.axis=void 0,this.labelRotation=void 0,this.min=void 0,this.max=void 0,this._range=void 0,this.ticks=[],this._gridLineItems=null,this._labelItems=null,this._labelSizes=null,this._length=0,this._maxLength=0,this._longestTextCache={},this._startPixel=void 0,this._endPixel=void 0,this._reversePixels=!1,this._userMax=void 0,this._userMin=void 0,this._suggestedMax=void 0,this._suggestedMin=void 0,this._ticksLength=0,this._borderValue=0,this._cache={},this._dataLimitsCached=!1,this.$context=void 0}init(t){this.options=t.setContext(this.getContext()),this.axis=t.axis,this._userMin=this.parse(t.min),this._userMax=this.parse(t.max),this._suggestedMin=this.parse(t.suggestedMin),this._suggestedMax=this.parse(t.suggestedMax)}parse(t,e){return t}getUserBounds(){let{_userMin:t,_userMax:e,_suggestedMin:i,_suggestedMax:s}=this;return t=r(t,Number.POSITIVE_INFINITY),e=r(e,Number.NEGATIVE_INFINITY),i=r(i,Number.POSITIVE_INFINITY),s=r(s,Number.NEGATIVE_INFINITY),{min:r(t,i),max:r(e,s),minDefined:a(t),maxDefined:a(e)}}getMinMax(t){let e,{min:i,max:s,minDefined:n,maxDefined:o}=this.getUserBounds();if(n&&o)return{min:i,max:s};const a=this.getMatchingVisibleMetas();for(let r=0,l=a.length;rs?s:i,s=n&&i>s?i:s,{min:r(i,r(s,i)),max:r(s,r(i,s))}}getPadding(){return{left:this.paddingLeft||0,top:this.paddingTop||0,right:this.paddingRight||0,bottom:this.paddingBottom||0}}getTicks(){return this.ticks}getLabels(){const t=this.chart.data;return this.options.labels||(this.isHorizontal()?t.xLabels:t.yLabels)||t.labels||[]}getLabelItems(t=this.chart.chartArea){return this._labelItems||(this._labelItems=this._computeLabelItems(t))}beforeLayout(){this._cache={},this._dataLimitsCached=!1}beforeUpdate(){d(this.options.beforeUpdate,[this])}update(t,e,i){const{beginAtZero:s,grace:n,ticks:o}=this.options,a=o.sampleSize;this.beforeUpdate(),this.maxWidth=t,this.maxHeight=e,this._margins=i=Object.assign({left:0,right:0,top:0,bottom:0},i),this.ticks=null,this._labelSizes=null,this._gridLineItems=null,this._labelItems=null,this.beforeSetDimensions(),this.setDimensions(),this.afterSetDimensions(),this._maxLength=this.isHorizontal()?this.width+i.left+i.right:this.height+i.top+i.bottom,this._dataLimitsCached||(this.beforeDataLimits(),this.determineDataLimits(),this.afterDataLimits(),this._range=Di(this,n,s),this._dataLimitsCached=!0),this.beforeBuildTicks(),this.ticks=this.buildTicks()||[],this.afterBuildTicks();const r=a=n||i<=1||!this.isHorizontal())return void(this.labelRotation=s);const h=this._getLabelSizes(),c=h.widest.width,d=h.highest.height,u=Z(this.chart.width-c,0,this.maxWidth);o=t.offset?this.maxWidth/i:u/(i-1),c+6>o&&(o=u/(i-(t.offset?.5:1)),a=this.maxHeight-Js(t.grid)-e.padding-Zs(t.title,this.chart.options.font),r=Math.sqrt(c*c+d*d),l=Y(Math.min(Math.asin(Z((h.highest.height+6)/o,-1,1)),Math.asin(Z(a/r,-1,1))-Math.asin(Z(d/r,-1,1)))),l=Math.max(s,Math.min(n,l))),this.labelRotation=l}afterCalculateLabelRotation(){d(this.options.afterCalculateLabelRotation,[this])}afterAutoSkip(){}beforeFit(){d(this.options.beforeFit,[this])}fit(){const t={width:0,height:0},{chart:e,options:{ticks:i,title:s,grid:n}}=this,o=this._isVisible(),a=this.isHorizontal();if(o){const o=Zs(s,e.options.font);if(a?(t.width=this.maxWidth,t.height=Js(n)+o):(t.height=this.maxHeight,t.width=Js(n)+o),i.display&&this.ticks.length){const{first:e,last:s,widest:n,highest:o}=this._getLabelSizes(),r=2*i.padding,l=$(this.labelRotation),h=Math.cos(l),c=Math.sin(l);if(a){const e=i.mirror?0:c*n.width+h*o.height;t.height=Math.min(this.maxHeight,t.height+e+r)}else{const e=i.mirror?0:h*n.width+c*o.height;t.width=Math.min(this.maxWidth,t.width+e+r)}this._calculatePadding(e,s,c,h)}}this._handleMargins(),a?(this.width=this._length=e.width-this._margins.left-this._margins.right,this.height=t.height):(this.width=t.width,this.height=this._length=e.height-this._margins.top-this._margins.bottom)}_calculatePadding(t,e,i,s){const{ticks:{align:n,padding:o},position:a}=this.options,r=0!==this.labelRotation,l="top"!==a&&"x"===this.axis;if(this.isHorizontal()){const a=this.getPixelForTick(0)-this.left,h=this.right-this.getPixelForTick(this.ticks.length-1);let c=0,d=0;r?l?(c=s*t.width,d=i*e.height):(c=i*t.height,d=s*e.width):"start"===n?d=e.width:"end"===n?c=t.width:"inner"!==n&&(c=t.width/2,d=e.width/2),this.paddingLeft=Math.max((c-a+o)*this.width/(this.width-a),0),this.paddingRight=Math.max((d-h+o)*this.width/(this.width-h),0)}else{let i=e.height/2,s=t.height/2;"start"===n?(i=0,s=t.height):"end"===n&&(i=e.height,s=0),this.paddingTop=i+o,this.paddingBottom=s+o}}_handleMargins(){this._margins&&(this._margins.left=Math.max(this.paddingLeft,this._margins.left),this._margins.top=Math.max(this.paddingTop,this._margins.top),this._margins.right=Math.max(this.paddingRight,this._margins.right),this._margins.bottom=Math.max(this.paddingBottom,this._margins.bottom))}afterFit(){d(this.options.afterFit,[this])}isHorizontal(){const{axis:t,position:e}=this.options;return"top"===e||"bottom"===e||"x"===t}isFullSize(){return this.options.fullSize}_convertTicksToLabels(t){let e,i;for(this.beforeTickToLabelConversion(),this.generateTickLabels(t),e=0,i=t.length;e{const i=t.gc,s=i.length/2;let n;if(s>e){for(n=0;n({width:r[t]||0,height:l[t]||0});return{first:P(0),last:P(e-1),widest:P(k),highest:P(S),widths:r,heights:l}}getLabelForValue(t){return t}getPixelForValue(t,e){return NaN}getValueForPixel(t){}getPixelForTick(t){const e=this.ticks;return t<0||t>e.length-1?null:this.getPixelForValue(e[t].value)}getPixelForDecimal(t){this._reversePixels&&(t=1-t);const e=this._startPixel+t*this._length;return Q(this._alignToPixels?Ae(this.chart,e,0):e)}getDecimalForPixel(t){const e=(t-this._startPixel)/this._length;return this._reversePixels?1-e:e}getBasePixel(){return this.getPixelForValue(this.getBaseValue())}getBaseValue(){const{min:t,max:e}=this;return t<0&&e<0?e:t>0&&e>0?t:0}getContext(t){const e=this.ticks||[];if(t>=0&&ta*s?a/i:r/s:r*s0}_computeGridLineItems(t){const e=this.axis,i=this.chart,s=this.options,{grid:n,position:a,border:r}=s,h=n.offset,c=this.isHorizontal(),d=this.ticks.length+(h?1:0),u=Js(n),f=[],g=r.setContext(this.getContext()),p=g.display?g.width:0,m=p/2,x=function(t){return Ae(i,t,p)};let b,_,y,v,M,w,k,S,P,D,C,O;if("top"===a)b=x(this.bottom),w=this.bottom-u,S=b-m,D=x(t.top)+m,O=t.bottom;else if("bottom"===a)b=x(this.top),D=t.top,O=x(t.bottom)-m,w=b+m,S=this.top+u;else if("left"===a)b=x(this.right),M=this.right-u,k=b-m,P=x(t.left)+m,C=t.right;else if("right"===a)b=x(this.left),P=t.left,C=x(t.right)-m,M=b+m,k=this.left+u;else if("x"===e){if("center"===a)b=x((t.top+t.bottom)/2+.5);else if(o(a)){const t=Object.keys(a)[0],e=a[t];b=x(this.chart.scales[t].getPixelForValue(e))}D=t.top,O=t.bottom,w=b+m,S=w+u}else if("y"===e){if("center"===a)b=x((t.left+t.right)/2);else if(o(a)){const t=Object.keys(a)[0],e=a[t];b=x(this.chart.scales[t].getPixelForValue(e))}M=b-m,k=M-u,P=t.left,C=t.right}const A=l(s.ticks.maxTicksLimit,d),T=Math.max(1,Math.ceil(d/A));for(_=0;_0&&(o-=s/2)}d={left:o,top:n,width:s+e.width,height:i+e.height,color:t.backdropColor}}x.push({label:v,font:P,textOffset:O,options:{rotation:m,color:i,strokeColor:o,strokeWidth:h,textAlign:f,textBaseline:A,translation:[M,w],backdrop:d}})}return x}_getXAxisLabelAlignment(){const{position:t,ticks:e}=this.options;if(-$(this.labelRotation))return"top"===t?"left":"right";let i="center";return"start"===e.align?i="left":"end"===e.align?i="right":"inner"===e.align&&(i="inner"),i}_getYAxisLabelAlignment(t){const{position:e,ticks:{crossAlign:i,mirror:s,padding:n}}=this.options,o=t+n,a=this._getLabelSizes().widest.width;let r,l;return"left"===e?s?(l=this.right+n,"near"===i?r="left":"center"===i?(r="center",l+=a/2):(r="right",l+=a)):(l=this.right-o,"near"===i?r="right":"center"===i?(r="center",l-=a/2):(r="left",l=this.left)):"right"===e?s?(l=this.left+n,"near"===i?r="right":"center"===i?(r="center",l-=a/2):(r="left",l-=a)):(l=this.left+o,"near"===i?r="left":"center"===i?(r="center",l+=a/2):(r="right",l=this.right)):r="right",{textAlign:r,x:l}}_computeLabelArea(){if(this.options.ticks.mirror)return;const t=this.chart,e=this.options.position;return"left"===e||"right"===e?{top:0,left:this.left,bottom:t.height,right:this.right}:"top"===e||"bottom"===e?{top:this.top,left:0,bottom:this.bottom,right:t.width}:void 0}drawBackground(){const{ctx:t,options:{backgroundColor:e},left:i,top:s,width:n,height:o}=this;e&&(t.save(),t.fillStyle=e,t.fillRect(i,s,n,o),t.restore())}getLineWidthForValue(t){const e=this.options.grid;if(!this._isVisible()||!e.display)return 0;const i=this.ticks.findIndex((e=>e.value===t));if(i>=0){return e.setContext(this.getContext(i)).lineWidth}return 0}drawGrid(t){const e=this.options.grid,i=this.ctx,s=this._gridLineItems||(this._gridLineItems=this._computeGridLineItems(t));let n,o;const a=(t,e,s)=>{s.width&&s.color&&(i.save(),i.lineWidth=s.width,i.strokeStyle=s.color,i.setLineDash(s.borderDash||[]),i.lineDashOffset=s.borderDashOffset,i.beginPath(),i.moveTo(t.x,t.y),i.lineTo(e.x,e.y),i.stroke(),i.restore())};if(e.display)for(n=0,o=s.length;n{this.drawBackground(),this.drawGrid(t),this.drawTitle()}},{z:s,draw:()=>{this.drawBorder()}},{z:e,draw:t=>{this.drawLabels(t)}}]:[{z:e,draw:t=>{this.draw(t)}}]}getMatchingVisibleMetas(t){const e=this.chart.getSortedVisibleDatasetMetas(),i=this.axis+"AxisID",s=[];let n,o;for(n=0,o=e.length;n{const s=i.split("."),n=s.pop(),o=[t].concat(s).join("."),a=e[i].split("."),r=a.pop(),l=a.join(".");ue.route(o,n,l,r)}))}(e,t.defaultRoutes);t.descriptors&&ue.describe(e,t.descriptors)}(t,o,i),this.override&&ue.override(t.id,t.overrides)),o}get(t){return this.items[t]}unregister(t){const e=this.items,i=t.id,s=this.scope;i in e&&delete e[i],s&&i in ue[s]&&(delete ue[s][i],this.override&&delete re[i])}}class sn{constructor(){this.controllers=new en(js,"datasets",!0),this.elements=new en($s,"elements"),this.plugins=new en(Object,"plugins"),this.scales=new en(tn,"scales"),this._typedRegistries=[this.controllers,this.scales,this.elements]}add(...t){this._each("register",t)}remove(...t){this._each("unregister",t)}addControllers(...t){this._each("register",t,this.controllers)}addElements(...t){this._each("register",t,this.elements)}addPlugins(...t){this._each("register",t,this.plugins)}addScales(...t){this._each("register",t,this.scales)}getController(t){return this._get(t,this.controllers,"controller")}getElement(t){return this._get(t,this.elements,"element")}getPlugin(t){return this._get(t,this.plugins,"plugin")}getScale(t){return this._get(t,this.scales,"scale")}removeControllers(...t){this._each("unregister",t,this.controllers)}removeElements(...t){this._each("unregister",t,this.elements)}removePlugins(...t){this._each("unregister",t,this.plugins)}removeScales(...t){this._each("unregister",t,this.scales)}_each(t,e,i){[...e].forEach((e=>{const s=i||this._getRegistryForType(e);i||s.isForType(e)||s===this.plugins&&e.id?this._exec(t,s,e):u(e,(e=>{const s=i||this._getRegistryForType(e);this._exec(t,s,e)}))}))}_exec(t,e,i){const s=w(t);d(i["before"+s],[],i),e[t](i),d(i["after"+s],[],i)}_getRegistryForType(t){for(let e=0;et.filter((t=>!e.some((e=>t.plugin.id===e.plugin.id))));this._notify(s(e,i),t,"stop"),this._notify(s(i,e),t,"start")}}function an(t,e){return e||!1!==t?!0===t?{}:t:null}function rn(t,{plugin:e,local:i},s,n){const o=t.pluginScopeKeys(e),a=t.getOptionScopes(s,o);return i&&e.defaults&&a.push(e.defaults),t.createResolver(a,n,[""],{scriptable:!1,indexable:!1,allKeys:!0})}function ln(t,e){const i=ue.datasets[t]||{};return((e.datasets||{})[t]||{}).indexAxis||e.indexAxis||i.indexAxis||"x"}function hn(t){if("x"===t||"y"===t||"r"===t)return t}function cn(t,...e){if(hn(t))return t;for(const s of e){const e=s.axis||("top"===(i=s.position)||"bottom"===i?"x":"left"===i||"right"===i?"y":void 0)||t.length>1&&hn(t[0].toLowerCase());if(e)return e}var i;throw new Error(`Cannot determine type of '${t}' axis. Please provide 'axis' or 'position' option.`)}function dn(t,e,i){if(i[e+"AxisID"]===t)return{axis:e}}function un(t,e){const i=re[t.type]||{scales:{}},s=e.scales||{},n=ln(t.type,e),a=Object.create(null);return Object.keys(s).forEach((e=>{const r=s[e];if(!o(r))return console.error(`Invalid scale configuration for scale: ${e}`);if(r._proxy)return console.warn(`Ignoring resolver passed as options for scale: ${e}`);const l=cn(e,r,function(t,e){if(e.data&&e.data.datasets){const i=e.data.datasets.filter((e=>e.xAxisID===t||e.yAxisID===t));if(i.length)return dn(t,"x",i[0])||dn(t,"y",i[0])}return{}}(e,t),ue.scales[r.type]),h=function(t,e){return t===e?"_index_":"_value_"}(l,n),c=i.scales||{};a[e]=b(Object.create(null),[{axis:l},r,c[l],c[h]])})),t.data.datasets.forEach((i=>{const n=i.type||t.type,o=i.indexAxis||ln(n,e),r=(re[n]||{}).scales||{};Object.keys(r).forEach((t=>{const e=function(t,e){let i=t;return"_index_"===t?i=e:"_value_"===t&&(i="x"===e?"y":"x"),i}(t,o),n=i[e+"AxisID"]||e;a[n]=a[n]||Object.create(null),b(a[n],[{axis:e},s[n],r[t]])}))})),Object.keys(a).forEach((t=>{const e=a[t];b(e,[ue.scales[e.type],ue.scale])})),a}function fn(t){const e=t.options||(t.options={});e.plugins=l(e.plugins,{}),e.scales=un(t,e)}function gn(t){return(t=t||{}).datasets=t.datasets||[],t.labels=t.labels||[],t}const pn=new Map,mn=new Set;function xn(t,e){let i=pn.get(t);return i||(i=e(),pn.set(t,i),mn.add(i)),i}const bn=(t,e,i)=>{const s=M(e,i);void 0!==s&&t.add(s)};class _n{constructor(t){this._config=function(t){return(t=t||{}).data=gn(t.data),fn(t),t}(t),this._scopeCache=new Map,this._resolverCache=new Map}get platform(){return this._config.platform}get type(){return this._config.type}set type(t){this._config.type=t}get data(){return this._config.data}set data(t){this._config.data=gn(t)}get options(){return this._config.options}set options(t){this._config.options=t}get plugins(){return this._config.plugins}update(){const t=this._config;this.clearCache(),fn(t)}clearCache(){this._scopeCache.clear(),this._resolverCache.clear()}datasetScopeKeys(t){return xn(t,(()=>[[`datasets.${t}`,""]]))}datasetAnimationScopeKeys(t,e){return xn(`${t}.transition.${e}`,(()=>[[`datasets.${t}.transitions.${e}`,`transitions.${e}`],[`datasets.${t}`,""]]))}datasetElementScopeKeys(t,e){return xn(`${t}-${e}`,(()=>[[`datasets.${t}.elements.${e}`,`datasets.${t}`,`elements.${e}`,""]]))}pluginScopeKeys(t){const e=t.id;return xn(`${this.type}-plugin-${e}`,(()=>[[`plugins.${e}`,...t.additionalOptionScopes||[]]]))}_cachedScopes(t,e){const i=this._scopeCache;let s=i.get(t);return s&&!e||(s=new Map,i.set(t,s)),s}getOptionScopes(t,e,i){const{options:s,type:n}=this,o=this._cachedScopes(t,i),a=o.get(e);if(a)return a;const r=new Set;e.forEach((e=>{t&&(r.add(t),e.forEach((e=>bn(r,t,e)))),e.forEach((t=>bn(r,s,t))),e.forEach((t=>bn(r,re[n]||{},t))),e.forEach((t=>bn(r,ue,t))),e.forEach((t=>bn(r,le,t)))}));const l=Array.from(r);return 0===l.length&&l.push(Object.create(null)),mn.has(e)&&o.set(e,l),l}chartOptionScopes(){const{options:t,type:e}=this;return[t,re[e]||{},ue.datasets[e]||{},{type:e},ue,le]}resolveNamedOptions(t,e,i,s=[""]){const o={$shared:!0},{resolver:a,subPrefixes:r}=yn(this._resolverCache,t,s);let l=a;if(function(t,e){const{isScriptable:i,isIndexable:s}=Ye(t);for(const o of e){const e=i(o),a=s(o),r=(a||e)&&t[o];if(e&&(S(r)||vn(r))||a&&n(r))return!0}return!1}(a,e)){o.$shared=!1;l=$e(a,i=S(i)?i():i,this.createResolver(t,i,r))}for(const t of e)o[t]=l[t];return o}createResolver(t,e,i=[""],s){const{resolver:n}=yn(this._resolverCache,t,i);return o(e)?$e(n,e,void 0,s):n}}function yn(t,e,i){let s=t.get(e);s||(s=new Map,t.set(e,s));const n=i.join();let o=s.get(n);if(!o){o={resolver:je(e,i),subPrefixes:i.filter((t=>!t.toLowerCase().includes("hover")))},s.set(n,o)}return o}const vn=t=>o(t)&&Object.getOwnPropertyNames(t).some((e=>S(t[e])));const Mn=["top","bottom","left","right","chartArea"];function wn(t,e){return"top"===t||"bottom"===t||-1===Mn.indexOf(t)&&"x"===e}function kn(t,e){return function(i,s){return i[t]===s[t]?i[e]-s[e]:i[t]-s[t]}}function Sn(t){const e=t.chart,i=e.options.animation;e.notifyPlugins("afterRender"),d(i&&i.onComplete,[t],e)}function Pn(t){const e=t.chart,i=e.options.animation;d(i&&i.onProgress,[t],e)}function Dn(t){return fe()&&"string"==typeof t?t=document.getElementById(t):t&&t.length&&(t=t[0]),t&&t.canvas&&(t=t.canvas),t}const Cn={},On=t=>{const e=Dn(t);return Object.values(Cn).filter((t=>t.canvas===e)).pop()};function An(t,e,i){const s=Object.keys(t);for(const n of s){const s=+n;if(s>=e){const o=t[n];delete t[n],(i>0||s>e)&&(t[s+i]=o)}}}class Tn{static defaults=ue;static instances=Cn;static overrides=re;static registry=nn;static version="4.5.1";static getChart=On;static register(...t){nn.add(...t),Ln()}static unregister(...t){nn.remove(...t),Ln()}constructor(t,e){const s=this.config=new _n(e),n=Dn(t),o=On(n);if(o)throw new Error("Canvas is already in use. Chart with ID '"+o.id+"' must be destroyed before the canvas with ID '"+o.canvas.id+"' can be reused.");const a=s.createResolver(s.chartOptionScopes(),this.getContext());this.platform=new(s.platform||Ps(n)),this.platform.updateConfig(s);const r=this.platform.acquireContext(n,a.aspectRatio),l=r&&r.canvas,h=l&&l.height,c=l&&l.width;this.id=i(),this.ctx=r,this.canvas=l,this.width=c,this.height=h,this._options=a,this._aspectRatio=this.aspectRatio,this._layers=[],this._metasets=[],this._stacks=void 0,this.boxes=[],this.currentDevicePixelRatio=void 0,this.chartArea=void 0,this._active=[],this._lastEvent=void 0,this._listeners={},this._responsiveListeners=void 0,this._sortedMetasets=[],this.scales={},this._plugins=new on,this.$proxies={},this._hiddenIndices={},this.attached=!1,this._animationsDisabled=void 0,this.$context=void 0,this._doResize=dt((t=>this.update(t)),a.resizeDelay||0),this._dataChanges=[],Cn[this.id]=this,r&&l?(bt.listen(this,"complete",Sn),bt.listen(this,"progress",Pn),this._initialize(),this.attached&&this.update()):console.error("Failed to create chart: can't acquire context from the given item")}get aspectRatio(){const{options:{aspectRatio:t,maintainAspectRatio:e},width:i,height:n,_aspectRatio:o}=this;return s(t)?e&&o?o:n?i/n:null:t}get data(){return this.config.data}set data(t){this.config.data=t}get options(){return this._options}set options(t){this.config.options=t}get registry(){return nn}_initialize(){return this.notifyPlugins("beforeInit"),this.options.responsive?this.resize():ke(this,this.options.devicePixelRatio),this.bindEvents(),this.notifyPlugins("afterInit"),this}clear(){return Te(this.canvas,this.ctx),this}stop(){return bt.stop(this),this}resize(t,e){bt.running(this)?this._resizeBeforeDraw={width:t,height:e}:this._resize(t,e)}_resize(t,e){const i=this.options,s=this.canvas,n=i.maintainAspectRatio&&this.aspectRatio,o=this.platform.getMaximumSize(s,t,e,n),a=i.devicePixelRatio||this.platform.getDevicePixelRatio(),r=this.width?"resize":"attach";this.width=o.width,this.height=o.height,this._aspectRatio=this.aspectRatio,ke(this,a,!0)&&(this.notifyPlugins("resize",{size:o}),d(i.onResize,[this,o],this),this.attached&&this._doResize(r)&&this.render())}ensureScalesHaveIDs(){u(this.options.scales||{},((t,e)=>{t.id=e}))}buildOrUpdateScales(){const t=this.options,e=t.scales,i=this.scales,s=Object.keys(i).reduce(((t,e)=>(t[e]=!1,t)),{});let n=[];e&&(n=n.concat(Object.keys(e).map((t=>{const i=e[t],s=cn(t,i),n="r"===s,o="x"===s;return{options:i,dposition:n?"chartArea":o?"bottom":"left",dtype:n?"radialLinear":o?"category":"linear"}})))),u(n,(e=>{const n=e.options,o=n.id,a=cn(o,n),r=l(n.type,e.dtype);void 0!==n.position&&wn(n.position,a)===wn(e.dposition)||(n.position=e.dposition),s[o]=!0;let h=null;if(o in i&&i[o].type===r)h=i[o];else{h=new(nn.getScale(r))({id:o,type:r,ctx:this.ctx,chart:this}),i[h.id]=h}h.init(n,t)})),u(s,((t,e)=>{t||delete i[e]})),u(i,(t=>{ls.configure(this,t,t.options),ls.addBox(this,t)}))}_updateMetasets(){const t=this._metasets,e=this.data.datasets.length,i=t.length;if(t.sort(((t,e)=>t.index-e.index)),i>e){for(let t=e;te.length&&delete this._stacks,t.forEach(((t,i)=>{0===e.filter((e=>e===t._dataset)).length&&this._destroyDatasetMeta(i)}))}buildOrUpdateControllers(){const t=[],e=this.data.datasets;let i,s;for(this._removeUnreferencedMetasets(),i=0,s=e.length;i{this.getDatasetMeta(e).controller.reset()}),this)}reset(){this._resetElements(),this.notifyPlugins("reset")}update(t){const e=this.config;e.update();const i=this._options=e.createResolver(e.chartOptionScopes(),this.getContext()),s=this._animationsDisabled=!i.animation;if(this._updateScales(),this._checkEventBindings(),this._updateHiddenIndices(),this._plugins.invalidate(),!1===this.notifyPlugins("beforeUpdate",{mode:t,cancelable:!0}))return;const n=this.buildOrUpdateControllers();this.notifyPlugins("beforeElementsUpdate");let o=0;for(let t=0,e=this.data.datasets.length;t{t.reset()})),this._updateDatasets(t),this.notifyPlugins("afterUpdate",{mode:t}),this._layers.sort(kn("z","_idx"));const{_active:a,_lastEvent:r}=this;r?this._eventHandler(r,!0):a.length&&this._updateHoverStyles(a,a,!0),this.render()}_updateScales(){u(this.scales,(t=>{ls.removeBox(this,t)})),this.ensureScalesHaveIDs(),this.buildOrUpdateScales()}_checkEventBindings(){const t=this.options,e=new Set(Object.keys(this._listeners)),i=new Set(t.events);P(e,i)&&!!this._responsiveListeners===t.responsive||(this.unbindEvents(),this.bindEvents())}_updateHiddenIndices(){const{_hiddenIndices:t}=this,e=this._getUniformDataChanges()||[];for(const{method:i,start:s,count:n}of e){An(t,s,"_removeElements"===i?-n:n)}}_getUniformDataChanges(){const t=this._dataChanges;if(!t||!t.length)return;this._dataChanges=[];const e=this.data.datasets.length,i=e=>new Set(t.filter((t=>t[0]===e)).map(((t,e)=>e+","+t.splice(1).join(",")))),s=i(0);for(let t=1;tt.split(","))).map((t=>({method:t[1],start:+t[2],count:+t[3]})))}_updateLayout(t){if(!1===this.notifyPlugins("beforeLayout",{cancelable:!0}))return;ls.update(this,this.width,this.height,t);const e=this.chartArea,i=e.width<=0||e.height<=0;this._layers=[],u(this.boxes,(t=>{i&&"chartArea"===t.position||(t.configure&&t.configure(),this._layers.push(...t._layers()))}),this),this._layers.forEach(((t,e)=>{t._idx=e})),this.notifyPlugins("afterLayout")}_updateDatasets(t){if(!1!==this.notifyPlugins("beforeDatasetsUpdate",{mode:t,cancelable:!0})){for(let t=0,e=this.data.datasets.length;t=0;--e)this._drawDataset(t[e]);this.notifyPlugins("afterDatasetsDraw")}_drawDataset(t){const e=this.ctx,i={meta:t,index:t.index,cancelable:!0},s=Ni(this,t);!1!==this.notifyPlugins("beforeDatasetDraw",i)&&(s&&Ie(e,s),t.controller.draw(),s&&ze(e),i.cancelable=!1,this.notifyPlugins("afterDatasetDraw",i))}isPointInArea(t){return Re(t,this.chartArea,this._minPadding)}getElementsAtEventForMode(t,e,i,s){const n=Ki.modes[e];return"function"==typeof n?n(this,t,i,s):[]}getDatasetMeta(t){const e=this.data.datasets[t],i=this._metasets;let s=i.filter((t=>t&&t._dataset===e)).pop();return s||(s={type:null,data:[],dataset:null,controller:null,hidden:null,xAxisID:null,yAxisID:null,order:e&&e.order||0,index:t,_dataset:e,_parsed:[],_sorted:!1},i.push(s)),s}getContext(){return this.$context||(this.$context=Ci(null,{chart:this,type:"chart"}))}getVisibleDatasetCount(){return this.getSortedVisibleDatasetMetas().length}isDatasetVisible(t){const e=this.data.datasets[t];if(!e)return!1;const i=this.getDatasetMeta(t);return"boolean"==typeof i.hidden?!i.hidden:!e.hidden}setDatasetVisibility(t,e){this.getDatasetMeta(t).hidden=!e}toggleDataVisibility(t){this._hiddenIndices[t]=!this._hiddenIndices[t]}getDataVisibility(t){return!this._hiddenIndices[t]}_updateVisibility(t,e,i){const s=i?"show":"hide",n=this.getDatasetMeta(t),o=n.controller._resolveAnimations(void 0,s);k(e)?(n.data[e].hidden=!i,this.update()):(this.setDatasetVisibility(t,i),o.update(n,{visible:i}),this.update((e=>e.datasetIndex===t?s:void 0)))}hide(t,e){this._updateVisibility(t,e,!1)}show(t,e){this._updateVisibility(t,e,!0)}_destroyDatasetMeta(t){const e=this._metasets[t];e&&e.controller&&e.controller._destroy(),delete this._metasets[t]}_stop(){let t,e;for(this.stop(),bt.remove(this),t=0,e=this.data.datasets.length;t{e.addEventListener(this,i,s),t[i]=s},s=(t,e,i)=>{t.offsetX=e,t.offsetY=i,this._eventHandler(t)};u(this.options.events,(t=>i(t,s)))}bindResponsiveEvents(){this._responsiveListeners||(this._responsiveListeners={});const t=this._responsiveListeners,e=this.platform,i=(i,s)=>{e.addEventListener(this,i,s),t[i]=s},s=(i,s)=>{t[i]&&(e.removeEventListener(this,i,s),delete t[i])},n=(t,e)=>{this.canvas&&this.resize(t,e)};let o;const a=()=>{s("attach",a),this.attached=!0,this.resize(),i("resize",n),i("detach",o)};o=()=>{this.attached=!1,s("resize",n),this._stop(),this._resize(0,0),i("attach",a)},e.isAttached(this.canvas)?a():o()}unbindEvents(){u(this._listeners,((t,e)=>{this.platform.removeEventListener(this,e,t)})),this._listeners={},u(this._responsiveListeners,((t,e)=>{this.platform.removeEventListener(this,e,t)})),this._responsiveListeners=void 0}updateHoverStyle(t,e,i){const s=i?"set":"remove";let n,o,a,r;for("dataset"===e&&(n=this.getDatasetMeta(t[0].datasetIndex),n.controller["_"+s+"DatasetHoverStyle"]()),a=0,r=t.length;a{const i=this.getDatasetMeta(t);if(!i)throw new Error("No dataset found at index "+t);return{datasetIndex:t,element:i.data[e],index:e}}));!f(i,e)&&(this._active=i,this._lastEvent=null,this._updateHoverStyles(i,e))}notifyPlugins(t,e,i){return this._plugins.notify(this,t,e,i)}isPluginEnabled(t){return 1===this._plugins._cache.filter((e=>e.plugin.id===t)).length}_updateHoverStyles(t,e,i){const s=this.options.hover,n=(t,e)=>t.filter((t=>!e.some((e=>t.datasetIndex===e.datasetIndex&&t.index===e.index)))),o=n(e,t),a=i?t:n(t,e);o.length&&this.updateHoverStyle(o,s.mode,!1),a.length&&s.mode&&this.updateHoverStyle(a,s.mode,!0)}_eventHandler(t,e){const i={event:t,replay:e,cancelable:!0,inChartArea:this.isPointInArea(t)},s=e=>(e.options.events||this.options.events).includes(t.native.type);if(!1===this.notifyPlugins("beforeEvent",i,s))return;const n=this._handleEvent(t,e,i.inChartArea);return i.cancelable=!1,this.notifyPlugins("afterEvent",i,s),(n||i.changed)&&this.render(),this}_handleEvent(t,e,i){const{_active:s=[],options:n}=this,o=e,a=this._getActiveElements(t,s,i,o),r=D(t),l=function(t,e,i,s){return i&&"mouseout"!==t.type?s?e:t:null}(t,this._lastEvent,i,r);i&&(this._lastEvent=null,d(n.onHover,[t,a,this],this),r&&d(n.onClick,[t,a,this],this));const h=!f(a,s);return(h||e)&&(this._active=a,this._updateHoverStyles(a,s,e)),this._lastEvent=l,h}_getActiveElements(t,e,i,s){if("mouseout"===t.type)return[];if(!i)return e;const n=this.options.hover;return this.getElementsAtEventForMode(t,n.mode,n,s)}}function Ln(){return u(Tn.instances,(t=>t._plugins.invalidate()))}function En(){throw new Error("This method is not implemented: Check that a complete date adapter is provided.")}class Rn{static override(t){Object.assign(Rn.prototype,t)}options;constructor(t){this.options=t||{}}init(){}formats(){return En()}parse(){return En()}format(){return En()}add(){return En()}diff(){return En()}startOf(){return En()}endOf(){return En()}}var In={_date:Rn};function zn(t){const e=t.iScale,i=function(t,e){if(!t._cache.$bar){const i=t.getMatchingVisibleMetas(e);let s=[];for(let e=0,n=i.length;et-e)))}return t._cache.$bar}(e,t.type);let s,n,o,a,r=e._length;const l=()=>{32767!==o&&-32768!==o&&(k(a)&&(r=Math.min(r,Math.abs(o-a)||r)),a=o)};for(s=0,n=i.length;sMath.abs(r)&&(l=r,h=a),e[i.axis]=h,e._custom={barStart:l,barEnd:h,start:n,end:o,min:a,max:r}}(t,e,i,s):e[i.axis]=i.parse(t,s),e}function Vn(t,e,i,s){const n=t.iScale,o=t.vScale,a=n.getLabels(),r=n===o,l=[];let h,c,d,u;for(h=i,c=i+s;ht.x,i="left",s="right"):(e=t.base"spacing"!==t,_indexable:t=>"spacing"!==t&&!t.startsWith("borderDash")&&!t.startsWith("hoverBorderDash")};static overrides={aspectRatio:1,plugins:{legend:{labels:{generateLabels(t){const e=t.data,{labels:{pointStyle:i,textAlign:s,color:n,useBorderRadius:o,borderRadius:a}}=t.legend.options;return e.labels.length&&e.datasets.length?e.labels.map(((e,r)=>{const l=t.getDatasetMeta(0).controller.getStyle(r);return{text:e,fillStyle:l.backgroundColor,fontColor:n,hidden:!t.getDataVisibility(r),lineDash:l.borderDash,lineDashOffset:l.borderDashOffset,lineJoin:l.borderJoinStyle,lineWidth:l.borderWidth,strokeStyle:l.borderColor,textAlign:s,pointStyle:i,borderRadius:o&&(a||l.borderRadius),index:r}})):[]}},onClick(t,e,i){i.chart.toggleDataVisibility(e.index),i.chart.update()}}}};constructor(t,e){super(t,e),this.enableOptionSharing=!0,this.innerRadius=void 0,this.outerRadius=void 0,this.offsetX=void 0,this.offsetY=void 0}linkScales(){}parse(t,e){const i=this.getDataset().data,s=this._cachedMeta;if(!1===this._parsing)s._parsed=i;else{let n,a,r=t=>+i[t];if(o(i[t])){const{key:t="value"}=this._parsing;r=e=>+M(i[e],t)}for(n=t,a=t+e;nJ(t,r,l,!0)?1:Math.max(e,e*i,s,s*i),g=(t,e,s)=>J(t,r,l,!0)?-1:Math.min(e,e*i,s,s*i),p=f(0,h,d),m=f(E,c,u),x=g(C,h,d),b=g(C+E,c,u);s=(p-x)/2,n=(m-b)/2,o=-(p+x)/2,a=-(m+b)/2}return{ratioX:s,ratioY:n,offsetX:o,offsetY:a}}(u,d,r),x=(i.width-o)/f,b=(i.height-o)/g,_=Math.max(Math.min(x,b)/2,0),y=c(this.options.radius,_),v=(y-Math.max(y*r,0))/this._getVisibleDatasetWeightTotal();this.offsetX=p*y,this.offsetY=m*y,s.total=this.calculateTotal(),this.outerRadius=y-v*this._getRingWeightOffset(this.index),this.innerRadius=Math.max(this.outerRadius-v*l,0),this.updateElements(n,0,n.length,t)}_circumference(t,e){const i=this.options,s=this._cachedMeta,n=this._getCircumference();return e&&i.animation.animateRotate||!this.chart.getDataVisibility(t)||null===s._parsed[t]||s.data[t].hidden?0:this.calculateCircumference(s._parsed[t]*n/O)}updateElements(t,e,i,s){const n="reset"===s,o=this.chart,a=o.chartArea,r=o.options.animation,l=(a.left+a.right)/2,h=(a.top+a.bottom)/2,c=n&&r.animateScale,d=c?0:this.innerRadius,u=c?0:this.outerRadius,{sharedOptions:f,includeOptions:g}=this._getSharedOptions(e,s);let p,m=this._getRotation();for(p=0;p0&&!isNaN(t)?O*(Math.abs(t)/e):0}getLabelAndValue(t){const e=this._cachedMeta,i=this.chart,s=i.data.labels||[],n=ne(e._parsed[t],i.options.locale);return{label:s[t]||"",value:n}}getMaxBorderWidth(t){let e=0;const i=this.chart;let s,n,o,a,r;if(!t)for(s=0,n=i.data.datasets.length;s{const o=t.getDatasetMeta(0).controller.getStyle(n);return{text:e,fillStyle:o.backgroundColor,strokeStyle:o.borderColor,fontColor:s,lineWidth:o.borderWidth,pointStyle:i,hidden:!t.getDataVisibility(n),index:n}}))}return[]}},onClick(t,e,i){i.chart.toggleDataVisibility(e.index),i.chart.update()}}},scales:{r:{type:"radialLinear",angleLines:{display:!1},beginAtZero:!0,grid:{circular:!0},pointLabels:{display:!1},startAngle:0}}};constructor(t,e){super(t,e),this.innerRadius=void 0,this.outerRadius=void 0}getLabelAndValue(t){const e=this._cachedMeta,i=this.chart,s=i.data.labels||[],n=ne(e._parsed[t].r,i.options.locale);return{label:s[t]||"",value:n}}parseObjectData(t,e,i,s){return ii.bind(this)(t,e,i,s)}update(t){const e=this._cachedMeta.data;this._updateRadius(),this.updateElements(e,0,e.length,t)}getMinMax(){const t=this._cachedMeta,e={min:Number.POSITIVE_INFINITY,max:Number.NEGATIVE_INFINITY};return t.data.forEach(((t,i)=>{const s=this.getParsed(i).r;!isNaN(s)&&this.chart.getDataVisibility(i)&&(se.max&&(e.max=s))})),e}_updateRadius(){const t=this.chart,e=t.chartArea,i=t.options,s=Math.min(e.right-e.left,e.bottom-e.top),n=Math.max(s/2,0),o=(n-Math.max(i.cutoutPercentage?n/100*i.cutoutPercentage:1,0))/t.getVisibleDatasetCount();this.outerRadius=n-o*this.index,this.innerRadius=this.outerRadius-o}updateElements(t,e,i,s){const n="reset"===s,o=this.chart,a=o.options.animation,r=this._cachedMeta.rScale,l=r.xCenter,h=r.yCenter,c=r.getIndexAngle(0)-.5*C;let d,u=c;const f=360/this.countVisibleElements();for(d=0;d{!isNaN(this.getParsed(i).r)&&this.chart.getDataVisibility(i)&&e++})),e}_computeAngle(t,e,i){return this.chart.getDataVisibility(t)?$(this.resolveDataElementOptions(t,e).angle||i):0}}var Un=Object.freeze({__proto__:null,BarController:class extends js{static id="bar";static defaults={datasetElementType:!1,dataElementType:"bar",categoryPercentage:.8,barPercentage:.9,grouped:!0,animations:{numbers:{type:"number",properties:["x","y","base","width","height"]}}};static overrides={scales:{_index_:{type:"category",offset:!0,grid:{offset:!0}},_value_:{type:"linear",beginAtZero:!0}}};parsePrimitiveData(t,e,i,s){return Vn(t,e,i,s)}parseArrayData(t,e,i,s){return Vn(t,e,i,s)}parseObjectData(t,e,i,s){const{iScale:n,vScale:o}=t,{xAxisKey:a="x",yAxisKey:r="y"}=this._parsing,l="x"===n.axis?a:r,h="x"===o.axis?a:r,c=[];let d,u,f,g;for(d=i,u=i+s;dt.controller.options.grouped)),o=i.options.stacked,a=[],r=this._cachedMeta.controller.getParsed(e),l=r&&r[i.axis],h=t=>{const e=t._parsed.find((t=>t[i.axis]===l)),n=e&&e[t.vScale.axis];if(s(n)||isNaN(n))return!0};for(const i of n)if((void 0===e||!h(i))&&((!1===o||-1===a.indexOf(i.stack)||void 0===o&&void 0===i.stack)&&a.push(i.stack),i.index===t))break;return a.length||a.push(void 0),a}_getStackCount(t){return this._getStacks(void 0,t).length}_getAxisCount(){return this._getAxis().length}getFirstScaleIdForIndexAxis(){const t=this.chart.scales,e=this.chart.options.indexAxis;return Object.keys(t).filter((i=>t[i].axis===e)).shift()}_getAxis(){const t={},e=this.getFirstScaleIdForIndexAxis();for(const i of this.chart.data.datasets)t[l("x"===this.chart.options.indexAxis?i.xAxisID:i.yAxisID,e)]=!0;return Object.keys(t)}_getStackIndex(t,e,i){const s=this._getStacks(t,i),n=void 0!==e?s.indexOf(e):-1;return-1===n?s.length-1:n}_getRuler(){const t=this.options,e=this._cachedMeta,i=e.iScale,s=[];let n,o;for(n=0,o=e.data.length;n=i?1:-1)}(u,e,r)*a,f===r&&(x-=u/2);const t=e.getPixelForDecimal(0),s=e.getPixelForDecimal(1),o=Math.min(t,s),h=Math.max(t,s);x=Math.max(Math.min(x,h),o),d=x+u,i&&!c&&(l._stacks[e.axis]._visualValues[n]=e.getValueForPixel(d)-e.getValueForPixel(x))}if(x===e.getPixelForValue(r)){const t=F(u)*e.getLineWidthForValue(r)/2;x+=t,u-=t}return{size:u,base:x,head:d,center:d+u/2}}_calculateBarIndexPixels(t,e){const i=e.scale,n=this.options,o=n.skipNull,a=l(n.maxBarThickness,1/0);let r,h;const c=this._getAxisCount();if(e.grouped){const i=o?this._getStackCount(t):e.stackCount,d="flex"===n.barThickness?function(t,e,i,s){const n=e.pixels,o=n[t];let a=t>0?n[t-1]:null,r=t=0;--i)e=Math.max(e,t[i].size(this.resolveDataElementOptions(i))/2);return e>0&&e}getLabelAndValue(t){const e=this._cachedMeta,i=this.chart.data.labels||[],{xScale:s,yScale:n}=e,o=this.getParsed(t),a=s.getLabelForValue(o.x),r=n.getLabelForValue(o.y),l=o._custom;return{label:i[t]||"",value:"("+a+", "+r+(l?", "+l:"")+")"}}update(t){const e=this._cachedMeta.data;this.updateElements(e,0,e.length,t)}updateElements(t,e,i,s){const n="reset"===s,{iScale:o,vScale:a}=this._cachedMeta,{sharedOptions:r,includeOptions:l}=this._getSharedOptions(e,s),h=o.axis,c=a.axis;for(let d=e;d0&&this.getParsed(e-1);for(let i=0;i<_;++i){const g=t[i],_=x?g:{};if(i=b){_.skip=!0;continue}const v=this.getParsed(i),M=s(v[f]),w=_[u]=a.getPixelForValue(v[u],i),k=_[f]=o||M?r.getBasePixel():r.getPixelForValue(l?this.applyStack(r,v,l):v[f],i);_.skip=isNaN(w)||isNaN(k)||M,_.stop=i>0&&Math.abs(v[u]-y[u])>m,p&&(_.parsed=v,_.raw=h.data[i]),d&&(_.options=c||this.resolveDataElementOptions(i,g.active?"active":n)),x||this.updateElement(g,i,_,n),y=v}}getMaxOverflow(){const t=this._cachedMeta,e=t.dataset,i=e.options&&e.options.borderWidth||0,s=t.data||[];if(!s.length)return i;const n=s[0].size(this.resolveDataElementOptions(0)),o=s[s.length-1].size(this.resolveDataElementOptions(s.length-1));return Math.max(i,n,o)/2}draw(){const t=this._cachedMeta;t.dataset.updateControlPoints(this.chart.chartArea,t.iScale.axis),super.draw()}},PieController:class extends $n{static id="pie";static defaults={cutout:0,rotation:0,circumference:360,radius:"100%"}},PolarAreaController:Yn,RadarController:class extends js{static id="radar";static defaults={datasetElementType:"line",dataElementType:"point",indexAxis:"r",showLine:!0,elements:{line:{fill:"start"}}};static overrides={aspectRatio:1,scales:{r:{type:"radialLinear"}}};getLabelAndValue(t){const e=this._cachedMeta.vScale,i=this.getParsed(t);return{label:e.getLabels()[t],value:""+e.getLabelForValue(i[e.axis])}}parseObjectData(t,e,i,s){return ii.bind(this)(t,e,i,s)}update(t){const e=this._cachedMeta,i=e.dataset,s=e.data||[],n=e.iScale.getLabels();if(i.points=s,"resize"!==t){const e=this.resolveDatasetElementOptions(t);this.options.showLine||(e.borderWidth=0);const o={_loop:!0,_fullLoop:n.length===s.length,options:e};this.updateElement(i,void 0,o,t)}this.updateElements(s,0,s.length,t)}updateElements(t,e,i,s){const n=this._cachedMeta.rScale,o="reset"===s;for(let a=e;a0&&this.getParsed(e-1);for(let c=e;c0&&Math.abs(i[f]-_[f])>x,m&&(p.parsed=i,p.raw=h.data[c]),u&&(p.options=d||this.resolveDataElementOptions(c,e.active?"active":n)),b||this.updateElement(e,c,p,n),_=i}this.updateSharedOptions(d,n,c)}getMaxOverflow(){const t=this._cachedMeta,e=t.data||[];if(!this.options.showLine){let t=0;for(let i=e.length-1;i>=0;--i)t=Math.max(t,e[i].size(this.resolveDataElementOptions(i))/2);return t>0&&t}const i=t.dataset,s=i.options&&i.options.borderWidth||0;if(!e.length)return s;const n=e[0].size(this.resolveDataElementOptions(0)),o=e[e.length-1].size(this.resolveDataElementOptions(e.length-1));return Math.max(s,n,o)/2}}});function Xn(t,e,i,s){const n=vi(t.options.borderRadius,["outerStart","outerEnd","innerStart","innerEnd"]);const o=(i-e)/2,a=Math.min(o,s*e/2),r=t=>{const e=(i-Math.min(o,t))*s/2;return Z(t,0,Math.min(o,e))};return{outerStart:r(n.outerStart),outerEnd:r(n.outerEnd),innerStart:Z(n.innerStart,0,a),innerEnd:Z(n.innerEnd,0,a)}}function qn(t,e,i,s){return{x:i+t*Math.cos(e),y:s+t*Math.sin(e)}}function Kn(t,e,i,s,n,o){const{x:a,y:r,startAngle:l,pixelMargin:h,innerRadius:c}=e,d=Math.max(e.outerRadius+s+i-h,0),u=c>0?c+s+i+h:0;let f=0;const g=n-l;if(s){const t=((c>0?c-s:0)+(d>0?d-s:0))/2;f=(g-(0!==t?g*t/(t+s):g))/2}const p=(g-Math.max(.001,g*d-i/C)/d)/2,m=l+p+f,x=n-p-f,{outerStart:b,outerEnd:_,innerStart:y,innerEnd:v}=Xn(e,u,d,x-m),M=d-b,w=d-_,k=m+b/M,S=x-_/w,P=u+y,D=u+v,O=m+y/P,A=x-v/D;if(t.beginPath(),o){const e=(k+S)/2;if(t.arc(a,r,d,k,e),t.arc(a,r,d,e,S),_>0){const e=qn(w,S,a,r);t.arc(e.x,e.y,_,S,x+E)}const i=qn(D,x,a,r);if(t.lineTo(i.x,i.y),v>0){const e=qn(D,A,a,r);t.arc(e.x,e.y,v,x+E,A+Math.PI)}const s=(x-v/u+(m+y/u))/2;if(t.arc(a,r,u,x-v/u,s,!0),t.arc(a,r,u,s,m+y/u,!0),y>0){const e=qn(P,O,a,r);t.arc(e.x,e.y,y,O+Math.PI,m-E)}const n=qn(M,m,a,r);if(t.lineTo(n.x,n.y),b>0){const e=qn(M,k,a,r);t.arc(e.x,e.y,b,m-E,k)}}else{t.moveTo(a,r);const e=Math.cos(k)*d+a,i=Math.sin(k)*d+r;t.lineTo(e,i);const s=Math.cos(S)*d+a,n=Math.sin(S)*d+r;t.lineTo(s,n)}t.closePath()}function Gn(t,e,i,s,n){const{fullCircles:o,startAngle:a,circumference:r,options:l}=e,{borderWidth:h,borderJoinStyle:c,borderDash:d,borderDashOffset:u,borderRadius:f}=l,g="inner"===l.borderAlign;if(!h)return;t.setLineDash(d||[]),t.lineDashOffset=u,g?(t.lineWidth=2*h,t.lineJoin=c||"round"):(t.lineWidth=h,t.lineJoin=c||"bevel");let p=e.endAngle;if(o){Kn(t,e,i,s,p,n);for(let e=0;en?(h=n/l,t.arc(o,a,l,i+h,s-h,!0)):t.arc(o,a,n,i+E,s-E),t.closePath(),t.clip()}(t,e,p),l.selfJoin&&p-a>=C&&0===f&&"miter"!==c&&function(t,e,i){const{startAngle:s,x:n,y:o,outerRadius:a,innerRadius:r,options:l}=e,{borderWidth:h,borderJoinStyle:c}=l,d=Math.min(h/a,G(s-i));if(t.beginPath(),t.arc(n,o,a-h/2,s+d/2,i-d/2),r>0){const e=Math.min(h/r,G(s-i));t.arc(n,o,r+h/2,i-e/2,s+e/2,!0)}else{const e=Math.min(h/2,a*G(s-i));if("round"===c)t.arc(n,o,e,i-C/2,s+C/2,!0);else if("bevel"===c){const a=2*e*e,r=-a*Math.cos(i+C/2)+n,l=-a*Math.sin(i+C/2)+o,h=a*Math.cos(s+C/2)+n,c=a*Math.sin(s+C/2)+o;t.lineTo(r,l),t.lineTo(h,c)}}t.closePath(),t.moveTo(0,0),t.rect(0,0,t.canvas.width,t.canvas.height),t.clip("evenodd")}(t,e,p),o||(Kn(t,e,i,s,p,n),t.stroke())}function Jn(t,e,i=e){t.lineCap=l(i.borderCapStyle,e.borderCapStyle),t.setLineDash(l(i.borderDash,e.borderDash)),t.lineDashOffset=l(i.borderDashOffset,e.borderDashOffset),t.lineJoin=l(i.borderJoinStyle,e.borderJoinStyle),t.lineWidth=l(i.borderWidth,e.borderWidth),t.strokeStyle=l(i.borderColor,e.borderColor)}function Zn(t,e,i){t.lineTo(i.x,i.y)}function Qn(t,e,i={}){const s=t.length,{start:n=0,end:o=s-1}=i,{start:a,end:r}=e,l=Math.max(n,a),h=Math.min(o,r),c=nr&&o>r;return{count:s,start:l,loop:e.loop,ilen:h(a+(h?r-t:t))%o,_=()=>{f!==g&&(t.lineTo(m,g),t.lineTo(m,f),t.lineTo(m,p))};for(l&&(d=n[b(0)],t.moveTo(d.x,d.y)),c=0;c<=r;++c){if(d=n[b(c)],d.skip)continue;const e=d.x,i=d.y,s=0|e;s===u?(ig&&(g=i),m=(x*m+e)/++x):(_(),t.lineTo(e,i),u=s,x=0,f=g=i),p=i}_()}function io(t){const e=t.options,i=e.borderDash&&e.borderDash.length;return!(t._decimated||t._loop||e.tension||"monotone"===e.cubicInterpolationMode||e.stepped||i)?eo:to}const so="function"==typeof Path2D;function no(t,e,i,s){so&&!e.options.segment?function(t,e,i,s){let n=e._path;n||(n=e._path=new Path2D,e.path(n,i,s)&&n.closePath()),Jn(t,e.options),t.stroke(n)}(t,e,i,s):function(t,e,i,s){const{segments:n,options:o}=e,a=io(e);for(const r of n)Jn(t,o,r.style),t.beginPath(),a(t,e,r,{start:i,end:i+s-1})&&t.closePath(),t.stroke()}(t,e,i,s)}class oo extends $s{static id="line";static defaults={borderCapStyle:"butt",borderDash:[],borderDashOffset:0,borderJoinStyle:"miter",borderWidth:3,capBezierPoints:!0,cubicInterpolationMode:"default",fill:!1,spanGaps:!1,stepped:!1,tension:0};static defaultRoutes={backgroundColor:"backgroundColor",borderColor:"borderColor"};static descriptors={_scriptable:!0,_indexable:t=>"borderDash"!==t&&"fill"!==t};constructor(t){super(),this.animated=!0,this.options=void 0,this._chart=void 0,this._loop=void 0,this._fullLoop=void 0,this._path=void 0,this._points=void 0,this._segments=void 0,this._decimated=!1,this._pointsUpdated=!1,this._datasetIndex=void 0,t&&Object.assign(this,t)}updateControlPoints(t,e){const i=this.options;if((i.tension||"monotone"===i.cubicInterpolationMode)&&!i.stepped&&!this._pointsUpdated){const s=i.spanGaps?this._loop:this._fullLoop;hi(this._points,i,t,s,e),this._pointsUpdated=!0}}set points(t){this._points=t,delete this._segments,delete this._path,this._pointsUpdated=!1}get points(){return this._points}get segments(){return this._segments||(this._segments=zi(this,this.options.segment))}first(){const t=this.segments,e=this.points;return t.length&&e[t[0].start]}last(){const t=this.segments,e=this.points,i=t.length;return i&&e[t[i-1].end]}interpolate(t,e){const i=this.options,s=t[e],n=this.points,o=Ii(this,{property:e,start:s,end:s});if(!o.length)return;const a=[],r=function(t){return t.stepped?pi:t.tension||"monotone"===t.cubicInterpolationMode?mi:gi}(i);let l,h;for(l=0,h=o.length;l"borderDash"!==t};circumference;endAngle;fullCircles;innerRadius;outerRadius;pixelMargin;startAngle;constructor(t){super(),this.options=void 0,this.circumference=void 0,this.startAngle=void 0,this.endAngle=void 0,this.innerRadius=void 0,this.outerRadius=void 0,this.pixelMargin=0,this.fullCircles=0,t&&Object.assign(this,t)}inRange(t,e,i){const s=this.getProps(["x","y"],i),{angle:n,distance:o}=X(s,{x:t,y:e}),{startAngle:a,endAngle:r,innerRadius:h,outerRadius:c,circumference:d}=this.getProps(["startAngle","endAngle","innerRadius","outerRadius","circumference"],i),u=(this.options.spacing+this.options.borderWidth)/2,f=l(d,r-a),g=J(n,a,r)&&a!==r,p=f>=O||g,m=tt(o,h+u,c+u);return p&&m}getCenterPoint(t){const{x:e,y:i,startAngle:s,endAngle:n,innerRadius:o,outerRadius:a}=this.getProps(["x","y","startAngle","endAngle","innerRadius","outerRadius"],t),{offset:r,spacing:l}=this.options,h=(s+n)/2,c=(o+a+l+r)/2;return{x:e+Math.cos(h)*c,y:i+Math.sin(h)*c}}tooltipPosition(t){return this.getCenterPoint(t)}draw(t){const{options:e,circumference:i}=this,s=(e.offset||0)/4,n=(e.spacing||0)/2,o=e.circular;if(this.pixelMargin="inner"===e.borderAlign?.33:0,this.fullCircles=i>O?Math.floor(i/O):0,0===i||this.innerRadius<0||this.outerRadius<0)return;t.save();const a=(this.startAngle+this.endAngle)/2;t.translate(Math.cos(a)*s,Math.sin(a)*s);const r=s*(1-Math.sin(Math.min(C,i||0)));t.fillStyle=e.backgroundColor,t.strokeStyle=e.borderColor,function(t,e,i,s,n){const{fullCircles:o,startAngle:a,circumference:r}=e;let l=e.endAngle;if(o){Kn(t,e,i,s,l,n);for(let e=0;e("string"==typeof e?(i=t.push(e)-1,s.unshift({index:i,label:e})):isNaN(e)&&(i=null),i))(t,e,i,s);return n!==t.lastIndexOf(e)?i:n}function mo(t){const e=this.getLabels();return t>=0&&ts=e?s:t,a=t=>n=i?n:t;if(t){const t=F(s),e=F(n);t<0&&e<0?a(0):t>0&&e>0&&o(0)}if(s===n){let e=0===n?1:Math.abs(.05*n);a(n+e),t||o(s-e)}this.min=s,this.max=n}getTickLimit(){const t=this.options.ticks;let e,{maxTicksLimit:i,stepSize:s}=t;return s?(e=Math.ceil(this.max/s)-Math.floor(this.min/s)+1,e>1e3&&(console.warn(`scales.${this.id}.ticks.stepSize: ${s} would result generating up to ${e} ticks. Limiting to 1000.`),e=1e3)):(e=this.computeTickLimit(),i=i||11),i&&(e=Math.min(i,e)),e}computeTickLimit(){return Number.POSITIVE_INFINITY}buildTicks(){const t=this.options,e=t.ticks;let i=this.getTickLimit();i=Math.max(2,i);const n=function(t,e){const i=[],{bounds:n,step:o,min:a,max:r,precision:l,count:h,maxTicks:c,maxDigits:d,includeBounds:u}=t,f=o||1,g=c-1,{min:p,max:m}=e,x=!s(a),b=!s(r),_=!s(h),y=(m-p)/(d+1);let v,M,w,k,S=B((m-p)/g/f)*f;if(S<1e-14&&!x&&!b)return[{value:p},{value:m}];k=Math.ceil(m/S)-Math.floor(p/S),k>g&&(S=B(k*S/g/f)*f),s(l)||(v=Math.pow(10,l),S=Math.ceil(S*v)/v),"ticks"===n?(M=Math.floor(p/S)*S,w=Math.ceil(m/S)*S):(M=p,w=m),x&&b&&o&&H((r-a)/o,S/1e3)?(k=Math.round(Math.min((r-a)/S,c)),S=(r-a)/k,M=a,w=r):_?(M=x?a:M,w=b?r:w,k=h-1,S=(w-M)/k):(k=(w-M)/S,k=V(k,Math.round(k),S/1e3)?Math.round(k):Math.ceil(k));const P=Math.max(U(S),U(M));v=Math.pow(10,s(l)?P:l),M=Math.round(M*v)/v,w=Math.round(w*v)/v;let D=0;for(x&&(u&&M!==a?(i.push({value:a}),Mr)break;i.push({value:t})}return b&&u&&w!==r?i.length&&V(i[i.length-1].value,r,xo(r,y,t))?i[i.length-1].value=r:i.push({value:r}):b&&w!==r||i.push({value:w}),i}({maxTicks:i,bounds:t.bounds,min:t.min,max:t.max,precision:e.precision,step:e.stepSize,count:e.count,maxDigits:this._maxDigits(),horizontal:this.isHorizontal(),minRotation:e.minRotation||0,includeBounds:!1!==e.includeBounds},this._range||this);return"ticks"===t.bounds&&j(n,this,"value"),t.reverse?(n.reverse(),this.start=this.max,this.end=this.min):(this.start=this.min,this.end=this.max),n}configure(){const t=this.ticks;let e=this.min,i=this.max;if(super.configure(),this.options.offset&&t.length){const s=(i-e)/Math.max(t.length-1,1)/2;e-=s,i+=s}this._startValue=e,this._endValue=i,this._valueRange=i-e}getLabelForValue(t){return ne(t,this.chart.options.locale,this.options.ticks.format)}}class _o extends bo{static id="linear";static defaults={ticks:{callback:ae.formatters.numeric}};determineDataLimits(){const{min:t,max:e}=this.getMinMax(!0);this.min=a(t)?t:0,this.max=a(e)?e:1,this.handleTickRangeOptions()}computeTickLimit(){const t=this.isHorizontal(),e=t?this.width:this.height,i=$(this.options.ticks.minRotation),s=(t?Math.sin(i):Math.cos(i))||.001,n=this._resolveTickFontOptions(0);return Math.ceil(e/Math.min(40,n.lineHeight/s))}getPixelForValue(t){return null===t?NaN:this.getPixelForDecimal((t-this._startValue)/this._valueRange)}getValueForPixel(t){return this._startValue+this.getDecimalForPixel(t)*this._valueRange}}const yo=t=>Math.floor(z(t)),vo=(t,e)=>Math.pow(10,yo(t)+e);function Mo(t){return 1===t/Math.pow(10,yo(t))}function wo(t,e,i){const s=Math.pow(10,i),n=Math.floor(t/s);return Math.ceil(e/s)-n}function ko(t,{min:e,max:i}){e=r(t.min,e);const s=[],n=yo(e);let o=function(t,e){let i=yo(e-t);for(;wo(t,e,i)>10;)i++;for(;wo(t,e,i)<10;)i--;return Math.min(i,yo(t))}(e,i),a=o<0?Math.pow(10,Math.abs(o)):1;const l=Math.pow(10,o),h=n>o?Math.pow(10,n):0,c=Math.round((e-h)*a)/a,d=Math.floor((e-h)/l/10)*l*10;let u=Math.floor((c-d)/Math.pow(10,o)),f=r(t.min,Math.round((h+d+u*Math.pow(10,o))*a)/a);for(;f=10?u=u<15?15:20:u++,u>=20&&(o++,u=2,a=o>=0?1:a),f=Math.round((h+d+u*Math.pow(10,o))*a)/a;const g=r(t.max,f);return s.push({value:g,major:Mo(g),significand:u}),s}class So extends tn{static id="logarithmic";static defaults={ticks:{callback:ae.formatters.logarithmic,major:{enabled:!0}}};constructor(t){super(t),this.start=void 0,this.end=void 0,this._startValue=void 0,this._valueRange=0}parse(t,e){const i=bo.prototype.parse.apply(this,[t,e]);if(0!==i)return a(i)&&i>0?i:null;this._zero=!0}determineDataLimits(){const{min:t,max:e}=this.getMinMax(!0);this.min=a(t)?Math.max(0,t):null,this.max=a(e)?Math.max(0,e):null,this.options.beginAtZero&&(this._zero=!0),this._zero&&this.min!==this._suggestedMin&&!a(this._userMin)&&(this.min=t===vo(this.min,0)?vo(this.min,-1):vo(this.min,0)),this.handleTickRangeOptions()}handleTickRangeOptions(){const{minDefined:t,maxDefined:e}=this.getUserBounds();let i=this.min,s=this.max;const n=e=>i=t?i:e,o=t=>s=e?s:t;i===s&&(i<=0?(n(1),o(10)):(n(vo(i,-1)),o(vo(s,1)))),i<=0&&n(vo(s,-1)),s<=0&&o(vo(i,1)),this.min=i,this.max=s}buildTicks(){const t=this.options,e=ko({min:this._userMin,max:this._userMax},this);return"ticks"===t.bounds&&j(e,this,"value"),t.reverse?(e.reverse(),this.start=this.max,this.end=this.min):(this.start=this.min,this.end=this.max),e}getLabelForValue(t){return void 0===t?"0":ne(t,this.chart.options.locale,this.options.ticks.format)}configure(){const t=this.min;super.configure(),this._startValue=z(t),this._valueRange=z(this.max)-z(t)}getPixelForValue(t){return void 0!==t&&0!==t||(t=this.min),null===t||isNaN(t)?NaN:this.getPixelForDecimal(t===this.min?0:(z(t)-this._startValue)/this._valueRange)}getValueForPixel(t){const e=this.getDecimalForPixel(t);return Math.pow(10,this._startValue+e*this._valueRange)}}function Po(t){const e=t.ticks;if(e.display&&t.display){const t=ki(e.backdropPadding);return l(e.font&&e.font.size,ue.font.size)+t.height}return 0}function Do(t,e,i,s,n){return t===s||t===n?{start:e-i/2,end:e+i/2}:tn?{start:e-i,end:e}:{start:e,end:e+i}}function Co(t){const e={l:t.left+t._padding.left,r:t.right-t._padding.right,t:t.top+t._padding.top,b:t.bottom-t._padding.bottom},i=Object.assign({},e),s=[],o=[],a=t._pointLabels.length,r=t.options.pointLabels,l=r.centerPointLabels?C/a:0;for(let u=0;ue.r&&(r=(s.end-e.r)/o,t.r=Math.max(t.r,e.r+r)),n.starte.b&&(l=(n.end-e.b)/a,t.b=Math.max(t.b,e.b+l))}function Ao(t,e,i){const s=t.drawingArea,{extra:n,additionalAngle:o,padding:a,size:r}=i,l=t.getPointPosition(e,s+n+a,o),h=Math.round(Y(G(l.angle+E))),c=function(t,e,i){90===i||270===i?t-=e/2:(i>270||i<90)&&(t-=e);return t}(l.y,r.h,h),d=function(t){if(0===t||180===t)return"center";if(t<180)return"left";return"right"}(h),u=function(t,e,i){"right"===i?t-=e:"center"===i&&(t-=e/2);return t}(l.x,r.w,d);return{visible:!0,x:l.x,y:c,textAlign:d,left:u,top:c,right:u+r.w,bottom:c+r.h}}function To(t,e){if(!e)return!0;const{left:i,top:s,right:n,bottom:o}=t;return!(Re({x:i,y:s},e)||Re({x:i,y:o},e)||Re({x:n,y:s},e)||Re({x:n,y:o},e))}function Lo(t,e,i){const{left:n,top:o,right:a,bottom:r}=i,{backdropColor:l}=e;if(!s(l)){const i=wi(e.borderRadius),s=ki(e.backdropPadding);t.fillStyle=l;const h=n-s.left,c=o-s.top,d=a-n+s.width,u=r-o+s.height;Object.values(i).some((t=>0!==t))?(t.beginPath(),He(t,{x:h,y:c,w:d,h:u,radius:i}),t.fill()):t.fillRect(h,c,d,u)}}function Eo(t,e,i,s){const{ctx:n}=t;if(i)n.arc(t.xCenter,t.yCenter,e,0,O);else{let i=t.getPointPosition(0,e);n.moveTo(i.x,i.y);for(let o=1;ot,padding:5,centerPointLabels:!1}};static defaultRoutes={"angleLines.color":"borderColor","pointLabels.color":"color","ticks.color":"color"};static descriptors={angleLines:{_fallback:"grid"}};constructor(t){super(t),this.xCenter=void 0,this.yCenter=void 0,this.drawingArea=void 0,this._pointLabels=[],this._pointLabelItems=[]}setDimensions(){const t=this._padding=ki(Po(this.options)/2),e=this.width=this.maxWidth-t.width,i=this.height=this.maxHeight-t.height;this.xCenter=Math.floor(this.left+e/2+t.left),this.yCenter=Math.floor(this.top+i/2+t.top),this.drawingArea=Math.floor(Math.min(e,i)/2)}determineDataLimits(){const{min:t,max:e}=this.getMinMax(!1);this.min=a(t)&&!isNaN(t)?t:0,this.max=a(e)&&!isNaN(e)?e:0,this.handleTickRangeOptions()}computeTickLimit(){return Math.ceil(this.drawingArea/Po(this.options))}generateTickLabels(t){bo.prototype.generateTickLabels.call(this,t),this._pointLabels=this.getLabels().map(((t,e)=>{const i=d(this.options.pointLabels.callback,[t,e],this);return i||0===i?i:""})).filter(((t,e)=>this.chart.getDataVisibility(e)))}fit(){const t=this.options;t.display&&t.pointLabels.display?Co(this):this.setCenterPoint(0,0,0,0)}setCenterPoint(t,e,i,s){this.xCenter+=Math.floor((t-e)/2),this.yCenter+=Math.floor((i-s)/2),this.drawingArea-=Math.min(this.drawingArea/2,Math.max(t,e,i,s))}getIndexAngle(t){return G(t*(O/(this._pointLabels.length||1))+$(this.options.startAngle||0))}getDistanceFromCenterForValue(t){if(s(t))return NaN;const e=this.drawingArea/(this.max-this.min);return this.options.reverse?(this.max-t)*e:(t-this.min)*e}getValueForDistanceFromCenter(t){if(s(t))return NaN;const e=t/(this.drawingArea/(this.max-this.min));return this.options.reverse?this.max-e:this.min+e}getPointLabelContext(t){const e=this._pointLabels||[];if(t>=0&&t=0;n--){const e=t._pointLabelItems[n];if(!e.visible)continue;const o=s.setContext(t.getPointLabelContext(n));Lo(i,o,e);const a=Si(o.font),{x:r,y:l,textAlign:h}=e;Ne(i,t._pointLabels[n],r,l+a.lineHeight/2,a,{color:o.color,textAlign:h,textBaseline:"middle"})}}(this,o),s.display&&this.ticks.forEach(((t,e)=>{if(0!==e||0===e&&this.min<0){r=this.getDistanceFromCenterForValue(t.value);const i=this.getContext(e),a=s.setContext(i),l=n.setContext(i);!function(t,e,i,s,n){const o=t.ctx,a=e.circular,{color:r,lineWidth:l}=e;!a&&!s||!r||!l||i<0||(o.save(),o.strokeStyle=r,o.lineWidth=l,o.setLineDash(n.dash||[]),o.lineDashOffset=n.dashOffset,o.beginPath(),Eo(t,i,a,s),o.closePath(),o.stroke(),o.restore())}(this,a,r,o,l)}})),i.display){for(t.save(),a=o-1;a>=0;a--){const s=i.setContext(this.getPointLabelContext(a)),{color:n,lineWidth:o}=s;o&&n&&(t.lineWidth=o,t.strokeStyle=n,t.setLineDash(s.borderDash),t.lineDashOffset=s.borderDashOffset,r=this.getDistanceFromCenterForValue(e.reverse?this.min:this.max),l=this.getPointPosition(a,r),t.beginPath(),t.moveTo(this.xCenter,this.yCenter),t.lineTo(l.x,l.y),t.stroke())}t.restore()}}drawBorder(){}drawLabels(){const t=this.ctx,e=this.options,i=e.ticks;if(!i.display)return;const s=this.getIndexAngle(0);let n,o;t.save(),t.translate(this.xCenter,this.yCenter),t.rotate(s),t.textAlign="center",t.textBaseline="middle",this.ticks.forEach(((s,a)=>{if(0===a&&this.min>=0&&!e.reverse)return;const r=i.setContext(this.getContext(a)),l=Si(r.font);if(n=this.getDistanceFromCenterForValue(this.ticks[a].value),r.showLabelBackdrop){t.font=l.string,o=t.measureText(s.label).width,t.fillStyle=r.backdropColor;const e=ki(r.backdropPadding);t.fillRect(-o/2-e.left,-n-l.size/2-e.top,o+e.width,l.size+e.height)}Ne(t,s.label,0,-n,l,{color:r.color,strokeColor:r.textStrokeColor,strokeWidth:r.textStrokeWidth})})),t.restore()}drawTitle(){}}const Io={millisecond:{common:!0,size:1,steps:1e3},second:{common:!0,size:1e3,steps:60},minute:{common:!0,size:6e4,steps:60},hour:{common:!0,size:36e5,steps:24},day:{common:!0,size:864e5,steps:30},week:{common:!1,size:6048e5,steps:4},month:{common:!0,size:2628e6,steps:12},quarter:{common:!1,size:7884e6,steps:4},year:{common:!0,size:3154e7}},zo=Object.keys(Io);function Fo(t,e){return t-e}function Vo(t,e){if(s(e))return null;const i=t._adapter,{parser:n,round:o,isoWeekday:r}=t._parseOpts;let l=e;return"function"==typeof n&&(l=n(l)),a(l)||(l="string"==typeof n?i.parse(l,n):i.parse(l)),null===l?null:(o&&(l="week"!==o||!N(r)&&!0!==r?i.startOf(l,o):i.startOf(l,"isoWeek",r)),+l)}function Bo(t,e,i,s){const n=zo.length;for(let o=zo.indexOf(t);o=e?i[s]:i[n]]=!0}}else t[e]=!0}function No(t,e,i){const s=[],n={},o=e.length;let a,r;for(a=0;a=0&&(e[l].major=!0);return e}(t,s,n,i):s}class Ho extends tn{static id="time";static defaults={bounds:"data",adapters:{},time:{parser:!1,unit:!1,round:!1,isoWeekday:!1,minUnit:"millisecond",displayFormats:{}},ticks:{source:"auto",callback:!1,major:{enabled:!1}}};constructor(t){super(t),this._cache={data:[],labels:[],all:[]},this._unit="day",this._majorUnit=void 0,this._offsets={},this._normalized=!1,this._parseOpts=void 0}init(t,e={}){const i=t.time||(t.time={}),s=this._adapter=new In._date(t.adapters.date);s.init(e),b(i.displayFormats,s.formats()),this._parseOpts={parser:i.parser,round:i.round,isoWeekday:i.isoWeekday},super.init(t),this._normalized=e.normalized}parse(t,e){return void 0===t?null:Vo(this,t)}beforeLayout(){super.beforeLayout(),this._cache={data:[],labels:[],all:[]}}determineDataLimits(){const t=this.options,e=this._adapter,i=t.time.unit||"day";let{min:s,max:n,minDefined:o,maxDefined:r}=this.getUserBounds();function l(t){o||isNaN(t.min)||(s=Math.min(s,t.min)),r||isNaN(t.max)||(n=Math.max(n,t.max))}o&&r||(l(this._getLabelBounds()),"ticks"===t.bounds&&"labels"===t.ticks.source||l(this.getMinMax(!1))),s=a(s)&&!isNaN(s)?s:+e.startOf(Date.now(),i),n=a(n)&&!isNaN(n)?n:+e.endOf(Date.now(),i)+1,this.min=Math.min(s,n-1),this.max=Math.max(s+1,n)}_getLabelBounds(){const t=this.getLabelTimestamps();let e=Number.POSITIVE_INFINITY,i=Number.NEGATIVE_INFINITY;return t.length&&(e=t[0],i=t[t.length-1]),{min:e,max:i}}buildTicks(){const t=this.options,e=t.time,i=t.ticks,s="labels"===i.source?this.getLabelTimestamps():this._generate();"ticks"===t.bounds&&s.length&&(this.min=this._userMin||s[0],this.max=this._userMax||s[s.length-1]);const n=this.min,o=nt(s,n,this.max);return this._unit=e.unit||(i.autoSkip?Bo(e.minUnit,this.min,this.max,this._getLabelCapacity(n)):function(t,e,i,s,n){for(let o=zo.length-1;o>=zo.indexOf(i);o--){const i=zo[o];if(Io[i].common&&t._adapter.diff(n,s,i)>=e-1)return i}return zo[i?zo.indexOf(i):0]}(this,o.length,e.minUnit,this.min,this.max)),this._majorUnit=i.major.enabled&&"year"!==this._unit?function(t){for(let e=zo.indexOf(t)+1,i=zo.length;e+t.value)))}initOffsets(t=[]){let e,i,s=0,n=0;this.options.offset&&t.length&&(e=this.getDecimalForValue(t[0]),s=1===t.length?1-e:(this.getDecimalForValue(t[1])-e)/2,i=this.getDecimalForValue(t[t.length-1]),n=1===t.length?i:(i-this.getDecimalForValue(t[t.length-2]))/2);const o=t.length<3?.5:.25;s=Z(s,0,o),n=Z(n,0,o),this._offsets={start:s,end:n,factor:1/(s+1+n)}}_generate(){const t=this._adapter,e=this.min,i=this.max,s=this.options,n=s.time,o=n.unit||Bo(n.minUnit,e,i,this._getLabelCapacity(e)),a=l(s.ticks.stepSize,1),r="week"===o&&n.isoWeekday,h=N(r)||!0===r,c={};let d,u,f=e;if(h&&(f=+t.startOf(f,"isoWeek",r)),f=+t.startOf(f,h?"day":o),t.diff(i,e,o)>1e5*a)throw new Error(e+" and "+i+" are too far apart with stepSize of "+a+" "+o);const g="data"===s.ticks.source&&this.getDataTimestamps();for(d=f,u=0;d+t))}getLabelForValue(t){const e=this._adapter,i=this.options.time;return i.tooltipFormat?e.format(t,i.tooltipFormat):e.format(t,i.displayFormats.datetime)}format(t,e){const i=this.options.time.displayFormats,s=this._unit,n=e||i[s];return this._adapter.format(t,n)}_tickFormatFunction(t,e,i,s){const n=this.options,o=n.ticks.callback;if(o)return d(o,[t,e,i],this);const a=n.time.displayFormats,r=this._unit,l=this._majorUnit,h=r&&a[r],c=l&&a[l],u=i[e],f=l&&c&&u&&u.major;return this._adapter.format(t,s||(f?c:h))}generateTickLabels(t){let e,i,s;for(e=0,i=t.length;e0?a:1}getDataTimestamps(){let t,e,i=this._cache.data||[];if(i.length)return i;const s=this.getMatchingVisibleMetas();if(this._normalized&&s.length)return this._cache.data=s[0].controller.getAllParsedValues(this);for(t=0,e=s.length;t=t[r].pos&&e<=t[l].pos&&({lo:r,hi:l}=it(t,"pos",e)),({pos:s,time:o}=t[r]),({pos:n,time:a}=t[l])):(e>=t[r].time&&e<=t[l].time&&({lo:r,hi:l}=it(t,"time",e)),({time:s,pos:o}=t[r]),({time:n,pos:a}=t[l]));const h=n-s;return h?o+(a-o)*(e-s)/h:o}var $o=Object.freeze({__proto__:null,CategoryScale:class extends tn{static id="category";static defaults={ticks:{callback:mo}};constructor(t){super(t),this._startValue=void 0,this._valueRange=0,this._addedLabels=[]}init(t){const e=this._addedLabels;if(e.length){const t=this.getLabels();for(const{index:i,label:s}of e)t[i]===s&&t.splice(i,1);this._addedLabels=[]}super.init(t)}parse(t,e){if(s(t))return null;const i=this.getLabels();return((t,e)=>null===t?null:Z(Math.round(t),0,e))(e=isFinite(e)&&i[e]===t?e:po(i,t,l(e,t),this._addedLabels),i.length-1)}determineDataLimits(){const{minDefined:t,maxDefined:e}=this.getUserBounds();let{min:i,max:s}=this.getMinMax(!0);"ticks"===this.options.bounds&&(t||(i=0),e||(s=this.getLabels().length-1)),this.min=i,this.max=s}buildTicks(){const t=this.min,e=this.max,i=this.options.offset,s=[];let n=this.getLabels();n=0===t&&e===n.length-1?n:n.slice(t,e+1),this._valueRange=Math.max(n.length-(i?0:1),1),this._startValue=this.min-(i?.5:0);for(let i=t;i<=e;i++)s.push({value:i});return s}getLabelForValue(t){return mo.call(this,t)}configure(){super.configure(),this.isHorizontal()||(this._reversePixels=!this._reversePixels)}getPixelForValue(t){return"number"!=typeof t&&(t=this.parse(t)),null===t?NaN:this.getPixelForDecimal((t-this._startValue)/this._valueRange)}getPixelForTick(t){const e=this.ticks;return t<0||t>e.length-1?null:this.getPixelForValue(e[t].value)}getValueForPixel(t){return Math.round(this._startValue+this.getDecimalForPixel(t)*this._valueRange)}getBasePixel(){return this.bottom}},LinearScale:_o,LogarithmicScale:So,RadialLinearScale:Ro,TimeScale:Ho,TimeSeriesScale:class extends Ho{static id="timeseries";static defaults=Ho.defaults;constructor(t){super(t),this._table=[],this._minPos=void 0,this._tableRange=void 0}initOffsets(){const t=this._getTimestampsForTable(),e=this._table=this.buildLookupTable(t);this._minPos=jo(e,this.min),this._tableRange=jo(e,this.max)-this._minPos,super.initOffsets(t)}buildLookupTable(t){const{min:e,max:i}=this,s=[],n=[];let o,a,r,l,h;for(o=0,a=t.length;o=e&&l<=i&&s.push(l);if(s.length<2)return[{time:e,pos:0},{time:i,pos:1}];for(o=0,a=s.length;ot-e))}_getTimestampsForTable(){let t=this._cache.all||[];if(t.length)return t;const e=this.getDataTimestamps(),i=this.getLabelTimestamps();return t=e.length&&i.length?this.normalize(e.concat(i)):e.length?e:i,t=this._cache.all=t,t}getDecimalForValue(t){return(jo(this._table,t)-this._minPos)/this._tableRange}getValueForPixel(t){const e=this._offsets,i=this.getDecimalForPixel(t)/e.factor-e.end;return jo(this._table,i*this._tableRange+this._minPos,!0)}}});const Yo=["rgb(54, 162, 235)","rgb(255, 99, 132)","rgb(255, 159, 64)","rgb(255, 205, 86)","rgb(75, 192, 192)","rgb(153, 102, 255)","rgb(201, 203, 207)"],Uo=Yo.map((t=>t.replace("rgb(","rgba(").replace(")",", 0.5)")));function Xo(t){return Yo[t%Yo.length]}function qo(t){return Uo[t%Uo.length]}function Ko(t){let e=0;return(i,s)=>{const n=t.getDatasetMeta(s).controller;n instanceof $n?e=function(t,e){return t.backgroundColor=t.data.map((()=>Xo(e++))),e}(i,e):n instanceof Yn?e=function(t,e){return t.backgroundColor=t.data.map((()=>qo(e++))),e}(i,e):n&&(e=function(t,e){return t.borderColor=Xo(e),t.backgroundColor=qo(e),++e}(i,e))}}function Go(t){let e;for(e in t)if(t[e].borderColor||t[e].backgroundColor)return!0;return!1}var Jo={id:"colors",defaults:{enabled:!0,forceOverride:!1},beforeLayout(t,e,i){if(!i.enabled)return;const{data:{datasets:s},options:n}=t.config,{elements:o}=n,a=Go(s)||(r=n)&&(r.borderColor||r.backgroundColor)||o&&Go(o)||"rgba(0,0,0,0.1)"!==ue.borderColor||"rgba(0,0,0,0.1)"!==ue.backgroundColor;var r;if(!i.forceOverride&&a)return;const l=Ko(t);s.forEach(l)}};function Zo(t){if(t._decimated){const e=t._data;delete t._decimated,delete t._data,Object.defineProperty(t,"data",{configurable:!0,enumerable:!0,writable:!0,value:e})}}function Qo(t){t.data.datasets.forEach((t=>{Zo(t)}))}var ta={id:"decimation",defaults:{algorithm:"min-max",enabled:!1},beforeElementsUpdate:(t,e,i)=>{if(!i.enabled)return void Qo(t);const n=t.width;t.data.datasets.forEach(((e,o)=>{const{_data:a,indexAxis:r}=e,l=t.getDatasetMeta(o),h=a||e.data;if("y"===Pi([r,t.options.indexAxis]))return;if(!l.controller.supportsDecimation)return;const c=t.scales[l.xAxisID];if("linear"!==c.type&&"time"!==c.type)return;if(t.options.parsing)return;let{start:d,count:u}=function(t,e){const i=e.length;let s,n=0;const{iScale:o}=t,{min:a,max:r,minDefined:l,maxDefined:h}=o.getUserBounds();return l&&(n=Z(it(e,o.axis,a).lo,0,i-1)),s=h?Z(it(e,o.axis,r).hi+1,n,i)-n:i-n,{start:n,count:s}}(l,h);if(u<=(i.threshold||4*n))return void Zo(e);let f;switch(s(a)&&(e._data=h,delete e.data,Object.defineProperty(e,"data",{configurable:!0,enumerable:!0,get:function(){return this._decimated},set:function(t){this._data=t}})),i.algorithm){case"lttb":f=function(t,e,i,s,n){const o=n.samples||s;if(o>=i)return t.slice(e,e+i);const a=[],r=(i-2)/(o-2);let l=0;const h=e+i-1;let c,d,u,f,g,p=e;for(a[l++]=t[p],c=0;cu&&(u=f,d=t[s],g=s);a[l++]=d,p=g}return a[l++]=t[h],a}(h,d,u,n,i);break;case"min-max":f=function(t,e,i,n){let o,a,r,l,h,c,d,u,f,g,p=0,m=0;const x=[],b=e+i-1,_=t[e].x,y=t[b].x-_;for(o=e;og&&(g=l,d=o),p=(m*p+a.x)/++m;else{const i=o-1;if(!s(c)&&!s(d)){const e=Math.min(c,d),s=Math.max(c,d);e!==u&&e!==i&&x.push({...t[e],x:p}),s!==u&&s!==i&&x.push({...t[s],x:p})}o>0&&i!==u&&x.push(t[i]),x.push(a),h=e,m=0,f=g=l,c=d=u=o}}return x}(h,d,u,n);break;default:throw new Error(`Unsupported decimation algorithm '${i.algorithm}'`)}e._decimated=f}))},destroy(t){Qo(t)}};function ea(t,e,i,s){if(s)return;let n=e[t],o=i[t];return"angle"===t&&(n=G(n),o=G(o)),{property:t,start:n,end:o}}function ia(t,e,i){for(;e>t;e--){const t=i[e];if(!isNaN(t.x)&&!isNaN(t.y))break}return e}function sa(t,e,i,s){return t&&e?s(t[i],e[i]):t?t[i]:e?e[i]:0}function na(t,e){let i=[],s=!1;return n(t)?(s=!0,i=t):i=function(t,e){const{x:i=null,y:s=null}=t||{},n=e.points,o=[];return e.segments.forEach((({start:t,end:e})=>{e=ia(t,e,n);const a=n[t],r=n[e];null!==s?(o.push({x:a.x,y:s}),o.push({x:r.x,y:s})):null!==i&&(o.push({x:i,y:a.y}),o.push({x:i,y:r.y}))})),o}(t,e),i.length?new oo({points:i,options:{tension:0},_loop:s,_fullLoop:s}):null}function oa(t){return t&&!1!==t.fill}function aa(t,e,i){let s=t[e].fill;const n=[e];let o;if(!i)return s;for(;!1!==s&&-1===n.indexOf(s);){if(!a(s))return s;if(o=t[s],!o)return!1;if(o.visible)return s;n.push(s),s=o.fill}return!1}function ra(t,e,i){const s=function(t){const e=t.options,i=e.fill;let s=l(i&&i.target,i);void 0===s&&(s=!!e.backgroundColor);if(!1===s||null===s)return!1;if(!0===s)return"origin";return s}(t);if(o(s))return!isNaN(s.value)&&s;let n=parseFloat(s);return a(n)&&Math.floor(n)===n?function(t,e,i,s){"-"!==t&&"+"!==t||(i=e+i);if(i===e||i<0||i>=s)return!1;return i}(s[0],e,n,i):["origin","start","end","stack","shape"].indexOf(s)>=0&&s}function la(t,e,i){const s=[];for(let n=0;n=0;--e){const i=n[e].$filler;i&&(i.line.updateControlPoints(o,i.axis),s&&i.fill&&ua(t.ctx,i,o))}},beforeDatasetsDraw(t,e,i){if("beforeDatasetsDraw"!==i.drawTime)return;const s=t.getSortedVisibleDatasetMetas();for(let e=s.length-1;e>=0;--e){const i=s[e].$filler;oa(i)&&ua(t.ctx,i,t.chartArea)}},beforeDatasetDraw(t,e,i){const s=e.meta.$filler;oa(s)&&"beforeDatasetDraw"===i.drawTime&&ua(t.ctx,s,t.chartArea)},defaults:{propagate:!0,drawTime:"beforeDatasetDraw"}};const _a=(t,e)=>{let{boxHeight:i=e,boxWidth:s=e}=t;return t.usePointStyle&&(i=Math.min(i,e),s=t.pointStyleWidth||Math.min(s,e)),{boxWidth:s,boxHeight:i,itemHeight:Math.max(e,i)}};class ya extends $s{constructor(t){super(),this._added=!1,this.legendHitBoxes=[],this._hoveredItem=null,this.doughnutMode=!1,this.chart=t.chart,this.options=t.options,this.ctx=t.ctx,this.legendItems=void 0,this.columnSizes=void 0,this.lineWidths=void 0,this.maxHeight=void 0,this.maxWidth=void 0,this.top=void 0,this.bottom=void 0,this.left=void 0,this.right=void 0,this.height=void 0,this.width=void 0,this._margins=void 0,this.position=void 0,this.weight=void 0,this.fullSize=void 0}update(t,e,i){this.maxWidth=t,this.maxHeight=e,this._margins=i,this.setDimensions(),this.buildLabels(),this.fit()}setDimensions(){this.isHorizontal()?(this.width=this.maxWidth,this.left=this._margins.left,this.right=this.width):(this.height=this.maxHeight,this.top=this._margins.top,this.bottom=this.height)}buildLabels(){const t=this.options.labels||{};let e=d(t.generateLabels,[this.chart],this)||[];t.filter&&(e=e.filter((e=>t.filter(e,this.chart.data)))),t.sort&&(e=e.sort(((e,i)=>t.sort(e,i,this.chart.data)))),this.options.reverse&&e.reverse(),this.legendItems=e}fit(){const{options:t,ctx:e}=this;if(!t.display)return void(this.width=this.height=0);const i=t.labels,s=Si(i.font),n=s.size,o=this._computeTitleHeight(),{boxWidth:a,itemHeight:r}=_a(i,n);let l,h;e.font=s.string,this.isHorizontal()?(l=this.maxWidth,h=this._fitRows(o,n,a,r)+10):(h=this.maxHeight,l=this._fitCols(o,s,a,r)+10),this.width=Math.min(l,t.maxWidth||this.maxWidth),this.height=Math.min(h,t.maxHeight||this.maxHeight)}_fitRows(t,e,i,s){const{ctx:n,maxWidth:o,options:{labels:{padding:a}}}=this,r=this.legendHitBoxes=[],l=this.lineWidths=[0],h=s+a;let c=t;n.textAlign="left",n.textBaseline="middle";let d=-1,u=-h;return this.legendItems.forEach(((t,f)=>{const g=i+e/2+n.measureText(t.text).width;(0===f||l[l.length-1]+g+2*a>o)&&(c+=h,l[l.length-(f>0?0:1)]=0,u+=h,d++),r[f]={left:0,top:u,row:d,width:g,height:s},l[l.length-1]+=g+a})),c}_fitCols(t,e,i,s){const{ctx:n,maxHeight:o,options:{labels:{padding:a}}}=this,r=this.legendHitBoxes=[],l=this.columnSizes=[],h=o-t;let c=a,d=0,u=0,f=0,g=0;return this.legendItems.forEach(((t,o)=>{const{itemWidth:p,itemHeight:m}=function(t,e,i,s,n){const o=function(t,e,i,s){let n=t.text;n&&"string"!=typeof n&&(n=n.reduce(((t,e)=>t.length>e.length?t:e)));return e+i.size/2+s.measureText(n).width}(s,t,e,i),a=function(t,e,i){let s=t;"string"!=typeof e.text&&(s=va(e,i));return s}(n,s,e.lineHeight);return{itemWidth:o,itemHeight:a}}(i,e,n,t,s);o>0&&u+m+2*a>h&&(c+=d+a,l.push({width:d,height:u}),f+=d+a,g++,d=u=0),r[o]={left:f,top:u,col:g,width:p,height:m},d=Math.max(d,p),u+=m+a})),c+=d,l.push({width:d,height:u}),c}adjustHitBoxes(){if(!this.options.display)return;const t=this._computeTitleHeight(),{legendHitBoxes:e,options:{align:i,labels:{padding:s},rtl:n}}=this,o=Oi(n,this.left,this.width);if(this.isHorizontal()){let n=0,a=ft(i,this.left+s,this.right-this.lineWidths[n]);for(const r of e)n!==r.row&&(n=r.row,a=ft(i,this.left+s,this.right-this.lineWidths[n])),r.top+=this.top+t+s,r.left=o.leftForLtr(o.x(a),r.width),a+=r.width+s}else{let n=0,a=ft(i,this.top+t+s,this.bottom-this.columnSizes[n].height);for(const r of e)r.col!==n&&(n=r.col,a=ft(i,this.top+t+s,this.bottom-this.columnSizes[n].height)),r.top=a,r.left+=this.left+s,r.left=o.leftForLtr(o.x(r.left),r.width),a+=r.height+s}}isHorizontal(){return"top"===this.options.position||"bottom"===this.options.position}draw(){if(this.options.display){const t=this.ctx;Ie(t,this),this._draw(),ze(t)}}_draw(){const{options:t,columnSizes:e,lineWidths:i,ctx:s}=this,{align:n,labels:o}=t,a=ue.color,r=Oi(t.rtl,this.left,this.width),h=Si(o.font),{padding:c}=o,d=h.size,u=d/2;let f;this.drawTitle(),s.textAlign=r.textAlign("left"),s.textBaseline="middle",s.lineWidth=.5,s.font=h.string;const{boxWidth:g,boxHeight:p,itemHeight:m}=_a(o,d),x=this.isHorizontal(),b=this._computeTitleHeight();f=x?{x:ft(n,this.left+c,this.right-i[0]),y:this.top+c+b,line:0}:{x:this.left+c,y:ft(n,this.top+b+c,this.bottom-e[0].height),line:0},Ai(this.ctx,t.textDirection);const _=m+c;this.legendItems.forEach(((y,v)=>{s.strokeStyle=y.fontColor,s.fillStyle=y.fontColor;const M=s.measureText(y.text).width,w=r.textAlign(y.textAlign||(y.textAlign=o.textAlign)),k=g+u+M;let S=f.x,P=f.y;r.setWidth(this.width),x?v>0&&S+k+c>this.right&&(P=f.y+=_,f.line++,S=f.x=ft(n,this.left+c,this.right-i[f.line])):v>0&&P+_>this.bottom&&(S=f.x=S+e[f.line].width+c,f.line++,P=f.y=ft(n,this.top+b+c,this.bottom-e[f.line].height));if(function(t,e,i){if(isNaN(g)||g<=0||isNaN(p)||p<0)return;s.save();const n=l(i.lineWidth,1);if(s.fillStyle=l(i.fillStyle,a),s.lineCap=l(i.lineCap,"butt"),s.lineDashOffset=l(i.lineDashOffset,0),s.lineJoin=l(i.lineJoin,"miter"),s.lineWidth=n,s.strokeStyle=l(i.strokeStyle,a),s.setLineDash(l(i.lineDash,[])),o.usePointStyle){const a={radius:p*Math.SQRT2/2,pointStyle:i.pointStyle,rotation:i.rotation,borderWidth:n},l=r.xPlus(t,g/2);Ee(s,a,l,e+u,o.pointStyleWidth&&g)}else{const o=e+Math.max((d-p)/2,0),a=r.leftForLtr(t,g),l=wi(i.borderRadius);s.beginPath(),Object.values(l).some((t=>0!==t))?He(s,{x:a,y:o,w:g,h:p,radius:l}):s.rect(a,o,g,p),s.fill(),0!==n&&s.stroke()}s.restore()}(r.x(S),P,y),S=gt(w,S+g+u,x?S+k:this.right,t.rtl),function(t,e,i){Ne(s,i.text,t,e+m/2,h,{strikethrough:i.hidden,textAlign:r.textAlign(i.textAlign)})}(r.x(S),P,y),x)f.x+=k+c;else if("string"!=typeof y.text){const t=h.lineHeight;f.y+=va(y,t)+c}else f.y+=_})),Ti(this.ctx,t.textDirection)}drawTitle(){const t=this.options,e=t.title,i=Si(e.font),s=ki(e.padding);if(!e.display)return;const n=Oi(t.rtl,this.left,this.width),o=this.ctx,a=e.position,r=i.size/2,l=s.top+r;let h,c=this.left,d=this.width;if(this.isHorizontal())d=Math.max(...this.lineWidths),h=this.top+l,c=ft(t.align,c,this.right-d);else{const e=this.columnSizes.reduce(((t,e)=>Math.max(t,e.height)),0);h=l+ft(t.align,this.top,this.bottom-e-t.labels.padding-this._computeTitleHeight())}const u=ft(a,c,c+d);o.textAlign=n.textAlign(ut(a)),o.textBaseline="middle",o.strokeStyle=e.color,o.fillStyle=e.color,o.font=i.string,Ne(o,e.text,u,h,i)}_computeTitleHeight(){const t=this.options.title,e=Si(t.font),i=ki(t.padding);return t.display?e.lineHeight+i.height:0}_getLegendItemAt(t,e){let i,s,n;if(tt(t,this.left,this.right)&&tt(e,this.top,this.bottom))for(n=this.legendHitBoxes,i=0;it.chart.options.color,boxWidth:40,padding:10,generateLabels(t){const e=t.data.datasets,{labels:{usePointStyle:i,pointStyle:s,textAlign:n,color:o,useBorderRadius:a,borderRadius:r}}=t.legend.options;return t._getSortedDatasetMetas().map((t=>{const l=t.controller.getStyle(i?0:void 0),h=ki(l.borderWidth);return{text:e[t.index].label,fillStyle:l.backgroundColor,fontColor:o,hidden:!t.visible,lineCap:l.borderCapStyle,lineDash:l.borderDash,lineDashOffset:l.borderDashOffset,lineJoin:l.borderJoinStyle,lineWidth:(h.width+h.height)/4,strokeStyle:l.borderColor,pointStyle:s||l.pointStyle,rotation:l.rotation,textAlign:n||l.textAlign,borderRadius:a&&(r||l.borderRadius),datasetIndex:t.index}}),this)}},title:{color:t=>t.chart.options.color,display:!1,position:"center",text:""}},descriptors:{_scriptable:t=>!t.startsWith("on"),labels:{_scriptable:t=>!["generateLabels","filter","sort"].includes(t)}}};class wa extends $s{constructor(t){super(),this.chart=t.chart,this.options=t.options,this.ctx=t.ctx,this._padding=void 0,this.top=void 0,this.bottom=void 0,this.left=void 0,this.right=void 0,this.width=void 0,this.height=void 0,this.position=void 0,this.weight=void 0,this.fullSize=void 0}update(t,e){const i=this.options;if(this.left=0,this.top=0,!i.display)return void(this.width=this.height=this.right=this.bottom=0);this.width=this.right=t,this.height=this.bottom=e;const s=n(i.text)?i.text.length:1;this._padding=ki(i.padding);const o=s*Si(i.font).lineHeight+this._padding.height;this.isHorizontal()?this.height=o:this.width=o}isHorizontal(){const t=this.options.position;return"top"===t||"bottom"===t}_drawArgs(t){const{top:e,left:i,bottom:s,right:n,options:o}=this,a=o.align;let r,l,h,c=0;return this.isHorizontal()?(l=ft(a,i,n),h=e+t,r=n-i):("left"===o.position?(l=i+t,h=ft(a,s,e),c=-.5*C):(l=n-t,h=ft(a,e,s),c=.5*C),r=s-e),{titleX:l,titleY:h,maxWidth:r,rotation:c}}draw(){const t=this.ctx,e=this.options;if(!e.display)return;const i=Si(e.font),s=i.lineHeight/2+this._padding.top,{titleX:n,titleY:o,maxWidth:a,rotation:r}=this._drawArgs(s);Ne(t,e.text,0,0,i,{color:e.color,maxWidth:a,rotation:r,textAlign:ut(e.align),textBaseline:"middle",translation:[n,o]})}}var ka={id:"title",_element:wa,start(t,e,i){!function(t,e){const i=new wa({ctx:t.ctx,options:e,chart:t});ls.configure(t,i,e),ls.addBox(t,i),t.titleBlock=i}(t,i)},stop(t){const e=t.titleBlock;ls.removeBox(t,e),delete t.titleBlock},beforeUpdate(t,e,i){const s=t.titleBlock;ls.configure(t,s,i),s.options=i},defaults:{align:"center",display:!1,font:{weight:"bold"},fullSize:!0,padding:10,position:"top",text:"",weight:2e3},defaultRoutes:{color:"color"},descriptors:{_scriptable:!0,_indexable:!1}};const Sa=new WeakMap;var Pa={id:"subtitle",start(t,e,i){const s=new wa({ctx:t.ctx,options:i,chart:t});ls.configure(t,s,i),ls.addBox(t,s),Sa.set(t,s)},stop(t){ls.removeBox(t,Sa.get(t)),Sa.delete(t)},beforeUpdate(t,e,i){const s=Sa.get(t);ls.configure(t,s,i),s.options=i},defaults:{align:"center",display:!1,font:{weight:"normal"},fullSize:!0,padding:0,position:"top",text:"",weight:1500},defaultRoutes:{color:"color"},descriptors:{_scriptable:!0,_indexable:!1}};const Da={average(t){if(!t.length)return!1;let e,i,s=new Set,n=0,o=0;for(e=0,i=t.length;et+e))/s.size,y:n/o}},nearest(t,e){if(!t.length)return!1;let i,s,n,o=e.x,a=e.y,r=Number.POSITIVE_INFINITY;for(i=0,s=t.length;i-1?t.split("\n"):t}function Aa(t,e){const{element:i,datasetIndex:s,index:n}=e,o=t.getDatasetMeta(s).controller,{label:a,value:r}=o.getLabelAndValue(n);return{chart:t,label:a,parsed:o.getParsed(n),raw:t.data.datasets[s].data[n],formattedValue:r,dataset:o.getDataset(),dataIndex:n,datasetIndex:s,element:i}}function Ta(t,e){const i=t.chart.ctx,{body:s,footer:n,title:o}=t,{boxWidth:a,boxHeight:r}=e,l=Si(e.bodyFont),h=Si(e.titleFont),c=Si(e.footerFont),d=o.length,f=n.length,g=s.length,p=ki(e.padding);let m=p.height,x=0,b=s.reduce(((t,e)=>t+e.before.length+e.lines.length+e.after.length),0);if(b+=t.beforeBody.length+t.afterBody.length,d&&(m+=d*h.lineHeight+(d-1)*e.titleSpacing+e.titleMarginBottom),b){m+=g*(e.displayColors?Math.max(r,l.lineHeight):l.lineHeight)+(b-g)*l.lineHeight+(b-1)*e.bodySpacing}f&&(m+=e.footerMarginTop+f*c.lineHeight+(f-1)*e.footerSpacing);let _=0;const y=function(t){x=Math.max(x,i.measureText(t).width+_)};return i.save(),i.font=h.string,u(t.title,y),i.font=l.string,u(t.beforeBody.concat(t.afterBody),y),_=e.displayColors?a+2+e.boxPadding:0,u(s,(t=>{u(t.before,y),u(t.lines,y),u(t.after,y)})),_=0,i.font=c.string,u(t.footer,y),i.restore(),x+=p.width,{width:x,height:m}}function La(t,e,i,s){const{x:n,width:o}=i,{width:a,chartArea:{left:r,right:l}}=t;let h="center";return"center"===s?h=n<=(r+l)/2?"left":"right":n<=o/2?h="left":n>=a-o/2&&(h="right"),function(t,e,i,s){const{x:n,width:o}=s,a=i.caretSize+i.caretPadding;return"left"===t&&n+o+a>e.width||"right"===t&&n-o-a<0||void 0}(h,t,e,i)&&(h="center"),h}function Ea(t,e,i){const s=i.yAlign||e.yAlign||function(t,e){const{y:i,height:s}=e;return it.height-s/2?"bottom":"center"}(t,i);return{xAlign:i.xAlign||e.xAlign||La(t,e,i,s),yAlign:s}}function Ra(t,e,i,s){const{caretSize:n,caretPadding:o,cornerRadius:a}=t,{xAlign:r,yAlign:l}=i,h=n+o,{topLeft:c,topRight:d,bottomLeft:u,bottomRight:f}=wi(a);let g=function(t,e){let{x:i,width:s}=t;return"right"===e?i-=s:"center"===e&&(i-=s/2),i}(e,r);const p=function(t,e,i){let{y:s,height:n}=t;return"top"===e?s+=i:s-="bottom"===e?n+i:n/2,s}(e,l,h);return"center"===l?"left"===r?g+=h:"right"===r&&(g-=h):"left"===r?g-=Math.max(c,u)+n:"right"===r&&(g+=Math.max(d,f)+n),{x:Z(g,0,s.width-e.width),y:Z(p,0,s.height-e.height)}}function Ia(t,e,i){const s=ki(i.padding);return"center"===e?t.x+t.width/2:"right"===e?t.x+t.width-s.right:t.x+s.left}function za(t){return Ca([],Oa(t))}function Fa(t,e){const i=e&&e.dataset&&e.dataset.tooltip&&e.dataset.tooltip.callbacks;return i?t.override(i):t}const Va={beforeTitle:e,title(t){if(t.length>0){const e=t[0],i=e.chart.data.labels,s=i?i.length:0;if(this&&this.options&&"dataset"===this.options.mode)return e.dataset.label||"";if(e.label)return e.label;if(s>0&&e.dataIndex{const e={before:[],lines:[],after:[]},n=Fa(i,t);Ca(e.before,Oa(Ba(n,"beforeLabel",this,t))),Ca(e.lines,Ba(n,"label",this,t)),Ca(e.after,Oa(Ba(n,"afterLabel",this,t))),s.push(e)})),s}getAfterBody(t,e){return za(Ba(e.callbacks,"afterBody",this,t))}getFooter(t,e){const{callbacks:i}=e,s=Ba(i,"beforeFooter",this,t),n=Ba(i,"footer",this,t),o=Ba(i,"afterFooter",this,t);let a=[];return a=Ca(a,Oa(s)),a=Ca(a,Oa(n)),a=Ca(a,Oa(o)),a}_createItems(t){const e=this._active,i=this.chart.data,s=[],n=[],o=[];let a,r,l=[];for(a=0,r=e.length;at.filter(e,s,n,i)))),t.itemSort&&(l=l.sort(((e,s)=>t.itemSort(e,s,i)))),u(l,(e=>{const i=Fa(t.callbacks,e);s.push(Ba(i,"labelColor",this,e)),n.push(Ba(i,"labelPointStyle",this,e)),o.push(Ba(i,"labelTextColor",this,e))})),this.labelColors=s,this.labelPointStyles=n,this.labelTextColors=o,this.dataPoints=l,l}update(t,e){const i=this.options.setContext(this.getContext()),s=this._active;let n,o=[];if(s.length){const t=Da[i.position].call(this,s,this._eventPosition);o=this._createItems(i),this.title=this.getTitle(o,i),this.beforeBody=this.getBeforeBody(o,i),this.body=this.getBody(o,i),this.afterBody=this.getAfterBody(o,i),this.footer=this.getFooter(o,i);const e=this._size=Ta(this,i),a=Object.assign({},t,e),r=Ea(this.chart,i,a),l=Ra(i,a,r,this.chart);this.xAlign=r.xAlign,this.yAlign=r.yAlign,n={opacity:1,x:l.x,y:l.y,width:e.width,height:e.height,caretX:t.x,caretY:t.y}}else 0!==this.opacity&&(n={opacity:0});this._tooltipItems=o,this.$context=void 0,n&&this._resolveAnimations().update(this,n),t&&i.external&&i.external.call(this,{chart:this.chart,tooltip:this,replay:e})}drawCaret(t,e,i,s){const n=this.getCaretPosition(t,i,s);e.lineTo(n.x1,n.y1),e.lineTo(n.x2,n.y2),e.lineTo(n.x3,n.y3)}getCaretPosition(t,e,i){const{xAlign:s,yAlign:n}=this,{caretSize:o,cornerRadius:a}=i,{topLeft:r,topRight:l,bottomLeft:h,bottomRight:c}=wi(a),{x:d,y:u}=t,{width:f,height:g}=e;let p,m,x,b,_,y;return"center"===n?(_=u+g/2,"left"===s?(p=d,m=p-o,b=_+o,y=_-o):(p=d+f,m=p+o,b=_-o,y=_+o),x=p):(m="left"===s?d+Math.max(r,h)+o:"right"===s?d+f-Math.max(l,c)-o:this.caretX,"top"===n?(b=u,_=b-o,p=m-o,x=m+o):(b=u+g,_=b+o,p=m+o,x=m-o),y=b),{x1:p,x2:m,x3:x,y1:b,y2:_,y3:y}}drawTitle(t,e,i){const s=this.title,n=s.length;let o,a,r;if(n){const l=Oi(i.rtl,this.x,this.width);for(t.x=Ia(this,i.titleAlign,i),e.textAlign=l.textAlign(i.titleAlign),e.textBaseline="middle",o=Si(i.titleFont),a=i.titleSpacing,e.fillStyle=i.titleColor,e.font=o.string,r=0;r0!==t))?(t.beginPath(),t.fillStyle=n.multiKeyBackground,He(t,{x:e,y:g,w:h,h:l,radius:r}),t.fill(),t.stroke(),t.fillStyle=a.backgroundColor,t.beginPath(),He(t,{x:i,y:g+1,w:h-2,h:l-2,radius:r}),t.fill()):(t.fillStyle=n.multiKeyBackground,t.fillRect(e,g,h,l),t.strokeRect(e,g,h,l),t.fillStyle=a.backgroundColor,t.fillRect(i,g+1,h-2,l-2))}t.fillStyle=this.labelTextColors[i]}drawBody(t,e,i){const{body:s}=this,{bodySpacing:n,bodyAlign:o,displayColors:a,boxHeight:r,boxWidth:l,boxPadding:h}=i,c=Si(i.bodyFont);let d=c.lineHeight,f=0;const g=Oi(i.rtl,this.x,this.width),p=function(i){e.fillText(i,g.x(t.x+f),t.y+d/2),t.y+=d+n},m=g.textAlign(o);let x,b,_,y,v,M,w;for(e.textAlign=o,e.textBaseline="middle",e.font=c.string,t.x=Ia(this,m,i),e.fillStyle=i.bodyColor,u(this.beforeBody,p),f=a&&"right"!==m?"center"===o?l/2+h:l+2+h:0,y=0,M=s.length;y0&&e.stroke()}_updateAnimationTarget(t){const e=this.chart,i=this.$animations,s=i&&i.x,n=i&&i.y;if(s||n){const i=Da[t.position].call(this,this._active,this._eventPosition);if(!i)return;const o=this._size=Ta(this,t),a=Object.assign({},i,this._size),r=Ea(e,t,a),l=Ra(t,a,r,e);s._to===l.x&&n._to===l.y||(this.xAlign=r.xAlign,this.yAlign=r.yAlign,this.width=o.width,this.height=o.height,this.caretX=i.x,this.caretY=i.y,this._resolveAnimations().update(this,l))}}_willRender(){return!!this.opacity}draw(t){const e=this.options.setContext(this.getContext());let i=this.opacity;if(!i)return;this._updateAnimationTarget(e);const s={width:this.width,height:this.height},n={x:this.x,y:this.y};i=Math.abs(i)<.001?0:i;const o=ki(e.padding),a=this.title.length||this.beforeBody.length||this.body.length||this.afterBody.length||this.footer.length;e.enabled&&a&&(t.save(),t.globalAlpha=i,this.drawBackground(n,t,s,e),Ai(t,e.textDirection),n.y+=o.top,this.drawTitle(n,t,e),this.drawBody(n,t,e),this.drawFooter(n,t,e),Ti(t,e.textDirection),t.restore())}getActiveElements(){return this._active||[]}setActiveElements(t,e){const i=this._active,s=t.map((({datasetIndex:t,index:e})=>{const i=this.chart.getDatasetMeta(t);if(!i)throw new Error("Cannot find a dataset at index "+t);return{datasetIndex:t,element:i.data[e],index:e}})),n=!f(i,s),o=this._positionChanged(s,e);(n||o)&&(this._active=s,this._eventPosition=e,this._ignoreReplayEvents=!0,this.update(!0))}handleEvent(t,e,i=!0){if(e&&this._ignoreReplayEvents)return!1;this._ignoreReplayEvents=!1;const s=this.options,n=this._active||[],o=this._getActiveElements(t,n,e,i),a=this._positionChanged(o,t),r=e||!f(o,n)||a;return r&&(this._active=o,(s.enabled||s.external)&&(this._eventPosition={x:t.x,y:t.y},this.update(!0,e))),r}_getActiveElements(t,e,i,s){const n=this.options;if("mouseout"===t.type)return[];if(!s)return e.filter((t=>this.chart.data.datasets[t.datasetIndex]&&void 0!==this.chart.getDatasetMeta(t.datasetIndex).controller.getParsed(t.index)));const o=this.chart.getElementsAtEventForMode(t,n.mode,n,i);return n.reverse&&o.reverse(),o}_positionChanged(t,e){const{caretX:i,caretY:s,options:n}=this,o=Da[n.position].call(this,t,e);return!1!==o&&(i!==o.x||s!==o.y)}}var Na={id:"tooltip",_element:Wa,positioners:Da,afterInit(t,e,i){i&&(t.tooltip=new Wa({chart:t,options:i}))},beforeUpdate(t,e,i){t.tooltip&&t.tooltip.initialize(i)},reset(t,e,i){t.tooltip&&t.tooltip.initialize(i)},afterDraw(t){const e=t.tooltip;if(e&&e._willRender()){const i={tooltip:e};if(!1===t.notifyPlugins("beforeTooltipDraw",{...i,cancelable:!0}))return;e.draw(t.ctx),t.notifyPlugins("afterTooltipDraw",i)}},afterEvent(t,e){if(t.tooltip){const i=e.replay;t.tooltip.handleEvent(e.event,i,e.inChartArea)&&(e.changed=!0)}},defaults:{enabled:!0,external:null,position:"average",backgroundColor:"rgba(0,0,0,0.8)",titleColor:"#fff",titleFont:{weight:"bold"},titleSpacing:2,titleMarginBottom:6,titleAlign:"left",bodyColor:"#fff",bodySpacing:2,bodyFont:{},bodyAlign:"left",footerColor:"#fff",footerSpacing:2,footerMarginTop:6,footerFont:{weight:"bold"},footerAlign:"left",padding:6,caretPadding:2,caretSize:5,cornerRadius:6,boxHeight:(t,e)=>e.bodyFont.size,boxWidth:(t,e)=>e.bodyFont.size,multiKeyBackground:"#fff",displayColors:!0,boxPadding:0,borderColor:"rgba(0,0,0,0)",borderWidth:0,animation:{duration:400,easing:"easeOutQuart"},animations:{numbers:{type:"number",properties:["x","y","width","height","caretX","caretY"]},opacity:{easing:"linear",duration:200}},callbacks:Va},defaultRoutes:{bodyFont:"font",footerFont:"font",titleFont:"font"},descriptors:{_scriptable:t=>"filter"!==t&&"itemSort"!==t&&"external"!==t,_indexable:!1,callbacks:{_scriptable:!1,_indexable:!1},animation:{_fallback:!1},animations:{_fallback:"animation"}},additionalOptionScopes:["interaction"]};return Tn.register(Un,$o,go,t),Tn.helpers={...Hi},Tn._adapters=In,Tn.Animation=As,Tn.Animations=Ts,Tn.animator=bt,Tn.controllers=nn.controllers.items,Tn.DatasetController=js,Tn.Element=$s,Tn.elements=go,Tn.Interaction=Ki,Tn.layouts=ls,Tn.platforms=Ds,Tn.Scale=tn,Tn.Ticks=ae,Object.assign(Tn,Un,$o,go,t,Ds),Tn.Chart=Tn,"undefined"!=typeof window&&(window.Chart=Tn),Tn})); +//# sourceMappingURL=chart.umd.js.map diff --git a/src/web/routes/account/password.js b/src/web/routes/account/password.js index 34281e8..7eafb5b 100644 --- a/src/web/routes/account/password.js +++ b/src/web/routes/account/password.js @@ -1,6 +1,6 @@ // Account password page renderer and return URL normalization. -const { renderView } = require('../../view'); +const { renderView } = require('#src/web/view'); function normalizeReturnUrl(value) { const url = String(value || '').trim(); diff --git a/src/web/routes/admin/client-commands.js b/src/web/routes/admin/client-commands.js index 857bef6..dcbde46 100644 --- a/src/web/routes/admin/client-commands.js +++ b/src/web/routes/admin/client-commands.js @@ -1,6 +1,9 @@ // Admin client command routes for connected screens. +// Client routing should rely on the shared player registration helpers instead of recreating +// URL and heartbeat checks in each route, which makes the screen-target selection consistent. const { createPageAuthToken } = require('#src/request-auth'); +const { normalizeBaseUrl } = require('#src/data/player-registry'); module.exports = function registerScreenCommandRoutes(app, deps) { const pool = deps.pool; @@ -31,17 +34,13 @@ module.exports = function registerScreenCommandRoutes(app, deps) { } function normalizeExplicitPlayerBaseUrl(value) { - return String(value || '').trim().replace(/\/$/, ''); + return normalizeBaseUrl(value); } function normalizeConnectionBaseUrl(connection) { return normalizeExplicitPlayerBaseUrl(connection && connection.playerPublicBaseUrl); } - function normalizeBaseUrl(value) { - return String(value || '').trim().replace(/\/$/, ''); - } - async function fetchPlayerRegistrations() { if (typeof common.fetchPlayerRegistrations !== 'function') { return []; @@ -87,6 +86,9 @@ module.exports = function registerScreenCommandRoutes(app, deps) { }); } + // Resolve a screen's live connections back to the player's internal base URL when the public URL + // is known to the registry. This lets the admin UI target the correct local endpoint without + // depending on whichever public URL happened to be reported by the connection itself. async function resolvePlayerBaseUrlsForConnections(connections) { const connectionList = Array.isArray(connections) ? connections : []; const seen = new Set(); @@ -119,6 +121,9 @@ module.exports = function registerScreenCommandRoutes(app, deps) { return normalizeExplicitPlayerBaseUrl(matchedPlayer && matchedPlayer.internal_base_url) || normalizedPublicBaseUrl; } + // Admin commands may target either a direct player connection or a bridged device. Keep the fan-out + // logic explicit so a screen can be controlled through the correct transport without mixing both + // path choices into the command payload itself. async function forwardPlayerCommandForConnections(screenSlug, connections, commandPayload, connectionId, deviceId) { const connectionList = Array.isArray(connections) ? connections : []; const targetedConnections = connectionId @@ -186,15 +191,6 @@ module.exports = function registerScreenCommandRoutes(app, deps) { return forwardPlayerCommand(screenSlug, commandPayload, connectionId || deviceId || undefined); } - function isRecentPlayerRegistration(player, staleSeconds) { - const lastSeenAt = player && player.last_seen_at; - const lastSeenAtValue = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime(); - const cutoffTime = Date.now() - Math.max(30, Number(staleSeconds || 60)) * 1000; - - return Number.isFinite(lastSeenAtValue) && lastSeenAtValue >= cutoffTime; - } - - app.post('/clients/:slug/commands', requirePermission('clients.allow'), async function (req, res, next) { try { const slug = String(req.params.slug || '').trim(); diff --git a/src/web/routes/admin/content.js b/src/web/routes/admin/content.js index 1b74510..4ad5d80 100644 --- a/src/web/routes/admin/content.js +++ b/src/web/routes/admin/content.js @@ -7,7 +7,7 @@ const { fetchAppSettings } = require('#src/data/app-settings'); const { convertWeatherSnapshot } = require('#src/data/weather-units'); const { buildAuditChanges } = require('#src/data/audit-log'); const { PERMISSION_DENIED_MESSAGE } = require('#src/rbac'); -const { fetchMediaAssets, registerMediaAssets, syncMediaAssetsFromDirectory, publishMediaAssets, removePendingMediaAssets } = require('#src/web/lib/media/library'); +const { fetchMediaAssets, createImageVariants, registerMediaAssets, syncMediaAssetsFromDirectory, publishMediaAssets, removePendingMediaAssets } = require('#src/web/lib/media/library'); module.exports = function registerContentRoutes(app, deps) { const pool = deps.pool; @@ -126,6 +126,7 @@ module.exports = function registerContentRoutes(app, deps) { throw error; } } + return settings; } function requireSlideUploadPermission(req, res, next) { @@ -147,6 +148,25 @@ module.exports = function registerContentRoutes(app, deps) { next(error); } + function requireTemplateUploadPermission(req, res, next) { + if (!req.currentUser) { + if (typeof setAuthMessageCookie === 'function') { + setAuthMessageCookie(res, 'Please sign in to continue.'); + return res.redirect('/login'); + } + return res.redirect('/login'); + } + + if (hasAnyPermission(req.currentUser, ['templates.create', 'templates.update'])) { + return next(); + } + + const error = new Error(PERMISSION_DENIED_MESSAGE); + error.statusCode = 403; + error.expose = true; + next(error); + } + function getUploadedFileMediaType(file, uploadContext) { const mimeType = String(file && file.mimetype || '').trim().toLowerCase(); const extension = path.extname(String(file && file.originalname || '')).toLowerCase(); @@ -233,6 +253,23 @@ module.exports = function registerContentRoutes(app, deps) { } } + async function processImmediateMediaUpload(req, res, uploadContext) { + if (!req.file) { + return res.status(400).json({ error: 'No file was uploaded.' }); + } + + await validateUploadedFiles([req.file], uploadContext); + await createImageVariants(req.file); + await registerMediaAssets(pool, [req.file], function (file) { + return '/media/uploads/' + file.filename; + }, getUploadedFileMediaType, getAuditUserId(req), { published: false }); + res.json({ + path: '/media/uploads/' + req.file.filename, + filename: req.file.filename, + originalName: req.file.originalname || '' + }); + } + async function fetchTemplateSlideCount(templateId) { const [rows] = await pool.query('SELECT COUNT(*) AS slide_count FROM c_slides WHERE template_id = ?', [templateId]); return Number(rows[0] && rows[0].slide_count) || 0; @@ -268,7 +305,7 @@ module.exports = function registerContentRoutes(app, deps) { return Array.from(usage); } - const { buildDuplicateTemplateName, buildDuplicateTemplate } = require('../signage/templates/duplicate'); + const { buildDuplicateTemplateName, buildDuplicateTemplate } = require('#src/web/routes/signage/templates/duplicate'); async function fetchSlidesByTemplateId(templateId) { const [slides] = await pool.query('SELECT id, thumbnail_path FROM c_slides WHERE template_id = ? ORDER BY id ASC', [templateId]); @@ -291,6 +328,7 @@ module.exports = function registerContentRoutes(app, deps) { } const canvasSizes = await common.fetchCanvasSizesData(pool); + const settings = await fetchAppSettings(pool); let duplicateName = buildDuplicateTemplateName(template.name); let duplicateIndex = 2; while (await common.fetchDuplicateName(pool, 'c_templates', duplicateName)) { @@ -298,10 +336,11 @@ module.exports = function registerContentRoutes(app, deps) { duplicateIndex += 1; } - res.send(pages.renderTemplateAddPage(buildDuplicateTemplate(template, duplicateName), req.query.message ? String(req.query.message) : 'Review the copied values and save when ready.', canvasSizes.canvasSizes, req.currentUser)); + res.send(pages.renderTemplateAddPage(buildDuplicateTemplate(template, duplicateName), req.query.message ? String(req.query.message) : 'Review the copied values and save when ready.', canvasSizes.canvasSizes, req.currentUser, null, Number(settings['uploads.image_max_bytes']) || IMAGE_UPLOAD_MAX_BYTES)); } catch (error) { next(error); } + }); async function getTemplateRegionDeleteBlockMessage(template, nextRegions) { const removedRegionKeys = getRemovedTemplateRegionKeys(template && template.regions ? template.regions : [], nextRegions); @@ -445,22 +484,8 @@ module.exports = function registerContentRoutes(app, deps) { app.post('/slides/uploads', requireSlideUploadPermission, upload.single('file'), async function (req, res, next) { try { - if (!req.file) { - return res.status(400).json({ error: 'No file was uploaded.' }); - } - const uploadContext = String(req.get('X-Upload-Context') || req.query.context || '').trim().toLowerCase(); - - await validateUploadedFiles([req.file], uploadContext); - await registerMediaAssets(pool, [req.file], function (file) { - return '/media/uploads/' + file.filename; - }, getUploadedFileMediaType, getAuditUserId(req), { published: false }); - - res.json({ - path: '/media/uploads/' + req.file.filename, - filename: req.file.filename, - originalName: req.file.originalname || '' - }); + await processImmediateMediaUpload(req, res, uploadContext); } catch (error) { next(error); } @@ -485,9 +510,39 @@ module.exports = function registerContentRoutes(app, deps) { } }); + app.post('/templates/uploads', requireTemplateUploadPermission, upload.single('file'), async function (req, res, next) { + try { + await processImmediateMediaUpload(req, res, 'template-background'); + } catch (error) { + next(error); + } + }); + + app.post('/templates/uploads/cleanup', requireTemplateUploadPermission, async function (req, res, next) { + try { + const uploadPaths = Array.isArray(req.body && req.body.uploadPaths) + ? req.body.uploadPaths + : req.body && req.body.uploadPaths + ? [req.body.uploadPaths] + : []; + + if (!uploadPaths.length) { + return res.status(400).json({ error: 'No upload paths were provided.' }); + } + + await removePendingMediaAssets(pool, deps.uploadDir, uploadPaths); + res.sendStatus(204); + } catch (error) { + next(error); + } + }); + app.post('/slides', requirePermission('slides.create'), upload.any(), async function (req, res, next) { try { - await validateUploadedFiles(req.files || []); + const settings = await validateUploadedFiles(req.files || []); + for (const file of req.files || []) { + await createImageVariants(file); + } await registerMediaAssets(pool, req.files, function (file) { return '/media/uploads/' + file.filename; }, getUploadedFileMediaType, getAuditUserId(req)); @@ -523,7 +578,10 @@ module.exports = function registerContentRoutes(app, deps) { app.post('/slides/:id', requirePermission('slides.update'), upload.any(), async function (req, res, next) { try { - await validateUploadedFiles(req.files || []); + const settings = await validateUploadedFiles(req.files || []); + for (const file of req.files || []) { + await createImageVariants(file); + } await registerMediaAssets(pool, req.files, function (file) { return '/media/uploads/' + file.filename; }, getUploadedFileMediaType, getAuditUserId(req)); @@ -632,7 +690,8 @@ module.exports = function registerContentRoutes(app, deps) { const data = await common.fetchCanvasSizesData(pool); await syncMediaAssetsFromDirectory(pool, deps.uploadDir); const mediaAssets = (await fetchMediaAssets(pool)).slice(0, 24); - res.send(pages.renderTemplateAddPage(null, req.query.message ? String(req.query.message) : '', data.canvasSizes, req.currentUser, mediaAssets)); + const settings = await fetchAppSettings(pool); + res.send(pages.renderTemplateAddPage(null, req.query.message ? String(req.query.message) : '', data.canvasSizes, req.currentUser, mediaAssets, Number(settings['uploads.image_max_bytes']) || IMAGE_UPLOAD_MAX_BYTES)); } catch (error) { next(error); } @@ -663,6 +722,7 @@ module.exports = function registerContentRoutes(app, deps) { [result.insertId, region.region_key, region.region_type, region.label, region.lock_ratio, JSON.stringify(region.animation_json || {}), region.x, region.y, region.width, region.height, region.z_index, actorId, actorId] ); } + await publishMediaAssets(pool, collectUploadReferencesFromPayload(payload)); await syncPlaylistUploadsOnChange({ key: 'template:create:' + result.insertId, pool: pool, @@ -691,7 +751,8 @@ module.exports = function registerContentRoutes(app, deps) { const sizeData = await common.fetchCanvasSizesData(pool); await syncMediaAssetsFromDirectory(pool, deps.uploadDir); const mediaAssets = await fetchMediaAssets(pool); - res.send(pages.renderTemplateEditPage(template, sizeData, req.query.message ? String(req.query.message) : '', req.currentUser, mediaAssets)); + const settings = await fetchAppSettings(pool); + res.send(pages.renderTemplateEditPage(template, sizeData, req.query.message ? String(req.query.message) : '', req.currentUser, mediaAssets, Number(settings['uploads.image_max_bytes']) || IMAGE_UPLOAD_MAX_BYTES)); } catch (error) { next(error); } @@ -745,6 +806,7 @@ module.exports = function registerContentRoutes(app, deps) { [template.id, region.region_key, region.region_type, region.label, region.lock_ratio, JSON.stringify(region.animation_json || {}), region.x, region.y, region.width, region.height, region.z_index, actorId, actorId] ); } + await publishMediaAssets(pool, Array.from(new Set(Array.from(existingUploadRefs).concat(Array.from(nextUploadRefs))))); await syncPlaylistUploadsOnChange({ key: 'template:update:' + template.id, pool: pool, diff --git a/src/web/routes/admin/manage.js b/src/web/routes/admin/manage.js index 0d3bc52..2131ed7 100644 --- a/src/web/routes/admin/manage.js +++ b/src/web/routes/admin/manage.js @@ -1,6 +1,9 @@ // Admin manage routes for screens and commands. +// Screen command dispatch should not duplicate the global player-registration rules; this route +// intentionally relies on the shared registry helpers for consistent URL and freshness checks. const { buildAuditChanges } = require('#src/data/audit-log'); +const { normalizeBaseUrl } = require('#src/data/player-registry'); module.exports = function registerManageRoutes(app, deps) { const pool = deps.pool; @@ -31,7 +34,7 @@ module.exports = function registerManageRoutes(app, deps) { } function normalizeExplicitPlayerBaseUrl(value) { - return String(value || '').trim().replace(/\/$/, ''); + return normalizeBaseUrl(value); } async function fetchPlayerRegistrations() { @@ -47,14 +50,6 @@ module.exports = function registerManageRoutes(app, deps) { } } - function isRecentPlayerRegistration(player, staleSeconds) { - const lastSeenAt = player && player.last_seen_at; - const lastSeenAtValue = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime(); - const cutoffTime = Date.now() - Math.max(30, Number(staleSeconds || 60)) * 1000; - - return Number.isFinite(lastSeenAtValue) && lastSeenAtValue >= cutoffTime; - } - async function fetchLiveConnectionsForScreen(slug) { if (typeof getScreenConnections !== 'function') { return []; diff --git a/src/web/routes/admin/pages.js b/src/web/routes/admin/pages.js index b08bf07..81b5532 100644 --- a/src/web/routes/admin/pages.js +++ b/src/web/routes/admin/pages.js @@ -1,11 +1,11 @@ // Admin page route composition for the signage sections. module.exports = function registerPagesRoutes(app, deps) { - require('../signage/dashboard/routes')(app, deps); - require('../signage/clients/routes')(app, deps); - require('../signage/screens/routes')(app, deps); - require('../signage/playlists/routes')(app, deps); - require('../signage/slides/routes')(app, deps); - require('../signage/canvas-sizes/routes')(app, deps); - require('../signage/templates/routes')(app, deps); + require('#src/web/routes/signage/dashboard/routes')(app, deps); + require('#src/web/routes/signage/clients/routes')(app, deps); + require('#src/web/routes/signage/screens/routes')(app, deps); + require('#src/web/routes/signage/playlists/routes')(app, deps); + require('#src/web/routes/signage/slides/routes')(app, deps); + require('#src/web/routes/signage/canvas-sizes/routes')(app, deps); + require('#src/web/routes/signage/templates/routes')(app, deps); }; \ No newline at end of file diff --git a/src/web/routes/admin/rbac.js b/src/web/routes/admin/rbac.js index 675a02e..1d3e2da 100644 --- a/src/web/routes/admin/rbac.js +++ b/src/web/routes/admin/rbac.js @@ -12,9 +12,9 @@ const permissions = Array.isArray(deps.permissions) ? deps.permissions : []; const readArrayField = deps.readArrayField; const normalizePermissionKeys = deps.normalizePermissionKeys; - const { buildPagination } = require('../../lib/pagination'); + const { buildPagination } = require('#src/web/lib/pagination'); const requirePermission = deps.requirePermission; - const { buildDuplicateRoleName, buildDuplicateRole } = require('../settings/rbac/duplicate'); + const { buildDuplicateRoleName, buildDuplicateRole } = require('#src/web/routes/settings/rbac/duplicate'); const ROLE_NAME_MAX_LENGTH = 255; const ROLE_DESCRIPTION_MAX_LENGTH = 255; diff --git a/src/web/routes/admin/users.js b/src/web/routes/admin/users.js index ca28700..efef88b 100644 --- a/src/web/routes/admin/users.js +++ b/src/web/routes/admin/users.js @@ -19,9 +19,9 @@ const validatePasswordStrength = deps.validatePasswordStrength; const readArrayField = deps.readArrayField; const rbacData = deps.rbacData; - const { buildPagination } = require('../../lib/pagination'); + const { buildPagination } = require('#src/web/lib/pagination'); const requirePermission = deps.requirePermission; - const { buildDuplicateUserName, buildDuplicateUser } = require('../settings/users/duplicate'); + const { buildDuplicateUserName, buildDuplicateUser } = require('#src/web/routes/settings/users/duplicate'); const USER_NAME_MAX_LENGTH = 255; const USER_USERNAME_MAX_LENGTH = 255; diff --git a/src/web/routes/auth/accept-invite.js b/src/web/routes/auth/accept-invite.js index 2641a6a..d476349 100644 --- a/src/web/routes/auth/accept-invite.js +++ b/src/web/routes/auth/accept-invite.js @@ -1,4 +1,4 @@ -const { renderView } = require('../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderAcceptInvitePage(message, token, email, name, passwordRequirements, isValidInvitation) { const requirements = passwordRequirements || { minimumLength: 10, minimumCategories: 3, requireLowercase: false, requireUppercase: false, requireNumber: false, requireSymbol: false }; diff --git a/src/web/routes/auth/email-verification-error.js b/src/web/routes/auth/email-verification-error.js index b311968..886d746 100644 --- a/src/web/routes/auth/email-verification-error.js +++ b/src/web/routes/auth/email-verification-error.js @@ -1,4 +1,4 @@ -const { renderView } = require('../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderEmailVerificationErrorPage(message) { return renderView('auth/email-verification-error', { title: 'Verification link unavailable', authShell: true, bodyClass: 'login-page-body', message: message || 'This email verification link is invalid or has expired.' }); diff --git a/src/web/routes/auth/email-verified.js b/src/web/routes/auth/email-verified.js index c43f19f..102c0a5 100644 --- a/src/web/routes/auth/email-verified.js +++ b/src/web/routes/auth/email-verified.js @@ -1,4 +1,4 @@ -const { renderView } = require('../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderEmailVerifiedPage() { return renderView('auth/email-verified', { title: 'Email verified', authShell: true, bodyClass: 'login-page-body' }); diff --git a/src/web/routes/auth/forgot-password.js b/src/web/routes/auth/forgot-password.js index 55c11c0..6200078 100644 --- a/src/web/routes/auth/forgot-password.js +++ b/src/web/routes/auth/forgot-password.js @@ -1,4 +1,4 @@ -const { renderView } = require('../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderForgotPasswordPage(message) { return renderView('auth/forgot-password', { title: 'Reset password', authShell: true, bodyClass: 'login-page-body', message: message || '' }); diff --git a/src/web/routes/auth/index.js b/src/web/routes/auth/index.js index 330efc9..8eb6896 100644 --- a/src/web/routes/auth/index.js +++ b/src/web/routes/auth/index.js @@ -1,6 +1,6 @@ // Authentication route registration for the web app. -const { normalizeReturnToPath, getRequestOrigin } = require('../../lib/auth/session'); +const { normalizeReturnToPath, getRequestOrigin } = require('#src/web/lib/auth/session'); const { fetchAppSettings } = require('#src/data/app-settings'); const { formatAccountEmailExpiry, renderAccountEmailTemplate } = require('#src/data/account-email-templates'); diff --git a/src/web/routes/auth/login.js b/src/web/routes/auth/login.js index 7a0c9aa..166bff7 100644 --- a/src/web/routes/auth/login.js +++ b/src/web/routes/auth/login.js @@ -1,6 +1,6 @@ // Sign-in page renderer for the authentication flow. -const { renderView } = require('../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderLoginPage(message, returnTo, username, showForgotPassword) { return renderView('auth/login', { diff --git a/src/web/routes/auth/reset-password.js b/src/web/routes/auth/reset-password.js index 53ef0c6..da7f7ed 100644 --- a/src/web/routes/auth/reset-password.js +++ b/src/web/routes/auth/reset-password.js @@ -1,4 +1,4 @@ -const { renderView } = require('../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderResetPasswordPage(message, token, passwordRequirements) { const requirements = passwordRequirements || { minimumLength: 10, minimumCategories: 3, requireLowercase: false, requireUppercase: false, requireNumber: false, requireSymbol: false }; diff --git a/src/web/routes/data-sources/api-sources/add.js b/src/web/routes/data-sources/api-sources/add.js index 24d08fa..50f88bd 100644 --- a/src/web/routes/data-sources/api-sources/add.js +++ b/src/web/routes/data-sources/api-sources/add.js @@ -1,7 +1,7 @@ // API source add page renderer. -const { renderView } = require('../../../view'); -const { buildApiSourceFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildApiSourceFormViewModel } = require('#src/web/routes/data-sources/api-sources/form-view-model'); module.exports = function renderApiSourceAddPage(apiSource, message, currentUser, options) { return renderView('data-sources/api-sources/form', buildApiSourceFormViewModel(apiSource, message, currentUser, options, false)); diff --git a/src/web/routes/data-sources/api-sources/edit.js b/src/web/routes/data-sources/api-sources/edit.js index e9606e7..1268ef4 100644 --- a/src/web/routes/data-sources/api-sources/edit.js +++ b/src/web/routes/data-sources/api-sources/edit.js @@ -1,7 +1,7 @@ // API source edit page renderer. -const { renderView } = require('../../../view'); -const { buildApiSourceFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildApiSourceFormViewModel } = require('#src/web/routes/data-sources/api-sources/form-view-model'); module.exports = function renderApiSourceEditPage(apiSource, data, message, currentUser) { const viewData = Object.assign({ diff --git a/src/web/routes/data-sources/api-sources/list.js b/src/web/routes/data-sources/api-sources/list.js index 46052e2..9a99ffd 100644 --- a/src/web/routes/data-sources/api-sources/list.js +++ b/src/web/routes/data-sources/api-sources/list.js @@ -1,6 +1,6 @@ // API source list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); function toIsoTimestamp(value) { if (!value) { diff --git a/src/web/routes/data-sources/api-sources/routes.js b/src/web/routes/data-sources/api-sources/routes.js index 7925e1a..59745ae 100644 --- a/src/web/routes/data-sources/api-sources/routes.js +++ b/src/web/routes/data-sources/api-sources/routes.js @@ -1,10 +1,10 @@ // API source route registration. -const { buildPagination } = require('../../../lib/pagination'); -const renderApiSourcesPage = require('./list'); -const renderApiSourceAddPage = require('./add'); -const renderApiSourceEditPage = require('./edit'); -const { buildDuplicateApiSourceName, buildDuplicateApiSource } = require('./duplicate'); +const { buildPagination } = require('#src/web/lib/pagination'); +const renderApiSourcesPage = require('#src/web/routes/data-sources/api-sources/list'); +const renderApiSourceAddPage = require('#src/web/routes/data-sources/api-sources/add'); +const renderApiSourceEditPage = require('#src/web/routes/data-sources/api-sources/edit'); +const { buildDuplicateApiSourceName, buildDuplicateApiSource } = require('#src/web/routes/data-sources/api-sources/duplicate'); const { fetchAppSettings } = require('#src/data/app-settings'); function toIsoTimestamp(value) { diff --git a/src/web/routes/data-sources/rss-feeds/add.js b/src/web/routes/data-sources/rss-feeds/add.js index a5a0ab5..9938aee 100644 --- a/src/web/routes/data-sources/rss-feeds/add.js +++ b/src/web/routes/data-sources/rss-feeds/add.js @@ -1,7 +1,7 @@ // RSS feed add page renderer. -const { renderView } = require('../../../view'); -const { buildRssFeedFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildRssFeedFormViewModel } = require('#src/web/routes/data-sources/rss-feeds/form-view-model'); module.exports = function renderRssFeedAddPage(rssFeed, message, currentUser, options) { return renderView('data-sources/rss-feeds/form', buildRssFeedFormViewModel(rssFeed, message, currentUser, options, false)); diff --git a/src/web/routes/data-sources/rss-feeds/edit.js b/src/web/routes/data-sources/rss-feeds/edit.js index 454ff69..5c9c5b9 100644 --- a/src/web/routes/data-sources/rss-feeds/edit.js +++ b/src/web/routes/data-sources/rss-feeds/edit.js @@ -1,7 +1,7 @@ // RSS feed edit page renderer. -const { renderView } = require('../../../view'); -const { buildRssFeedFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildRssFeedFormViewModel } = require('#src/web/routes/data-sources/rss-feeds/form-view-model'); module.exports = function renderRssFeedEditPage(rssFeed, data, message, currentUser) { const viewData = Object.assign({ diff --git a/src/web/routes/data-sources/rss-feeds/list.js b/src/web/routes/data-sources/rss-feeds/list.js index 3326bb9..6a112b1 100644 --- a/src/web/routes/data-sources/rss-feeds/list.js +++ b/src/web/routes/data-sources/rss-feeds/list.js @@ -1,6 +1,6 @@ // RSS feed list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); function formatIntervalLabel(interval, unit) { const value = Math.max(1, Number(interval) || 0); diff --git a/src/web/routes/data-sources/rss-feeds/routes.js b/src/web/routes/data-sources/rss-feeds/routes.js index a2d0647..076d13e 100644 --- a/src/web/routes/data-sources/rss-feeds/routes.js +++ b/src/web/routes/data-sources/rss-feeds/routes.js @@ -1,10 +1,10 @@ // RSS feed route registration. -const { buildPagination } = require('../../../lib/pagination'); -const renderRssFeedsPage = require('./list'); -const renderRssFeedAddPage = require('./add'); -const renderRssFeedEditPage = require('./edit'); -const { buildDuplicateRssFeedName, buildDuplicateRssFeed } = require('./duplicate'); +const { buildPagination } = require('#src/web/lib/pagination'); +const renderRssFeedsPage = require('#src/web/routes/data-sources/rss-feeds/list'); +const renderRssFeedAddPage = require('#src/web/routes/data-sources/rss-feeds/add'); +const renderRssFeedEditPage = require('#src/web/routes/data-sources/rss-feeds/edit'); +const { buildDuplicateRssFeedName, buildDuplicateRssFeed } = require('#src/web/routes/data-sources/rss-feeds/duplicate'); const { fetchAppSettings } = require('#src/data/app-settings'); async function getDataSourceUsageMaps(pool, common) { diff --git a/src/web/routes/data-sources/timetables/add.js b/src/web/routes/data-sources/timetables/add.js index 7768f5c..da9b1ab 100644 --- a/src/web/routes/data-sources/timetables/add.js +++ b/src/web/routes/data-sources/timetables/add.js @@ -1,7 +1,7 @@ // Timetable group add page renderer. -const { renderView } = require('../../../view'); -const { buildTimetableGroupFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildTimetableGroupFormViewModel } = require('#src/web/routes/data-sources/timetables/form-view-model'); module.exports = function renderTimetableGroupAddPage(timetableGroup, timetableEntries, message, currentUser, options) { return renderView('data-sources/timetables/form', buildTimetableGroupFormViewModel(timetableGroup, timetableEntries, message, currentUser, false, options)); diff --git a/src/web/routes/data-sources/timetables/edit.js b/src/web/routes/data-sources/timetables/edit.js index 28fdf51..7a131bb 100644 --- a/src/web/routes/data-sources/timetables/edit.js +++ b/src/web/routes/data-sources/timetables/edit.js @@ -1,7 +1,7 @@ // Timetable group edit page renderer. -const { renderView } = require('../../../view'); -const { buildTimetableGroupFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildTimetableGroupFormViewModel } = require('#src/web/routes/data-sources/timetables/form-view-model'); module.exports = function renderTimetableGroupEditPage(timetableGroup, timetableEntries, message, currentUser) { return renderView('data-sources/timetables/form', buildTimetableGroupFormViewModel(timetableGroup, timetableEntries, message, currentUser, true)); diff --git a/src/web/routes/data-sources/timetables/list.js b/src/web/routes/data-sources/timetables/list.js index 29492e9..11784ce 100644 --- a/src/web/routes/data-sources/timetables/list.js +++ b/src/web/routes/data-sources/timetables/list.js @@ -1,6 +1,6 @@ // Timetable group list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); const { normalizeTimeZone } = require('#src/data/timetables'); function formatDateInTimeZone(value, timeZone) { diff --git a/src/web/routes/data-sources/timetables/routes.js b/src/web/routes/data-sources/timetables/routes.js index 8ed812c..a4bdecd 100644 --- a/src/web/routes/data-sources/timetables/routes.js +++ b/src/web/routes/data-sources/timetables/routes.js @@ -1,10 +1,10 @@ // Timetable route registration. -const { buildPagination } = require('../../../lib/pagination'); -const renderTimetableGroupsPage = require('./list'); -const renderTimetableGroupAddPage = require('./add'); -const renderTimetableGroupEditPage = require('./edit'); -const { buildDuplicateTimetableGroupName, buildDuplicateTimetableGroup, buildDuplicateTimetableEntry } = require('./duplicate'); +const { buildPagination } = require('#src/web/lib/pagination'); +const renderTimetableGroupsPage = require('#src/web/routes/data-sources/timetables/list'); +const renderTimetableGroupAddPage = require('#src/web/routes/data-sources/timetables/add'); +const renderTimetableGroupEditPage = require('#src/web/routes/data-sources/timetables/edit'); +const { buildDuplicateTimetableGroupName, buildDuplicateTimetableGroup, buildDuplicateTimetableEntry } = require('#src/web/routes/data-sources/timetables/duplicate'); async function getDataSourceUsageMaps(pool, common) { const [slides] = await pool.query('SELECT content_json FROM c_slides WHERE content_json IS NOT NULL'); diff --git a/src/web/routes/data-sources/weather.js b/src/web/routes/data-sources/weather.js index 4c2a5ae..4679f3c 100644 --- a/src/web/routes/data-sources/weather.js +++ b/src/web/routes/data-sources/weather.js @@ -1,12 +1,12 @@ // Weather location source CRUD routes. -const { buildPagination } = require('../../lib/pagination'); -const renderWeatherLocationsPage = require('./weather/list'); -const renderWeatherLocationAddPage = require('./weather/add'); -const renderWeatherLocationEditPage = require('./weather/edit'); -const { buildDuplicateWeatherLocationName, buildDuplicateWeatherLocation } = require('./weather/duplicate'); -const { fetchAppSettings } = require('../../../data/app-settings'); -const { buildAuditChanges } = require('../../../data/audit-log'); +const { buildPagination } = require('#src/web/lib/pagination'); +const renderWeatherLocationsPage = require('#src/web/routes/data-sources/weather/list'); +const renderWeatherLocationAddPage = require('#src/web/routes/data-sources/weather/add'); +const renderWeatherLocationEditPage = require('#src/web/routes/data-sources/weather/edit'); +const { buildDuplicateWeatherLocationName, buildDuplicateWeatherLocation } = require('#src/web/routes/data-sources/weather/duplicate'); +const { fetchAppSettings } = require('#src/data/app-settings'); +const { buildAuditChanges } = require('#src/data/audit-log'); async function getWeatherLocationUsageIds(pool, common) { const [slides] = await pool.query('SELECT content_json FROM c_slides WHERE content_json IS NOT NULL'); diff --git a/src/web/routes/data-sources/weather/add.js b/src/web/routes/data-sources/weather/add.js index 3588045..b05ea9b 100644 --- a/src/web/routes/data-sources/weather/add.js +++ b/src/web/routes/data-sources/weather/add.js @@ -1,3 +1,3 @@ -const { renderView } = require('../../../view'); -const buildWeatherLocationFormViewModel = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const buildWeatherLocationFormViewModel = require('#src/web/routes/data-sources/weather/form-view-model'); module.exports = function renderWeatherLocationAddPage(location, message, currentUser, options) { return renderView('data-sources/weather/form', buildWeatherLocationFormViewModel(location, message, currentUser, false, options)); }; \ No newline at end of file diff --git a/src/web/routes/data-sources/weather/edit.js b/src/web/routes/data-sources/weather/edit.js index 83467a5..1982231 100644 --- a/src/web/routes/data-sources/weather/edit.js +++ b/src/web/routes/data-sources/weather/edit.js @@ -1,3 +1,3 @@ -const { renderView } = require('../../../view'); -const buildWeatherLocationFormViewModel = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const buildWeatherLocationFormViewModel = require('#src/web/routes/data-sources/weather/form-view-model'); module.exports = function renderWeatherLocationEditPage(location, message, currentUser, options) { return renderView('data-sources/weather/form', buildWeatherLocationFormViewModel(location, message, currentUser, true, options)); }; \ No newline at end of file diff --git a/src/web/routes/data-sources/weather/form-view-model.js b/src/web/routes/data-sources/weather/form-view-model.js index eaa8b2f..16878f5 100644 --- a/src/web/routes/data-sources/weather/form-view-model.js +++ b/src/web/routes/data-sources/weather/form-view-model.js @@ -1,4 +1,4 @@ -const { convertWeatherSnapshot } = require('../../../../data/weather-units'); +const { convertWeatherSnapshot } = require('#src/data/weather-units'); function buildDefaultWeatherLocation() { return { id: null, enabled: 1, name: '', location_label: '', latitude: '', longitude: '', timezone: 'Europe/London', provider: 'open-meteo', temperature_unit: 'celsius', wind_unit: 'kmh', precipitation_unit: 'mm', update_interval_value: 30, update_interval_unit: 'minutes' }; diff --git a/src/web/routes/data-sources/weather/list.js b/src/web/routes/data-sources/weather/list.js index 6cce1e5..7e8e70b 100644 --- a/src/web/routes/data-sources/weather/list.js +++ b/src/web/routes/data-sources/weather/list.js @@ -1,4 +1,4 @@ -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); function formatInterval(value, unit) { const amount = Math.max(1, Number(value) || 0); diff --git a/src/web/routes/internal/sync.js b/src/web/routes/internal/sync.js index 66e6a7c..29e2ef3 100644 --- a/src/web/routes/internal/sync.js +++ b/src/web/routes/internal/sync.js @@ -2,7 +2,7 @@ const { verifyRequestAuth } = require('#src/request-auth'); const { collectFontLibrarySyncOperations } = require('#src/web/lib/media/font-library'); -const { collectLocalControlUsers } = require('../../lib/local-control-users'); +const { collectLocalControlUsers } = require('#src/web/lib/local-control-users'); function requireRequestAuth(req, res, next) { if (!verifyRequestAuth(req)) { diff --git a/src/web/routes/onboarding.js b/src/web/routes/onboarding.js index 27ad6f4..55b8875 100644 --- a/src/web/routes/onboarding.js +++ b/src/web/routes/onboarding.js @@ -2,7 +2,7 @@ const { createRequestAuthHeaders } = require('#src/request-auth'); const { fetchPlayerRegistrations } = require('#src/data/player-registry'); -const { renderView } = require('../view'); +const { renderView } = require('#src/web/view'); function wait(milliseconds) { return new Promise(function (resolve) { diff --git a/src/web/routes/register.js b/src/web/routes/register.js index f92e43a..af27fcc 100644 --- a/src/web/routes/register.js +++ b/src/web/routes/register.js @@ -1,28 +1,28 @@ // Compose the primary web route registrations. -const registerAuthRoutes = require('./auth'); -const registerPagesRoutes = require('./admin/pages'); -const registerAccountRoutes = require('./admin/account'); -const registerUsersRoutes = require('./admin/users'); -const registerPlaylistRoutes = require('./admin/playlists'); -const registerManageRoutes = require('./admin/manage'); -const registerScreenCommandRoutes = require('./admin/client-commands'); -const registerAnnouncementRoutes = require('./signage/announcements/routes'); -const registerContentRoutes = require('./admin/content'); -const registerRootDataSourceRoutes = require('./admin/data-sources'); -const registerApiSourceRoutes = require('./data-sources/api-sources/routes'); -const registerRssFeedRoutes = require('./data-sources/rss-feeds/routes'); -const registerTimetableRoutes = require('./data-sources/timetables/routes'); -const registerWeatherRoutes = require('./data-sources/weather'); -const registerSettingsRoutes = require('./settings/background-tasks'); -const registerFontRoutes = require('./settings/fonts'); -const registerMediaLibraryRoutes = require('./settings/media-library'); -const registerSettingsPageRoutes = require('./settings/routes'); -const registerAuditLogRoutes = require('./settings/audit-log'); -const registerAboutRoutes = require('./settings/about/routes'); -const registerInternalSyncRoutes = require('./internal/sync'); -const registerScreensRoutes = require('./signage/screens/routes'); -const registerOnboardingRoutes = require('./onboarding'); +const registerAuthRoutes = require('#src/web/routes/auth/index'); +const registerPagesRoutes = require('#src/web/routes/admin/pages'); +const registerAccountRoutes = require('#src/web/routes/admin/account'); +const registerUsersRoutes = require('#src/web/routes/admin/users'); +const registerPlaylistRoutes = require('#src/web/routes/admin/playlists'); +const registerManageRoutes = require('#src/web/routes/admin/manage'); +const registerScreenCommandRoutes = require('#src/web/routes/admin/client-commands'); +const registerAnnouncementRoutes = require('#src/web/routes/signage/announcements/routes'); +const registerContentRoutes = require('#src/web/routes/admin/content'); +const registerRootDataSourceRoutes = require('#src/web/routes/admin/data-sources'); +const registerApiSourceRoutes = require('#src/web/routes/data-sources/api-sources/routes'); +const registerRssFeedRoutes = require('#src/web/routes/data-sources/rss-feeds/routes'); +const registerTimetableRoutes = require('#src/web/routes/data-sources/timetables/routes'); +const registerWeatherRoutes = require('#src/web/routes/data-sources/weather'); +const registerSettingsRoutes = require('#src/web/routes/settings/background-tasks'); +const registerFontRoutes = require('#src/web/routes/settings/fonts'); +const registerMediaLibraryRoutes = require('#src/web/routes/settings/media-library'); +const registerSettingsPageRoutes = require('#src/web/routes/settings/routes'); +const registerAuditLogRoutes = require('#src/web/routes/settings/audit-log'); +const registerAboutRoutes = require('#src/web/routes/settings/about/routes'); +const registerInternalSyncRoutes = require('#src/web/routes/internal/sync'); +const registerScreensRoutes = require('#src/web/routes/signage/screens/routes'); +const registerOnboardingRoutes = require('#src/web/routes/onboarding'); const { PERMISSIONS, normalizePermissionKeys } = require('#src/rbac'); function registerRoutes(app, deps) { @@ -209,7 +209,7 @@ function registerSignageRoutes(app, deps) { function registerSettingsAndContentRoutes(app, deps) { // Content, data-source, RBAC, and settings routes share the admin-side services. - const registerRbacRoutes = require('./admin/rbac'); + const registerRbacRoutes = require('#src/web/routes/admin/rbac'); registerRbacRoutes(app, { pool: deps.pool, diff --git a/src/web/routes/settings/about/index.js b/src/web/routes/settings/about/index.js index 616d9c7..a5f0653 100644 --- a/src/web/routes/settings/about/index.js +++ b/src/web/routes/settings/about/index.js @@ -2,7 +2,7 @@ const fs = require('fs'); const path = require('path'); -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); const packageLock = require('#root/package-lock.json'); const tinyMcePackage = require('#root/src/web/public/vendor/tinymce/package.json'); diff --git a/src/web/routes/settings/fonts.js b/src/web/routes/settings/fonts.js index de9cc47..c19f307 100644 --- a/src/web/routes/settings/fonts.js +++ b/src/web/routes/settings/fonts.js @@ -3,8 +3,8 @@ const fs = require('fs'); const { hasAnyPermission, PERMISSION_DENIED_MESSAGE } = require('#src/rbac'); const fontLibrary = require('#src/web/lib/media/font-library'); -const { buildPagination } = require('../../lib/pagination'); -const { createSearchMatcher, getSearchQuery, getSortDirectionQuery, getSortQuery, parsePageNumber, sortRows } = require('../../lib/list-query'); +const { buildPagination } = require('#src/web/lib/pagination'); +const { createSearchMatcher, getSearchQuery, getSortDirectionQuery, getSortQuery, parsePageNumber, sortRows } = require('#src/web/lib/list-query'); const LIST_PAGE_SIZE = 25; diff --git a/src/web/routes/settings/fonts/list.js b/src/web/routes/settings/fonts/list.js index 430f314..bc6a96a 100644 --- a/src/web/routes/settings/fonts/list.js +++ b/src/web/routes/settings/fonts/list.js @@ -1,6 +1,6 @@ // Managed fonts settings page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderFontsPage(data, message, currentUser) { return renderView('settings/fonts/list', { diff --git a/src/web/routes/settings/index.js b/src/web/routes/settings/index.js index c01b00d..02975ea 100644 --- a/src/web/routes/settings/index.js +++ b/src/web/routes/settings/index.js @@ -1,6 +1,6 @@ // Visual-only application settings page. -const { renderView } = require('../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderSettingsPage(settings, suggestedAnnouncementIcons, currentUser, message, mediaSettings, diagnostics) { const iconOptions = Array.isArray(suggestedAnnouncementIcons) ? suggestedAnnouncementIcons : []; diff --git a/src/web/routes/settings/invitations/list.js b/src/web/routes/settings/invitations/list.js index 431cdc5..7ac8614 100644 --- a/src/web/routes/settings/invitations/list.js +++ b/src/web/routes/settings/invitations/list.js @@ -1,6 +1,6 @@ // Pending invitations page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderInvitationsPage(data, currentUser) { return renderView('settings/invitations/list', { diff --git a/src/web/routes/settings/media-library.js b/src/web/routes/settings/media-library.js index 4f3fe77..78bc72f 100644 --- a/src/web/routes/settings/media-library.js +++ b/src/web/routes/settings/media-library.js @@ -195,6 +195,7 @@ module.exports = function registerMediaLibraryRoutes(app, deps) { : Math.round(maxBytes / (1024 * 1024)) + ' MB'; return res.redirect('/media-library?message=' + encodeURIComponent('File must be ' + limitLabel + ' or smaller.')); } + await mediaLibrary.createImageVariants(req.file); await mediaLibrary.registerMediaAsset(deps.pool, Object.assign({}, req.file, { mediaType: mediaType }), '/media/uploads/' + req.file.filename, deps.getAuditUserId(req)); res.redirect('/media-library?message=' + encodeURIComponent('Media uploaded.')); } catch (error) { @@ -222,6 +223,7 @@ module.exports = function registerMediaLibraryRoutes(app, deps) { throw error; } }); + await mediaLibrary.removeImageVariants(filePath); if (typeof deps.syncPlaylistUploadsOnChange === 'function') { await deps.syncPlaylistUploadsOnChange({ key: 'media-library:delete:' + asset.id, diff --git a/src/web/routes/settings/media-library/list.js b/src/web/routes/settings/media-library/list.js index 2eb852a..73aac35 100644 --- a/src/web/routes/settings/media-library/list.js +++ b/src/web/routes/settings/media-library/list.js @@ -1,6 +1,6 @@ // Media library page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderMediaLibraryPage(data, message, currentUser) { return renderView('settings/media-library/list', { diff --git a/src/web/routes/settings/rbac/add.js b/src/web/routes/settings/rbac/add.js index df34a05..7acd270 100644 --- a/src/web/routes/settings/rbac/add.js +++ b/src/web/routes/settings/rbac/add.js @@ -1,7 +1,7 @@ // RBAC role add page renderer. -const { renderView } = require('../../../view'); -const { buildRbacAddViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildRbacAddViewModel } = require('#src/web/routes/settings/rbac/form-view-model'); module.exports = function renderRbacAddPage(message, currentUser, formValues, permissionGroups, users, pagination, messageVariant) { return renderView('settings/rbac/form', buildRbacAddViewModel(message, currentUser, formValues, permissionGroups, users, pagination, messageVariant)); diff --git a/src/web/routes/settings/rbac/edit.js b/src/web/routes/settings/rbac/edit.js index 64c91ed..faa3feb 100644 --- a/src/web/routes/settings/rbac/edit.js +++ b/src/web/routes/settings/rbac/edit.js @@ -1,7 +1,7 @@ // RBAC role edit page renderer. -const { renderView } = require('../../../view'); -const { buildRbacEditViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildRbacEditViewModel } = require('#src/web/routes/settings/rbac/form-view-model'); module.exports = function renderRbacEditPage(role, message, currentUser, permissionGroups, users, pagination) { return renderView('settings/rbac/form', buildRbacEditViewModel(role, message, currentUser, permissionGroups, users, pagination)); diff --git a/src/web/routes/settings/rbac/list.js b/src/web/routes/settings/rbac/list.js index fabcb30..e55e4a9 100644 --- a/src/web/routes/settings/rbac/list.js +++ b/src/web/routes/settings/rbac/list.js @@ -1,6 +1,6 @@ // RBAC role-and-permission list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderRbacPage(data, message, currentUser) { return renderView('settings/rbac/list', { diff --git a/src/web/routes/settings/users/add.js b/src/web/routes/settings/users/add.js index f0c3299..7dc6773 100644 --- a/src/web/routes/settings/users/add.js +++ b/src/web/routes/settings/users/add.js @@ -1,7 +1,7 @@ // User add page renderer. -const { renderView } = require('../../../view'); -const { buildUsersAddViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildUsersAddViewModel } = require('#src/web/routes/settings/users/form-view-model'); module.exports = function renderUsersAddPage(message, currentUser, roles, formValues, messageVariant) { return renderView('settings/users/form', buildUsersAddViewModel(message, currentUser, roles, formValues, messageVariant)); diff --git a/src/web/routes/settings/users/edit.js b/src/web/routes/settings/users/edit.js index 20fb5f9..79dd51d 100644 --- a/src/web/routes/settings/users/edit.js +++ b/src/web/routes/settings/users/edit.js @@ -1,7 +1,7 @@ // User edit page renderer. -const { renderView } = require('../../../view'); -const { buildUsersEditViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildUsersEditViewModel } = require('#src/web/routes/settings/users/form-view-model'); module.exports = function renderUsersEditPage(user, message, currentUser, roles, sessions) { return renderView('settings/users/form', buildUsersEditViewModel(user, message, currentUser, roles, sessions)); diff --git a/src/web/routes/settings/users/invite.js b/src/web/routes/settings/users/invite.js index af68ddc..713b265 100644 --- a/src/web/routes/settings/users/invite.js +++ b/src/web/routes/settings/users/invite.js @@ -1,4 +1,4 @@ -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderUsersInvitePage(message, currentUser, roles, formValues, messageVariant) { return renderView('settings/users/invite', { diff --git a/src/web/routes/settings/users/list.js b/src/web/routes/settings/users/list.js index 3002742..766a22b 100644 --- a/src/web/routes/settings/users/list.js +++ b/src/web/routes/settings/users/list.js @@ -1,6 +1,6 @@ // User list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderUsersPage(data, message, currentUser) { return renderView('settings/users/list', { diff --git a/src/web/routes/signage/announcements/add.js b/src/web/routes/signage/announcements/add.js index 43ec5d2..f01ab98 100644 --- a/src/web/routes/signage/announcements/add.js +++ b/src/web/routes/signage/announcements/add.js @@ -1,7 +1,7 @@ // Announcement add page renderer. -const { renderView } = require('../../../view'); -const { buildAnnouncementFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildAnnouncementFormViewModel } = require('#src/web/routes/signage/announcements/form-view-model'); module.exports = function renderAnnouncementAddPage(announcement, message, currentUser, options) { return renderView('signage/announcements/form', buildAnnouncementFormViewModel(announcement, message, currentUser, options, false)); diff --git a/src/web/routes/signage/announcements/edit.js b/src/web/routes/signage/announcements/edit.js index 9027f32..1974102 100644 --- a/src/web/routes/signage/announcements/edit.js +++ b/src/web/routes/signage/announcements/edit.js @@ -1,7 +1,7 @@ // Announcement edit page renderer. -const { renderView } = require('../../../view'); -const { buildAnnouncementFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildAnnouncementFormViewModel } = require('#src/web/routes/signage/announcements/form-view-model'); module.exports = function renderAnnouncementEditPage(announcement, _data, message, currentUser, options) { return renderView('signage/announcements/form', buildAnnouncementFormViewModel(announcement, message, currentUser, options, true)); diff --git a/src/web/routes/signage/announcements/list.js b/src/web/routes/signage/announcements/list.js index 50486cd..79e94e6 100644 --- a/src/web/routes/signage/announcements/list.js +++ b/src/web/routes/signage/announcements/list.js @@ -1,6 +1,6 @@ // Announcement list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); const { ANNOUNCEMENT_ICON_LABELS, DEFAULT_ANNOUNCEMENT_ICON } = require('#src/data/announcement-icons'); function formatDurationLabel(seconds) { diff --git a/src/web/routes/signage/announcements/routes.js b/src/web/routes/signage/announcements/routes.js index f9f2e67..821d0c0 100644 --- a/src/web/routes/signage/announcements/routes.js +++ b/src/web/routes/signage/announcements/routes.js @@ -8,11 +8,11 @@ module.exports = function registerAnnouncementRoutes(app, deps) { const getAuditUserId = deps.getAuditUserId; const redirectAfterSave = deps.redirectAfterSave; const requirePermission = deps.requirePermission; - const { buildPagination } = require('../../../lib/pagination'); + const { buildPagination } = require('#src/web/lib/pagination'); const announcementData = require('#src/data/announcements'); const announcementIcons = require('#src/data/announcement-icons'); const { fetchAppSettings } = require('#src/data/app-settings'); - const { buildDuplicateAnnouncementName, buildDuplicateAnnouncement } = require('./duplicate'); + const { buildDuplicateAnnouncementName, buildDuplicateAnnouncement } = require('#src/web/routes/signage/announcements/duplicate'); const LIST_PAGE_SIZE = 25; const ANNOUNCEMENT_TYPES = [ diff --git a/src/web/routes/signage/canvas-sizes/add.js b/src/web/routes/signage/canvas-sizes/add.js index 03436a9..8108baf 100644 --- a/src/web/routes/signage/canvas-sizes/add.js +++ b/src/web/routes/signage/canvas-sizes/add.js @@ -1,7 +1,7 @@ // Canvas size add page renderer. -const { renderView } = require('../../../view'); -const { buildCanvasSizeFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildCanvasSizeFormViewModel } = require('#src/web/routes/signage/canvas-sizes/form-view-model'); module.exports = function renderCanvasSizeAddPage(canvasSize, message, currentUser) { return renderView('canvas-sizes/form', buildCanvasSizeFormViewModel(canvasSize, message, currentUser, false)); diff --git a/src/web/routes/signage/canvas-sizes/edit.js b/src/web/routes/signage/canvas-sizes/edit.js index da16bf5..098abad 100644 --- a/src/web/routes/signage/canvas-sizes/edit.js +++ b/src/web/routes/signage/canvas-sizes/edit.js @@ -1,7 +1,7 @@ // Canvas size edit page renderer. -const { renderView } = require('../../../view'); -const { buildCanvasSizeFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildCanvasSizeFormViewModel } = require('#src/web/routes/signage/canvas-sizes/form-view-model'); module.exports = function renderCanvasSizeEditPage(canvasSize, _data, message, currentUser) { return renderView('canvas-sizes/form', buildCanvasSizeFormViewModel(canvasSize, message, currentUser, true)); diff --git a/src/web/routes/signage/canvas-sizes/form-view-model.js b/src/web/routes/signage/canvas-sizes/form-view-model.js index cdf8254..59a055b 100644 --- a/src/web/routes/signage/canvas-sizes/form-view-model.js +++ b/src/web/routes/signage/canvas-sizes/form-view-model.js @@ -1,6 +1,6 @@ // Shared canvas size form view-model builder. -const { MAX_CANVAS_SIZE_DIMENSION } = require('#src/data'); +const { MAX_CANVAS_SIZE_DIMENSION } = require('#src/data/index'); function buildDefaultCanvasSize() { return { diff --git a/src/web/routes/signage/canvas-sizes/list.js b/src/web/routes/signage/canvas-sizes/list.js index 0195b66..5df0b34 100644 --- a/src/web/routes/signage/canvas-sizes/list.js +++ b/src/web/routes/signage/canvas-sizes/list.js @@ -1,6 +1,6 @@ // Canvas size list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderCanvasSizesPage(data, message, currentUser) { const canvasSizes = (data.canvasSizes || []).map((size) => ({ diff --git a/src/web/routes/signage/canvas-sizes/routes.js b/src/web/routes/signage/canvas-sizes/routes.js index 1d4a31c..a06dea0 100644 --- a/src/web/routes/signage/canvas-sizes/routes.js +++ b/src/web/routes/signage/canvas-sizes/routes.js @@ -4,7 +4,7 @@ module.exports = function registerCanvasSizeRoutes(app, deps) { const pages = deps.pages; const common = deps.common; const pool = deps.pool; - const { buildPagination } = require('../../../lib/pagination'); + const { buildPagination } = require('#src/web/lib/pagination'); const requirePermission = deps.requirePermission; const LIST_PAGE_SIZE = 25; diff --git a/src/web/routes/signage/clients/list.js b/src/web/routes/signage/clients/list.js index d4184db..afe5dbd 100644 --- a/src/web/routes/signage/clients/list.js +++ b/src/web/routes/signage/clients/list.js @@ -1,6 +1,6 @@ // Connected clients list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderConnectedClientsPage(data, message, currentUser) { return renderView('clients/list', { diff --git a/src/web/routes/signage/clients/routes.js b/src/web/routes/signage/clients/routes.js index c03b399..905ab7e 100644 --- a/src/web/routes/signage/clients/routes.js +++ b/src/web/routes/signage/clients/routes.js @@ -5,8 +5,8 @@ module.exports = function registerClientsRoutes(app, deps) { const common = deps.common; const pages = deps.pages; const buildDashboardState = deps.buildDashboardState; - const { buildPagination } = require('../../../lib/pagination'); - const { compareSortValues, createSearchMatcher, getComparableSortValue } = require('../../../lib/list-query'); + const { buildPagination } = require('#src/web/lib/pagination'); + const { compareSortValues, createSearchMatcher, getComparableSortValue } = require('#src/web/lib/list-query'); const requirePermission = deps.requirePermission; const LIST_PAGE_SIZE = 25; diff --git a/src/web/routes/signage/dashboard/index.js b/src/web/routes/signage/dashboard/index.js index c1d9b1a..37f491a 100644 --- a/src/web/routes/signage/dashboard/index.js +++ b/src/web/routes/signage/dashboard/index.js @@ -1,6 +1,6 @@ // Dashboard page renderer for the signage overview. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderDashboardPage(data, message, currentUser) { return renderView('dashboard/index', { diff --git a/src/web/routes/signage/playlists/add.js b/src/web/routes/signage/playlists/add.js index 43ae3a6..80ff5a6 100644 --- a/src/web/routes/signage/playlists/add.js +++ b/src/web/routes/signage/playlists/add.js @@ -1,6 +1,6 @@ // Playlist add page renderer. -const renderPlaylistEditorPage = require('./form-page'); +const renderPlaylistEditorPage = require('#src/web/routes/signage/playlists/form-page'); module.exports = async function renderPlaylistFormPage(playlistOrMessage, messageOrCurrentUser, currentUserOrData, dataOrPool, poolMaybe) { const hasPlaylistArgument = arguments.length >= 5; @@ -9,7 +9,7 @@ module.exports = async function renderPlaylistFormPage(playlistOrMessage, messag const currentUser = hasPlaylistArgument ? currentUserOrData : messageOrCurrentUser; const data = hasPlaylistArgument ? dataOrPool : currentUserOrData; const pool = hasPlaylistArgument ? poolMaybe : dataOrPool; - const adminData = data || (pool ? await require('#src/data').fetchAdminData(pool) : { slides: [] }); + const adminData = data || (pool ? await require('#src/data/index').fetchAdminData(pool) : { slides: [] }); return renderPlaylistEditorPage(playlist, adminData, message, currentUser, { isEdit: false }); }; diff --git a/src/web/routes/signage/playlists/edit.js b/src/web/routes/signage/playlists/edit.js index 6577090..8877e8f 100644 --- a/src/web/routes/signage/playlists/edit.js +++ b/src/web/routes/signage/playlists/edit.js @@ -1,6 +1,6 @@ // Playlist edit page renderer. -const renderPlaylistEditorPage = require('./form-page'); +const renderPlaylistEditorPage = require('#src/web/routes/signage/playlists/form-page'); module.exports = function renderPlaylistEditPage(playlist, data, message, currentUser) { return renderPlaylistEditorPage(playlist, data || {}, message, currentUser, { isEdit: true }); diff --git a/src/web/routes/signage/playlists/form-page.js b/src/web/routes/signage/playlists/form-page.js index 80c8cdb..74563f6 100644 --- a/src/web/routes/signage/playlists/form-page.js +++ b/src/web/routes/signage/playlists/form-page.js @@ -1,7 +1,7 @@ // Shared playlist form page renderer. -const { renderView } = require('../../../view'); -const { buildPlaylistFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildPlaylistFormViewModel } = require('#src/web/routes/signage/playlists/form-view-model'); module.exports = function renderPlaylistFormPage(playlist, data, message, currentUser, options) { return renderView('playlists/form', buildPlaylistFormViewModel(playlist || null, data || {}, message, currentUser, options || {})); diff --git a/src/web/routes/signage/playlists/list.js b/src/web/routes/signage/playlists/list.js index d2d9dc2..1d93b29 100644 --- a/src/web/routes/signage/playlists/list.js +++ b/src/web/routes/signage/playlists/list.js @@ -1,6 +1,6 @@ // Playlist list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderPlaylistsPage(data, message, currentUser) { const playlists = (data.playlists || []).map((playlist) => { diff --git a/src/web/routes/signage/playlists/routes.js b/src/web/routes/signage/playlists/routes.js index 844085e..cc3f681 100644 --- a/src/web/routes/signage/playlists/routes.js +++ b/src/web/routes/signage/playlists/routes.js @@ -5,9 +5,9 @@ module.exports = function registerPlaylistsRoutes(app, deps) { const common = deps.common; const pages = deps.pages; const fetchScreensByPlaylistId = deps.fetchScreensByPlaylistId; - const { buildPagination } = require('../../../lib/pagination'); + const { buildPagination } = require('#src/web/lib/pagination'); const requirePermission = deps.requirePermission; - const { buildDuplicatePlaylistName, buildDuplicatePlaylist } = require('./duplicate'); + const { buildDuplicatePlaylistName, buildDuplicatePlaylist } = require('#src/web/routes/signage/playlists/duplicate'); const { fetchAppSettings } = require('#src/data/app-settings'); const LIST_PAGE_SIZE = 25; diff --git a/src/web/routes/signage/playlists/slide-config.js b/src/web/routes/signage/playlists/slide-config.js index 5894460..68043de 100644 --- a/src/web/routes/signage/playlists/slide-config.js +++ b/src/web/routes/signage/playlists/slide-config.js @@ -1,6 +1,6 @@ // Shared playlist slide configuration rendering helpers. -const { renderFragment } = require('../../../view'); +const { renderFragment } = require('#src/web/view'); const { formatScheduleRuleSummary, formatScheduleRulesSummary, normalizeDayValues } = require('#src/web/lib/playlist-schedule'); const DAY_OPTIONS = [ diff --git a/src/web/routes/signage/screens/add.js b/src/web/routes/signage/screens/add.js index 48df50e..fa4b971 100644 --- a/src/web/routes/signage/screens/add.js +++ b/src/web/routes/signage/screens/add.js @@ -1,7 +1,7 @@ // Screen add page renderer. -const { renderView } = require('../../../view'); -const { buildScreenFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildScreenFormViewModel } = require('#src/web/routes/signage/screens/form-view-model'); module.exports = function renderScreenFormPage(data, message, currentUser) { return renderView('screens/form', buildScreenFormViewModel(null, data || {}, message, currentUser, false)); diff --git a/src/web/routes/signage/screens/edit.js b/src/web/routes/signage/screens/edit.js index a434a55..e58ff46 100644 --- a/src/web/routes/signage/screens/edit.js +++ b/src/web/routes/signage/screens/edit.js @@ -1,7 +1,7 @@ // Screen edit page renderer. -const { renderView } = require('../../../view'); -const { buildScreenFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildScreenFormViewModel } = require('#src/web/routes/signage/screens/form-view-model'); module.exports = function renderScreenEditPage(screen, data, message, currentUser) { return renderView('screens/form', buildScreenFormViewModel(screen, data || {}, message, currentUser, true)); diff --git a/src/web/routes/signage/screens/list.js b/src/web/routes/signage/screens/list.js index cc86874..f8d34c1 100644 --- a/src/web/routes/signage/screens/list.js +++ b/src/web/routes/signage/screens/list.js @@ -1,6 +1,6 @@ // Screen list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderScreensPage(data, message, currentUser) { return renderView('screens/list', { diff --git a/src/web/routes/signage/screens/routes.js b/src/web/routes/signage/screens/routes.js index 8f7e576..245fa05 100644 --- a/src/web/routes/signage/screens/routes.js +++ b/src/web/routes/signage/screens/routes.js @@ -8,7 +8,7 @@ module.exports = function registerScreensRoutes(app, deps) { const pages = deps.pages; const buildDashboardState = deps.buildDashboardState; const getScreenDeleteBlockMessage = deps.getScreenDeleteBlockMessage; - const { buildPagination } = require('../../../lib/pagination'); + const { buildPagination } = require('#src/web/lib/pagination'); const requirePermission = deps.requirePermission; const LIST_PAGE_SIZE = 25; diff --git a/src/web/routes/signage/slides/add.js b/src/web/routes/signage/slides/add.js index 897ddc7..371ea1d 100644 --- a/src/web/routes/signage/slides/add.js +++ b/src/web/routes/signage/slides/add.js @@ -1,7 +1,7 @@ // Slide add page renderer. -const { renderView } = require('../../../view'); -const { buildSlideFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildSlideFormViewModel } = require('#src/web/routes/signage/slides/form-view-model'); module.exports = function renderSlideAddPage(slideOrData, dataOrMessage, messageOrCurrentUser, currentUserMaybe) { const hasSlideArgument = arguments.length >= 4; diff --git a/src/web/routes/signage/slides/edit.js b/src/web/routes/signage/slides/edit.js index 70523e0..7c7938d 100644 --- a/src/web/routes/signage/slides/edit.js +++ b/src/web/routes/signage/slides/edit.js @@ -1,7 +1,7 @@ // Slide edit page renderer. -const { renderView } = require('../../../view'); -const { buildSlideFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildSlideFormViewModel } = require('#src/web/routes/signage/slides/form-view-model'); module.exports = function renderSlideEditPage(data, slide, message, currentUser) { return renderView('slides/form', buildSlideFormViewModel(data || {}, slide || null, message, currentUser, true)); diff --git a/src/web/routes/signage/slides/form-view-model.js b/src/web/routes/signage/slides/form-view-model.js index 75df25e..4a97f98 100644 --- a/src/web/routes/signage/slides/form-view-model.js +++ b/src/web/routes/signage/slides/form-view-model.js @@ -1,6 +1,6 @@ // Shared slide form view-model builder. -const { getRegionEditorScripts } = require('../../../lib/region-scripts'); +const { getRegionEditorScripts } = require('#src/web/lib/region-scripts'); function buildDefaultSlide() { return { diff --git a/src/web/routes/signage/slides/list.js b/src/web/routes/signage/slides/list.js index 96b0aea..6a64e4a 100644 --- a/src/web/routes/signage/slides/list.js +++ b/src/web/routes/signage/slides/list.js @@ -1,6 +1,6 @@ // Slide list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderSlidesPage(data, message, currentUser) { return renderView('slides/list', { diff --git a/src/web/routes/signage/slides/routes.js b/src/web/routes/signage/slides/routes.js index fe2ba9f..1be9875 100644 --- a/src/web/routes/signage/slides/routes.js +++ b/src/web/routes/signage/slides/routes.js @@ -1,6 +1,6 @@ // Slide route registration and pagination wiring. -const { renderFragment } = require('../../../view'); +const { renderFragment } = require('#src/web/view'); const fs = require('fs'); const crypto = require('crypto'); const path = require('path'); @@ -19,7 +19,7 @@ module.exports = function registerSlidesRoutes(app, deps) { const pool = deps.pool; const mediaDir = String(deps.mediaDir || path.join(__dirname, '..', '..', '..', '..', 'media')).trim(); const webBaseUrl = String(deps.webBaseUrl || '').trim().replace(/\/$/, ''); - const { buildPagination } = require('../../../lib/pagination'); + const { buildPagination } = require('#src/web/lib/pagination'); const requirePermission = deps.requirePermission; function requireRequestAuth(req, res, next) { @@ -134,6 +134,7 @@ module.exports = function registerSlidesRoutes(app, deps) { const payload = buildThumbnailPreviewPayload(slide, { baseUrl: webBaseUrl || (String(req.headers.host || '').trim() ? `${req.protocol}://${String(req.headers.host).trim()}` : ''), fontStylesheetHref: getFontStylesheetHref(mediaDir), + apiSources: apiSources, getItem: getItem, getCachedImagePath: getCachedImagePath }); diff --git a/src/web/routes/signage/templates/add.js b/src/web/routes/signage/templates/add.js index 4af64d5..5f39f7f 100644 --- a/src/web/routes/signage/templates/add.js +++ b/src/web/routes/signage/templates/add.js @@ -1,8 +1,8 @@ // Template add page renderer. -const { renderView } = require('../../../view'); -const { buildTemplateFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildTemplateFormViewModel } = require('#src/web/routes/signage/templates/form-view-model'); -module.exports = function renderTemplateAddPage(template, message, canvasSizes, currentUser, mediaAssets) { - return renderView('templates/form', buildTemplateFormViewModel(template, message, canvasSizes, currentUser, false, mediaAssets)); +module.exports = function renderTemplateAddPage(template, message, canvasSizes, currentUser, mediaAssets, imageUploadMaxBytes) { + return renderView('templates/form', buildTemplateFormViewModel(template, message, canvasSizes, currentUser, false, mediaAssets, imageUploadMaxBytes)); }; diff --git a/src/web/routes/signage/templates/edit.js b/src/web/routes/signage/templates/edit.js index e648008..ec1f934 100644 --- a/src/web/routes/signage/templates/edit.js +++ b/src/web/routes/signage/templates/edit.js @@ -1,8 +1,8 @@ // Template edit page renderer. -const { renderView } = require('../../../view'); -const { buildTemplateFormViewModel } = require('./form-view-model'); +const { renderView } = require('#src/web/view'); +const { buildTemplateFormViewModel } = require('#src/web/routes/signage/templates/form-view-model'); -module.exports = function renderTemplateEditPage(template, data, message, currentUser, mediaAssets) { - return renderView('templates/form', buildTemplateFormViewModel(template, message, data && data.canvasSizes ? data.canvasSizes : [], currentUser, true, mediaAssets)); +module.exports = function renderTemplateEditPage(template, data, message, currentUser, mediaAssets, imageUploadMaxBytes) { + return renderView('templates/form', buildTemplateFormViewModel(template, message, data && data.canvasSizes ? data.canvasSizes : [], currentUser, true, mediaAssets, imageUploadMaxBytes)); }; diff --git a/src/web/routes/signage/templates/form-view-model.js b/src/web/routes/signage/templates/form-view-model.js index 0344624..3448854 100644 --- a/src/web/routes/signage/templates/form-view-model.js +++ b/src/web/routes/signage/templates/form-view-model.js @@ -1,7 +1,7 @@ // Shared template form view-model builder. -const { getRegionEditorScripts } = require('../../../lib/region-scripts'); -const animationPresets = require('../../../public/js/templates/animation-presets'); +const { getRegionEditorScripts } = require('#src/web/lib/region-scripts'); +const animationPresets = require('#src/web/public/js/templates/animation-presets'); function buildDefaultTemplate() { return { @@ -43,7 +43,7 @@ function resolveTemplateCanvasSize(template, canvasSizes) { }); } -function buildTemplateFormViewModel(template, message, canvasSizes, currentUser, isEdit, mediaAssets) { +function buildTemplateFormViewModel(template, message, canvasSizes, currentUser, isEdit, mediaAssets, imageUploadMaxBytes) { const current = resolveTemplateCanvasSize(template || buildDefaultTemplate(), canvasSizes || []); const assetVersion = Date.now().toString(36); @@ -65,6 +65,7 @@ function buildTemplateFormViewModel(template, message, canvasSizes, currentUser, deleteConfirmMessage: isEdit ? 'Delete this template?' : '', canvasSizes: canvasSizes || [], mediaAssets: Array.isArray(mediaAssets) ? mediaAssets : [], + imageUploadMaxBytes: Number(imageUploadMaxBytes) || 100 * 1024 * 1024, animationPresets: animationPresets, scripts: ['js/lib/modal.js?v=' + assetVersion, 'js/templates/animation-presets.js?v=' + assetVersion, 'vendor/qr-code-styling/qr-code-styling-loader.js?v=' + assetVersion].concat(getRegionEditorScripts(assetVersion), ['js/templates/template-designer-utils.js?v=' + assetVersion, 'js/templates/template-designer.js?v=' + assetVersion]) }; diff --git a/src/web/routes/signage/templates/list.js b/src/web/routes/signage/templates/list.js index f1ce741..9ed4c0b 100644 --- a/src/web/routes/signage/templates/list.js +++ b/src/web/routes/signage/templates/list.js @@ -1,6 +1,6 @@ // Template list page renderer. -const { renderView } = require('../../../view'); +const { renderView } = require('#src/web/view'); module.exports = function renderTemplatesPage(data, message, currentUser) { const templates = (data.templates || []).map((template) => ({ diff --git a/src/web/routes/signage/templates/routes.js b/src/web/routes/signage/templates/routes.js index 2f9ee84..a78fd4d 100644 --- a/src/web/routes/signage/templates/routes.js +++ b/src/web/routes/signage/templates/routes.js @@ -4,7 +4,7 @@ module.exports = function registerTemplatesRoutes(app, deps) { const pages = deps.pages; const common = deps.common; const pool = deps.pool; - const { buildPagination } = require('../../../lib/pagination'); + const { buildPagination } = require('#src/web/lib/pagination'); const requirePermission = deps.requirePermission; const LIST_PAGE_SIZE = 25; diff --git a/src/web/view.js b/src/web/view.js index b805fd4..99d1dfa 100644 --- a/src/web/view.js +++ b/src/web/view.js @@ -4,9 +4,9 @@ const fs = require('fs'); const path = require('path'); const Handlebars = require('handlebars'); const { version: appVersion } = require('#root/package.json'); -const { hasPermission, hasAnyPermission } = require('../rbac'); -const { registerHandlebars } = require('./handlebars'); -const { getMessageVariant: inferMessageVariant } = require('./public/js/toast'); +const { hasPermission, hasAnyPermission } = require('#src/rbac'); +const { registerHandlebars } = require('#src/web/handlebars'); +const { getMessageVariant: inferMessageVariant } = require('#src/web/public/js/toast'); const VIEWS_ROOT = path.join(__dirname, 'views'); const cache = new Map(); diff --git a/src/web/views/settings/media-library/list.hbs b/src/web/views/settings/media-library/list.hbs index f41bd16..53915d1 100644 --- a/src/web/views/settings/media-library/list.hbs +++ b/src/web/views/settings/media-library/list.hbs @@ -173,4 +173,5 @@ {{/modal-shell}} + \ No newline at end of file diff --git a/src/web/views/signage/slides/form.hbs b/src/web/views/signage/slides/form.hbs index 1b03dca..1aa63d4 100644 --- a/src/web/views/signage/slides/form.hbs +++ b/src/web/views/signage/slides/form.hbs @@ -126,6 +126,7 @@ + diff --git a/src/web/views/signage/slides/popup-preview.hbs b/src/web/views/signage/slides/popup-preview.hbs index a281288..d5f094e 100644 --- a/src/web/views/signage/slides/popup-preview.hbs +++ b/src/web/views/signage/slides/popup-preview.hbs @@ -44,6 +44,11 @@ background: transparent; } + #popup-preview-canvas .template-region.chart, + #popup-preview-canvas .slide-preview-chart-region { + background: transparent !important; + } + .slide-preview-text-content { line-height: 1.5; } @@ -74,6 +79,9 @@ + + + {{#if popupPreviewPayloadJson}} + {{#> modal-shell modalId="region-add-modal" modalLabelId="region-add-modal-label" modalDialogClass="modal-dialog-centered"}} diff --git a/test/chart-data.test.js b/test/chart-data.test.js new file mode 100644 index 0000000..bf19256 --- /dev/null +++ b/test/chart-data.test.js @@ -0,0 +1,215 @@ +const test = require('node:test'); +const assert = require('node:assert/strict'); +const fs = require('node:fs'); +const vm = require('node:vm'); + +function loadChartData() { + const context = { window: {} }; + vm.runInNewContext(fs.readFileSync('src/web/public/js/regions/chart-data.js', 'utf8'), context); + return context.window.pulseChartData; +} + +function loadChartEditor() { + const definition = {}; + const context = { + window: { + pulseChartData: loadChartData(), + pulseRegionTypes: { register: (_type, value) => Object.assign(definition, value) }, + pulseRegionUtils: { escapeHtml: (value) => String(value ?? '').replace(/&/g, '&').replace(//g, '>').replace(/"/g, '"') } + } + }; + vm.runInNewContext(fs.readFileSync('src/web/public/js/regions/type/chart.js', 'utf8'), context); + return definition; +} + +test('normalizes manual chart rows into Chart.js data', () => { + const chartData = loadChartData(); + const result = chartData.fromContent({ + chart_type: 'line', + dataset_label: 'Visitors', + label_path: 'day', + value_path: 'count', + manual_rows: [ + { day: 'Mon', count: '12' }, + { day: 'Tue', count: 18 } + ] + }, []); + + assert.equal(result.type, 'line'); + assert.deepEqual(Array.from(result.labels), ['Mon', 'Tue']); + assert.deepEqual(Array.from(result.datasets[0].data), [12, 18]); + assert.equal(result.datasets[0].label, 'Visitors'); +}); + +test('uses an API source default items path and ignores non-numeric rows', () => { + const chartData = loadChartData(); + const result = chartData.fromContent({ + source_kind: 'api', + source_id: 4, + label_path: 'name', + value_path: 'total' + }, [{ + id: 4, + items_path: 'payload.rows', + responseJson: { + payload: { rows: [ + { name: 'A', total: '1,200' }, + { name: 'Missing', total: 'n/a' }, + { name: 'B', total: 4 } + ] } + } + }]); + + assert.deepEqual(Array.from(result.labels), ['A', 'B']); + assert.deepEqual(Array.from(result.datasets[0].data), [1200, 4]); +}); + +test('normalizes multiple series for line charts', () => { + const chartData = loadChartData(); + const result = chartData.fromContent({ + chart_type: 'line', + label_path: 'label', + colors: ['#111111', '#222222'], + datasets: [ + { label: 'Sales', value_path: 'sales' }, + { label: 'Returns', value_path: 'returns', color: '#333333' } + ], + manual_rows: [ + { label: 'A', sales: 10, returns: 2 }, + { label: 'B', sales: 20, returns: 3, color: '#abcdef' }, + { label: 'C', sales: 30, returns: 4 } + ] + }, []); + + assert.deepEqual(Array.from(result.labels), ['A', 'B', 'C']); + assert.deepEqual(Array.from(result.datasets[0].data), [10, 20, 30]); + assert.deepEqual(Array.from(result.datasets[1].data), [2, 3, 4]); + assert.equal(result.datasets[0].backgroundColor, '#111111'); + assert.equal(result.datasets[1].backgroundColor, '#333333'); +}); + +test('uses per-item colors for bar values', () => { + const chartData = loadChartData(); + const result = chartData.fromContent({ + chart_type: 'bar', + label_path: 'label', + value_path: 'value', + manual_rows: [ + { label: 'A', value: 10 }, + { label: 'B', value: 20 }, + { label: 'C', value: 30 } + ] + }, []); + + assert.deepEqual(Array.from(result.datasets[0].backgroundColor), ['#36a269', '#3b82f6', '#f59e0b']); + assert.deepEqual(Array.from(result.datasets[0].borderColor), ['#36a269', '#3b82f6', '#f59e0b']); +}); + +test('applies source ordering, limits, and missing-value settings', () => { + const chartData = loadChartData(); + const result = chartData.fromContent({ + chart_type: 'line', + label_path: 'label', + source_options: { sort: 'value-descending', limit: 2, missing: 'zero' }, + datasets: [ + { label: 'Sales', value_path: 'sales' }, + { label: 'Returns', value_path: 'returns' } + ], + manual_rows: [ + { label: 'B', sales: 20 }, + { label: 'A', sales: 10, returns: 1 }, + { label: 'C', sales: 30, returns: 3 } + ] + }, []); + + assert.deepEqual(Array.from(result.labels), ['C', 'B']); + assert.deepEqual(Array.from(result.datasets[0].data), [30, 20]); + assert.deepEqual(Array.from(result.datasets[1].data), [3, 0]); +}); + +test('supports reverse original source order', () => { + const chartData = loadChartData(); + const result = chartData.fromContent({ + chart_type: 'bar', + label_path: 'label', + value_path: 'value', + source_options: { sort: 'reverse-original' }, + manual_rows: [ + { label: 'A', value: 10 }, + { label: 'B', value: 20 }, + { label: 'C', value: 30 } + ] + }, []); + + assert.deepEqual(Array.from(result.labels), ['C', 'B', 'A']); +}); + +test('builds chart options from chart settings', () => { + const chartData = loadChartData(); + const data = chartData.fromContent({ + chart_type: 'bar', + chart_options: { legend: 'show', bar_orientation: 'horizontal', y_axis_min: 10, y_axis_max: 100, grid_color: '#123456', text_color: '#654321', text_size: 20 }, + value_path: 'value', + manual_rows: [{ label: 'A', value: 20 }] + }, []); + const options = chartData.getChartOptions(data); + + assert.equal(options.indexAxis, 'y'); + assert.equal(options.plugins.legend.display, true); + assert.equal(options.scales.x.min, 10); + assert.equal(options.scales.x.max, 100); + assert.equal(options.scales.x.grid.color, '#123456'); + assert.equal(options.scales.y.grid.color, '#123456'); + assert.equal(options.scales.x.ticks.color, '#654321'); + assert.equal(options.plugins.legend.labels.color, '#654321'); + assert.equal(options.font.size, 20); + assert.equal(options.scales.x.ticks.font.size, 20); + assert.equal(options.plugins.legend.labels.font.size, 20); + assert.equal(options.plugins.tooltip.bodyFont.size, 20); + assert.equal(options.plugins.tooltip.bodyColor, '#654321'); +}); + +test('clamps chart text size to supported bounds', () => { + const chartData = loadChartData(); + assert.equal(chartData.normalizeConfig({ chart_options: { text_size: 64 } }).chart_options.text_size, 48); + assert.equal(chartData.normalizeConfig({ chart_options: { text_size: 4 } }).chart_options.text_size, 8); + assert.equal(chartData.normalizeConfig({}).chart_options.text_size, 12); +}); + +test('renders repeatable dataset controls instead of a JSON series editor', () => { + const editor = loadChartEditor(); + const html = editor.renderEditorCard({ + region: { id: 7, label: 'Revenue' }, + config: { + type: 'bar', + source_kind: 'api', + datasets: [{ label: 'Sales', value_path: 'sales', color: '' }], + dataset_label: 'Value', + value_path: 'value', + colors_text: '#111111, #222222', + manual_rows_json: '[]' + }, + sourceOptions: '' + }); + + assert.match(html, /data-chart-datasets/); + assert.match(html, /data-chart-dataset-add/); + assert.match(html, /data-chart-dataset-remove/); + assert.match(html, /data-chart-source-panel="api"/); + assert.match(html, /data-chart-source-panel="manual"/); + assert.match(html, /data-chart-dataset-editor hidden/); + assert.match(html, /Series color/); + assert.match(html, /data-chart-dataset-color[^>]*type="color"/); + assert.doesNotMatch(html, /data-chart-dataset-color-auto/); + assert.doesNotMatch(html, /Default series label/); + assert.doesNotMatch(html, /Color palette/); + assert.doesNotMatch(html, /Series mappings \(JSON\)/); + assert.match(html, /Chart options/); + assert.match(html, /Source options/); + assert.match(html, /region_chart_value_format_7/); + assert.match(html, /region_chart_text_size_7/); + assert.match(html, /region_chart_source_missing_7/); + assert.match(html, /data-chart-option-types="line bar"/); + assert.match(html, />Increasing valuesDecreasing values { assert.equal(normalizeMediaPath('/assets/photo.png'), null); }); +test('media library optimizes large raster uploads in place', async () => { + const uploadDir = await fs.promises.mkdtemp(path.join(os.tmpdir(), 'pulse-media-optimize-')); + const filePath = path.join(uploadDir, 'large.jpg'); + const sourceBuffer = await sharp(crypto.randomBytes(5000 * 100 * 3), { + raw: { width: 5000, height: 100, channels: 3 } + }).jpeg({ quality: 100 }).toBuffer(); + await fs.promises.writeFile(filePath, sourceBuffer); + + try { + const file = { path: filePath, size: sourceBuffer.length }; + await optimizeUploadedImage(file, { maxDimension: 8192 }); + const optimizedStats = await fs.promises.stat(filePath); + + assert.equal(file.path, filePath); + assert.equal(file.size, optimizedStats.size); + assert.ok(optimizedStats.size < sourceBuffer.length); + const metadata = await sharp(filePath).metadata(); + assert.equal(metadata.format, 'jpeg'); + assert.equal(metadata.width, 5000); + } finally { + await fs.promises.rm(uploadDir, { recursive: true, force: true }); + } +}); + +test('media library creates only smaller image variants and preserves the original', async () => { + const uploadDir = await fs.promises.mkdtemp(path.join(os.tmpdir(), 'pulse-media-variants-')); + const filePath = path.join(uploadDir, 'large.jpg'); + const sourceBuffer = await sharp(crypto.randomBytes(5000 * 100 * 3), { + raw: { width: 5000, height: 100, channels: 3 } + }).jpeg({ quality: 100 }).toBuffer(); + await fs.promises.writeFile(filePath, sourceBuffer); + + try { + const variants = await createImageVariants({ path: filePath }); + assert.deepEqual(variants.map(function (variant) { return variant.width; }), [2048, 4096]); + assert.equal((await fs.promises.stat(filePath)).size, sourceBuffer.length); + for (const variant of variants) { + const variantPath = path.join(uploadDir, path.basename(variant.path)); + assert.ok((await fs.promises.stat(variantPath)).size < sourceBuffer.length); + } + await removeImageVariants(filePath); + assert.equal((await fs.promises.readdir(uploadDir)).filter(function (name) { return name.includes('.variant-'); }).length, 0); + } finally { + await fs.promises.rm(uploadDir, { recursive: true, force: true }); + } +}); + test('media library registers uploaded files with their metadata', async () => { const queries = []; const pool = { diff --git a/test/player-announcement-marquee.test.js b/test/player-announcement-marquee.test.js index 819286e..cf21d38 100644 --- a/test/player-announcement-marquee.test.js +++ b/test/player-announcement-marquee.test.js @@ -5,17 +5,18 @@ const test = require('node:test'); const assert = require('node:assert/strict'); function loadAnnouncementTemplateHelpers() { + const sharedScriptPath = path.join(__dirname, '..', 'src', 'player', 'rendering-shared.js'); const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-announcement-templates.js'); + const sharedScript = fs.readFileSync(sharedScriptPath, 'utf8'); const script = fs.readFileSync(scriptPath, 'utf8'); const sandbox = { window: {}, - module: { exports: {} }, - exports: {}, console }; sandbox.window = sandbox; + vm.runInNewContext(sharedScript, sandbox, { filename: sharedScriptPath }); vm.runInNewContext(script, sandbox, { filename: scriptPath }); return sandbox; } @@ -105,4 +106,82 @@ test('announcement markup strips line breaks from the message', () => { assert.match(markup, /First line Second line Third line/); assert.doesNotMatch(markup, //i); +}); + +test('announcement fallback polling stops when the websocket opens and resumes when it closes', () => { + const intervals = new Map(); + const listeners = new Map(); + let nextTimerId = 1; + let announcementSocket = null; + let announcementRequests = 0; + + class MockWebSocket { + constructor() { + this.readyState = MockWebSocket.CONNECTING; + announcementSocket = this; + } + + open() { + this.readyState = MockWebSocket.OPEN; + if (this.onopen) this.onopen(); + } + + close() { + this.readyState = MockWebSocket.CLOSED; + if (this.onclose) this.onclose(); + } + } + MockWebSocket.CONNECTING = 0; + MockWebSocket.OPEN = 1; + MockWebSocket.CLOSED = 3; + + class MockXhr { + open() {} + setRequestHeader() {} + send() { announcementRequests += 1; } + } + + const window = { + slug: 'test', + location: { origin: 'http://localhost:8081' }, + WebSocket: MockWebSocket, + setInterval(callback, delay) { + const id = nextTimerId++; + intervals.set(id, { callback: callback, delay: delay }); + return id; + }, + clearInterval(id) { intervals.delete(id); }, + setTimeout() { return nextTimerId++; }, + clearTimeout() {}, + addEventListener() {} + }; + const sandbox = { + window: window, + document: { + readyState: 'loading', + addEventListener(name, callback) { listeners.set(name, callback); } + }, + WebSocket: MockWebSocket, + XMLHttpRequest: MockXhr, + URL, + Date, + JSON, + String, + Array, + Math + }; + const scriptPath = path.join(__dirname, '..', 'src', 'player', 'player-page-announcements.js'); + vm.runInNewContext(fs.readFileSync(scriptPath, 'utf8'), sandbox, { filename: scriptPath }); + + listeners.get('DOMContentLoaded')(); + assert.equal(announcementRequests, 0); + assert.equal(intervals.size, 1); + assert.equal(Array.from(intervals.values())[0].delay, 15000); + + announcementSocket.open(); + assert.equal(announcementRequests, 1); + assert.equal(intervals.size, 0); + + announcementSocket.close(); + assert.equal(intervals.size, 1); }); \ No newline at end of file diff --git a/test/player-bridge-state.test.js b/test/player-bridge-state.test.js new file mode 100644 index 0000000..9c91637 --- /dev/null +++ b/test/player-bridge-state.test.js @@ -0,0 +1,28 @@ +const test = require('node:test'); +const assert = require('node:assert/strict'); + +const { createPlayerBridgeState } = require('../src/player-bridge/connection-state'); + +test('bridge state merges snapshot sources and tracks device ids', () => { + const state = createPlayerBridgeState(); + + state.setScreenSnapshotSource('demo-screen', 'player-a', [{ clientId: 'client-1' }]); + state.setScreenSnapshotSource('demo-screen', 'player-b', [{ clientId: 'client-2' }]); + + const snapshot = state.buildMergedScreenSnapshot('demo-screen'); + assert.equal(snapshot.count, 2); + assert.deepEqual(snapshot.deviceIds.sort(), ['player-a', 'player-b']); + assert.equal(state.getScreenSnapshotCount('demo-screen'), 2); +}); + +test('bridge state clears snapshot sources by player device id', () => { + const state = createPlayerBridgeState(); + + state.setScreenSnapshotSource('demo-screen', 'player-a', [{ clientId: 'client-1' }]); + state.setScreenSnapshotSource('demo-screen', 'player-b', [{ clientId: 'client-2' }]); + state.clearPlayerSnapshotSources('player-a'); + + const snapshot = state.buildMergedScreenSnapshot('demo-screen'); + assert.equal(snapshot.count, 1); + assert.deepEqual(snapshot.deviceIds, ['player-b']); +}); diff --git a/test/player-markup-preload.test.js b/test/player-markup-preload.test.js index 7aa2923..5afc61b 100644 --- a/test/player-markup-preload.test.js +++ b/test/player-markup-preload.test.js @@ -71,7 +71,9 @@ test('primeSlideMarkup restores the current canvas dimensions', () => { }; sandbox.window = sandbox; + const sharedRenderingPath = path.join(__dirname, '..', 'src', 'player', 'rendering-shared.js'); const renderingPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-rendering.js'); + loadScript(sharedRenderingPath, sandbox); loadScript(renderingPath, sandbox); const slide = { diff --git a/test/player-page-commands-performance.test.js b/test/player-page-commands-performance.test.js index dc8a883..09a4060 100644 --- a/test/player-page-commands-performance.test.js +++ b/test/player-page-commands-performance.test.js @@ -4,26 +4,53 @@ const vm = require('node:vm'); const test = require('node:test'); const assert = require('node:assert/strict'); -function loadCommandsScript(sandbox) { +function loadRendererScripts(sandbox) { + const registryPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-region-registry.js'); const animationPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-animation.js'); const mediaPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-media.js'); const transitionPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-transition.js'); - const commandsPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-commands.js'); + const registryScript = fs.readFileSync(registryPath, 'utf8'); const animationScript = fs.readFileSync(animationPath, 'utf8'); const mediaScript = fs.readFileSync(mediaPath, 'utf8'); const transitionScript = fs.readFileSync(transitionPath, 'utf8'); - const commandsScript = fs.readFileSync(commandsPath, 'utf8'); - vm.runInNewContext(animationScript + '\n' + mediaScript + '\n' + transitionScript + '\n' + commandsScript, sandbox, { filename: commandsPath }); + vm.runInNewContext(registryScript + '\n' + animationScript + '\n' + mediaScript + '\n' + transitionScript, sandbox, { filename: transitionPath }); + sandbox.pulsePlayerRegionTypes.register('test-region', sandbox.regionDefinition); } function createSandbox() { const rafCallbacks = []; + const timers = new Map(); + let nextTimerId = 0; const calls = { syncRtmpRegions: 0, initRegion: 0, - playRegionAnimations: 0 + destroyRegion: 0, + destroyRtmpRegions: 0, + playRegionAnimations: 0, + lifecycle: [] }; + function createElement() { + const classes = new Set(); + return { + style: {}, + isConnected: false, + parentNode: null, + innerHTML: '', + get className() { return Array.from(classes).join(' '); }, + set className(value) { + classes.clear(); + String(value).split(/\s+/).filter(Boolean).forEach(name => classes.add(name)); + }, + classList: { + contains(name) { return classes.has(name); }, + add(name) { classes.add(name); }, + remove(name) { classes.delete(name); } + }, + querySelectorAll() { return []; } + }; + } + const app = { children: [], firstElementChild: null, @@ -35,7 +62,10 @@ function createSandbox() { }, set innerHTML(value) { this.innerHTMLValue = String(value || ''); - this.firstElementChild = this.innerHTMLValue ? { isConnected: true } : null; + this.children.forEach(node => { node.isConnected = false; node.parentNode = null; }); + this.children = []; + this.firstElementChild = null; + if (this.innerHTMLValue) this.appendChild(createElement()); }, get innerHTML() { return this.innerHTMLValue; @@ -43,11 +73,18 @@ function createSandbox() { appendChild(node) { if (node) { node.isConnected = true; + node.parentNode = this; this.children.push(node); this.firstElementChild = this.firstElementChild || node; } return node; }, + removeChild(node) { + this.children = this.children.filter(child => child !== node); + node.parentNode = null; + node.isConnected = false; + this.firstElementChild = this.children[0] || null; + }, querySelectorAll() { return []; } @@ -64,14 +101,19 @@ function createSandbox() { Array, Object, Promise, - setTimeout, - clearTimeout, + setTimeout(callback) { + const timerId = ++nextTimerId; + timers.set(timerId, callback); + return timerId; + }, + clearTimeout(timerId) { timers.delete(timerId); }, console, requestAnimationFrame(callback) { rafCallbacks.push(callback); return rafCallbacks.length; }, app, + document: { createElement }, slides: [], index: 0, currentPlaylistSignature: 'signature', @@ -89,29 +131,17 @@ function createSandbox() { pausedRemainingMs: null, timer: null, lastRenderedSlide: null, - destroyRtmpRegions() {}, + destroyRtmpRegions() { calls.destroyRtmpRegions += 1; }, syncRtmpRegions() { calls.syncRtmpRegions += 1; }, - initializeRegionInstances() { - calls.initializeRegionInstances += 1; - }, playRegionAnimations() { calls.playRegionAnimations += 1; }, addEventListener() {}, - pulsePlayerRegionTypes: { - list() { - return [ - { - definition: { - initRegion() { - calls.initRegion += 1; - } - } - } - ]; - } + regionDefinition: { + initRegion(root) { calls.initRegion += 1; calls.lifecycle.push(['init', root]); }, + destroyRegion(root) { calls.destroyRegion += 1; calls.lifecycle.push(['destroy', root]); } }, isThumbnailPreview() { return false; @@ -120,12 +150,12 @@ function createSandbox() { sandbox.window = sandbox; sandbox.window.requestAnimationFrame = sandbox.requestAnimationFrame; - return { sandbox, calls, rafCallbacks, app }; + return { sandbox, calls, rafCallbacks, app, timers }; } -test('renderSlideMarkup runs post-render setup immediately', () => { +test('renderSlideMarkup initializes immediately without loading command handling', () => { const { sandbox, calls, rafCallbacks, app } = createSandbox(); - loadCommandsScript(sandbox); + loadRendererScripts(sandbox); sandbox.playRegionAnimations = function () { calls.playRegionAnimations += 1; }; @@ -138,4 +168,190 @@ test('renderSlideMarkup runs post-render setup immediately', () => { assert.equal(calls.playRegionAnimations, 1); assert.equal(rafCallbacks.length, 0); assert.equal(returned, app.firstElementChild); + assert.equal(calls.destroyRegion, 1); + assert.equal(calls.destroyRtmpRegions, 1); + assert.equal(typeof sandbox.sendCommandState, 'undefined'); +}); + +test('fade rendering destroys old regions, initializes on the next frame, and removes the old shell', () => { + const { sandbox, calls, rafCallbacks, app, timers } = createSandbox(); + loadRendererScripts(sandbox); + const previous = sandbox.renderSlideMarkup('
    first
    ', true); + assert.equal(calls.initRegion, 1); + const next = sandbox.renderSlideMarkup('
    second
    ', true, 0); + assert.equal(calls.initRegion, 1); + assert.equal(calls.destroyRegion, 2); + assert.equal(calls.destroyRtmpRegions, 2); + assert.equal(app.children.length, 2); + assert.equal(next.style.opacity, '0'); + assert.equal(rafCallbacks.length, 1); + rafCallbacks.shift()(); + assert.equal(calls.initRegion, 2); + assert.equal(calls.lifecycle.at(-1)[1], next); + assert.equal(next.style.opacity, '1'); + assert.equal(previous.style.opacity, '0'); + assert.equal(timers.size, 1); + timers.get(sandbox.slideTransitionTimer)(); + assert.equal(app.children.length, 1); + assert.equal(app.firstElementChild, next); + assert.equal(previous.isConnected, false); + assert.equal(sandbox.slideTransitionTimer, null); +}); + +test('region lifecycle dispatch isolates failing hooks and tolerates absent modules', () => { + const { sandbox, calls, app } = createSandbox(); + loadRendererScripts(sandbox); + sandbox.pulsePlayerRegionTypes.register('broken', { + initRegion() { throw new Error('broken init'); }, + destroyRegion() { throw new Error('broken destroy'); } + }); + let healthyCalls = 0; + sandbox.pulsePlayerRegionTypes.register('healthy', { + initRegion() { healthyCalls += 1; }, + destroyRegion() { healthyCalls += 1; } + }); + sandbox.pulsePlayerRegionTypes.register('no-hooks', {}); + sandbox.initializeRegionInstances(app); + sandbox.destroyRegionInstances(app); + assert.equal(healthyCalls, 2); + assert.equal(calls.initRegion, 1); + assert.equal(calls.destroyRegion, 1); + sandbox.initializeRegionInstances(null); + sandbox.pulsePlayerRegionTypes = null; + assert.doesNotThrow(() => sandbox.destroyRegionInstances(app)); +}); + +function createVideoSandbox(readyState = 2) { + const fixture = createSandbox(); + loadRendererScripts(fixture.sandbox); + const listeners = new Map(); + const mediaCalls = { plays: 0, pauses: 0, loads: 0, removed: [] }; + const video = { + readyState, + dataset: { loop: '0', disableAudio: '0' }, + isConnected: true, + src: '/media/video.mp4', + play() { mediaCalls.plays += 1; return Promise.resolve(); }, + pause() { mediaCalls.pauses += 1; }, + load() { mediaCalls.loads += 1; }, + removeAttribute(name) { mediaCalls.removed.push(name); if (name === 'src') this.src = ''; }, + addEventListener(name, callback) { listeners.set(name, callback); }, + removeEventListener(name, callback) { + if (listeners.get(name) === callback) listeners.delete(name); + } + }; + const root = { isConnected: true, querySelectorAll() { return [video]; } }; + return { ...fixture, video, root, listeners, mediaCalls }; +} + +test('video teardown cancels delayed starts and releases the source', () => { + const { sandbox, root, video, timers, mediaCalls } = createVideoSandbox(); + sandbox.initializeSlideMedia(root, 280); + assert.equal(timers.size, 1); + const staleStart = Array.from(timers.values())[0]; + sandbox.destroySlideMedia(root); + root.isConnected = false; + video.isConnected = false; + assert.equal(timers.size, 0); + staleStart(); + assert.equal(mediaCalls.plays, 0); + assert.equal(mediaCalls.pauses, 1); + assert.deepEqual(mediaCalls.removed, ['src']); + assert.equal(mediaCalls.loads, 1); +}); + +test('video teardown removes readiness listeners and ignores late readiness events', () => { + const { sandbox, root, video, timers, listeners, mediaCalls } = createVideoSandbox(0); + sandbox.initializeSlideMedia(root, 280); + const lateCanPlay = listeners.get('canplay'); + const lateMetadata = listeners.get('loadedmetadata'); + assert.equal(listeners.size, 2); + sandbox.destroySlideMedia(root); + assert.equal(listeners.size, 0); + video.readyState = 2; + lateCanPlay(); + lateMetadata(); + assert.equal(timers.size, 0); + assert.equal(mediaCalls.plays, 0); +}); + +test('video readiness schedules one start and reinitialization cancels the previous start', () => { + const { sandbox, root, video, timers, listeners, mediaCalls } = createVideoSandbox(0); + sandbox.initializeSlideMedia(root, 280); + const metadata = listeners.get('loadedmetadata'); + const canPlay = listeners.get('canplay'); + metadata(); + assert.equal(timers.size, 0); + video.readyState = 2; + canPlay(); + metadata(); + assert.equal(timers.size, 1); + assert.equal(listeners.size, 0); + const staleStart = Array.from(timers.values())[0]; + sandbox.initializeSlideMedia(root, 280); + assert.equal(timers.size, 1); + staleStart(); + assert.equal(mediaCalls.plays, 0); + const [timerId, start] = Array.from(timers.entries())[0]; + timers.delete(timerId); + start(); + assert.equal(mediaCalls.plays, 1); + assert.equal(video.loop, false); + assert.equal(video.muted, false); + assert.equal(video.autoplay, false); + sandbox.destroySlideMedia(root); + assert.equal(mediaCalls.loads, 1); +}); + +test('video teardown can preserve the outgoing frame until crossfade removal', () => { + const { sandbox, root, timers, mediaCalls } = createVideoSandbox(); + sandbox.initializeSlideMedia(root, 280); + sandbox.destroySlideMedia(root, { preserveVideoFrame: true }); + assert.equal(timers.size, 0); + assert.equal(mediaCalls.pauses, 1); + assert.deepEqual(mediaCalls.removed, []); + assert.equal(mediaCalls.loads, 0); + sandbox.destroySlideMedia(root); + assert.deepEqual(mediaCalls.removed, ['src']); + assert.equal(mediaCalls.loads, 1); +}); + +test('crossfade cancels outgoing video startup but releases its source only at shell removal', () => { + const { sandbox, app, video, timers, rafCallbacks, mediaCalls } = createVideoSandbox(); + const previous = sandbox.renderSlideMarkup('
    video
    ', true); + previous.querySelectorAll = function () { return [video]; }; + app.querySelectorAll = function () { return app.children.includes(previous) ? [video] : []; }; + sandbox.initializeSlideMedia(previous, 280); + sandbox.renderSlideMarkup('
    next
    ', true); + assert.equal(mediaCalls.pauses, 1); + assert.equal(mediaCalls.loads, 0); + assert.equal(timers.size, 1); + rafCallbacks.shift()(); + timers.get(sandbox.slideTransitionTimer)(); + assert.equal(mediaCalls.plays, 0); + assert.deepEqual(mediaCalls.removed, ['src']); + assert.equal(mediaCalls.loads, 1); + assert.equal(previous.isConnected, false); +}); + +test('rapid crossfades ignore obsolete media setup and cleanup callbacks', () => { + const { sandbox, app, timers, rafCallbacks, calls } = createSandbox(); + loadRendererScripts(sandbox); + const first = sandbox.renderSlideMarkup('
    first
    ', true); + const second = sandbox.renderSlideMarkup('
    second
    ', true); + const staleCleanup = timers.get(sandbox.slideTransitionTimer); + const third = sandbox.renderSlideMarkup('
    third
    ', true); + const activeTimerId = sandbox.slideTransitionTimer; + assert.equal(first.isConnected, false); + assert.equal(app.children.length, 2); + staleCleanup(); + assert.equal(sandbox.slideTransitionTimer, activeTimerId); + rafCallbacks.shift()(); + assert.equal(calls.initRegion, 1); + rafCallbacks.shift()(); + assert.equal(calls.initRegion, 2); + assert.equal(calls.lifecycle.at(-1)[1], third); + timers.get(activeTimerId)(); + assert.equal(second.isConnected, false); + assert.equal(app.firstElementChild, third); }); \ No newline at end of file diff --git a/test/player-page-playback.test.js b/test/player-page-playback.test.js index 3bf5f4e..81b5de0 100644 --- a/test/player-page-playback.test.js +++ b/test/player-page-playback.test.js @@ -4,7 +4,306 @@ const vm = require('node:vm'); const test = require('node:test'); const assert = require('node:assert/strict'); -test('playlist refresh queues updates until the next slide transition', async () => { +function createRenderSandbox() { + const calls = { rendered: [], scheduled: [], reported: [], saved: 0, progress: 0 }; + const sandbox = { + window: null, + slides: [{ id: 1, duration_seconds: 10 }, { id: 2, duration_seconds: 12 }], + slideRenderRequestId: 0, + currentPlaylistSkipUnavailableRtmp: false, + currentPlaylistFadeBetweenSlides: false, + isPaused: false, + index: 0, + timer: null, + app: null, + lastRenderedViewKey: '', + getCurrentActiveSlides() { return sandbox.slides; }, + getCurrentRenderKey() { return String(sandbox.index); }, + buildSlideMarkup(slide) { return slide.id; }, + renderEmpty() { calls.rendered.push('empty'); }, + savePlaybackState() { calls.saved += 1; }, + sendCommandState(slide) { calls.reported.push(slide.id); }, + getSlideHoldDelay(delayMs) { return delayMs; }, + clearSlideTimer() {}, + syncWebpagePreloads() {} + }; + sandbox.window = sandbox; + const transitionPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-transition.js'); + vm.runInNewContext(fs.readFileSync(transitionPath, 'utf8'), sandbox, { filename: transitionPath }); + sandbox.renderSlideMarkup = function (markup) { calls.rendered.push(markup); }; + sandbox.scheduleSlideAdvance = function (delayMs) { calls.scheduled.push(delayMs); }; + sandbox.markPlayerPlaybackProgress = function () { calls.progress += 1; }; + const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playback.js'); + vm.runInNewContext(fs.readFileSync(scriptPath, 'utf8'), sandbox, { filename: scriptPath }); + return { sandbox, calls }; +} + +test('playlist refreshes coalesce startup bursts but forced refreshes run after the debounce window', () => { + const requests = []; + class XhrStub { + open(_method, url) { this.url = url; } + setRequestHeader() {} + send() { + requests.push(this); + this.readyState = 4; + this.status = 304; + this.onreadystatechange(); + } + } + const sandbox = { + window: null, + location: { origin: 'http://localhost' }, + slug: 'test', + currentPlaylistEtag: '"etag"', + initialData: { apiSources: [], weatherLocations: [] }, + playlistRefreshInFlight: false, + XMLHttpRequest: XhrStub, + markRefreshHealthy() {}, + setOfflineBannerVisible() {}, + logDebug() {} + }; + sandbox.window = sandbox; + const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playback.js'); + vm.runInNewContext(fs.readFileSync(scriptPath, 'utf8'), sandbox, { filename: scriptPath }); + + sandbox.refresh(); + sandbox.refresh(); + assert.equal(requests.length, 1); + + sandbox.refresh(true); + assert.equal(requests.length, 1); + + sandbox.lastPlaylistRefreshAt = Date.now() - 1001; + sandbox.refresh(true); + assert.equal(requests.length, 2); +}); + +test('playlist refresh sends cached etags only after source metadata is hydrated', () => { + function captureHeaders(initialData) { + let request = null; + class XhrStub { + constructor() { this.headers = {}; request = this; } + open() {} + setRequestHeader(name, value) { this.headers[name] = value; } + send() {} + } + const sandbox = { + window: null, + location: { origin: 'http://localhost' }, + slug: 'test', + initialData: initialData, + currentPlaylistEtag: '"cached-etag"', + playlistRefreshInFlight: false, + XMLHttpRequest: XhrStub + }; + sandbox.window = sandbox; + const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playback.js'); + vm.runInNewContext(fs.readFileSync(scriptPath, 'utf8'), sandbox, { filename: scriptPath }); + sandbox.refresh(); + return request.headers['If-None-Match']; + } + + assert.equal(captureHeaders(null), undefined); + assert.equal(captureHeaders({ apiSources: [], weatherLocations: [] }), '"cached-etag"'); +}); + +test('command client ID conflict reconnects in place without navigating through onboarding', () => { + const sockets = []; + const storedValues = new Map([['pulse-signage-player-client-id', 'client-old']]); + const reconnectTimers = []; + let redirects = 0; + + class MockWebSocket { + constructor(url) { + this.url = url; + this.readyState = MockWebSocket.CONNECTING; + this.sent = []; + sockets.push(this); + } + send(payload) { this.sent.push(payload); } + } + MockWebSocket.CONNECTING = 0; + MockWebSocket.OPEN = 1; + MockWebSocket.CLOSED = 3; + + const window = { + location: { + origin: 'http://localhost:8081', + href: 'http://localhost:8081/screen/test', + replace() { redirects += 1; } + }, + navigator: { userAgent: 'test' }, + crypto: { randomUUID() { return 'client-new'; } }, + sessionStorage: { + getItem(key) { return storedValues.get(key) || null; }, + setItem(key, value) { storedValues.set(key, String(value)); }, + removeItem(key) { storedValues.delete(key); } + }, + WebSocket: MockWebSocket, + addEventListener() {}, + setTimeout(callback) { reconnectTimers.push(callback); return reconnectTimers.length; }, + clearTimeout() {}, + setInterval() { return 1; }, + clearInterval() {} + }; + const sandbox = { + window: window, + WebSocket: MockWebSocket, + URL, + Date, + JSON, + Math, + Number, + String, + Boolean, + Array, + Object, + Promise, + commandSocketPath: '/ws/screens/test', + commandSocket: null, + commandClientId: null, + commandClientStorageKey: 'pulse-signage-player-client-id', + commandReconnectTimer: null, + commandHeartbeatTimer: null, + currentPlaylistSignature: 'playlist-revision', + getOnboardingClientName() { return ''; }, + getOnboardingDeviceId() { return 'device-1'; }, + getCurrentViewport() { return { width: 1920, height: 1080 }; }, + lastRenderedSlide: null, + isPaused: false, + isBlackout: false + }; + const playlistScriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playlist.js'); + const commandsScriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-commands.js'); + vm.runInNewContext(fs.readFileSync(playlistScriptPath, 'utf8'), sandbox, { filename: playlistScriptPath }); + vm.runInNewContext(fs.readFileSync(commandsScriptPath, 'utf8'), sandbox, { filename: commandsScriptPath }); + + sandbox.connectCommandSocket(); + const socket = sockets[0]; + socket.readyState = MockWebSocket.OPEN; + socket.onopen(); + socket.onmessage({ data: JSON.stringify({ type: 'client-id-conflict' }) }); + socket.onclose({ code: 4009, reason: 'Client ID is already in use.' }); + + assert.equal(redirects, 0); + assert.equal(storedValues.get('pulse-signage-player-client-id'), 'client-new'); + assert.equal(reconnectTimers.length, 1); +}); + +test('invalid slide indexes fall back to the first available slide', async () => { + const { sandbox, calls } = createRenderSandbox(); + for (const targetIndex of [-1, Infinity, NaN, 0.5, sandbox.slides.length]) { + assert.equal(await sandbox.renderSlideAtIndex(sandbox.slides, targetIndex), true); + assert.equal(sandbox.index, 0); + } + assert.deepEqual(calls.rendered, [1, 1, 1, 1, 1]); +}); + +test('obsolete RTMP probes cannot overwrite a newer render or its side effects', async () => { + for (const olderAvailable of [true, false]) { + const { sandbox, calls } = createRenderSandbox(); + const pending = new Map(); + sandbox.currentPlaylistSkipUnavailableRtmp = true; + sandbox.probeRtmpSlideAvailability = function (slide) { + return new Promise(resolve => pending.set(slide.id, resolve)); + }; + const older = sandbox.renderSlideAtIndex(sandbox.slides, 0); + const newer = sandbox.renderSlideAtIndex(sandbox.slides, 1); + pending.get(2)(true); + assert.equal(await newer, true); + pending.get(1)(olderAvailable); + assert.equal(await older, false); + assert.deepEqual(calls.rendered, [2]); + assert.deepEqual(calls.reported, [2]); + assert.deepEqual(calls.scheduled, [12000]); + assert.equal(calls.saved, 1); + assert.equal(calls.progress, 1); + assert.equal(sandbox.index, 1); + } +}); + +test('an empty active playlist cancels a pending RTMP render', async () => { + const { sandbox, calls } = createRenderSandbox(); + let resolveProbe; + sandbox.currentPlaylistSkipUnavailableRtmp = true; + sandbox.probeRtmpSlideAvailability = function () { + return new Promise(resolve => { resolveProbe = resolve; }); + }; + const pendingRender = sandbox.renderSlideAtIndex(sandbox.slides, 0); + sandbox.slides = []; + sandbox.showCurrent(); + resolveProbe(true); + assert.equal(await pendingRender, false); + assert.deepEqual(calls.rendered, ['empty']); + assert.deepEqual(calls.scheduled, []); + assert.equal(calls.saved, 0); +}); + +test('playlist refreshes preserve single-slide deadlines and paused remaining time', () => { + for (const outcome of ['304', 'unchanged', 'network-error', 'timeout', '503', 'invalid-json']) { + for (const paused of [false, true]) { + const requests = []; + let advances = 0; + const sandbox = { + window: null, + location: { origin: 'http://localhost' }, + slug: 'test', + isPaused: paused, + timer: paused ? null : 42, + slideExpiresAt: paused ? null : Date.now() + 90000, + pausedRemainingMs: paused ? 45000 : null, + lastRenderedSlide: { id: 1, duration_seconds: 120 }, + currentPlaylistSignature: 'revision', + currentPlaylistEtag: '"etag"', + initialData: { apiSources: [], weatherLocations: [] }, + pendingPlaylistUpdate: null, + getCurrentActiveSlides() { return [sandbox.lastRenderedSlide]; }, + normalizeSlide(slide) { return slide; }, + getActiveSlidesFrom(slides) { return slides; }, + getPlaylistRevision() { return 'revision'; }, + savePlaylistSnapshot() {}, + markRefreshHealthy() {}, + setOfflineBannerVisible() {}, + scheduleRefreshRetry() {}, + logDebug() {}, + getSlideAdvanceDelay() { return 120000; }, + scheduleSlideAdvance(delayMs) { + advances += 1; + sandbox.timer = 99; + sandbox.slideExpiresAt = Date.now() + delayMs; + }, + XMLHttpRequest: class { + open() { requests.push(this); } + setRequestHeader() {} + getResponseHeader() { return '"etag"'; } + send() { + if (outcome === 'network-error') { this.onerror(); return; } + if (outcome === 'timeout') { this.ontimeout(); return; } + this.readyState = 4; + this.status = outcome === '304' ? 304 : outcome === '503' ? 503 : 200; + this.responseText = outcome === 'invalid-json' ? '{' : JSON.stringify({ + slides: [{ id: 1, duration_seconds: 120 }], apiSources: [], weatherLocations: [], playlist: {} + }); + this.onreadystatechange(); + } + } + }; + sandbox.window = sandbox; + const deadline = sandbox.slideExpiresAt; + const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playback.js'); + vm.runInNewContext(fs.readFileSync(scriptPath, 'utf8'), sandbox, { filename: scriptPath }); + sandbox.refresh(); + sandbox.refresh(); + assert.equal(requests.length, 1); + assert.equal(advances, 0, outcome + ', paused=' + paused); + assert.equal(sandbox.timer, paused ? null : 42); + assert.equal(sandbox.slideExpiresAt, deadline); + assert.equal(sandbox.pausedRemainingMs, paused ? 45000 : null); + } + } +}); + +test('forced playlist refresh queues updates until the next slide transition', async () => { const calls = { showCurrent: 0, logDebug: [], @@ -137,7 +436,7 @@ test('playlist refresh queues updates until the next slide transition', async () `; vm.runInNewContext(prelude + '\n' + script, sandbox, { filename: scriptPath }); - await sandbox.refresh(); + await sandbox.refresh(true); assert.equal(calls.showCurrent, 0); assert.equal(sandbox.currentPlaylistSignature, 'old-signature'); @@ -149,6 +448,74 @@ test('playlist refresh queues updates until the next slide transition', async () assert.equal(calls.logDebug.some((entry) => entry.includes('applying on next slide transition')), true); }); +test('playlist refresh does not overlap an in-flight request', () => { + const requests = []; + const sandbox = { + window: null, + location: { origin: 'http://localhost' }, + Date, + JSON, + Math, + Number, + String, + Boolean, + Array, + Object, + Promise, + setTimeout, + clearTimeout, + console, + slug: 'test', + initialData: {}, + currentPlaylistEtag: '', + currentPlaylistSignature: 'cached-signature', + currentPlaylistFadeBetweenSlides: false, + currentPlaylistSkipUnavailableRtmp: false, + pendingPlaylistUpdate: null, + slides: [{ id: 1, duration_seconds: 10 }], + lastRenderedSlide: { id: 1, duration_seconds: 10 }, + activeSlidesCacheKey: '', + activeSlidesCacheValue: [], + slideMarkupCache: Object.create(null), + templateLayoutCache: Object.create(null), + templateRenderPlanCache: Object.create(null), + getCurrentActiveSlides() { return sandbox.slides; }, + getPlaylistRevision(data) { return data.signature; }, + normalizeSlide(slide) { return slide; }, + getActiveSlidesFrom(slideList) { return slideList; }, + savePlaylistSnapshot() {}, + markRefreshHealthy() {}, + setOfflineBannerVisible() {}, + scheduleRefreshRetry() {}, + syncWebpagePreloads() {}, + syncRtmpWarmups() {}, + showCurrent() {}, + sendCommandState() {}, + scheduleSlideAdvance() {}, + logDebug() {} + }; + sandbox.window = sandbox; + + class XhrStub { + open() { + requests.push(this); + } + + setRequestHeader() {} + getResponseHeader() { return ''; } + send() {} + } + + sandbox.XMLHttpRequest = XhrStub; + const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playback.js'); + vm.runInNewContext(fs.readFileSync(scriptPath, 'utf8'), sandbox, { filename: scriptPath }); + + sandbox.refresh(); + sandbox.refresh(); + + assert.equal(requests.length, 1); +}); + test('playlist refresh reloads source data after a cached snapshot receives 304', async () => { const requests = []; const sandbox = { @@ -244,7 +611,7 @@ test('playlist refresh reloads source data after a cached snapshot receives 304' assert.deepEqual(sandbox.initialData.weatherLocations, [{ id: 1 }]); }); -test('centralized slide advance timing preserves the configured slide duration', () => { +test('runtime scripts have one slide timing owner and preserve configured fade timing', () => { const sandbox = { window: null, currentPlaylistFadeBetweenSlides: false, @@ -256,11 +623,19 @@ test('centralized slide advance timing preserves the configured slide duration', }; sandbox.window = sandbox; - const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playback.js'); - const script = fs.readFileSync(scriptPath, 'utf8'); - vm.runInNewContext(script, sandbox, { filename: scriptPath }); + require('../src/common'); + const { getPlayerRuntimeScripts } = require('../src/player/render-helpers'); + const runtimeScripts = getPlayerRuntimeScripts(); + const declarations = runtimeScripts.flatMap(([, source]) => source.match(/function getSlideAdvanceDelay\s*\(/g) || []); + assert.equal(declarations.length, 1); + for (const [name, source] of runtimeScripts) { + if (name === 'transition' || name === 'playback') { + vm.runInNewContext(source, sandbox, { filename: name }); + } + } assert.equal(sandbox.getSlideAdvanceDelay({ duration_seconds: 12 }), 12000); + assert.equal(sandbox.getSlideAdvanceDelay({ duration_seconds: 12, use_video_duration: true }), 12000); sandbox.currentPlaylistFadeBetweenSlides = true; assert.equal(sandbox.getSlideAdvanceDelay({ duration_seconds: 10 }), 9720); assert.equal(sandbox.getSlideAdvanceDelay({ duration_seconds: 10, use_video_duration: true }), 9440); @@ -268,7 +643,24 @@ test('centralized slide advance timing preserves the configured slide duration', assert.equal(sandbox.getSlideAdvanceDelay({ duration_seconds: 12, use_video_duration: true }), 11440); }); -test('single-slide playlists re-render the active slide instead of refreshing after a queued update', async () => { +test('runtime scripts keep DOM transitions and region lifecycle outside command handling', () => { + require('../src/common'); + const { getPlayerRuntimeScripts } = require('../src/player/render-helpers'); + const scripts = getPlayerRuntimeScripts(); + for (const [symbol, owner] of [ + ['renderSlideMarkup', 'transition'], + ['runRegionLifecycle', 'region-registry'], + ['initializeRegionInstances', 'region-registry'], + ['destroyRegionInstances', 'region-registry'] + ]) { + const declaration = new RegExp('function ' + symbol + '\\s*\\('); + const owners = scripts.filter(([, source]) => declaration.test(source)).map(([name]) => name); + assert.deepEqual(owners, [owner]); + assert.ok(scripts.findIndex(([name]) => name === owner) < scripts.findIndex(([name]) => name === 'commands')); + } +}); + +test('playlist removal of the current slide waits until its transition before applying', async () => { const calls = { showCurrent: 0, refresh: 0 @@ -611,7 +1003,7 @@ test('player page arrow keys move between slides', async () => { assert.deepEqual(calls, [0, 2]); }); -test('removing the currently visible slide from a two-slide playlist applies the one-slide update immediately', async () => { +test('playlist removal of the current slide queues without rerendering it immediately', async () => { const calls = { showCurrent: 0, logDebug: [] @@ -733,8 +1125,9 @@ test('removing the currently visible slide from a two-slide playlist applies the await sandbox.refresh(); - assert.equal(sandbox.currentPlaylistSignature, 'next-signature'); - assert.equal(sandbox.pendingPlaylistUpdate, null); - assert.deepEqual(sandbox.slides, [{ id: 1, duration_seconds: 12, disable_audio: false }]); - assert.equal(calls.logDebug.some((entry) => entry.includes('applying on next slide transition')), false); + assert.equal(sandbox.currentPlaylistSignature, 'old-signature'); + assert.ok(sandbox.pendingPlaylistUpdate); + assert.equal(JSON.stringify(sandbox.slides), JSON.stringify([{ id: 1, duration_seconds: 12 }, { id: 2, duration_seconds: 12 }])); + assert.equal(calls.showCurrent, 0); + assert.equal(calls.logDebug.some((entry) => entry.includes('applying on next slide transition')), true); }); \ No newline at end of file diff --git a/test/player-preload-helpers.test.js b/test/player-preload-helpers.test.js index 28d66b4..c98aae2 100644 --- a/test/player-preload-helpers.test.js +++ b/test/player-preload-helpers.test.js @@ -18,6 +18,209 @@ function loadHtmlScript(scriptPath, sandbox) { vm.runInNewContext(script, sandbox, { filename: scriptPath }); } +test('media preload cleanup releases unpromoted video elements on every early exit', () => { + for (const reason of ['empty', 'single', 'missing-slide', 'missing-renderer', 'missing-document']) { + const calls = []; + const sandbox = { + window: {}, + mediaPreloadSignature: 'old-signature', + mediaPreloadElements: [{ + tagName: 'VIDEO', + pause() { calls.push('pause'); }, + removeAttribute(name) { calls.push('remove:' + name); }, + load() { calls.push('load'); } + }], + document: {}, + primeSlideMarkup() {} + }; + const slides = reason === 'empty' ? [] : reason === 'single' ? [{ id: 1 }] : [{ id: 1 }, { id: 2 }]; + if (reason === 'missing-renderer') delete sandbox.primeSlideMarkup; + if (reason === 'missing-document') delete sandbox.document; + loadScript(path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playlist.js'), sandbox); + sandbox.syncSlideMediaPreloads(slides, reason === 'missing-slide' ? 0.5 : 0); + assert.deepEqual(calls, ['pause', 'remove:src', 'load'], reason); + assert.equal(sandbox.mediaPreloadSignature, ''); + assert.equal(sandbox.mediaPreloadElements.length, 0); + sandbox.syncSlideMediaPreloads([], 0); + assert.equal(calls.length, 3); + } +}); + +test('warmed video node is promoted into its slide instead of fetched again', () => { + const createdVideos = []; + let nextSource = ''; + const holder = { + innerHTML: '', + querySelectorAll() { + return [{ tagName: 'VIDEO', getAttribute(name) { return name === 'data-pulse-video-src' ? nextSource : null; } }]; + } + }; + const sandbox = { + window: { innerWidth: 1920, innerHeight: 1080, location: { origin: 'http://localhost' } }, + URL, + currentPlaylistSignature: 'playlist', + mediaPreloadSignature: '', + mediaPreloadElements: [], + primeSlideMarkup(slide) { + nextSource = '/media/slide-' + slide.id + '.mp4'; + return ''; + }, + document: { + createElement(tag) { + if (tag !== 'video') return holder; + const attributes = new Map(); + const video = { + tagName: 'VIDEO', + preload: '', + muted: false, + src: '', + loadCalls: 0, + attributes, + setAttribute(name, value) { attributes.set(name, String(value)); }, + getAttribute(name) { return attributes.get(name) || null; }, + removeAttribute(name) { attributes.delete(name); }, + load() { this.loadCalls += 1; }, + pause() {} + }; + createdVideos.push(video); + return video; + } + } + }; + loadScript(path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playlist.js'), sandbox); + + const slides = [{ id: 1 }, { id: 2 }, { id: 3 }]; + sandbox.syncSlideMediaPreloads(slides, 0); + const warmedVideo = createdVideos[0]; + assert.equal(warmedVideo.src, 'http://localhost/media/slide-2.mp4'); + + let promotedNode = null; + const activeVideo = { + tagName: 'VIDEO', + src: 'http://localhost/media/slide-2.mp4', + attributes: [{ name: 'class', value: 'video' }, { name: 'data-pulse-video-src', value: '/media/slide-2.mp4' }], + getAttribute(name) { return name === 'data-pulse-video-src' ? '/media/slide-2.mp4' : null; }, + parentNode: { + replaceChild(replacement, oldNode) { + assert.equal(oldNode, activeVideo); + promotedNode = replacement; + } + } + }; + const root = { querySelectorAll() { return [activeVideo]; } }; + + assert.equal(sandbox.promotePreloadedVideoElements(root, 2), 1); + assert.equal(promotedNode, warmedVideo); + assert.equal(warmedVideo.loadCalls, 1); + + sandbox.syncSlideMediaPreloads(slides, 1); + assert.equal(createdVideos[1].src, 'http://localhost/media/slide-3.mp4'); + assert.notEqual(sandbox.mediaPreloadElements[0], warmedVideo); +}); + +test('media preloads next-slide images without creating duplicate video loads', () => { + const calls = []; + const nextImage = {}; + Object.defineProperty(nextImage, 'src', { set(value) { calls.push(value); } }); + const holder = { + innerHTML: '', + querySelectorAll(selector) { + assert.equal(selector, 'img[src], video[data-pulse-video-src]'); + return [{ tagName: 'IMG', getAttribute() { return '/media/next.jpg'; } }]; + } + }; + const sandbox = { + window: { innerWidth: 1920, innerHeight: 1080, location: { origin: 'http://localhost' } }, + URL, + currentPlaylistSignature: 'playlist', + mediaPreloadSignature: '', + mediaPreloadElements: [], + primeSlideMarkup() { return ''; }, + Image: function () { return nextImage; }, + document: { + createElement() { return holder; } + } + }; + loadScript(path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playlist.js'), sandbox); + const slides = [{ id: 1 }, { id: 2 }]; + sandbox.syncSlideMediaPreloads(slides, 0); + assert.deepEqual(calls, ['http://localhost/media/next.jpg']); + assert.equal(sandbox.mediaPreloadElements[0], nextImage); + sandbox.syncSlideMediaPreloads(slides, 0); + assert.equal(calls.length, 1); +}); + +test('media preloader keeps a warmed next-slide video node for promotion', () => { + const preloadedVideo = { + tagName: 'VIDEO', + loadCalls: 0, + load() { this.loadCalls += 1; } + }; + const sourceVideo = { tagName: 'VIDEO', getAttribute() { return '/media/next.mp4'; } }; + const holder = { + innerHTML: '', + querySelectorAll(selector) { + assert.equal(selector, 'img[src], video[data-pulse-video-src]'); + return [sourceVideo]; + } + }; + const sandbox = { + window: { innerWidth: 1920, innerHeight: 1080, location: { origin: 'http://localhost' } }, + URL, + currentPlaylistSignature: 'playlist', + mediaPreloadSignature: '', + mediaPreloadElements: [], + primeSlideMarkup() { return ''; }, + document: { + createElement(tag) { return tag === 'video' ? preloadedVideo : holder; } + } + }; + loadScript(path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playlist.js'), sandbox); + sandbox.syncSlideMediaPreloads([{ id: 1 }, { id: 2 }], 0); + + assert.equal(preloadedVideo.src, 'http://localhost/media/next.mp4'); + assert.equal(preloadedVideo.preload, 'auto'); + assert.equal(preloadedVideo.loadCalls, 1); + assert.equal(sandbox.mediaPreloadElements[0], preloadedVideo); + assert.equal(preloadedVideo.__pulsePreloadSlideId, '2'); +}); + +test('offline playlist snapshots preserve and apply the RTMP skip option', () => { + const values = new Map(); + const sandbox = { + window: { localStorage: { + setItem(key, value) { values.set(key, value); }, + getItem(key) { return values.get(key) || null; } + } }, + playlistSnapshotStorageKey: 'snapshot', + normalizeSlide(slide) { return slide; }, + slides: [], + currentPlaylistSignature: '', + currentPlaylistFadeBetweenSlides: false, + currentPlaylistSkipUnavailableRtmp: false, + currentPlaylistEtag: '', + pendingPlaylistUpdate: null, + activeSlidesCacheKey: '', activeSlidesCacheValue: [], + slideMarkupCache: {}, templateLayoutCache: {}, templateRenderPlanCache: {}, + renderCacheViewportKey: '', index: 0 + }; + loadScript(path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playlist.js'), sandbox); + for (const skipUnavailableRtmp of [true, false]) { + sandbox.savePlaylistSnapshot({ + slides: [{ id: 1 }], signature: 'revision', fadeBetweenSlides: true, + skipUnavailableRtmp, etag: '"etag"' + }); + const snapshot = sandbox.loadPlaylistSnapshot(); + assert.equal(snapshot.skipUnavailableRtmp, skipUnavailableRtmp); + assert.equal(sandbox.applyPlaylistSnapshot(snapshot), true); + assert.equal(sandbox.currentPlaylistSkipUnavailableRtmp, skipUnavailableRtmp); + assert.equal(sandbox.currentPlaylistFadeBetweenSlides, true); + assert.equal(sandbox.currentPlaylistEtag, '"etag"'); + } + values.set('snapshot', JSON.stringify({ slides: [{ id: 1 }] })); + assert.equal(sandbox.loadPlaylistSnapshot().skipUnavailableRtmp, false); +}); + test('webpage preloading only targets the next slide', () => { const sandbox = { window: null, diff --git a/test/player-render-helpers.test.js b/test/player-render-helpers.test.js index 91fce89..2170b77 100644 --- a/test/player-render-helpers.test.js +++ b/test/player-render-helpers.test.js @@ -2,6 +2,9 @@ const test = require('node:test'); const assert = require('node:assert/strict'); const fs = require('node:fs'); const vm = require('node:vm'); +const packageVersion = require('../package.json').version; +const renderingShared = require('../src/player/rendering-shared'); +const { renderPlayerPage, renderPlayerOnboardingFormPage } = require('../src/player/render'); require('../src/common'); @@ -13,7 +16,8 @@ const { renderEditorJsContent, renderHtmlRegionContent, sanitizeRichText, - getAnnouncementIconsDataScript + getAnnouncementIconsDataScript, + getPlayerRuntimeScripts } = require('../src/player/render-helpers'); test('mediaKind classifies player media by extension', () => { @@ -52,9 +56,9 @@ test('normalizeSlide normalizes nested content without mutating the source', () assert.notEqual(normalized.content, slide.content); assert.deepEqual(normalized.content.hero, { value: { headline: 'Hello' }, - font_family: ' Open Sans! ', - font_size: '42', - font_color: 'not-a-color', + font_family: 'Open Sans', + font_size: 42, + font_color: '#000000', type: 'text' }); assert.deepEqual(normalized.content.footer, { @@ -70,6 +74,27 @@ test('normalizeSlide normalizes nested content without mutating the source', () }); }); +test('server and browser slide normalization stay in sync', () => { + const browserContext = { window: {} }; + const sharedRenderingSource = fs.readFileSync(require.resolve('../src/player/rendering-shared.js'), 'utf8'); + const browserRenderingSource = fs.readFileSync(require.resolve('../src/player/public/js/player-page-rendering.js'), 'utf8'); + const slide = { + content: { + hero: { + value: '{"headline":"Hello"}', + font_family: ' Open Sans! ', + font_size: '42', + font_color: 'not-a-color', + type: 'text' + } + } + }; + vm.runInNewContext(sharedRenderingSource, browserContext); + vm.runInNewContext(browserRenderingSource, browserContext); + + assert.equal(JSON.stringify(browserContext.normalizeSlide(slide)), JSON.stringify(normalizeSlide(slide))); +}); + test('renderEditorJsContent sanitizes editor blocks and wraps legacy text', () => { const editorJson = { blocks: [ @@ -86,6 +111,90 @@ test('renderEditorJsContent sanitizes editor blocks and wraps legacy text', () = assert.equal(renderEditorJsContent('plain text'), '

    plain text

    '); }); +test('region animation decoration preserves plain markup and annotates animated roots', () => { + const plainMarkup = '
    Text
    '; + const animationConfig = { intro: { preset: 'fadeIn', duration_ms: 700 } }; + + assert.equal(renderingShared.decorateRegionMarkup(plainMarkup, { animationConfig: {} }), plainMarkup); + assert.equal( + renderingShared.decorateRegionMarkup(plainMarkup, { animationConfig: animationConfig }), + '
    Text
    ' + ); + + const browserContext = { window: {} }; + vm.runInNewContext(fs.readFileSync(require.resolve('../src/player/rendering-shared.js'), 'utf8'), browserContext); + vm.runInNewContext(fs.readFileSync(require.resolve('../src/player/public/js/player-page-rendering.js'), 'utf8'), browserContext); + browserContext.getTemplateRenderPlan = function () { + return { + layout: { + regions: [{ regionKey: 'hero', regionType: 'text', animationJson: JSON.stringify(animationConfig) }], + canvasWidth: 1920, + canvasHeight: 1080, + backgroundColor: '#000000', + backgroundGradient: '', + background: '' + }, + renderRegion: function () { return plainMarkup; } + }; + }; + browserContext.normalizePlayerAnimationConfig = function (value) { return JSON.parse(value); }; + browserContext.selectPlayerMediaSource = function () { return ''; }; + browserContext.setPlayerCanvasDimensions = function () {}; + browserContext.buildBackdropStyle = function () { return ''; }; + browserContext.renderSlideShell = function (_slide, _canvasClass, _width, _height, content) { return content; }; + + const renderedSlide = browserContext.renderTemplateSlideMarkup({ template: {}, content: {} }); + assert.match(renderedSlide, /data-animation-json=/); +}); + +test('browser rendering helpers select media and expose playlist revision and canvas helpers', () => { + const styles = {}; + const browserContext = { + window: {}, + document: { + documentElement: { + style: { + setProperty: function (key, value) { styles[key] = value; } + } + } + }, + currentPlaylistEtag: '"cached-revision"' + }; + vm.runInNewContext(fs.readFileSync(require.resolve('../src/player/rendering-shared.js'), 'utf8'), browserContext); + vm.runInNewContext(fs.readFileSync(require.resolve('../src/player/public/js/player-page-rendering.js'), 'utf8'), browserContext); + + assert.equal(browserContext.selectPlayerMediaSource('/media/original.jpg', [ + { url: '/media/small.jpg', width: 400 }, + { url: '/media/large.jpg', width: 1200 } + ], 800), '/media/large.jpg'); + assert.equal(browserContext.getPlaylistRevision({ revision: 'new-revision' }), 'new-revision'); + assert.equal(browserContext.getPlaylistRevision({}), 'cached-revision'); + browserContext.setPlayerCanvasDimensions(1920, 1080); + assert.deepEqual(styles, { + '--player-canvas-width': '1920px', + '--player-canvas-height': '1080px' + }); +}); + +test('server and browser rich-text rendering stay in sync', () => { + const browserContext = { + window: {} + }; + const sharedRenderingSource = fs.readFileSync(require.resolve('../src/player/rendering-shared.js'), 'utf8'); + const browserRenderingSource = fs.readFileSync(require.resolve('../src/player/public/js/player-page-rendering.js'), 'utf8'); + vm.runInNewContext(sharedRenderingSource, browserContext); + vm.runInNewContext(browserRenderingSource, browserContext); + + const value = { + blocks: [{ + type: 'paragraph', + data: { text: '
    Cell
    ' } + }] + }; + + assert.equal(browserContext.renderEditorJsContent(value), renderEditorJsContent(value)); +}); + test('shared API progress placeholder renders a clamped bar from numeric fields', () => { const sandbox = { window: {} }; vm.runInNewContext(fs.readFileSync(require.resolve('../src/web/public/js/shared/placeholder-utils.js'), 'utf8'), sandbox); @@ -170,6 +279,34 @@ test('player announcement bootstrap includes catalog-only icons', () => { assert.match(getAnnouncementIconsDataScript(), /bank/); }); +test('onboarding form page injects its configured device id', () => { + const page = renderPlayerOnboardingFormPage('device-123'); + + assert.match(page, /var deviceId = "device-123";/); +}); + +test('player runtime script URLs include content fingerprints', () => { + const page = renderPlayerPage('test', { slides: [] }); + + assert.match(page, new RegExp('player-script/playback\\.js\\?v=' + packageVersion.replace(/\./g, '\\.') + '-[a-f0-9]{12}')); +}); + +test('player runtime script assembly includes shared and region scripts once', () => { + const runtimeScripts = getPlayerRuntimeScripts(); + const scriptNames = runtimeScripts.map(function (entry) { return entry[0]; }); + const sharedRenderingIndex = scriptNames.indexOf('rendering-shared'); + const pageRenderingIndex = scriptNames.indexOf('rendering'); + const htmlRegionScript = runtimeScripts.find(function (entry) { + return entry[0].startsWith('region-') && entry[1].includes("registry.register('html'"); + }); + + assert.ok(sharedRenderingIndex >= 0 && sharedRenderingIndex < pageRenderingIndex); + assert.ok(scriptNames.includes('placeholder-utils')); + assert.ok(scriptNames.includes('qr-code-svg')); + assert.ok(htmlRegionScript); + assert.equal(new Set(scriptNames).size, scriptNames.length); +}); + test('shared iframe renderers size preview content explicitly', () => { const playerHtmlRegionSource = fs.readFileSync(require.resolve('../src/player/regions/html.js'), 'utf8'); const playerWebpageRegionSource = fs.readFileSync(require.resolve('../src/player/regions/webpage.js'), 'utf8'); @@ -191,4 +328,66 @@ test('html region helpers unwrap object-shaped values before rendering', () => { assert.match(rendered, /srcdoc="<!doctype html><html><head><style>html,body\{margin:0;width:100%;height:100%;overflow:hidden;background:transparent;\}<\/style><\/head><body><div>Hi<\/div><\/body><\/html>"/); assert.doesNotMatch(rendered, /\[object Object\]/); +}); + +test('shared render value normalization follows caller key order recursively', () => { + assert.equal( + renderingShared.normalizeRenderableString({ value: { content: 'Hi' } }, ['value', 'text', 'html', 'content']), + 'Hi' + ); + assert.equal( + renderingShared.normalizeRenderableString({ value: { url: 'https://example.test' } }, ['value', 'text', 'url', 'href', 'src', 'content']), + 'https://example.test' + ); + assert.equal(renderingShared.normalizeRenderableString(null, ['value', 'text']), ''); +}); + +test('shared region value normalization preserves selected values and stringifies other objects', () => { + const nestedValue = { amount: 12 }; + assert.equal(renderingShared.normalizeRegionValue({ value: nestedValue }, ['value', 'text', 'html']), nestedValue); + assert.equal(renderingShared.normalizeRegionValue({ text: 'hello' }, ['value', 'text', 'html']), 'hello'); + assert.equal(renderingShared.normalizeRegionValue({ amount: 12 }, ['value', 'text', 'html']), '{"amount":12}'); + assert.equal(renderingShared.normalizeRegionValue(12, ['value', 'text', 'html']), 12); + const circularValue = {}; + circularValue.self = circularValue; + assert.equal(renderingShared.normalizeRegionValue(circularValue, ['value', 'text', 'html']), ''); +}); + +test('shared HTML document builder wraps fragments and preserves complete documents', () => { + assert.equal( + renderingShared.buildHtmlDocument('
    Hi
    '), + '
    Hi
    ' + ); + assert.equal(renderingShared.buildHtmlDocument('Hi'), 'Hi'); + assert.equal(renderingShared.buildHtmlDocument(' '), ''); +}); + +test('browser HTML and webpage regions preserve their distinct output modes', () => { + const modules = {}; + const browserContext = { + window: { + pulsePlayerRegionTypes: { + register: function (type, regionModule) { + modules[type] = regionModule; + } + } + } + }; + [ + '../src/player/rendering-shared.js', + '../src/player/public/js/player-page-rendering.js', + '../src/player/regions/html.js', + '../src/player/regions/webpage.js' + ].forEach(function (scriptPath) { + vm.runInNewContext(fs.readFileSync(require.resolve(scriptPath), 'utf8'), browserContext); + }); + + const htmlFragment = modules.html.renderRegion({ baseStyle: '' }, { value: { content: 'Hi' } }); + const htmlDocument = modules.html.renderRegion({ baseStyle: '' }, { value: 'Hi' }); + const webpage = modules.webpage.renderRegion({ baseStyle: '', label: 'Weather' }, { value: { url: 'https://example.test' } }); + + assert.match(htmlFragment, /template-region-html-content/); + assert.match(htmlFragment, /Hi<\/strong>/); + assert.match(htmlDocument, /sandbox=""/); + assert.match(webpage, /src="https:\/\/example\.test"/); }); \ No newline at end of file diff --git a/test/player-service-worker.test.js b/test/player-service-worker.test.js new file mode 100644 index 0000000..dfa95a0 --- /dev/null +++ b/test/player-service-worker.test.js @@ -0,0 +1,161 @@ +const fs = require('node:fs'); +const path = require('node:path'); +const vm = require('node:vm'); +const test = require('node:test'); +const assert = require('node:assert/strict'); + +async function activateWorker(version, cacheKeys) { + const listeners = new Map(); + const deleted = []; + let claimed = false; + const sandbox = { + URL, + self: { + location: { href: 'http://localhost/sw.js?v=' + encodeURIComponent(version) }, + addEventListener(name, callback) { listeners.set(name, callback); }, + clients: { async claim() { claimed = true; } } + }, + caches: { + async keys() { return cacheKeys; }, + async delete(key) { deleted.push(key); return true; } + } + }; + const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'sw.js'); + vm.runInNewContext(fs.readFileSync(scriptPath, 'utf8'), sandbox, { filename: scriptPath }); + let activation; + listeners.get('activate')({ waitUntil(promise) { activation = promise; } }); + await activation; + assert.equal(claimed, true); + return deleted; +} + +test('player service worker activation preserves caches owned by other applications', async () => { + const deleted = await activateWorker('2.14.0', ['other-app-assets', 'other-app-pages']); + assert.deepEqual(deleted, []); +}); + +test('player service worker retains its active version and the most recently created other generation', async () => { + const cacheKeys = [ + 'other-app-cache', + 'pulse-signage-player-pages-2.10.0', + 'pulse-signage-player-assets-2.10.0', + 'pulse-signage-player-media-2.10.0', + 'pulse-signage-player-playlists-2.10.0', + 'pulse-signage-player-pages-2.9.0', + 'pulse-signage-player-assets-2.11.0', + 'pulse-signage-player-pages-2.11.0' + ]; + const deleted = await activateWorker('2.10.0', cacheKeys); + assert.deepEqual(deleted, ['pulse-signage-player-pages-2.9.0']); +}); + +test('player service worker retention supports opaque versions before active caches exist', async () => { + const deleted = await activateWorker('current-build', [ + 'pulse-signage-player-pages-z-old-build', + 'pulse-signage-player-assets-z-old-build', + 'pulse-signage-player-pages-a-newer-build', + 'pulse-signage-player-playlists-a-newer-build' + ]); + assert.deepEqual(deleted, [ + 'pulse-signage-player-pages-z-old-build', + 'pulse-signage-player-assets-z-old-build' + ]); +}); + +function createFetchWorker({ failure, cachedResponse = null, fetchError = false } = {}) { + const networkResponse = new Response('fresh network body', { + status: 200, headers: { ETag: '"fresh"', 'Content-Type': 'text/plain' } + }); + const calls = { fetch: 0, writes: [] }; + const listeners = new Map(); + const sandbox = { + URL, + Response, + Request, + Headers, + self: { + location: { href: 'http://localhost/sw.js', origin: 'http://localhost' }, + addEventListener(name, callback) { listeners.set(name, callback); } + }, + async fetch() { + calls.fetch += 1; + if (fetchError) throw new Error('Network unavailable'); + return networkResponse; + }, + caches: { + async match() { return cachedResponse; }, + async open() { + if (failure === 'open') throw new Error('Cache storage unavailable'); + return { + async put(key, response) { + if (failure === 'put') throw new Error('QuotaExceededError'); + calls.writes.push({ key, response }); + } + }; + } + } + }; + const scriptPath = path.join(__dirname, '..', 'src', 'player', 'public', 'sw.js'); + vm.runInNewContext(fs.readFileSync(scriptPath, 'utf8'), sandbox, { filename: scriptPath }); + return { sandbox, calls, networkResponse, listeners }; +} + +test('successful network responses survive cache open and write failures', async () => { + for (const failure of ['open', 'put']) { + for (const strategy of ['networkFirst', 'cacheFirst', 'staleWhileRevalidate']) { + for (const cached of strategy === 'networkFirst' ? [false, true] : [false]) { + const cachedResponse = cached ? new Response('stale body') : null; + const { sandbox, networkResponse } = createFetchWorker({ failure, cachedResponse }); + const response = await sandbox[strategy]({ url: 'http://localhost/screen/test' }, 'cache'); + assert.equal(response, networkResponse, strategy + ', failure=' + failure + ', cached=' + cached); + assert.equal(response.status, 200); + assert.equal(response.headers.get('ETag'), '"fresh"'); + assert.equal(await response.text(), 'fresh network body'); + } + } + } +}); + +test('successful cache writes retain the normalized key and do not consume the network body', async () => { + const { sandbox, calls, networkResponse } = createFetchWorker(); + const request = { url: 'http://localhost/api/screens/test/playlist?ts=1' }; + const normalizedKey = { url: 'http://localhost/api/screens/test/playlist' }; + const response = await sandbox.networkFirst(request, 'cache', normalizedKey); + assert.equal(response, networkResponse); + assert.equal(calls.writes.length, 1); + assert.equal(calls.writes[0].key, normalizedKey); + assert.notEqual(calls.writes[0].response, networkResponse); + assert.equal(await calls.writes[0].response.text(), 'fresh network body'); + assert.equal(await response.text(), 'fresh network body'); +}); + +test('asset cache hits do not fetch and offline pages still fall back to cached responses', async () => { + const cachedResponse = new Response('cached body'); + const cacheHit = createFetchWorker({ cachedResponse }); + assert.equal(await cacheHit.sandbox.cacheFirst({}, 'cache'), cachedResponse); + assert.equal(cacheHit.calls.fetch, 0); + const offlineHit = createFetchWorker({ cachedResponse, fetchError: true }); + assert.equal(await offlineHit.sandbox.networkFirst({}, 'cache'), cachedResponse); + const offlineMiss = createFetchWorker({ fetchError: true }); + assert.equal((await offlineMiss.sandbox.networkFirst({}, 'cache')).status, 504); +}); + +test('player script assets refresh from network and retain offline cache fallback', async () => { + const cachedResponse = new Response('old script body'); + const online = createFetchWorker({ cachedResponse }); + let onlineResponsePromise; + online.listeners.get('fetch')({ + request: new Request('http://localhost/assets/player-script/rendering.js?v=2.14.0'), + respondWith(promise) { onlineResponsePromise = promise; } + }); + assert.equal(await onlineResponsePromise, online.networkResponse); + assert.equal(online.calls.fetch, 1); + + const offline = createFetchWorker({ cachedResponse: cachedResponse, fetchError: true }); + let offlineResponsePromise; + offline.listeners.get('fetch')({ + request: new Request('http://localhost/assets/player-script/rendering.js?v=2.14.0'), + respondWith(promise) { offlineResponsePromise = promise; } + }); + assert.equal(await offlineResponsePromise, cachedResponse); +}); \ No newline at end of file diff --git a/test/player-time-date-region.test.js b/test/player-time-date-region.test.js index aff5559..99df74c 100644 --- a/test/player-time-date-region.test.js +++ b/test/player-time-date-region.test.js @@ -5,6 +5,7 @@ const vm = require('node:vm'); function loadTimeDateModule() { const webUiHelpersScript = fs.readFileSync(require.resolve('../src/web/public/js/web-ui-helpers.js'), 'utf8'); + const sharedRenderingScript = fs.readFileSync(require.resolve('../src/player/rendering-shared.js'), 'utf8'); const renderingScript = fs.readFileSync(require.resolve('../src/player/public/js/player-page-rendering.js'), 'utf8'); const placeholderScript = fs.readFileSync(require.resolve('../src/web/public/js/shared/placeholder-utils.js'), 'utf8'); const timeDateScript = fs.readFileSync(require.resolve('../src/player/regions/time-date.js'), 'utf8'); @@ -39,6 +40,7 @@ function loadTimeDateModule() { vm.runInNewContext(webUiHelpersScript, sandbox, { filename: 'web-ui-helpers.js' }); sandbox.escapeHtml = sandbox.window.escapeHtml; + vm.runInNewContext(sharedRenderingScript, sandbox, { filename: 'rendering-shared.js' }); vm.runInNewContext(renderingScript, sandbox, { filename: 'player-page-rendering.js' }); vm.runInNewContext(placeholderScript, sandbox, { filename: 'placeholder-utils.js' }); vm.runInNewContext(timeDateScript, sandbox, { filename: 'time-date.js' }); diff --git a/test/slide-form-editor.test.js b/test/slide-form-editor.test.js index c6fe926..48924c6 100644 --- a/test/slide-form-editor.test.js +++ b/test/slide-form-editor.test.js @@ -30,6 +30,11 @@ test('slide editor keeps normal TinyMCE image insertion unchanged', () => { assert.ok(slideFormEditorSource.includes('images_upload_handler: uploadEditorImage')); }); +test('slide editor preserves player-local media paths and image placeholders without web-editor URL prefixes', () => { + assert.ok(slideFormEditorSource.includes('convert_urls: false')); + assert.doesNotMatch(slideFormEditorSource, /convert_urls:\s*true/); +}); + test('slide editor inserts tables with zero padding and spacing by default', () => { assert.ok(slideFormEditorSource.includes("table_default_attributes: {")); assert.ok(slideFormEditorSource.includes("cellpadding: '0'")); @@ -78,6 +83,9 @@ test('slide thumbnail previews treat image-only text as visible content', () => test('popup preview falls back to iframe sizing rules', () => { const popupPreviewSource = fs.readFileSync(require.resolve('../src/web/views/signage/slides/popup-preview.hbs'), 'utf8'); + assert.ok(popupPreviewSource.includes('/assets/js/regions/chart-data.js')); + assert.ok(popupPreviewSource.includes('.slide-preview-chart-region canvas')); + assert.ok(popupPreviewSource.includes('background: transparent !important')); assert.ok(popupPreviewSource.includes('#popup-preview-canvas iframe')); assert.ok(popupPreviewSource.includes('#popup-preview-canvas .slide-preview-webpage-region iframe')); assert.ok(popupPreviewSource.includes('#popup-preview-canvas .slide-preview-html-region iframe'));