mirror of
https://codeberg.org/armin/noiz.git
synced 2026-09-01 05:50:52 +02:00
add progress bar fallback when waveform data is unavailable
This commit is contained in:
parent
94ee52aace
commit
92f2c6dab4
1 changed files with 22 additions and 1 deletions
23
index.html
23
index.html
|
|
@ -674,7 +674,28 @@ function drawWaveform() {
|
||||||
const ctx = canvas.getContext('2d');
|
const ctx = canvas.getContext('2d');
|
||||||
ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
|
ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
|
||||||
ctx.clearRect(0, 0, visWidth, h);
|
ctx.clearRect(0, 0, visWidth, h);
|
||||||
if (!t || !t.waveform) return;
|
if (!t) return;
|
||||||
|
if (!t.waveform) {
|
||||||
|
if (audio && audio.duration) {
|
||||||
|
const pct = audio.currentTime / audio.duration;
|
||||||
|
const barH = 4, y = (h - barH) / 2;
|
||||||
|
ctx.fillStyle = '#272c42';
|
||||||
|
ctx.beginPath();
|
||||||
|
ctx.roundRect(0, y, visWidth, barH, 2);
|
||||||
|
ctx.fill();
|
||||||
|
ctx.fillStyle = '#84a0c6';
|
||||||
|
ctx.beginPath();
|
||||||
|
ctx.roundRect(0, y, visWidth * pct, barH, 2);
|
||||||
|
ctx.fill();
|
||||||
|
ctx.strokeStyle = '#e27878';
|
||||||
|
ctx.lineWidth = 1;
|
||||||
|
ctx.beginPath();
|
||||||
|
ctx.moveTo(visWidth * pct, 2);
|
||||||
|
ctx.lineTo(visWidth * pct, h - 2);
|
||||||
|
ctx.stroke();
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
const wf = t.waveform;
|
const wf = t.waveform;
|
||||||
const data = wf.data;
|
const data = wf.data;
|
||||||
const halfH = h / 2;
|
const halfH = h / 2;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue