requirebin sketch

index.js

var baudio = require('webaudio')

var tau = Math.PI * 2
var audio = new AudioContext()

getNotes().forEach(function (item, i) {
  var note = item[0]
  var freq = item[1]

  var el = document.createElement('button')
  el.innerHTML = note
  el.addEventListener('click', function () {
    playNote(freq, 1000)
  })
  if (i % 12 === 0) document.body.appendChild(document.createElement('br'))
  document.body.appendChild(el)
})

function playNote (freq, duration) {
  var b = baudio(audio, function (t) {
    return Math.sin( t * tau * freq )
  })

  b.play()
  setTimeout(function () {
    b.stop()
  }, duration)
}

function getNotes () {
  return [
    ['C0', 16.35],
    ['C#0/Db0', 17.32],
    ['D0', 18.35],
    ['D#0/Eb0', 19.45],
    ['E0', 20.60],
    ['F0', 21.83],
    ['F#0/Gb0', 23.12],
    ['G0', 24.50],
    ['G#0/Ab0', 25.96],
    ['A0', 27.50],
    ['A#0/Bb0', 29.14],
    ['B0', 30.87],
    ['C1', 32.70],
    ['C#1/Db1', 34.65],
    ['D1', 36.71],
    ['D#1/Eb1', 38.89],
    ['E1', 41.20],
    ['F1', 43.65],
    ['F#1/Gb1', 46.25],
    ['G1', 49.00],
    ['G#1/Ab1', 51.91],
    ['A1', 55.00],
    ['A#1/Bb1', 58.27],
    ['B1', 61.74],
    ['C2', 65.41],
    ['C#2/Db2', 69.30],
    ['D2', 73.42],
    ['D#2/Eb2', 77.78],
    ['E2', 82.41],
    ['F2', 87.31],
    ['F#2/Gb2', 92.50],
    ['G2', 98.00],
    ['G#2/Ab2', 103.83],
    ['A2', 110.00],
    ['A#2/Bb2', 116.54],
    ['B2', 123.47],
    ['C3', 130.81],
    ['C#3/Db3', 138.59],
    ['D3', 146.83],
    ['D#3/Eb3', 155.56],
    ['E3', 164.81],
    ['F3', 174.61],
    ['F#3/Gb3', 185.00],
    ['G3', 196.00],
    ['G#3/Ab3', 207.65],
    ['A3', 220.00],
    ['A#3/Bb3', 233.08],
    ['B3', 246.94],
    ['C4', 261.63],
    ['C#4/Db4', 277.18],
    ['D4', 293.66],
    ['D#4/Eb4', 311.13],
    ['E4', 329.63],
    ['F4', 349.23],
    ['F#4/Gb4', 369.99],
    ['G4', 392.00],
    ['G#4/Ab4', 415.30],
    ['A4', 440.00],
    ['A#4/Bb4', 466.16],
    ['B4', 493.88],
    ['C5', 523.25],
    ['C#5/Db5', 554.37],
    ['D5', 587.33],
    ['D#5/Eb5', 622.25],
    ['E5', 659.25],
    ['F5', 698.46],
    ['F#5/Gb5', 739.99],
    ['G5', 783.99],
    ['G#5/Ab5', 830.61],
    ['A5', 880.00],
    ['A#5/Bb5', 932.33],
    ['B5', 987.77],
    ['C6', 1046.50],
    ['C#6/Db6', 1108.73],
    ['D6', 1174.66],
    ['D#6/Eb6', 1244.51],
    ['E6', 1318.51],
    ['F6', 1396.91],
    ['F#6/Gb6', 1479.98],
    ['G6', 1567.98],
    ['G#6/Ab6', 1661.22],
    ['A6', 1760.00],
    ['A#6/Bb6', 1864.66],
    ['B6', 1975.53],
    ['C7', 2093.00],
    ['C#7/Db7', 2217.46],
    ['D7', 2349.32],
    ['D#7/Eb7', 2489.02],
    ['E7', 2637.02],
    ['F7', 2793.83],
    ['F#7/Gb7', 2959.96],
    ['G7', 3135.96],
    ['G#7/Ab7', 3322.44],
    ['A7', 3520.00],
    ['A#7/Bb7', 3729.31],
    ['B7', 3951.07],
    ['C8', 4186.01],
    ['C#8/Db8', 4434.92],
    ['D8', 4698.63],
    ['D#8/Eb8', 4978.03],
    ['E8', 5274.04],
    ['F8', 5587.65],
    ['F#8/Gb8', 5919.91],
    ['G8', 6271.93],
    ['G#8/Ab8', 6644.88],
    ['A8', 7040.00],
    ['A#8/Bb8', 7458.62],
    ['B8', 7902.13]
  ]
}

minified.js

