Make subgraphs searchable like a library

Possible subgraphs now appear in the add node menus.
Subgraphs are searched in folders defined by the
`shadergraph.libfolders` prop

bin/defaultProps.json

@@ -145,6 +145,8 @@
 
 	"fx.tags": [ { "id": "tag", "color": "#802000" } ],
 
+	"shadergraph.libfolders": ["Shaders"],
+
 	// DomKit css files list
 	"domkit.css" : [],
 

hide/view/shadereditor/ShaderEditor.hx

@@ -291,27 +291,6 @@ class ShaderEditor extends hide.view.Graph {
 		editorMatrix.on("change", "input, select", function(ev) {
 			try {
 				var idBox = ev.target.closest(".box").id;
-				for (b in listOfBoxes) {
-					if (b.getId() == idBox) {
-						var subGraph = Std.downcast(b.getInstance(), hrt.shgraph.nodes.SubGraph);
-						if (subGraph != null) {
-							if (ev.currentTarget.getAttribute('field') != "filesubgraph") {
-								break;
-							}
-							var length = listOfEdges.length;
-							for (i in 0...length) {
-								var edge = listOfEdges[length-i-1];
-								if (edge.from == b || edge.to == b) {
-									removeShaderGraphEdge(edge);
-								}
-							}
-							refreshBox(b);
-							afterChange();
-							return;
-						}
-						break;
-					}
-				}
 				shaderGraph.nodeUpdated(idBox);
 				afterChange();
 				launchCompileShader();
@@ -338,6 +317,30 @@ class ShaderEditor extends hide.view.Graph {
 			listOfClasses[group].push({ name : (metas.name != null) ? metas.name[0] : key , description : (metas.description != null) ? metas.description[0] : "" , key : key });
 		}
 
+		var libPaths : Array<String> = config.get("shadergraph.libfolders", ["shaders"]);
+		for( lpath in libPaths ) {
+			var basePath = ide.getPath(lpath);
+			if( !sys.FileSystem.isDirectory(basePath) )
+				continue;
+			for( c in sys.FileSystem.readDirectory(basePath) ) {
+				var relPath = ide.makeRelative(basePath + "/" + c);
+				if( this.state.path != relPath && haxe.io.Path.extension(relPath).toLowerCase() == "hlshader" ) {
+					var group = 'SubGraph from $lpath';
+					if (listOfClasses[group] == null)
+						listOfClasses[group] = new Array<NodeInfo>();
+
+					var fileName = new haxe.io.Path(relPath).file;
+
+					listOfClasses[group].push({
+						name : fileName,
+						// TODO: Add a the description to the hlshader file
+						description : 'Include $fileName as a subgraph',
+						key : relPath,
+					});
+				}
+			}
+		}
+
 		for (key in listOfClasses.keys()) {
 			listOfClasses[key].sort(function (a, b): Int {
 				if (a.name < b.name) return -1;
@@ -965,6 +968,13 @@ class ShaderEditor extends hide.view.Graph {
 		return node;
 	}
 
+	function addSubGraph(p : Point, path : String) {
+		var node : SubGraph = cast addNode(p, SubGraph);
+		@:privateAccess node.pathShaderGraph = path;
+		node.loadGraphShader();
+		return node;
+	}
+
 	function createEdgeInShaderGraph() : Bool {
 		var startLinkNode = startLinkGrNode.find(".node");
 		if (isCreatingLink == FromInput) {
@@ -1143,8 +1153,15 @@ class ShaderEditor extends hide.view.Graph {
 			if (ev.keyCode == 13) {
 				var key = this.selectedNode.attr("node");
 				var posCursor = new Point(lX(ide.mouseX - 25), lY(ide.mouseY - 10));
-				addNode(posCursor, ShaderNode.registeredNodes[key]);
-				closeAddMenu();
+
+				if( key.toLowerCase().indexOf(".hlshader") != -1 ) {
+					addSubGraph(posCursor, key);
+					closeAddMenu();
+					refreshShaderGraph();
+				} else {
+					addNode(posCursor, ShaderNode.registeredNodes[key]);
+					closeAddMenu();
+				}
 			} else {
 				if (this.selectedNode != null)
 					this.selectedNode.removeClass("selected");
@@ -1238,7 +1255,12 @@ class ShaderEditor extends hide.view.Graph {
 						</div>');
 					itemNode.on("click", function() {
 						var posCursor = new Point(lX(ide.mouseX - 25), lY(ide.mouseY - 10));
-						addNode(posCursor, ShaderNode.registeredNodes[node.key]);
+						if( node.key.toLowerCase().indexOf(".hlshader") != -1 ) {
+							addSubGraph(posCursor, node.key);
+							refreshShaderGraph();
+						} else {
+							addNode(posCursor, ShaderNode.registeredNodes[node.key]);
+						}
 					});
 					eltsGroup.push(itemNode);
 				}
@@ -1519,9 +1541,7 @@ class ShaderEditor extends hide.view.Graph {
 			if (i.indexOf("hlshader") != -1 && i != state.path) {
 				if (isDrop) {
 					var posCursor = new Point(lX(ide.mouseX - 25 + offset), lY(ide.mouseY - 10 + offset));
-					var node : SubGraph = cast addNode(posCursor, SubGraph);
-					@:privateAccess node.pathShaderGraph = i;
-					node.loadGraphShader();
+					addSubGraph(posCursor, i);
 					offset += 25;
 				}
 				valid = true;

hrt/shgraph/nodes/SubGraph.hx

@@ -4,7 +4,6 @@ using hxsl.Ast;
 
 @name("SubGraph")
 @description("Include a subgraph")
-@group("Other")
 @width(250)
 @alwaysshowinputs()
 class SubGraph extends ShaderNode {
@@ -255,23 +254,6 @@ class SubGraph extends ShaderNode {
 	#if editor
 	override public function getPropertiesHTML(width : Float) : Array<hide.Element> {
 		var elements = super.getPropertiesHTML(width);
-		var element = new hide.Element('<div style="width: ${width * 0.8}px; height: 25px"></div>');
-		var fileInput = new hide.Element('<input type="text" field="filesubgraph" />').appendTo(element);
-
-		fileInput.on("mousedown", function(e) {
-			e.stopPropagation();
-		});
-
-		var tfile = new hide.comp.FileSelect(["hlshader"], null, fileInput);
-		if (this.pathShaderGraph != null && this.pathShaderGraph.length > 0) tfile.path = this.pathShaderGraph;
-		tfile.onChange = function() {
-			this.pathShaderGraph = tfile.path;
-			loadGraphShader();
-			fileInput.trigger("change");
-		}
-		elements.push(element);
-		elements.push(new hide.Element('<div style="background: #202020; height: 1px; margin-bottom: 5px;"></div>'));
-
 		for (p in parameters) {
 			var element = new hide.Element('<div class="propertySubShader" style="width: 200px;"></div>');
 			element.on("mousedown", function(e) {