arcodange/mediabunny
1
0
Fork 0
mirror of https://github.com/arcodange-org/mediabunny.git synced 2026-10-03 05:43:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add loading element to media player

Browse Source
This commit is contained in:
Vanilagy
2025-08-30 17:50:53 +02:00
parent f1f5a62d26
commit 3dec3ab12b
2 changed files with 5 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/media-player/media-player.ts
+4
View File
@@ -16,6 +16,7 @@ const selectMediaButton = document.querySelector('#select-file') as HTMLButtonEl
const loadUrlButton = document.querySelector('#load-url') as HTMLButtonElement;
const fileNameElement = document.querySelector('#file-name') as HTMLParagraphElement;
const horizontalRule = document.querySelector('hr') as HTMLHRElement;
const loadingElement = document.querySelector('#loading-element') as HTMLParagraphElement;
const playerContainer = document.querySelector('#player') as HTMLDivElement;
const canvas = document.querySelector('canvas') as HTMLCanvasElement;
const controlsElement = document.querySelector('#controls') as HTMLDivElement;
@@ -83,6 +84,7 @@ const initMediaPlayer = async (resource: File | string) => {
fileLoaded = false;
fileNameElement.textContent = resource instanceof File ? resource.name : resource;
horizontalRule.style.display = '';
loadingElement.style.display = '';
playerContainer.style.display = 'none';
errorElement.textContent = '';
warningElement.textContent = '';
@@ -183,6 +185,7 @@ const initMediaPlayer = async (resource: File | string) => {
await play();
}
loadingElement.style.display = 'none';
playerContainer.style.display = '';
if (!videoSink) {
@@ -194,6 +197,7 @@ const initMediaPlayer = async (resource: File | string) => {
console.error(error);
errorElement.textContent = String(error);
loadingElement.style.display = 'none';
playerContainer.style.display = 'none';
}
};