Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-01-26 19:09:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

fixes in drop

Browse Source
This commit is contained in:
tamat
2016-10-04 17:45:50 +02:00
parent 01fe7011bd
commit 21323a1009
13 changed files with 1049 additions and 1145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

715
build/litegraph.js
View File

@@ -45,6 +45,7 @@ var LiteGraph = {
debug: false,
throw_errors: true,
registered_node_types: {}, //nodetypes by string
node_types_by_file_extension: {}, //used for droping files in the canvas
Nodes: {}, //node types by classname
/**
@@ -82,6 +83,12 @@ var LiteGraph = {
//warnings
if(base_class.prototype.onPropertyChange)
console.warn("LiteGraph node class " + type + " has onPropertyChange method, it must be called onPropertyChanged with d at the end");
if( base_class.supported_extensions )
{
for(var i in base_class.supported_extensions )
this.node_types_by_file_extension[ base_class.supported_extensions[i].toLowerCase() ] = base_class;
}
},
/**
@@ -120,8 +127,8 @@ var LiteGraph = {
title = title || base_class.title || type;
var node = new base_class( name );
node.type = type;
if(!node.title) node.title = title;
if(!node.properties) node.properties = {};
if(!node.properties_info) node.properties_info = [];
@@ -1186,7 +1193,15 @@ LGraph.prototype.configure = function(data, keep_old)
node.id = n_info.id; //id it or it will create a new id
this.add(node, true); //add before configure, otherwise configure cannot create links
node.configure(n_info);
}
//configure nodes afterwards so they can reach each other
for(var i = 0, l = nodes.length; i < l; ++i)
{
var n_info = nodes[i];
var node = this.getNodeById( n_info.id );
if(node)
node.configure( n_info );
}
this.updateExecutionOrder();
@@ -1194,6 +1209,27 @@ LGraph.prototype.configure = function(data, keep_old)
return error;
}
LGraph.prototype.load = function(url)
{
var that = this;
var req = new XMLHttpRequest();
req.open('GET', url, true);
req.send(null);
req.onload = function (oEvent) {
if(req.status !== 200)
{
console.error("Error loading graph:",req.status,req.response);
return;
}
var data = JSON.parse( req.response );
that.configure(data);
}
req.onerror = function(err)
{
console.error("Error loading graph:",err);
}
}
LGraph.prototype.onNodeTrace = function(node, msg, color)
{
//TODO
@@ -1332,7 +1368,26 @@ LGraphNode.prototype.configure = function(info)
}
if(this.onConnectionsChange)
this.onConnectionsChange();
{
if(this.inputs)
for(var i = 0; i < this.inputs.length; ++i)
{
var input = this.inputs[i];
var link_info = this.graph.links[ input.link ];
this.onConnectionsChange( LiteGraph.INPUT, i, true, link_info ); //link_info has been created now, so its updated
}
if(this.outputs)
for(var i = 0; i < this.outputs.length; ++i)
{
var output = this.outputs[i];
for(var j = 0; j < output.links.length; ++j)
{
var link_info = this.graph.links[ output.links[j] ];
this.onConnectionsChange( LiteGraph.OUTPUT, i, true, link_info ); //link_info has been created now, so its updated
}
}
}
//FOR LEGACY, PLEASE REMOVE ON NEXT VERSION
for(var i in this.inputs)
@@ -1555,7 +1610,10 @@ LGraphNode.prototype.getInputNode = function( slot )
var input = this.inputs[slot];
if(!input || !input.link)
return null;
return this.graph.getNodeById( input.link.origin_id );
var link_info = this.graph.links[ input.link ];
if(!link_info)
return null;
return this.graph.getNodeById( link_info.origin_id );
}
@@ -3448,8 +3506,11 @@ LGraphCanvas.prototype.processDrop = function(e)
if(!node)
{
var r = null;
if(this.onDropItem)
this.onDropItem( event );
r = this.onDropItem( event );
if(!r)
this.checkDropItem(e);
return;
}
@@ -3497,6 +3558,26 @@ LGraphCanvas.prototype.processDrop = function(e)
return false;
}
//called if the graph doesnt have a default drop item behaviour
LGraphCanvas.prototype.checkDropItem = function(e)
{
if(e.dataTransfer.files.length)
{
var file = e.dataTransfer.files[0];
var ext = LGraphCanvas.getFileExtension( file.name ).toLowerCase();
var nodetype = LiteGraph.node_types_by_file_extension[ext];
if(nodetype)
{
var node = LiteGraph.createNode( nodetype.type );
node.pos = [e.canvasX, e.canvasY];
this.graph.add( node );
if( node.onDropFile )
node.onDropFile( file );
}
}
}
LGraphCanvas.prototype.processNodeSelected = function(n,e)
{
n.selected = true;
@@ -7960,12 +8041,13 @@ GraphicsImage.title = "Image";
GraphicsImage.desc = "Image loader";
GraphicsImage.widgets = [{name:"load",text:"Load",type:"button"}];
GraphicsImage.supported_extensions = ["jpg","jpeg","png","gif"];
GraphicsImage.prototype.onAdded = function()
{
if(this.properties["url"] != "" && this.img == null)
{
this.loadImage(this.properties["url"]);
this.loadImage( this.properties["url"] );
}
}
@@ -7997,14 +8079,7 @@ GraphicsImage.prototype.onPropertyChanged = function(name,value)
return true;
}
GraphicsImage.prototype.onDropFile = function(file, filename)
{
var img = new Image();
img.src = file;
this.img = img;
}
GraphicsImage.prototype.loadImage = function(url)
GraphicsImage.prototype.loadImage = function( url, callback )
{
if(url == "")
{
@@ -8014,7 +8089,6 @@ GraphicsImage.prototype.loadImage = function(url)
this.img = document.createElement("img");
var url = name;
if(url.substr(0,7) == "http://")
{
if(LiteGraph.proxy) //proxy external files
@@ -8026,6 +8100,8 @@ GraphicsImage.prototype.loadImage = function(url)
var that = this;
this.img.onload = function()
{
if(callback)
callback(this);
that.trace("Image loaded, size: " + that.img.width + "x" + that.img.height );
this.dirty = true;
that.boxcolor = "#9F9";
@@ -8041,6 +8117,18 @@ GraphicsImage.prototype.onWidget = function(e,widget)
}
}
GraphicsImage.prototype.onDropFile = function(file)
{
var that = this;
if(this._url)
URL.revokeObjectURL( this._url );
this._url = URL.createObjectURL( file );
this.properties.url = this._url;
this.loadImage( this._url, function(img){
that.size[1] = (img.height / img.width) * that.size[0];
});
}
LiteGraph.registerNodeType("graphics/image", GraphicsImage);
@@ -8311,7 +8399,7 @@ LiteGraph.registerNodeType("graphics/imagefade", ImageFade);
function ImageCrop()
{
this.addInput("","image");
this.addOutputs("","image");
this.addOutput("","image");
this.properties = {width:256,height:256,x:0,y:0,scale:1.0 };
this.size = [50,20];
}
@@ -8334,7 +8422,8 @@ ImageCrop.prototype.createCanvas = function()
ImageCrop.prototype.onExecute = function()
{
var input = this.getInputData(0);
if(!input) return;
if(!input)
return;
if(input.width)
{
@@ -8347,6 +8436,14 @@ ImageCrop.prototype.onExecute = function()
this.setOutputData(0,null);
}
ImageCrop.prototype.onDrawBackground = function(ctx)
{
if(this.flags.collapsed)
return;
if(this.canvas)
ctx.drawImage( this.canvas, 0,0,this.canvas.width,this.canvas.height, 0,0, this.size[0], this.size[1] );
}
ImageCrop.prototype.onPropertyChanged = function(name,value)
{
this.properties[name] = value;
@@ -8368,7 +8465,7 @@ ImageCrop.prototype.onPropertyChanged = function(name,value)
return true;
}
LiteGraph.registerNodeType("graphics/cropImage", ImageFade );
LiteGraph.registerNodeType("graphics/cropImage", ImageCrop );
function ImageVideo()
@@ -11908,33 +12005,8 @@ function now() { return window.performance.now() }
(function( global )
{
function LGAudio()
{
this.properties = {
src: "demodata/audio.wav",
gain: 0.5,
loop: true
};
this._loading_audio = false;
this._audio_buffer = null;
this._audionodes = [];
this.addOutput( "out", "audio" );
this.addInput( "gain", "number" );
//init context
var context = LGAudio.getAudioContext();
//create gain node
this.audionode = context.createGain();
this.audionode.graphnode = this;
this.audionode.gain.value = this.properties.gain;
//debug
if(this.properties.src)
this.loadSound( this.properties.src );
}
var LGAudio = {};
global.LGAudio = LGAudio;
LGAudio.getAudioContext = function()
{
@@ -11960,128 +12032,94 @@ LGAudio.getAudioContext = function()
LGAudio.connect = function( audionodeA, audionodeB )
{
audionodeA.connect( audionodeB );
/*
if(!nodeA.outputs)
nodeA.outputs = [];
nodeA.outputs.push( nodeB );
if(!nodeB.inputs)
nodeB.inputs = [];
nodeB.inputs.push( nodeA );
*/
try
{
audionodeA.connect( audionodeB );
}
catch (err)
{
console.warn("LGraphAudio:",err);
}
}
LGAudio.disconnect = function( audionodeA, audionodeB )
{
audionodeA.disconnect( audionodeB );
/*
if(nodeA.outputs)
try
{
var index = nodeA.outputs.indexOf( nodeB );
if(index != -1)
nodeA.outputs.splice(index,1);
audionodeA.disconnect( audionodeB );
}
if(nodeB.inputs)
catch (err)
{
var index = nodeB.inputs.indexOf( nodeA );
if(index != -1)
nodeB.inputs.splice(index,1);
}
*/
}
LGAudio.prototype.onAdded = function(graph)
{
if(graph.status === LGraph.STATUS_RUNNING)
this.onStart();
}
LGAudio.prototype.onStart = function()
{
if(!this._audio_buffer)
return;
this.playBuffer( this._audio_buffer );
}
LGAudio.prototype.onStop = function()
{
this.stopAllSounds();
}
LGAudio.prototype.onRemoved = function()
{
this.stopAllSounds();
}
LGAudio.prototype.stopAllSounds = function()
{
//iterate and stop
for(var i = 0; i < this._audionodes.length; ++i )
{
this._audionodes[i].stop();
//this._audionodes[i].disconnect( this.audionode );
}
this._audionodes.length = 0;
}
LGAudio.prototype.onExecute = function()
{
var v = this.getInputData(0);
if( v !== undefined )
this.audionode.gain.value = v;
}
LGAudio.prototype.onAction = function(event)
{
if(this._audio_buffer)
{
if(event == "Play")
this.playBuffer(this._audio_buffer);
else if(event == "Stop")
this.stopAllSounds();
console.warn("LGraphAudio:",err);
}
}
LGAudio.prototype.onPropertyChanged = function( name, value )
LGAudio.changeAllAudiosConnections = function( node, connect )
{
if( name == "src" )
this.loadSound( value );
else if(name == "gain")
this.audionode.gain.value = value;
}
LGAudio.prototype.playBuffer = function( buffer )
{
var that = this;
var context = LGAudio.getAudioContext();
//create a new audionode (this is mandatory, AudioAPI doesnt like to reuse old ones)
var audionode = context.createBufferSource(); //create a AudioBufferSourceNode
audionode.graphnode = this;
audionode.buffer = buffer;
audionode.loop = this.properties.loop;
this._audionodes.push( audionode );
audionode.connect( this.audionode ); //connect to gain
this._audionodes.push( audionode );
audionode.onended = function()
if(node.inputs)
{
console.log("ended!");
that.trigger("ended");
//remove
var index = that._audionodes.indexOf( audionode );
if(index != -1)
that._audionodes.splice(index,1);
for(var i = 0; i < node.inputs.length; ++i)
{
var input = node.inputs[i];
var link_info = node.graph.links[ input.link ];
if(!link_info)
continue;
var origin_node = node.graph.getNodeById( link_info.origin_id );
var origin_audionode = null;
if( origin_node.getAudioNodeInOutputSlot )
origin_audionode = origin_node.getAudioNodeInOutputSlot( link_info.origin_slot );
else
origin_audionode = origin_node.audionode;
var target_audionode = null;
if( node.getAudioNodeInInputSlot )
target_audionode = node.getAudioNodeInInputSlot( i );
else
target_audionode = node.audionode;
if(connect)
LGAudio.connect( origin_audionode, target_audionode );
else
LGAudio.disconnect( origin_audionode, target_audionode );
}
}
audionode.start();
return audionode;
if(node.outputs)
{
for(var i = 0; i < node.outputs.length; ++i)
{
var output = node.outputs[i];
for(var j = 0; j < output.links.length; ++j)
{
var link_info = node.graph.links[ output.links[j] ];
if(!link_info)
continue;
var origin_audionode = null;
if( node.getAudioNodeInOutputSlot )
origin_audionode = node.getAudioNodeInOutputSlot( i );
else
origin_audionode = node.audionode;
var target_node = node.graph.getNodeById( link_info.target_id );
var target_audionode = null;
if( target_node.getAudioNodeInInputSlot )
target_audionode = target_node.getAudioNodeInInputSlot( link_info.target_slot );
else
target_audionode = target_node.audionode;
if(connect)
LGAudio.connect( origin_audionode, target_audionode );
else
LGAudio.disconnect( origin_audionode, target_audionode );
}
}
}
}
LGAudio.prototype.onConnectionsChange = function( connection, slot, connected, link_info )
//used by many nodes
LGAudio.onConnectionsChange = function( connection, slot, connected, link_info )
{
//only process the outputs events
if(connection != LiteGraph.OUTPUT)
@@ -12094,23 +12132,169 @@ LGAudio.prototype.onConnectionsChange = function( connection, slot, connected, l
if( !target_node )
return;
if( connected )
{
if(target_node.connectAudioToSlot)
target_node.connectAudioToSlot( this.audionode, link_info.target_slot );
else
LGAudio.connect( this.audionode, target_node.audionode );
}
//get origin audionode
var local_audionode = null;
if(this.getAudioNodeInOutputSlot)
local_audionode = this.getAudioNodeInOutputSlot( slot );
else
local_audionode = this.audionode;
//get target audionode
var target_audionode = null;
if(target_node.getAudioNodeInInputSlot)
target_audionode = target_node.getAudioNodeInInputSlot( link_info.target_slot );
else
target_audionode = target_node.audionode;
//do the connection/disconnection
if( connected )
LGAudio.connect( local_audionode, target_audionode );
else
LGAudio.disconnect( local_audionode, target_audionode );
}
//****************************************************
function LGAudioSource()
{
this.properties = {
src: "demodata/audio.wav",
gain: 0.5,
loop: true,
autoplay: true,
playbackRate: 1
};
this._loading_audio = false;
this._audio_buffer = null;
this._audionodes = [];
this.addOutput( "out", "audio" );
this.addInput( "gain", "number" );
//init context
var context = LGAudio.getAudioContext();
//create gain node
this.audionode = context.createGain();
this.audionode.graphnode = this;
this.audionode.gain.value = this.properties.gain;
//debug
if(this.properties.src)
this.loadSound( this.properties.src );
}
LGAudioSource.supported_extensions = ["wav","ogg","mp3"];
LGAudioSource.prototype.onAdded = function(graph)
{
if(graph.status === LGraph.STATUS_RUNNING)
this.onStart();
}
LGAudioSource.prototype.onStart = function()
{
if(!this._audio_buffer)
return;
if(this.properties.autoplay)
this.playBuffer( this._audio_buffer );
}
LGAudioSource.prototype.onStop = function()
{
this.stopAllSounds();
}
LGAudioSource.prototype.onRemoved = function()
{
this.stopAllSounds();
}
LGAudioSource.prototype.stopAllSounds = function()
{
//iterate and stop
for(var i = 0; i < this._audionodes.length; ++i )
{
if(target_node.disconnectAudioFromSlot)
target_node.disconnectAudioFromSlot( this.audionode, link_info.target_slot );
else
LGAudio.disconnect( this.audionode, target_node.audionode );
this._audionodes[i].stop();
//this._audionodes[i].disconnect( this.audionode );
}
this._audionodes.length = 0;
}
LGAudioSource.prototype.onExecute = function()
{
if(!this.inputs)
return;
for(var i = 0; i < this.inputs.length; ++i)
{
var input = this.inputs[i];
if(!input.link)
continue;
var v = this.getInputData(i);
if( v === undefined )
continue;
if( input.name == "gain" )
this.audionode.gain.value = v;
else if( input.name == "playbackRate" )
this.properties.playbackRate = v;
}
}
LGAudio.prototype.loadSound = function( url )
LGAudioSource.prototype.onAction = function(event)
{
if(this._audio_buffer)
{
if(event == "Play")
this.playBuffer(this._audio_buffer);
else if(event == "Stop")
this.stopAllSounds();
}
}
LGAudioSource.prototype.onPropertyChanged = function( name, value )
{
if( name == "src" )
this.loadSound( value );
else if(name == "gain")
this.audionode.gain.value = value;
}
LGAudioSource.prototype.playBuffer = function( buffer )
{
var that = this;
var context = LGAudio.getAudioContext();
//create a new audionode (this is mandatory, AudioAPI doesnt like to reuse old ones)
var audionode = context.createBufferSource(); //create a AudioBufferSourceNode
audionode.graphnode = this;
audionode.buffer = buffer;
audionode.loop = this.properties.loop;
audionode.playbackRate.value = this.properties.playbackRate;
this._audionodes.push( audionode );
audionode.connect( this.audionode ); //connect to gain
this._audionodes.push( audionode );
audionode.onended = function()
{
//console.log("ended!");
that.trigger("ended");
//remove
var index = that._audionodes.indexOf( audionode );
if(index != -1)
that._audionodes.splice(index,1);
}
audionode.start();
return audionode;
}
LGAudioSource.prototype.loadSound = function( url )
{
var that = this;
@@ -12140,6 +12324,12 @@ LGAudio.prototype.loadSound = function( url )
request.onload = function() {
context.decodeAudioData( request.response, function(buffer) {
that._audio_buffer = buffer;
if(that._url)
{
URL.revokeObjectURL( that._url );
that._url = null;
}
that._loading_audio = false;
//if is playing, then play it
if(that.graph && that.graph.status === LGraph.STATUS_RUNNING)
@@ -12154,21 +12344,33 @@ LGAudio.prototype.loadSound = function( url )
}
}
LGAudio.prototype.onGetInputs = function()
//Helps connect/disconnect AudioNodes when new connections are made in the node
LGAudioSource.prototype.onConnectionsChange = LGAudio.onConnectionsChange;
LGAudioSource.prototype.onGetInputs = function()
{
return [["Play",LiteGraph.ACTION],["Stop",LiteGraph.ACTION]];
return [["playbackRate","number"],["Play",LiteGraph.ACTION],["Stop",LiteGraph.ACTION]];
}
LGAudio.prototype.onGetOutputs = function()
LGAudioSource.prototype.onGetOutputs = function()
{
return [["ended",LiteGraph.EVENT]];
}
LGAudioSource.prototype.onDropFile = function(file)
{
if(this._url)
URL.revokeObjectURL( this._url );
this._url = URL.createObjectURL( file );
this.properties.src = this._url;
this.loadSound( this._url );
}
LGAudioSource.title = "Source";
LGAudioSource.desc = "Plays audio";
LiteGraph.registerNodeType("audio/source", LGAudioSource);
LGAudio.title = "Source";
LGAudio.desc = "Plays audio";
LiteGraph.registerNodeType("audio/source", LGAudio);
global.LGAudio = LGAudio;
//*****************************************************
@@ -12191,7 +12393,7 @@ function LGAudioAnalyser()
this.audionode.smoothingTimeConstant = this.properties.smoothingTimeConstant;
this.addInput("in","audio");
this.addOutput("freqs","FFT");
this.addOutput("freqs","array");
//this.addOutput("time","freq");
this._freq_bin = null;
@@ -12256,33 +12458,7 @@ function createAudioNodeWrapper( class_object )
this.audionode[ name ] = value;
}
class_object.prototype.onConnectionsChange = function( connection, slot, connected, link_info )
{
//only process the outputs events
if(connection != LiteGraph.OUTPUT)
return;
var target_node = null;
if( link_info )
target_node = this.graph.getNodeById( link_info.target_id );
if( !target_node )
return;
if( connected )
{
if(target_node.connectAudioToSlot)
target_node.connectAudioToSlot( this.audionode, link_info.target_slot );
else
LGAudio.connect( this.audionode, target_node.audionode );
}
else
{
if(target_node.disconnectAudioFromSlot)
target_node.disconnectAudioFromSlot( this.audionode, link_info.target_slot );
else
LGAudio.disconnect( this.audionode, target_node.audionode );
}
}
class_object.prototype.onConnectionsChange = LGAudio.onConnectionsChange;
}
@@ -12322,6 +12498,44 @@ LGAudioGain.desc = "Audio gain";
LiteGraph.registerNodeType("audio/gain", LGAudioGain);
function LGAudioWaveShaper()
{
//default
this.properties = {
};
this.audionode = LGAudio.getAudioContext().createWaveShaper();
this.addInput("in","audio");
this.addInput("shape","waveshape");
this.addOutput("out","audio");
}
LGAudioWaveShaper.prototype.onExecute = function()
{
if(!this.inputs || !this.inputs.length)
return;
var v = this.getInputData(1);
if(v === undefined)
return;
this.audionode.curve = v;
}
LGAudioWaveShaper.prototype.setWaveShape = function(shape)
{
this.audionode.curve = shape;
}
createAudioNodeWrapper( LGAudioWaveShaper );
/* disabled till I dont find a way to do a wave shape
LGAudioWaveShaper.title = "WaveShaper";
LGAudioWaveShaper.desc = "Distortion using wave shape";
LiteGraph.registerNodeType("audio/waveShaper", LGAudioWaveShaper);
*/
function LGAudioMixer()
{
//default
@@ -12348,20 +12562,12 @@ function LGAudioMixer()
this.addOutput("out","audio");
}
LGAudioMixer.prototype.connectAudioToSlot = function( audionode, slot )
LGAudioMixer.prototype.getAudioNodeInInputSlot = function( slot )
{
if(slot == 0)
LGAudio.connect( audionode, this.audionode1 );
return this.audionode1;
else if(slot == 2)
LGAudio.connect( audionode, this.audionode2 );
}
LGAudioMixer.prototype.disconnectAudioFromSlot = function( audionode, slot )
{
if(slot == 0)
LGAudio.disconnect( audionode, this.audionode1 );
else if(slot == 2)
LGAudio.disconnect( audionode, this.audionode2 );
return this.audionode2;
}
LGAudioMixer.prototype.onExecute = function()
@@ -12397,46 +12603,23 @@ function LGAudioDelay()
{
//default
this.properties = {
time: 5
delayTime: 0.5
};
this.audionode = LGAudio.getAudioContext().createDelay( this.properties.time );
this.audionode = LGAudio.getAudioContext().createDelay( 10 );
this.audionode.delayTime.value = this.properties.delayTime;
this.addInput("in","audio");
this.addInput("time","number");
this.addOutput("out","audio");
}
createAudioNodeWrapper( LGAudioDelay );
LGAudioDelay.prototype.onPropertyChanged = function( name, value )
LGAudioDelay.prototype.onExecute = function()
{
if(name == "time")
{
if(value > 500)
value = 500;
if(value < 0)
value = 0;
var input_node = this.getInputNode(0);
var output_nodes = this.getOutputNodes(0);
if(input_node)
input_node.audionode.disconnect( this.audionode );
if(output_nodes)
{
for(var i = 0; i < output_nodes.length; ++i)
this.audionode.disconnect( output_nodes[i].audionode );
}
this.audionode = LGAudio.getAudioContext().createDelay( value );
if(input_node)
input_node.audionode.connect( this.audionode );
if(output_nodes)
{
for(var i = 0; i < output_nodes.length; ++i)
this.audionode.connect( output_nodes[i].audionode );
}
}
var v = this.getInputData(1);
if(v !== undefined )
this.audionode.delayTime.value = v;
}
LGAudioDelay.title = "Delay";
@@ -12490,25 +12673,16 @@ LiteGraph.registerNodeType("audio/biquadfilter", LGAudioBiquadFilter);
//*****************************************************
function LGAudioDestination()
{
this.audionode = LGAudio.getAudioContext().destination;
this.addInput("in","audio");
}
LGAudioDestination.title = "Destination";
LGAudioDestination.desc = "Audio output";
LiteGraph.registerNodeType("audio/destination", LGAudioDestination);
//EXTRA
function LGAudioVisualization()
{
this.addInput("freqs","FFT");
this.properties = {
continuous: true
};
this.addInput("freqs","array");
this.size = [300,200];
this._last_buffer = null;
}
@@ -12533,11 +12707,24 @@ LGAudioVisualization.prototype.onDrawForeground = function(ctx)
ctx.strokeStyle = "white";
ctx.beginPath();
var x = 0;
for(var i = 0; i < buffer.length; i+= delta)
if(this.properties.continuous)
{
ctx.moveTo(x,h);
ctx.lineTo(x,h - (buffer[i|0]/255) * h);
x++;
for(var i = 0; i < buffer.length; i+= delta)
{
ctx.lineTo(x,h - (buffer[i|0]/255) * h);
x++;
}
}
else
{
for(var i = 0; i < buffer.length; i+= delta)
{
ctx.moveTo(x,h);
ctx.lineTo(x,h - (buffer[i|0]/255) * h);
x++;
}
}
ctx.stroke();
}
@@ -12548,4 +12735,18 @@ LiteGraph.registerNodeType("audio/visualization", LGAudioVisualization);
function LGAudioDestination()
{
this.audionode = LGAudio.getAudioContext().destination;
this.addInput("in","audio");
}
LGAudioDestination.title = "Destination";
LGAudioDestination.desc = "Audio output";
LiteGraph.registerNodeType("audio/destination", LGAudioDestination);
})( window );

