Release 1.5.3
This commit is contained in:
@@ -6,7 +6,13 @@ const { spawn } = require('child_process');
|
||||
function createRtmpStreamService(options) {
|
||||
const mediaDir = options && options.mediaDir ? options.mediaDir : null;
|
||||
const ffmpegPath = options && options.ffmpegPath ? options.ffmpegPath : 'ffmpeg';
|
||||
const ffprobePath = options && options.ffprobePath ? options.ffprobePath : 'ffprobe';
|
||||
const probeIntervalMs = options && options.probeIntervalMs ? Number(options.probeIntervalMs) : 2000;
|
||||
const sessions = new Map();
|
||||
const watchedSources = new Set();
|
||||
const sourceStatusCache = new Map();
|
||||
const sourceProbePromises = new Map();
|
||||
let probeTimer = null;
|
||||
|
||||
if (!mediaDir) {
|
||||
throw new Error('mediaDir is required');
|
||||
@@ -48,6 +54,207 @@ function createRtmpStreamService(options) {
|
||||
return false;
|
||||
}
|
||||
|
||||
function runCommand(command, args, timeoutMs) {
|
||||
return new Promise(function (resolve) {
|
||||
var child = spawn(command, args, {
|
||||
stdio: ['ignore', 'pipe', 'pipe']
|
||||
});
|
||||
var stdout = '';
|
||||
var stderr = '';
|
||||
var finished = false;
|
||||
var timer = null;
|
||||
|
||||
function done(result) {
|
||||
if (finished) {
|
||||
return;
|
||||
}
|
||||
finished = true;
|
||||
if (timer) {
|
||||
clearTimeout(timer);
|
||||
timer = null;
|
||||
}
|
||||
resolve(result);
|
||||
}
|
||||
|
||||
child.stdout.on('data', function (chunk) {
|
||||
stdout += String(chunk || '');
|
||||
});
|
||||
|
||||
child.stderr.on('data', function (chunk) {
|
||||
stderr += String(chunk || '');
|
||||
});
|
||||
|
||||
child.on('error', function (error) {
|
||||
done({ ok: false, error: error, stdout: stdout, stderr: stderr, timedOut: false });
|
||||
});
|
||||
|
||||
child.on('exit', function (code, signal) {
|
||||
done({ ok: code === 0, code: code, signal: signal, stdout: stdout, stderr: stderr, timedOut: false });
|
||||
});
|
||||
|
||||
timer = setTimeout(function () {
|
||||
try {
|
||||
child.kill('SIGKILL');
|
||||
} catch (_error) {
|
||||
// ignore timeout cleanup errors
|
||||
}
|
||||
done({ ok: false, code: null, signal: 'SIGKILL', stdout: stdout, stderr: stderr, timedOut: true });
|
||||
}, Math.max(1000, Number(timeoutMs || 0) || 4000));
|
||||
});
|
||||
}
|
||||
|
||||
async function probeSourceUrl(sourceUrl) {
|
||||
const normalizedSource = normalizeSourceUrl(sourceUrl);
|
||||
const result = await runCommand(ffprobePath, [
|
||||
'-hide_banner',
|
||||
'-loglevel', 'error',
|
||||
'-rw_timeout', '3000000',
|
||||
'-show_streams',
|
||||
'-of', 'json',
|
||||
normalizedSource
|
||||
], 4000);
|
||||
|
||||
if (!result.ok) {
|
||||
return {
|
||||
live: false,
|
||||
timedOut: Boolean(result.timedOut),
|
||||
stderr: String(result.stderr || '').trim()
|
||||
};
|
||||
}
|
||||
|
||||
try {
|
||||
const parsed = JSON.parse(String(result.stdout || '{}'));
|
||||
const streams = Array.isArray(parsed && parsed.streams) ? parsed.streams : [];
|
||||
return {
|
||||
live: streams.length > 0,
|
||||
timedOut: false,
|
||||
stderr: String(result.stderr || '').trim()
|
||||
};
|
||||
} catch (_error) {
|
||||
return {
|
||||
live: false,
|
||||
timedOut: false,
|
||||
stderr: String(result.stderr || '').trim()
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function getSourceStatus(sourceUrl) {
|
||||
return sourceStatusCache.get(String(sourceUrl || '').trim()) || null;
|
||||
}
|
||||
|
||||
function setSourceStatus(sourceUrl, nextStatus) {
|
||||
const normalizedSource = String(sourceUrl || '').trim();
|
||||
if (!normalizedSource) {
|
||||
return null;
|
||||
}
|
||||
const status = Object.assign({
|
||||
live: false,
|
||||
probing: false,
|
||||
checkedAt: Date.now(),
|
||||
timedOut: false,
|
||||
stderr: ''
|
||||
}, nextStatus || {});
|
||||
status.live = Boolean(status.live);
|
||||
status.probing = Boolean(status.probing);
|
||||
status.checkedAt = Number(status.checkedAt || Date.now());
|
||||
sourceStatusCache.set(normalizedSource, status);
|
||||
return status;
|
||||
}
|
||||
|
||||
function registerSourceWatch(sourceUrl) {
|
||||
const normalizedSource = normalizeSourceUrl(sourceUrl);
|
||||
watchedSources.add(normalizedSource);
|
||||
return normalizedSource;
|
||||
}
|
||||
|
||||
async function refreshSourceStatus(sourceUrl) {
|
||||
const normalizedSource = registerSourceWatch(sourceUrl);
|
||||
const existingPromise = sourceProbePromises.get(normalizedSource) || null;
|
||||
if (existingPromise) {
|
||||
return existingPromise;
|
||||
}
|
||||
|
||||
setSourceStatus(normalizedSource, Object.assign({}, getSourceStatus(normalizedSource) || {}, {
|
||||
probing: true
|
||||
}));
|
||||
|
||||
const probePromise = probeSourceUrl(normalizedSource).then(function (probe) {
|
||||
return setSourceStatus(normalizedSource, {
|
||||
live: Boolean(probe.live),
|
||||
probing: false,
|
||||
checkedAt: Date.now(),
|
||||
timedOut: Boolean(probe.timedOut),
|
||||
stderr: String(probe.stderr || '')
|
||||
});
|
||||
}).catch(function (error) {
|
||||
return setSourceStatus(normalizedSource, {
|
||||
live: false,
|
||||
probing: false,
|
||||
checkedAt: Date.now(),
|
||||
timedOut: false,
|
||||
stderr: String(error && error.message ? error.message : '')
|
||||
});
|
||||
}).finally(function () {
|
||||
sourceProbePromises.delete(normalizedSource);
|
||||
});
|
||||
|
||||
sourceProbePromises.set(normalizedSource, probePromise);
|
||||
return probePromise;
|
||||
}
|
||||
|
||||
function scheduleSourceRefresh(sourceUrl) {
|
||||
const normalizedSource = registerSourceWatch(sourceUrl);
|
||||
const currentStatus = getSourceStatus(normalizedSource);
|
||||
if (currentStatus && currentStatus.probing) {
|
||||
return sourceProbePromises.get(normalizedSource) || Promise.resolve(currentStatus);
|
||||
}
|
||||
return refreshSourceStatus(normalizedSource);
|
||||
}
|
||||
|
||||
function isSourceStatusFresh(status) {
|
||||
if (!status || !status.checkedAt) {
|
||||
return false;
|
||||
}
|
||||
return Date.now() - Number(status.checkedAt || 0) < probeIntervalMs;
|
||||
}
|
||||
|
||||
function sweepWatchedSources() {
|
||||
watchedSources.forEach(function (sourceUrl) {
|
||||
const status = getSourceStatus(sourceUrl);
|
||||
if (!status || !isSourceStatusFresh(status) || status.live === false) {
|
||||
scheduleSourceRefresh(sourceUrl);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (probeIntervalMs > 0) {
|
||||
probeTimer = setInterval(function () {
|
||||
sweepWatchedSources();
|
||||
}, probeIntervalMs);
|
||||
if (probeTimer && typeof probeTimer.unref === 'function') {
|
||||
probeTimer.unref();
|
||||
}
|
||||
}
|
||||
|
||||
async function isSessionLive(session) {
|
||||
if (!session || !session.process) {
|
||||
return false;
|
||||
}
|
||||
if (session.exitCode !== undefined && session.exitCode !== null) {
|
||||
return false;
|
||||
}
|
||||
if (session.exitSignal !== undefined && session.exitSignal !== null) {
|
||||
return false;
|
||||
}
|
||||
try {
|
||||
const stat = await fs.promises.stat(session.manifestPath);
|
||||
return stat.isFile() && stat.size > 0;
|
||||
} catch (_error) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function buildPlaylistUrl(key) {
|
||||
return '/api/rtmp/streams/' + encodeURIComponent(key) + '/index.m3u8';
|
||||
}
|
||||
@@ -56,14 +263,30 @@ function createRtmpStreamService(options) {
|
||||
const normalizedSource = normalizeSourceUrl(sourceUrl);
|
||||
const normalizedDisableAudio = Boolean(disableAudio);
|
||||
const key = getSessionKey(normalizedSource, normalizedDisableAudio);
|
||||
|
||||
if (sessions.has(key)) {
|
||||
return sessions.get(key);
|
||||
}
|
||||
|
||||
const directory = path.join(cacheRoot, key);
|
||||
const manifestPath = path.join(directory, 'index.m3u8');
|
||||
|
||||
const existingSession = sessions.get(key) || null;
|
||||
if (existingSession && existingSession.process && existingSession.exitCode === null && existingSession.exitSignal === null) {
|
||||
return existingSession;
|
||||
}
|
||||
|
||||
if (existingSession) {
|
||||
sessions.delete(key);
|
||||
try {
|
||||
if (existingSession.process && typeof existingSession.process.kill === 'function') {
|
||||
existingSession.process.kill('SIGKILL');
|
||||
}
|
||||
} catch (_error) {
|
||||
// ignore cleanup errors
|
||||
}
|
||||
try {
|
||||
await fs.promises.rm(directory, { recursive: true, force: true });
|
||||
} catch (_error2) {
|
||||
// ignore cleanup errors
|
||||
}
|
||||
}
|
||||
|
||||
await ensureDirectory(directory);
|
||||
|
||||
const args = [
|
||||
@@ -117,6 +340,8 @@ function createRtmpStreamService(options) {
|
||||
manifestPath: manifestPath,
|
||||
playlistUrl: buildPlaylistUrl(key),
|
||||
process: child,
|
||||
exitCode: null,
|
||||
exitSignal: null,
|
||||
ready: waitForFile(manifestPath, 5000)
|
||||
};
|
||||
|
||||
@@ -132,6 +357,51 @@ function createRtmpStreamService(options) {
|
||||
return session.playlistUrl + '?t=' + Date.now();
|
||||
}
|
||||
|
||||
async function getSessionStatus(sourceUrl, disableAudio) {
|
||||
const normalizedSource = normalizeSourceUrl(sourceUrl);
|
||||
const normalizedDisableAudio = Boolean(disableAudio);
|
||||
registerSourceWatch(normalizedSource);
|
||||
|
||||
let sourceStatus = getSourceStatus(normalizedSource);
|
||||
if (!sourceStatus) {
|
||||
scheduleSourceRefresh(normalizedSource).catch(function (_error) {
|
||||
return null;
|
||||
});
|
||||
sourceStatus = getSourceStatus(normalizedSource);
|
||||
} else if (!isSourceStatusFresh(sourceStatus) && !sourceStatus.probing) {
|
||||
scheduleSourceRefresh(normalizedSource).catch(function (_error) {
|
||||
return null;
|
||||
});
|
||||
}
|
||||
|
||||
if (!sourceStatus || !sourceStatus.live) {
|
||||
return {
|
||||
session: null,
|
||||
ready: false,
|
||||
live: false,
|
||||
probing: Boolean(sourceStatus && sourceStatus.probing),
|
||||
checkedAt: sourceStatus ? sourceStatus.checkedAt : null,
|
||||
timedOut: Boolean(sourceStatus && sourceStatus.timedOut),
|
||||
stderr: String(sourceStatus && sourceStatus.stderr || '')
|
||||
};
|
||||
}
|
||||
|
||||
const session = await ensureSession(normalizedSource, normalizedDisableAudio);
|
||||
const ready = await session.ready.catch(function () {
|
||||
return false;
|
||||
});
|
||||
const live = ready && Boolean(session && session.process && session.exitCode === null && session.exitSignal === null);
|
||||
return {
|
||||
session: session,
|
||||
ready: ready,
|
||||
live: live,
|
||||
probing: Boolean(sourceStatus && sourceStatus.probing),
|
||||
checkedAt: sourceStatus ? sourceStatus.checkedAt : null,
|
||||
timedOut: false,
|
||||
stderr: ''
|
||||
};
|
||||
}
|
||||
|
||||
function getSessionByKey(key) {
|
||||
return sessions.get(String(key || '').trim()) || null;
|
||||
}
|
||||
@@ -141,9 +411,13 @@ function createRtmpStreamService(options) {
|
||||
if (!session) {
|
||||
return null;
|
||||
}
|
||||
await session.ready.catch(function () {
|
||||
return false;
|
||||
});
|
||||
if (!session.process || session.exitCode !== null || session.exitSignal !== null) {
|
||||
return null;
|
||||
}
|
||||
const live = await isSessionLive(session);
|
||||
if (!live) {
|
||||
return null;
|
||||
}
|
||||
return session.manifestPath;
|
||||
}
|
||||
|
||||
@@ -163,6 +437,11 @@ function createRtmpStreamService(options) {
|
||||
ensureSession: ensureSession,
|
||||
getPlaylistUrl: getPlaylistUrl,
|
||||
getSessionByKey: getSessionByKey,
|
||||
isSessionLive: isSessionLive,
|
||||
getSessionStatus: getSessionStatus,
|
||||
refreshSourceStatus: refreshSourceStatus,
|
||||
scheduleSourceRefresh: scheduleSourceRefresh,
|
||||
getSourceStatus: getSourceStatus,
|
||||
getManifestFilePath: getManifestFilePath,
|
||||
getSegmentFilePath: getSegmentFilePath
|
||||
};
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
let currentPlaylistSignature = '';
|
||||
let currentPlaylistEtag = '';
|
||||
let currentPlaylistFadeBetweenSlides = false;
|
||||
let currentPlaylistSkipUnavailableRtmp = false;
|
||||
let pendingPlaylistUpdate = null;
|
||||
let activeSlidesCacheKey = '';
|
||||
let activeSlidesCacheValue = [];
|
||||
@@ -16,6 +17,7 @@
|
||||
let index = 0;
|
||||
let timer = null;
|
||||
let slideTransitionTimer = null;
|
||||
let slideRenderRequestId = 0;
|
||||
let preloadContainer = null;
|
||||
let preloadSignature = '';
|
||||
let commandSocket = null;
|
||||
@@ -154,16 +156,18 @@
|
||||
}
|
||||
if (initialData && initialData.playlist) {
|
||||
currentPlaylistFadeBetweenSlides = Boolean(initialData.playlist.fade_between_slides);
|
||||
currentPlaylistSkipUnavailableRtmp = Boolean(initialData.playlist.skip_unavailable_rtmp);
|
||||
}
|
||||
savePlaylistSnapshot({
|
||||
slides: slides,
|
||||
signature: currentPlaylistSignature,
|
||||
fadeBetweenSlides: currentPlaylistFadeBetweenSlides,
|
||||
skipUnavailableRtmp: currentPlaylistSkipUnavailableRtmp,
|
||||
etag: currentPlaylistEtag
|
||||
});
|
||||
syncWebpagePreloads(getActiveSlidesFrom(slides), index);
|
||||
if (typeof syncRtmpPreloads === 'function') {
|
||||
syncRtmpPreloads(getActiveSlidesFrom(slides), index);
|
||||
if (typeof syncRtmpWarmups === 'function') {
|
||||
syncRtmpWarmups(getActiveSlidesFrom(slides), index);
|
||||
}
|
||||
syncBlackoutState();
|
||||
showCurrent();
|
||||
|
||||
@@ -73,7 +73,7 @@ function createPlayerPlaylistService(options) {
|
||||
return payloadWithoutPlaylist;
|
||||
}
|
||||
|
||||
const [playlistRows] = await pool.query('SELECT id, name, fade_between_slides, created_at, modified_at, created_by, modified_by FROM playlists WHERE id = ?', [screen.playlist_id]);
|
||||
const [playlistRows] = await pool.query('SELECT id, name, fade_between_slides, skip_unavailable_rtmp, created_at, modified_at, created_by, modified_by FROM playlists WHERE id = ?', [screen.playlist_id]);
|
||||
const playlist = playlistRows[0] || null;
|
||||
const [slideRows] = await pool.query(`
|
||||
SELECT sl.id, sl.title, sl.body, sl.template_id, sl.content_json, sl.media_path, sl.media_type, sl.created_at, sl.modified_at,
|
||||
@@ -180,6 +180,7 @@ function createPlayerPlaylistService(options) {
|
||||
updatePlaylistRevisionHash(hash, playlist && playlist.id);
|
||||
updatePlaylistRevisionHash(hash, playlist && playlist.modified_at);
|
||||
updatePlaylistRevisionHash(hash, playlist && playlist.fade_between_slides);
|
||||
updatePlaylistRevisionHash(hash, playlist && playlist.skip_unavailable_rtmp);
|
||||
|
||||
(Array.isArray(slideRows) ? slideRows : []).forEach(function (slide) {
|
||||
updatePlaylistRevisionHash(hash, slide.id);
|
||||
|
||||
@@ -397,6 +397,7 @@ body.screen-blackout #app {
|
||||
.template-region-rtmp-placeholder {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.template-region-placeholder {
|
||||
|
||||
@@ -89,6 +89,12 @@ function scheduleSlideAdvance(delayMs) {
|
||||
}, holdDelayMs);
|
||||
}
|
||||
|
||||
// Add the fade time to a slide's hold duration so the configured duration remains visible.
|
||||
function getSlideHoldDelay(delayMs) {
|
||||
var holdDelayMs = Math.max(1, Number(delayMs || 0));
|
||||
return holdDelayMs + (currentPlaylistFadeBetweenSlides ? slideFadeDurationMs : 0);
|
||||
}
|
||||
|
||||
// Cancel any pending fade-transition cleanup.
|
||||
function clearSlideTransitionTimer() {
|
||||
if (slideTransitionTimer) {
|
||||
|
||||
@@ -1,5 +1,8 @@
|
||||
// Show or hide the offline status banner.
|
||||
function setOfflineBannerVisible(visible, message) {
|
||||
if (window.__pulseThumbnailPreview) {
|
||||
return;
|
||||
}
|
||||
var normalizedVisible = Boolean(visible);
|
||||
var bannerMessage = String(message || 'Offline mode: using cached playlist.').trim();
|
||||
if (normalizedVisible) {
|
||||
@@ -38,6 +41,9 @@ function setOfflineBannerVisible(visible, message) {
|
||||
|
||||
// Update the offline banner based on connectivity or playlist availability.
|
||||
function syncOfflineBanner() {
|
||||
if (window.__pulseThumbnailPreview) {
|
||||
return;
|
||||
}
|
||||
if (!window.navigator.onLine) {
|
||||
setOfflineBannerVisible(true, 'Offline mode: using cached playlist.');
|
||||
return;
|
||||
@@ -57,6 +63,9 @@ function clearRefreshRetry() {
|
||||
|
||||
// Retry playlist refresh with a short backoff while the player is offline.
|
||||
function scheduleRefreshRetry() {
|
||||
if (window.__pulseThumbnailPreview) {
|
||||
return;
|
||||
}
|
||||
if (refreshRetryTimer) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
// Render the slide at the requested index within the active set.
|
||||
function renderSlideAtIndex(sourceSlides, targetIndex) {
|
||||
async function renderSlideAtIndex(sourceSlides, targetIndex) {
|
||||
const availableSlides = Array.isArray(sourceSlides) ? sourceSlides : [];
|
||||
if (!availableSlides.length) {
|
||||
renderEmpty(slides.length ? 'No slides are scheduled for this time.' : 'No slides assigned to this screen yet.');
|
||||
@@ -11,18 +11,52 @@ function renderSlideAtIndex(sourceSlides, targetIndex) {
|
||||
if (!Number.isFinite(normalizedIndex) || normalizedIndex < 0 || normalizedIndex >= availableSlides.length) {
|
||||
}
|
||||
|
||||
const slide = availableSlides[normalizedIndex];
|
||||
var slideCount = availableSlides.length;
|
||||
var currentIndex = normalizedIndex;
|
||||
var slide = null;
|
||||
var attempts = 0;
|
||||
var renderRequestId = ++slideRenderRequestId;
|
||||
|
||||
while (attempts < slideCount) {
|
||||
slide = availableSlides[currentIndex];
|
||||
if (!slide) {
|
||||
break;
|
||||
}
|
||||
if (currentPlaylistSkipUnavailableRtmp && typeof probeRtmpSlideAvailability === 'function') {
|
||||
var isAvailable = await probeRtmpSlideAvailability(slide);
|
||||
if (!isAvailable) {
|
||||
if (renderRequestId !== slideRenderRequestId) {
|
||||
return false;
|
||||
}
|
||||
currentIndex = (currentIndex + 1) % slideCount;
|
||||
attempts += 1;
|
||||
slide = null;
|
||||
continue;
|
||||
}
|
||||
}
|
||||
if (renderRequestId !== slideRenderRequestId) {
|
||||
break;
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
if (!slide) {
|
||||
if (currentPlaylistSkipUnavailableRtmp) {
|
||||
renderEmpty(slides.length ? 'No RTMP slides are currently available.' : 'No slides assigned to this screen yet.');
|
||||
lastRenderedViewKey = getCurrentRenderKey(availableSlides);
|
||||
scheduleRefreshRetry();
|
||||
return false;
|
||||
}
|
||||
renderEmpty(slides.length ? 'No slides are scheduled for this time.' : 'No slides assigned to this screen yet.');
|
||||
return false;
|
||||
}
|
||||
|
||||
index = normalizedIndex;
|
||||
index = currentIndex;
|
||||
var markup = buildSlideMarkup(slide);
|
||||
renderSlideMarkup(markup, currentPlaylistFadeBetweenSlides);
|
||||
sendCommandState(slide);
|
||||
if (!isPaused) {
|
||||
scheduleSlideAdvance(Math.max(1, Number(slide.duration_seconds || 10)) * 1000);
|
||||
scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(slide.duration_seconds || 10)) * 1000));
|
||||
}
|
||||
lastRenderedViewKey = getCurrentRenderKey(availableSlides);
|
||||
return true;
|
||||
@@ -36,6 +70,7 @@ function applyPendingPlaylistUpdate() {
|
||||
slides = pendingPlaylistUpdate.slides;
|
||||
currentPlaylistSignature = pendingPlaylistUpdate.signature;
|
||||
currentPlaylistFadeBetweenSlides = pendingPlaylistUpdate.fadeBetweenSlides;
|
||||
currentPlaylistSkipUnavailableRtmp = Boolean(pendingPlaylistUpdate.skipUnavailableRtmp);
|
||||
pendingPlaylistUpdate = null;
|
||||
clearActiveSlidesCache();
|
||||
slideMarkupCache = Object.create(null);
|
||||
@@ -53,18 +88,45 @@ function showCurrent() {
|
||||
applyPendingPlaylistUpdate();
|
||||
const activeSlides = getCurrentActiveSlides();
|
||||
syncWebpagePreloads(activeSlides, index);
|
||||
if (typeof syncRtmpPreloads === 'function') {
|
||||
syncRtmpPreloads(activeSlides, index);
|
||||
if (typeof syncRtmpWarmups === 'function') {
|
||||
syncRtmpWarmups(activeSlides, index);
|
||||
}
|
||||
if (!activeSlides.length) {
|
||||
renderEmpty(slides.length ? 'No slides are scheduled for this time.' : 'No slides assigned to this screen yet.');
|
||||
lastRenderedViewKey = getCurrentRenderKey(activeSlides);
|
||||
return;
|
||||
}
|
||||
renderSlideAtIndex(activeSlides, index);
|
||||
void renderSlideAtIndex(activeSlides, index);
|
||||
lastRenderedViewKey = getCurrentRenderKey(activeSlides);
|
||||
}
|
||||
|
||||
// Skip the current slide when an RTMP feed is unavailable and the playlist asks for it.
|
||||
function handleRtmpPlaybackFailure(message, options) {
|
||||
if (!currentPlaylistSkipUnavailableRtmp) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var silent = Boolean(options && options.silent);
|
||||
const activeSlides = getCurrentActiveSlides();
|
||||
if (!activeSlides.length) {
|
||||
return false;
|
||||
}
|
||||
|
||||
clearSlideTimer();
|
||||
if (!silent) {
|
||||
logDebug('Skipping RTMP slide because the stream is unavailable.', String(message || ''), 'error');
|
||||
}
|
||||
|
||||
const nextIndex = (Number(index || 0) + 1) % activeSlides.length;
|
||||
window.setTimeout(function () {
|
||||
if (!getCurrentActiveSlides().length) {
|
||||
return;
|
||||
}
|
||||
void renderSlideAtIndex(getCurrentActiveSlides(), nextIndex);
|
||||
}, 0);
|
||||
return true;
|
||||
}
|
||||
|
||||
// Fetch the latest playlist and queue any updates.
|
||||
function refresh() {
|
||||
var request = new XMLHttpRequest();
|
||||
@@ -85,7 +147,7 @@ function refresh() {
|
||||
markRefreshHealthy();
|
||||
setOfflineBannerVisible(false);
|
||||
if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
|
||||
scheduleSlideAdvance(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000);
|
||||
scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
|
||||
}
|
||||
return;
|
||||
}
|
||||
@@ -105,10 +167,12 @@ function refresh() {
|
||||
const nextSignature = getPlaylistRevision(data);
|
||||
const nextSlides = Array.isArray(data.slides) ? data.slides.map(normalizeSlide) : [];
|
||||
const nextFadeBetweenSlides = Boolean(data && data.playlist && data.playlist.fade_between_slides);
|
||||
const nextSkipUnavailableRtmp = Boolean(data && data.playlist && data.playlist.skip_unavailable_rtmp);
|
||||
savePlaylistSnapshot({
|
||||
slides: nextSlides,
|
||||
signature: nextSignature,
|
||||
fadeBetweenSlides: nextFadeBetweenSlides,
|
||||
skipUnavailableRtmp: nextSkipUnavailableRtmp,
|
||||
etag: responseEtag
|
||||
});
|
||||
markRefreshHealthy();
|
||||
@@ -121,6 +185,7 @@ function refresh() {
|
||||
slides = nextSlides;
|
||||
currentPlaylistSignature = nextSignature;
|
||||
currentPlaylistFadeBetweenSlides = nextFadeBetweenSlides;
|
||||
currentPlaylistSkipUnavailableRtmp = nextSkipUnavailableRtmp;
|
||||
index = 0;
|
||||
showCurrent();
|
||||
sendCommandState(lastRenderedSlide);
|
||||
@@ -128,18 +193,19 @@ function refresh() {
|
||||
}
|
||||
if (nextSignature === currentPlaylistSignature || (pendingPlaylistUpdate && nextSignature === pendingPlaylistUpdate.signature)) {
|
||||
if (currentActiveSlides.length < 2 && lastRenderedSlide) {
|
||||
scheduleSlideAdvance(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000);
|
||||
scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
|
||||
}
|
||||
return;
|
||||
}
|
||||
syncWebpagePreloads(getActiveSlidesFrom(nextSlides), index);
|
||||
if (typeof syncRtmpPreloads === 'function') {
|
||||
syncRtmpPreloads(getActiveSlidesFrom(nextSlides), index);
|
||||
if (typeof syncRtmpWarmups === 'function') {
|
||||
syncRtmpWarmups(getActiveSlidesFrom(nextSlides), index);
|
||||
}
|
||||
if (currentActiveSlides.length < 2) {
|
||||
slides = nextSlides;
|
||||
currentPlaylistSignature = nextSignature;
|
||||
currentPlaylistFadeBetweenSlides = nextFadeBetweenSlides;
|
||||
currentPlaylistSkipUnavailableRtmp = nextSkipUnavailableRtmp;
|
||||
pendingPlaylistUpdate = null;
|
||||
index = 0;
|
||||
showCurrent();
|
||||
@@ -149,7 +215,8 @@ function refresh() {
|
||||
pendingPlaylistUpdate = {
|
||||
slides: nextSlides,
|
||||
signature: nextSignature,
|
||||
fadeBetweenSlides: nextFadeBetweenSlides
|
||||
fadeBetweenSlides: nextFadeBetweenSlides,
|
||||
skipUnavailableRtmp: nextSkipUnavailableRtmp
|
||||
};
|
||||
logDebug('Playlist update detected; applying on next slide transition.');
|
||||
} catch (_error) {
|
||||
@@ -171,7 +238,7 @@ function refresh() {
|
||||
setOfflineBannerVisible(true);
|
||||
scheduleRefreshRetry();
|
||||
if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
|
||||
scheduleSlideAdvance(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000);
|
||||
scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
|
||||
}
|
||||
};
|
||||
request.ontimeout = function () {
|
||||
@@ -183,7 +250,7 @@ function refresh() {
|
||||
setOfflineBannerVisible(true);
|
||||
scheduleRefreshRetry();
|
||||
if (lastRenderedSlide && getCurrentActiveSlides().length < 2) {
|
||||
scheduleSlideAdvance(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000);
|
||||
scheduleSlideAdvance(getSlideHoldDelay(Math.max(1, Number(lastRenderedSlide.duration_seconds || 10)) * 1000));
|
||||
}
|
||||
};
|
||||
request.send();
|
||||
|
||||
@@ -411,6 +411,22 @@ function getTemplateLayout(template) {
|
||||
return layout;
|
||||
}
|
||||
|
||||
// Build a dark backdrop style for template and media canvases.
|
||||
function buildBackdropStyle(backgroundColor, backgroundImagePath) {
|
||||
var color = String(backgroundColor || '#111111').trim() || '#111111';
|
||||
var style = 'background-color:' + escapeHtml(color) + ';';
|
||||
var gradient = 'linear-gradient(rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0.42))';
|
||||
|
||||
if (backgroundImagePath) {
|
||||
style += 'background-image:' + gradient + ',url("' + escapeHtml(backgroundImagePath) + '");';
|
||||
style += 'background-position:center,center;background-size:100% 100%,cover;background-repeat:no-repeat,no-repeat;';
|
||||
return style;
|
||||
}
|
||||
|
||||
style += 'background-image:' + gradient + ';background-position:center;background-size:100% 100%;background-repeat:no-repeat;';
|
||||
return style;
|
||||
}
|
||||
|
||||
// Build the cache key for a template render plan.
|
||||
function getTemplateRenderPlanCacheKey(template) {
|
||||
return getTemplateLayoutCacheKey(template);
|
||||
@@ -469,7 +485,7 @@ function renderTemplateSlideMarkup(slide) {
|
||||
const regionContent = content[region.regionKey] || {};
|
||||
return plan.renderRegion(region, regionContent);
|
||||
}).join('') : '';
|
||||
const stageStyle = layout ? 'background-color:' + escapeHtml(layout.backgroundColor || '#111111') + ';' : '';
|
||||
const stageStyle = layout ? buildBackdropStyle(layout.backgroundColor || '#111111', template.background_image_path) : '';
|
||||
return renderSlideShell(slide, '', (layout ? layout.canvasWidth : 0) + 'px', (layout ? layout.canvasHeight : 0) + 'px', '<div class="template-stage" style="' + stageStyle + '">' + (layout ? layout.background : '') + regions + '</div>');
|
||||
}
|
||||
|
||||
@@ -486,14 +502,16 @@ function renderMediaSlideContent(slide) {
|
||||
function renderMediaSlideMarkup(slide) {
|
||||
const canvasSize = fitCanvasSize(16, 9, window.innerWidth, window.innerHeight);
|
||||
const media = renderMediaSlideContent(slide);
|
||||
return renderSlideShell(slide, 'slide-media', canvasSize.width + 'px', canvasSize.height + 'px', media);
|
||||
const canvasStyle = slide.kind === 'image' ? buildBackdropStyle('#111111', slide.media_url) : '';
|
||||
return renderSlideShell(slide, 'slide-media', canvasSize.width + 'px', canvasSize.height + 'px', media, canvasStyle);
|
||||
}
|
||||
|
||||
// Render the shared slide shell around slide-specific inner content.
|
||||
function renderSlideShell(slide, canvasClass, canvasWidth, canvasHeight, innerHtml) {
|
||||
function renderSlideShell(slide, canvasClass, canvasWidth, canvasHeight, innerHtml, canvasStyle) {
|
||||
const body = slide.body ? '<div class="body">' + escapeHtml(slide.body) + '</div>' : '';
|
||||
const className = canvasClass ? 'slide-canvas ' + canvasClass : 'slide-canvas';
|
||||
return '<div class="slide"><div class="' + className + '" style="width:' + canvasWidth + ';height:' + canvasHeight + ';">' + innerHtml + body + '</div></div>';
|
||||
const style = 'width:' + canvasWidth + ';height:' + canvasHeight + ';' + (canvasStyle || '');
|
||||
return '<div class="slide"><div class="' + className + '" style="' + style + '">' + innerHtml + body + '</div></div>';
|
||||
}
|
||||
|
||||
// Build the cache key for rendered slide markup.
|
||||
|
||||
+707
-109
@@ -1,20 +1,296 @@
|
||||
function renderRtmpRegion(region, regionContent) {
|
||||
var url = String(regionContent.value || '').trim();
|
||||
var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
|
||||
var skipUnavailable = Boolean(currentPlaylistSkipUnavailableRtmp);
|
||||
if (!url) {
|
||||
return '<div class="template-region rtmp" style="' + region.baseStyle + '"><div class="template-region-placeholder">RTMP stream</div></div>';
|
||||
}
|
||||
|
||||
return '<div class="template-region rtmp" style="' + region.baseStyle + '"><video class="template-region-rtmp-video" data-rtmp-source="' + escapeHtml(url) + '" data-rtmp-disable-audio="' + (disableAudio ? '1' : '0') + '" autoplay playsinline preload="auto" tabindex="-1" disablepictureinpicture></video><div class="template-region-placeholder template-region-rtmp-placeholder">Loading RTMP stream...</div></div>';
|
||||
return '<div class="template-region rtmp" style="' + region.baseStyle + '"><video class="template-region-rtmp-video" data-rtmp-source="' + escapeHtml(url) + '" data-rtmp-disable-audio="' + (disableAudio ? '1' : '0') + '" data-rtmp-skip-unavailable="' + (skipUnavailable ? '1' : '0') + '" autoplay playsinline preload="auto" tabindex="-1" disablepictureinpicture></video><div class="template-region-placeholder template-region-rtmp-placeholder">Loading RTMP stream...</div></div>';
|
||||
}
|
||||
|
||||
function getRtmpSessionUrl(sourceUrl, disableAudio) {
|
||||
return '/api/rtmp/session?source=' + encodeURIComponent(sourceUrl) + '&disableAudio=' + (disableAudio ? '1' : '0');
|
||||
}
|
||||
|
||||
var rtmpPreloadSignature = '';
|
||||
var rtmpAvailabilityCache = Object.create(null);
|
||||
var rtmpAvailabilityRetryMs = 5000;
|
||||
var rtmpWarmupTimers = Object.create(null);
|
||||
var rtmpBrowserReadyCache = Object.create(null);
|
||||
var rtmpBrowserWarmupTimers = Object.create(null);
|
||||
var rtmpBrowserWarmupContainer = null;
|
||||
var rtmpBrowserWarmupStates = Object.create(null);
|
||||
|
||||
function getRtmpPreloadSlides(sourceSlides, targetIndex) {
|
||||
function getRtmpAvailabilityKey(sourceUrl, disableAudio) {
|
||||
return String(sourceUrl || '').trim() + '\n' + (disableAudio ? '1' : '0');
|
||||
}
|
||||
|
||||
function setRtmpAvailability(sourceUrl, disableAudio, available) {
|
||||
var key = getRtmpAvailabilityKey(sourceUrl, disableAudio);
|
||||
rtmpAvailabilityCache[key] = {
|
||||
available: available === null ? null : Boolean(available),
|
||||
pending: available === null,
|
||||
checkedAt: Date.now()
|
||||
};
|
||||
}
|
||||
|
||||
function getRtmpAvailability(sourceUrl, disableAudio) {
|
||||
return rtmpAvailabilityCache[getRtmpAvailabilityKey(sourceUrl, disableAudio)] || null;
|
||||
}
|
||||
|
||||
function isRtmpAvailabilityStale(status) {
|
||||
if (!status || !status.checkedAt) {
|
||||
return true;
|
||||
}
|
||||
return Date.now() - Number(status.checkedAt || 0) >= rtmpAvailabilityRetryMs;
|
||||
}
|
||||
|
||||
function isRtmpSlideUnavailable(slide) {
|
||||
if (!slide || !slide.template || !Array.isArray(slide.template.regions)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var content = slide.content || {};
|
||||
return slide.template.regions.some(function (region) {
|
||||
if (region.region_type !== 'rtmp') {
|
||||
return false;
|
||||
}
|
||||
|
||||
var regionContent = content[region.region_key] || {};
|
||||
var sourceUrl = String(regionContent.value || '').trim();
|
||||
if (!sourceUrl) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
|
||||
var serverStatus = getRtmpAvailability(sourceUrl, disableAudio);
|
||||
return Boolean(!serverStatus || isRtmpAvailabilityStale(serverStatus) || serverStatus.available !== true);
|
||||
});
|
||||
}
|
||||
|
||||
function clearRtmpAvailabilityForSlide(slide) {
|
||||
if (!slide || !slide.template || !Array.isArray(slide.template.regions)) {
|
||||
return;
|
||||
}
|
||||
|
||||
var content = slide.content || {};
|
||||
slide.template.regions.forEach(function (region) {
|
||||
if (region.region_type !== 'rtmp') {
|
||||
return;
|
||||
}
|
||||
|
||||
var regionContent = content[region.region_key] || {};
|
||||
var sourceUrl = String(regionContent.value || '').trim();
|
||||
if (!sourceUrl) {
|
||||
return;
|
||||
}
|
||||
|
||||
var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
|
||||
setRtmpAvailability(sourceUrl, disableAudio, null);
|
||||
});
|
||||
}
|
||||
|
||||
function setRtmpBrowserReady(sourceUrl, disableAudio, ready) {
|
||||
var key = getRtmpAvailabilityKey(sourceUrl, disableAudio);
|
||||
rtmpBrowserReadyCache[key] = {
|
||||
ready: ready === null ? null : Boolean(ready),
|
||||
checkedAt: Date.now()
|
||||
};
|
||||
}
|
||||
|
||||
function getRtmpBrowserReady(sourceUrl, disableAudio) {
|
||||
return rtmpBrowserReadyCache[getRtmpAvailabilityKey(sourceUrl, disableAudio)] || null;
|
||||
}
|
||||
|
||||
function isRtmpBrowserReadyStale(status) {
|
||||
if (!status || !status.checkedAt) {
|
||||
return true;
|
||||
}
|
||||
return Date.now() - Number(status.checkedAt || 0) >= rtmpAvailabilityRetryMs;
|
||||
}
|
||||
|
||||
function ensureRtmpBrowserWarmupContainer() {
|
||||
if (rtmpBrowserWarmupContainer) {
|
||||
return rtmpBrowserWarmupContainer;
|
||||
}
|
||||
|
||||
rtmpBrowserWarmupContainer = document.createElement('div');
|
||||
rtmpBrowserWarmupContainer.className = 'rtmp-browser-warmups';
|
||||
rtmpBrowserWarmupContainer.setAttribute('aria-hidden', 'true');
|
||||
document.body.appendChild(rtmpBrowserWarmupContainer);
|
||||
return rtmpBrowserWarmupContainer;
|
||||
}
|
||||
|
||||
function getRtmpBrowserWarmupState(sourceUrl, disableAudio) {
|
||||
return rtmpBrowserWarmupStates[getRtmpAvailabilityKey(sourceUrl, disableAudio)] || null;
|
||||
}
|
||||
|
||||
function clearRtmpBrowserWarmupState(sourceUrl, disableAudio) {
|
||||
var key = getRtmpAvailabilityKey(sourceUrl, disableAudio);
|
||||
var state = rtmpBrowserWarmupStates[key];
|
||||
if (!state) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (state.video && state.video.__rtmpBrowserWarmupTimer) {
|
||||
window.clearTimeout(state.video.__rtmpBrowserWarmupTimer);
|
||||
state.video.__rtmpBrowserWarmupTimer = null;
|
||||
}
|
||||
if (state.video && state.video.__rtmpHls) {
|
||||
try {
|
||||
state.video.__rtmpHls.destroy();
|
||||
} catch (_error) {
|
||||
// ignore cleanup errors
|
||||
}
|
||||
state.video.__rtmpHls = null;
|
||||
}
|
||||
if (state.wrapper && state.wrapper.parentNode) {
|
||||
state.wrapper.parentNode.removeChild(state.wrapper);
|
||||
}
|
||||
delete rtmpBrowserWarmupStates[key];
|
||||
}
|
||||
|
||||
function warmupRtmpBrowser(sourceUrl, disableAudio) {
|
||||
var key = getRtmpAvailabilityKey(sourceUrl, disableAudio);
|
||||
var existing = rtmpBrowserWarmupStates[key];
|
||||
if (existing) {
|
||||
return existing;
|
||||
}
|
||||
|
||||
var wrapper = document.createElement('div');
|
||||
wrapper.className = 'rtmp-browser-warmup-entry';
|
||||
wrapper.setAttribute('aria-hidden', 'true');
|
||||
|
||||
var video = document.createElement('video');
|
||||
video.className = 'template-region-rtmp-video';
|
||||
video.dataset.rtmpSource = sourceUrl;
|
||||
video.dataset.rtmpDisableAudio = disableAudio ? '1' : '0';
|
||||
video.autoplay = true;
|
||||
video.playsInline = true;
|
||||
video.preload = 'auto';
|
||||
video.tabIndex = -1;
|
||||
video.disablePictureInPicture = true;
|
||||
video.muted = disableAudio;
|
||||
|
||||
wrapper.appendChild(video);
|
||||
ensureRtmpBrowserWarmupContainer().appendChild(wrapper);
|
||||
|
||||
var state = {
|
||||
wrapper: wrapper,
|
||||
video: video,
|
||||
sourceUrl: sourceUrl,
|
||||
disableAudio: disableAudio
|
||||
};
|
||||
rtmpBrowserWarmupStates[key] = state;
|
||||
setRtmpBrowserReady(sourceUrl, disableAudio, null);
|
||||
|
||||
var markReady = function () {
|
||||
setRtmpBrowserReady(sourceUrl, disableAudio, true);
|
||||
clearRtmpBrowserWarmupState(sourceUrl, disableAudio);
|
||||
};
|
||||
|
||||
var markNotReady = function () {
|
||||
setRtmpBrowserReady(sourceUrl, disableAudio, false);
|
||||
};
|
||||
|
||||
video.addEventListener('canplay', markReady, { once: true });
|
||||
video.addEventListener('playing', markReady, { once: true });
|
||||
video.addEventListener('error', markNotReady, { once: true });
|
||||
|
||||
if (window.Hls && window.Hls.isSupported && window.Hls.isSupported()) {
|
||||
var hls = new window.Hls({
|
||||
enableWorker: true,
|
||||
lowLatencyMode: true,
|
||||
liveSyncDurationCount: 4,
|
||||
liveMaxLatencyDurationCount: 8,
|
||||
maxBufferLength: 10,
|
||||
maxLiveSyncPlaybackRate: 1,
|
||||
backBufferLength: 10
|
||||
});
|
||||
video.__rtmpHls = hls;
|
||||
hls.attachMedia(video);
|
||||
hls.on(window.Hls.Events.MEDIA_ATTACHED, function () {
|
||||
requestWarmupPlaylist(sourceUrl, disableAudio, video, markNotReady);
|
||||
});
|
||||
hls.on(window.Hls.Events.ERROR, function (_event, data) {
|
||||
if (data && data.fatal) {
|
||||
markNotReady();
|
||||
clearRtmpBrowserWarmupState(sourceUrl, disableAudio);
|
||||
}
|
||||
});
|
||||
return state;
|
||||
}
|
||||
|
||||
if (video.canPlayType && video.canPlayType('application/vnd.apple.mpegurl')) {
|
||||
requestWarmupPlaylist(sourceUrl, disableAudio, video, markNotReady);
|
||||
return state;
|
||||
}
|
||||
|
||||
markNotReady();
|
||||
return state;
|
||||
}
|
||||
|
||||
function requestWarmupPlaylist(sourceUrl, disableAudio, video, onFailure) {
|
||||
fetch(getRtmpSessionUrl(sourceUrl, disableAudio), {
|
||||
credentials: 'same-origin'
|
||||
}).then(function (response) {
|
||||
return response.json().catch(function () {
|
||||
return null;
|
||||
}).then(function (payload) {
|
||||
return {
|
||||
response: response,
|
||||
payload: payload
|
||||
};
|
||||
});
|
||||
}).then(function (result) {
|
||||
if (!result || !result.response) {
|
||||
throw new Error('Unable to initialize RTMP stream.');
|
||||
}
|
||||
|
||||
var response = result.response;
|
||||
var payload = result.payload || null;
|
||||
var playlistUrl = payload && payload.playlistUrl ? String(payload.playlistUrl).trim() : '';
|
||||
|
||||
if (!response.ok) {
|
||||
if (response.status === 503 && payload && payload.probing) {
|
||||
setRtmpBrowserReady(sourceUrl, disableAudio, null);
|
||||
if (video && !video.__rtmpBrowserWarmupTimer) {
|
||||
video.__rtmpBrowserWarmupTimer = window.setTimeout(function () {
|
||||
video.__rtmpBrowserWarmupTimer = null;
|
||||
requestWarmupPlaylist(sourceUrl, disableAudio, video, onFailure);
|
||||
}, 500);
|
||||
}
|
||||
return;
|
||||
}
|
||||
throw new Error('Unable to initialize RTMP stream.');
|
||||
}
|
||||
|
||||
if (!playlistUrl) {
|
||||
throw new Error('RTMP playlist URL was not returned.');
|
||||
}
|
||||
|
||||
setRtmpBrowserReady(sourceUrl, disableAudio, false);
|
||||
|
||||
if (video.__rtmpHls && window.Hls && window.Hls.isSupported && window.Hls.isSupported()) {
|
||||
video.__rtmpHls.loadSource(playlistUrl);
|
||||
return;
|
||||
}
|
||||
|
||||
if (video) {
|
||||
video.src = playlistUrl;
|
||||
video.play().catch(function () {
|
||||
return null;
|
||||
});
|
||||
}
|
||||
}).catch(function () {
|
||||
setRtmpBrowserReady(sourceUrl, disableAudio, false);
|
||||
if (typeof onFailure === 'function') {
|
||||
onFailure();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getRtmpWarmupSlides(sourceSlides, targetIndex) {
|
||||
var availableSlides = Array.isArray(sourceSlides) ? sourceSlides : [];
|
||||
if (!availableSlides.length) {
|
||||
return [];
|
||||
@@ -25,21 +301,21 @@ function getRtmpPreloadSlides(sourceSlides, targetIndex) {
|
||||
normalizedIndex = 0;
|
||||
}
|
||||
|
||||
var preloadSlides = [];
|
||||
var warmupSlides = [];
|
||||
var currentSlide = availableSlides[normalizedIndex];
|
||||
var nextSlide = availableSlides[normalizedIndex + 1];
|
||||
|
||||
if (currentSlide) {
|
||||
preloadSlides.push(currentSlide);
|
||||
warmupSlides.push(currentSlide);
|
||||
}
|
||||
if (nextSlide && nextSlide !== currentSlide) {
|
||||
preloadSlides.push(nextSlide);
|
||||
warmupSlides.push(nextSlide);
|
||||
}
|
||||
|
||||
return preloadSlides;
|
||||
return warmupSlides;
|
||||
}
|
||||
|
||||
function getRtmpPreloadEntries(sourceSlides) {
|
||||
function getRtmpWarmupEntries(sourceSlides) {
|
||||
var entries = [];
|
||||
var seen = Object.create(null);
|
||||
|
||||
@@ -50,20 +326,24 @@ function getRtmpPreloadEntries(sourceSlides) {
|
||||
if (region.region_type !== 'rtmp') {
|
||||
return;
|
||||
}
|
||||
|
||||
var regionContent = content[region.region_key] || {};
|
||||
var url = String(regionContent.value || '').trim();
|
||||
if (!url) {
|
||||
return;
|
||||
}
|
||||
|
||||
var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
|
||||
var key = url + '\n' + (disableAudio ? '1' : '0');
|
||||
var key = getRtmpAvailabilityKey(url, disableAudio);
|
||||
if (seen[key]) {
|
||||
return;
|
||||
}
|
||||
|
||||
seen[key] = true;
|
||||
entries.push({
|
||||
url: url,
|
||||
disableAudio: disableAudio
|
||||
disableAudio: disableAudio,
|
||||
key: key
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -71,30 +351,397 @@ function getRtmpPreloadEntries(sourceSlides) {
|
||||
return entries;
|
||||
}
|
||||
|
||||
function syncRtmpPreloads(sourceSlides, targetIndex) {
|
||||
var entries = getRtmpPreloadEntries(getRtmpPreloadSlides(sourceSlides, targetIndex));
|
||||
var signature = entries.map(function (entry) {
|
||||
return entry.url + '\n' + (entry.disableAudio ? '1' : '0');
|
||||
}).join('\n');
|
||||
|
||||
if (signature === rtmpPreloadSignature) {
|
||||
return;
|
||||
}
|
||||
|
||||
rtmpPreloadSignature = signature;
|
||||
if (!entries.length) {
|
||||
return;
|
||||
}
|
||||
function syncRtmpWarmups(sourceSlides, targetIndex) {
|
||||
var entries = getRtmpWarmupEntries(getRtmpWarmupSlides(sourceSlides, targetIndex));
|
||||
|
||||
entries.forEach(function (entry) {
|
||||
fetch(getRtmpSessionUrl(entry.url, entry.disableAudio), {
|
||||
credentials: 'same-origin'
|
||||
}).catch(function () {
|
||||
return null;
|
||||
});
|
||||
var status = getRtmpAvailability(entry.url, entry.disableAudio);
|
||||
if (status && !isRtmpAvailabilityStale(status) && status.available === true) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (rtmpWarmupTimers[entry.key]) {
|
||||
return;
|
||||
}
|
||||
|
||||
function requestWarmup() {
|
||||
fetch(getRtmpSessionUrl(entry.url, entry.disableAudio), {
|
||||
credentials: 'same-origin'
|
||||
}).then(function (response) {
|
||||
return response.json().catch(function () {
|
||||
return null;
|
||||
}).then(function (payload) {
|
||||
return {
|
||||
response: response,
|
||||
payload: payload
|
||||
};
|
||||
});
|
||||
}).then(function (result) {
|
||||
rtmpWarmupTimers[entry.key] = null;
|
||||
if (!result || !result.response) {
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, false);
|
||||
return;
|
||||
}
|
||||
|
||||
if (!result.response.ok) {
|
||||
if (result.response.status === 503 && result.payload && result.payload.probing) {
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, null);
|
||||
rtmpWarmupTimers[entry.key] = window.setTimeout(function () {
|
||||
rtmpWarmupTimers[entry.key] = null;
|
||||
requestWarmup();
|
||||
}, 500);
|
||||
return;
|
||||
}
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, false);
|
||||
return;
|
||||
}
|
||||
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, true);
|
||||
}).catch(function () {
|
||||
rtmpWarmupTimers[entry.key] = null;
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, false);
|
||||
});
|
||||
}
|
||||
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, null);
|
||||
requestWarmup();
|
||||
});
|
||||
}
|
||||
|
||||
async function probeRtmpSlideAvailability(slide) {
|
||||
var entries = getRtmpWarmupEntries([slide]);
|
||||
if (!entries.length) {
|
||||
return true;
|
||||
}
|
||||
|
||||
var results = await Promise.all(entries.map(function (entry) {
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, null);
|
||||
return fetch(getRtmpSessionUrl(entry.url, entry.disableAudio), {
|
||||
credentials: 'same-origin'
|
||||
}).then(function (response) {
|
||||
return response.json().catch(function () {
|
||||
return null;
|
||||
}).then(function (payload) {
|
||||
return {
|
||||
response: response,
|
||||
payload: payload
|
||||
};
|
||||
});
|
||||
}).then(function (result) {
|
||||
if (!result || !result.response) {
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, false);
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!result.response.ok) {
|
||||
if (result.response.status === 503 && result.payload && result.payload.probing) {
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, null);
|
||||
return false;
|
||||
}
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, false);
|
||||
return false;
|
||||
}
|
||||
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, true);
|
||||
return true;
|
||||
}).catch(function () {
|
||||
setRtmpAvailability(entry.url, entry.disableAudio, false);
|
||||
return false;
|
||||
});
|
||||
}));
|
||||
|
||||
return results.every(function (value) {
|
||||
return Boolean(value);
|
||||
});
|
||||
}
|
||||
|
||||
function syncRtmpBrowserWarmups(sourceSlides, targetIndex) {
|
||||
return;
|
||||
}
|
||||
|
||||
function isRtmpBrowserUnavailable(slide) {
|
||||
if (!slide || !slide.template || !Array.isArray(slide.template.regions)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var content = slide.content || {};
|
||||
return slide.template.regions.some(function (region) {
|
||||
if (region.region_type !== 'rtmp') {
|
||||
return false;
|
||||
}
|
||||
|
||||
var regionContent = content[region.region_key] || {};
|
||||
var sourceUrl = String(regionContent.value || '').trim();
|
||||
if (!sourceUrl) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var disableAudio = regionContent.disable_audio === undefined ? true : Boolean(regionContent.disable_audio);
|
||||
var status = getRtmpBrowserReady(sourceUrl, disableAudio);
|
||||
return Boolean(!status || isRtmpBrowserReadyStale(status) || status.ready !== true);
|
||||
});
|
||||
}
|
||||
|
||||
function bindRtmpVideoPlaceholder(video, placeholder) {
|
||||
if (!video) {
|
||||
return;
|
||||
}
|
||||
|
||||
var markReady = function () {
|
||||
if (placeholder) {
|
||||
placeholder.style.display = 'none';
|
||||
}
|
||||
};
|
||||
|
||||
video.addEventListener('canplay', markReady, { once: true });
|
||||
video.addEventListener('playing', markReady, { once: true });
|
||||
if (video.readyState >= 2) {
|
||||
markReady();
|
||||
}
|
||||
}
|
||||
|
||||
function startRtmpPlayback(video, sourceUrl, disableAudio, skipUnavailable, placeholder, isPreload, onFailure) {
|
||||
var startupTimeoutMs = skipUnavailable ? 6000 : 0;
|
||||
var startupTimer = null;
|
||||
var probeRetryTimer = null;
|
||||
var webReceiveTimer = null;
|
||||
var webReceiveRetryUsed = false;
|
||||
|
||||
function failPlayback(message, silent) {
|
||||
if (video.dataset.rtmpFailureHandled === '1') {
|
||||
return;
|
||||
}
|
||||
video.dataset.rtmpFailureHandled = '1';
|
||||
if (typeof onFailure === 'function') {
|
||||
onFailure(message, silent);
|
||||
return;
|
||||
}
|
||||
if (!isPreload && skipUnavailable && typeof handleRtmpPlaybackFailure === 'function' && handleRtmpPlaybackFailure(message, { silent: Boolean(silent) })) {
|
||||
return;
|
||||
}
|
||||
if (placeholder) {
|
||||
placeholder.style.display = 'flex';
|
||||
placeholder.textContent = message;
|
||||
}
|
||||
}
|
||||
|
||||
function clearStartupTimer() {
|
||||
if (startupTimer) {
|
||||
window.clearTimeout(startupTimer);
|
||||
startupTimer = null;
|
||||
}
|
||||
if (video.__rtmpStartupTimer) {
|
||||
video.__rtmpStartupTimer = null;
|
||||
}
|
||||
if (probeRetryTimer) {
|
||||
window.clearTimeout(probeRetryTimer);
|
||||
probeRetryTimer = null;
|
||||
}
|
||||
if (video.__rtmpProbeRetryTimer) {
|
||||
video.__rtmpProbeRetryTimer = null;
|
||||
}
|
||||
if (webReceiveTimer) {
|
||||
window.clearTimeout(webReceiveTimer);
|
||||
webReceiveTimer = null;
|
||||
}
|
||||
if (video.__rtmpWebReceiveTimer) {
|
||||
video.__rtmpWebReceiveTimer = null;
|
||||
}
|
||||
}
|
||||
|
||||
function tryPlay() {
|
||||
if (video && typeof video.play === 'function') {
|
||||
video.play().catch(function () {
|
||||
return null;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function markReceiving() {
|
||||
if (webReceiveTimer) {
|
||||
window.clearTimeout(webReceiveTimer);
|
||||
webReceiveTimer = null;
|
||||
}
|
||||
if (video.__rtmpWebReceiveTimer) {
|
||||
video.__rtmpWebReceiveTimer = null;
|
||||
}
|
||||
}
|
||||
|
||||
function scheduleReceiveRetry() {
|
||||
if (isPreload || webReceiveRetryUsed || video.dataset.rtmpFailureHandled === '1') {
|
||||
return;
|
||||
}
|
||||
if (webReceiveTimer) {
|
||||
return;
|
||||
}
|
||||
webReceiveTimer = window.setTimeout(function () {
|
||||
webReceiveTimer = null;
|
||||
video.__rtmpWebReceiveTimer = null;
|
||||
if (video.dataset.rtmpFailureHandled === '1' || webReceiveRetryUsed) {
|
||||
return;
|
||||
}
|
||||
if (video.readyState >= 2) {
|
||||
return;
|
||||
}
|
||||
webReceiveRetryUsed = true;
|
||||
clearStartupTimer();
|
||||
try {
|
||||
if (video.__rtmpHls) {
|
||||
video.__rtmpHls.destroy();
|
||||
}
|
||||
} catch (_error) {
|
||||
// ignore cleanup errors
|
||||
}
|
||||
video.__rtmpHls = null;
|
||||
requestSession();
|
||||
}, 1200);
|
||||
video.__rtmpWebReceiveTimer = webReceiveTimer;
|
||||
}
|
||||
|
||||
function retryWebReceiveOrFail(message, silent) {
|
||||
if (isPreload || video.dataset.rtmpFailureHandled === '1') {
|
||||
return;
|
||||
}
|
||||
if (!webReceiveRetryUsed) {
|
||||
webReceiveRetryUsed = true;
|
||||
clearStartupTimer();
|
||||
if (webReceiveTimer) {
|
||||
window.clearTimeout(webReceiveTimer);
|
||||
webReceiveTimer = null;
|
||||
}
|
||||
if (video.__rtmpWebReceiveTimer) {
|
||||
video.__rtmpWebReceiveTimer = null;
|
||||
}
|
||||
window.setTimeout(function () {
|
||||
requestSession();
|
||||
}, 500);
|
||||
return;
|
||||
}
|
||||
failPlayback(message, silent);
|
||||
}
|
||||
|
||||
video.dataset.rtmpInitialized = '1';
|
||||
video.muted = disableAudio;
|
||||
video.controls = false;
|
||||
video.playsInline = true;
|
||||
video.autoplay = true;
|
||||
|
||||
bindRtmpVideoPlaceholder(video, placeholder);
|
||||
video.addEventListener('canplay', markReceiving, { once: true });
|
||||
video.addEventListener('playing', markReceiving, { once: true });
|
||||
|
||||
if (startupTimeoutMs > 0) {
|
||||
startupTimer = window.setTimeout(function () {
|
||||
startupTimer = null;
|
||||
video.__rtmpStartupTimer = null;
|
||||
failPlayback('Unable to load RTMP stream.', true);
|
||||
}, startupTimeoutMs);
|
||||
video.__rtmpStartupTimer = startupTimer;
|
||||
}
|
||||
|
||||
function retryWhileProbing() {
|
||||
if (probeRetryTimer || video.dataset.rtmpFailureHandled === '1') {
|
||||
return;
|
||||
}
|
||||
probeRetryTimer = window.setTimeout(function () {
|
||||
probeRetryTimer = null;
|
||||
video.__rtmpProbeRetryTimer = null;
|
||||
requestSession();
|
||||
}, 500);
|
||||
video.__rtmpProbeRetryTimer = probeRetryTimer;
|
||||
}
|
||||
|
||||
function requestSession() {
|
||||
fetch(getRtmpSessionUrl(sourceUrl, disableAudio), {
|
||||
credentials: 'same-origin'
|
||||
}).then(function (response) {
|
||||
return response.json().catch(function () {
|
||||
return null;
|
||||
}).then(function (payload) {
|
||||
return {
|
||||
response: response,
|
||||
payload: payload
|
||||
};
|
||||
});
|
||||
}).then(function (result) {
|
||||
if (!result || !result.response) {
|
||||
throw new Error('Unable to initialize RTMP stream.');
|
||||
}
|
||||
|
||||
var response = result.response;
|
||||
var payload = result.payload || null;
|
||||
var playlistUrl = payload && payload.playlistUrl ? String(payload.playlistUrl).trim() : '';
|
||||
|
||||
if (!response.ok) {
|
||||
if (response.status === 503 && payload && payload.probing) {
|
||||
setRtmpAvailability(sourceUrl, disableAudio, null);
|
||||
retryWhileProbing();
|
||||
return null;
|
||||
}
|
||||
setRtmpAvailability(sourceUrl, disableAudio, false);
|
||||
retryWebReceiveOrFail('Unable to load RTMP stream.', true);
|
||||
return null;
|
||||
}
|
||||
|
||||
setRtmpAvailability(sourceUrl, disableAudio, true);
|
||||
if (!playlistUrl) {
|
||||
throw new Error('RTMP playlist URL was not returned.');
|
||||
}
|
||||
|
||||
if (window.Hls && window.Hls.isSupported && window.Hls.isSupported()) {
|
||||
var hls = new window.Hls({
|
||||
enableWorker: true,
|
||||
lowLatencyMode: true,
|
||||
liveSyncDurationCount: 4,
|
||||
liveMaxLatencyDurationCount: 8,
|
||||
maxBufferLength: 20,
|
||||
maxLiveSyncPlaybackRate: 1,
|
||||
backBufferLength: 30
|
||||
});
|
||||
video.__rtmpHls = hls;
|
||||
hls.attachMedia(video);
|
||||
hls.on(window.Hls.Events.MEDIA_ATTACHED, function () {
|
||||
hls.loadSource(playlistUrl);
|
||||
scheduleReceiveRetry();
|
||||
});
|
||||
hls.on(window.Hls.Events.MANIFEST_PARSED, function () {
|
||||
tryPlay();
|
||||
});
|
||||
hls.on(window.Hls.Events.ERROR, function (_event, data) {
|
||||
if (data && data.fatal) {
|
||||
clearStartupTimer();
|
||||
setRtmpAvailability(sourceUrl, disableAudio, false);
|
||||
try {
|
||||
hls.destroy();
|
||||
} catch (_error) {
|
||||
// ignore cleanup errors
|
||||
}
|
||||
video.__rtmpHls = null;
|
||||
retryWebReceiveOrFail('RTMP playback failed.', true);
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (video.canPlayType && video.canPlayType('application/vnd.apple.mpegurl')) {
|
||||
video.src = playlistUrl;
|
||||
tryPlay();
|
||||
scheduleReceiveRetry();
|
||||
return;
|
||||
}
|
||||
|
||||
failPlayback('RTMP playback is not supported in this browser.', true);
|
||||
return null;
|
||||
}).catch(function () {
|
||||
clearStartupTimer();
|
||||
setRtmpAvailability(sourceUrl, disableAudio, false);
|
||||
retryWebReceiveOrFail('Unable to load RTMP stream.', true);
|
||||
});
|
||||
}
|
||||
|
||||
requestSession();
|
||||
}
|
||||
|
||||
function syncRtmpRegions(root) {
|
||||
if (!root) {
|
||||
return;
|
||||
@@ -118,93 +765,32 @@ function syncRtmpRegions(root) {
|
||||
return;
|
||||
}
|
||||
|
||||
video.dataset.rtmpInitialized = '1';
|
||||
video.muted = disableAudio;
|
||||
video.controls = false;
|
||||
video.playsInline = true;
|
||||
video.autoplay = true;
|
||||
var skipUnavailable = String(video.dataset.rtmpSkipUnavailable || '0') === '1';
|
||||
var startupTimer = null;
|
||||
|
||||
var markReady = function () {
|
||||
if (placeholder) {
|
||||
placeholder.style.display = 'none';
|
||||
}
|
||||
};
|
||||
|
||||
var tryPlay = function () {
|
||||
if (video && typeof video.play === 'function') {
|
||||
video.play().catch(function () {
|
||||
return null;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
video.addEventListener('canplay', markReady, { once: true });
|
||||
video.addEventListener('playing', markReady, { once: true });
|
||||
|
||||
fetch(getRtmpSessionUrl(sourceUrl, disableAudio), {
|
||||
credentials: 'same-origin'
|
||||
}).then(function (response) {
|
||||
if (!response.ok) {
|
||||
throw new Error('Unable to initialize RTMP stream.');
|
||||
}
|
||||
return response.json();
|
||||
}).then(function (payload) {
|
||||
var playlistUrl = payload && payload.playlistUrl ? String(payload.playlistUrl).trim() : '';
|
||||
if (!playlistUrl) {
|
||||
throw new Error('RTMP playlist URL was not returned.');
|
||||
}
|
||||
|
||||
if (window.Hls && window.Hls.isSupported && window.Hls.isSupported()) {
|
||||
var hls = new window.Hls({
|
||||
enableWorker: true,
|
||||
lowLatencyMode: true,
|
||||
liveSyncDurationCount: 4,
|
||||
liveMaxLatencyDurationCount: 8,
|
||||
maxBufferLength: 20,
|
||||
maxLiveSyncPlaybackRate: 1,
|
||||
backBufferLength: 30
|
||||
});
|
||||
video.__rtmpHls = hls;
|
||||
hls.attachMedia(video);
|
||||
hls.on(window.Hls.Events.MEDIA_ATTACHED, function () {
|
||||
hls.loadSource(playlistUrl);
|
||||
});
|
||||
hls.on(window.Hls.Events.MANIFEST_PARSED, function () {
|
||||
tryPlay();
|
||||
});
|
||||
hls.on(window.Hls.Events.ERROR, function (_event, data) {
|
||||
if (data && data.fatal) {
|
||||
try {
|
||||
hls.destroy();
|
||||
} catch (_error) {
|
||||
// ignore cleanup errors
|
||||
}
|
||||
video.__rtmpHls = null;
|
||||
if (placeholder) {
|
||||
placeholder.style.display = 'flex';
|
||||
placeholder.textContent = 'RTMP playback failed.';
|
||||
}
|
||||
}
|
||||
});
|
||||
if (skipUnavailable) {
|
||||
var preflightStatus = getRtmpAvailability(sourceUrl, disableAudio);
|
||||
if (preflightStatus && !isRtmpAvailabilityStale(preflightStatus) && preflightStatus.available === false) {
|
||||
failPlayback('Unable to load RTMP stream.', true);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (video.canPlayType && video.canPlayType('application/vnd.apple.mpegurl')) {
|
||||
video.src = playlistUrl;
|
||||
tryPlay();
|
||||
function failPlayback(message, silent) {
|
||||
if (video.dataset.rtmpFailureHandled === '1') {
|
||||
return;
|
||||
}
|
||||
video.dataset.rtmpFailureHandled = '1';
|
||||
if (skipUnavailable && typeof handleRtmpPlaybackFailure === 'function' && handleRtmpPlaybackFailure(message, { silent: Boolean(silent) })) {
|
||||
return;
|
||||
}
|
||||
if (placeholder) {
|
||||
placeholder.style.display = 'flex';
|
||||
placeholder.textContent = message;
|
||||
}
|
||||
}
|
||||
|
||||
if (placeholder) {
|
||||
placeholder.style.display = 'flex';
|
||||
placeholder.textContent = 'RTMP playback is not supported in this browser.';
|
||||
}
|
||||
}).catch(function (_error) {
|
||||
if (placeholder) {
|
||||
placeholder.style.display = 'flex';
|
||||
placeholder.textContent = 'Unable to load RTMP stream.';
|
||||
}
|
||||
});
|
||||
startRtmpPlayback(video, sourceUrl, disableAudio, skipUnavailable, placeholder, false);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -215,6 +801,18 @@ function destroyRtmpRegions(root) {
|
||||
|
||||
var videos = root.querySelectorAll('video[data-rtmp-source]');
|
||||
Array.prototype.forEach.call(videos, function (video) {
|
||||
if (video.__rtmpStartupTimer) {
|
||||
window.clearTimeout(video.__rtmpStartupTimer);
|
||||
video.__rtmpStartupTimer = null;
|
||||
}
|
||||
if (video.__rtmpProbeRetryTimer) {
|
||||
window.clearTimeout(video.__rtmpProbeRetryTimer);
|
||||
video.__rtmpProbeRetryTimer = null;
|
||||
}
|
||||
if (video.__rtmpWebReceiveTimer) {
|
||||
window.clearTimeout(video.__rtmpWebReceiveTimer);
|
||||
video.__rtmpWebReceiveTimer = null;
|
||||
}
|
||||
if (video.__rtmpHls) {
|
||||
try {
|
||||
video.__rtmpHls.destroy();
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
const Handlebars = require('handlebars');
|
||||
const { mediaKind, safeJsonForScript, getPlayerPageTemplate, getPlayerClientNameScript, getPlayerPageOfflineScript, getPlayerPagePlaylistScript, getPlayerPageCommandsScript, getPlayerPageRenderingScript, getPlayerPagePlaybackScript, getPlayerPageScript, getPlayerRegionScripts, getPlayerOnboardingLandingScript, getPlayerOnboardingFormScript } = require('./render-helpers');
|
||||
const { createThumbnailPreviewBootstrapScript } = require('./thumbnail-preview');
|
||||
const { createPageAuthBundle, createPageFetchAuthScript } = require('../request-auth');
|
||||
|
||||
function renderPage(template, options) {
|
||||
@@ -117,7 +118,7 @@ function renderPlayerPage(slug, initialData) {
|
||||
return renderPage(template, {
|
||||
title: 'Screen ' + slug,
|
||||
body: '<div id="app"><div class="empty">Loading screen...</div></div>',
|
||||
script: createPageFetchAuthScript(pageAuthToken) + hlsScriptTag + serviceWorkerScript + '<script>' + offlineScript + '</script>' + '<script>' + playlistScript + '</script>' + '<script>' + commandScript + '</script>' + '<script>' + renderingScript + '</script>' + '<script>' + playbackScript + '</script>' + onboardingScript + script
|
||||
script: createPageFetchAuthScript(pageAuthToken) + hlsScriptTag + serviceWorkerScript + createThumbnailPreviewBootstrapScript(initialData) + '<script>' + offlineScript + '</script>' + '<script>' + playlistScript + '</script>' + '<script>' + commandScript + '</script>' + '<script>' + renderingScript + '</script>' + '<script>' + playbackScript + '</script>' + onboardingScript + script
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
+76
-15
@@ -2,6 +2,7 @@ const fs = require('fs');
|
||||
const express = require('express');
|
||||
const path = require('path');
|
||||
const { getSharedSecret, createPageAuthBundle, verifyPageAuthToken, verifyRequestAuth } = require('../request-auth');
|
||||
const { buildThumbnailPreviewData } = require('./thumbnail-preview');
|
||||
|
||||
const TRANSIENT_DB_ERROR_CODES = ['ECONNREFUSED', 'ECONNRESET', 'ETIMEDOUT', 'EPIPE', 'ENOTFOUND', 'PROTOCOL_CONNECTION_LOST', 'POOL_CLOSED', 'ERR_POOL_CLOSED'];
|
||||
|
||||
@@ -58,6 +59,21 @@ function registerPlayerRoutes(app, options) {
|
||||
next();
|
||||
}
|
||||
|
||||
function resolveMediaFilePath(fileName) {
|
||||
const relativePath = path.normalize(String(fileName || '').trim()).replace(/^([\\/])+/, '');
|
||||
if (!relativePath || relativePath === '.' || relativePath.startsWith('..') || path.isAbsolute(relativePath)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const resolvedMediaDir = path.resolve(mediaDir);
|
||||
const resolvedFilePath = path.resolve(mediaDir, relativePath);
|
||||
if (resolvedFilePath !== resolvedMediaDir && !resolvedFilePath.startsWith(resolvedMediaDir + path.sep)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return resolvedFilePath;
|
||||
}
|
||||
|
||||
app.use('/assets', express.static(assetDir));
|
||||
app.use('/media', express.static(mediaDir));
|
||||
app.use('/assets/vendor', express.static(path.join(__dirname, '..', '..', 'node_modules', 'hls.js', 'dist')));
|
||||
@@ -93,21 +109,21 @@ function registerPlayerRoutes(app, options) {
|
||||
|
||||
app.get('/api/media/config', requireRequestAuth, function (_req, res) {
|
||||
res.json({
|
||||
mediaDir: mediaDir
|
||||
mediaDir: mediaDir,
|
||||
uploadDir: path.join(mediaDir, 'uploads')
|
||||
});
|
||||
});
|
||||
|
||||
app.put('/api/media/:filename', express.raw({ type: '*/*', limit: '100mb' }), requireRequestAuth, async function (req, res, next) {
|
||||
try {
|
||||
const filename = require('path').basename(String(req.params.filename || '').trim());
|
||||
if (!filename) {
|
||||
const filePath = resolveMediaFilePath(req.params.filename);
|
||||
if (!filePath) {
|
||||
return res.status(400).json({ error: 'Filename is required' });
|
||||
}
|
||||
const filePath = require('path').join(mediaDir, filename);
|
||||
const body = Buffer.isBuffer(req.body) ? req.body : Buffer.from(req.body || '');
|
||||
await fs.promises.mkdir(mediaDir, { recursive: true });
|
||||
await fs.promises.mkdir(path.dirname(filePath), { recursive: true });
|
||||
await fs.promises.writeFile(filePath, body);
|
||||
res.json({ ok: true, filename: filename });
|
||||
res.json({ ok: true, filename: req.params.filename });
|
||||
} catch (error) {
|
||||
next(error);
|
||||
}
|
||||
@@ -115,11 +131,10 @@ function registerPlayerRoutes(app, options) {
|
||||
|
||||
app.delete('/api/media/:filename', requireRequestAuth, async function (req, res, next) {
|
||||
try {
|
||||
const filename = require('path').basename(String(req.params.filename || '').trim());
|
||||
if (!filename) {
|
||||
const filePath = resolveMediaFilePath(req.params.filename);
|
||||
if (!filePath) {
|
||||
return res.status(400).json({ error: 'Filename is required' });
|
||||
}
|
||||
const filePath = require('path').join(mediaDir, filename);
|
||||
try {
|
||||
await fs.promises.unlink(filePath);
|
||||
} catch (error) {
|
||||
@@ -127,7 +142,7 @@ function registerPlayerRoutes(app, options) {
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
res.json({ ok: true, filename: filename });
|
||||
res.json({ ok: true, filename: req.params.filename });
|
||||
} catch (error) {
|
||||
next(error);
|
||||
}
|
||||
@@ -138,16 +153,25 @@ function registerPlayerRoutes(app, options) {
|
||||
const source = String(req.query.source || '').trim();
|
||||
const disableAudio = String(req.query.disableAudio || '').trim().toLowerCase();
|
||||
const useMutedOutput = disableAudio === '1' || disableAudio === 'true' || disableAudio === 'yes' || disableAudio === 'on';
|
||||
const session = await rtmpStreamService.ensureSession(source, useMutedOutput);
|
||||
await session.ready.catch(function () {
|
||||
return false;
|
||||
});
|
||||
const status = await rtmpStreamService.getSessionStatus(source, useMutedOutput);
|
||||
const session = status.session;
|
||||
const ready = Boolean(status.ready);
|
||||
const live = Boolean(status.live);
|
||||
res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
|
||||
if (!ready || !live) {
|
||||
return res.status(503).json({
|
||||
ready: false,
|
||||
live: false,
|
||||
timedOut: Boolean(status.timedOut),
|
||||
stderr: String(status.stderr || '')
|
||||
});
|
||||
}
|
||||
res.json({
|
||||
key: session.key,
|
||||
playlistUrl: session.playlistUrl,
|
||||
disableAudio: session.disableAudio,
|
||||
ready: true
|
||||
ready: true,
|
||||
live: true
|
||||
});
|
||||
} catch (error) {
|
||||
next(error);
|
||||
@@ -192,6 +216,43 @@ function registerPlayerRoutes(app, options) {
|
||||
});
|
||||
});
|
||||
|
||||
app.get('/api/internal/slide-thumbnails/:id/preview', requireRequestAuth, async function (req, res, next) {
|
||||
try {
|
||||
const slide = await common.fetchSlideById(pool, Number(req.params.id));
|
||||
if (!slide) {
|
||||
return res.status(404).send('Slide not found');
|
||||
}
|
||||
|
||||
const data = buildThumbnailPreviewData(slide);
|
||||
|
||||
if (typeof common.fetchRssFeedsData === 'function' && typeof common.fetchRssFeedItemsByFeedId === 'function') {
|
||||
const rssData = await common.fetchRssFeedsData(pool);
|
||||
data.rssFeeds = await Promise.all((rssData.rssFeeds || []).map(async function (feed) {
|
||||
const items = await common.fetchRssFeedItemsByFeedId(pool, feed.id);
|
||||
return Object.assign({}, feed, {
|
||||
items: items.map(function (item) {
|
||||
return typeof common.normalizeRssFeedItem === 'function' ? common.normalizeRssFeedItem(item) : item;
|
||||
})
|
||||
});
|
||||
}));
|
||||
}
|
||||
|
||||
if (typeof common.fetchApiSourcesData === 'function') {
|
||||
const apiData = await common.fetchApiSourcesData(pool);
|
||||
data.apiSources = (apiData.apiSources || []).map(function (source) {
|
||||
return Object.assign({}, source, {
|
||||
responseJson: typeof common.parseJsonSafe === 'function' ? common.parseJsonSafe(source.last_response_json) : null
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
|
||||
res.send(common.renderPlayerPage('slide-thumbnail-preview-' + slide.id, data));
|
||||
} catch (error) {
|
||||
next(error);
|
||||
}
|
||||
});
|
||||
|
||||
app.get('/api/screens/:slug/playlist', requirePageAuth(['player']), async function (req, res, next) {
|
||||
try {
|
||||
res.set('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
|
||||
|
||||
@@ -0,0 +1,27 @@
|
||||
function buildThumbnailPreviewData(slide) {
|
||||
return {
|
||||
thumbnailPreview: true,
|
||||
screen: {
|
||||
id: slide.id,
|
||||
name: slide.title,
|
||||
slug: 'slide-thumbnail-preview-' + slide.id,
|
||||
playlist_id: null
|
||||
},
|
||||
playlist: {
|
||||
fade_between_slides: false
|
||||
},
|
||||
slides: [slide],
|
||||
rssFeeds: [],
|
||||
apiSources: [],
|
||||
revision: String(slide.modified_at || slide.id || Date.now())
|
||||
};
|
||||
}
|
||||
|
||||
function createThumbnailPreviewBootstrapScript(initialData) {
|
||||
return initialData && initialData.thumbnailPreview ? '<script>window.__pulseThumbnailPreview = true;</script>' : '';
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
buildThumbnailPreviewData: buildThumbnailPreviewData,
|
||||
createThumbnailPreviewBootstrapScript: createThumbnailPreviewBootstrapScript
|
||||
};
|
||||
Reference in New Issue
Block a user