Conservancy/symposion_app
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve refresh of streams

Browse source
This commit is contained in:
Joel Addison 2024-04-16 15:31:13 +10:00
parent a54cff6e89
commit 5c8f05da69
1 changed files with 18 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
static/src/js/streaming.js
View file

@ -1,14 +1,22 @@
$(function() { $(function() {
const SLOT_REFRESH_INTERVAL_MS = 10 * 60 * 1000; const ROOM_REFRESH_INTERVAL_MS = 10 * 60 * 1000;
const holdingFrame = $('#holding-frame'); const holdingFrame = $('#holding-frame');
const streamingFrame = $('#streaming-frame'); const streamingFrame = $('#streaming-frame');
const roomsFrame = $('#rooms-frame'); const roomsFrame = $('#rooms-frame');
let lastVersion = ''; let lastVersion = '';
let selectedStreamId = ''; let selectedStream = null;
let streamData = null; let streamData = null;
function change_room(stream, user_details) { function change_room(stream, user_details) {
selectedStreamId = stream.stream_id; if (selectedStream && selectedStream.id === stream.stream_id && selectedStream.playbackId === stream.playback_id) {
// No change, leave as is.
return;
}
selectedStream = {
id: stream.stream_id,
playbackId: stream.playback_id,
};
streamingFrame.empty(); streamingFrame.empty();
@ -19,6 +27,7 @@ $(function() {
muxPlayer.setAttribute("playback-id", stream.playback_id); muxPlayer.setAttribute("playback-id", stream.playback_id);
muxPlayer.setAttribute("metadata-video-title", stream.stream_name); muxPlayer.setAttribute("metadata-video-title", stream.stream_name);
muxPlayer.setAttribute("metadata-viewer-user-id", user_details.code); muxPlayer.setAttribute("metadata-viewer-user-id", user_details.code);
muxPlayer.setAttribute("autoplay", true);
muxPlayer.tokens = { muxPlayer.tokens = {
playback: stream.video_token, playback: stream.video_token,
thumbnail: stream.thumbnail_token, thumbnail: stream.thumbnail_token,
@ -50,10 +59,10 @@ $(function() {
streamData = data; streamData = data;
var stream = null; var stream = null;
if (selectedStreamId) { if (selectedStream && selectedStream.id) {
for (var i = 0; i < data.streams.length; ++i) { for (var i = 0; i < data.streams.length; ++i) {
var availableStream = data.streams[i]; var availableStream = data.streams[i];
if (availableStream.stream_id === selectedStreamId) { if (availableStream.stream_id === selectedStream.id) {
stream = availableStream; stream = availableStream;
break; break;
} }
@ -75,7 +84,7 @@ $(function() {
for (var i = 0; i < streams.length; ++i) { for (var i = 0; i < streams.length; ++i) {
var availableStream = streams[i]; var availableStream = streams[i];
let streamButton = $('<li role="presentation"><a href="#" data-stream-id="' + availableStream.stream_id + '">' + availableStream.room_name + '</a></li>') let streamButton = $('<li role="presentation"><a href="#" data-stream-id="' + availableStream.stream_id + '">' + availableStream.room_name + '</a></li>')
if (availableStream.stream_id === selectedStreamId) { if (availableStream.stream_id === selectedStream.id) {
streamButton.addClass('active'); streamButton.addClass('active');
} }
rooms.append(streamButton); rooms.append(streamButton);
@ -91,11 +100,11 @@ $(function() {
activeRooms = activeRooms.removeClass('active'); activeRooms = activeRooms.removeClass('active');
let streamId = roomButton.data('streamId'); let streamId = roomButton.data('streamId');
selectedStreamId = streamId; let stream = null;
for (var i = 0; i < streamData.streams.length; ++i) { for (var i = 0; i < streamData.streams.length; ++i) {
let availableStream = streamData.streams[i]; let availableStream = streamData.streams[i];
if (availableStream.stream_id === selectedStreamId) { if (availableStream.stream_id === streamId) {
stream = availableStream; stream = availableStream;
break; break;
} }
@ -116,5 +125,5 @@ $(function() {
} }
load_streams(); load_streams();
setInterval(load_streams, SLOT_REFRESH_INTERVAL_MS); setInterval(load_streams, ROOM_REFRESH_INTERVAL_MS);
}); });