Skip to content

Commit bd770f5

Browse files
ctrlcmdmasterctrlcmdmaster
authored
Update resampler.html
1 parent 52bd9d1 commit bd770f5

File tree

1 file changed

+35
-30
lines changed

1 file changed

+35
-30
lines changed

‎MP3Tools/resampler.html‎

Lines changed: 35 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44
<head>
55
<meta charset="UTF-8">
66
<title>MP3 Resampler</title>
7+
<!-- ✅ Use the official ffmpeg.wasm build that provides a global FFmpeg object -->
8+
<script src="https://unpkg.com/@ffmpeg/ffmpeg@0.11.6/dist/ffmpeg.min.js"></script>
79
</head>
810
<body>
911
<h1>MP3 Resampler</h1>
@@ -13,45 +15,48 @@ <h1>MP3 Resampler</h1>
1315
<button id="resampleBtn">Resample</button>
1416
<p id="status"></p>
1517

16-
<script type="module">
17-
import { createFFmpeg, fetchFile } from "https://cdn.skypack.dev/@ffmpeg/ffmpeg@0.12.6";
18+
<script>
19+
async function init() {
20+
const { createFFmpeg, fetchFile } = FFmpeg;
21+
const ffmpeg = createFFmpeg({ log: true });
1822

19-
const ffmpeg = createFFmpeg({ log: true });
23+
document.getElementById('resampleBtn').addEventListener('click', async () => {
24+
const fileInput = document.getElementById('audioFile');
25+
const rateInput = document.getElementById('sampleRate');
26+
const status = document.getElementById('status');
2027

21-
document.getElementById('resampleBtn').addEventListener('click', async () => {
22-
const fileInput = document.getElementById('audioFile');
23-
const rateInput = document.getElementById('sampleRate');
24-
const status = document.getElementById('status');
28+
if (!fileInput.files.length) {
29+
alert('Please select an MP3 file.');
30+
return;
31+
}
2532

26-
if (!fileInput.files.length) {
27-
alert('Please select an MP3 file.');
28-
return;
29-
}
33+
const sampleRate = parseInt(rateInput.value);
34+
if (!sampleRate || sampleRate <= 0) {
35+
alert('Please enter a valid sample rate.');
36+
return;
37+
}
3038

31-
const sampleRate = parseInt(rateInput.value);
32-
if (!sampleRate || sampleRate <= 0) {
33-
alert('Please enter a valid sample rate.');
34-
return;
35-
}
39+
const file = fileInput.files[0];
40+
status.textContent = 'Loading FFmpeg (this may take a moment)...';
41+
if (!ffmpeg.isLoaded()) await ffmpeg.load();
3642

37-
const file = fileInput.files[0];
38-
status.textContent = 'Loading FFmpeg (this may take a moment)...';
39-
if (!ffmpeg.isLoaded()) await ffmpeg.load();
43+
status.textContent = 'Resampling...';
44+
ffmpeg.FS('writeFile', 'input.mp3', await fetchFile(file));
45+
await ffmpeg.run('-i', 'input.mp3', '-ar', sampleRate.toString(), 'output.mp3');
4046

41-
status.textContent = 'Resampling...';
42-
ffmpeg.FS('writeFile', 'input.mp3', await fetchFile(file));
43-
await ffmpeg.run('-i', 'input.mp3', '-ar', sampleRate.toString(), 'output.mp3');
47+
const data = ffmpeg.FS('readFile', 'output.mp3');
48+
const url = URL.createObjectURL(new Blob([data.buffer], { type: 'audio/mp3' }));
4449

45-
const data = ffmpeg.FS('readFile', 'output.mp3');
46-
const url = URL.createObjectURL(new Blob([data.buffer], { type: 'audio/mp3' }));
50+
const link = document.createElement('a');
51+
link.href = url;
52+
link.download = `resampled_${sampleRate}Hz.mp3`;
53+
link.click();
4754

48-
const link = document.createElement('a');
49-
link.href = url;
50-
link.download = `resampled_${sampleRate}Hz.mp3`;
51-
link.click();
55+
status.textContent = 'Done!';
56+
});
57+
}
5258

53-
status.textContent = 'Done!';
54-
});
59+
init();
5560
</script>
5661

5762
</body>

0 commit comments

Comments
 (0)