diff --git a/assets/js/preview.js b/assets/js/preview.js index a72fc692f..6aa22ea7d 100644 --- a/assets/js/preview.js +++ b/assets/js/preview.js @@ -1,7 +1,9 @@ /* eslint n/no-unsupported-features/node-builtins: "off" */ + /* globals photoBooth photoboothTools */ -function addCacheBustingParam(url) { +function getPreviewUrlWithCacheBusting() { + const url = getBasePreviewUrl(); const timestamp = new Date().getTime(); if (url.includes('?')) { @@ -11,10 +13,16 @@ function addCacheBustingParam(url) { return `${url}?t=${timestamp}`; } -function getRootProperty(property) { - const root = document.documentElement; - const style = getComputedStyle(root); - return style.getPropertyValue(property).trim(); +function getBasePreviewUrl() { + if (!config.preview || !config.preview.url) { + return ''; + } + + const raw = config.preview.url; + //remove url("") if present + const match = raw.match(/^url\((['"]?)(.+?)\1\)$/); + + return match ? match[2] : raw; } const photoboothPreview = (function () { @@ -196,8 +204,9 @@ const photoboothPreview = (function () { } else if (config.preview.mode === PreviewMode.URL.valueOf()) { photoboothTools.console.logDev('Preview: Preview at countdown from URL.'); setTimeout(function () { - url.attr('src', addCacheBustingParam(getRootProperty('--background-preview'))); + url.css('background-image', 'url("' + getPreviewUrlWithCacheBusting() + '")'); url.show(); + url.addClass('streaming'); }, config.preview.url_delay); } break; @@ -208,8 +217,9 @@ const photoboothPreview = (function () { } else if (config.preview.mode === PreviewMode.URL.valueOf()) { photoboothTools.console.logDev('Preview: Preview from URL.'); setTimeout(function () { - url.attr('src', addCacheBustingParam(getRootProperty('--background-preview'))); + url.css('background-image', 'url("' + getPreviewUrlWithCacheBusting() + '")'); url.show(); + url.addClass('streaming'); }, config.preview.url_delay); } break; @@ -235,8 +245,9 @@ const photoboothPreview = (function () { tracks.forEach((track) => track.stop()); api.stream = null; } + url.removeClass('streaming'); url.hide(); - url.attr('src', ''); + url.css('background-image', 'none'); video.hide(); pictureFrame.hide(); collageFrame.hide(); diff --git a/assets/js/test-preview.js b/assets/js/test-preview.js index b32b57728..4a3a8b9eb 100644 --- a/assets/js/test-preview.js +++ b/assets/js/test-preview.js @@ -96,7 +96,7 @@ const photoboothPreviewTest = (function () { if (config.preview.mode === PreviewMode.DEVICE.valueOf()) { photoboothPreview.stopVideo(); } else if (config.preview.mode === PreviewMode.URL.valueOf()) { - previewIpcam.attr('src', ''); + previewIpcam.removeClass('streaming'); previewIpcam.hide(); } diff --git a/assets/sass/components/_preview.scss b/assets/sass/components/_preview.scss index 1b39e2b44..48eda7ea9 100644 --- a/assets/sass/components/_preview.scss +++ b/assets/sass/components/_preview.scss @@ -92,3 +92,9 @@ scale: 1 -1; } } + +#preview--ipcam { + &.streaming { + background-image: var(--background-preview); + } +} diff --git a/manual/index.php b/manual/index.php index 92ca37415..2af298d44 100644 --- a/manual/index.php +++ b/manual/index.php @@ -19,7 +19,12 @@ $configsetup = require PathUtility::getAbsolutePath('lib/configsetup.inc.php'); $languageService = LanguageService::getInstance(); -$pageTitle = 'Manual - ' . ApplicationService::getInstance()->getTitle(); + +$appName = ApplicationService::getInstance()->getTitle(); +$appVersion = ApplicationService::getInstance()->getVersion(); +$page = 'Manual'; +$pageTitle = $page . ' - ' . $appName . ' (' . $appVersion . ')'; + include PathUtility::getAbsolutePath('admin/components/head.admin.php'); include PathUtility::getAbsolutePath('admin/helper/index.php'); @@ -31,7 +36,7 @@