Some minor frontend improvements #5
2 changed files with 35 additions and 1 deletions
|
@ -28,6 +28,40 @@ const createVideoElement = (videoUrl, subtitles) => {
|
||||||
video.appendChild(track);
|
video.appendChild(track);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 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
|
||||||
|
const observer = new MutationObserver(async (mutations) => {
|
||||||
|
for (const mutation of mutations) {
|
||||||
|
if (mutation.attributeName == "controls") {
|
||||||
|
if (video.controls) {
|
||||||
|
// enable media button support
|
||||||
|
navigator.mediaSession.setActionHandler("play", null);
|
||||||
|
navigator.mediaSession.setActionHandler("pause", null);
|
||||||
|
navigator.mediaSession.setActionHandler("stop", null);
|
||||||
|
navigator.mediaSession.setActionHandler("seekbackward", null);
|
||||||
|
navigator.mediaSession.setActionHandler("seekforward", null);
|
||||||
|
navigator.mediaSession.setActionHandler("seekto", null);
|
||||||
|
navigator.mediaSession.setActionHandler("previoustrack", null);
|
||||||
|
navigator.mediaSession.setActionHandler("nexttrack", null);
|
||||||
|
navigator.mediaSession.setActionHandler("skipad", null);
|
||||||
|
} else {
|
||||||
|
// disable media button support by ignoring the events
|
||||||
|
navigator.mediaSession.setActionHandler("play", () => {});
|
||||||
|
navigator.mediaSession.setActionHandler("pause", () => {});
|
||||||
|
navigator.mediaSession.setActionHandler("stop", () => {});
|
||||||
|
navigator.mediaSession.setActionHandler("seekbackward", () => {});
|
||||||
|
navigator.mediaSession.setActionHandler("seekforward", () => {});
|
||||||
|
navigator.mediaSession.setActionHandler("seekto", () => {});
|
||||||
|
navigator.mediaSession.setActionHandler("previoustrack", () => {});
|
||||||
|
navigator.mediaSession.setActionHandler("nexttrack", () => {});
|
||||||
|
navigator.mediaSession.setActionHandler("skipad", () => {});
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
observer.observe(video, { attributes: true });
|
||||||
|
|
||||||
return video;
|
return video;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { setupVideo } from "./video.mjs?v=2";
|
import { setupVideo } from "./video.mjs?v=e";
|
||||||
import { setupChat, logEventToChat } from "./chat.mjs?v=2";
|
import { setupChat, logEventToChat } from "./chat.mjs?v=2";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
Loading…
Reference in a new issue