146
build/litegraph.min.js vendored
View File

@@ -1,10 +1,11 @@
var LiteGraph={NODE_TITLE_HEIGHT:16,NODE_SLOT_HEIGHT:15,NODE_WIDTH:140,NODE_MIN_WIDTH:50,NODE_COLLAPSED_RADIUS:10,NODE_COLLAPSED_WIDTH:80,CANVAS_GRID_SIZE:10,NODE_TITLE_COLOR:"#222",NODE_DEFAULT_COLOR:"#999",NODE_DEFAULT_BGCOLOR:"#444",NODE_DEFAULT_BOXCOLOR:"#AEF",NODE_DEFAULT_SHAPE:"box",MAX_NUMBER_OF_NODES:1E3,DEFAULT_POSITION:[100,100],node_images_path:"",INPUT:1,OUTPUT:2,EVENT:-1,ACTION:-1,ALWAYS:0,ON_EVENT:1,NEVER:2,proxy:null,debug:!1,throw_errors:!0,registered_node_types:{},Nodes:{},registerNodeType:function(a,
b){if(!b.prototype)throw"Cannot register a simple object, it must be a class with a prototype";b.type=a;LiteGraph.debug&&console.log("Node registered: "+a);a.split("/");var c=a.lastIndexOf("/");b.category=a.substr(0,c);if(b.prototype)for(var d in LGraphNode.prototype)b.prototype[d]||(b.prototype[d]=LGraphNode.prototype[d]);this.registered_node_types[a]=b;b.constructor.name&&(this.Nodes[b.constructor.name]=b);b.prototype.onPropertyChange&&console.warn("LiteGraph node class "+a+" has onPropertyChange method, it must be called onPropertyChanged with d at the end")},
addNodeMethod:function(a,b){LGraphNode.prototype[a]=b;for(var c in this.registered_node_types)this.registered_node_types[c].prototype[a]=b},createNode:function(a,b,c){var d=this.registered_node_types[a];if(!d)return LiteGraph.debug&&console.log('GraphNode type "'+a+'" not registered.'),null;b=b||d.title||a;d=new d(name);d.type=a;d.title||(d.title=b);d.properties||(d.properties={});d.properties_info||(d.properties_info=[]);d.flags||(d.flags={});d.size||(d.size=d.computeSize());d.pos||(d.pos=LiteGraph.DEFAULT_POSITION.concat());
d.mode||(d.mode=LiteGraph.ALWAYS);if(c)for(var e in c)d[e]=c[e];return d},getNodeType:function(a){return this.registered_node_types[a]},getNodeTypesInCategory:function(a){var b=[],c;for(c in this.registered_node_types)""==a?null==this.registered_node_types[c].category&&b.push(this.registered_node_types[c]):this.registered_node_types[c].category==a&&b.push(this.registered_node_types[c]);return b},getNodeTypesCategories:function(){var a={"":1},b;for(b in this.registered_node_types)this.registered_node_types[b].category&&
!this.registered_node_types[b].skip_list&&(a[this.registered_node_types[b].category]=1);var c=[];for(b in a)c.push(b);return c},reloadNodes:function(a){var b=document.getElementsByTagName("script"),c=[],d;for(d in b)c.push(b[d]);b=document.getElementsByTagName("head")[0];a=document.location.href+a;for(d in c){var e=c[d].src;if(e&&e.substr(0,a.length)==a)try{LiteGraph.debug&&console.log("Reloading: "+e);var f=document.createElement("script");f.type="text/javascript";f.src=e;b.appendChild(f);b.removeChild(c[d])}catch(g){if(LiteGraph.throw_errors)throw g;
LiteGraph.debug&&console.log("Error while reloading "+e)}}LiteGraph.debug&&console.log("Nodes reloaded")},cloneObject:function(a,b){if(null==a)return null;var c=JSON.parse(JSON.stringify(a));if(!b)return c;for(var d in c)b[d]=c[d];return b},isValidConnection:function(a,b){return!a||!b||a==a||a!==LiteGraph.EVENT&&b!==LiteGraph.EVENT&&a.toLowerCase()==b.toLowerCase()?!0:!1}};LiteGraph.getTime="undefined"!=typeof performance?function(){return performance.now()}:function(){return Date.now()};
function LGraph(){LiteGraph.debug&&console.log("Graph created");this.list_of_graphcanvas=null;this.clear()}LGraph.supported_types=["number","string","boolean"];LGraph.prototype.getSupportedTypes=function(){return this.supported_types||LGraph.supported_types};LGraph.STATUS_STOPPED=1;LGraph.STATUS_RUNNING=2;
var LiteGraph={NODE_TITLE_HEIGHT:16,NODE_SLOT_HEIGHT:15,NODE_WIDTH:140,NODE_MIN_WIDTH:50,NODE_COLLAPSED_RADIUS:10,NODE_COLLAPSED_WIDTH:80,CANVAS_GRID_SIZE:10,NODE_TITLE_COLOR:"#222",NODE_DEFAULT_COLOR:"#999",NODE_DEFAULT_BGCOLOR:"#444",NODE_DEFAULT_BOXCOLOR:"#AEF",NODE_DEFAULT_SHAPE:"box",MAX_NUMBER_OF_NODES:1E3,DEFAULT_POSITION:[100,100],node_images_path:"",INPUT:1,OUTPUT:2,EVENT:-1,ACTION:-1,ALWAYS:0,ON_EVENT:1,NEVER:2,proxy:null,debug:!1,throw_errors:!0,registered_node_types:{},node_types_by_file_extension:{},
Nodes:{},registerNodeType:function(a,b){if(!b.prototype)throw"Cannot register a simple object, it must be a class with a prototype";b.type=a;LiteGraph.debug&&console.log("Node registered: "+a);a.split("/");var c=a.lastIndexOf("/");b.category=a.substr(0,c);if(b.prototype)for(var d in LGraphNode.prototype)b.prototype[d]||(b.prototype[d]=LGraphNode.prototype[d]);this.registered_node_types[a]=b;b.constructor.name&&(this.Nodes[b.constructor.name]=b);b.prototype.onPropertyChange&&console.warn("LiteGraph node class "+
a+" has onPropertyChange method, it must be called onPropertyChanged with d at the end");if(b.supported_extensions)for(d in b.supported_extensions)this.node_types_by_file_extension[b.supported_extensions[d].toLowerCase()]=b},addNodeMethod:function(a,b){LGraphNode.prototype[a]=b;for(var c in this.registered_node_types)this.registered_node_types[c].prototype[a]=b},createNode:function(a,b,c){var d=this.registered_node_types[a];if(!d)return LiteGraph.debug&&console.log('GraphNode type "'+a+'" not registered.'),
null;b=b||d.title||a;d=new d(name);d.type=a;d.title||(d.title=b);d.properties||(d.properties={});d.properties_info||(d.properties_info=[]);d.flags||(d.flags={});d.size||(d.size=d.computeSize());d.pos||(d.pos=LiteGraph.DEFAULT_POSITION.concat());d.mode||(d.mode=LiteGraph.ALWAYS);if(c)for(var e in c)d[e]=c[e];return d},getNodeType:function(a){return this.registered_node_types[a]},getNodeTypesInCategory:function(a){var b=[],c;for(c in this.registered_node_types)""==a?null==this.registered_node_types[c].category&&
b.push(this.registered_node_types[c]):this.registered_node_types[c].category==a&&b.push(this.registered_node_types[c]);return b},getNodeTypesCategories:function(){var a={"":1},b;for(b in this.registered_node_types)this.registered_node_types[b].category&&!this.registered_node_types[b].skip_list&&(a[this.registered_node_types[b].category]=1);var c=[];for(b in a)c.push(b);return c},reloadNodes:function(a){var b=document.getElementsByTagName("script"),c=[],d;for(d in b)c.push(b[d]);b=document.getElementsByTagName("head")[0];
a=document.location.href+a;for(d in c){var e=c[d].src;if(e&&e.substr(0,a.length)==a)try{LiteGraph.debug&&console.log("Reloading: "+e);var f=document.createElement("script");f.type="text/javascript";f.src=e;b.appendChild(f);b.removeChild(c[d])}catch(g){if(LiteGraph.throw_errors)throw g;LiteGraph.debug&&console.log("Error while reloading "+e)}}LiteGraph.debug&&console.log("Nodes reloaded")},cloneObject:function(a,b){if(null==a)return null;var c=JSON.parse(JSON.stringify(a));if(!b)return c;for(var d in c)b[d]=
c[d];return b},isValidConnection:function(a,b){return!a||!b||a==a||a!==LiteGraph.EVENT&&b!==LiteGraph.EVENT&&a.toLowerCase()==b.toLowerCase()?!0:!1}};LiteGraph.getTime="undefined"!=typeof performance?function(){return performance.now()}:function(){return Date.now()};function LGraph(){LiteGraph.debug&&console.log("Graph created");this.list_of_graphcanvas=null;this.clear()}LGraph.supported_types=["number","string","boolean"];
LGraph.prototype.getSupportedTypes=function(){return this.supported_types||LGraph.supported_types};LGraph.STATUS_STOPPED=1;LGraph.STATUS_RUNNING=2;
LGraph.prototype.clear=function(){this.stop();this.status=LGraph.STATUS_STOPPED;this.last_node_id=0;this._nodes=[];this._nodes_by_id={};this.last_link_id=0;this.links={};this.iteration=0;this.config={};this.fixedtime=this.runningtime=this.globaltime=0;this.elapsed_time=this.fixedtime_lapse=0.01;this.starttime=0;this.global_inputs={};this.global_outputs={};this.debug=!0;this.change();this.sendActionToCanvas("clear")};
LGraph.prototype.attachCanvas=function(a){if(a.constructor!=LGraphCanvas)throw"attachCanvas expects a LGraphCanvas instance";a.graph&&a.graph!=this&&a.graph.detachCanvas(a);a.graph=this;this.list_of_graphcanvas||(this.list_of_graphcanvas=[]);this.list_of_graphcanvas.push(a)};LGraph.prototype.detachCanvas=function(a){if(this.list_of_graphcanvas){var b=this.list_of_graphcanvas.indexOf(a);-1!=b&&(a.graph=null,this.list_of_graphcanvas.splice(b,1))}};
LGraph.prototype.start=function(a){if(this.status!=LGraph.STATUS_RUNNING){this.status=LGraph.STATUS_RUNNING;if(this.onPlayEvent)this.onPlayEvent();this.sendEventToAllNodes("onStart");this.starttime=LiteGraph.getTime();var b=this;this.execution_timer_id=setInterval(function(){b.runStep(1)},a||1)}};
@@ -27,15 +28,17 @@ LGraph.prototype.changeGlobalOutputType=function(a,b){if(!this.global_outputs[a]
LGraph.prototype.setInputData=function(a,b){for(var c=this.findNodesByName(a),d=0,e=c.length;d<e;++d)c[d].setValue(b)};LGraph.prototype.getOutputData=function(a){return this.findNodesByName(a).length?m[0].getValue():null};LGraph.prototype.triggerInput=function(a,b){for(var c=this.findNodesByName(a),d=0;d<c.length;++d)c[d].onTrigger(b)};LGraph.prototype.setCallback=function(a,b){for(var c=this.findNodesByName(a),d=0;d<c.length;++d)c[d].setTrigger(b)};
LGraph.prototype.connectionChange=function(a){this.updateExecutionOrder();if(this.onConnectionChange)this.onConnectionChange(a);this.sendActionToCanvas("onConnectionChange")};LGraph.prototype.isLive=function(){if(!this.list_of_graphcanvas)return!1;for(var a=0;a<this.list_of_graphcanvas.length;++a)if(this.list_of_graphcanvas[a].live_mode)return!0;return!1};LGraph.prototype.change=function(){LiteGraph.debug&&console.log("Graph changed");this.sendActionToCanvas("setDirty",[!0,!0]);if(this.on_change)this.on_change(this)};
LGraph.prototype.setDirtyCanvas=function(a,b){this.sendActionToCanvas("setDirty",[a,b])};LGraph.prototype.serialize=function(){for(var a=[],b=0,c=this._nodes.length;b<c;++b)a.push(this._nodes[b].serialize());for(b in this.links)c=this.links[b],c.data=null,delete c._last_time;return{iteration:this.iteration,frame:this.frame,last_node_id:this.last_node_id,last_link_id:this.last_link_id,links:LiteGraph.cloneObject(this.links),config:this.config,nodes:a}};
LGraph.prototype.configure=function(a,b){b||this.clear();var c=a.nodes,d;for(d in a)this[d]=a[d];var e=!1;this._nodes=[];d=0;for(var f=c.length;d<f;++d){var g=c[d],h=LiteGraph.createNode(g.type,g.title);h?(h.id=g.id,this.add(h,!0),h.configure(g)):(LiteGraph.debug&&console.log("Node not found: "+g.type),e=!0)}this.updateExecutionOrder();this.setDirtyCanvas(!0,!0);return e};LGraph.prototype.onNodeTrace=function(a,b,c){};function LGraphNode(a){this._ctor()}
LGraph.prototype.configure=function(a,b){b||this.clear();var c=a.nodes,d;for(d in a)this[d]=a[d];var e=!1;this._nodes=[];d=0;for(var f=c.length;d<f;++d){var g=c[d],h=LiteGraph.createNode(g.type,g.title);h?(h.id=g.id,this.add(h,!0)):(LiteGraph.debug&&console.log("Node not found: "+g.type),e=!0)}d=0;for(f=c.length;d<f;++d)g=c[d],(h=this.getNodeById(g.id))&&h.configure(g);this.updateExecutionOrder();this.setDirtyCanvas(!0,!0);return e};
LGraph.prototype.load=function(a){var b=this,c=new XMLHttpRequest;c.open("GET",a,!0);c.send(null);c.onload=function(a){200!==c.status?console.error("Error loading graph:",c.status,c.response):(a=JSON.parse(c.response),b.configure(a))};c.onerror=function(a){console.error("Error loading graph:",a)}};LGraph.prototype.onNodeTrace=function(a,b,c){};function LGraphNode(a){this._ctor()}
LGraphNode.prototype._ctor=function(a){this.title=a||"Unnamed";this.size=[LiteGraph.NODE_WIDTH,60];this.graph=null;this._pos=new Float32Array(10,10);Object.defineProperty(this,"pos",{set:function(a){!a||2>!a.length||(this._pos[0]=a[0],this._pos[1]=a[1])},get:function(){return this._pos},enumerable:!0});this.id=-1;this.type=null;this.inputs=[];this.outputs=[];this.connections=[];this.properties={};this.properties_info=[];this.data=null;this.flags={}};
LGraphNode.prototype.configure=function(a){for(var b in a)if("console"!=b)if("properties"==b)for(var c in a.properties){if(this.properties[c]=a.properties[c],this.onPropertyChanged)this.onPropertyChanged(c,a.properties[c])}else null!=a[b]&&("object"==typeof a[b]?this[b]&&this[b].configure?this[b].configure(a[b]):this[b]=LiteGraph.cloneObject(a[b],this[b]):this[b]=a[b]);if(this.onConnectionsChange)this.onConnectionsChange();for(var d in this.inputs){var e=this.inputs[d];e.link&&e.link.length&&(c=e.link,
"object"==typeof c&&(e.link=c[0],this.graph.links[c[0]]={id:c[0],origin_id:c[1],origin_slot:c[2],target_id:c[3],target_slot:c[4]}))}for(d in this.outputs)if(e=this.outputs[d],e.links&&0!=e.links.length)for(b in e.links)c=e.links[b],"object"==typeof c&&(e.links[b]=c[0]);if(this.onConfigured)this.onConfigured(a)};
LGraphNode.prototype.configure=function(a){for(var b in a)if("console"!=b)if("properties"==b)for(var c in a.properties){if(this.properties[c]=a.properties[c],this.onPropertyChanged)this.onPropertyChanged(c,a.properties[c])}else null!=a[b]&&("object"==typeof a[b]?this[b]&&this[b].configure?this[b].configure(a[b]):this[b]=LiteGraph.cloneObject(a[b],this[b]):this[b]=a[b]);if(this.onConnectionsChange){if(this.inputs)for(var d=0;d<this.inputs.length;++d){c=this.inputs[d];var e=this.graph.links[c.link];
this.onConnectionsChange(LiteGraph.INPUT,d,!0,e)}if(this.outputs)for(d=0;d<this.outputs.length;++d)for(c=this.outputs[d],b=0;b<c.links.length;++b)e=this.graph.links[c.links[b]],this.onConnectionsChange(LiteGraph.OUTPUT,d,!0,e)}for(d in this.inputs)c=this.inputs[d],c.link&&c.link.length&&(e=c.link,"object"==typeof e&&(c.link=e[0],this.graph.links[e[0]]={id:e[0],origin_id:e[1],origin_slot:e[2],target_id:e[3],target_slot:e[4]}));for(d in this.outputs)if(c=this.outputs[d],c.links&&0!=c.links.length)for(b in c.links)e=
c.links[b],"object"==typeof e&&(c.links[b]=e[0]);if(this.onConfigured)this.onConfigured(a)};
LGraphNode.prototype.serialize=function(){var a={id:this.id,title:this.title,type:this.type,pos:this.pos,size:this.size,data:this.data,flags:LiteGraph.cloneObject(this.flags),inputs:this.inputs,outputs:this.outputs,mode:this.mode};this.properties&&(a.properties=LiteGraph.cloneObject(this.properties));a.type||(a.type=this.constructor.type);this.color&&(a.color=this.color);this.bgcolor&&(a.bgcolor=this.bgcolor);this.boxcolor&&(a.boxcolor=this.boxcolor);this.shape&&(a.shape=this.shape);if(this.onSerialize)this.onSerialize(a);
return a};LGraphNode.prototype.clone=function(){var a=LiteGraph.createNode(this.type),b=LiteGraph.cloneObject(this.serialize());if(b.inputs)for(var c=0;c<b.inputs.length;++c)b.inputs[c].link=null;if(b.outputs)for(c=0;c<b.outputs.length;++c)b.outputs[c].links&&(b.outputs[c].links.length=0);delete b.id;a.configure(b);return a};LGraphNode.prototype.toString=function(){return JSON.stringify(this.serialize())};LGraphNode.prototype.getTitle=function(){return this.title||this.constructor.title};
LGraphNode.prototype.setOutputData=function(a,b){if(this.outputs&&-1<a&&a<this.outputs.length&&this.outputs[a]&&null!=this.outputs[a].links)for(var c=0;c<this.outputs[a].links.length;c++)this.graph.links[this.outputs[a].links[c]].data=b};
LGraphNode.prototype.getInputData=function(a,b){if(this.inputs&&!(a>=this.inputs.length||null==this.inputs[a].link)){var c=this.graph.links[this.inputs[a].link];if(!b)return c.data;var d=this.graph.getNodeById(c.origin_id);if(!d)return c.data;if(d.updateOutputData)d.updateOutputData(c.origin_slot);else if(d.onExecute)d.onExecute();return c.data}};LGraphNode.prototype.isInputConnected=function(a){return this.inputs?a<this.inputs.length&&null!=this.inputs[a].link:!1};
LGraphNode.prototype.getInputInfo=function(a){return this.inputs?a<this.inputs.length?this.inputs[a]:null:null};LGraphNode.prototype.getInputNode=function(a){return!this.inputs||a>=this.inputs.length?null:(a=this.inputs[a])&&a.link?this.graph.getNodeById(a.link.origin_id):null};LGraphNode.prototype.getOutputInfo=function(a){return this.outputs?a<this.outputs.length?this.outputs[a]:null:null};
LGraphNode.prototype.getInputInfo=function(a){return this.inputs?a<this.inputs.length?this.inputs[a]:null:null};LGraphNode.prototype.getInputNode=function(a){if(!this.inputs||a>=this.inputs.length)return null;a=this.inputs[a];return a&&a.link?(a=this.graph.links[a.link])?this.graph.getNodeById(a.origin_id):null:null};LGraphNode.prototype.getOutputInfo=function(a){return this.outputs?a<this.outputs.length?this.outputs[a]:null:null};
LGraphNode.prototype.isOutputConnected=function(a){return this.outputs?a<this.outputs.length&&this.outputs[a].links&&this.outputs[a].links.length:null};LGraphNode.prototype.getOutputNodes=function(a){if(!this.outputs||0==this.outputs.length)return null;if(a<this.outputs.length){a=this.outputs[a];for(var b=[],c=0;c<a.length;c++)b.push(this.graph.getNodeById(a.links[c].target_id));return b}return null};
LGraphNode.prototype.trigger=function(a,b){if(this.outputs&&this.outputs.length){this.graph&&(this.graph._last_trigger_time=LiteGraph.getTime());for(var c=0;c<this.outputs.length;++c){var d=this.outputs[c];if(!(d.type!==LiteGraph.EVENT||a&&d.name!=a)&&(d=d.links)&&d.length)for(var e=0;e<d.length;++e){var f=this.graph.links[d[e]];if(f){var g=this.graph.getNodeById(f.target_id);if(g)if(f._last_time=LiteGraph.getTime(),f=g.inputs[f.target_slot],g.onAction)g.onAction(f.name,b);else if(g.mode===LiteGraph.ON_TRIGGER&&
g.onExecute)g.onExecute(b)}}}}};LGraphNode.prototype.addProperty=function(a,b,c,d){c={name:a,type:c,default_value:b};if(d)for(var e in d)c[e]=d[e];this.properties_info||(this.properties_info=[]);this.properties_info.push(c);this.properties||(this.properties={});this.properties[a]=b;return c};
@@ -95,11 +98,12 @@ LGraphCanvas.prototype.isOverNodeInput=function(a,b,c,d){if(a.inputs)for(var e=0
LGraphCanvas.prototype.processKey=function(a){if(this.graph){var b=!1;if("keydown"==a.type){65==a.keyCode&&a.ctrlKey&&(this.selectAllNodes(),b=!0);if(46==a.keyCode||8==a.keyCode)this.deleteSelectedNodes(),b=!0;if(this.selected_nodes)for(var c in this.selected_nodes)if(this.selected_nodes[c].onKeyDown)this.selected_nodes[c].onKeyDown(a)}else if("keyup"==a.type&&this.selected_nodes)for(c in this.selected_nodes)if(this.selected_nodes[c].onKeyUp)this.selected_nodes[c].onKeyUp(a);this.graph.change();if(b)return a.preventDefault(),
!1}};
LGraphCanvas.prototype.processDrop=function(a){a.preventDefault();this.adjustMouseEvent(a);var b=[a.canvasX,a.canvasY],c=this.graph.getNodeOnPos(b[0],b[1]);if(c){if(c.onDropFile&&(b=a.dataTransfer.files)&&b.length)for(var d=0;d<b.length;d++){var e=a.dataTransfer.files[0],f=e.name;LGraphCanvas.getFileExtension(f);var g=new FileReader;g.onload=function(a){c.onDropFile(a.target.result,f,e)};var h=e.type.split("/")[0];"text"==h||""==h?g.readAsText(e):"image"==h?g.readAsDataURL(e):g.readAsArrayBuffer(e)}return c.onDropItem&&c.onDropItem(event)?
!0:this.onDropItem?this.onDropItem(event):!1}if(this.onDropItem)this.onDropItem(event)};LGraphCanvas.prototype.processNodeSelected=function(a,b){a.selected=!0;if(a.onSelected)a.onSelected();b&&b.shiftKey||(this.selected_nodes={});this.selected_nodes[a.id]=a;this.dirty_canvas=!0;if(this.onNodeSelected)this.onNodeSelected(a)};
LGraphCanvas.prototype.processNodeDeselected=function(a){a.selected=!1;if(a.onDeselected)a.onDeselected();delete this.selected_nodes[a.id];if(this.onNodeDeselected)this.onNodeDeselected(a);this.dirty_canvas=!0};LGraphCanvas.prototype.processNodeDblClicked=function(a){if(this.onShowNodePanel)this.onShowNodePanel(a);if(this.onNodeDblClicked)this.onNodeDblClicked(a);this.setDirty(!0)};
LGraphCanvas.prototype.selectNode=function(a){this.deselectAllNodes();if(a){if(!a.selected&&a.onSelected)a.onSelected();a.selected=!0;this.selected_nodes[a.id]=a;this.setDirty(!0)}};LGraphCanvas.prototype.selectAllNodes=function(){for(var a=0;a<this.graph._nodes.length;++a){var b=this.graph._nodes[a];if(!b.selected&&b.onSelected)b.onSelected();b.selected=!0;this.selected_nodes[this.graph._nodes[a].id]=b}this.setDirty(!0)};
LGraphCanvas.prototype.deselectAllNodes=function(){for(var a in this.selected_nodes){var b=this.selected_nodes;if(b.onDeselected)b.onDeselected();b.selected=!1}this.selected_nodes={};this.setDirty(!0)};LGraphCanvas.prototype.deleteSelectedNodes=function(){for(var a in this.selected_nodes)this.graph.remove(this.selected_nodes[a]);this.selected_nodes={};this.setDirty(!0)};
LGraphCanvas.prototype.centerOnNode=function(a){this.offset[0]=-a.pos[0]-0.5*a.size[0]+0.5*this.canvas.width/this.scale;this.offset[1]=-a.pos[1]-0.5*a.size[1]+0.5*this.canvas.height/this.scale;this.setDirty(!0,!0)};LGraphCanvas.prototype.adjustMouseEvent=function(a){var b=this.canvas.getBoundingClientRect();a.localX=a.pageX-b.left;a.localY=a.pageY-b.top;a.canvasX=a.localX/this.scale-this.offset[0];a.canvasY=a.localY/this.scale-this.offset[1]};
!0:this.onDropItem?this.onDropItem(event):!1}b=null;this.onDropItem&&(b=this.onDropItem(event));b||this.checkDropItem(a)};LGraphCanvas.prototype.checkDropItem=function(a){if(a.dataTransfer.files.length){var b=a.dataTransfer.files[0],c=LGraphCanvas.getFileExtension(b.name).toLowerCase();if(c=LiteGraph.node_types_by_file_extension[c])if(c=LiteGraph.createNode(c.type),c.pos=[a.canvasX,a.canvasY],this.graph.add(c),c.onDropFile)c.onDropFile(b)}};
LGraphCanvas.prototype.processNodeSelected=function(a,b){a.selected=!0;if(a.onSelected)a.onSelected();b&&b.shiftKey||(this.selected_nodes={});this.selected_nodes[a.id]=a;this.dirty_canvas=!0;if(this.onNodeSelected)this.onNodeSelected(a)};LGraphCanvas.prototype.processNodeDeselected=function(a){a.selected=!1;if(a.onDeselected)a.onDeselected();delete this.selected_nodes[a.id];if(this.onNodeDeselected)this.onNodeDeselected(a);this.dirty_canvas=!0};
LGraphCanvas.prototype.processNodeDblClicked=function(a){if(this.onShowNodePanel)this.onShowNodePanel(a);if(this.onNodeDblClicked)this.onNodeDblClicked(a);this.setDirty(!0)};LGraphCanvas.prototype.selectNode=function(a){this.deselectAllNodes();if(a){if(!a.selected&&a.onSelected)a.onSelected();a.selected=!0;this.selected_nodes[a.id]=a;this.setDirty(!0)}};
LGraphCanvas.prototype.selectAllNodes=function(){for(var a=0;a<this.graph._nodes.length;++a){var b=this.graph._nodes[a];if(!b.selected&&b.onSelected)b.onSelected();b.selected=!0;this.selected_nodes[this.graph._nodes[a].id]=b}this.setDirty(!0)};LGraphCanvas.prototype.deselectAllNodes=function(){for(var a in this.selected_nodes){var b=this.selected_nodes;if(b.onDeselected)b.onDeselected();b.selected=!1}this.selected_nodes={};this.setDirty(!0)};
LGraphCanvas.prototype.deleteSelectedNodes=function(){for(var a in this.selected_nodes)this.graph.remove(this.selected_nodes[a]);this.selected_nodes={};this.setDirty(!0)};LGraphCanvas.prototype.centerOnNode=function(a){this.offset[0]=-a.pos[0]-0.5*a.size[0]+0.5*this.canvas.width/this.scale;this.offset[1]=-a.pos[1]-0.5*a.size[1]+0.5*this.canvas.height/this.scale;this.setDirty(!0,!0)};
LGraphCanvas.prototype.adjustMouseEvent=function(a){var b=this.canvas.getBoundingClientRect();a.localX=a.pageX-b.left;a.localY=a.pageY-b.top;a.canvasX=a.localX/this.scale-this.offset[0];a.canvasY=a.localY/this.scale-this.offset[1]};
LGraphCanvas.prototype.setZoom=function(a,b){b||(b=[0.5*this.canvas.width,0.5*this.canvas.height]);var c=this.convertOffsetToCanvas(b);this.scale=a;this.scale>this.max_zoom?this.scale=this.max_zoom:this.scale<this.min_zoom&&(this.scale=this.min_zoom);var d=this.convertOffsetToCanvas(b),c=[d[0]-c[0],d[1]-c[1]];this.offset[0]+=c[0];this.offset[1]+=c[1];this.dirty_bgcanvas=this.dirty_canvas=!0};
LGraphCanvas.prototype.convertOffsetToCanvas=function(a){return[a[0]/this.scale-this.offset[0],a[1]/this.scale-this.offset[1]]};LGraphCanvas.prototype.convertCanvasToOffset=function(a){return[(a[0]+this.offset[0])*this.scale,(a[1]+this.offset[1])*this.scale]};LGraphCanvas.prototype.convertEventToCanvas=function(a){var b=this.canvas.getClientRects()[0];return this.convertOffsetToCanvas([a.pageX-b.left,a.pageY-b.top])};
LGraphCanvas.prototype.bringToFront=function(a){var b=this.graph._nodes.indexOf(a);-1!=b&&(this.graph._nodes.splice(b,1),this.graph._nodes.push(a))};LGraphCanvas.prototype.sendToBack=function(a){var b=this.graph._nodes.indexOf(a);-1!=b&&(this.graph._nodes.splice(b,1),this.graph._nodes.unshift(a))};
@@ -132,16 +136,16 @@ LGraphCanvas.prototype.renderLink=function(a,b,c,d,e,f){if(this.highquality_rend
LGraphCanvas.prototype.resize=function(a,b){if(!a&&!b){var c=this.canvas.parentNode;a=c.offsetWidth;b=c.offsetHeight}if(this.canvas.width!=a||this.canvas.height!=b)this.canvas.width=a,this.canvas.height=b,this.bgcanvas.width=this.canvas.width,this.bgcanvas.height=this.canvas.height,this.setDirty(!0,!0)};
LGraphCanvas.prototype.switchLiveMode=function(a){if(a){var b=this,c=this.live_mode?1.1:0.9;this.live_mode&&(this.live_mode=!1,this.editor_alpha=0.1);var d=setInterval(function(){b.editor_alpha*=c;b.dirty_canvas=!0;b.dirty_bgcanvas=!0;1>c&&0.01>b.editor_alpha&&(clearInterval(d),1>c&&(b.live_mode=!0));1<c&&0.99<b.editor_alpha&&(clearInterval(d),b.editor_alpha=1)},1)}else this.live_mode=!this.live_mode,this.dirty_bgcanvas=this.dirty_canvas=!0};LGraphCanvas.prototype.onNodeSelectionChange=function(a){};
LGraphCanvas.prototype.touchHandler=function(a){var b=a.changedTouches[0],c="";switch(a.type){case "touchstart":c="mousedown";break;case "touchmove":c="mousemove";break;case "touchend":c="mouseup";break;default:return}var d=this.getCanvasWindow(),e=d.document.createEvent("MouseEvent");e.initMouseEvent(c,!0,!0,d,1,b.screenX,b.screenY,b.clientX,b.clientY,!1,!1,!1,!1,0,null);b.target.dispatchEvent(e);a.preventDefault()};
LGraphCanvas.onMenuAdd=function(a,b,c,d,e){function f(a,b){var c=LiteGraph.createNode(a.value);c&&(c.pos=d.convertEventToCanvas(e),d.graph.add(c))}var g=d.getCanvasWindow();a=LiteGraph.getNodeTypesCategories();var h={},k;for(k in a)a[k]&&(h[k]={value:a[k],content:a[k],is_menu:!0});var n=LiteGraph.createContextMenu(h,{event:b,callback:function(a,b){var c=LiteGraph.getNodeTypesInCategory(a.value),d=[],h;for(h in c)d.push({content:c[h].title,value:c[h].type});LiteGraph.createContextMenu(d,{event:b,callback:f,
LGraphCanvas.onMenuAdd=function(a,b,c,d,e){function f(a,b){var c=LiteGraph.createNode(a.value);c&&(c.pos=d.convertEventToCanvas(e),d.graph.add(c))}var g=d.getCanvasWindow();a=LiteGraph.getNodeTypesCategories();var h={},k;for(k in a)a[k]&&(h[k]={value:a[k],content:a[k],is_menu:!0});var n=LiteGraph.createContextMenu(h,{event:b,callback:function(a,b){var c=LiteGraph.getNodeTypesInCategory(a.value),d=[],e;for(e in c)d.push({content:c[e].title,value:c[e].type});LiteGraph.createContextMenu(d,{event:b,callback:f,
from:n},g);return!1},from:c},g);return!1};LGraphCanvas.onMenuCollapseAll=function(){};LGraphCanvas.onMenuNodeEdit=function(){};
LGraphCanvas.showMenuNodeInputs=function(a,b,c){function d(b,c,d){a&&(b.callback&&b.callback.call(e,a,b,c,d),b.value&&a.addInput(b.value[0],b.value[1],b.value[2]))}if(a){var e=this,f=this.getCanvasWindow(),g=a.optional_inputs;a.onGetInputs&&(g=a.onGetInputs());var h=[];if(g)for(var k in g){var n=g[k],l=n[0];n[2]&&n[2].label&&(l=n[2].label);h.push({content:l,value:n})}this.onMenuNodeInputs&&(h=this.onMenuNodeInputs(h));if(h.length)return LiteGraph.createContextMenu(h,{event:b,callback:d,from:c},f),
!1}};
LGraphCanvas.showMenuNodeOutputs=function(a,b,c){function d(b,g,h){if(a&&(b.callback&&b.callback.call(e,a,b,g,h),b.value))if(h=b.value[1],!h||h.constructor!==Object&&h.constructor!==Array)a.addOutput(b.value[0],b.value[1],b.value[2]);else{b=[];for(var k in h)b.push({content:k,value:h[k]});LiteGraph.createContextMenu(b,{event:g,callback:d,from:c});return!1}}if(a){var e=this,f=this.getCanvasWindow(),g=a.optional_outputs;a.onGetOutputs&&(g=a.onGetOutputs());var h=[];if(g)for(var k in g){var n=g[k];if(!n)h.push(null);
else if(-1==a.findOutputSlot(n[0])){var l=n[0];n[2]&&n[2].label&&(l=n[2].label);l={content:l,value:n};n[1]==LiteGraph.EVENT&&(l.className="event");h.push(l)}}this.onMenuNodeOutputs&&(h=this.onMenuNodeOutputs(h));if(h.length)return LiteGraph.createContextMenu(h,{event:b,callback:d,from:c},f),!1}};
LGraphCanvas.onShowMenuNodeProperties=function(a,b,c){function d(b,c,d){a&&e.showEditPropertyValue(a,b.value,{event:c})}if(a&&a.properties){var e=this,f=this.getCanvasWindow(),g=[],h;for(h in a.properties)g.push({content:"<span class='property_name'>"+h+"</span><span class='property_value'>"+(void 0!==a.properties[h]?a.properties[h]:" ")+"</span>",value:h});if(g.length)return LiteGraph.createContextMenu(g,{event:b,callback:d,from:c},f),!1}};
LGraphCanvas.prototype.showEditPropertyValue=function(a,b,c){function d(){e(q.value)}function e(c){"number"==typeof a.properties[b]&&(c=Number(c));a.properties[b]=c;if(a.onPropertyChanged)a.onPropertyChanged(b,c);l.parentNode.removeChild(l);a.setDirtyCanvas(!0,!0)}if(a&&void 0!==a.properties[b]){c=c||{};var f="string";null!==a.properties[b]&&(f=typeof a.properties[b]);var g=null;a.getPropertyInfo&&(g=a.getPropertyInfo(b));if(a.properties_info)for(var h=0;h<a.properties_info.length;++h)if(a.properties_info[h].name==
LGraphCanvas.prototype.showEditPropertyValue=function(a,b,c){function d(){e(p.value)}function e(c){"number"==typeof a.properties[b]&&(c=Number(c));a.properties[b]=c;if(a.onPropertyChanged)a.onPropertyChanged(b,c);l.parentNode.removeChild(l);a.setDirtyCanvas(!0,!0)}if(a&&void 0!==a.properties[b]){c=c||{};var f="string";null!==a.properties[b]&&(f=typeof a.properties[b]);var g=null;a.getPropertyInfo&&(g=a.getPropertyInfo(b));if(a.properties_info)for(var h=0;h<a.properties_info.length;++h)if(a.properties_info[h].name==
b){g=a.properties_info[h];break}void 0!==g&&null!==g&&g.type&&(f=g.type);var k="";if("string"==f||"number"==f)k="<input autofocus type='text' class='value'/>";else if("enum"==f&&g.values){k="<select autofocus type='text' class='value'>";for(h in g.values)var n=g.values.constructor===Array?g.values[h]:h,k=k+("<option value='"+n+"' "+(n==a.properties[b]?"selected":"")+">"+g.values[h]+"</option>");k+="</select>"}else"boolean"==f&&(k="<input autofocus type='checkbox' class='value' "+(a.properties[b]?
"checked":"")+"/>");var l=document.createElement("div");l.className="graphdialog";l.innerHTML="<span class='name'>"+b+"</span>"+k+"<button>OK</button>";if("enum"==f&&g.values){var q=l.querySelector("select");q.addEventListener("change",function(a){e(a.target.value)})}else if("boolean"==f)(q=l.querySelector("input"))&&q.addEventListener("click",function(a){e(!!q.checked)});else if(q=l.querySelector("input"))q.value=void 0!==a.properties[b]?a.properties[b]:"",q.addEventListener("keydown",function(a){13==
"checked":"")+"/>");var l=document.createElement("div");l.className="graphdialog";l.innerHTML="<span class='name'>"+b+"</span>"+k+"<button>OK</button>";if("enum"==f&&g.values){var p=l.querySelector("select");p.addEventListener("change",function(a){e(a.target.value)})}else if("boolean"==f)(p=l.querySelector("input"))&&p.addEventListener("click",function(a){e(!!p.checked)});else if(p=l.querySelector("input"))p.value=void 0!==a.properties[b]?a.properties[b]:"",p.addEventListener("keydown",function(a){13==
a.keyCode&&(d(),a.preventDefault(),a.stopPropagation())});f=this.canvas.getClientRects()[0];h=g=-20;f&&(g-=f.left,h-=f.top);c.event?(l.style.left=c.event.pageX+g+"px",l.style.top=c.event.pageY+h+"px"):(l.style.left=0.5*this.canvas.width+g+"px",l.style.top=0.5*this.canvas.height+h+"px");l.querySelector("button").addEventListener("click",d);this.canvas.parentNode.appendChild(l)}};LGraphCanvas.onMenuNodeCollapse=function(a){a.flags.collapsed=!a.flags.collapsed;a.setDirtyCanvas(!0,!0)};
LGraphCanvas.onMenuNodePin=function(a){a.pin()};LGraphCanvas.onMenuNodeMode=function(a,b,c){LiteGraph.createContextMenu(["Always","On Event","Never"],{event:b,callback:function(b){if(a)switch(b){case "On Event":a.mode=LiteGraph.ON_EVENT;break;case "Never":a.mode=LiteGraph.NEVER;break;default:a.mode=LiteGraph.ALWAYS}},from:c});return!1};
LGraphCanvas.onMenuNodeColors=function(a,b,c){var d=[],e;for(e in LGraphCanvas.node_colors){var f=LGraphCanvas.node_colors[e];d.push({value:e,content:"<span style='display: block; color:"+f.color+"; background-color:"+f.bgcolor+"'>"+e+"</span>"})}LiteGraph.createContextMenu(d,{event:b,callback:function(b){a&&(b=LGraphCanvas.node_colors[b.value])&&(a.color=b.color,a.bgcolor=b.bgcolor,a.setDirtyCanvas(!0))},from:c});return!1};
@@ -206,7 +210,7 @@ c;return a}};a.prototype.onDrawBackground=function(a){};a.prototype.onGetOutputs
"number"]]};LiteGraph.registerNodeType("input/gamepad",a)})();
(function(){function a(){this.addInput("in","*");this.size=[60,20]}function b(){this.addInput("in");this.addOutput("out");this.size=[60,20]}function c(){this.addInput("in","number",{locked:!0});this.addOutput("out","number",{locked:!0});this.addProperty("in",0);this.addProperty("in_min",0);this.addProperty("in_max",1);this.addProperty("out_min",0);this.addProperty("out_max",1)}function d(){this.addOutput("value","number");this.addProperty("min",0);this.addProperty("max",1);this.size=[60,20]}function e(){this.addInput("in",
"number");this.addOutput("out","number");this.size=[60,20];this.addProperty("min",0);this.addProperty("max",1)}function f(){this.addInput("in","number");this.addOutput("out","number");this.size=[60,20]}function g(){this.addInput("in","number");this.addOutput("out","number");this.size=[60,20]}function h(){this.addInput("in","number");this.addOutput("out","number");this.size=[60,20]}function k(){this.addInput("in","number");this.addOutput("out","number");this.size=[60,20];this.properties={A:0,B:1}}
function n(){this.addInput("in","number",{label:""});this.addOutput("out","number",{label:""});this.size=[60,20];this.addProperty("factor",1)}function l(){this.addInput("in","number");this.addOutput("out","number");this.size=[60,20];this.addProperty("samples",10);this._values=new Float32Array(10);this._current=0}function q(){this.addInput("A","number");this.addInput("B","number");this.addOutput("=","number");this.addProperty("A",1);this.addProperty("B",1);this.addProperty("OP","+","string",{values:q.values})}
function n(){this.addInput("in","number",{label:""});this.addOutput("out","number",{label:""});this.size=[60,20];this.addProperty("factor",1)}function l(){this.addInput("in","number");this.addOutput("out","number");this.size=[60,20];this.addProperty("samples",10);this._values=new Float32Array(10);this._current=0}function p(){this.addInput("A","number");this.addInput("B","number");this.addOutput("=","number");this.addProperty("A",1);this.addProperty("B",1);this.addProperty("OP","+","string",{values:p.values})}
function r(){this.addInput("A","number");this.addInput("B","number");this.addOutput("A==B","boolean");this.addOutput("A!=B","boolean");this.addProperty("A",0);this.addProperty("B",0)}function s(){this.addInput("A","number");this.addInput("B","number");this.addOutput("out","boolean");this.addProperty("A",1);this.addProperty("B",1);this.addProperty("OP",">","string",{values:s.values});this.size=[60,40]}function u(){this.addInput("inc","number");this.addOutput("total","number");this.addProperty("increment",
1);this.addProperty("value",0)}function t(){this.addInput("v","number");this.addOutput("sin","number");this.addProperty("amplitude",1);this.addProperty("offset",0);this.bgImageUrl="nodes/imgs/icon-sin.png"}function v(){this.addInput("vec2","vec2");this.addOutput("x","number");this.addOutput("y","number")}function w(){this.addInputs([["x","number"],["y","number"]]);this.addOutput("vec2","vec2");this.properties={x:0,y:0};this._data=new Float32Array(2)}function x(){this.addInput("vec3","vec3");this.addOutput("x",
"number");this.addOutput("y","number");this.addOutput("z","number")}function y(){this.addInputs([["x","number"],["y","number"],["z","number"]]);this.addOutput("vec3","vec3");this.properties={x:0,y:0,z:0};this._data=new Float32Array(3)}function z(){this.addInput("vec4","vec4");this.addOutput("x","number");this.addOutput("y","number");this.addOutput("z","number");this.addOutput("w","number")}function A(){this.addInputs([["x","number"],["y","number"],["z","number"],["w","number"]]);this.addOutput("vec4",
@@ -218,44 +222,44 @@ function(a){this.outputs[0].label=this._last_v?this._last_v.toFixed(3):"?"};d.pr
"clamp({{0}},"+this.properties.min+","+this.properties.max+")");return a};LiteGraph.registerNodeType("math/clamp",e);f.title="Abs";f.desc="Absolute";f.prototype.onExecute=function(){var a=this.getInputData(0);null!=a&&this.setOutputData(0,Math.abs(a))};LiteGraph.registerNodeType("math/abs",f);g.title="Floor";g.desc="Floor number to remove fractional part";g.prototype.onExecute=function(){var a=this.getInputData(0);null!=a&&this.setOutputData(0,Math.floor(a))};LiteGraph.registerNodeType("math/floor",
g);h.title="Frac";h.desc="Returns fractional part";h.prototype.onExecute=function(){var a=this.getInputData(0);null!=a&&this.setOutputData(0,a%1)};LiteGraph.registerNodeType("math/frac",h);k.title="Smoothstep";k.desc="Smoothstep";k.prototype.onExecute=function(){var a=this.getInputData(0);if(void 0!==a){var b=this.properties.A,a=Math.clamp((a-b)/(this.properties.B-b),0,1);this.setOutputData(0,a*a*(3-2*a))}};LiteGraph.registerNodeType("math/smoothstep",k);n.title="Scale";n.desc="v * factor";n.prototype.onExecute=
function(){var a=this.getInputData(0);null!=a&&this.setOutputData(0,a*this.properties.factor)};LiteGraph.registerNodeType("math/scale",n);l.title="Average";l.desc="Average Filter";l.prototype.onExecute=function(){var a=this.getInputData(0);null==a&&(a=0);var b=this._values.length;this._values[this._current%b]=a;this._current+=1;this._current>b&&(this._current=0);for(var c=a=0;c<b;++c)a+=this._values[c];this.setOutputData(0,a/b)};l.prototype.onPropertyChanged=function(a,b){1>b&&(b=1);this.properties.samples=
Math.round(b);var c=this._values;this._values=new Float32Array(this.properties.samples);c.length<=this._values.length?this._values.set(c):this._values.set(c.subarray(0,this._values.length))};LiteGraph.registerNodeType("math/average",l);q.values="+-*/%^".split("");q.title="Operation";q.desc="Easy math operators";q["@OP"]={type:"enum",title:"operation",values:q.values};q.prototype.setValue=function(a){"string"==typeof a&&(a=parseFloat(a));this.properties.value=a};q.prototype.onExecute=function(){var a=
this.getInputData(0),b=this.getInputData(1);null!=a?this.properties.A=a:a=this.properties.A;null!=b?this.properties.B=b:b=this.properties.B;var c=0;switch(this.properties.OP){case "+":c=a+b;break;case "-":c=a-b;break;case "x":case "X":case "*":c=a*b;break;case "/":c=a/b;break;case "%":c=a%b;break;case "^":c=Math.pow(a,b);break;default:console.warn("Unknown operation: "+this.properties.OP)}this.setOutputData(0,c)};q.prototype.onDrawBackground=function(a){this.flags.collapsed||(a.font="40px Arial",
a.fillStyle="black",a.textAlign="center",a.fillText(this.properties.OP,0.5*this.size[0],0.5*this.size[1]+LiteGraph.NODE_TITLE_HEIGHT),a.textAlign="left")};LiteGraph.registerNodeType("math/operation",q);r.title="Compare";r.desc="compares between two values";r.prototype.onExecute=function(){var a=this.getInputData(0),b=this.getInputData(1);void 0!==a?this.properties.A=a:a=this.properties.A;void 0!==b?this.properties.B=b:b=this.properties.B;for(var c=0,d=this.outputs.length;c<d;++c){var e=this.outputs[c];
Math.round(b);var c=this._values;this._values=new Float32Array(this.properties.samples);c.length<=this._values.length?this._values.set(c):this._values.set(c.subarray(0,this._values.length))};LiteGraph.registerNodeType("math/average",l);p.values="+-*/%^".split("");p.title="Operation";p.desc="Easy math operators";p["@OP"]={type:"enum",title:"operation",values:p.values};p.prototype.setValue=function(a){"string"==typeof a&&(a=parseFloat(a));this.properties.value=a};p.prototype.onExecute=function(){var a=
this.getInputData(0),b=this.getInputData(1);null!=a?this.properties.A=a:a=this.properties.A;null!=b?this.properties.B=b:b=this.properties.B;var c=0;switch(this.properties.OP){case "+":c=a+b;break;case "-":c=a-b;break;case "x":case "X":case "*":c=a*b;break;case "/":c=a/b;break;case "%":c=a%b;break;case "^":c=Math.pow(a,b);break;default:console.warn("Unknown operation: "+this.properties.OP)}this.setOutputData(0,c)};p.prototype.onDrawBackground=function(a){this.flags.collapsed||(a.font="40px Arial",
a.fillStyle="black",a.textAlign="center",a.fillText(this.properties.OP,0.5*this.size[0],0.5*this.size[1]+LiteGraph.NODE_TITLE_HEIGHT),a.textAlign="left")};LiteGraph.registerNodeType("math/operation",p);r.title="Compare";r.desc="compares between two values";r.prototype.onExecute=function(){var a=this.getInputData(0),b=this.getInputData(1);void 0!==a?this.properties.A=a:a=this.properties.A;void 0!==b?this.properties.B=b:b=this.properties.B;for(var c=0,d=this.outputs.length;c<d;++c){var e=this.outputs[c];
if(e.links&&e.links.length){switch(e.name){case "A==B":value=a==b;break;case "A!=B":value=a!=b;break;case "A>B":value=a>b;break;case "A<B":value=a<b;break;case "A<=B":value=a<=b;break;case "A>=B":value=a>=b}this.setOutputData(c,value)}}};r.prototype.onGetOutputs=function(){return[["A==B","boolean"],["A!=B","boolean"],["A>B","boolean"],["A<B","boolean"],["A>=B","boolean"],["A<=B","boolean"]]};LiteGraph.registerNodeType("math/compare",r);s.values="> < == != <= >=".split(" ");s["@OP"]={type:"enum",title:"operation",
values:s.values};s.title="Condition";s.desc="evaluates condition between A and B";s.prototype.onExecute=function(){var a=this.getInputData(0);void 0===a?a=this.properties.A:this.properties.A=a;var b=this.getInputData(1);void 0===b?b=this.properties.B:this.properties.B=b;var c=!0;switch(this.properties.OP){case ">":c=a>b;break;case "<":c=a<b;break;case "==":c=a==b;break;case "!=":c=a!=b;break;case "<=":c=a<=b;break;case ">=":c=a>=b}this.setOutputData(0,c)};LiteGraph.registerNodeType("math/condition",
s);u.title="Accumulate";u.desc="Increments a value every time";u.prototype.onExecute=function(){null===this.properties.value&&(this.properties.value=0);var a=this.getInputData(0);this.properties.value=null!==a?this.properties.value+a:this.properties.value+this.properties.increment;this.setOutputData(0,this.properties.value)};LiteGraph.registerNodeType("math/accumulate",u);t.title="Trigonometry";t.desc="Sin Cos Tan";t.filter="shader";t.prototype.onExecute=function(){var a=this.getInputData(0);null==
a&&(a=0);var b=this.properties.amplitude,c=this.findInputSlot("amplitude");-1!=c&&(b=this.getInputData(c));var d=this.properties.offset,c=this.findInputSlot("offset");-1!=c&&(d=this.getInputData(c));for(var c=0,e=this.outputs.length;c<e;++c){switch(this.outputs[c].name){case "sin":value=Math.sin(a);break;case "cos":value=Math.cos(a);break;case "tan":value=Math.tan(a);break;case "asin":value=Math.asin(a);break;case "acos":value=Math.acos(a);break;case "atan":value=Math.atan(a)}this.setOutputData(c,
b*value+d)}};t.prototype.onGetInputs=function(){return[["v","number"],["amplitude","number"],["offset","number"]]};t.prototype.onGetOutputs=function(){return[["sin","number"],["cos","number"],["tan","number"],["asin","number"],["acos","number"],["atan","number"]]};LiteGraph.registerNodeType("math/trigonometry",t);if(window.math){var p=function(){this.addInputs("x","number");this.addInputs("y","number");this.addOutputs("","number");this.properties={x:1,y:1,formula:"x+y"}};p.title="Formula";p.desc=
"Compute safe formula";p.prototype.onExecute=function(){var a=this.getInputData(0),b=this.getInputData(1);null!=a?this.properties.x=a:a=this.properties.x;null!=b?this.properties.y=b:b=this.properties.y;a=math.eval(this.properties.formula,{x:a,y:b,T:this.graph.globaltime});this.setOutputData(0,a)};p.prototype.onDrawBackground=function(){this.outputs[0].label=this.properties.formula};p.prototype.onGetOutputs=function(){return[["A-B","number"],["A*B","number"],["A/B","number"]]};LiteGraph.registerNodeType("math/formula",
p)}v.title="Vec2->XY";v.desc="vector 2 to components";v.prototype.onExecute=function(){var a=this.getInputData(0);null!=a&&(this.setOutputData(0,a[0]),this.setOutputData(1,a[1]))};LiteGraph.registerNodeType("math3d/vec2-to-xyz",v);w.title="XY->Vec2";w.desc="components to vector2";w.prototype.onExecute=function(){var a=this.getInputData(0);null==a&&(a=this.properties.x);var b=this.getInputData(1);null==b&&(b=this.properties.y);var c=this._data;c[0]=a;c[1]=b;this.setOutputData(0,c)};LiteGraph.registerNodeType("math3d/xy-to-vec2",
b*value+d)}};t.prototype.onGetInputs=function(){return[["v","number"],["amplitude","number"],["offset","number"]]};t.prototype.onGetOutputs=function(){return[["sin","number"],["cos","number"],["tan","number"],["asin","number"],["acos","number"],["atan","number"]]};LiteGraph.registerNodeType("math/trigonometry",t);if(window.math){var q=function(){this.addInputs("x","number");this.addInputs("y","number");this.addOutputs("","number");this.properties={x:1,y:1,formula:"x+y"}};q.title="Formula";q.desc=
"Compute safe formula";q.prototype.onExecute=function(){var a=this.getInputData(0),b=this.getInputData(1);null!=a?this.properties.x=a:a=this.properties.x;null!=b?this.properties.y=b:b=this.properties.y;a=math.eval(this.properties.formula,{x:a,y:b,T:this.graph.globaltime});this.setOutputData(0,a)};q.prototype.onDrawBackground=function(){this.outputs[0].label=this.properties.formula};q.prototype.onGetOutputs=function(){return[["A-B","number"],["A*B","number"],["A/B","number"]]};LiteGraph.registerNodeType("math/formula",
q)}v.title="Vec2->XY";v.desc="vector 2 to components";v.prototype.onExecute=function(){var a=this.getInputData(0);null!=a&&(this.setOutputData(0,a[0]),this.setOutputData(1,a[1]))};LiteGraph.registerNodeType("math3d/vec2-to-xyz",v);w.title="XY->Vec2";w.desc="components to vector2";w.prototype.onExecute=function(){var a=this.getInputData(0);null==a&&(a=this.properties.x);var b=this.getInputData(1);null==b&&(b=this.properties.y);var c=this._data;c[0]=a;c[1]=b;this.setOutputData(0,c)};LiteGraph.registerNodeType("math3d/xy-to-vec2",
w);x.title="Vec3->XYZ";x.desc="vector 3 to components";x.prototype.onExecute=function(){var a=this.getInputData(0);null!=a&&(this.setOutputData(0,a[0]),this.setOutputData(1,a[1]),this.setOutputData(2,a[2]))};LiteGraph.registerNodeType("math3d/vec3-to-xyz",x);y.title="XYZ->Vec3";y.desc="components to vector3";y.prototype.onExecute=function(){var a=this.getInputData(0);null==a&&(a=this.properties.x);var b=this.getInputData(1);null==b&&(b=this.properties.y);var c=this.getInputData(2);null==c&&(c=this.properties.z);
var d=this._data;d[0]=a;d[1]=b;d[2]=c;this.setOutputData(0,d)};LiteGraph.registerNodeType("math3d/xyz-to-vec3",y);z.title="Vec4->XYZW";z.desc="vector 4 to components";z.prototype.onExecute=function(){var a=this.getInputData(0);null!=a&&(this.setOutputData(0,a[0]),this.setOutputData(1,a[1]),this.setOutputData(2,a[2]),this.setOutputData(3,a[3]))};LiteGraph.registerNodeType("math3d/vec4-to-xyzw",z);A.title="XYZW->Vec4";A.desc="components to vector4";A.prototype.onExecute=function(){var a=this.getInputData(0);
null==a&&(a=this.properties.x);var b=this.getInputData(1);null==b&&(b=this.properties.y);var c=this.getInputData(2);null==c&&(c=this.properties.z);var d=this.getInputData(3);null==d&&(d=this.properties.w);var e=this._data;e[0]=a;e[1]=b;e[2]=c;e[3]=d;this.setOutputData(0,e)};LiteGraph.registerNodeType("math3d/xyzw-to-vec4",A);window.glMatrix&&(p=function(){this.addOutput("quat","quat");this.properties={x:0,y:0,z:0,w:1};this._value=quat.create()},p.title="Quaternion",p.desc="quaternion",p.prototype.onExecute=
function(){this._value[0]=this.properties.x;this._value[1]=this.properties.y;this._value[2]=this.properties.z;this._value[3]=this.properties.w;this.setOutputData(0,this._value)},LiteGraph.registerNodeType("math3d/quaternion",p),p=function(){this.addInputs([["degrees","number"],["axis","vec3"]]);this.addOutput("quat","quat");this.properties={angle:90,axis:vec3.fromValues(0,1,0)};this._value=quat.create()},p.title="Rotation",p.desc="quaternion rotation",p.prototype.onExecute=function(){var a=this.getInputData(0);
null==a&&(a=this.properties.angle);var b=this.getInputData(1);null==b&&(b=this.properties.axis);a=quat.setAxisAngle(this._value,b,0.0174532925*a);this.setOutputData(0,a)},LiteGraph.registerNodeType("math3d/rotation",p),p=function(){this.addInputs([["vec3","vec3"],["quat","quat"]]);this.addOutput("result","vec3");this.properties={vec:[0,0,1]}},p.title="Rot. Vec3",p.desc="rotate a point",p.prototype.onExecute=function(){var a=this.getInputData(0);null==a&&(a=this.properties.vec);var b=this.getInputData(1);
null==b?this.setOutputData(a):this.setOutputData(0,vec3.transformQuat(vec3.create(),a,b))},LiteGraph.registerNodeType("math3d/rotate_vec3",p),p=function(){this.addInputs([["A","quat"],["B","quat"]]);this.addOutput("A*B","quat");this._value=quat.create()},p.title="Mult. Quat",p.desc="rotate quaternion",p.prototype.onExecute=function(){var a=this.getInputData(0);if(null!=a){var b=this.getInputData(1);null!=b&&(a=quat.multiply(this._value,a,b),this.setOutputData(0,a))}},LiteGraph.registerNodeType("math3d/mult-quat",
p),p=function(){this.addInputs([["A","quat"],["B","quat"],["factor","number"]]);this.addOutput("slerp","quat");this.addProperty("factor",0.5);this._value=quat.create()},p.title="Quat Slerp",p.desc="quaternion spherical interpolation",p.prototype.onExecute=function(){var a=this.getInputData(0);if(null!=a){var b=this.getInputData(1);if(null!=b){var c=this.properties.factor;null!=this.getInputData(2)&&(c=this.getInputData(2));a=quat.slerp(this._value,a,b,c);this.setOutputData(0,a)}}},LiteGraph.registerNodeType("math3d/quat-slerp",
p))})();function Selector(){this.addInput("sel","boolean");this.addOutput("value","number");this.properties={A:0,B:1};this.size=[60,20]}Selector.title="Selector";Selector.desc="outputs A if selector is true, B if selector is false";
null==a&&(a=this.properties.x);var b=this.getInputData(1);null==b&&(b=this.properties.y);var c=this.getInputData(2);null==c&&(c=this.properties.z);var d=this.getInputData(3);null==d&&(d=this.properties.w);var e=this._data;e[0]=a;e[1]=b;e[2]=c;e[3]=d;this.setOutputData(0,e)};LiteGraph.registerNodeType("math3d/xyzw-to-vec4",A);window.glMatrix&&(q=function(){this.addOutput("quat","quat");this.properties={x:0,y:0,z:0,w:1};this._value=quat.create()},q.title="Quaternion",q.desc="quaternion",q.prototype.onExecute=
function(){this._value[0]=this.properties.x;this._value[1]=this.properties.y;this._value[2]=this.properties.z;this._value[3]=this.properties.w;this.setOutputData(0,this._value)},LiteGraph.registerNodeType("math3d/quaternion",q),q=function(){this.addInputs([["degrees","number"],["axis","vec3"]]);this.addOutput("quat","quat");this.properties={angle:90,axis:vec3.fromValues(0,1,0)};this._value=quat.create()},q.title="Rotation",q.desc="quaternion rotation",q.prototype.onExecute=function(){var a=this.getInputData(0);
null==a&&(a=this.properties.angle);var b=this.getInputData(1);null==b&&(b=this.properties.axis);a=quat.setAxisAngle(this._value,b,0.0174532925*a);this.setOutputData(0,a)},LiteGraph.registerNodeType("math3d/rotation",q),q=function(){this.addInputs([["vec3","vec3"],["quat","quat"]]);this.addOutput("result","vec3");this.properties={vec:[0,0,1]}},q.title="Rot. Vec3",q.desc="rotate a point",q.prototype.onExecute=function(){var a=this.getInputData(0);null==a&&(a=this.properties.vec);var b=this.getInputData(1);
null==b?this.setOutputData(a):this.setOutputData(0,vec3.transformQuat(vec3.create(),a,b))},LiteGraph.registerNodeType("math3d/rotate_vec3",q),q=function(){this.addInputs([["A","quat"],["B","quat"]]);this.addOutput("A*B","quat");this._value=quat.create()},q.title="Mult. Quat",q.desc="rotate quaternion",q.prototype.onExecute=function(){var a=this.getInputData(0);if(null!=a){var b=this.getInputData(1);null!=b&&(a=quat.multiply(this._value,a,b),this.setOutputData(0,a))}},LiteGraph.registerNodeType("math3d/mult-quat",
q),q=function(){this.addInputs([["A","quat"],["B","quat"],["factor","number"]]);this.addOutput("slerp","quat");this.addProperty("factor",0.5);this._value=quat.create()},q.title="Quat Slerp",q.desc="quaternion spherical interpolation",q.prototype.onExecute=function(){var a=this.getInputData(0);if(null!=a){var b=this.getInputData(1);if(null!=b){var c=this.properties.factor;null!=this.getInputData(2)&&(c=this.getInputData(2));a=quat.slerp(this._value,a,b,c);this.setOutputData(0,a)}}},LiteGraph.registerNodeType("math3d/quat-slerp",
q))})();function Selector(){this.addInput("sel","boolean");this.addOutput("value","number");this.properties={A:0,B:1};this.size=[60,20]}Selector.title="Selector";Selector.desc="outputs A if selector is true, B if selector is false";
Selector.prototype.onExecute=function(){var a=this.getInputData(0);if(void 0!==a){for(var b=1;b<this.inputs.length;b++){var c=this.inputs[b],d=this.getInputData(b);void 0!==d&&(this.properties[c.name]=d)}b=this.properties.A;c=this.properties.B;this.setOutputData(0,a?b:c)}};Selector.prototype.onGetInputs=function(){return[["A",0],["B",0]]};LiteGraph.registerNodeType("logic/selector",Selector);
(function(){function a(){this.inputs=[];this.addOutput("frame","image");this.properties={url:""}}function b(){this.addInput("f","number");this.addOutput("Color","color");this.properties={colorA:"#444444",colorB:"#44AAFF",colorC:"#44FFAA",colorD:"#FFFFFF"}}function c(){this.addInput("","image");this.size=[200,200]}function d(){this.addInputs([["img1","image"],["img2","image"],["fade","number"]]);this.addInput("","image");this.properties={fade:0.5,width:512,height:512}}function e(){this.addInput("",
"image");this.addOutputs("","image");this.properties={width:256,height:256,x:0,y:0,scale:1};this.size=[50,20]}function f(){this.addInput("t","number");this.addOutputs([["frame","image"],["t","number"],["d","number"]]);this.properties={url:""}}function g(){this.addOutput("Webcam","image");this.properties={}}a.title="Image";a.desc="Image loader";a.widgets=[{name:"load",text:"Load",type:"button"}];a.prototype.onAdded=function(){""!=this.properties.url&&null==this.img&&this.loadImage(this.properties.url)};
a.prototype.onDrawBackground=function(a){this.img&&5<this.size[0]&&5<this.size[1]&&a.drawImage(this.img,0,0,this.size[0],this.size[1])};a.prototype.onExecute=function(){this.img||(this.boxcolor="#000");this.img&&this.img.width?this.setOutputData(0,this.img):this.setOutputData(0,null);this.img&&this.img.dirty&&(this.img.dirty=!1)};a.prototype.onPropertyChanged=function(a,b){this.properties[a]=b;"url"==a&&""!=b&&this.loadImage(b);return!0};a.prototype.onDropFile=function(a,b){var c=new Image;c.src=
a;this.img=c};a.prototype.loadImage=function(a){if(""==a)this.img=null;else{this.img=document.createElement("img");a=name;"http://"==a.substr(0,7)&&LiteGraph.proxy&&(a=LiteGraph.proxy+a.substr(7));this.img.src=a;this.boxcolor="#F95";var b=this;this.img.onload=function(){b.trace("Image loaded, size: "+b.img.width+"x"+b.img.height);this.dirty=!0;b.boxcolor="#9F9";b.setDirtyCanvas(!0)}}};a.prototype.onWidget=function(a,b){"load"==b.name&&this.loadImage(this.properties.url)};LiteGraph.registerNodeType("graphics/image",
a);b.title="Palette";b.desc="Generates a color";b.prototype.onExecute=function(){var a=[];null!=this.properties.colorA&&a.push(hex2num(this.properties.colorA));null!=this.properties.colorB&&a.push(hex2num(this.properties.colorB));null!=this.properties.colorC&&a.push(hex2num(this.properties.colorC));null!=this.properties.colorD&&a.push(hex2num(this.properties.colorD));var b=this.getInputData(0);null==b&&(b=0.5);1<b?b=1:0>b&&(b=0);if(0!=a.length){var c=[0,0,0];if(0==b)c=a[0];else if(1==b)c=a[a.length-
1];else{var d=(a.length-1)*b,b=a[Math.floor(d)],a=a[Math.floor(d)+1],d=d-Math.floor(d);c[0]=b[0]*(1-d)+a[0]*d;c[1]=b[1]*(1-d)+a[1]*d;c[2]=b[2]*(1-d)+a[2]*d}for(var e in c)c[e]/=255;this.boxcolor=colorToString(c);this.setOutputData(0,c)}};LiteGraph.registerNodeType("color/palette",b);c.title="Frame";c.desc="Frame viewerew";c.widgets=[{name:"resize",text:"Resize box",type:"button"},{name:"view",text:"View Image",type:"button"}];c.prototype.onDrawBackground=function(a){this.frame&&a.drawImage(this.frame,
0,0,this.size[0],this.size[1])};c.prototype.onExecute=function(){this.frame=this.getInputData(0);this.setDirtyCanvas(!0)};c.prototype.onWidget=function(a,b){if("resize"==b.name&&this.frame){var c=this.frame.width,d=this.frame.height;c||null==this.frame.videoWidth||(c=this.frame.videoWidth,d=this.frame.videoHeight);c&&d&&(this.size=[c,d]);this.setDirtyCanvas(!0,!0)}else"view"==b.name&&this.show()};c.prototype.show=function(){showElement&&this.frame&&showElement(this.frame)};LiteGraph.registerNodeType("graphics/frame",
c);d.title="Image fade";d.desc="Fades between images";d.widgets=[{name:"resizeA",text:"Resize to A",type:"button"},{name:"resizeB",text:"Resize to B",type:"button"}];d.prototype.onAdded=function(){this.createCanvas();var a=this.canvas.getContext("2d");a.fillStyle="#000";a.fillRect(0,0,this.properties.width,this.properties.height)};d.prototype.createCanvas=function(){this.canvas=document.createElement("canvas");this.canvas.width=this.properties.width;this.canvas.height=this.properties.height};d.prototype.onExecute=
function(){var a=this.canvas.getContext("2d");this.canvas.width=this.canvas.width;var b=this.getInputData(0);null!=b&&a.drawImage(b,0,0,this.canvas.width,this.canvas.height);b=this.getInputData(2);null==b?b=this.properties.fade:this.properties.fade=b;a.globalAlpha=b;b=this.getInputData(1);null!=b&&a.drawImage(b,0,0,this.canvas.width,this.canvas.height);a.globalAlpha=1;this.setOutputData(0,this.canvas);this.setDirtyCanvas(!0)};LiteGraph.registerNodeType("graphics/imagefade",d);e.title="Crop";e.desc=
"Crop Image";e.prototype.onAdded=function(){this.createCanvas()};e.prototype.createCanvas=function(){this.canvas=document.createElement("canvas");this.canvas.width=this.properties.width;this.canvas.height=this.properties.height};e.prototype.onExecute=function(){var a=this.getInputData(0);a&&(a.width?(this.canvas.getContext("2d").drawImage(a,-this.properties.x,-this.properties.y,a.width*this.properties.scale,a.height*this.properties.scale),this.setOutputData(0,this.canvas)):this.setOutputData(0,null))};
e.prototype.onPropertyChanged=function(a,b){this.properties[a]=b;"scale"==a?(this.properties[a]=parseFloat(b),0==this.properties[a]&&(this.trace("Error in scale"),this.properties[a]=1)):this.properties[a]=parseInt(b);this.createCanvas();return!0};LiteGraph.registerNodeType("graphics/cropImage",d);f.title="Video";f.desc="Video playback";f.widgets=[{name:"play",text:"PLAY",type:"minibutton"},{name:"stop",text:"STOP",type:"minibutton"},{name:"demo",text:"Demo video",type:"button"},{name:"mute",text:"Mute video",
type:"button"}];f.prototype.onExecute=function(){if(this.properties.url&&(this.properties.url!=this._video_url&&this.loadVideo(this.properties.url),this._video&&0!=this._video.width)){var a=this.getInputData(0);a&&0<=a&&1>=a&&(this._video.currentTime=a*this._video.duration,this._video.pause());this._video.dirty=!0;this.setOutputData(0,this._video);this.setOutputData(1,this._video.currentTime);this.setOutputData(2,this._video.duration);this.setDirtyCanvas(!0)}};f.prototype.onStart=function(){this.play()};
f.prototype.onStop=function(){this.stop()};f.prototype.loadVideo=function(a){this._video_url=a;this._video=document.createElement("video");this._video.src=a;this._video.type="type=video/mp4";this._video.muted=!0;this._video.autoplay=!0;var b=this;this._video.addEventListener("loadedmetadata",function(a){b.trace("Duration: "+this.duration+" seconds");b.trace("Size: "+this.videoWidth+","+this.videoHeight);b.setDirtyCanvas(!0);this.width=this.videoWidth;this.height=this.videoHeight});this._video.addEventListener("progress",
function(a){});this._video.addEventListener("error",function(a){console.log("Error loading video: "+this.src);b.trace("Error loading video: "+this.src);if(this.error)switch(this.error.code){case this.error.MEDIA_ERR_ABORTED:b.trace("You stopped the video.");break;case this.error.MEDIA_ERR_NETWORK:b.trace("Network error - please try again later.");break;case this.error.MEDIA_ERR_DECODE:b.trace("Video is broken..");break;case this.error.MEDIA_ERR_SRC_NOT_SUPPORTED:b.trace("Sorry, your browser can't play this video.")}});
this._video.addEventListener("ended",function(a){b.trace("Ended.");this.play()})};f.prototype.onPropertyChanged=function(a,b){this.properties[a]=b;"url"==a&&""!=b&&this.loadVideo(b);return!0};f.prototype.play=function(){this._video&&this._video.play()};f.prototype.playPause=function(){this._video&&(this._video.paused?this.play():this.pause())};f.prototype.stop=function(){this._video&&(this._video.pause(),this._video.currentTime=0)};f.prototype.pause=function(){this._video&&(this.trace("Video paused"),
this._video.pause())};f.prototype.onWidget=function(a,b){};LiteGraph.registerNodeType("graphics/video",f);g.title="Webcam";g.desc="Webcam image";g.prototype.openStream=function(){function a(c){console.log("Webcam rejected",c);b._webcam_stream=!1;b.box_color="red"}navigator.getUserMedia=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;window.URL=window.URL||window.webkitURL;if(navigator.getUserMedia){this._waiting_confirmation=!0;navigator.getUserMedia({video:!0},
this.streamReady.bind(this),a);var b=this}};g.prototype.onRemoved=function(){this._webcam_stream&&(this._webcam_stream.stop(),this._video=this._webcam_stream=null)};g.prototype.streamReady=function(a){this._webcam_stream=a;var b=this._video;b||(b=document.createElement("video"),b.autoplay=!0,b.src=window.URL.createObjectURL(a),this._video=b,b.onloadedmetadata=function(a){console.log(a)})};g.prototype.onExecute=function(){null!=this._webcam_stream||this._waiting_confirmation||this.openStream();this._video&&
this._video.videoWidth&&(this._video.width=this._video.videoWidth,this._video.height=this._video.videoHeight,this.setOutputData(0,this._video))};g.prototype.getExtraMenuOptions=function(a){var b=this;return[{content:b.properties.show?"Hide Frame":"Show Frame",callback:function(){b.properties.show=!b.properties.show}}]};g.prototype.onDrawBackground=function(a){this.flags.collapsed||20>=this.size[1]||!this.properties.show||!this._video||(a.save(),a.drawImage(this._video,0,0,this.size[0],this.size[1]),
a.restore())};LiteGraph.registerNodeType("graphics/webcam",g)})();
"image");this.addOutput("","image");this.properties={width:256,height:256,x:0,y:0,scale:1};this.size=[50,20]}function f(){this.addInput("t","number");this.addOutputs([["frame","image"],["t","number"],["d","number"]]);this.properties={url:""}}function g(){this.addOutput("Webcam","image");this.properties={}}a.title="Image";a.desc="Image loader";a.widgets=[{name:"load",text:"Load",type:"button"}];a.supported_extensions=["jpg","jpeg","png","gif"];a.prototype.onAdded=function(){""!=this.properties.url&&
null==this.img&&this.loadImage(this.properties.url)};a.prototype.onDrawBackground=function(a){this.img&&5<this.size[0]&&5<this.size[1]&&a.drawImage(this.img,0,0,this.size[0],this.size[1])};a.prototype.onExecute=function(){this.img||(this.boxcolor="#000");this.img&&this.img.width?this.setOutputData(0,this.img):this.setOutputData(0,null);this.img&&this.img.dirty&&(this.img.dirty=!1)};a.prototype.onPropertyChanged=function(a,b){this.properties[a]=b;"url"==a&&""!=b&&this.loadImage(b);return!0};a.prototype.loadImage=
function(a,b){if(""==a)this.img=null;else{this.img=document.createElement("img");"http://"==a.substr(0,7)&&LiteGraph.proxy&&(a=LiteGraph.proxy+a.substr(7));this.img.src=a;this.boxcolor="#F95";var c=this;this.img.onload=function(){b&&b(this);c.trace("Image loaded, size: "+c.img.width+"x"+c.img.height);this.dirty=!0;c.boxcolor="#9F9";c.setDirtyCanvas(!0)}}};a.prototype.onWidget=function(a,b){"load"==b.name&&this.loadImage(this.properties.url)};a.prototype.onDropFile=function(a){var b=this;this._url&&
URL.revokeObjectURL(this._url);this._url=URL.createObjectURL(a);this.properties.url=this._url;this.loadImage(this._url,function(a){b.size[1]=a.height/a.width*b.size[0]})};LiteGraph.registerNodeType("graphics/image",a);b.title="Palette";b.desc="Generates a color";b.prototype.onExecute=function(){var a=[];null!=this.properties.colorA&&a.push(hex2num(this.properties.colorA));null!=this.properties.colorB&&a.push(hex2num(this.properties.colorB));null!=this.properties.colorC&&a.push(hex2num(this.properties.colorC));
null!=this.properties.colorD&&a.push(hex2num(this.properties.colorD));var b=this.getInputData(0);null==b&&(b=0.5);1<b?b=1:0>b&&(b=0);if(0!=a.length){var c=[0,0,0];if(0==b)c=a[0];else if(1==b)c=a[a.length-1];else{var d=(a.length-1)*b,b=a[Math.floor(d)],a=a[Math.floor(d)+1],d=d-Math.floor(d);c[0]=b[0]*(1-d)+a[0]*d;c[1]=b[1]*(1-d)+a[1]*d;c[2]=b[2]*(1-d)+a[2]*d}for(var e in c)c[e]/=255;this.boxcolor=colorToString(c);this.setOutputData(0,c)}};LiteGraph.registerNodeType("color/palette",b);c.title="Frame";
c.desc="Frame viewerew";c.widgets=[{name:"resize",text:"Resize box",type:"button"},{name:"view",text:"View Image",type:"button"}];c.prototype.onDrawBackground=function(a){this.frame&&a.drawImage(this.frame,0,0,this.size[0],this.size[1])};c.prototype.onExecute=function(){this.frame=this.getInputData(0);this.setDirtyCanvas(!0)};c.prototype.onWidget=function(a,b){if("resize"==b.name&&this.frame){var c=this.frame.width,d=this.frame.height;c||null==this.frame.videoWidth||(c=this.frame.videoWidth,d=this.frame.videoHeight);
c&&d&&(this.size=[c,d]);this.setDirtyCanvas(!0,!0)}else"view"==b.name&&this.show()};c.prototype.show=function(){showElement&&this.frame&&showElement(this.frame)};LiteGraph.registerNodeType("graphics/frame",c);d.title="Image fade";d.desc="Fades between images";d.widgets=[{name:"resizeA",text:"Resize to A",type:"button"},{name:"resizeB",text:"Resize to B",type:"button"}];d.prototype.onAdded=function(){this.createCanvas();var a=this.canvas.getContext("2d");a.fillStyle="#000";a.fillRect(0,0,this.properties.width,
this.properties.height)};d.prototype.createCanvas=function(){this.canvas=document.createElement("canvas");this.canvas.width=this.properties.width;this.canvas.height=this.properties.height};d.prototype.onExecute=function(){var a=this.canvas.getContext("2d");this.canvas.width=this.canvas.width;var b=this.getInputData(0);null!=b&&a.drawImage(b,0,0,this.canvas.width,this.canvas.height);b=this.getInputData(2);null==b?b=this.properties.fade:this.properties.fade=b;a.globalAlpha=b;b=this.getInputData(1);
null!=b&&a.drawImage(b,0,0,this.canvas.width,this.canvas.height);a.globalAlpha=1;this.setOutputData(0,this.canvas);this.setDirtyCanvas(!0)};LiteGraph.registerNodeType("graphics/imagefade",d);e.title="Crop";e.desc="Crop Image";e.prototype.onAdded=function(){this.createCanvas()};e.prototype.createCanvas=function(){this.canvas=document.createElement("canvas");this.canvas.width=this.properties.width;this.canvas.height=this.properties.height};e.prototype.onExecute=function(){var a=this.getInputData(0);
a&&(a.width?(this.canvas.getContext("2d").drawImage(a,-this.properties.x,-this.properties.y,a.width*this.properties.scale,a.height*this.properties.scale),this.setOutputData(0,this.canvas)):this.setOutputData(0,null))};e.prototype.onDrawBackground=function(a){this.flags.collapsed||this.canvas&&a.drawImage(this.canvas,0,0,this.canvas.width,this.canvas.height,0,0,this.size[0],this.size[1])};e.prototype.onPropertyChanged=function(a,b){this.properties[a]=b;"scale"==a?(this.properties[a]=parseFloat(b),
0==this.properties[a]&&(this.trace("Error in scale"),this.properties[a]=1)):this.properties[a]=parseInt(b);this.createCanvas();return!0};LiteGraph.registerNodeType("graphics/cropImage",e);f.title="Video";f.desc="Video playback";f.widgets=[{name:"play",text:"PLAY",type:"minibutton"},{name:"stop",text:"STOP",type:"minibutton"},{name:"demo",text:"Demo video",type:"button"},{name:"mute",text:"Mute video",type:"button"}];f.prototype.onExecute=function(){if(this.properties.url&&(this.properties.url!=this._video_url&&
this.loadVideo(this.properties.url),this._video&&0!=this._video.width)){var a=this.getInputData(0);a&&0<=a&&1>=a&&(this._video.currentTime=a*this._video.duration,this._video.pause());this._video.dirty=!0;this.setOutputData(0,this._video);this.setOutputData(1,this._video.currentTime);this.setOutputData(2,this._video.duration);this.setDirtyCanvas(!0)}};f.prototype.onStart=function(){this.play()};f.prototype.onStop=function(){this.stop()};f.prototype.loadVideo=function(a){this._video_url=a;this._video=
document.createElement("video");this._video.src=a;this._video.type="type=video/mp4";this._video.muted=!0;this._video.autoplay=!0;var b=this;this._video.addEventListener("loadedmetadata",function(a){b.trace("Duration: "+this.duration+" seconds");b.trace("Size: "+this.videoWidth+","+this.videoHeight);b.setDirtyCanvas(!0);this.width=this.videoWidth;this.height=this.videoHeight});this._video.addEventListener("progress",function(a){});this._video.addEventListener("error",function(a){console.log("Error loading video: "+
this.src);b.trace("Error loading video: "+this.src);if(this.error)switch(this.error.code){case this.error.MEDIA_ERR_ABORTED:b.trace("You stopped the video.");break;case this.error.MEDIA_ERR_NETWORK:b.trace("Network error - please try again later.");break;case this.error.MEDIA_ERR_DECODE:b.trace("Video is broken..");break;case this.error.MEDIA_ERR_SRC_NOT_SUPPORTED:b.trace("Sorry, your browser can't play this video.")}});this._video.addEventListener("ended",function(a){b.trace("Ended.");this.play()})};
f.prototype.onPropertyChanged=function(a,b){this.properties[a]=b;"url"==a&&""!=b&&this.loadVideo(b);return!0};f.prototype.play=function(){this._video&&this._video.play()};f.prototype.playPause=function(){this._video&&(this._video.paused?this.play():this.pause())};f.prototype.stop=function(){this._video&&(this._video.pause(),this._video.currentTime=0)};f.prototype.pause=function(){this._video&&(this.trace("Video paused"),this._video.pause())};f.prototype.onWidget=function(a,b){};LiteGraph.registerNodeType("graphics/video",
f);g.title="Webcam";g.desc="Webcam image";g.prototype.openStream=function(){function a(c){console.log("Webcam rejected",c);b._webcam_stream=!1;b.box_color="red"}navigator.getUserMedia=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;window.URL=window.URL||window.webkitURL;if(navigator.getUserMedia){this._waiting_confirmation=!0;navigator.getUserMedia({video:!0},this.streamReady.bind(this),a);var b=this}};g.prototype.onRemoved=function(){this._webcam_stream&&
(this._webcam_stream.stop(),this._video=this._webcam_stream=null)};g.prototype.streamReady=function(a){this._webcam_stream=a;var b=this._video;b||(b=document.createElement("video"),b.autoplay=!0,b.src=window.URL.createObjectURL(a),this._video=b,b.onloadedmetadata=function(a){console.log(a)})};g.prototype.onExecute=function(){null!=this._webcam_stream||this._waiting_confirmation||this.openStream();this._video&&this._video.videoWidth&&(this._video.width=this._video.videoWidth,this._video.height=this._video.videoHeight,
this.setOutputData(0,this._video))};g.prototype.getExtraMenuOptions=function(a){var b=this;return[{content:b.properties.show?"Hide Frame":"Show Frame",callback:function(){b.properties.show=!b.properties.show}}]};g.prototype.onDrawBackground=function(a){this.flags.collapsed||20>=this.size[1]||!this.properties.show||!this._video||(a.save(),a.drawImage(this._video,0,0,this.size[0],this.size[1]),a.restore())};LiteGraph.registerNodeType("graphics/webcam",g)})();
if("undefined"!=typeof LiteGraph){var LGraphTexture=function(){this.addOutput("Texture","Texture");this.properties={name:"",filter:!0};this.size=[LGraphTexture.image_preview_size,LGraphTexture.image_preview_size]};LGraphTexture.title="Texture";LGraphTexture.desc="Texture";LGraphTexture.widgets_info={name:{widget:"texture"},filter:{widget:"checkbox"}};LGraphTexture.loadTextureCallback=null;LGraphTexture.image_preview_size=256;LGraphTexture.PASS_THROUGH=1;LGraphTexture.COPY=2;LGraphTexture.LOW=3;LGraphTexture.HIGH=
4;LGraphTexture.REUSE=5;LGraphTexture.DEFAULT=2;LGraphTexture.MODE_VALUES={"pass through":LGraphTexture.PASS_THROUGH,copy:LGraphTexture.COPY,low:LGraphTexture.LOW,high:LGraphTexture.HIGH,reuse:LGraphTexture.REUSE,"default":LGraphTexture.DEFAULT};LGraphTexture.getTexturesContainer=function(){return gl.textures};LGraphTexture.loadTexture=function(a,b){b=b||{};var c=a;"http://"==c.substr(0,7)&&LiteGraph.proxy&&(c=LiteGraph.proxy+c.substr(7));return LGraphTexture.getTexturesContainer()[a]=GL.Texture.fromURL(c,
b)};LGraphTexture.getTexture=function(a){var b=this.getTexturesContainer();if(!b)throw"Cannot load texture, container of textures not found";b=b[a];return!b&&a&&":"!=a[0]?(this.loadTexture(a),null):b};LGraphTexture.getTargetTexture=function(a,b,c){if(!a)throw"LGraphTexture.getTargetTexture expects a reference texture";var d=null;switch(c){case LGraphTexture.LOW:d=gl.UNSIGNED_BYTE;break;case LGraphTexture.HIGH:d=gl.HIGH_PRECISION_FORMAT;break;case LGraphTexture.REUSE:return a;default:d=a?a.type:gl.UNSIGNED_BYTE}b&&
@@ -336,8 +340,8 @@ LGraphFXLens.widgets_info={precision:{widget:"combo",values:LGraphTexture.MODE_V
LiteGraph.registerNodeType("fx/lens",LGraphFXLens);window.LGraphFXLens=LGraphFXLens;var LGraphFXBokeh=function(){this.addInput("Texture","Texture");this.addInput("Blurred","Texture");this.addInput("Mask","Texture");this.addInput("Threshold","number");this.addOutput("Texture","Texture");this.properties={shape:"",size:10,alpha:1,threshold:1,high_precision:!1}};LGraphFXBokeh.title="Bokeh";LGraphFXBokeh.desc="applies an Bokeh effect";LGraphFXBokeh.widgets_info={shape:{widget:"texture"}};LGraphFXBokeh.prototype.onExecute=
function(){var a=this.getInputData(0),b=this.getInputData(1),c=this.getInputData(2);if(a&&c&&this.properties.shape){b||(b=a);var d=LGraphTexture.getTexture(this.properties.shape);if(d){var e=this.properties.threshold;this.isInputConnected(3)&&(e=this.getInputData(3),this.properties.threshold=e);var f=gl.UNSIGNED_BYTE;this.properties.high_precision&&(f=gl.half_float_ext?gl.HALF_FLOAT_OES:gl.FLOAT);this._temp_texture&&this._temp_texture.type==f&&this._temp_texture.width==a.width&&this._temp_texture.height==
a.height||(this._temp_texture=new GL.Texture(a.width,a.height,{type:f,format:gl.RGBA,filter:gl.LINEAR}));var g=LGraphFXBokeh._first_shader;g||(g=LGraphFXBokeh._first_shader=new GL.Shader(Shader.SCREEN_VERTEX_SHADER,LGraphFXBokeh._first_pixel_shader));var h=LGraphFXBokeh._second_shader;h||(h=LGraphFXBokeh._second_shader=new GL.Shader(LGraphFXBokeh._second_vertex_shader,LGraphFXBokeh._second_pixel_shader));var k=this._points_mesh;k&&k._width==a.width&&k._height==a.height&&2==k._spacing||(k=this.createPointsMesh(a.width,
a.height,2));var n=Mesh.getScreenQuad(),l=this.properties.size,q=this.properties.alpha;gl.disable(gl.DEPTH_TEST);gl.disable(gl.BLEND);this._temp_texture.drawTo(function(){a.bind(0);b.bind(1);c.bind(2);g.uniforms({u_texture:0,u_texture_blur:1,u_mask:2,u_texsize:[a.width,a.height]}).draw(n)});this._temp_texture.drawTo(function(){gl.enable(gl.BLEND);gl.blendFunc(gl.ONE,gl.ONE);a.bind(0);d.bind(3);h.uniforms({u_texture:0,u_mask:2,u_shape:3,u_alpha:q,u_threshold:e,u_pointSize:l,u_itexsize:[1/a.width,1/
a.height]}).draw(k,gl.POINTS)});this.setOutputData(0,this._temp_texture)}}else this.setOutputData(0,a)};LGraphFXBokeh.prototype.createPointsMesh=function(a,b,c){for(var d=Math.round(a/c),e=Math.round(b/c),f=new Float32Array(d*e*2),g=-1,h=2/a*c,k=2/b*c,n=0;n<e;++n){for(var l=-1,q=0;q<d;++q){var r=n*d*2+2*q;f[r]=l;f[r+1]=g;l+=h}g+=k}this._points_mesh=GL.Mesh.load({vertices2D:f});this._points_mesh._width=a;this._points_mesh._height=b;this._points_mesh._spacing=c;return this._points_mesh};LGraphFXBokeh._first_pixel_shader=
a.height,2));var n=Mesh.getScreenQuad(),l=this.properties.size,p=this.properties.alpha;gl.disable(gl.DEPTH_TEST);gl.disable(gl.BLEND);this._temp_texture.drawTo(function(){a.bind(0);b.bind(1);c.bind(2);g.uniforms({u_texture:0,u_texture_blur:1,u_mask:2,u_texsize:[a.width,a.height]}).draw(n)});this._temp_texture.drawTo(function(){gl.enable(gl.BLEND);gl.blendFunc(gl.ONE,gl.ONE);a.bind(0);d.bind(3);h.uniforms({u_texture:0,u_mask:2,u_shape:3,u_alpha:p,u_threshold:e,u_pointSize:l,u_itexsize:[1/a.width,1/
a.height]}).draw(k,gl.POINTS)});this.setOutputData(0,this._temp_texture)}}else this.setOutputData(0,a)};LGraphFXBokeh.prototype.createPointsMesh=function(a,b,c){for(var d=Math.round(a/c),e=Math.round(b/c),f=new Float32Array(d*e*2),g=-1,h=2/a*c,k=2/b*c,n=0;n<e;++n){for(var l=-1,p=0;p<d;++p){var r=n*d*2+2*p;f[r]=l;f[r+1]=g;l+=h}g+=k}this._points_mesh=GL.Mesh.load({vertices2D:f});this._points_mesh._width=a;this._points_mesh._height=b;this._points_mesh._spacing=c;return this._points_mesh};LGraphFXBokeh._first_pixel_shader=
"precision highp float;\n\t\t\tprecision highp float;\n\t\t\tvarying vec2 v_coord;\n\t\t\tuniform sampler2D u_texture;\n\t\t\tuniform sampler2D u_texture_blur;\n\t\t\tuniform sampler2D u_mask;\n\t\t\t\n\t\t\tvoid main() {\n\t\t\t\tvec4 color = texture2D(u_texture, v_coord);\n\t\t\t\tvec4 blurred_color = texture2D(u_texture_blur, v_coord);\n\t\t\t\tfloat mask = texture2D(u_mask, v_coord).x;\n\t\t\t gl_FragColor = mix(color, blurred_color, mask);\n\t\t\t}\n\t\t\t";LGraphFXBokeh._second_vertex_shader=
"precision highp float;\n\t\t\tattribute vec2 a_vertex2D;\n\t\t\tvarying vec4 v_color;\n\t\t\tuniform sampler2D u_texture;\n\t\t\tuniform sampler2D u_mask;\n\t\t\tuniform vec2 u_itexsize;\n\t\t\tuniform float u_pointSize;\n\t\t\tuniform float u_threshold;\n\t\t\tvoid main() {\n\t\t\t\tvec2 coord = a_vertex2D * 0.5 + 0.5;\n\t\t\t\tv_color = texture2D( u_texture, coord );\n\t\t\t\tv_color += texture2D( u_texture, coord + vec2(u_itexsize.x, 0.0) );\n\t\t\t\tv_color += texture2D( u_texture, coord + vec2(0.0, u_itexsize.y));\n\t\t\t\tv_color += texture2D( u_texture, coord + u_itexsize);\n\t\t\t\tv_color *= 0.25;\n\t\t\t\tfloat mask = texture2D(u_mask, coord).x;\n\t\t\t\tfloat luminance = length(v_color) * mask;\n\t\t\t\t/*luminance /= (u_pointSize*u_pointSize)*0.01 */;\n\t\t\t\tluminance -= u_threshold;\n\t\t\t\tif(luminance < 0.0)\n\t\t\t\t{\n\t\t\t\t\tgl_Position.x = -100.0;\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tgl_PointSize = u_pointSize;\n\t\t\t\tgl_Position = vec4(a_vertex2D,0.0,1.0);\n\t\t\t}\n\t\t\t";
LGraphFXBokeh._second_pixel_shader="precision highp float;\n\t\t\tvarying vec4 v_color;\n\t\t\tuniform sampler2D u_shape;\n\t\t\tuniform float u_alpha;\n\t\t\t\n\t\t\tvoid main() {\n\t\t\t\tvec4 color = texture2D( u_shape, gl_PointCoord );\n\t\t\t\tcolor *= v_color * u_alpha;\n\t\t\t\tgl_FragColor = color;\n\t\t\t}\n";LiteGraph.registerNodeType("fx/bokeh",LGraphFXBokeh);window.LGraphFXBokeh=LGraphFXBokeh;var LGraphFXGeneric=function(){this.addInput("Texture","Texture");this.addInput("value1","number");
@@ -370,21 +374,23 @@ function(){return[["on_midi",LiteGraph.EVENT]]};LiteGraph.registerNodeType("midi
g);h.title="MIDIEvent";h.desc="Create a MIDI Event";h.prototype.onAction=function(a,c){"assign"==a?(this.properties.channel=c.channel,this.properties.cmd=c.cmd,this.properties.value1=c.data[1],this.properties.value2=c.data[2]):(c=new b,c.channel=this.properties.channel,this.properties.cmd&&this.properties.cmd.constructor===String?c.setCommandFromString(this.properties.cmd):c.cmd=this.properties.cmd,c.data[0]=c.cmd|c.channel,c.data[1]=Number(this.properties.value1),c.data[2]=Number(this.properties.value2),
this.trigger("on_midi",c))};h.prototype.onExecute=function(){var a=this.properties;if(this.outputs)for(var c=0;c<this.outputs.length;++c){var d=null;switch(this.outputs[c].name){case "midi":d=new b;d.setup([a.cmd,a.value1,a.value2]);d.channel=a.channel;break;case "command":d=a.cmd;break;case "note":d=a.cmd==b.NOTEON||a.cmd==b.NOTEOFF?a.value1:NULL;break;case "velocity":d=a.cmd==b.NOTEON?a.value2:NULL;break;case "pitch":d=a.cmd==b.NOTEON?b.computePitch(a.value1):null;break;case "pitchbend":d=a.cmd==
b.PITCHBEND?b.computePitchBend(a.value1,a.value2):null;break;default:continue}null!==d&&this.setOutputData(c,d)}};h.prototype.onPropertyChanged=function(a,c){"cmd"==a&&(this.properties.cmd=b.computeCommandFromString(c))};h.prototype.onGetOutputs=function(){return[["midi","midi"],["on_midi",LiteGraph.EVENT],["command","number"],["note","number"],["velocity","number"],["pitch","number"],["pitchbend","number"]]};LiteGraph.registerNodeType("midi/event",h)})(window);
(function(a){function b(){this.properties={src:"demodata/audio.wav",gain:0.5,loop:!0};this._loading_audio=!1;this._audio_buffer=null;this._audionodes=[];this.addOutput("out","audio");this.addInput("gain","number");this.audionode=b.getAudioContext().createGain();this.audionode.graphnode=this;this.audionode.gain.value=this.properties.gain;this.properties.src&&this.loadSound(this.properties.src)}function c(){this.properties={fftSize:2048,minDecibels:-100,maxDecibels:-10,smoothingTimeConstant:0.5};this.audionode=
b.getAudioContext().createAnalyser();this.audionode.graphnode=this;this.audionode.fftSize=this.properties.fftSize;this.audionode.minDecibels=this.properties.minDecibels;this.audionode.maxDecibels=this.properties.maxDecibels;this.audionode.smoothingTimeConstant=this.properties.smoothingTimeConstant;this.addInput("in","audio");this.addOutput("freqs","FFT");this._time_bin=this._freq_bin=null}function d(a){a.prototype.onPropertyChanged=function(a,b){void 0!==this.audionode[a]&&(void 0!==this.audionode[a].value?
this.audionode[a].value=b:this.audionode[a]=b)};a.prototype.onConnectionsChange=function(a,c,d,e){a==LiteGraph.OUTPUT&&(a=null,e&&(a=this.graph.getNodeById(e.target_id)),a&&(d?a.connectAudioToSlot?a.connectAudioToSlot(this.audionode,e.target_slot):b.connect(this.audionode,a.audionode):a.disconnectAudioFromSlot?a.disconnectAudioFromSlot(this.audionode,e.target_slot):b.disconnect(this.audionode,a.audionode)))}}function e(){this.properties={gain:1};this.audionode=b.getAudioContext().createGain();this.addInput("in",
"audio");this.addInput("gain","number");this.addOutput("out","audio")}function f(){this.properties={gain1:0.5,gain2:0.5};this.audionode=b.getAudioContext().createGain();this.audionode1=b.getAudioContext().createGain();this.audionode1.gain.value=this.properties.gain1;this.audionode2=b.getAudioContext().createGain();this.audionode2.gain.value=this.properties.gain2;this.audionode1.connect(this.audionode);this.audionode2.connect(this.audionode);this.addInput("in1","audio");this.addInput("in1 gain","number");
this.addInput("in2","audio");this.addInput("in2 gain","number");this.addOutput("out","audio")}function g(){this.properties={time:5};this.audionode=b.getAudioContext().createDelay(this.properties.time);this.addInput("in","audio");this.addOutput("out","audio")}function h(){this.properties={frequency:350,detune:0,Q:1};this.addProperty("type","lowpass","enum",{values:"lowpass highpass bandpass lowshelf highshelf peaking notch allpass".split(" ")});this.audionode=b.getAudioContext().createBiquadFilter();
this.addInput("in","audio");this.addOutput("out","audio")}function k(){this.audionode=b.getAudioContext().destination;this.addInput("in","audio")}function n(){this.addInput("freqs","FFT");this.size=[300,200];this._last_buffer=null}b.getAudioContext=function(){if(!this._audio_context){window.AudioContext=window.AudioContext||window.webkitAudioContext;if(!window.AudioContext)return console.error("AudioContext not supported by browser"),null;this._audio_context=new AudioContext;this._audio_context.onmessage=
function(a){console.log("msg",a)};this._audio_context.onended=function(a){console.log("ended",a)};this._audio_context.oncomplete=function(a){console.log("complete",a)}}"suspended"==this._audio_context.state&&this._audio_context.resume();return this._audio_context};b.connect=function(a,b){a.connect(b)};b.disconnect=function(a,b){a.disconnect(b)};b.prototype.onAdded=function(a){if(a.status===LGraph.STATUS_RUNNING)this.onStart()};b.prototype.onStart=function(){this._audio_buffer&&this.playBuffer(this._audio_buffer)};
b.prototype.onStop=function(){this.stopAllSounds()};b.prototype.onRemoved=function(){this.stopAllSounds()};b.prototype.stopAllSounds=function(){for(var a=0;a<this._audionodes.length;++a)this._audionodes[a].stop();this._audionodes.length=0};b.prototype.onExecute=function(){var a=this.getInputData(0);void 0!==a&&(this.audionode.gain.value=a)};b.prototype.onAction=function(a){this._audio_buffer&&("Play"==a?this.playBuffer(this._audio_buffer):"Stop"==a&&this.stopAllSounds())};b.prototype.onPropertyChanged=
function(a,b){"src"==a?this.loadSound(b):"gain"==a&&(this.audionode.gain.value=b)};b.prototype.playBuffer=function(a){var c=this,d=b.getAudioContext().createBufferSource();d.graphnode=this;d.buffer=a;d.loop=this.properties.loop;this._audionodes.push(d);d.connect(this.audionode);this._audionodes.push(d);d.onended=function(){console.log("ended!");c.trigger("ended");var a=c._audionodes.indexOf(d);-1!=a&&c._audionodes.splice(a,1)};d.start();return d};b.prototype.onConnectionsChange=function(a,c,d,e){a==
LiteGraph.OUTPUT&&(a=null,e&&(a=this.graph.getNodeById(e.target_id)),a&&(d?a.connectAudioToSlot?a.connectAudioToSlot(this.audionode,e.target_slot):b.connect(this.audionode,a.audionode):a.disconnectAudioFromSlot?a.disconnectAudioFromSlot(this.audionode,e.target_slot):b.disconnect(this.audionode,a.audionode)))};b.prototype.loadSound=function(a){function c(a){console.log("Audio loading sample error:",a)}var d=this;this._request&&(this._request.abort(),this._request=null);this._audio_buffer=null;this._loading_audio=
!1;if(a){var e=new XMLHttpRequest;e.open("GET",a,!0);e.responseType="arraybuffer";this._loading_audio=!0;this._request=e;var f=b.getAudioContext();e.onload=function(){f.decodeAudioData(e.response,function(a){d._audio_buffer=a;d._loading_audio=!1;if(d.graph&&d.graph.status===LGraph.STATUS_RUNNING)d.onStart()},c)};e.send()}};b.prototype.onGetInputs=function(){return[["Play",LiteGraph.ACTION],["Stop",LiteGraph.ACTION]]};b.prototype.onGetOutputs=function(){return[["ended",LiteGraph.EVENT]]};b.title="Source";
b.desc="Plays audio";LiteGraph.registerNodeType("audio/source",b);a.LGAudio=b;c.prototype.onPropertyChanged=function(a,b){this.audionode[a]=b};c.prototype.onExecute=function(){if(this.isOutputConnected(0)){var a=this.audionode.frequencyBinCount;this._freq_bin&&this._freq_bin.length==a||(this._freq_bin=new Uint8Array(a));this.audionode.getByteFrequencyData(this._freq_bin);this.setOutputData(0,this._freq_bin)}for(a=1;a<this.inputs.length;++a){var b=this.inputs[a],c=this.getInputData(a);void 0!==c&&
(this.audionode[b.name].value=c)}};c.prototype.onGetInputs=function(){return[["minDecibels","number"],["maxDecibels","number"],["smoothingTimeConstant","number"]]};c.title="Analyser";c.desc="Audio Analyser";LiteGraph.registerNodeType("audio/analyser",c);e.prototype.onExecute=function(){if(this.inputs&&this.inputs.length)for(var a=1;a<this.inputs.length;++a){var b=this.inputs[a],c=this.getInputData(a);void 0!==c&&(this.audionode[b.name].value=c)}};d(e);e.title="Gain";e.desc="Audio gain";LiteGraph.registerNodeType("audio/gain",
e);f.prototype.connectAudioToSlot=function(a,c){0==c?b.connect(a,this.audionode1):2==c&&b.connect(a,this.audionode2)};f.prototype.disconnectAudioFromSlot=function(a,c){0==c?b.disconnect(a,this.audionode1):2==c&&b.disconnect(a,this.audionode2)};f.prototype.onExecute=function(){if(this.inputs&&this.inputs.length)for(var a=1;a<this.inputs.length;++a)if("audio"!=this.inputs[a].type){var b=this.getInputData(a);void 0!==b&&(1==a?this.audionode1.gain.value=b:3==a&&(this.audionode2.gain.value=b))}};d(f);
f.title="Mixer";f.desc="Audio mixer";LiteGraph.registerNodeType("audio/mixer",f);d(g);g.prototype.onPropertyChanged=function(a,c){if("time"==a){500<c&&(c=500);0>c&&(c=0);var d=this.getInputNode(0),e=this.getOutputNodes(0);d&&d.audionode.disconnect(this.audionode);if(e)for(var f=0;f<e.length;++f)this.audionode.disconnect(e[f].audionode);this.audionode=b.getAudioContext().createDelay(c);d&&d.audionode.connect(this.audionode);if(e)for(f=0;f<e.length;++f)this.audionode.connect(e[f].audionode)}};g.title=
"Delay";g.desc="Audio delay";LiteGraph.registerNodeType("audio/delay",g);h.prototype.onExecute=function(){if(this.inputs&&this.inputs.length)for(var a=1;a<this.inputs.length;++a){var b=this.inputs[a],c=this.getInputData(a);void 0!==c&&(this.audionode[b.name].value=c)}};h.prototype.onGetInputs=function(){return[["frequency","number"],["detune","number"],["Q","number"]]};d(h);h.title="BiquadFilter";h.desc="Audio filter";LiteGraph.registerNodeType("audio/biquadfilter",h);k.title="Destination";k.desc=
"Audio output";LiteGraph.registerNodeType("audio/destination",k);n.prototype.onExecute=function(){this._last_buffer=this.getInputData(0)};n.prototype.onDrawForeground=function(a){if(this._last_buffer){var b=this._last_buffer,c=b.length/this.size[0],d=this.size[1];a.fillStyle="black";a.fillRect(0,0,this.size[0],this.size[1]);a.strokeStyle="white";a.beginPath();for(var e=0,f=0;f<b.length;f+=c)a.moveTo(e,d),a.lineTo(e,d-b[f|0]/255*d),e++;a.stroke()}};n.title="Visualization";n.desc="Audio Visualization";
LiteGraph.registerNodeType("audio/visualization",n)})(window);
(function(a){function b(){this.properties={src:"demodata/audio.wav",gain:0.5,loop:!0,autoplay:!0,playbackRate:1};this._loading_audio=!1;this._audio_buffer=null;this._audionodes=[];this.addOutput("out","audio");this.addInput("gain","number");this.audionode=p.getAudioContext().createGain();this.audionode.graphnode=this;this.audionode.gain.value=this.properties.gain;this.properties.src&&this.loadSound(this.properties.src)}function c(){this.properties={fftSize:2048,minDecibels:-100,maxDecibels:-10,smoothingTimeConstant:0.5};
this.audionode=p.getAudioContext().createAnalyser();this.audionode.graphnode=this;this.audionode.fftSize=this.properties.fftSize;this.audionode.minDecibels=this.properties.minDecibels;this.audionode.maxDecibels=this.properties.maxDecibels;this.audionode.smoothingTimeConstant=this.properties.smoothingTimeConstant;this.addInput("in","audio");this.addOutput("freqs","array");this._time_bin=this._freq_bin=null}function d(a){a.prototype.onPropertyChanged=function(a,b){void 0!==this.audionode[a]&&(void 0!==
this.audionode[a].value?this.audionode[a].value=b:this.audionode[a]=b)};a.prototype.onConnectionsChange=p.onConnectionsChange}function e(){this.properties={gain:1};this.audionode=p.getAudioContext().createGain();this.addInput("in","audio");this.addInput("gain","number");this.addOutput("out","audio")}function f(){this.properties={};this.audionode=p.getAudioContext().createWaveShaper();this.addInput("in","audio");this.addInput("shape","waveshape");this.addOutput("out","audio")}function g(){this.properties=
{gain1:0.5,gain2:0.5};this.audionode=p.getAudioContext().createGain();this.audionode1=p.getAudioContext().createGain();this.audionode1.gain.value=this.properties.gain1;this.audionode2=p.getAudioContext().createGain();this.audionode2.gain.value=this.properties.gain2;this.audionode1.connect(this.audionode);this.audionode2.connect(this.audionode);this.addInput("in1","audio");this.addInput("in1 gain","number");this.addInput("in2","audio");this.addInput("in2 gain","number");this.addOutput("out","audio")}
function h(){this.properties={delayTime:0.5};this.audionode=p.getAudioContext().createDelay(10);this.audionode.delayTime.value=this.properties.delayTime;this.addInput("in","audio");this.addInput("time","number");this.addOutput("out","audio")}function k(){this.properties={frequency:350,detune:0,Q:1};this.addProperty("type","lowpass","enum",{values:"lowpass highpass bandpass lowshelf highshelf peaking notch allpass".split(" ")});this.audionode=p.getAudioContext().createBiquadFilter();this.addInput("in",
"audio");this.addOutput("out","audio")}function n(){this.properties={continuous:!0};this.addInput("freqs","array");this.size=[300,200];this._last_buffer=null}function l(){this.audionode=p.getAudioContext().destination;this.addInput("in","audio")}var p={};a.LGAudio=p;p.getAudioContext=function(){if(!this._audio_context){window.AudioContext=window.AudioContext||window.webkitAudioContext;if(!window.AudioContext)return console.error("AudioContext not supported by browser"),null;this._audio_context=new AudioContext;
this._audio_context.onmessage=function(a){console.log("msg",a)};this._audio_context.onended=function(a){console.log("ended",a)};this._audio_context.oncomplete=function(a){console.log("complete",a)}}"suspended"==this._audio_context.state&&this._audio_context.resume();return this._audio_context};p.connect=function(a,b){try{a.connect(b)}catch(c){console.warn("LGraphAudio:",c)}};p.disconnect=function(a,b){try{a.disconnect(b)}catch(c){console.warn("LGraphAudio:",c)}};p.changeAllAudiosConnections=function(a,
b){if(a.inputs)for(var c=0;c<a.inputs.length;++c){var d=a.graph.links[a.inputs[c].link];if(d){var e=a.graph.getNodeById(d.origin_id),f=null,f=e.getAudioNodeInOutputSlot?e.getAudioNodeInOutputSlot(d.origin_slot):e.audionode,d=null,d=a.getAudioNodeInInputSlot?a.getAudioNodeInInputSlot(c):a.audionode;b?p.connect(f,d):p.disconnect(f,d)}}if(a.outputs)for(c=0;c<a.outputs.length;++c)for(var e=a.outputs[c],g=0;g<e.links.length;++g)if(d=a.graph.links[e.links[g]]){var f=a.getAudioNodeInOutputSlot?a.getAudioNodeInOutputSlot(c):
a.audionode,h=a.graph.getNodeById(d.target_id),d=h.getAudioNodeInInputSlot?h.getAudioNodeInInputSlot(d.target_slot):h.audionode;b?p.connect(f,d):p.disconnect(f,d)}};p.onConnectionsChange=function(a,b,c,d){if(a==LiteGraph.OUTPUT&&(a=null,d&&(a=this.graph.getNodeById(d.target_id)),a)){var e=null,e=this.getAudioNodeInOutputSlot?this.getAudioNodeInOutputSlot(b):this.audionode;b=null;b=a.getAudioNodeInInputSlot?a.getAudioNodeInInputSlot(d.target_slot):a.audionode;c?p.connect(e,b):p.disconnect(e,b)}};b.supported_extensions=
["wav","ogg","mp3"];b.prototype.onAdded=function(a){if(a.status===LGraph.STATUS_RUNNING)this.onStart()};b.prototype.onStart=function(){this._audio_buffer&&this.properties.autoplay&&this.playBuffer(this._audio_buffer)};b.prototype.onStop=function(){this.stopAllSounds()};b.prototype.onRemoved=function(){this.stopAllSounds()};b.prototype.stopAllSounds=function(){for(var a=0;a<this._audionodes.length;++a)this._audionodes[a].stop();this._audionodes.length=0};b.prototype.onExecute=function(){if(this.inputs)for(var a=
0;a<this.inputs.length;++a){var b=this.inputs[a];if(b.link){var c=this.getInputData(a);void 0!==c&&("gain"==b.name?this.audionode.gain.value=c:"playbackRate"==b.name&&(this.properties.playbackRate=c))}}};b.prototype.onAction=function(a){this._audio_buffer&&("Play"==a?this.playBuffer(this._audio_buffer):"Stop"==a&&this.stopAllSounds())};b.prototype.onPropertyChanged=function(a,b){"src"==a?this.loadSound(b):"gain"==a&&(this.audionode.gain.value=b)};b.prototype.playBuffer=function(a){var b=this,c=p.getAudioContext().createBufferSource();
c.graphnode=this;c.buffer=a;c.loop=this.properties.loop;c.playbackRate.value=this.properties.playbackRate;this._audionodes.push(c);c.connect(this.audionode);this._audionodes.push(c);c.onended=function(){b.trigger("ended");var a=b._audionodes.indexOf(c);-1!=a&&b._audionodes.splice(a,1)};c.start();return c};b.prototype.loadSound=function(a){function b(a){console.log("Audio loading sample error:",a)}var c=this;this._request&&(this._request.abort(),this._request=null);this._audio_buffer=null;this._loading_audio=
!1;if(a){var d=new XMLHttpRequest;d.open("GET",a,!0);d.responseType="arraybuffer";this._loading_audio=!0;this._request=d;var e=p.getAudioContext();d.onload=function(){e.decodeAudioData(d.response,function(a){c._audio_buffer=a;c._url&&(URL.revokeObjectURL(c._url),c._url=null);c._loading_audio=!1;if(c.graph&&c.graph.status===LGraph.STATUS_RUNNING)c.onStart()},b)};d.send()}};b.prototype.onConnectionsChange=p.onConnectionsChange;b.prototype.onGetInputs=function(){return[["playbackRate","number"],["Play",
LiteGraph.ACTION],["Stop",LiteGraph.ACTION]]};b.prototype.onGetOutputs=function(){return[["ended",LiteGraph.EVENT]]};b.prototype.onDropFile=function(a){this._url&&URL.revokeObjectURL(this._url);this._url=URL.createObjectURL(a);this.properties.src=this._url;this.loadSound(this._url)};b.title="Source";b.desc="Plays audio";LiteGraph.registerNodeType("audio/source",b);c.prototype.onPropertyChanged=function(a,b){this.audionode[a]=b};c.prototype.onExecute=function(){if(this.isOutputConnected(0)){var a=
this.audionode.frequencyBinCount;this._freq_bin&&this._freq_bin.length==a||(this._freq_bin=new Uint8Array(a));this.audionode.getByteFrequencyData(this._freq_bin);this.setOutputData(0,this._freq_bin)}for(a=1;a<this.inputs.length;++a){var b=this.inputs[a],c=this.getInputData(a);void 0!==c&&(this.audionode[b.name].value=c)}};c.prototype.onGetInputs=function(){return[["minDecibels","number"],["maxDecibels","number"],["smoothingTimeConstant","number"]]};c.title="Analyser";c.desc="Audio Analyser";LiteGraph.registerNodeType("audio/analyser",
c);e.prototype.onExecute=function(){if(this.inputs&&this.inputs.length)for(var a=1;a<this.inputs.length;++a){var b=this.inputs[a],c=this.getInputData(a);void 0!==c&&(this.audionode[b.name].value=c)}};d(e);e.title="Gain";e.desc="Audio gain";LiteGraph.registerNodeType("audio/gain",e);f.prototype.onExecute=function(){if(this.inputs&&this.inputs.length){var a=this.getInputData(1);void 0!==a&&(this.audionode.curve=a)}};f.prototype.setWaveShape=function(a){this.audionode.curve=a};d(f);g.prototype.getAudioNodeInInputSlot=
function(a){if(0==a)return this.audionode1;if(2==a)return this.audionode2};g.prototype.onExecute=function(){if(this.inputs&&this.inputs.length)for(var a=1;a<this.inputs.length;++a)if("audio"!=this.inputs[a].type){var b=this.getInputData(a);void 0!==b&&(1==a?this.audionode1.gain.value=b:3==a&&(this.audionode2.gain.value=b))}};d(g);g.title="Mixer";g.desc="Audio mixer";LiteGraph.registerNodeType("audio/mixer",g);d(h);h.prototype.onExecute=function(){var a=this.getInputData(1);void 0!==a&&(this.audionode.delayTime.value=
a)};h.title="Delay";h.desc="Audio delay";LiteGraph.registerNodeType("audio/delay",h);k.prototype.onExecute=function(){if(this.inputs&&this.inputs.length)for(var a=1;a<this.inputs.length;++a){var b=this.inputs[a],c=this.getInputData(a);void 0!==c&&(this.audionode[b.name].value=c)}};k.prototype.onGetInputs=function(){return[["frequency","number"],["detune","number"],["Q","number"]]};d(k);k.title="BiquadFilter";k.desc="Audio filter";LiteGraph.registerNodeType("audio/biquadfilter",k);n.prototype.onExecute=
function(){this._last_buffer=this.getInputData(0)};n.prototype.onDrawForeground=function(a){if(this._last_buffer){var b=this._last_buffer,c=b.length/this.size[0],d=this.size[1];a.fillStyle="black";a.fillRect(0,0,this.size[0],this.size[1]);a.strokeStyle="white";a.beginPath();var e=0;if(this.properties.continuous){a.moveTo(e,d);for(var f=0;f<b.length;f+=c)a.lineTo(e,d-b[f|0]/255*d),e++}else for(f=0;f<b.length;f+=c)a.moveTo(e,d),a.lineTo(e,d-b[f|0]/255*d),e++;a.stroke()}};n.title="Visualization";n.desc=
"Audio Visualization";LiteGraph.registerNodeType("audio/visualization",n);l.title="Destination";l.desc="Audio output";LiteGraph.registerNodeType("audio/destination",l)})(window);

