fixes in subgraph

build/litegraph.js

@@ -266,6 +266,16 @@
             this.registerNodeType(name, classobj);
         },
 
+        /**
+         * Removes all previously registered node's types
+         */
+        clearRegisteredTypes: function() {
+            this.registered_node_types = {};
+            this.node_types_by_file_extension = {};
+            this.Nodes = {};
+            this.searchbox_extras = {};
+        },
+
         /**
          * Adds this method to all nodetypes, existing and to be created
          * (You can add it to LGraphNode.prototype but then existing node types wont have it)
@@ -1581,10 +1591,10 @@
             return;
         }
 
-		node.graph.beforeChange();
+		this.beforeChange();
         this.inputs[name] = { name: name, type: type, value: value };
         this._version++;
-		node.graph.afterChange();
+		this.afterChange();
 
         if (this.onInputAdded) {
             this.onInputAdded(name, type);
@@ -11944,7 +11954,10 @@ if (typeof exports != "undefined") {
 		var over = LiteGraph.isInsideRectangle(pos[0],pos[1],this.pos[0],this.pos[1] + y,this.size[0],LiteGraph.NODE_TITLE_HEIGHT);
 		ctx.fillStyle = over ? "#555" : "#222";
 		ctx.beginPath();
-		ctx.roundRect( 0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT, 0, 8);
+		if (this._shape == LiteGraph.BOX_SHAPE)
+			ctx.rect(0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT);
+		else
+			ctx.roundRect( 0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT, 0, 8);
 		ctx.fill();
 
 		//button
@@ -12226,15 +12239,21 @@ if (typeof exports != "undefined") {
 		this.updateType();
 	}
 
+	//ensures the type in the node output and the type in the associated graph input are the same
 	GraphInput.prototype.updateType = function()
 	{
 		var type = this.properties.type;
 		this.type_widget.value = type;
+
+		//update output
 		if(this.outputs[0].type != type)
 		{
+	        if (!LiteGraph.isValidConnection(this.outputs[0].type,type))
+				this.disconnectOutput(0);
 			this.outputs[0].type = type;
-			this.disconnectOutput(0);
 		}
+
+		//update widget
 		if(type == "number")
 		{
 			this.value_widget.type = "number";
@@ -12256,8 +12275,14 @@ if (typeof exports != "undefined") {
 			this.value_widget.value = null;
 		}
 		this.properties.value = this.value_widget.value;
+
+		//update graph
+		if (this.graph && this.name_in_graph) {
+			this.graph.changeInputType(this.name_in_graph, type);
+		}
 	}
 
+	//this is executed AFTER the property has changed
 	GraphInput.prototype.onPropertyChanged = function(name,v)
 	{
 		if( name == "name" )
@@ -12279,8 +12304,7 @@ if (typeof exports != "undefined") {
 		}
 		else if( name == "type" )
 		{
-			v = v || "";
-			this.updateType(v);
+			this.updateType();
 		}
 		else if( name == "value" )
 		{
@@ -12357,6 +12381,8 @@ if (typeof exports != "undefined") {
                 if (v == "action" || v == "event") {
                     v = LiteGraph.ACTION;
                 }
+		        if (!LiteGraph.isValidConnection(that.inputs[0].type,v))
+					that.disconnectInput(0);
                 that.inputs[0].type = v;
                 if (that.name_in_graph) {
                     //already added
@@ -23135,7 +23161,7 @@ void main(void){\n\
 		"mod": "T mod(T x,T y)", //"T mod(T x,float y)"
 		"min": "T min(T x,T y)",
 		"max": "T max(T x,T y)",
-		"clamp": "T clamp(T x,T minVal,T maxVal)",
+		"clamp": "T clamp(T x,T minVal = 0.0,T maxVal = 1.0)",
 		"mix": "T mix(T x,T y,T a)", //"T mix(T x,T y,float a)"
 		"step": "T step(T edge, T x)", //"T step(float edge, T x)"
 		"smoothstep": "T smoothstep(T edge, T x)", //"T smoothstep(float edge, T x)"
@@ -23165,8 +23191,13 @@ void main(void){\n\
 			var params = op.substr(index2 + 1, op.length - index2 - 2).split(",");
 			for(var j in params)
 			{
-				var p = params[j].split(" ");
-				params[j] = { type: p[0], name: p[1] };
+				var p = params[j].split(" ").filter(function(a){ return a; });
+				params[j] = { type: p[0].trim(), name: p[1].trim() };
+				if(params[j].name.indexOf("=") != -1)
+				{
+					params[j].name.split("=");
+				}
+
 			}
 			GLSL_functions[i] = { return_type: return_type, func: func_name, params: params };
 			GLSL_functions_name.push( func_name );
@@ -23642,7 +23673,10 @@ gl_FragColor = color;\n\
 		var over = LiteGraph.isInsideRectangle(pos[0],pos[1],this.pos[0],this.pos[1] + y,this.size[0],LiteGraph.NODE_TITLE_HEIGHT);
 		ctx.fillStyle = over ? "#555" : "#222";
 		ctx.beginPath();
-		ctx.roundRect( 0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT, 0, 8);
+		if (this._shape == LiteGraph.BOX_SHAPE)
+			ctx.rect(0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT);
+		else
+			ctx.roundRect( 0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT, 0, 8);
 		ctx.fill();
 
 		//button
@@ -23674,7 +23708,12 @@ gl_FragColor = color;\n\
 
 	LiteGraph.registerNodeType( "texture/shaderGraph", LGraphShaderGraph );
 
-	//Shader Nodes ***************************
+	function shaderNodeFromFunction( classname, params, return_type, code )
+	{
+		//TODO
+	}
+
+	//Shader Nodes ***********************************************************
 
 	//applies a shader graph to a code
 	function LGraphShaderUniform() {
@@ -24334,37 +24373,7 @@ gl_FragColor = color;\n\
 })(this);
 
 
-/*
-// https://blog.undefinist.com/writing-a-shader-graph/
-
-\sin
-f,Out
-float->float
-{1} = sin({0});
-
-\mul
-A,B,Out
-T,T->T
-T,float->T
-{2} = {0} * {1};
-
-\clamp
-f,min,max,Out
-float,float=0,float=1->float
-vec2,vec2=vec2(0.0),vec2=vec2(1.0)->vec2
-vec3,vec3=vec3(0.0),vec3=vec3(1.0)->vec3
-vec4,vec4=vec4(0.0),vec4=vec4(1.0)->vec4
-{3}=clamp({0},{1},{2});
-
-\mix
-A,B,f,Out
-float,float,float->float
-vec2,vec2,float->vec2
-vec3,vec3,float->vec3
-vec4,vec4,float->vec4
-{3} = mix({0},{1},{2});
-
-*/
+
 (function(global) {
     var LiteGraph = global.LiteGraph;
 

src/litegraph.js

@@ -264,6 +264,16 @@
             this.registerNodeType(name, classobj);
         },
 
+        /**
+         * Removes all previously registered node's types
+         */
+        clearRegisteredTypes: function() {
+            this.registered_node_types = {};
+            this.node_types_by_file_extension = {};
+            this.Nodes = {};
+            this.searchbox_extras = {};
+        },
+
         /**
          * Adds this method to all nodetypes, existing and to be created
          * (You can add it to LGraphNode.prototype but then existing node types wont have it)
@@ -1579,10 +1589,10 @@
             return;
         }
 
-		node.graph.beforeChange();
+		this.beforeChange();
         this.inputs[name] = { name: name, type: type, value: value };
         this._version++;
-		node.graph.afterChange();
+		this.afterChange();
 
         if (this.onInputAdded) {
             this.onInputAdded(name, type);

src/nodes/base.js

@@ -142,7 +142,10 @@
 		var over = LiteGraph.isInsideRectangle(pos[0],pos[1],this.pos[0],this.pos[1] + y,this.size[0],LiteGraph.NODE_TITLE_HEIGHT);
 		ctx.fillStyle = over ? "#555" : "#222";
 		ctx.beginPath();
-		ctx.roundRect( 0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT, 0, 8);
+		if (this._shape == LiteGraph.BOX_SHAPE)
+			ctx.rect(0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT);
+		else
+			ctx.roundRect( 0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT, 0, 8);
 		ctx.fill();
 
 		//button
@@ -424,15 +427,21 @@
 		this.updateType();
 	}
 
+	//ensures the type in the node output and the type in the associated graph input are the same
 	GraphInput.prototype.updateType = function()
 	{
 		var type = this.properties.type;
 		this.type_widget.value = type;
+
+		//update output
 		if(this.outputs[0].type != type)
 		{
+	        if (!LiteGraph.isValidConnection(this.outputs[0].type,type))
+				this.disconnectOutput(0);
 			this.outputs[0].type = type;
-			this.disconnectOutput(0);
 		}
+
+		//update widget
 		if(type == "number")
 		{
 			this.value_widget.type = "number";
@@ -454,8 +463,14 @@
 			this.value_widget.value = null;
 		}
 		this.properties.value = this.value_widget.value;
+
+		//update graph
+		if (this.graph && this.name_in_graph) {
+			this.graph.changeInputType(this.name_in_graph, type);
+		}
 	}
 
+	//this is executed AFTER the property has changed
 	GraphInput.prototype.onPropertyChanged = function(name,v)
 	{
 		if( name == "name" )
@@ -477,8 +492,7 @@
 		}
 		else if( name == "type" )
 		{
-			v = v || "";
-			this.updateType(v);
+			this.updateType();
 		}
 		else if( name == "value" )
 		{
@@ -555,6 +569,8 @@
                 if (v == "action" || v == "event") {
                     v = LiteGraph.ACTION;
                 }
+		        if (!LiteGraph.isValidConnection(that.inputs[0].type,v))
+					that.disconnectInput(0);
                 that.inputs[0].type = v;
                 if (that.name_in_graph) {
                     //already added

src/nodes/shaders.js

@@ -38,7 +38,7 @@
 		"mod": "T mod(T x,T y)", //"T mod(T x,float y)"
 		"min": "T min(T x,T y)",
 		"max": "T max(T x,T y)",
-		"clamp": "T clamp(T x,T minVal,T maxVal)",
+		"clamp": "T clamp(T x,T minVal = 0.0,T maxVal = 1.0)",
 		"mix": "T mix(T x,T y,T a)", //"T mix(T x,T y,float a)"
 		"step": "T step(T edge, T x)", //"T step(float edge, T x)"
 		"smoothstep": "T smoothstep(T edge, T x)", //"T smoothstep(float edge, T x)"
@@ -68,8 +68,13 @@
 			var params = op.substr(index2 + 1, op.length - index2 - 2).split(",");
 			for(var j in params)
 			{
-				var p = params[j].split(" ");
-				params[j] = { type: p[0], name: p[1] };
+				var p = params[j].split(" ").filter(function(a){ return a; });
+				params[j] = { type: p[0].trim(), name: p[1].trim() };
+				if(params[j].name.indexOf("=") != -1)
+				{
+					params[j].name.split("=");
+				}
+
 			}
 			GLSL_functions[i] = { return_type: return_type, func: func_name, params: params };
 			GLSL_functions_name.push( func_name );
@@ -545,7 +550,10 @@ gl_FragColor = color;\n\
 		var over = LiteGraph.isInsideRectangle(pos[0],pos[1],this.pos[0],this.pos[1] + y,this.size[0],LiteGraph.NODE_TITLE_HEIGHT);
 		ctx.fillStyle = over ? "#555" : "#222";
 		ctx.beginPath();
-		ctx.roundRect( 0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT, 0, 8);
+		if (this._shape == LiteGraph.BOX_SHAPE)
+			ctx.rect(0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT);
+		else
+			ctx.roundRect( 0, y, this.size[0]+1, LiteGraph.NODE_TITLE_HEIGHT, 0, 8);
 		ctx.fill();
 
 		//button
@@ -577,7 +585,12 @@ gl_FragColor = color;\n\
 
 	LiteGraph.registerNodeType( "texture/shaderGraph", LGraphShaderGraph );
 
-	//Shader Nodes ***************************
+	function shaderNodeFromFunction( classname, params, return_type, code )
+	{
+		//TODO
+	}
+
+	//Shader Nodes ***********************************************************
 
 	//applies a shader graph to a code
 	function LGraphShaderUniform() {
@@ -1237,34 +1250,3 @@ gl_FragColor = color;\n\
 })(this);
 
 
-/*
-// https://blog.undefinist.com/writing-a-shader-graph/
-
-\sin
-f,Out
-float->float
-{1} = sin({0});
-
-\mul
-A,B,Out
-T,T->T
-T,float->T
-{2} = {0} * {1};
-
-\clamp
-f,min,max,Out
-float,float=0,float=1->float
-vec2,vec2=vec2(0.0),vec2=vec2(1.0)->vec2
-vec3,vec3=vec3(0.0),vec3=vec3(1.0)->vec3
-vec4,vec4=vec4(0.0),vec4=vec4(1.0)->vec4
-{3}=clamp({0},{1},{2});
-
-\mix
-A,B,f,Out
-float,float,float->float
-vec2,vec2,float->vec2
-vec3,vec3,float->vec3
-vec4,vec4,float->vec4
-{3} = mix({0},{1},{2});
-
-*/