fix: small cleanup

Author: michalsek

packages/audiodocs/docs/fundamentals/introduction.mdx

@@ -8,7 +8,7 @@ sidebar_position: 1
 
 React Native Audio API is an imperative, high-level API for processing and synthesizing audio in React Native Applications. React Native Audio API follows the [Web Audio Specification](https://www.w3.org/TR/webaudio-1.1/) making it easier to write audio-heavy applications for iOS, Android and Web with just one codebase.
 
-import OscillatorSquare from '@site/src/components/LandingPage/OscillatorSquare';
+import OscillatorSquare from '@site/src/components/OscillatorSquare';
 
 <OscillatorSquare />
 

packages/audiodocs/src/audio/utils.ts

@@ -7,32 +7,30 @@ export function downSampleLog(
 ): number[] {
     const nyquist = sampleRate / 2;
     const binCount = fft.length;
-
     const maxFreq = nyquist;
 
     const buckets = new Array<number>(targetBucketCount).fill(0);
     const bucketCounts = new Array<number>(targetBucketCount).fill(0);
 
-    for (let i = 0; i < binCount; i++) {
+    for (let i = 0; i < binCount; i += 1) {
         const freq = (i / binCount) * nyquist;
-
-        if (freq < minFreq) continue; // skip sub-audible bins
-
-        const norm = Math.log(freq / minFreq) / Math.log(maxFreq / minFreq);
-        const band = Math.min(
-            targetBucketCount - 1,
-            Math.floor(norm * targetBucketCount)
+        const safeFreq = Math.max(freq, minFreq);
+        const norm = Math.log(safeFreq / minFreq) / Math.log(maxFreq / minFreq);
+        const band = Math.max(
+            0,
+            Math.min(targetBucketCount - 1, Math.round(norm * (targetBucketCount - 1)))
         );
 
         buckets[band] += fft[i];
-        bucketCounts[band]++;
+        bucketCounts[band] += 1;
     }
 
-    // Normalize by count
-    for (let i = 0; i < targetBucketCount; i++) {
-        if (bucketCounts[i] > 0) {
-            buckets[i] /= bucketCounts[i];
-        }
+    for (let i = 0; i < targetBucketCount; i += 1) {
+      if (bucketCounts[i] > 0) {
+          buckets[i] /= bucketCounts[i];
+      } else {
+          buckets[i] = buckets[Math.max(0, i - 1)];
+      }
     }
 
     return buckets;

packages/audiodocs/src/canvasUtils/clearCanvas.ts

@@ -0,0 +1,5 @@
+
+export default function clearCanvas(canvas: HTMLCanvasElement, ctx: CanvasRenderingContext2D) {
+  ctx.fillStyle = '#fcfcff';
+  ctx.clearRect(0, 0, canvas.width, canvas.height);
+}

packages/audiodocs/src/canvasUtils/drawSpectroLines.ts

@@ -0,0 +1,32 @@
+
+
+export default function drawSpectroLines(
+  ctx: CanvasRenderingContext2D,
+  bars: number[],
+  drawCount: number,
+  bucketShift: number,
+  barHeight: number,
+  barWidth: number,
+  barSpacing: number,
+  colorMode: 'dark' | 'light',
+) {
+  for (let i = 0; i < drawCount + 2 * bucketShift; i += 1) {
+    const value = bars[i] || 0;
+    const height = Math.max((value / 255) * barHeight, 2);
+    const offset = barHeight - height;
+    const x = (barWidth + barSpacing) * (i);
+
+    const gradient = ctx.createLinearGradient(0, offset + height, 0, offset);
+
+    if (colorMode === 'dark') {
+      gradient.addColorStop(0, '#FF6259');
+      gradient.addColorStop(0.85, '#232736');
+    } else {
+      gradient.addColorStop(0, '#FF6259');
+      gradient.addColorStop(0.85, '#fcfcff');
+    }
+
+    ctx.fillStyle = gradient;
+    ctx.fillRect(x, offset, barWidth, height);
+  }
+}

packages/audiodocs/src/canvasUtils/getBarWidth.ts

@@ -0,0 +1,6 @@
+
+export default function getBarWidth(canvasWidth: number, bucketCount: number, barSpacing: number): number {
+  const initialWidth = Math.max(20, canvasWidth / bucketCount);
+
+  return canvasWidth / Math.floor(canvasWidth / (initialWidth + barSpacing)) - barSpacing;
+}

packages/audiodocs/src/canvasUtils/index.ts

@@ -0,0 +1,3 @@
+export { default as clearCanvas } from './clearCanvas';
+export { default as getBarWidth } from './getBarWidth';
+export { default as drawSpectroLines } from './drawSpectroLines';