Reimar/video-compressor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
Reimar 2025-01-27 20:36:19 +01:00
commit 9360128642
Signed by: Reimar
GPG Key ID: 93549FA07F0AE268
4 changed files with 77 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.gitignore vendored Normal file
View File

@ -0,0 +1,2 @@
public/assets/scripts/ffmpeg/

15
build.sh Normal file
View File

@ -0,0 +1,15 @@
#!/bin/sh
fetch () {
echo "Downloading $1..."
wget -q "https://registry.npmjs.org/@ffmpeg/$1/-/$1-$2.tgz"
mkdir -p public/assets/scripts/$1
tar -xzf "$1-$2.tgz" --directory assets/scripts/$1
}
mkdir -p public/assets/scripts
fetch ffmpeg 0.12.15

43
public/assets/scripts/main.js Normal file
View File

@ -0,0 +1,43 @@
async function compress() {
const filesize = document.getElementById("filesize").value;
const file = document.getElementById("file-input").files[0];
const ffmpeg = new FFmpegWASM.FFmpeg();
ffmpeg.on("progress", data => {
console.log(data.progress);
});
await ffmpeg.load({ coreURL: "/assets/scripts/core/package/dist/umd/ffmpeg-core.js" });
await ffmpeg.writeFile(file.name, await readFromBlob(file));
await ffmpeg.exec(["-i", file.name, "-fs", filesize + "M", "compressed.mp4"]);
const video = await ffmpeg.readFile("compressed.mp4");
location.href = URL.createObjectURL(new Blob([video.buffer], { type: "video/mp4" }));
}
// https://github.com/ffmpegwasm/ffmpeg.wasm/blob/main/packages/util/src/index.ts
function readFromBlob(blob) {
return new Promise((resolve, reject) => {
const fileReader = new FileReader();
fileReader.onload = () => {
const { result } = fileReader;
if (result instanceof ArrayBuffer) {
resolve(new Uint8Array(result));
} else {
resolve(new Uint8Array());
}
};
fileReader.onerror = (event) => {
reject(
Error(
`File could not be read! Code=${event?.target?.error?.code || -1}`
)
);
};
fileReader.readAsArrayBuffer(blob);
});
}

17
public/index.html Normal file
View File

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Video Compressor</title>
<script src="/assets/scripts/ffmpeg/package/dist/umd/ffmpeg.js"></script>
<script defer src="/assets/scripts/main.js"></script>
</head>
<body>
<h1>Video Compressor</h1>
<p>Compress video files to a specific file size, so you can upload them to your favorite social media and messaging apps!</p>
<input id="file-input" type="file" accept="video/*">
<p>File size: <input id="filesize" type="number" value="10">MB</p>
<button onclick="compress()">Submit</button>
</body>
</html>