-
-
Save bergie/6724a6eb8a1aaf351866e7a43c3ecd43 to your computer and use it in GitHub Desktop.
Web Audio Theremin
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"caseSensitive": false, | |
"properties": { | |
"name": "ASM2", | |
"environment": { | |
"type": "noflo-browser", | |
"content": "<canvas id=\"canvas\" width=\"200\" height=\"200\"></canvas>" | |
}, | |
"description": "WebAssembly Theremin", | |
"icon": "soundcloud" | |
}, | |
"inports": {}, | |
"outports": {}, | |
"groups": [ | |
{ | |
"name": "drawing", | |
"nodes": [ | |
"circle", | |
"color", | |
"div_m0ubq", | |
"draw", | |
"point", | |
"stroke" | |
], | |
"metadata": { | |
"description": "" | |
} | |
}, | |
{ | |
"name": "playing", | |
"nodes": [ | |
"div", | |
"div_6bct0", | |
"gain", | |
"mul", | |
"play", | |
"sinusoid" | |
], | |
"metadata": { | |
"description": "" | |
} | |
}, | |
{ | |
"name": "interacting", | |
"nodes": [ | |
"mouse", | |
"mousex", | |
"mousey", | |
"SendX", | |
"SendY" | |
], | |
"metadata": { | |
"description": "" | |
} | |
} | |
], | |
"processes": { | |
"mouse": { | |
"component": "dom/Listen", | |
"metadata": { | |
"label": "mouse", | |
"x": 0, | |
"y": 720, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"draw": { | |
"component": "canvas/Draw", | |
"metadata": { | |
"label": "draw", | |
"x": 1044, | |
"y": 360, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"circle": { | |
"component": "canvas/MakeCircle", | |
"metadata": { | |
"label": "circle", | |
"x": 756, | |
"y": 180, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"stroke": { | |
"component": "canvas/Stroke", | |
"metadata": { | |
"label": "stroke", | |
"x": 936, | |
"y": 396, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"canvas": { | |
"component": "dom/GetElement", | |
"metadata": { | |
"label": "canvas", | |
"x": -180, | |
"y": 360, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"mousex": { | |
"component": "objects/GetObjectKey", | |
"metadata": { | |
"label": "mousex", | |
"x": 360, | |
"y": 720, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"mousey": { | |
"component": "objects/GetObjectKey", | |
"metadata": { | |
"label": "mousey", | |
"x": 360, | |
"y": 576, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"point": { | |
"component": "canvas/MakePoint", | |
"metadata": { | |
"label": "point", | |
"x": 576, | |
"y": 108, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"div_m0ubq": { | |
"component": "math/Divide", | |
"metadata": { | |
"label": "div", | |
"x": 576, | |
"y": 216, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"color": { | |
"component": "canvas/MakeColor", | |
"metadata": { | |
"label": "color", | |
"x": 756, | |
"y": 396, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"play": { | |
"component": "webaudio/Play", | |
"metadata": { | |
"label": "play", | |
"x": 1044, | |
"y": 612, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"sinusoid": { | |
"component": "webaudio/Oscillator", | |
"metadata": { | |
"label": "sinusoid", | |
"x": 828, | |
"y": 576, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"gain": { | |
"component": "webaudio/Gain", | |
"metadata": { | |
"label": "gain", | |
"x": 936, | |
"y": 612, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"div_6bct0": { | |
"component": "math/Divide", | |
"metadata": { | |
"label": "div", | |
"x": 828, | |
"y": 720, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"div": { | |
"component": "math/Divide", | |
"metadata": { | |
"label": "div", | |
"x": 612, | |
"y": 612, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"mul": { | |
"component": "math/Multiply", | |
"metadata": { | |
"label": "mul", | |
"x": 720, | |
"y": 576, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"SendX": { | |
"component": "strings/SendString", | |
"metadata": { | |
"label": "SendX", | |
"x": 216, | |
"y": 720, | |
"width": 72, | |
"height": 72 | |
} | |
}, | |
"SendY": { | |
"component": "strings/SendString", | |
"metadata": { | |
"label": "SendY", | |
"x": 216, | |
"y": 576, | |
"width": 72, | |
"height": 72 | |
} | |
} | |
}, | |
"connections": [ | |
{ | |
"src": { | |
"process": "canvas", | |
"port": "element" | |
}, | |
"tgt": { | |
"process": "mouse", | |
"port": "element" | |
}, | |
"metadata": { | |
"route": 5 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mouse", | |
"port": "event" | |
}, | |
"tgt": { | |
"process": "mousex", | |
"port": "in" | |
}, | |
"metadata": { | |
"route": 5 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mouse", | |
"port": "event" | |
}, | |
"tgt": { | |
"process": "mousey", | |
"port": "in" | |
}, | |
"metadata": { | |
"route": 5 | |
} | |
}, | |
{ | |
"src": { | |
"process": "canvas", | |
"port": "element" | |
}, | |
"tgt": { | |
"process": "draw", | |
"port": "canvas" | |
}, | |
"metadata": { | |
"route": 5 | |
} | |
}, | |
{ | |
"src": { | |
"process": "point", | |
"port": "point" | |
}, | |
"tgt": { | |
"process": "circle", | |
"port": "center" | |
}, | |
"metadata": { | |
"route": 2 | |
} | |
}, | |
{ | |
"src": { | |
"process": "circle", | |
"port": "circle" | |
}, | |
"tgt": { | |
"process": "stroke", | |
"port": "items" | |
}, | |
"metadata": { | |
"route": 2 | |
} | |
}, | |
{ | |
"src": { | |
"process": "stroke", | |
"port": "stroke" | |
}, | |
"tgt": { | |
"process": "draw", | |
"port": "commands" | |
}, | |
"metadata": { | |
"route": 2 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mousey", | |
"port": "out" | |
}, | |
"tgt": { | |
"process": "point", | |
"port": "y" | |
}, | |
"metadata": { | |
"route": 7 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mousex", | |
"port": "out" | |
}, | |
"tgt": { | |
"process": "point", | |
"port": "x" | |
}, | |
"metadata": { | |
"route": 6 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mousex", | |
"port": "out" | |
}, | |
"tgt": { | |
"process": "div_m0ubq", | |
"port": "dividend" | |
}, | |
"metadata": { | |
"route": 6 | |
} | |
}, | |
{ | |
"src": { | |
"process": "div_m0ubq", | |
"port": "quotient" | |
}, | |
"tgt": { | |
"process": "circle", | |
"port": "radius" | |
}, | |
"metadata": { | |
"route": 6 | |
} | |
}, | |
{ | |
"src": { | |
"process": "color", | |
"port": "color" | |
}, | |
"tgt": { | |
"process": "stroke", | |
"port": "strokestyle" | |
}, | |
"metadata": { | |
"route": 2 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mousey", | |
"port": "out" | |
}, | |
"tgt": { | |
"process": "color", | |
"port": "lightness" | |
}, | |
"metadata": { | |
"route": 7 | |
} | |
}, | |
{ | |
"src": { | |
"process": "gain", | |
"port": "gain" | |
}, | |
"tgt": { | |
"process": "play", | |
"port": "audionodes" | |
}, | |
"metadata": { | |
"route": 3 | |
} | |
}, | |
{ | |
"src": { | |
"process": "sinusoid", | |
"port": "oscillator" | |
}, | |
"tgt": { | |
"process": "gain", | |
"port": "audionodes" | |
}, | |
"metadata": { | |
"route": 3 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mousey", | |
"port": "out" | |
}, | |
"tgt": { | |
"process": "div_6bct0", | |
"port": "dividend" | |
}, | |
"metadata": { | |
"route": 7 | |
} | |
}, | |
{ | |
"src": { | |
"process": "div_6bct0", | |
"port": "quotient" | |
}, | |
"tgt": { | |
"process": "gain", | |
"port": "gain" | |
}, | |
"metadata": { | |
"route": 7 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mousex", | |
"port": "out" | |
}, | |
"tgt": { | |
"process": "div", | |
"port": "dividend" | |
}, | |
"metadata": { | |
"route": 6 | |
} | |
}, | |
{ | |
"src": { | |
"process": "div", | |
"port": "quotient" | |
}, | |
"tgt": { | |
"process": "mul", | |
"port": "multiplicand" | |
}, | |
"metadata": { | |
"route": 6 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mul", | |
"port": "product" | |
}, | |
"tgt": { | |
"process": "sinusoid", | |
"port": "frequency" | |
}, | |
"metadata": { | |
"route": 6 | |
} | |
}, | |
{ | |
"src": { | |
"process": "SendY", | |
"port": "out" | |
}, | |
"tgt": { | |
"process": "mousey", | |
"port": "key" | |
}, | |
"metadata": { | |
"route": 6 | |
} | |
}, | |
{ | |
"src": { | |
"process": "SendX", | |
"port": "out" | |
}, | |
"tgt": { | |
"process": "mousex", | |
"port": "key" | |
}, | |
"metadata": { | |
"route": 6 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mouse", | |
"port": "event" | |
}, | |
"tgt": { | |
"process": "SendX", | |
"port": "in" | |
}, | |
"metadata": { | |
"route": 5 | |
} | |
}, | |
{ | |
"src": { | |
"process": "mouse", | |
"port": "event" | |
}, | |
"tgt": { | |
"process": "SendY", | |
"port": "in" | |
}, | |
"metadata": { | |
"route": 5 | |
} | |
}, | |
{ | |
"data": "#canvas", | |
"tgt": { | |
"process": "canvas", | |
"port": "selector" | |
} | |
}, | |
{ | |
"data": "mousemove", | |
"tgt": { | |
"process": "mouse", | |
"port": "type" | |
} | |
}, | |
{ | |
"data": true, | |
"tgt": { | |
"process": "draw", | |
"port": "drawevery" | |
} | |
}, | |
{ | |
"data": 10, | |
"tgt": { | |
"process": "circle", | |
"port": "radius" | |
} | |
}, | |
{ | |
"data": "#fff", | |
"tgt": { | |
"process": "stroke", | |
"port": "strokestyle" | |
} | |
}, | |
{ | |
"data": 2, | |
"tgt": { | |
"process": "stroke", | |
"port": "linewidth" | |
} | |
}, | |
{ | |
"data": 100, | |
"tgt": { | |
"process": "color", | |
"port": "saturation" | |
} | |
}, | |
{ | |
"data": 80, | |
"tgt": { | |
"process": "color", | |
"port": "lightness" | |
} | |
}, | |
{ | |
"data": 200, | |
"tgt": { | |
"process": "color", | |
"port": "hue" | |
} | |
}, | |
{ | |
"data": 0.1, | |
"tgt": { | |
"process": "color", | |
"port": "alpha" | |
} | |
}, | |
{ | |
"data": false, | |
"tgt": { | |
"process": "draw", | |
"port": "clearevery" | |
} | |
}, | |
{ | |
"data": "sine", | |
"tgt": { | |
"process": "sinusoid", | |
"port": "waveform" | |
} | |
}, | |
{ | |
"data": 0, | |
"tgt": { | |
"process": "sinusoid", | |
"port": "start" | |
} | |
}, | |
{ | |
"data": 200, | |
"tgt": { | |
"process": "div_6bct0", | |
"port": "divisor" | |
} | |
}, | |
{ | |
"data": 1000, | |
"tgt": { | |
"process": "mul", | |
"port": "multiplier" | |
} | |
}, | |
{ | |
"data": "clientY", | |
"tgt": { | |
"process": "SendY", | |
"port": "string" | |
} | |
}, | |
{ | |
"data": "clientX", | |
"tgt": { | |
"process": "SendX", | |
"port": "string" | |
} | |
}, | |
{ | |
"data": "5", | |
"tgt": { | |
"process": "div_m0ubq", | |
"port": "divisor" | |
} | |
}, | |
{ | |
"data": false, | |
"tgt": { | |
"process": "mousey", | |
"port": "sendgroup" | |
} | |
}, | |
{ | |
"data": false, | |
"tgt": { | |
"process": "mousex", | |
"port": "sendgroup" | |
} | |
}, | |
{ | |
"data": "200", | |
"tgt": { | |
"process": "div", | |
"port": "divisor" | |
} | |
} | |
] | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment