support to subgraphs

doc/files/.._src_litegraph.js.html

@@ -379,7 +379,7 @@ LGraph.prototype.clear = function()
 	this.global_inputs = {};
 	this.global_outputs = {};
 
-	this.graph = {};
+	//this.graph = {};
 	this.debug = true;
 
 	this.change();
@@ -854,10 +854,18 @@ LGraph.prototype.getNodeOnPos = function(x,y, nodes_list)
 	return null;
 }
 
+// ********** GLOBALS *****************
+
 //Tell this graph has a global input of this type
 LGraph.prototype.addGlobalInput = function(name, type, value)
 {
-	this.global_inputs[name] = { type: type, value: value };
+	this.global_inputs[name] = { name: name, type: type, value: value };
+
+	if(this.onGlobalInputAdded)
+		this.onGlobalInputAdded(name, type);
+
+	if(this.onGlobalsChange)
+		this.onGlobalsChange();
 }
 
 //assign a data to the global input
@@ -869,29 +877,117 @@ LGraph.prototype.setGlobalInputData = function(name, data)
 	input.value = data;
 }
 
+//assign a data to the global input
+LGraph.prototype.getGlobalInputData = function(name)
+{
+	var input = this.global_inputs[name];
+	if (!input)
+		return null;
+	return input.value;
+}
+
 //rename the global input
 LGraph.prototype.renameGlobalInput = function(old_name, name, data)
 {
+	if(!this.global_inputs[old_name])
+		return false;
+
+	if(this.global_inputs[name])
+	{
+		console.error("there is already one input with that name");
+		return false;
+	}
+
+	this.global_inputs[name] = this.global_inputs[old_name];
+	delete this.global_inputs[old_name];
+
+	if(this.onGlobalInputRenamed)
+		this.onGlobalInputRenamed(old_name, name);
+
+	if(this.onGlobalsChange)
+		this.onGlobalsChange();
+}
+
+LGraph.prototype.removeGlobalInput = function(name)
+{
+	if(!this.global_inputs[name])
+		return false;
+
+	delete this.global_inputs[name];
+
+	if(this.onGlobalInputRemoved)
+		this.onGlobalInputRemoved(name);
+
+	if(this.onGlobalsChange)
+		this.onGlobalsChange();
+	return true;
 }
 
 
 LGraph.prototype.addGlobalOutput = function(name, type, value)
 {
-	this.global_outputs[name] = { type: type, value: value };
+	this.global_outputs[name] = { name: name, type: type, value: value };
+
+	if(this.onGlobalOutputAdded)
+		this.onGlobalOutputAdded(name, type);
+
+	if(this.onGlobalsChange)
+		this.onGlobalsChange();
 }
 
 //assign a data to the global output
-LGraph.prototype.setGlobalOutputData = function(name, data)
+LGraph.prototype.setGlobalOutputData = function(name, value)
 {
 	var output = this.global_outputs[ name ];
 	if (!output)
 		return;
-	output.value = data;
+	output.value = value;
 }
 
+//assign a data to the global input
+LGraph.prototype.getGlobalOutputData = function(name)
+{
+	var output = this.global_outputs[name];
+	if (!output)
+		return null;
+	return output.value;
+}
+
+
 //rename the global output
 LGraph.prototype.renameGlobalOutput = function(old_name, name, data)
 {
+	if(!this.global_outputs[old_name])
+		return false;
+
+	if(this.global_outputs[name])
+	{
+		console.error("there is already one output with that name");
+		return false;
+	}
+
+	this.global_outputs[name] = this.global_outputs[old_name];
+	delete this.global_outputs[old_name];
+
+	if(this.onGlobalOutputRenamed)
+		this.onGlobalOutputRenamed(old_name, name);
+
+	if(this.onGlobalsChange)
+		this.onGlobalsChange();
+}
+
+LGraph.prototype.removeGlobalOutput = function(name)
+{
+	if(!this.global_outputs[name])
+		return false;
+	delete this.global_outputs[name];
+
+	if(this.onGlobalOutputRemoved)
+		this.onGlobalOutputRemoved(name);
+
+	if(this.onGlobalsChange)
+		this.onGlobalsChange();
+	return true;
 }
 
 
@@ -997,7 +1093,7 @@ LGraph.prototype.serialize = function()
 
 
 	var data = {
-		graph: this.graph,
+//		graph: this.graph,
 
 		iteration: this.iteration,
 		frame: this.frame,
@@ -1133,7 +1229,12 @@ LGraphNode.prototype.configure = function(info)
 		if(info[j] == null)
 			continue;
 		else if (typeof(info[j]) == 'object') //object
-			this[j] = LiteGraph.cloneObject(info[j], this[j]);
+		{
+			if(this[j] && this[j].configure)
+				this[j].configure( info[j] );
+			else
+				this[j] = LiteGraph.cloneObject(info[j], this[j]);
+		}
 		else //value
 			this[j] = info[j];
 	}
