dumtruck/konowebcodecs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Upgrade ffmpeg-core.js and update examples

Browse Source
This commit is contained in:
Jerome Wu
2019-10-30 19:27:35 +08:00
parent a7c5258cc4
commit e354a4b36f
6 changed files with 28 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
examples/browser/transcode.html
View File

@@ -1,27 +1,41 @@
<html>
<head>
<script src="/dist/ffmpeg.dev.js"></script>
<style>
html, body {
margin: 0;
width: 100%;
height: 100%
}
body {
display: flex;
flex-direction: column;
align-items: center;
}
</style>
</head>
<body>
<div>
<input type="file" id="uploader">
</div>
<h3>Upload a video to transcode to mp4 (x264) and play!</h3>
<video id="output-video" controls></video><br/>
<input type="file" id="uploader">
<p id="message" />
<script>
const { createWorker } = FFmpeg;
const worker = createWorker({
corePath: '../../node_modules/@ffmpeg/core/ffmpeg-core.js',
logger: ({ message }) => console.log(message),
});
const transcode = async ({ target: { files } }) => {
const message = document.getElementById('message');
message.innerHTML = 'Loading ffmpeg-core.js';
await worker.load();
console.log('Start transcoding');
message.innerHTML = 'Start transcoding';
const { data } = await worker.transcode(files[0], 'mp4');
console.log('Complete transcoding');
message.innerHTML = 'Complete transcoding';
const video = document.createElement('video');
video.controls = true;
const video = document.getElementById('output-video');
video.src = URL.createObjectURL(new Blob([data.buffer], { type: 'video/mp4' }));
document.body.appendChild(video);
}
const elm = document.getElementById('uploader');
elm.addEventListener('change', transcode);