34
demo/code.js
View File

@@ -4,10 +4,34 @@ var editor = new LiteGraph.Editor("main");
window.graphcanvas = editor.graphcanvas;
window.graph = editor.graph;
window.addEventListener("resize", function() { editor.graphcanvas.resize(); } );
demo();
function trace(a)
//create scene selector
var elem = document.createElement("span");
elem.className = "selector";
elem.innerHTML = "Demo <select><option>Empty</option></select>";
editor.tools.appendChild(elem);
var select = elem.querySelector("select");
select.addEventListener("change", function(e){
var option = this.options[this.selectedIndex];
var url = option.dataset["url"];
if(url)
graph.load( url );
else
graph.clear();
});
function addDemo( name, url )
{
if(typeof(console) == "object")
console.log(a);
}
var option = document.createElement("option");
option.dataset["url"] = url;
option.innerHTML = name;
select.appendChild( option );
}
//some examples
addDemo("Audio", "examples/audio.json");
addDemo("Audio Delay", "examples/audio_delay.json");

547
demo/code_old.js
View File

@@ -1,547 +0,0 @@
var graph = null;
var graphcanvas = null;
$(window).load(function() {
var id = null;
if ($.getUrlVar("id") != null)
id = parseInt($.getUrlVar("id"));
else if (self.document.location.hash)
id = parseInt( self.document.location.hash.substr(1) );
$("#settings_button").click( function() { $("#settings-panel").toggle(); });
$("#addnode_button").click( function() { onShowNodes() });
$("#deletenode_button").click( function() { onDeleteNode() });
$("#clonenode_button").click( function() { onCloneNode() });
$("#playnode_button").click( function() {
if(graph.status == LGraph.STATUS_STOPPED)
{
$(this).html("<img src='imgs/icon-stop.png'/> Stop");
graph.start(1);
}
else
{
$(this).html("<img src='imgs/icon-play.png'/> Play");
graph.stop();
}
});
$("#playstepnode_button").click( function() {
graph.runStep(1);
graphcanvas.draw(true,true);
});
$("#playfastnode_button").click( function() {
graph.runStep(5000);
graphcanvas.draw(true,true);
});
$("#collapsenode_button").click( function() {
/*
for(var i in graphcanvas.nodes_selected)
graphcanvas.nodes_selected[i].collapse();
*/
if( graphcanvas.node_in_panel )
graphcanvas.node_in_panel.collapse();
graphcanvas.draw();
});
$("#pinnode_button").click( function() {
if( graphcanvas.node_in_panel )
graphcanvas.node_in_panel.pin();
});
$("#sendtobacknode_button").click( function() {
if( graphcanvas.node_in_panel )
graphcanvas.sendToBack( graphcanvas.node_in_panel );
graphcanvas.draw(true);
});
$("#confirm-createnode_button").click(function() {
var element = $(".node-type.selected")[0];
var name = element.data;
var n = LiteGraph.createNode(name);
graph.add(n);
n.pos = graphcanvas.convertOffsetToCanvas([30,30]);
graphcanvas.draw(true,true);
$("#modal-blocking-box").hide();
$("#nodes-browser").hide();
});
$("#cancel-createnode_button").click(function() {
$("#modal-blocking-box").hide();
$("#nodes-browser").hide();
});
$("#close-area_button").click(function() {
$("#modal-blocking-box").hide();
$("#data-visor").hide();
});
$("#confirm-loadsession_button").click(function() {
var element = $(".session-item.selected")[0];
var info = element.data;
var str = localStorage.getItem("graph_session_" + info.id );
graph.stop();
graph.unserialize(str);
graphcanvas.draw(true,true);
$("#modal-blocking-box").hide();
$("#sessions-browser").hide();
});
$("#cancel-loadsession_button").click(function() {
$("#modal-blocking-box").hide();
$("#sessions-browser").hide();
});
$("#livemode_button").click( function() {
graphcanvas.switchLiveMode(true);
graphcanvas.draw();
var url = graphcanvas.live_mode ? "imgs/gauss_bg_medium.jpg" : "imgs/gauss_bg.jpg";
$("#livemode_button").html(!graphcanvas.live_mode ? "<img src='imgs/icon-record.png'/> Live" : "<img src='imgs/icon-gear.png'/> Edit" );
//$("canvas").css("background-image","url('"+url+"')");
});
$("#newsession_button").click( function() {
$("#main-area").hide();
graph.clear();
graphcanvas.draw();
$("#main-area").show();
});
$("#savesession_button").click( function() {
onSaveSession();
});
$("#loadsession_button").click( function() {
onLoadSession();
});
$("#cancelsession-dialog_button").click(function()
{
$("#modal-blocking-box").hide();
$("#savesession-dialog").hide();
});
$("#savesession-dialog_button").click(function()
{
var name = $("#session-name-input").val();
var desc = $("#session-description-input").val();
saveSession(name,desc);
$("#modal-blocking-box").hide();
$("#savesession-dialog").hide();
});
$("#closepanel_button").click(function()
{
graphcanvas.showNodePanel(null);
});
$("#maximize_button").click(function()
{
if($("#main").width() != window.innerWidth)
{
$("#main").width( (window.innerWidth).toString() + "px");
$("#main").height( (window.innerHeight - 40).toString() + "px");
graphcanvas.resizeCanvas(window.innerWidth,window.innerHeight - 100);
}
else
{
$("#main").width("800px");
$("#main").height("660px");
graphcanvas.resizeCanvas(800,600);
}
});
$("#resetscale_button").click(function()
{
graph.config.canvas_scale = 1.0;
graphcanvas.draw(true,true);
});
$("#resetpos_button").click(function()
{
graph.config.canvas_offset = [0,0];
graphcanvas.draw(true,true);
});
$(".nodecolorbutton").click(function()
{
if( graphcanvas.node_in_panel )
{
graphcanvas.node_in_panel.color = this.getAttribute("data-color");
graphcanvas.node_in_panel.bgcolor = this.getAttribute("data-bgcolor");
}
graphcanvas.draw(true,true);
});
if ("onhashchange" in window) // does the browser support the hashchange event?
{
window.onhashchange = function () {
var h = window.location.hash.substr(1);
//action
return false;
}
}
LiteGraph.node_images_path = "../nodes_data/";
graph = new LGraph();
graphcanvas = new LGraphCanvas("graphcanvas",graph);
graphcanvas.background_image = "imgs/grid.png";
graph.onAfterExecute = function() { graphcanvas.draw(true) };
demo();
graph.onPlayEvent = function()
{
$("#playnode_button").addClass("playing");
$("#playnode_button").removeClass("stopped");
}
graph.onStopEvent = function()
{
$("#playnode_button").addClass("stopped");
$("#playnode_button").removeClass("playing");
}
graphcanvas.draw();
//update load counter
setInterval(function() {
$("#cpuload .fgload").width( (2*graph.elapsed_time) * 90);
if(graph.status == LGraph.STATUS_RUNNING)
$("#gpuload .fgload").width( (graphcanvas.render_time*10) * 90);
else
$("#gpuload .fgload").width( 4 );
},200);
//LiteGraph.run(100);
});
function onShowNodes()
{
$("#nodes-list").empty();
for (var i in LiteGraph.registered_node_types)
{
var node = LiteGraph.registered_node_types[i];
var categories = node.category.split("/");
//create categories and find the propper one
var root = $("#nodes-list")[0];
for(var i in categories)
{
var result = $(root).find("#node-category_" + categories[i] + " .container");
if (result.length == 0)
{
var element = document.createElement("div");
element.id = "node-category_" + categories[i];
element.className = "node-category";
element.data = categories[i];
element.innerHTML = "<strong class='title'>"+categories[i]+"</strong>";
root.appendChild(element);
$(element).find(".title").click(function(e){
var element = $("#node-category_" + this.parentNode.data + " .container");
$(element[0]).toggle();
});
var container = document.createElement("div");
container.className = "container";
element.appendChild(container);
root = container;
}
else
root = result[0];
}
//create entry
var type = node.type;
var element = document.createElement("div");
element.innerHTML = "<strong>"+node.title+"</strong> " + (node.desc? node.desc : "");
element.className = "node-type";
element.id = "node-type-" + node.name;
element.data = type;
root.appendChild(element);
}
$(".node-type").click( function() {
$(".node-type.selected").removeClass("selected");
$(this).addClass("selected");
$("#confirm-createnode_button").attr("disabled",false);
});
$(".node-type").dblclick( function() {
$("#confirm-createnode_button").click();
});
$("#confirm-createnode_button").attr("disabled",true);
$("#modal-blocking-box").show();
$("#nodes-browser").show();
}
function onDeleteNode()
{
if(!graphcanvas.node_in_panel) return;
graph.remove( graphcanvas.node_in_panel );
graphcanvas.draw();
$("#node-panel").hide();
graphcanvas.node_in_panel = null;
}
function onCloneNode()
{
if(!graphcanvas.node_in_panel) return;
var n = graphcanvas.node_in_panel.clone();
n.pos[0] += 10;
n.pos[1] += 10;
graph.add(n);
graphcanvas.draw();
}
function onSaveSession()
{
if(graph.session["name"])
$("#session-name-input").val(graph.session["name"]);
if(graph.session["description"])
$("#session-desc-input").val(graph.session["description"]);
$("#modal-blocking-box").show();
$("#savesession-dialog").show();
//var str = LiteGraph.serialize();
//localStorage.setItem("graph_session",str);
}
function saveSession(name,desc)
{
desc = desc || "";
graph.session["name"] = name;
graph.session["description"] = desc;
if(!graph.session["id"])
graph.session["id"] = new Date().getTime();
var str = graph.serializeSession();
localStorage.setItem("graph_session_" + graph.session["id"],str);
var sessions_str = localStorage.getItem("node_sessions");
var sessions = [];
if(sessions_str)
sessions = JSON.parse(sessions_str);
var pos = -1;
for(var i = 0; i < sessions.length; i++)
if( sessions[i].id == graph.session["id"] && sessions[i].name == name)
{
pos = i;
break;
}
if(pos != -1)
{
//already on the list
}
else
{
var current_session = {name:name, desc:desc, id:graph.session["id"]};
sessions.unshift(current_session);
localStorage.setItem("graph_sessions", JSON.stringify(sessions));
}
}
function onLoadSession()
{
$("#sessions-browser-list").empty();
$("#modal-blocking-box").show();
$("#sessions-browser").show();
var sessions_str = localStorage.getItem("graph_sessions");
var sessions = [];
if(sessions_str)
sessions = JSON.parse(sessions_str);
for(var i in sessions)
{
var element = document.createElement("div");
element.className = "session-item";
element.data = sessions[i];
$(element).html("<strong>"+sessions[i].name+"</strong><span>"+sessions[i].desc+"</span><span class='delete_session'>x</span>");
$("#sessions-browser-list").append(element);
}
$(".session-item").click( function() {
$(".session-item.selected").removeClass("selected");
$(this).addClass("selected");
$("#confirm-loadsession_button").attr("disabled",false);
});
$(".session-item").dblclick( function() {
$("#confirm-loadsession_button").click();
});
$(".delete_session").click(function(e) {
var root = $(this).parent();
var info = root[0].data;
var sessions_str = localStorage.getItem("graph_sessions");
var sessions = [];
if(sessions_str)
sessions = JSON.parse(sessions_str);
var pos = -1;
for(var i = 0; i < sessions.length; i++)
if( sessions[i].id == info.id )
{
pos = i;
break;
}
if(pos != -1)
{
sessions.splice(pos,1);
localStorage.setItem("graph_sessions", JSON.stringify(sessions));
}
root.remove();
});
$("#confirm-loadsession_button").attr("disabled",true);
/*
LiteGraph.stop();
var str = localStorage.getItem("graph_session");
LiteGraph.unserialize(str);
LiteGraph.draw();
*/
}
function onShagraph()
{
}
function showImage(data)
{
var img = new Image();
img.src = data;
$("#data-visor .content").empty();
$("#data-visor .content").append(img);
$("#modal-blocking-box").show();
$("#data-visor").show();
}
function showElement(data)
{
setTimeout(function(){
$("#data-visor .content").empty();
$("#data-visor .content").append(data);
$("#modal-blocking-box").show();
$("#data-visor").show();
},100);
}
// ********* SEEDED RANDOM ******************************
function RandomNumberGenerator(seed)
{
if (typeof(seed) == 'undefined')
{
var d = new Date();
this.seed = 2345678901 + (d.getSeconds() * 0xFFFFFF) + (d.getMinutes() * 0xFFFF);
}
else
this.seed = seed;
this.A = 48271;
this.M = 2147483647;
this.Q = this.M / this.A;
this.R = this.M % this.A;
this.oneOverM = 1.0 / this.M;
this.next = nextRandomNumber;
return this;
}
function nextRandomNumber(){
var hi = this.seed / this.Q;
var lo = this.seed % this.Q;
var test = this.A * lo - this.R * hi;
if(test > 0){
this.seed = test;
} else {
this.seed = test + this.M;
}
return (this.seed * this.oneOverM);
}
var RAND_GEN = RandomNumberGenerator(0);
function RandomSeed(s) { RAND_GEN = RandomNumberGenerator(s); };
function myrand(Min, Max){
return Math.round((Max-Min) * RAND_GEN.next() + Min);
}
function myrandom() { return myrand(0,100000) / 100000; }
// @format (hex|rgb|null) : Format to return, default is integer
function random_color(format)
{
var rint = Math.round(0xffffff * myrandom());
switch(format)
{
case 'hex':
return ('#0' + rint.toString(16)).replace(/^#0([0-9a-f]{6})$/i, '#$1');
break;
case 'rgb':
return 'rgb(' + (rint >> 16) + ',' + (rint >> 8 & 255) + ',' + (rint & 255) + ')';
break;
default:
return rint;
break;
}
}
$.extend({
getUrlVars: function(){
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++)
{
hash = hashes[i].split('=');
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
},
getUrlVar: function(name){
return $.getUrlVars()[name];
}
});
function trace(a)
{
if(typeof(console) == "object")
console.log(a);
}

1
demo/examples/audio.json Normal file
View File

@@ -0,0 +1 @@
{"iteration":55277,"last_node_id":11,"last_link_id":10,"links":{"0":{"id":0,"origin_id":0,"origin_slot":0,"target_id":2,"target_slot":0,"data":null},"1":{"id":1,"origin_id":2,"origin_slot":0,"target_id":1,"target_slot":0,"data":null},"2":{"id":2,"origin_id":2,"origin_slot":0,"target_id":3,"target_slot":0,"data":null},"3":{"id":3,"origin_id":3,"origin_slot":0,"target_id":4,"target_slot":0,"data":null},"4":{"id":4,"origin_id":5,"origin_slot":0,"target_id":2,"target_slot":1,"data":null},"5":{"id":5,"origin_id":6,"origin_slot":0,"target_id":0,"target_slot":0,"data":null},"6":{"id":6,"origin_id":7,"origin_slot":0,"target_id":0,"target_slot":1,"data":null},"7":{"id":7,"origin_id":8,"origin_slot":0,"target_id":0,"target_slot":2,"data":null},"8":{"id":8,"origin_id":9,"origin_slot":0,"target_id":0,"target_slot":3,"data":null},"9":{"id":9,"origin_id":9,"origin_slot":0,"target_id":10,"target_slot":0,"data":null}},"config":{},"nodes":[{"id":1,"title":"Destination","type":"audio/destination","pos":[673,171],"size":{"0":140,"1":20},"flags":{},"inputs":[{"name":"in","type":"audio","link":1}],"mode":0,"properties":{}},{"id":2,"title":"BiquadFilter","type":"audio/biquadfilter","pos":[437,251],"size":{"0":140,"1":34},"flags":{},"inputs":[{"name":"in","type":"audio","link":0},{"name":"frequency","type":"number","link":4}],"outputs":[{"name":"out","type":"audio","links":[1,2]}],"mode":0,"properties":{"frequency":350,"detune":0,"Q":1,"type":"lowpass"}},{"id":3,"title":"Analyser","type":"audio/analyser","pos":[672,306],"size":{"0":140,"1":20},"flags":{},"inputs":[{"name":"in","type":"audio","link":2}],"outputs":[{"name":"freqs","type":"array","links":[3]}],"mode":0,"properties":{"fftSize":2048,"minDecibels":-100,"maxDecibels":-10,"smoothingTimeConstant":0.5}},{"id":6,"title":"Knob","type":"widget/knob","pos":[120,183],"size":[54,74],"flags":{},"outputs":[{"name":"","type":"number","links":[5]}],"mode":0,"properties":{"min":0,"max":1,"value":0.5099999999999996,"wcolor":"#7AF","size":50},"boxcolor":"rgba(128,128,128,1.0)"},{"id":0,"title":"Source","type":"audio/source","pos":[251,196],"size":{"0":140,"1":62},"flags":{},"inputs":[{"name":"gain","type":"number","link":5},{"name":"Play","type":-1,"link":6},{"name":"Stop","type":-1,"link":7},{"name":"playbackRate","type":"number","link":8}],"outputs":[{"name":"out","type":"audio","links":[0]}],"mode":0,"properties":{"src":"demodata/audio.wav","gain":0.5,"loop":false,"autoplay":true,"playbackRate":1.0000000000000002}},{"id":8,"title":"Button","type":"widget/button","pos":[274,106],"size":[128,43],"flags":{},"outputs":[{"name":"clicked","type":-1,"links":[7]}],"mode":0,"properties":{"text":"Stop","font":"40px Arial","message":""}},{"id":5,"title":"Knob","type":"widget/knob","pos":[125,293],"size":[54,74],"flags":{},"outputs":[{"name":"","type":"number","links":[4]}],"mode":0,"properties":{"min":0,"max":20000,"value":14800.00000000001,"wcolor":"#7AF","size":50},"boxcolor":"rgba(189,189,189,1.0)"},{"id":10,"title":"Watch","type":"basic/watch","pos":[516,123],"size":{"0":140,"1":20},"flags":{},"inputs":[{"name":"value","type":0,"link":9,"label":"1.000"}],"outputs":[{"name":"value","type":0,"links":null,"label":""}],"mode":0,"properties":{"value":1.0000000000000002}},{"id":9,"title":"Knob","type":"widget/knob","pos":[429,119],"size":[64,84],"flags":{},"outputs":[{"name":"","type":"number","links":[8,9]}],"mode":0,"properties":{"min":0,"max":4,"value":1.0000000000000002,"wcolor":"#7AF","size":50},"boxcolor":"rgba(64,64,64,1.0)"},{"id":7,"title":"Button","type":"widget/button","pos":[114,103],"size":[128,43],"flags":{},"outputs":[{"name":"clicked","type":-1,"links":[6]}],"mode":0,"properties":{"text":"Play","font":"40px Arial","message":""}},{"id":4,"title":"Visualization","type":"audio/visualization","pos":[132,394],"size":[662,180],"flags":{},"inputs":[{"name":"freqs","type":"array","link":3}],"mode":0,"properties":{"continuous":true}}]}

1
demo/examples/audio_delay.json Normal file
View File

@@ -0,0 +1 @@
{"iteration":27893,"last_node_id":7,"last_link_id":7,"links":{"0":{"id":0,"origin_id":0,"origin_slot":0,"target_id":1,"target_slot":0,"data":null},"1":{"id":1,"origin_id":0,"origin_slot":0,"target_id":2,"target_slot":0,"data":null},"2":{"id":2,"origin_id":2,"origin_slot":0,"target_id":1,"target_slot":2,"data":null},"3":{"id":3,"origin_id":1,"origin_slot":0,"target_id":3,"target_slot":0,"data":null},"4":{"id":4,"origin_id":4,"origin_slot":0,"target_id":1,"target_slot":1,"data":null},"5":{"id":5,"origin_id":5,"origin_slot":0,"target_id":1,"target_slot":3,"data":null},"6":{"id":6,"origin_id":6,"origin_slot":0,"target_id":2,"target_slot":1,"data":null}},"config":{},"nodes":[{"id":0,"title":"Source","type":"audio/source","pos":[195,187],"size":{"0":140,"1":20},"flags":{},"inputs":[{"name":"gain","type":"number","link":null}],"outputs":[{"name":"out","type":"audio","links":[0,1]}],"mode":0,"properties":{"src":"demodata/audio.wav","gain":0.5,"loop":true,"autoplay":true,"playbackRate":1}},{"id":1,"title":"Mixer","type":"audio/mixer","pos":[655,183],"size":{"0":140,"1":62},"flags":{},"inputs":[{"name":"in1","type":"audio","link":0},{"name":"in1 gain","type":"number","link":4},{"name":"in2","type":"audio","link":2},{"name":"in2 gain","type":"number","link":5}],"outputs":[{"name":"out","type":"audio","links":[3]}],"mode":0,"properties":{"gain1":0.5,"gain2":0.8}},{"id":3,"title":"Destination","type":"audio/destination","pos":[911,180],"size":{"0":140,"1":20},"flags":{},"inputs":[{"name":"in","type":"audio","link":3}],"mode":0,"properties":{}},{"id":4,"title":"Knob","type":"widget/knob","pos":[408,59],"size":[54,74],"flags":{},"outputs":[{"name":"","type":"number","links":[4]}],"mode":0,"properties":{"min":0,"max":1,"value":0.24000000000000007,"wcolor":"#7AF","size":50},"boxcolor":"rgba(128,128,128,1.0)"},{"id":5,"title":"Knob","type":"widget/knob","pos":[433,371],"size":[54,74],"flags":{},"outputs":[{"name":"","type":"number","links":[5]}],"mode":0,"properties":{"min":0,"max":1,"value":0.5199999999999996,"wcolor":"#7AF","size":50},"boxcolor":"rgba(128,128,128,1.0)"},{"id":2,"title":"Delay","type":"audio/delay","pos":[385,255],"size":{"0":142,"1":38},"flags":{},"inputs":[{"name":"in","type":"audio","link":1},{"name":"time","type":"number","link":6}],"outputs":[{"name":"out","type":"audio","links":[2]}],"mode":0,"properties":{"delayTime":0.5,"time":1}},{"id":6,"title":"Knob","type":"widget/knob","pos":[199,296],"size":[64,84],"flags":{},"outputs":[{"name":"","type":"number","links":[6]}],"mode":0,"properties":{"min":0,"max":2,"value":0.8799999999999999,"wcolor":"#7AF","size":50},"boxcolor":"rgba(112,112,112,1.0)"}]}

5
demo/index.html
View File

@@ -4,10 +4,11 @@
<title>LiteGraph</title>
<!--<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">-->
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="../css/litegraph.css">
<link rel="stylesheet" type="text/css" href="../css/litegraph-editor.css">
</head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="main">
</div>

12
demo/style.css
View File

@@ -241,3 +241,15 @@ textarea {
margin: 10px;
}
.selector {
font-size: 1.8em;
}
.selector select {
color: white;
background-color: black;
border: 0;
font-size: 1em;
}

15
src/litegraph-editor.js
View File

@@ -1,6 +1,5 @@
//NOT FINISHED
function Editor(container_id, options)
//Creates an interface to access extra features from a graph (like play, stop, live, etc)
function Editor( container_id, options )
{
//fill container
var html = "<div class='header'><div class='tools tools-left'></div><div class='tools tools-right'></div></div>";
@@ -12,6 +11,8 @@ function Editor(container_id, options)
root.className = "litegraph-editor";
root.innerHTML = html;
this.tools = root.querySelector(".tools");
var canvas = root.querySelector(".graphcanvas");
//create graph
@@ -64,7 +65,8 @@ Editor.prototype.addLoadCounter = function()
Editor.prototype.addToolsButton = function(id,name,icon_url, callback, container)
{
if(!container) container = ".tools";
if(!container)
container = ".tools";
var button = this.createButton(name, icon_url);
button.id = id;
@@ -183,7 +185,9 @@ Editor.prototype.addMiniWindow = function(w,h)
var graphcanvas = new LGraphCanvas(canvas, this.graph);
graphcanvas.background_image = "imgs/grid.png";
graphcanvas.scale = 0.5;
graphcanvas.scale = 0.25;
this.miniwindow_graphcanvas = graphcanvas;
graphcanvas.onClear = function() { graphcanvas.scale = 0.25; };
miniwindow.style.position = "absolute";
miniwindow.style.top = "4px";
@@ -198,7 +202,6 @@ Editor.prototype.addMiniWindow = function(w,h)
});
miniwindow.appendChild(close_button);
this.root.querySelector(".content").appendChild(miniwindow);
}

91
src/litegraph.js
View File

@@ -44,6 +44,7 @@ var LiteGraph = {
debug: false,
throw_errors: true,
registered_node_types: {}, //nodetypes by string
node_types_by_file_extension: {}, //used for droping files in the canvas
Nodes: {}, //node types by classname
/**
@@ -81,6 +82,12 @@ var LiteGraph = {
//warnings
if(base_class.prototype.onPropertyChange)
console.warn("LiteGraph node class " + type + " has onPropertyChange method, it must be called onPropertyChanged with d at the end");
if( base_class.supported_extensions )
{
for(var i in base_class.supported_extensions )
this.node_types_by_file_extension[ base_class.supported_extensions[i].toLowerCase() ] = base_class;
}
},
/**
@@ -119,8 +126,8 @@ var LiteGraph = {
title = title || base_class.title || type;
var node = new base_class( name );
node.type = type;
if(!node.title) node.title = title;
if(!node.properties) node.properties = {};
if(!node.properties_info) node.properties_info = [];
@@ -1185,7 +1192,15 @@ LGraph.prototype.configure = function(data, keep_old)
node.id = n_info.id; //id it or it will create a new id
this.add(node, true); //add before configure, otherwise configure cannot create links
node.configure(n_info);
}
//configure nodes afterwards so they can reach each other
for(var i = 0, l = nodes.length; i < l; ++i)
{
var n_info = nodes[i];
var node = this.getNodeById( n_info.id );
if(node)
node.configure( n_info );
}
this.updateExecutionOrder();
@@ -1193,6 +1208,27 @@ LGraph.prototype.configure = function(data, keep_old)
return error;
}
LGraph.prototype.load = function(url)
{
var that = this;
var req = new XMLHttpRequest();
req.open('GET', url, true);
req.send(null);
req.onload = function (oEvent) {
if(req.status !== 200)
{
console.error("Error loading graph:",req.status,req.response);
return;
}
var data = JSON.parse( req.response );
that.configure(data);
}
req.onerror = function(err)
{
console.error("Error loading graph:",err);
}
}
LGraph.prototype.onNodeTrace = function(node, msg, color)
{
//TODO
@@ -1331,7 +1367,26 @@ LGraphNode.prototype.configure = function(info)
}
if(this.onConnectionsChange)
this.onConnectionsChange();
{
if(this.inputs)
for(var i = 0; i < this.inputs.length; ++i)
{
var input = this.inputs[i];
var link_info = this.graph.links[ input.link ];
this.onConnectionsChange( LiteGraph.INPUT, i, true, link_info ); //link_info has been created now, so its updated
}
if(this.outputs)
for(var i = 0; i < this.outputs.length; ++i)
{
var output = this.outputs[i];
for(var j = 0; j < output.links.length; ++j)
{
var link_info = this.graph.links[ output.links[j] ];
this.onConnectionsChange( LiteGraph.OUTPUT, i, true, link_info ); //link_info has been created now, so its updated
}
}
}
//FOR LEGACY, PLEASE REMOVE ON NEXT VERSION
for(var i in this.inputs)
@@ -1554,7 +1609,10 @@ LGraphNode.prototype.getInputNode = function( slot )
var input = this.inputs[slot];
if(!input || !input.link)
return null;
return this.graph.getNodeById( input.link.origin_id );
var link_info = this.graph.links[ input.link ];
if(!link_info)
return null;
return this.graph.getNodeById( link_info.origin_id );
}
@@ -3447,8 +3505,11 @@ LGraphCanvas.prototype.processDrop = function(e)
if(!node)
{
var r = null;
if(this.onDropItem)
this.onDropItem( event );
r = this.onDropItem( event );
if(!r)
this.checkDropItem(e);
return;
}
@@ -3496,6 +3557,26 @@ LGraphCanvas.prototype.processDrop = function(e)
return false;
}
//called if the graph doesnt have a default drop item behaviour
LGraphCanvas.prototype.checkDropItem = function(e)
{
if(e.dataTransfer.files.length)
{
var file = e.dataTransfer.files[0];
var ext = LGraphCanvas.getFileExtension( file.name ).toLowerCase();
var nodetype = LiteGraph.node_types_by_file_extension[ext];
if(nodetype)
{
var node = LiteGraph.createNode( nodetype.type );
node.pos = [e.canvasX, e.canvasY];
this.graph.add( node );
if( node.onDropFile )
node.onDropFile( file );
}
}
}
LGraphCanvas.prototype.processNodeSelected = function(n,e)
{
n.selected = true;

582
src/nodes/audio.js
View File

@@ -3,33 +3,8 @@
(function( global )
{
function LGAudio()
{
this.properties = {
src: "demodata/audio.wav",
gain: 0.5,
loop: true
};
this._loading_audio = false;
this._audio_buffer = null;
this._audionodes = [];
this.addOutput( "out", "audio" );
this.addInput( "gain", "number" );
//init context
var context = LGAudio.getAudioContext();
//create gain node
this.audionode = context.createGain();
this.audionode.graphnode = this;
this.audionode.gain.value = this.properties.gain;
//debug
if(this.properties.src)
this.loadSound( this.properties.src );
}
var LGAudio = {};
global.LGAudio = LGAudio;
LGAudio.getAudioContext = function()
{
@@ -55,128 +30,94 @@ LGAudio.getAudioContext = function()
LGAudio.connect = function( audionodeA, audionodeB )
{
audionodeA.connect( audionodeB );
/*
if(!nodeA.outputs)
nodeA.outputs = [];
nodeA.outputs.push( nodeB );
if(!nodeB.inputs)
nodeB.inputs = [];
nodeB.inputs.push( nodeA );
*/
try
{
audionodeA.connect( audionodeB );
}
catch (err)
{
console.warn("LGraphAudio:",err);
}
}
LGAudio.disconnect = function( audionodeA, audionodeB )
{
audionodeA.disconnect( audionodeB );
/*
if(nodeA.outputs)
try
{
var index = nodeA.outputs.indexOf( nodeB );
if(index != -1)
nodeA.outputs.splice(index,1);
audionodeA.disconnect( audionodeB );
}
if(nodeB.inputs)
catch (err)
{
var index = nodeB.inputs.indexOf( nodeA );
if(index != -1)
nodeB.inputs.splice(index,1);
}
*/
}
LGAudio.prototype.onAdded = function(graph)
{
if(graph.status === LGraph.STATUS_RUNNING)
this.onStart();
}
LGAudio.prototype.onStart = function()
{
if(!this._audio_buffer)
return;
this.playBuffer( this._audio_buffer );
}
LGAudio.prototype.onStop = function()
{
this.stopAllSounds();
}
LGAudio.prototype.onRemoved = function()
{
this.stopAllSounds();
}
LGAudio.prototype.stopAllSounds = function()
{
//iterate and stop
for(var i = 0; i < this._audionodes.length; ++i )
{
this._audionodes[i].stop();
//this._audionodes[i].disconnect( this.audionode );
}
this._audionodes.length = 0;
}
LGAudio.prototype.onExecute = function()
{
var v = this.getInputData(0);
if( v !== undefined )
this.audionode.gain.value = v;
}
LGAudio.prototype.onAction = function(event)
{
if(this._audio_buffer)
{
if(event == "Play")
this.playBuffer(this._audio_buffer);
else if(event == "Stop")
this.stopAllSounds();
console.warn("LGraphAudio:",err);
}
}
LGAudio.prototype.onPropertyChanged = function( name, value )
LGAudio.changeAllAudiosConnections = function( node, connect )
{
if( name == "src" )
this.loadSound( value );
else if(name == "gain")
this.audionode.gain.value = value;
}
LGAudio.prototype.playBuffer = function( buffer )
{
var that = this;
var context = LGAudio.getAudioContext();
//create a new audionode (this is mandatory, AudioAPI doesnt like to reuse old ones)
var audionode = context.createBufferSource(); //create a AudioBufferSourceNode
audionode.graphnode = this;
audionode.buffer = buffer;
audionode.loop = this.properties.loop;
this._audionodes.push( audionode );
audionode.connect( this.audionode ); //connect to gain
this._audionodes.push( audionode );
audionode.onended = function()
if(node.inputs)
{
console.log("ended!");
that.trigger("ended");
//remove
var index = that._audionodes.indexOf( audionode );
if(index != -1)
that._audionodes.splice(index,1);
for(var i = 0; i < node.inputs.length; ++i)
{
var input = node.inputs[i];
var link_info = node.graph.links[ input.link ];
if(!link_info)
continue;
var origin_node = node.graph.getNodeById( link_info.origin_id );
var origin_audionode = null;
if( origin_node.getAudioNodeInOutputSlot )
origin_audionode = origin_node.getAudioNodeInOutputSlot( link_info.origin_slot );
else
origin_audionode = origin_node.audionode;
var target_audionode = null;
if( node.getAudioNodeInInputSlot )
target_audionode = node.getAudioNodeInInputSlot( i );
else
target_audionode = node.audionode;
if(connect)
LGAudio.connect( origin_audionode, target_audionode );
else
LGAudio.disconnect( origin_audionode, target_audionode );
}
}
audionode.start();
return audionode;
if(node.outputs)
{
for(var i = 0; i < node.outputs.length; ++i)
{
var output = node.outputs[i];
for(var j = 0; j < output.links.length; ++j)
{
var link_info = node.graph.links[ output.links[j] ];
if(!link_info)
continue;
var origin_audionode = null;
if( node.getAudioNodeInOutputSlot )
origin_audionode = node.getAudioNodeInOutputSlot( i );
else
origin_audionode = node.audionode;
var target_node = node.graph.getNodeById( link_info.target_id );
var target_audionode = null;
if( target_node.getAudioNodeInInputSlot )
target_audionode = target_node.getAudioNodeInInputSlot( link_info.target_slot );
else
target_audionode = target_node.audionode;
if(connect)
LGAudio.connect( origin_audionode, target_audionode );
else
LGAudio.disconnect( origin_audionode, target_audionode );
}
}
}
}
LGAudio.prototype.onConnectionsChange = function( connection, slot, connected, link_info )
//used by many nodes
LGAudio.onConnectionsChange = function( connection, slot, connected, link_info )
{
//only process the outputs events
if(connection != LiteGraph.OUTPUT)
@@ -189,23 +130,169 @@ LGAudio.prototype.onConnectionsChange = function( connection, slot, connected, l
if( !target_node )
return;
if( connected )
{
if(target_node.connectAudioToSlot)
target_node.connectAudioToSlot( this.audionode, link_info.target_slot );
else
LGAudio.connect( this.audionode, target_node.audionode );
}
//get origin audionode
var local_audionode = null;
if(this.getAudioNodeInOutputSlot)
local_audionode = this.getAudioNodeInOutputSlot( slot );
else
local_audionode = this.audionode;
//get target audionode
var target_audionode = null;
if(target_node.getAudioNodeInInputSlot)
target_audionode = target_node.getAudioNodeInInputSlot( link_info.target_slot );
else
target_audionode = target_node.audionode;
//do the connection/disconnection
if( connected )
LGAudio.connect( local_audionode, target_audionode );
else
LGAudio.disconnect( local_audionode, target_audionode );
}
//****************************************************
function LGAudioSource()
{
this.properties = {
src: "demodata/audio.wav",
gain: 0.5,
loop: true,
autoplay: true,
playbackRate: 1
};
this._loading_audio = false;
this._audio_buffer = null;
this._audionodes = [];
this.addOutput( "out", "audio" );
this.addInput( "gain", "number" );
//init context
var context = LGAudio.getAudioContext();
//create gain node
this.audionode = context.createGain();
this.audionode.graphnode = this;
this.audionode.gain.value = this.properties.gain;
//debug
if(this.properties.src)
this.loadSound( this.properties.src );
}
LGAudioSource.supported_extensions = ["wav","ogg","mp3"];
LGAudioSource.prototype.onAdded = function(graph)
{
if(graph.status === LGraph.STATUS_RUNNING)
this.onStart();
}
LGAudioSource.prototype.onStart = function()
{
if(!this._audio_buffer)
return;
if(this.properties.autoplay)
this.playBuffer( this._audio_buffer );
}
LGAudioSource.prototype.onStop = function()
{
this.stopAllSounds();
}
LGAudioSource.prototype.onRemoved = function()
{
this.stopAllSounds();
}
LGAudioSource.prototype.stopAllSounds = function()
{
//iterate and stop
for(var i = 0; i < this._audionodes.length; ++i )
{
if(target_node.disconnectAudioFromSlot)
target_node.disconnectAudioFromSlot( this.audionode, link_info.target_slot );
else
LGAudio.disconnect( this.audionode, target_node.audionode );
this._audionodes[i].stop();
//this._audionodes[i].disconnect( this.audionode );
}
this._audionodes.length = 0;
}
LGAudioSource.prototype.onExecute = function()
{
if(!this.inputs)
return;
for(var i = 0; i < this.inputs.length; ++i)
{
var input = this.inputs[i];
if(!input.link)
continue;
var v = this.getInputData(i);
if( v === undefined )
continue;
if( input.name == "gain" )
this.audionode.gain.value = v;
else if( input.name == "playbackRate" )
this.properties.playbackRate = v;
}
}
LGAudio.prototype.loadSound = function( url )
LGAudioSource.prototype.onAction = function(event)
{
if(this._audio_buffer)
{
if(event == "Play")
this.playBuffer(this._audio_buffer);
else if(event == "Stop")
this.stopAllSounds();
}
}
LGAudioSource.prototype.onPropertyChanged = function( name, value )
{
if( name == "src" )
this.loadSound( value );
else if(name == "gain")
this.audionode.gain.value = value;
}
LGAudioSource.prototype.playBuffer = function( buffer )
{
var that = this;
var context = LGAudio.getAudioContext();
//create a new audionode (this is mandatory, AudioAPI doesnt like to reuse old ones)
var audionode = context.createBufferSource(); //create a AudioBufferSourceNode
audionode.graphnode = this;
audionode.buffer = buffer;
audionode.loop = this.properties.loop;
audionode.playbackRate.value = this.properties.playbackRate;
this._audionodes.push( audionode );
audionode.connect( this.audionode ); //connect to gain
this._audionodes.push( audionode );
audionode.onended = function()
{
//console.log("ended!");
that.trigger("ended");
//remove
var index = that._audionodes.indexOf( audionode );
if(index != -1)
that._audionodes.splice(index,1);
}
audionode.start();
return audionode;
}
LGAudioSource.prototype.loadSound = function( url )
{
var that = this;
@@ -235,6 +322,12 @@ LGAudio.prototype.loadSound = function( url )
request.onload = function() {
context.decodeAudioData( request.response, function(buffer) {
that._audio_buffer = buffer;
if(that._url)
{
URL.revokeObjectURL( that._url );
that._url = null;
}
that._loading_audio = false;
//if is playing, then play it
if(that.graph && that.graph.status === LGraph.STATUS_RUNNING)
@@ -249,21 +342,33 @@ LGAudio.prototype.loadSound = function( url )
}
}
LGAudio.prototype.onGetInputs = function()
//Helps connect/disconnect AudioNodes when new connections are made in the node
LGAudioSource.prototype.onConnectionsChange = LGAudio.onConnectionsChange;
LGAudioSource.prototype.onGetInputs = function()
{
return [["Play",LiteGraph.ACTION],["Stop",LiteGraph.ACTION]];
return [["playbackRate","number"],["Play",LiteGraph.ACTION],["Stop",LiteGraph.ACTION]];
}
LGAudio.prototype.onGetOutputs = function()
LGAudioSource.prototype.onGetOutputs = function()
{
return [["ended",LiteGraph.EVENT]];
}
LGAudioSource.prototype.onDropFile = function(file)
{
if(this._url)
URL.revokeObjectURL( this._url );
this._url = URL.createObjectURL( file );
this.properties.src = this._url;
this.loadSound( this._url );
}
LGAudioSource.title = "Source";
LGAudioSource.desc = "Plays audio";
LiteGraph.registerNodeType("audio/source", LGAudioSource);
LGAudio.title = "Source";
LGAudio.desc = "Plays audio";
LiteGraph.registerNodeType("audio/source", LGAudio);
global.LGAudio = LGAudio;
//*****************************************************
@@ -286,7 +391,7 @@ function LGAudioAnalyser()
this.audionode.smoothingTimeConstant = this.properties.smoothingTimeConstant;
this.addInput("in","audio");
this.addOutput("freqs","FFT");
this.addOutput("freqs","array");
//this.addOutput("time","freq");
this._freq_bin = null;
@@ -351,33 +456,7 @@ function createAudioNodeWrapper( class_object )
this.audionode[ name ] = value;
}
class_object.prototype.onConnectionsChange = function( connection, slot, connected, link_info )
{
//only process the outputs events
if(connection != LiteGraph.OUTPUT)
return;
var target_node = null;
if( link_info )
target_node = this.graph.getNodeById( link_info.target_id );
if( !target_node )
return;
if( connected )
{
if(target_node.connectAudioToSlot)
target_node.connectAudioToSlot( this.audionode, link_info.target_slot );
else
LGAudio.connect( this.audionode, target_node.audionode );
}
else
{
if(target_node.disconnectAudioFromSlot)
target_node.disconnectAudioFromSlot( this.audionode, link_info.target_slot );
else
LGAudio.disconnect( this.audionode, target_node.audionode );
}
}
class_object.prototype.onConnectionsChange = LGAudio.onConnectionsChange;
}
@@ -417,6 +496,44 @@ LGAudioGain.desc = "Audio gain";
LiteGraph.registerNodeType("audio/gain", LGAudioGain);
function LGAudioWaveShaper()
{
//default
this.properties = {
};
this.audionode = LGAudio.getAudioContext().createWaveShaper();
this.addInput("in","audio");
this.addInput("shape","waveshape");
this.addOutput("out","audio");
}
LGAudioWaveShaper.prototype.onExecute = function()
{
if(!this.inputs || !this.inputs.length)
return;
var v = this.getInputData(1);
if(v === undefined)
return;
this.audionode.curve = v;
}
LGAudioWaveShaper.prototype.setWaveShape = function(shape)
{
this.audionode.curve = shape;
}
createAudioNodeWrapper( LGAudioWaveShaper );
/* disabled till I dont find a way to do a wave shape
LGAudioWaveShaper.title = "WaveShaper";
LGAudioWaveShaper.desc = "Distortion using wave shape";
LiteGraph.registerNodeType("audio/waveShaper", LGAudioWaveShaper);
*/
function LGAudioMixer()
{
//default
@@ -443,20 +560,12 @@ function LGAudioMixer()
this.addOutput("out","audio");
}
LGAudioMixer.prototype.connectAudioToSlot = function( audionode, slot )
LGAudioMixer.prototype.getAudioNodeInInputSlot = function( slot )
{
if(slot == 0)
LGAudio.connect( audionode, this.audionode1 );
return this.audionode1;
else if(slot == 2)
LGAudio.connect( audionode, this.audionode2 );
}
LGAudioMixer.prototype.disconnectAudioFromSlot = function( audionode, slot )
{
if(slot == 0)
LGAudio.disconnect( audionode, this.audionode1 );
else if(slot == 2)
LGAudio.disconnect( audionode, this.audionode2 );
return this.audionode2;
}
LGAudioMixer.prototype.onExecute = function()
@@ -492,46 +601,23 @@ function LGAudioDelay()
{
//default
this.properties = {
time: 5
delayTime: 0.5
};
this.audionode = LGAudio.getAudioContext().createDelay( this.properties.time );
this.audionode = LGAudio.getAudioContext().createDelay( 10 );
this.audionode.delayTime.value = this.properties.delayTime;
this.addInput("in","audio");
this.addInput("time","number");
this.addOutput("out","audio");
}
createAudioNodeWrapper( LGAudioDelay );
LGAudioDelay.prototype.onPropertyChanged = function( name, value )
LGAudioDelay.prototype.onExecute = function()
{
if(name == "time")
{
if(value > 500)
value = 500;
if(value < 0)
value = 0;
var input_node = this.getInputNode(0);
var output_nodes = this.getOutputNodes(0);
if(input_node)
input_node.audionode.disconnect( this.audionode );
if(output_nodes)
{
for(var i = 0; i < output_nodes.length; ++i)
this.audionode.disconnect( output_nodes[i].audionode );
}
this.audionode = LGAudio.getAudioContext().createDelay( value );
if(input_node)
input_node.audionode.connect( this.audionode );
if(output_nodes)
{
for(var i = 0; i < output_nodes.length; ++i)
this.audionode.connect( output_nodes[i].audionode );
}
}
var v = this.getInputData(1);
if(v !== undefined )
this.audionode.delayTime.value = v;
}
LGAudioDelay.title = "Delay";
@@ -585,25 +671,16 @@ LiteGraph.registerNodeType("audio/biquadfilter", LGAudioBiquadFilter);
//*****************************************************
function LGAudioDestination()
{
this.audionode = LGAudio.getAudioContext().destination;
this.addInput("in","audio");
}
LGAudioDestination.title = "Destination";
LGAudioDestination.desc = "Audio output";
LiteGraph.registerNodeType("audio/destination", LGAudioDestination);
//EXTRA
function LGAudioVisualization()
{
this.addInput("freqs","FFT");
this.properties = {
continuous: true
};
this.addInput("freqs","array");
this.size = [300,200];
this._last_buffer = null;
}
@@ -628,11 +705,24 @@ LGAudioVisualization.prototype.onDrawForeground = function(ctx)
ctx.strokeStyle = "white";
ctx.beginPath();
var x = 0;
for(var i = 0; i < buffer.length; i+= delta)
if(this.properties.continuous)
{
ctx.moveTo(x,h);
ctx.lineTo(x,h - (buffer[i|0]/255) * h);
x++;
for(var i = 0; i < buffer.length; i+= delta)
{
ctx.lineTo(x,h - (buffer[i|0]/255) * h);
x++;
}
}
else
{
for(var i = 0; i < buffer.length; i+= delta)
{
ctx.moveTo(x,h);
ctx.lineTo(x,h - (buffer[i|0]/255) * h);
x++;
}
}
ctx.stroke();
}
@@ -643,4 +733,18 @@ LiteGraph.registerNodeType("audio/visualization", LGAudioVisualization);
function LGAudioDestination()
{
this.audionode = LGAudio.getAudioContext().destination;
this.addInput("in","audio");
}
LGAudioDestination.title = "Destination";
LGAudioDestination.desc = "Audio output";
LiteGraph.registerNodeType("audio/destination", LGAudioDestination);
})( window );

42
src/nodes/image.js
View File

@@ -14,12 +14,13 @@ GraphicsImage.title = "Image";
GraphicsImage.desc = "Image loader";
GraphicsImage.widgets = [{name:"load",text:"Load",type:"button"}];
GraphicsImage.supported_extensions = ["jpg","jpeg","png","gif"];
GraphicsImage.prototype.onAdded = function()
{
if(this.properties["url"] != "" && this.img == null)
{
this.loadImage(this.properties["url"]);
this.loadImage( this.properties["url"] );
}
}
@@ -51,14 +52,7 @@ GraphicsImage.prototype.onPropertyChanged = function(name,value)
return true;
}
GraphicsImage.prototype.onDropFile = function(file, filename)
{
var img = new Image();
img.src = file;
this.img = img;
}
GraphicsImage.prototype.loadImage = function(url)
GraphicsImage.prototype.loadImage = function( url, callback )
{
if(url == "")
{
@@ -68,7 +62,6 @@ GraphicsImage.prototype.loadImage = function(url)
this.img = document.createElement("img");
var url = name;
if(url.substr(0,7) == "http://")
{
if(LiteGraph.proxy) //proxy external files
@@ -80,6 +73,8 @@ GraphicsImage.prototype.loadImage = function(url)
var that = this;
this.img.onload = function()
{
if(callback)
callback(this);
that.trace("Image loaded, size: " + that.img.width + "x" + that.img.height );
this.dirty = true;
that.boxcolor = "#9F9";
@@ -95,6 +90,18 @@ GraphicsImage.prototype.onWidget = function(e,widget)
}
}
GraphicsImage.prototype.onDropFile = function(file)
{
var that = this;
if(this._url)
URL.revokeObjectURL( this._url );
this._url = URL.createObjectURL( file );
this.properties.url = this._url;
this.loadImage( this._url, function(img){
that.size[1] = (img.height / img.width) * that.size[0];
});
}
LiteGraph.registerNodeType("graphics/image", GraphicsImage);
@@ -365,7 +372,7 @@ LiteGraph.registerNodeType("graphics/imagefade", ImageFade);
function ImageCrop()
{
this.addInput("","image");
this.addOutputs("","image");
this.addOutput("","image");
this.properties = {width:256,height:256,x:0,y:0,scale:1.0 };
this.size = [50,20];
}
@@ -388,7 +395,8 @@ ImageCrop.prototype.createCanvas = function()
ImageCrop.prototype.onExecute = function()
{
var input = this.getInputData(0);
if(!input) return;
if(!input)
return;
if(input.width)
{
@@ -401,6 +409,14 @@ ImageCrop.prototype.onExecute = function()
this.setOutputData(0,null);
}
ImageCrop.prototype.onDrawBackground = function(ctx)
{
if(this.flags.collapsed)
return;
if(this.canvas)
ctx.drawImage( this.canvas, 0,0,this.canvas.width,this.canvas.height, 0,0, this.size[0], this.size[1] );
}
ImageCrop.prototype.onPropertyChanged = function(name,value)
{
this.properties[name] = value;
@@ -422,7 +438,7 @@ ImageCrop.prototype.onPropertyChanged = function(name,value)
return true;
}
LiteGraph.registerNodeType("graphics/cropImage", ImageFade );
LiteGraph.registerNodeType("graphics/cropImage", ImageCrop );
function ImageVideo()

3
style.css
View File

@@ -10,4 +10,5 @@ h1 {
padding: 1em;
background-color: white;
box-shadow: 0 0 2px #333;
}
}