remember selected captions track between sessions

votekiss
maia arson crimew 2022-02-14 18:05:20 +01:00
parent af35f9a5cb
commit c9330bdb5c
1 changed files with 40 additions and 3 deletions

View File

@ -22,6 +22,30 @@ const saveVolume = (volume) => {
} }
}; };
const loadCaptionTrack = () => {
try {
const savedTrack = localStorage.getItem("watch-party-captions");
if (savedTrack != null && savedTrack != "") {
return +savedTrack;
}
} catch (_err) {
// Sometimes localStorage is blocked from use
}
// default
return -1;
};
/**
* @param {number} track
*/
const saveCaptionsTrack = (track) => {
try {
localStorage.setItem("watch-party-captions", track);
} catch (_err) {
// see loadCaptionsTrack
}
};
/** /**
* @param {string} videoUrl * @param {string} videoUrl
* @param {{name: string, url: string}[]} subtitles * @param {{name: string, url: string}[]} subtitles
@ -42,21 +66,34 @@ const createVideoElement = (videoUrl, subtitles) => {
video.appendChild(source); video.appendChild(source);
let first = true; const storedTrack = loadCaptionTrack();
let id = 0;
for (const { name, url } of subtitles) { for (const { name, url } of subtitles) {
const track = document.createElement("track"); const track = document.createElement("track");
track.label = name; track.label = name;
track.src = url; track.src = url;
track.kind = "captions"; track.kind = "captions";
if (first) { if (id == storedTrack) {
track.default = true; track.default = true;
first = false;
} }
video.appendChild(track); video.appendChild(track);
id++;
} }
video.textTracks.addEventListener("change", async () => {
let id = 0;
for (const track of video.textTracks) {
if (track.mode != "disabled") {
saveCaptionsTrack(id);
return;
}
id++;
}
saveCaptionsTrack(-1);
});
// watch for attribute changes on the video object to detect hiding/showing of controls // watch for attribute changes on the video object to detect hiding/showing of controls
// as far as i can tell this is the least hacky solutions to get control visibility change events // as far as i can tell this is the least hacky solutions to get control visibility change events
const observer = new MutationObserver(async (mutations) => { const observer = new MutationObserver(async (mutations) => {