Untitled

<html>
    <head>
        <script src="lib/flocking/dist/flocking-all.js"></script>
        <style>
            body{
                padding: 0;
                margin: 0;
            }
            #meter{
                box-sizing: border-box;
                position: fixed;
                bottom: 0;
                left: 0;
                border: 3px solid grey;
                border-radius: 15px;
                width: 100%; //fallback
                width: 100vw;
                height: 75px;
            }
        </style>
    </head>
    <body>
        <input type="checkbox" id="starter" name="starter"><span >start audio</span>
        <script>
            document.getElementById('starter').onclick= function(){
                if (this.checked){
                    flock.webAudio.audioSystem.audioContextSingleton.resume();
                }else{
                    flock.enviro.shared.stop();
                }
            };
        </script>

        <canvas id="meter"></canvas>

        <script>
            var basssynth = flock.synth.polyphonic({
                synthDef: {
                    ugen: "flock.ugen.distortion.tarrabiaDeJong",
                    id: "disto",
                    mul: {
                        id: "env",
                        ugen: "flock.ugen.asr",
                        attack: 0.1,
                        release: 1,
                        gate: 0,
                        mul: 0.35
                    },
                    amount: .2,
                    source: {
                        ugen: "flock.ugen.saw",
                        freq: {
                            id: "mod",
                            ugen: "flock.ugen.square",
                            mul: {
                                ugen: "flock.ugen.sin",
                                mul: 30,
                                freq: 4
                            },
                            add: 100
                        }
                    }
                }
            });

            var mpe = flock.midi.connection({
                openImmediately: true,
                ports: {
                    input: {
                        name: "Seaboard BLOCK"
                    }
                },
                listeners: {
                    noteOn: function(msg){
                        basssynth.noteOn(msg.channel, {
                            "disto.amount": (msg.velocity/127),
                            "mod.add": flock.midiFreq(msg.note),
                            "env.mul": Math.pow(10,((msg.velocity/12.7)-11)/20)
                        });
                    },
                    noteOff: function(msg){
                        basssynth.noteOff(msg.channel);
                    },
                    control: function(msg){
                        if( basssynth.voiceAllocator.activeVoices[msg.channel] !== undefined)
                            basssynth.voiceAllocator.activeVoices[msg.channel].set("mod.mul.freq", msg.value-60);
                    },
                    aftertouch: function(msg){
                        if( basssynth.voiceAllocator.activeVoices[msg.channel] !== undefined)
                            basssynth.voiceAllocator.activeVoices[msg.channel].set( "env.mul", Math.pow(10,((msg.pressure/12.7)-11)/20) );
                    },
                }
            });
        </script>

        <script>
            flock.enviro.shared.play();
        </script>
    </body>
</html>