From 972c658a22967da05479c3740d7127cd2421581c Mon Sep 17 00:00:00 2001
From: Kim T <kimturley@gmail.com>
Date: Mon, 1 May 2023 22:26:14 -0700
Subject: [PATCH 1/2] Ability to enable/disable keys

---
 docs/detailspecs.md  |  4 ++++
 webaudio-controls.js | 26 ++++++++++++++++++++++++--
 2 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/docs/detailspecs.md b/docs/detailspecs.md
index 43472db..8eae2de 100644
--- a/docs/detailspecs.md
+++ b/docs/detailspecs.md
@@ -142,6 +142,10 @@ If the `fire` parameter is `undefined` or `false`, this function will not fire `
 `webaudio-keyboard`  
 **description**: webaudio-keyboard can be setup pressing state with this function from JavaScript. corresponding key specified by the `note` is pressed if the `state` is non-zero otherwise the key is released. This function will NOT fire the 'change' event. If the `audioContext` and `when` arguments are specified, the pressing state will be updated after the specified time. `when` is the time in seconds on the `currentTime` time axis of the `audioContext`.
 
+### setDisabledRange(state, start, end)  
+`webaudio-keyboard`  
+**description**: Disable a range of keys using non-zero `state` or zero to re-enable keys. Pass `start` value for the first key in the range. `end` for the last key in the range. All keys between start/end will be disabled/enabled. Disabled keys will be greyed out and will not trigger events.
+
 ---
 ## Events
 
diff --git a/webaudio-controls.js b/webaudio-controls.js
index 3e91954..27b34eb 100644
--- a/webaudio-controls.js
+++ b/webaudio-controls.js
@@ -1643,6 +1643,7 @@ ${this.basestyle}
       this.bheight = this.height * 0.55;
       this.max=this.min+this.keys-1;
       this.dispvalues=[];
+      this.disabledvalues=[];
       this.valuesold=[];
       if(this.kf[this.min%12])
         --this.min;
@@ -1682,7 +1683,9 @@ ${this.basestyle}
       for(let i=this.min,j=0;i<=this.max;++i) {
         if(this.kf[i%12]==0) {
           let x=this.wwidth*(j++)+1;
-          if(this.dispvalues.indexOf(i)>=0)
+          if(this.disabledvalues.indexOf(i)>=0)
+            rrect(this.ctx,x,1,this.wwidth-1,this.height-2,r,this.coltab[3],this.coltab[3]);
+          else if(this.dispvalues.indexOf(i)>=0)
             rrect(this.ctx,x,1,this.wwidth-1,this.height-2,r,this.coltab[5],this.coltab[6]);
           else
             rrect(this.ctx,x,1,this.wwidth-1,this.height-2,r,this.coltab[1],this.coltab[2]);
@@ -1692,7 +1695,9 @@ ${this.basestyle}
       for(let i=this.min;i<this.max;++i) {
         if(this.kf[i%12]) {
           let x=this.wwidth*this.ko[this.min%12]+this.bwidth*(i-this.min)+1;
-          if(this.dispvalues.indexOf(i)>=0)
+          if(this.disabledvalues.indexOf(i)>=0)
+            rrect(this.ctx,x,1,this.bwidth,h2,r,this.coltab[3],this.coltab[3]);
+          else if(this.dispvalues.indexOf(i)>=0)
             rrect(this.ctx,x,1,this.bwidth,h2,r,this.coltab[7],this.coltab[8]);
           else
             rrect(this.ctx,x,1,this.bwidth,h2,r,this.coltab[3],this.coltab[4]);
@@ -1826,6 +1831,7 @@ ${this.basestyle}
       ev.stopPropagation();
     }
     sendEventFromKey(s,k){
+      if (this.disabledvalues.includes(k)) return;
       let ev=document.createEvent('HTMLEvents');
       ev.initEvent('change',true,true);
       ev.note=[s,k];
@@ -1844,6 +1850,7 @@ ${this.basestyle}
       if(notes.length) {
         this.valuesold=this.values;
         for(let i=0;i<notes.length;++i) {
+          if (this.disabledvalues.includes(notes[i][1])) return;
           this.setdispvalues(notes[i][0],notes[i][1]);
           let ev=document.createEvent('HTMLEvents');
           ev.initEvent('change',true,true);
@@ -1852,6 +1859,21 @@ ${this.basestyle}
         }
       }
     }
+    setDisabledRange(state,start,end) {
+      for (var i=start; i<end;i++) {
+        kbd.setdisabledvalues(state,i);
+      }
+      this.redraw();
+    }
+    setdisabledvalues(state,note) {
+      let n=this.disabledvalues.indexOf(note);
+      if(state) {
+        if(n<0) this.disabledvalues.push(note);
+      }
+      else {
+        if(n>=0) this.disabledvalues.splice(n,1);
+      }
+    }
     setdispvalues(state,note) {
       let n=this.dispvalues.indexOf(note);
       if(state) {

From 7010594ab669f9d5001795a8b548cc02455f48ba Mon Sep 17 00:00:00 2001
From: Kim T <kimturley@gmail.com>
Date: Wed, 3 May 2023 21:11:17 -0700
Subject: [PATCH 2/2] Fix bug

---
 webaudio-controls.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webaudio-controls.js b/webaudio-controls.js
index 27b34eb..aa937fb 100644
--- a/webaudio-controls.js
+++ b/webaudio-controls.js
@@ -1861,7 +1861,7 @@ ${this.basestyle}
     }
     setDisabledRange(state,start,end) {
       for (var i=start; i<end;i++) {
-        kbd.setdisabledvalues(state,i);
+        this.setdisabledvalues(state,i);
       }
       this.redraw();
     }