mirror of https://github.com/ekimekim/wubloader
Frontload the chat time display calculation
The chat time display calculation is also done in a worker to prevent stalling. Since we do the calculation on load, the stalling that is prevented would happen when loading the page.pull/317/head
parent
e74d655ce5
commit
832a0264bb
@ -0,0 +1,49 @@
|
||||
self.importScripts("luxon.min.js", "common-worker.js");
|
||||
|
||||
var DateTime = luxon.DateTime;
|
||||
luxon.Settings.defaultZone = "utc";
|
||||
|
||||
self.onmessage = async (event) => {
|
||||
const chatLoadData = event.data;
|
||||
|
||||
const segmentMetadata = chatLoadData.segmentMetadata;
|
||||
for (const segmentData of segmentMetadata) {
|
||||
segmentData.rawStart = DateTime.fromMillis(segmentData.rawStart);
|
||||
segmentData.rawEnd = DateTime.fromMillis(segmentData.rawEnd);
|
||||
}
|
||||
|
||||
const fetchURL = `/${chatLoadData.stream}/chat.json?start=${chatLoadData.start}&end=${chatLoadData.end}`;
|
||||
const chatResponse = await fetch(fetchURL);
|
||||
if (!chatResponse.ok) {
|
||||
return;
|
||||
}
|
||||
const chatRawData = await chatResponse.json();
|
||||
|
||||
const chatData = [];
|
||||
for (const chatLine of chatRawData) {
|
||||
if (
|
||||
chatLine.command !== "PRIVMSG" &&
|
||||
chatLine.command !== "CLEARMSG" &&
|
||||
chatLine.command !== "CLEARCHAT" &&
|
||||
chatLine.command !== "USERNOTICE"
|
||||
) {
|
||||
continue;
|
||||
}
|
||||
const when = DateTime.fromSeconds(chatLine.time);
|
||||
const displayWhen = videoHumanTimeFromDateTimeWithFragments(segmentMetadata, when);
|
||||
// Here, we just push each line successively into the list. This assumes data is provided to us in chronological order.
|
||||
chatData.push({ message: chatLine, when: when.toMillis(), displayWhen: displayWhen });
|
||||
}
|
||||
self.postMessage(chatData);
|
||||
};
|
||||
|
||||
function videoHumanTimeFromDateTimeWithFragments(fragmentMetadata, dateTime) {
|
||||
for (const segmentData of fragmentMetadata) {
|
||||
if (dateTime >= segmentData.rawStart && dateTime <= segmentData.rawEnd) {
|
||||
const playerTime =
|
||||
segmentData.playerStart + dateTime.diff(segmentData.rawStart).as("seconds");
|
||||
return videoHumanTimeFromVideoPlayerTime(playerTime);
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
@ -0,0 +1,21 @@
|
||||
function videoHumanTimeFromVideoPlayerTime(videoPlayerTime) {
|
||||
const hours = Math.floor(videoPlayerTime / 3600);
|
||||
let minutes = Math.floor((videoPlayerTime % 3600) / 60);
|
||||
let seconds = Math.floor(videoPlayerTime % 60);
|
||||
let milliseconds = Math.floor((videoPlayerTime * 1000) % 1000);
|
||||
|
||||
while (minutes.toString().length < 2) {
|
||||
minutes = `0${minutes}`;
|
||||
}
|
||||
while (seconds.toString().length < 2) {
|
||||
seconds = `0${seconds}`;
|
||||
}
|
||||
while (milliseconds.toString().length < 3) {
|
||||
milliseconds = `0${milliseconds}`;
|
||||
}
|
||||
|
||||
if (hours > 0) {
|
||||
return `${hours}:${minutes}:${seconds}.${milliseconds}`;
|
||||
}
|
||||
return `${minutes}:${seconds}.${milliseconds}`;
|
||||
}
|
Loading…
Reference in New Issue