@@ -1206,6 +1307,36 @@ LGraphNode.prototype.serialize = function()
 	return o;
 }
 
+
+/* Creates a clone of this node */
+LGraphNode.prototype.clone = function()
+{
+	var node = LiteGraph.createNode(this.type);
+
+	var data = this.serialize();
+	delete data["id"];
+	node.configure(data);
+
+	/*
+	node.size = this.size.concat();
+	if(this.inputs)
+		for(var i = 0, l = this.inputs.length; i < l; ++i)
+		{
+			if(node.findInputSlot( this.inputs[i].name ) == -1)
+				node.addInput( this.inputs[i].name, this.inputs[i].type );
+		}
+
+	if(this.outputs)
+		for(var i = 0, l = this.outputs.length; i < l; ++i)
+		{
+			if(node.findOutputSlot( this.outputs[i].name ) == -1)
+				node.addOutput( this.outputs[i].name, this.outputs[i].type );
+		}
+	*/
+
+	return node;
+}
+
 //reduced version of objectivize: NOT FINISHED
 /*
 LGraphNode.prototype.reducedObjectivize = function()
@@ -1384,6 +1515,8 @@ LGraphNode.prototype.addOutput = function(name,type,extra_info)
 
 	if(!this.outputs) this.outputs = [];
 	this.outputs.push(o);
+	if(this.onOutputAdded)
+		this.onOutputAdded(o);
 	this.size = this.computeSize();
 }
 
@@ -1405,6 +1538,8 @@ LGraphNode.prototype.addOutputs = function(array)
 		if(!this.outputs)
 			this.outputs = [];
 		this.outputs.push(o);
+		if(this.onOutputAdded)
+			this.onOutputAdded(o);
 	}
 
 	this.size = this.computeSize();
@@ -1420,6 +1555,8 @@ LGraphNode.prototype.removeOutput = function(slot)
 	this.disconnectOutput(slot);
 	this.outputs.splice(slot,1);
 	this.size = this.computeSize();
+	if(this.onOutputRemoved)
+		this.onOutputRemoved(slot);
 }
 
 /**
@@ -1439,6 +1576,8 @@ LGraphNode.prototype.addInput = function(name,type,extra_info)
 	if(!this.inputs) this.inputs = [];
 	this.inputs.push(o);
 	this.size = this.computeSize();
+	if(this.onInputAdded)
+		this.onInputAdded(o);
 }
 
 /**
@@ -1459,6 +1598,8 @@ LGraphNode.prototype.addInputs = function(array)
 		if(!this.inputs)
 			this.inputs = [];
 		this.inputs.push(o);
+		if(this.onInputAdded)
+			this.onInputAdded(o);
 	}
 
 	this.size = this.computeSize();
@@ -1474,6 +1615,8 @@ LGraphNode.prototype.removeInput = function(slot)
 	this.disconnectInput(slot);
 	this.inputs.splice(slot,1);
 	this.size = this.computeSize();
+	if(this.onInputRemoved)
+		this.onInputRemoved(slot);
 }
 
 /**
@@ -1816,29 +1959,6 @@ LGraphNode.prototype.alignToGrid = function()
 	this.pos[1] = LiteGraph.CANVAS_GRID_SIZE * Math.round(this.pos[1] / LiteGraph.CANVAS_GRID_SIZE);
 }
 
-/* Creates a clone of this node */
-LGraphNode.prototype.clone = function()
-{
-	var node = LiteGraph.createNode(this.type);
-
-	node.size = this.size.concat();
-	if(this.inputs)
-		for(var i = 0, l = this.inputs.length; i < l; ++i)
-		{
-			if(node.findInputSlot( this.inputs[i].name ) == -1)
-				node.addInput( this.inputs[i].name, this.inputs[i].type );
-		}
-
-	if(this.outputs)
-		for(var i = 0, l = this.outputs.length; i < l; ++i)
-		{
-			if(node.findOutputSlot( this.outputs[i].name ) == -1)
-				node.addOutput( this.outputs[i].name, this.outputs[i].type );
-		}
-
-
-	return node;
-}
 
 /* Console output */
 LGraphNode.prototype.trace = function(msg)
@@ -2061,7 +2181,7 @@ LGraphCanvas.prototype.clear = function()
 * assigns a graph, you can reasign graphs to the same canvas
 *
 * @method setGraph
