Fix min/max calculation

src/audio-util.js

@@ -83,40 +83,40 @@ export function drawAudio(audioBuffer) {
   const VISUAL_AMP = 2
   const RANGE = 128
 
-  let min = 1, max = -1
+  let min = -1, max = 1
   for (let i = 0, nextBlock = BLOCK_SIZE; i < channelData.length;) {
-    let ssum = 0, sum = 0
+    let ssum = 0, sum = 0, x, avg, v
 
     // avg amp method - waveform is too small
-    // for (; i < nextBlock; i++) sum += Math.abs(i >= channelData.length ? 0 : channelData[i])
-    // const avg = sum / BLOCK_SIZE
-    // str += String.fromCharCode(0x0100 + Math.ceil(avg * 100))
+    // for (; i < nextBlock; i++) {
+    //   x = i >= channelData.length ? 0 : channelData[i]
+    //   sum += Math.abs(x)
+    // }
+    // avg = sum / BLOCK_SIZE
+    // v = Math.ceil(avg * 100)
 
     // rms method
     // drawback: waveform is smaller than needed
     for (; i < nextBlock; i++) {
-      let x = i >= channelData.length ? 0 : channelData[i]
+      x = i >= channelData.length ? 0 : channelData[i]
       sum += x
       ssum += x ** 2
-      min = Math.min(min, x)
-      max = Math.max(max, x)
     }
-    const avg = sum / BLOCK_SIZE
+    avg = sum / BLOCK_SIZE
     const rms = Math.sqrt(ssum / BLOCK_SIZE)
-    let v = Math.min(100, Math.ceil(rms * RANGE * VISUAL_AMP / (max - min))) || 0
-
-    str += String.fromCharCode(0x0100 + v)
-    let shift = Math.abs(Math.round(avg * RANGE / 2))
-    str += (avg > 0 ? '\u0301' : '\u0300').repeat(shift)
+    v = Math.min(100, Math.ceil(rms * RANGE * VISUAL_AMP / (max - min))) || 0
 
     // signal energy loudness
     // ref: https://github.com/MTG/essentia/blob/master/src/algorithms/temporal/loudness.cpp
     // same as RMS essentially, different power
     // const STEVENS_POW = 0.67
     // for (;i < nextBlock; i++) ssum += i >= channelData.length ? 0 : channelData[i] ** 2
     // const value = (ssum / BLOCK_SIZE) ** STEVENS_POW
-    // let v =  Math.min(100, Math.ceil(value * 100 * VISUAL_AMP))
-    // str += String.fromCharCode(0x0100 + v)
+    // v =  Math.min(100, Math.ceil(value * 100 * VISUAL_AMP))
+
+    str += String.fromCharCode(0x0100 + v)
+    let shift = Math.abs(Math.round(avg * RANGE / 2))
+    str += (avg > 0 ? '\u0301' : '\u0300').repeat(shift)
 
     nextBlock += BLOCK_SIZE
   }

src/wavearea.js

@@ -246,7 +246,7 @@ let state = sprae(wavearea, {
     selection.set(state.caretOffset)
   },
 
-  // make sure play/caret line pointer is correct
+  // make sure play/caret line pointer matches audio
   updateCaretLine(sel) {
     // let caretLine = Math.floor(sel.end / state.cols);
     // // last of segment edge case
@@ -274,7 +274,7 @@ let state = sprae(wavearea, {
       // let lines = Math.ceil(cleanText(segNode.textContent).length / state.cols) || 1;
       for (let i = 0; i < lines; i++) {
         let a = document.createElement('a')
-        let tc = timecode(i * (state.cols || 0) + offset)
+        let tc = this.timecode(i * (state.cols || 0) + offset)
         a.href = `#${tc}`
         a.textContent = tc
         timecodes.appendChild(a)
@@ -283,8 +283,11 @@ let state = sprae(wavearea, {
     }
   },
 
-  // util
-  timecode
+  // produce display time from frames
+  timecode(block, ms = 0) {
+    let time = ((block / state?.total)) * state?.duration || 0
+    return `${Math.floor(time / 60).toFixed(0)}:${(Math.floor(time) % 60).toFixed(0).padStart(2, 0)}${ms ? `.${(time % 1).toFixed(ms).slice(2).padStart(ms)}` : ''}`
+  }
 });
 
 
@@ -346,11 +349,6 @@ wavearea.addEventListener('touchstart', whatsLatency)
 wavearea.addEventListener('mousedown', whatsLatency)
 wavearea.addEventListener('keydown', whatsLatency)
 
-// produce display time from frames
-function timecode(block, ms = 0) {
-  let time = ((block / state?.total)) * state?.duration || 0
-  return `${Math.floor(time / 60).toFixed(0)}:${(Math.floor(time) % 60).toFixed(0).padStart(2, 0)}${ms ? `.${(time % 1).toFixed(ms).slice(2).padStart(ms)}` : ''}`
-}
 
 // create play button position observer
 const caretObserver = new IntersectionObserver(([item]) => {