Create conversion doc page, small fixes

This commit is contained in:
Vanilagy
2025-06-08 20:40:01 +02:00
parent f009d0603e
commit e37af1bdad
13 changed files with 29 additions and 22 deletions
+1 -3
View File
@@ -24,13 +24,11 @@
<div class="flex gap-4" id="main-container" style="display: none;">
<div class="flex flex-col items-center">
<p class="text-xs font-medium mb-1">Draw something!</p>
<p class="text-xs font-medium mb-1.5">Draw something!</p>
<canvas width="640" height="480" class="bg-white rounded-xl shadow"></canvas>
</div>
<div class="w-px bg-zinc-300 dark:bg-zinc-700"></div>
<div class="self-center flex flex-col items-center gap-4">
<video class="max-w-96 rounded-lg shadow" controls></video>
@@ -34,7 +34,7 @@ const extractMetadata = (file: File) => {
// This object contains all the data that gets displayed:
const object = {
'Format': input.getFormat().then(format => format.getName()),
'Format': input.getFormat().then(format => format.name),
'Full MIME type': input.getMimeType(),
'Duration': input.computeDuration().then(duration => `${duration} seconds`),
'Tracks': input.getTracks().then(tracks => tracks.map(track => ({
+2 -2
View File
@@ -37,9 +37,9 @@
<p id="error-element" class="text-red-500"></p>
<div class="w-full max-w-80 h-2 rounded-full bg-zinc-200 dark:bg-zinc-750 overflow-hidden" id="progress-bar-container" style="display: none;">
<div class="h-full bg-emerald-500 w-0" id="progress-bar"></div>
<div class="h-full bg-teal-500 w-0" id="progress-bar"></div>
</div>
<p class="text-xs font-medium mt-1 tabular-nums" id="progress-text" style="display: none;"></p>
<p class="text-xs font-medium mt-1.5 tabular-nums" id="progress-text" style="display: none;"></p>
<video controls class="rounded-md" id="result-video" style="display: none;"></video>
<p class="text-xs font-medium mt-1" id="video-info" style="display: none;"></p>