Web Audio Oscillators - Playing Notes No Clip

This version of playing notes does not have the clipping sound at the end of each note as the gain is set to zero before the oscillator is ended.

HTML

<p>
Wave Type: 
<select id="waveType">
    <option>sine</option>
    <option>square</option>
    <option>sawtooth</option>
    <option>triangle</option>
</select> 
Note being played: <input type="text" id="note" size="3">
</p>

  <svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     width="100%" height="100%" viewBox="-5 -5 1130 450">
         
  <defs>
    <rect id="key-white" x="0" y="0" width="20" height="120" rx="3" ry="3" stroke="black" />
    <rect id="key-black" x="0" y="0" width="14" height="80" rx="3" ry="3" stroke="black" />
  </defs>
  
  <g id="keyboard"s>
    <g id="ivory" fill="white">
      <use id="C0" xlink:href="#key-white" x="0" />
      <use id="D0" xlink:href="#key-white" x="20"/>
      <use id="E0" xlink:href="#key-white" x="40"/>
      <use id="F0" xlink:href="#key-white" x="60"/>
      <use id="G0" xlink:href="#key-white" x="80"/>
      <use id="A0" xlink:href="#key-white" x="100"/>
      <use id="B0" xlink:href="#key-white" x="120"/>

      <use id="C1" xlink:href="#key-white" x="140" />
      <use id="D1" xlink:href="#key-white" x="160"/>
      <use id="E1" xlink:href="#key-white" x="180"/>
      <use id="F1" xlink:href="#key-white" x="200"/>
      <use id="G1" xlink:href="#key-white" x="220"/>
      <use id="A1" xlink:href="#key-white" x="240"/>
      <use id="B1" xlink:href="#key-white" x="260"/>

      <use id="C2" xlink:href="#key-white" x="280" />
      <use id="D2" xlink:href="#key-white" x="300"/>
      <use id="E2" xlink:href="#key-white" x="320"/>
      <use id="F2" xlink:href="#key-white" x="340"/>
      <use id="G2" xlink:href="#key-white" x="360"/>
      <use id="A2" xlink:href="#key-white" x="380"/>
      <use id="B2" xlink:href="#key-white" x="400"/>

      <use id="C3" xlink:href="#key-white" x="420" />
      <use id="D3" xlink:href="#key-white" x="440"/>
      <use id="E3" xlink:href="#key-white" x="460"/>
      <use id="F3" xlink:href="#key-white" x="480"/>
      <use id="G3"...

JavaScript

// Fix up prefixing
window.AudioContext = window.AudioContext || window.webkitAudioContext;
var ctx = new AudioContext();
var currentOsc, currentGain;

function startNote(e) {
    var frq = notes[e.currentTarget.id], o = ctx.createOscillator(), g = ctx.createGain();
    $(e.currentTarget).attr("fill","yellow");
    if (currentOsc) currentOsc.stop(0);
    o.type = $("#waveType").val();
    if (frq) {
        $("#note").val(e.currentTarget.id);
        o.frequency.value = frq;
        o.start(0);
        currentOsc = o;
        currentGain = g;
        
        g.gain.value = 1;
        o.connect(g);
        g.connect(ctx.destination);
    }
}
function stopNote(e) {
    $(e.currentTarget).attr("fill","inherit");
    currentGain.gain.value = 0;
    $("#note").val("");
}

$("use").mousedown(startNote);
$("use").mouseup(stopNote);

var notes = {
    'C0': 16.35,
    'C#0': 17.32,
    'Db0': 17.32,
    'D0': 18.35,
    'D#0': 19.45,
    'Eb0': 19.45,
    'E0': 20.60,
    'F0': 21.83,
    'F#0': 23.12,
    'Gb0': 23.12,
    'G0': 24.50,
    'G#0': 25.96,
    'Ab0': 25.96,
    'A0': 27.50,
    'A#0': 29.14,
    'Bb0': 29.14,
    'B0': 30.87,
    'C1': 32.70,
    'C#1': 34.65,
    'Db1': 34.65,
    'D1': 36.71,
    'D#1': 38.89,
    'Eb1': 38.89,
    'E1': 41.20,
    'F1': 43.65,
    'F#1': 46.25,
    'Gb1': 46.25,
    'G1': 49.00,
    'G#1': 51.91,
    'Ab1': 51.91,
    'A1': 55.00,
    'A#1': 58.27,
    'Bb1': 58.27,
    'B1': 61.74,
    'C2': 65.41,
    'C#2': 69.30,
    'Db2': 69.30,
    'D2': 73.42,
    'D#2': 77.78,
    'Eb2': 77.78,
    'E2': 82.41,
    'F2': 87.31,
    'F#2': 92.50,
    'Gb2': 92.50,
    'G2': 98.00,
    'G#2': 103.83,
    'Ab2': 103.83,
    'A2': 110.00,
    'A#2': 116.54,
    'Bb2': 116.54,
    'B2': 123.47,
    'C3': 130.81,
    'C#3': 138.59,
    'Db3': 138.59,
    'D3': 146.83,
    'D#3': 155.56,
    'Eb3': 155.56,
    'E3': 164.81,
    'F3': 174.61,
    'F#3': 185.00,
    'Gb3': 185.00,
    'G3': 196.00,
    'G#3': 207.65,
    'Ab3':...