require=function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({webaudio:[function(require,module,exports){module.exports=function(context,fn){if(typeof context==="function"){var Context=window.AudioContext||window.webkitAudioContext;if(!Context)throw new Error("AudioContext not supported");fn=context;context=new Context}var self=context.createScriptProcessor(2048,1,1);self.fn=fn;self.i=self.t=0;window._SAMPLERATE=self.sampleRate=self.rate=context.sampleRate;self.duration=Infinity;self.recording=false;self.onaudioprocess=function(e){var output=e.outputBuffer.getChannelData(0),input=e.inputBuffer.getChannelData(0);self.tick(output,input)};self.tick=function(output,input){output=output||self._buffer;input=input||[];for(var i=0;i<output.length;i+=1){self.t=self.i/self.rate;self.i+=1;output[i]=self.fn(self.t,self.i,input[i]);if(self.i>=self.duration){self.stop();break}}return output};self.stop=function(){self.disconnect();self.playing=false;if(self.recording){}};self.play=function(opts){if(self.playing)return;self.connect(self.context.destination);self.playing=true;setTimeout(function(){this.node.disconnect()},1e11);return};self.record=function(){};self.reset=function(){self.i=self.t=0};self.createSample=function(duration){self.reset();var buffer=self.context.createBuffer(1,duration,self.context.sampleRate);var blob=buffer.getChannelData(0);self.tick(blob);return buffer};return self};function mergeArgs(opts,args){Object.keys(opts||{}).forEach(function(key){args[key]=opts[key]});return Object.keys(args).reduce(function(acc,key){var dash=key.length===1?"-":"--";return acc.concat(dash+key,args[key])},[])}function signed(n){if(isNaN(n))return 0;var b=Math.pow(2,15);return n>0?Math.min(b-1,Math.floor(b*n-1)):Math.max(-b,Math.ceil(b*n-1))}},{}]},{},[]);var baudio=require("webaudio");var tau=Math.PI*2;var audio=new AudioContext;getNotes().forEach(function(item,i){var note=item[0];var freq=item[1];var el=document.createElement("button");el.innerHTML=note;el.addEventListener("click",function(){playNote(freq,1e3)});if(i%12===0)document.body.appendChild(document.createElement("br"));document.body.appendChild(el)});function playNote(freq,duration){var b=baudio(audio,function(t){return Math.sin(t*tau*freq)});b.play();setTimeout(function(){b.stop()},duration)}function getNotes(){return[["C0",16.35],["C#0/Db0",17.32],["D0",18.35],["D#0/Eb0",19.45],["E0",20.6],["F0",21.83],["F#0/Gb0",23.12],["G0",24.5],["G#0/Ab0",25.96],["A0",27.5],["A#0/Bb0",29.14],["B0",30.87],["C1",32.7],["C#1/Db1",34.65],["D1",36.71],["D#1/Eb1",38.89],["E1",41.2],["F1",43.65],["F#1/Gb1",46.25],["G1",49],["G#1/Ab1",51.91],["A1",55],["A#1/Bb1",58.27],["B1",61.74],["C2",65.41],["C#2/Db2",69.3],["D2",73.42],["D#2/Eb2",77.78],["E2",82.41],["F2",87.31],["F#2/Gb2",92.5],["G2",98],["G#2/Ab2",103.83],["A2",110],["A#2/Bb2",116.54],["B2",123.47],["C3",130.81],["C#3/Db3",138.59],["D3",146.83],["D#3/Eb3",155.56],["E3",164.81],["F3",174.61],["F#3/Gb3",185],["G3",196],["G#3/Ab3",207.65],["A3",220],["A#3/Bb3",233.08],["B3",246.94],["C4",261.63],["C#4/Db4",277.18],["D4",293.66],["D#4/Eb4",311.13],["E4",329.63],["F4",349.23],["F#4/Gb4",369.99],["G4",392],["G#4/Ab4",415.3],["A4",440],["A#4/Bb4",466.16],["B4",493.88],["C5",523.25],["C#5/Db5",554.37],["D5",587.33],["D#5/Eb5",622.25],["E5",659.25],["F5",698.46],["F#5/Gb5",739.99],["G5",783.99],["G#5/Ab5",830.61],["A5",880],["A#5/Bb5",932.33],["B5",987.77],["C6",1046.5],["C#6/Db6",1108.73],["D6",1174.66],["D#6/Eb6",1244.51],["E6",1318.51],["F6",1396.91],["F#6/Gb6",1479.98],["G6",1567.98],["G#6/Ab6",1661.22],["A6",1760],["A#6/Bb6",1864.66],["B6",1975.53],["C7",2093],["C#7/Db7",2217.46],["D7",2349.32],["D#7/Eb7",2489.02],["E7",2637.02],["F7",2793.83],["F#7/Gb7",2959.96],["G7",3135.96],["G#7/Ab7",3322.44],["A7",3520],["A#7/Bb7",3729.31],["B7",3951.07],["C8",4186.01],["C#8/Db8",4434.92],["D8",4698.63],["D#8/Eb8",4978.03],["E8",5274.04],["F8",5587.65],["F#8/Gb8",5919.91],["G8",6271.93],["G#8/Ab8",6644.88],["A8",7040],["A#8/Bb8",7458.62],["B8",7902.13]]}

package.json

{
  "name": "requirebin-sketch",
  "version": "1.0.0",
  "dependencies": {
    "webaudio": "2.0.0"
  }
}

page-body.html

<!-- contents of this file will be placed inside the <body> -->

page-head.html

<!-- contents of this file will be placed inside the <head> -->

requirebin.md

made with requirebin