-* @param {LGraph} assigns a graph
+* @param {LGraph} graph
 */
 LGraphCanvas.prototype.setGraph = function(graph)
 {
@@ -2085,6 +2205,48 @@ LGraphCanvas.prototype.setGraph = function(graph)
 	this.setDirty(true,true);
 }
 
+/**
+* opens a graph contained inside a node in the current graph
+*
+* @method openSubgraph
+* @param {LGraph} graph
+*/
+LGraphCanvas.prototype.openSubgraph = function(graph)
+{
+	if(!graph) 
+		throw("graph cannot be null");
+
+	if(this.graph == graph)
+		throw("graph cannot be the same");
+
+	this.clear();
+
+	if(this.graph)
+	{
+		if(!this._graph_stack)
+			this._graph_stack = [];
+		this._graph_stack.push(this.graph);
+	}
+
+	graph.attachCanvas(this);
+	this.setDirty(true,true);
+}
+
+/**
+* closes a subgraph contained inside a node 
+*
+* @method closeSubgraph
+* @param {LGraph} assigns a graph
+*/
+LGraphCanvas.prototype.closeSubgraph = function()
+{
+	if(!this._graph_stack || this._graph_stack.length == 0)
+		return;
+	var graph = this._graph_stack.pop();
+	graph.attachCanvas(this);
+	this.setDirty(true,true);
+}
+
 /**
 * assigns a canvas
 *
@@ -3988,32 +4150,59 @@ LGraphCanvas.node_colors = {
 
 LGraphCanvas.prototype.getCanvasMenuOptions = function()
 {
-	return [
-		{content:"Add Node", is_menu: true, callback: LGraphCanvas.onMenuAdd }
-		//{content:"Collapse All", callback: LGraphCanvas.onMenuCollapseAll }
-	];
+	var options = null;
+	if(this.getMenuOptions)
+		options = this.getMenuOptions();
+	else
+	{
+		options = [
+			{content:"Add Node", is_menu: true, callback: LGraphCanvas.onMenuAdd }
+			//{content:"Collapse All", callback: LGraphCanvas.onMenuCollapseAll }
+		];
+
+		if(this._graph_stack)
+			options = [{content:"Close subgraph", callback: this.closeSubgraph.bind(this) },null].concat(options);
+	}
+
+	if(this.getExtraMenuOptions)
+	{
+		var extra = this.getExtraMenuOptions(this);
+		extra.push(null);
+		options = extra.concat( options );
+	}
+
+	return options;
 }
 
 LGraphCanvas.prototype.getNodeMenuOptions = function(node)
 {
-	var options = [
-		{content:"Inputs", is_menu: true, disabled:true, callback: LGraphCanvas.onMenuNodeInputs },
-		{content:"Outputs", is_menu: true, disabled:true, callback: LGraphCanvas.onMenuNodeOutputs },
-		null,
-		{content:"Collapse", callback: LGraphCanvas.onMenuNodeCollapse },
-		{content:"Pin", callback: LGraphCanvas.onMenuNodePin },
-		{content:"Colors", is_menu: true, callback: LGraphCanvas.onMenuNodeColors },
-		{content:"Shapes", is_menu: true, callback: LGraphCanvas.onMenuNodeShapes },
-		null,
-		{content:"Clone", callback: LGraphCanvas.onMenuNodeClone },
-		null,
-		{content:"Remove", callback: LGraphCanvas.onMenuNodeRemove }
-	];
+	var options = null;
 
-	if( node.clonable == false )
-		options[7].disabled = true;
-	if( node.removable == false )
-		options[9].disabled = true;
+	if(node.getMenuOptions)
+		options = node.getMenuOptions(this);
+	else
+		options = [
+			{content:"Inputs", is_menu: true, disabled:true, callback: LGraphCanvas.onMenuNodeInputs },
+			{content:"Outputs", is_menu: true, disabled:true, callback: LGraphCanvas.onMenuNodeOutputs },
+			null,
+			{content:"Collapse", callback: LGraphCanvas.onMenuNodeCollapse },
+			{content:"Pin", callback: LGraphCanvas.onMenuNodePin },
+			{content:"Colors", is_menu: true, callback: LGraphCanvas.onMenuNodeColors },
+			{content:"Shapes", is_menu: true, callback: LGraphCanvas.onMenuNodeShapes },
+			null
+		];
+
+	if(node.getExtraMenuOptions)
+	{
+		var extra = node.getExtraMenuOptions(this);
+		extra.push(null);
+		options = extra.concat( options );
+	}
+
+	if( node.clonable !== false )
+			options.push({content:"Clone", callback: LGraphCanvas.onMenuNodeClone });
+	if( node.removable !== false )
+			options.push(null,{content:"Remove", callback: LGraphCanvas.onMenuNodeRemove });
 
 	if(node.onGetInputs)
 	{