50 as inicial brush size, fix octaves

Author: zvuho

index.html

@@ -116,10 +116,10 @@
         <div class="color-key white" data-note="F4" style="background-color: #C0FF00">F4</div>
         <div class="color-key black" data-note="Gb4" style="background-color: #80FF00">Gb4</div>
         <div class="color-key white" data-note="G4" style="background-color: #00FF00">G4</div>
-        <div class="color-key black" data-note="Ab5" style="background-color: #00FF40">Ab5</div>
-        <div class="color-key white" data-note="A5" style="background-color: #00FF80">A5</div>
-        <div class="color-key black" data-note="Bb5" style="background-color: #00FFC0">Bb5</div>
-        <div class="color-key white" data-note="B5" style="background-color: #00FFFF">B5</div>
+        <div class="color-key black" data-note="Ab4" style="background-color: #00FF40">Ab4</div>
+        <div class="color-key white" data-note="A4" style="background-color: #00FF80">A4</div>
+        <div class="color-key black" data-note="Bb4" style="background-color: #00FFC0">Bb4</div>
+        <div class="color-key white" data-note="B4" style="background-color: #00FFFF">B4</div>
     </div>
     <canvas id="paintCanvas"></canvas>
     <div class="brush-size-container">
@@ -148,7 +148,7 @@
         let isListening = false;
         let synth = new Tone.Synth().toDestination();
         let selectedColor = '#000000';
-        const INITIAL_BRUSH_SIZE = 5;
+        const INITIAL_BRUSH_SIZE = 50;
 
         // Initialize canvas and Tone.js first
         canvas.width = window.innerWidth - 200;
@@ -235,8 +235,9 @@
             const g = pixelData[1];
             const b = pixelData[2];
 
-            // Play sound for all colors except pure white (255,255,255)
-            if (r < 250 || g < 250 || b < 250) {
+            console.log(r, g, b);
+            // Play sound for all colors except almost pure white (250,250,250)
+            if (r > 2 || g > 2 || b > 2) {
                 // Convert RGB to note
                 const note = rgbToNote(r, g, b);