diff --git a/web/i18n/en/remux.json b/web/i18n/en/remux.json index b7a7f34a..d8b031c3 100644 --- a/web/i18n/en/remux.json +++ b/web/i18n/en/remux.json @@ -1,3 +1,8 @@ { - "description": "remuxing often fixes compatibility issues with old software. it's fast, lossless, and everything is processed on-device." + "bullet.purpose.title": "what does remux do?", + "bullet.purpose.description": "remux fixes any issues with the file container, such as missing time info. it helps increase compatibility with old software, such as vegas pro and windows media player.", + "bullet.explainer.title": "how does it work?", + "bullet.explainer.description": "remuxing takes existing codec data and copies it over to a new media container. it's lossless, media data doesn't get re-encoded.", + "bullet.privacy.title": "on-device processing", + "bullet.privacy.description": "cobalt remuxes files locally. files never leave your device, so processing is nearly instant." } diff --git a/web/src/routes/remux/+page.svelte b/web/src/routes/remux/+page.svelte index d0edaf4f..475c94bd 100644 --- a/web/src/routes/remux/+page.svelte +++ b/web/src/routes/remux/+page.svelte @@ -10,6 +10,11 @@ import Skeleton from "$components/misc/Skeleton.svelte"; import DropReceiver from "$components/misc/DropReceiver.svelte"; import FileReceiver from "$components/misc/FileReceiver.svelte"; + import BulletExplain from "$components/misc/BulletExplain.svelte"; + + import IconRepeat from "@tabler/icons-svelte/IconRepeat.svelte"; + import IconDevices from "@tabler/icons-svelte/IconDevices.svelte"; + import IconInfoCircle from "@tabler/icons-svelte/IconInfoCircle.svelte"; let draggedOver = false; let file: File | undefined; @@ -40,7 +45,7 @@ let processing = false; - const ff = new LibAVWrapper(progress => { + const ff = new LibAVWrapper((progress) => { if (progress.out_time_sec) { processedDuration = progress.out_time_sec; } @@ -62,7 +67,7 @@ speed = undefined; processing = true; - const file_info = await ff.probe(file).catch(e => { + const file_info = await ff.probe(file).catch((e) => { if (e?.message?.toLowerCase().includes("out of memory")) { console.error("uh oh! out of memory"); console.error(e); @@ -105,7 +110,7 @@ totalDuration = Number(file_info.format.duration); if (file instanceof File && !file.type) { - file = new File([ file ], file.name, { + file = new File([file], file.name, { type: mime.getType(file.name) ?? undefined, }); } @@ -144,8 +149,8 @@ return await downloadFile({ file: new File([render], filename, { - type: render.type - }) + type: render.type, + }), }); } finally { processing = false; @@ -198,7 +203,7 @@