Last active
November 5, 2017 16:59
-
-
Save eeropic/49fe897f39825f807b450147e2ee2383 to your computer and use it in GitHub Desktop.
tone-nodes2.js
This file contains hidden or 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
| //SVG.JS NEXUS UI TONE.JS WEBMIDI.JS | |
| include('https://cdnjs.cloudflare.com/ajax/libs/svg.js/2.6.3/svg.min.js'); | |
| include('http://eerojohannes.com/js/NexusUI.js') | |
| include('http://eerojohannes.com/js/svg.panzoom.min.js') | |
| include('https://cdnjs.cloudflare.com/ajax/libs/tone/0.12.7/Tone.min.js') | |
| include('http://eerojohannes.com/js/webmidi.min.js') | |
| $('.right_panel').prepend('<div id="root"></div>') | |
| $('<style>svg text{user-select:none;pointer-events:none;cursor:initial}.node{cursor:move}.inlet, .outlet { opacity:0.7 } .inlet:hover, .outlet:hover { opacity:1.0; cursor:e-resize }</style>').appendTo('body'); | |
| var nodeColors={'audio':"#777777",'control':"#CCCCCC",} | |
| var oscillatorTypes=["sine","triangle","square","sawtooth"] | |
| Nexus.Sequencer.prototype.noteScale=[] | |
| Nexus.Dial.prototype.plug=function(target){ | |
| if(target._sourceType=="Oscillator"){ | |
| this.on('change',function(v){ | |
| target.type=oscillatorTypes[Math.min(Math.max(0,Math.floor(v)),3)] | |
| }) | |
| } | |
| else if(target=="pitch"){ | |
| this.on('change',function(v){ | |
| target=v | |
| }) | |
| } | |
| else { | |
| this.on('change',function(v){ | |
| target.value=v | |
| }) | |
| } | |
| } | |
| Nexus.RadioButton.prototype.plug=function(target){ | |
| this.on('change',function(v){ | |
| if(target=="Synth"){ | |
| if(target.oscillator._sourceType=="Oscillator"){ | |
| target.oscillator.type=oscillatorTypes[Math.min(Math.max(0,Math.floor(v)),3)] | |
| } | |
| } | |
| }) | |
| } | |
| Nexus.Piano.prototype.plug=function(target){ | |
| if(target.type=="Sequencer"){ | |
| this.on('change',function(v){ | |
| var arr=[] | |
| for(var i=0;i<this.keys.length;i++){ | |
| if(this.keys[i]._state.state){ | |
| arr.push(i+this.keys[0].note) | |
| } | |
| } | |
| target.noteScale=arr; | |
| }) | |
| } | |
| if(target=="Synth" || target=="MembraneSynth"){ | |
| this.on('change',function(v){ | |
| if(v.state){target.triggerAttack(Tone.Frequency(v.note, "midi").toNote())} | |
| if(!v.state){target.triggerRelease()} | |
| }) | |
| } | |
| if(target=="Oscillator"){ | |
| this.on('change',function(v){ | |
| if(v.state){ | |
| target.start(); | |
| target.frequency.value=Tone.Frequency(v.note, "midi") | |
| } | |
| if(!v.state){ | |
| target.stop() | |
| } | |
| }) | |
| } | |
| } | |
| Nexus.Sequencer.prototype.plug=function(target,prop){ | |
| if(target=="Synth"){ | |
| this.on('step',function(v) { | |
| var release=true; | |
| for(var i=0;i<v.length;i++){ | |
| if(v[i]){ | |
| if(this.noteScale.length!=0)var note=this.noteScale[Math.min(i,this.noteScale.length-1)] | |
| else note=i; | |
| target.triggerAttack(Tone.Frequency(note, "midi").toNote()); | |
| release=false; | |
| }} | |
| if(release){target.triggerRelease()} | |
| }) | |
| } | |
| else if(target.type=="RadioButton"){ | |
| this.on('step',function(v) { | |
| for(var i=0;i<v.length;i++){ | |
| if(v[i]){ | |
| target.select(Math.min(i,target.numberOfButtons)); | |
| }} | |
| }) | |
| } | |
| } | |
| Nexus.Slider.prototype.plug=function(target,prop){ | |
| if(prop=="bits"){ | |
| this.on('change',function(v){ | |
| target[prop]=v | |
| }) | |
| } | |
| else if(prop=="pitch"){ | |
| this.on('change',function(v){ | |
| target[prop]=v | |
| }) | |
| } | |
| else if(prop=="rows" || prop=="columns"){ | |
| this.on('change',function(v){ | |
| target[prop]=v | |
| }) | |
| } | |
| else{ | |
| target.value=v; | |
| } | |
| } | |
| Nexus.Toggle.prototype.plug=function(target){ | |
| this.on('change',function(v){ | |
| if(target.type=="Sequencer"){ | |
| if(v)target.start(); | |
| else target.stop(); | |
| } | |
| }) | |
| } | |
| Nexus.Multislider.prototype.plug=function(target,prop){ | |
| this.on('change',function(v){ | |
| if(target=="Synth"){ | |
| if(v.index==0)target.envelope.attack=v.value | |
| if(v.index==1)target.envelope.decay=v.value | |
| if(v.index==2)target.envelope.sustain=v.value | |
| if(v.index==3)target.envelope.release=v.value | |
| } | |
| if(prop=="partials"){ | |
| target[prop]=this.values | |
| } | |
| }) | |
| } | |
| Nexus.Dial.prototype.unplug=function(){this.removeAllListeners();} | |
| Nexus.RadioButton.prototype.unplug=function(){this.removeAllListeners();} | |
| Nexus.Sequencer.prototype.unplug=function(){this.removeAllListeners()} | |
| Nexus.Slider.prototype.unplug=function(){this.removeAllListeners()} | |
| Nexus.Toggle.prototype.unplug=function(){this.removeAllListeners()} | |
| Nexus.Multislider.prototype.unplug=function(){this.removeAllListeners()} | |
| Nexus.Piano.prototype.unplug=function(){this.removeAllListeners()} | |
| const letWidth=10 | |
| const letHeight=20 | |
| const nodeWidth=120 | |
| const nodeHeight=80 | |
| const gridSize=10 | |
| const minTangent=20 | |
| var nodeCount=0 | |
| var connectionCount=0 | |
| var inletCount=0 | |
| var outletCount=0 | |
| var letCount=0 | |
| var root = SVG('root').size(1000, 700) | |
| root.attr('id','svgroot') | |
| root.addClass('root') | |
| root.mode='pointer' | |
| root.connecting=false | |
| root.draggedNode=null | |
| root.connectionSource=null | |
| root.connectionTarget=null | |
| root.currentConnections=null | |
| root.connections=[] | |
| root.nodes=[] | |
| root.updateNodeNexus=function(node){ | |
| //console.log(node) | |
| var nodeSVG=SVG.get(node.id) | |
| $(node.nexus.parent).css({'position':'absolute','left':nodeSVG.x()+letWidth,'top':nodeSVG.y()+letHeight*1.5}) | |
| } | |
| root.getNode=function(id){ | |
| var result = this.nodes.filter(function(obj) { | |
| return obj.id == id; | |
| }); | |
| return result[0] | |
| } | |
| root.getNodeConnections=function(id){ | |
| var result = this.connections.filter(function(obj) { | |
| return obj.src.id == id || obj.tgt.id == id; | |
| }); | |
| return result | |
| } | |
| root.getPortConnections=function(id){ | |
| var result = this.connections.filter(function(obj) { | |
| return obj.src.port == id || obj.tgt.port == id; | |
| }); | |
| return result | |
| } | |
| root.routeConnections=function(connections,eventTarget,isTarget){ | |
| var self=this; | |
| for(var i=0;i<connections.length;i++){ | |
| var connection=connections[i] | |
| var index=self.connections.map(function(e){return e.id}).indexOf(connection.id); | |
| var prevSourceNode=root.getNode(self.connections[index].src.id) | |
| var prevTargetNode=root.getNode(self.connections[index].tgt.id) | |
| if(!isTarget){ | |
| self.connections[index].src.id=eventTarget.ownerSVGElement.id; | |
| self.connections[index].src.port=eventTarget.id | |
| var sourceNode=root.getNode(self.connections[index].src.id) | |
| //tone -> tone | |
| if(sourceNode.tone!=null && prevSourceNode.tone!=null && prevTargetNode.tone!=null){ | |
| prevSourceNode.tone.disconnect(prevTargetNode.tone) | |
| sourceNode.tone.connect(prevTargetNode.tone) | |
| } | |
| //nexus -> tone | |
| if(prevSourceNode.nexus!=null && prevTargetNode.tone!=null && sourceNode.tone!=null){ | |
| prevSourceNode.nexus.unplug(); | |
| sourceNode.nexus.plug(prevTargetNode.tone) | |
| } | |
| //nexus -> nexus | |
| if(prevSourceNode.nexus!=null && sourceNode.nexus!=null && prevTargetNode.nexus!=null){ | |
| prevSourceNode.nexus.unplug(); | |
| sourceNode.nexus.plug(prevTargetNode.nexus) | |
| } | |
| } | |
| else{ | |
| self.connections[index].tgt.id=eventTarget.ownerSVGElement.id; | |
| self.connections[index].tgt.port=eventTarget.id | |
| var targetNode=root.getNode(self.connections[index].tgt.id) | |
| //tone -> tone | |
| if(prevSourceNode.tone!=null && prevTargetNode.tone!=null && targetNode.tone!=null){ | |
| prevSourceNode.tone.disconnect(prevTargetNode.tone) | |
| prevSourceNode.tone.connect(targetNode.tone) | |
| } | |
| //nexus -> tone | |
| if(prevSourceNode.nexus!=null && prevTargetNode.tone!=null && targetNode.tone!=null){ | |
| prevSourceNode.nexus.unplug(); | |
| prevSourceNode.nexus.plug(targetNode.tone) | |
| } | |
| //nexus -> nexus | |
| if(prevSourceNode.nexus!=null && prevTargetNode.nexus!=null && targetNode.nexus!=null){ | |
| prevSourceNode.nexus.unplug(); | |
| prevSourceNode.nexus.plug(targetNode.nexus) | |
| } | |
| } | |
| self.modifyConnectionSVG(connection) | |
| } | |
| } | |
| root.removeConnections=function(connections){ | |
| var self=this | |
| var removeConnections=[] | |
| //get connections to be removed and sort the indices in a list | |
| for(var j=0;j<connections.length;j++){ | |
| var connection=connections[j] | |
| var sourceNode=root.getNode(connections[j].src.id) | |
| var targetNode=root.getNode(connections[j].tgt.id) | |
| //tone -> tone | |
| if(sourceNode.tone!=null && targetNode.tone!=null){ | |
| sourceNode.tone.disconnect(targetNode.tone) | |
| } | |
| //nexus -> tone | |
| if(sourceNode.nexus!=null && targetNode.tone!=null){ | |
| sourceNode.nexus.unplug(); | |
| } | |
| //nexus -> nexus | |
| if(sourceNode.nexus!=null && targetNode.nexus!=null){ | |
| sourceNode.nexus.unplug(); | |
| } | |
| var removeConnection=self.connections.map(function(e){return e.id}).indexOf(connection.id); | |
| removeConnections.push(removeConnection) | |
| } | |
| removeConnections.sort(function(a,b){return a-b;}) | |
| for(var i=removeConnections.length-1;i>=0;i--){ | |
| SVG.get(self.connections[removeConnections[i]].id).remove(); | |
| self.connections.splice(removeConnections[i],1) | |
| } | |
| } | |
| root.mousedown(function(e){ | |
| var self = this; | |
| var mX=(e.x-$('.right_panel').offset().left) | |
| var mY=(e.y-$('.right_panel').offset().top) | |
| var targets = { | |
| root(){ | |
| self.mode='pointer' | |
| }, | |
| node(){ | |
| console.log(root.getNode(e.target.ownerSVGElement.id)) | |
| self.mode='dragNode' | |
| self.hitNode=SVG.get(e.target.ownerSVGElement.id); | |
| self.hitNode.front(); | |
| self.hitPos={x:mX-self.hitNode.cx(),y:mY-self.hitNode.cy()} | |
| self.currentConnections=self.getNodeConnections(self.hitNode.node.id) | |
| console.log(root.connections) | |
| var nodeObj=root.getNode(self.hitNode.node.id); | |
| //console.log('t '+nodeObj.nexus.type) | |
| if(nodeObj.nexus!=null){ | |
| //if(nodeObj.nexus.type!='Dial'){ | |
| $(nodeObj.nexus.parent).css('pointer-events','none') | |
| //} | |
| } | |
| }, | |
| inlet(){ | |
| console.log(SVG.get(e.target.id).data('type')) | |
| var connections=self.getPortConnections(e.target.id) | |
| if(connections.length==0){ | |
| self.mode='connectFromInlet' | |
| root.fire('createConnection',{element:e.target}) | |
| } | |
| else{ | |
| if(!e.shiftKey){ | |
| self.currentConnections=connections | |
| self.mode='routeInlet' | |
| } | |
| if(e.shiftKey){ | |
| self.mode='connectFromInlet' | |
| root.fire('createConnection',{element:e.target}) | |
| } | |
| } | |
| }, | |
| outlet(){ | |
| var connections=self.getPortConnections(e.target.id) | |
| if(connections.length==0){ | |
| self.mode='connectFromOutlet' | |
| root.fire('createConnection',{element:e.target}) | |
| } | |
| else{ | |
| if(!e.shiftKey){ | |
| self.currentConnections=connections | |
| self.mode='routeOutlet' | |
| } | |
| if(e.shiftKey){ | |
| self.mode='connectFromOutlet' | |
| root.fire('createConnection',{element:e.target}) | |
| } | |
| } | |
| } | |
| } | |
| return targets[e.target.getAttribute("class") || 'root']() | |
| }) | |
| root.mousemove(function(e){ | |
| var self=this; | |
| var mX=(e.x-$('.right_panel').offset().left) | |
| var mY=(e.y-$('.right_panel').offset().top) | |
| var modes = { | |
| pointer(){ | |
| }, | |
| dragNode(){ | |
| var fX=Math.floor((mX-self.hitPos.x)/gridSize)*gridSize | |
| var fY=Math.floor((mY-self.hitPos.y)/gridSize)*gridSize | |
| self.hitNode.center(fX,fY) | |
| var node=root.getNode(self.hitNode.node.id); | |
| if(node.nexus!=null){ | |
| //if(node.nexus.type!='Dial'){ | |
| $(node.nexus.parent).css({'position':'absolute','left':fX+letWidth,'top':fY+letHeight*1.5}) | |
| //} | |
| } | |
| if(self.currentConnections.length>0){ | |
| for(var i=0;i<self.currentConnections.length;i++){ | |
| var connection=self.currentConnections[i] | |
| if( connection.src.id == self.hitNode.node.id || | |
| connection.tgt.id == self.hitNode.node.id){ | |
| self.modifyConnectionSVG(connection) | |
| } | |
| } | |
| } | |
| }, | |
| connectFromInlet(){ | |
| self.connectionSVG.attr('d', | |
| root.createConnectionStr( | |
| mX,mY, | |
| self.connectionSourcePort.attr('x')+self.connectionSource.attr('x'), | |
| self.connectionSourcePort.attr('y')+self.connectionSource.attr('y')+letHeight/2)) | |
| }, | |
| connectFromOutlet(){ | |
| self.connectionSVG.attr('d', | |
| root.createConnectionStr( | |
| self.connectionSourcePort.attr('x')+self.connectionSource.attr('x'), | |
| self.connectionSourcePort.attr('y')+self.connectionSource.attr('y')+letHeight/2, | |
| mX,mY)) | |
| }, | |
| routeOutlet(){ | |
| //console.log('routing outlet') | |
| for(var i=0;i<self.currentConnections.length;i++){ | |
| var connection=SVG.get(self.currentConnections[i].id) | |
| var connectionNode=SVG.get(self.currentConnections[i].tgt.id) | |
| var connectionPort=SVG.get(self.currentConnections[i].tgt.port) | |
| //console.log('cn x '+connectionNode.attr('x')) | |
| connection.attr('d', | |
| root.createConnectionStr( | |
| mX,mY, | |
| connectionNode.attr('x')+connectionPort.attr('x'), | |
| connectionNode.attr('y')+connectionPort.attr('y')+letHeight/2)) | |
| } | |
| }, | |
| routeInlet(){ | |
| //console.log('routing inlet') | |
| for(var i=0;i<self.currentConnections.length;i++){ | |
| var connection=SVG.get(self.currentConnections[i].id) | |
| var connectionNode=SVG.get(self.currentConnections[i].src.id) | |
| var connectionPort=SVG.get(self.currentConnections[i].src.port) | |
| //console.log('cn x '+connectionNode.attr('x')) | |
| connection.attr('d', | |
| root.createConnectionStr( | |
| mX,mY, | |
| connectionNode.attr('x')+connectionPort.attr('x'), | |
| connectionNode.attr('y')+connectionPort.attr('y')+letHeight/2)) | |
| } | |
| } | |
| } | |
| return modes[this.mode || 'pointer']() | |
| }) | |
| root.mouseup(function(e){ | |
| var self=this; | |
| var targetClass=e.target.getAttribute("class"); | |
| var targetID=e.target.getAttribute("id") | |
| var targetSVG=SVG.get(targetID) | |
| var modes = { | |
| pointer(){ | |
| }, | |
| dragNode(){ | |
| var nodeObj=root.getNode(self.hitNode.node.id); | |
| if(nodeObj.nexus!=null){ | |
| $(nodeObj.nexus.parent).css('pointer-events','auto') | |
| } | |
| }, | |
| connectFromInlet(){ | |
| if(targetClass=='outlet'){ | |
| var connection={ | |
| id:self.connectionSVG.node.id, | |
| src:{ | |
| id:e.target.ownerSVGElement.id, | |
| port:targetID | |
| }, | |
| tgt:{ | |
| id:self.connectionSource.node.id, | |
| port:self.connectionSourcePort | |
| } | |
| } | |
| var sourceNode=root.getNode(e.target.ownerSVGElement.id) | |
| var targetNode=root.getNode(self.connectionSource.node.id) | |
| //tone -> tone object | |
| if(sourceNode.tone!=null && targetNode.tone!=null){ | |
| sourceNode.tone.connect(targetNode.tone) | |
| } | |
| //nexus -> tone object | |
| else if(sourceNode.nexus!=null && targetNode.tone!=null){ | |
| sourceNode.nexus.plug(targetNode.tone) | |
| } | |
| //nexus -> nexus object | |
| else if(sourceNode.nexus!=null && targetNode.nexus!=null){ | |
| sourceNode.nexus.plug(targetNode.nexus) | |
| } | |
| self.connections.push(connection) | |
| self.modifyConnectionSVG(connection) | |
| } | |
| else{ | |
| self.connectionSVG.remove(); | |
| } | |
| }, | |
| connectFromOutlet(){ | |
| if(targetClass=='inlet'){ | |
| var connection={ | |
| id:self.connectionSVG.node.id, | |
| src:{ | |
| id:self.connectionSource.node.id, | |
| port:self.connectionSourcePort | |
| }, | |
| tgt:{ | |
| id:e.target.ownerSVGElement.id, | |
| port:targetID | |
| } | |
| } | |
| var sourceNode=root.getNode(self.connectionSource.node.id) | |
| var targetNode=root.getNode(e.target.ownerSVGElement.id) | |
| //tone -> tone object | |
| if(sourceNode.tone!=null && targetNode.tone!=null){ | |
| sourceNode.tone.connect(targetNode.tone) | |
| } | |
| //nexus -> tone object | |
| else if(sourceNode.nexus!=null && targetNode.tone!=null){ | |
| sourceNode.nexus.plug(targetNode.tone,targetSVG.data('type')) } | |
| //nexus -> nexus object | |
| else if(sourceNode.nexus!=null && targetNode.nexus!=null){ | |
| sourceNode.nexus.plug(targetNode.nexus,targetSVG.data('type')) | |
| } | |
| self.connections.push(connection) | |
| self.modifyConnectionSVG(connection) | |
| } | |
| else{ | |
| self.connectionSVG.remove(); | |
| } | |
| }, | |
| routeOutlet(){ | |
| if(targetClass=='outlet')self.routeConnections(self.currentConnections,e.target,false) | |
| else { | |
| self.removeConnections(self.currentConnections) | |
| } | |
| }, | |
| routeInlet(){ | |
| if(targetClass=='inlet')self.routeConnections(self.currentConnections,e.target,true) | |
| else{ | |
| self.removeConnections(self.currentConnections) | |
| } | |
| } | |
| } | |
| modes[this.mode || 'pointer']() | |
| this.mode='pointer' | |
| this.currentConnections=null | |
| }) | |
| root.createConnectionStr=function(x1,y1,x2,y2){ | |
| var dist=(x2-x1)/3; | |
| var c=Math.max(minTangent,dist) | |
| //console.log('x1 '+x1+'x2 '+x2+'c '+c+' mint '+minTangent+' dist '+dist) | |
| var str='M'+x1+','+y1+' C'+(x1+c)+','+y1+' '+(x2-c)+','+y2+' '+x2+','+y2; | |
| //console.log(str) | |
| return str | |
| } | |
| root.modifyConnectionSVG=function(connection){ | |
| var obj=SVG.get(connection.id); | |
| var inlet=SVG.get(connection.tgt.port); | |
| var outlet=SVG.get(connection.src.port); | |
| var src=SVG.get(connection.src.id); | |
| var tgt=SVG.get(connection.tgt.id); | |
| var dist=( (tgt.x()+inlet.x())-(src.x()+outlet.x()) )/3; | |
| var c=Math.max(minTangent,dist) | |
| var str=obj.attr('d'); | |
| var data=str.split(" "); | |
| var srcX=src.x()+outlet.x()+letWidth | |
| var srcY=src.y()+outlet.y()+letHeight/2 | |
| var tgtX=tgt.x()+inlet.x() | |
| var tgtY=tgt.y()+inlet.y()+letHeight/2 | |
| data[0]='M'+srcX+','+srcY; | |
| data[1]='C'+(srcX+c)+','+srcY; | |
| data[2]=''+(tgtX-c)+','+tgtY; | |
| data[3]=''+tgtX+','+tgtY; | |
| var modified=data.join(" ") | |
| obj.attr('d',modified) | |
| } | |
| root.on('createConnection', function(e) { | |
| var elem=SVG.get(e.detail.element.id); | |
| var node=SVG.get(e.detail.element.ownerSVGElement.id) | |
| this.connectionSource=node; | |
| this.connectionSourcePort=elem; | |
| this.connectionSVG=root.path( | |
| root.createConnectionStr( | |
| node.attr('x')+elem.attr('x'),node.attr('y')+elem.attr('y'), | |
| node.attr('x')+elem.attr('x'),node.attr('y')+elem.attr('y')) | |
| ) | |
| this.connectionSVG.attr({'stroke':'#999','stroke-width':2,'fill':"none"}) | |
| this.connectionSVG.attr('id','connection'+connectionCount) | |
| this.connectionSVG.back(); | |
| connectionCount+=1 | |
| }) | |
| function Node(options){ | |
| //w,h,inlets,outlets,name | |
| var inlets = options.inlets || [] | |
| var outlets = options.outlets || [] | |
| var x = options.position[0] || 0 | |
| var y = options.position[1] || 0 | |
| var w = options.size[0] || nodeWidth | |
| var h = options.size[1] || nodeHeight | |
| var h = Math.max(h,(Math.max(inlets.length,outlets.length)+1)*letHeight) | |
| var name = options.name || 'node'+nodeCount; | |
| var nodeId=name+nodeCount; | |
| this.node={id:nodeId,inlets:[],outlets:[]} | |
| this.nodeSVG = root.nested(); | |
| this.nodeSVG.attr('id',nodeId) | |
| var nodeSVG=this.nodeSVG; | |
| this.rect = nodeSVG.rect(w, h).radius(10).attr({fill:'#FEFEFE',stroke:'#777','fill-opacity':0.7}) | |
| this.rect.addClass('node') | |
| this.text = nodeSVG.text(name).move(letWidth*2,letWidth) | |
| this.text.attr('fill-opacity',1) | |
| for(var i=0;i<inlets.length;i++){ | |
| this.inlets=this.nodeSVG.group() | |
| if(inlets[i]=='audio' || inlets[i]=='control')var col=nodeColors[inlets[i]] | |
| else var col=nodeColors['control'] | |
| this.inlet=this.inlets.rect(letWidth,letHeight) | |
| .radius(2).move(0,letHeight/2) | |
| .attr({y:letHeight*(i+0.5),fill:col,stroke:'#777'}) | |
| var id=inlets[i]+letCount; | |
| this.inlet.attr('id',id) | |
| this.inlet.data('type', inlets[i]) | |
| this.inlet.addClass('inlet') | |
| this.inlets.element('title').words(inlets[i]); | |
| this.node.inlets.push(id) | |
| letCount+=1; | |
| } | |
| for(var i=0;i<outlets.length;i++){ | |
| this.outlets=this.nodeSVG.group() | |
| if(nodeColors[outlets[i]]=='audio' || nodeColors[outlets[i]]=='control')var col=nodeColors[outlets[i]] | |
| else var col=nodeColors['control'] | |
| this.outlet=this.outlets.rect(letWidth,letHeight) | |
| .radius(2).move(w-letWidth,letHeight/2) | |
| .attr({y:letHeight*(i+0.5),fill:nodeColors[outlets[i]],stroke:'#777'}) | |
| var id=outlets[i]+letCount; | |
| this.outlet.attr('id',id) | |
| this.outlet.data('type', inlets[i]) | |
| this.outlet.addClass('outlet') | |
| this.outlets.element('title').words(outlets[i]); | |
| this.node.outlets.push(id) | |
| letCount+=1; | |
| } | |
| root.nodes.push(this.node) | |
| this.nodeSVG.move(x,y) | |
| nodeCount+=1; | |
| } | |
| root.getToneParent=function(obj,lvl){ | |
| var self=this | |
| //console.log(obj.__proto__) | |
| var toneType=null | |
| if(obj.__proto__!="Tone"){ | |
| if(obj.__proto__=="Effect"){ | |
| return obj.__proto__.toString() | |
| } | |
| else if(obj.__proto__=="Instrument"){ | |
| return obj.__proto__.toString() | |
| } | |
| else if(obj.__proto__=="SignalBase"){ | |
| return obj.__proto__.toString() | |
| } | |
| else if(obj.__proto__=="Source"){ | |
| return obj.__proto__.toString() | |
| } | |
| else if(obj.__proto__=="AudioNode"){ | |
| return obj.__proto__.toString() | |
| } | |
| else { | |
| return self.getToneParent(obj.__proto__) | |
| } | |
| } | |
| } | |
| root.addTone=function(obj){ | |
| var self=this; | |
| var toneTypes = { | |
| Effect(toneObj){ | |
| var node=new Node({size:[80,80] | |
| , position:[Math.random()*500 | |
| , Math.random()*500] | |
| , inlets:['audio'].concat(Object.keys(toneObj.defaults)) | |
| , outlets:['audio'] | |
| , name:obj}) | |
| return node | |
| }, | |
| Instrument(toneObj){ | |
| var node=new Node({size:[80,80] | |
| , position:[Math.random()*500 | |
| , Math.random()*500] | |
| , inlets:['control'].concat(Object.keys(toneObj.defaults)) | |
| , outlets:['audio'] | |
| , name:obj}) | |
| return node | |
| }, | |
| SignalBase(toneObj){ | |
| var node=new Node({size:[80,80] | |
| , position:[Math.random()*500 | |
| , Math.random()*500] | |
| , inlets:['audio'] | |
| , outlets:['audio'] | |
| , name:obj}) | |
| return node | |
| }, | |
| Source(toneObj){ | |
| var node=new Node({size:[80,80] | |
| , position:[Math.random()*500 | |
| , Math.random()*500] | |
| , inlets:Object.keys(toneObj.defaults) | |
| , outlets:['audio'] | |
| , name:obj}) | |
| return node | |
| }, | |
| AudioNode(toneObj){ | |
| var node=new Node({size:[80,80] | |
| , position:[Math.random()*500 | |
| , Math.random()*500] | |
| , inlets:['audio'].concat(Object.keys(toneObj.defaults)) | |
| , outlets:['audio'] | |
| , name:obj}) | |
| return node | |
| }, | |
| Master(toneObj){ | |
| var node=new Node({size:[80,80] | |
| , position:[Math.random()*500 | |
| , Math.random()*500] | |
| , inlets:['audio'] | |
| , outlets:[] | |
| , name:obj}) | |
| return node | |
| }, | |
| } | |
| if(obj=='Master'){ | |
| var toneObj = Tone.Master | |
| var toneNode = toneTypes['Master'](Tone[obj]) | |
| toneNode.node.tone=toneObj; | |
| return toneNode | |
| } | |
| else { | |
| var toneObj = new Tone[obj] | |
| var toneType=self.getToneParent(toneObj) | |
| var toneNode = toneTypes[toneType](Tone[obj]) | |
| toneNode.node.tone=toneObj; | |
| return toneNode | |
| } | |
| } | |
| root.addNexus=function(obj,options){ | |
| var self=this; | |
| if(arguments.length==1){ | |
| var inlets=['control'] | |
| var outlets=['control'] | |
| var size=[80,80] | |
| } | |
| else{ | |
| var inlets=options.inlets || ['control'] | |
| var outlets=options.outlets || ['control'] | |
| var size=[options.size[0],options.size[1]] | |
| } | |
| var nodeObj=new Node({size:[size[0]+40,size[1]+40] | |
| , position:[Math.random()*500 | |
| , Math.random()*500] | |
| , inlets:inlets | |
| , outlets:outlets | |
| , name:obj}) | |
| //console.log(' ') | |
| if(obj=='Dial'){ | |
| var nexusObj=Nexus.Add[obj]('root',{ | |
| position:[0,0], | |
| min:0, | |
| max:1, | |
| interaction:'vertical', | |
| size:[40,40], | |
| id:'diali2'}) | |
| } | |
| if(obj=='Multislider'){ | |
| var nexusObj = Nexus.Add.Multislider('root',{ | |
| 'size': [100,80], | |
| 'numberOfSliders': 4, | |
| 'min': 0, | |
| 'max': 1, | |
| 'step': 0, | |
| 'values': [0.05,0.4,1,0.4] | |
| }) | |
| } | |
| if(obj=='Sequencer'){ | |
| var nexusObj = Nexus.Add.Sequencer('root',{ | |
| rows:options.rows, | |
| columns:options.columns, | |
| size:options.size | |
| }) | |
| nexusObj.start() | |
| nexusObj.interval.ms(150) | |
| } | |
| if(obj=='Piano'){ | |
| var nexusObj = Nexus.Add.Piano('root',{ | |
| lowNote:options.lowNote, | |
| highNote:options.highNote, | |
| size:options.size, | |
| mode:options.mode || 'button' | |
| }) | |
| } | |
| if(obj=='Slider'){ | |
| var nexusObj = Nexus.Add.Slider('root',{ | |
| 'size': size, | |
| 'mode': 'absolute', // 'relative' or 'absolute' | |
| 'min': 1, | |
| 'max': 8, | |
| 'step': 1, | |
| 'value': 1 | |
| }) | |
| } | |
| if(obj=='Select'){ | |
| var nexusObj = Nexus.Add.Select('root',{ | |
| 'size': size, | |
| 'options': options.options | |
| }) | |
| } | |
| if(obj=='Number'){ | |
| var nexusObj = Nexus.Add.Number('root',{ | |
| 'size': size, | |
| }) | |
| } | |
| nodeObj.node.nexus=nexusObj | |
| root.updateNodeNexus(nodeObj.node) | |
| return nodeObj | |
| } | |
| root.addTone('Master') | |
| root.addTone('Freeverb') | |
| root.addTone('Synth') | |
| root.addTone('EQ3') | |
| root.addTone('Pow') | |
| var osc=root.addTone('Oscillator') | |
| osc.node.tone.start() | |
| root.addTone('PitchShift') | |
| var bit=root.addTone('BitCrusher') | |
| root.addNexus('Dial', {size:[40,40]}) | |
| root.addNexus('Select', {size:[100,40],options:['test1','test2']}) | |
| root.addNexus('Multislider', {size:[80,80]}) | |
| root.addNexus('Slider', {size:[20,120]}) | |
| root.addNexus('Number', {size:[40,20]}) | |
| var seq=root.addNexus('Sequencer',{size:[240,240],rows:8,columns:8,position:[300,140],inlets:['control','rows','columns'],outlets:['control'],name:'Seq'}) | |
| var piano=root.addNexus('Piano',{size:[200,80],lowNote:36,highNote:60,mode:'toggle',inlets:['control'],outlets:['control'],name:'Pianolainen'}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment