SECOND RATE AUDIO TOOLS

Web audio api experiments. Built with a substandard synth, a tolerable keyboard, a few inadequate visualizers, a lot of love, and an impeccable taste.


You found something weird or unoptimized? YOU're weird and unoptimized! (but please let me know)


(Btw I also built a drum polyrhythm generator)


<3<3<3

SOURCE

js


          //create a common context to be used by the synth, keyboard and visualizers
          let context = new AudioContext;
          let mixNode = context.createGain();
          mixNode.connect(context.destination)

          //helper function to create keyboard, and plug it to the synth play/release note
          function setUpKeyboard(name,source,div){
            name = new TolerableKeyboard({
                      divID: div, 
                      octaves:5,
                      width:1200,
                      showKey:true, 
                      autoSetUp:false, 
                      firstNote:'C1'
                 })

            name.pressNote = function(frequency){
              source.playNote(frequency,0)
            }
            name.releaseNote = function(frequency){
              source.stopNote(frequency,0)
            }
            //we could add some keyBindings like this:
            //name.addKeyBinding('Z','F#2')
          }

          //Helper function to create visualizers and connect them to the mix node
          function setUpVisualizers(context,mixNode){
            let visualizerVolume = new InadequateVisualizer({context:context,divID:'volumeID',type:'Volume'})
            visualizerVolume.connectAndDraw(mixNode)
            let visualizerFreq = new InadequateVisualizer({context:context,divID:'freqID',type:'Frequency'})
            visualizerFreq.connectAndDraw(mixNode)
            let visualizerScope = new InadequateVisualizer({context:context,divID:'scopeID',type:'Oscilloscope'})
            visualizerScope.connectAndDraw(mixNode)
          }

          //Create the synth, then connect the keyboard and visualizers
          document.addEventListener('DOMContentLoaded', function(){ 
            // Create a synth with a few basic options
            let synth = new SubstandardSynth({
              context:context,
              outNode:mixNode,
              export:true,
              pageRoot:'https://atactionpark.github.io/SecondRateAudioTools/',
              ID:'synth',
              voices:8
            });
            setUpKeyboard(keyboard,synth,'keyboard');
            setUpVisualizers(context,mixNode);
          }, false);

html


          <div id='synth'></div>
          <div id="keyboard"></div>
          <div id="volumeID"></div>
          <div id="freqID"></div>
          <div id="scopeID"></div>