added searchbox

build/litegraph.js

@@ -385,14 +385,18 @@ else
 *
 * @class LGraph
 * @constructor
+* @param {Object} o data from previous serialization [optional]
 */
 
-function LGraph()
+function LGraph( o )
 {
 	if (LiteGraph.debug)
 		console.log("Graph created");
 	this.list_of_graphcanvas = null;
 	this.clear();
+
+	if(o)
+		this.configure(o);
 }
 
 global.LGraph = LiteGraph.LGraph = LGraph;
@@ -415,7 +419,11 @@ LGraph.prototype.clear = function()
 {
 	this.stop();
 	this.status = LGraph.STATUS_STOPPED;
+
 	this.last_node_id = 0;
+	this.last_link_id = 0;
+
+	this._version = -1; //used to detect changes
 
 	//nodes
 	this._nodes = [];
@@ -424,14 +432,13 @@ LGraph.prototype.clear = function()
 	this._nodes_executable = null; //nodes that contain onExecute
 
 	//links
-	this.last_link_id = 0;
 	this.links = {}; //container with all the links
 
 	//iterations
 	this.iteration = 0;
 
-	this.config = {
-	};
+	//custom data
+	this.config = {};
 
 	//timing
 	this.globaltime = 0;
@@ -448,9 +455,7 @@ LGraph.prototype.clear = function()
 	this.global_inputs = {};
 	this.global_outputs = {};
 
-	//this.graph = {};
-	this.debug = true;
-
+	//notify canvas to redraw
 	this.change();
 
 	this.sendActionToCanvas("clear");
@@ -480,7 +485,6 @@ LGraph.prototype.attachCanvas = function(graphcanvas)
 * @method detachCanvas
 * @param {GraphCanvas} graph_canvas
 */
-
 LGraph.prototype.detachCanvas = function(graphcanvas)
 {
 	if(!this.list_of_graphcanvas)
@@ -903,17 +907,13 @@ LGraph.prototype.add = function(node, skip_compute_order)
 	else if (this.last_node_id < node.id)
 		this.last_node_id = node.id;
 
+
 	node.graph = this;
+	this._version++;
 
 	this._nodes.push(node);
 	this._nodes_by_id[node.id] = node;
 
-	/*
-	// rendering stuf...
-	if(node.bgImageUrl)
-		node.bgImage = node.loadImage(node.bgImageUrl);
-	*/
-
 	if(node.onAdded)
 		node.onAdded( this );
 
@@ -973,6 +973,7 @@ LGraph.prototype.remove = function(node)
 		node.onRemoved();
 
 	node.graph = null;
+	this._version++;
 
 	//remove from canvas render
 	if(this.list_of_graphcanvas)
@@ -1097,6 +1098,7 @@ LGraph.prototype.getNodeOnPos = function(x,y, nodes_list)
 LGraph.prototype.addGlobalInput = function(name, type, value)
 {
 	this.global_inputs[name] = { name: name, type: type, value: value };
+	this._version++;
 
 	if(this.onGlobalInputAdded)
 		this.onGlobalInputAdded(name, type);
@@ -1164,6 +1166,7 @@ LGraph.prototype.renameGlobalInput = function(old_name, name)
 
 	this.global_inputs[name] = this.global_inputs[old_name];
 	delete this.global_inputs[old_name];
+	this._version++;
 
 	if(this.onGlobalInputRenamed)
 		this.onGlobalInputRenamed(old_name, name);
@@ -1183,10 +1186,11 @@ LGraph.prototype.changeGlobalInputType = function(name, type)
 	if(!this.global_inputs[name])
 		return false;
 
-	if(this.global_inputs[name].type.toLowerCase() == type.toLowerCase() )
+	if(this.global_inputs[name].type == type || this.global_inputs[name].type.toLowerCase() == type.toLowerCase() )
 		return;
 
 	this.global_inputs[name].type = type;
+	this._version++;
 	if(this.onGlobalInputTypeChanged)
 		this.onGlobalInputTypeChanged(name, type);
 }
@@ -1203,6 +1207,7 @@ LGraph.prototype.removeGlobalInput = function(name)
 		return false;
 
 	delete this.global_inputs[name];
+	this._version++;
 
 	if(this.onGlobalInputRemoved)
 		this.onGlobalInputRemoved(name);
@@ -1222,6 +1227,7 @@ LGraph.prototype.removeGlobalInput = function(name)
 LGraph.prototype.addGlobalOutput = function(name, type, value)
 {
 	this.global_outputs[name] = { name: name, type: type, value: value };
+	this._version++;
 
 	if(this.onGlobalOutputAdded)
 		this.onGlobalOutputAdded(name, type);
@@ -1286,6 +1292,7 @@ LGraph.prototype.renameGlobalOutput = function(old_name, name)
 
 	this.global_outputs[name] = this.global_outputs[old_name];
 	delete this.global_outputs[old_name];
+	this._version++;
 
 	if(this.onGlobalOutputRenamed)
 		this.onGlobalOutputRenamed(old_name, name);
@@ -1309,6 +1316,7 @@ LGraph.prototype.changeGlobalOutputType = function(name, type)
 		return;
 
 	this.global_outputs[name].type = type;
+	this._version++;
 	if(this.onGlobalOutputTypeChanged)
 		this.onGlobalOutputTypeChanged(name, type);
 }
@@ -1323,6 +1331,7 @@ LGraph.prototype.removeGlobalOutput = function(name)
 	if(!this.global_outputs[name])
 		return false;
 	delete this.global_outputs[name];
+	this._version++;
 
 	if(this.onGlobalOutputRemoved)
 		this.onGlobalOutputRemoved(name);
@@ -1352,6 +1361,7 @@ LGraph.prototype.connectionChange = function( node )
 	this.updateExecutionOrder();
 	if( this.onConnectionChange )
 		this.onConnectionChange( node );
+	this._version++;
 	this.sendActionToCanvas("onConnectionChange");
 }
 
@@ -1374,14 +1384,12 @@ LGraph.prototype.isLive = function()
 	return false;
 }
 
-/* Called when something visually changed */
+/* Called when something visually changed (not the graph!) */
 LGraph.prototype.change = function()
 {
 	if(LiteGraph.debug)
 		console.log("Graph changed");
-
 	this.sendActionToCanvas("setDirty",[true,true]);
-
 	if(this.on_change)
 		this.on_change(this);
 }
@@ -1412,13 +1420,11 @@ LGraph.prototype.serialize = function()
 	}
 
 	var data = {
-		iteration: this.iteration,
-		frame: this.frame,
 		last_node_id: this.last_node_id,
 		last_link_id: this.last_link_id,
-		links: links, //LiteGraph.cloneObject( this.links ),
+		nodes: nodes_info,
+		links: links, 
 		config: this.config,
-		nodes: nodes_info
 	};
 
 	return data;
@@ -1429,9 +1435,13 @@ LGraph.prototype.serialize = function()
 * Configure a graph from a JSON string
 * @method configure
 * @param {String} str configure a graph from a JSON string
+* @param {Boolean} returns if there was any error parsing
 */
-LGraph.prototype.configure = function(data, keep_old)
+LGraph.prototype.configure = function( data, keep_old )
 {
+	if(!data)
+		return;
+
 	if(!keep_old)
 		this.clear();
 
@@ -1440,7 +1450,7 @@ LGraph.prototype.configure = function(data, keep_old)
 	//decode links info (they are very verbose)
 	if(data.links && data.links.constructor === Array)
 	{
-		var links = {};
+		var links = [];
 		for(var i = 0; i < data.links.length; ++i)
 		{
 			var link = data.links[i];
@@ -1457,32 +1467,36 @@ LGraph.prototype.configure = function(data, keep_old)
 
 	//create nodes
 	this._nodes = [];
-	for(var i = 0, l = nodes.length; i < l; ++i)
+	if(nodes)
 	{
-		var n_info = nodes[i]; //stored info
-		var node = LiteGraph.createNode( n_info.type, n_info.title );
-		if(!node)
+		for(var i = 0, l = nodes.length; i < l; ++i)
 		{
-			if(LiteGraph.debug)
-				console.log("Node not found: " + n_info.type);
-			error = true;
-			continue;
+			var n_info = nodes[i]; //stored info
+			var node = LiteGraph.createNode( n_info.type, n_info.title );
+			if(!node)
+			{
+				if(LiteGraph.debug)
+					console.log("Node not found: " + n_info.type);
+				error = true;
+				continue;
+			}
+
+			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.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
-	}
-
-	//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 );
+		//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();
+	this._version++;
 	this.setDirtyCanvas(true,true);
 	return error;
 }
@@ -1618,6 +1632,9 @@ LGraphNode.prototype._ctor = function( title )
 */
 LGraphNode.prototype.configure = function(info)
 {
+	if(this.graph)
+		this.graph._version++;
+
 	for (var j in info)
 	{
 		if(j == "console")
@@ -1658,7 +1675,7 @@ LGraphNode.prototype.configure = function(info)
 		for(var i = 0; i < this.inputs.length; ++i)
 		{
 			var input = this.inputs[i];
-			var link_info = this.graph.links[ input.link ];
+			var link_info = this.graph ? this.graph.links[ input.link ] : null;
 			this.onConnectionsChange( LiteGraph.INPUT, i, true, link_info, input ); //link_info has been created now, so its updated
 		}
 
@@ -1670,7 +1687,7 @@ LGraphNode.prototype.configure = function(info)
 				continue;
 			for(var j = 0; j < output.links.length; ++j)
 			{
-				var link_info = this.graph.links[ output.links[j] ];
+				var link_info = this.graph ? this.graph.links[ output.links[j] ] : null;
 				this.onConnectionsChange( LiteGraph.OUTPUT, i, true, link_info, output ); //link_info has been created now, so its updated
 			}
 		}
@@ -1686,6 +1703,7 @@ LGraphNode.prototype.configure = function(info)
 		if(typeof(link) != "object")
 			continue;
 		input.link = link[0];
+		if(this.graph)
 		this.graph.links[ link[0] ] = {
 			id: link[0],
 			origin_id: link[1],
@@ -2360,6 +2378,9 @@ LGraphNode.prototype.computeSize = function( minHeight, out )
 	size[0] = Math.max( input_width + output_width + 10, title_width );
 	size[0] = Math.max( size[0], LiteGraph.NODE_WIDTH );
 
+	if(this.onResize)
+		this.onResize(size);
+
 	function compute_text_size( text )
 	{
 		if(!text)
@@ -2577,7 +2598,8 @@ LGraphNode.prototype.connect = function( slot, target_node, target_slot )
 		output.links.push( link_info.id );
 		//connect in input
 		target_node.inputs[target_slot].link = link_info.id;
-
+		if(this.graph)
+			this.graph._version++;
 		if(this.onConnectionsChange)
 			this.onConnectionsChange( LiteGraph.OUTPUT, slot, true, link_info, output ); //link_info has been created now, so its updated
 		if(target_node.onConnectionsChange)
@@ -2641,6 +2663,8 @@ LGraphNode.prototype.disconnectOutput = function( slot, target_node )
 				var input = target_node.inputs[ link_info.target_slot ];
 				input.link = null; //remove there
 				delete this.graph.links[ link_id ]; //remove the link from the links pool
+				if(this.graph)
+					this.graph._version++;
 				if(target_node.onConnectionsChange)
 					target_node.onConnectionsChange( LiteGraph.INPUT, link_info.target_slot, false, link_info, input ); //link_info hasnt been modified so its ok
 				if(this.onConnectionsChange)
@@ -2660,6 +2684,8 @@ LGraphNode.prototype.disconnectOutput = function( slot, target_node )
 
 			var target_node = this.graph.getNodeById( link_info.target_id );
 			var input = null;
+			if(this.graph)
+				this.graph._version++;
 			if(target_node)
 			{
 				input = target_node.inputs[ link_info.target_slot ];
@@ -2736,7 +2762,8 @@ LGraphNode.prototype.disconnectInput = function( slot )
 		}
 
 		delete this.graph.links[ link_id ]; //remove from the pool
-
+		if(this.graph)
+			this.graph._version++;
 		if( this.onConnectionsChange )
 			this.onConnectionsChange( LiteGraph.INPUT, slot, false, link_info, input );
 		if( target_node.onConnectionsChange )
@@ -2763,7 +2790,6 @@ LGraphNode.prototype.getConnectionPos = function(is_input, slot_number)
 			return [this.pos[0], this.pos[1] - LiteGraph.NODE_TITLE_HEIGHT * 0.5];
 		else
 			return [this.pos[0] + LiteGraph.NODE_COLLAPSED_WIDTH, this.pos[1] - LiteGraph.NODE_TITLE_HEIGHT * 0.5];
-		//return [this.pos[0] + this.size[0] * 0.5, this.pos[1] + this.size[1] * 0.5];
 	}
 
 	if(is_input && slot_number == -1)
@@ -2888,6 +2914,7 @@ LGraphNode.prototype.captureInput = function(v)
 **/
 LGraphNode.prototype.collapse = function()
 {
+	this.graph._version++;
 	if(!this.flags.collapsed)
 		this.flags.collapsed = true;
 	else
@@ -2902,6 +2929,7 @@ LGraphNode.prototype.collapse = function()
 
 LGraphNode.prototype.pin = function(v)
 {
+	this.graph._version++;
 	if(v === undefined)
 		this.flags.pinned = !this.flags.pinned;
 	else
@@ -2968,6 +2996,7 @@ function LGraphCanvas( canvas, graph, options )
 	this.allow_dragcanvas = true;
 	this.allow_dragnodes = true;
 	this.allow_interaction = true; //allow to control widgets, buttons, collapse, etc
+	this.allow_searchbox = true;
 	this.drag_mode = false;
 	this.dragging_rectangle = null;
 
@@ -2978,8 +3007,20 @@ function LGraphCanvas( canvas, graph, options )
 	this.render_curved_connections = true;
 	this.render_connection_arrows = true;
 
+	//to personalize the search box
+	this.onSearchBox = null;
+	this.onSearchBoxSelection = null;
+
 	this.connections_width = 3;
 
+	this.gui_mouse = {
+		node: null,
+		blocked: false,
+		position: [0,0],
+		click: false
+	};
+	this.current_node = null;
+
 	//link canvas and graph
 	if(graph)
 		graph.attachCanvas(this);
@@ -3432,6 +3473,7 @@ LGraphCanvas.prototype.processMouseDown = function(e)
 	var ref_window = this.getCanvasWindow();
 	var document = ref_window.document;
 	LGraphCanvas.active_canvas = this;
+	var that = this;
 
 	//move mouse move event to the window in case it drags outside of the canvas
 	this.canvas.removeEventListener("mousemove", this._mousemove_callback );
@@ -3441,6 +3483,7 @@ LGraphCanvas.prototype.processMouseDown = function(e)
 	var n = this.graph.getNodeOnPos( e.canvasX, e.canvasY, this.visible_nodes );
 	var skip_dragging = false;
 	var skip_action = false;
+	var now = LiteGraph.getTime();
 
     LiteGraph.closeAllContextMenus( ref_window );
 
@@ -3524,8 +3567,16 @@ LGraphCanvas.prototype.processMouseDown = function(e)
 			{
 				var block_drag_node = false;
 
+				//widgets
+				this.gui_mouse.node = n;
+				this.gui_mouse.position[0] = e.canvasX - n.pos[0];
+				this.gui_mouse.position[1] = e.canvasY - n.pos[1];
+				this.gui_mouse.clicked = true;
+
+				if( this.gui_mouse.blocked )
+					block_drag_node = true;
+
 				//double clicking
-				var now = LiteGraph.getTime();
 				if ((now - this.last_mouseclick) < 300 && this.selected_nodes[n.id])
 				{
 					//double click node
@@ -3557,8 +3608,12 @@ LGraphCanvas.prototype.processMouseDown = function(e)
 				this.dirty_canvas = true;
 			}
 		}
-		else
+		else //clicked outside of nodes
+		{
 			clicking_canvas_bg = true;
+			if ( (now - this.last_mouseclick) < 300 && this.allow_searchbox )
+				setTimeout( function(){ that.showSearchBox(e); },10 );
+		}
 
 		if(!skip_action && clicking_canvas_bg && this.allow_dragcanvas)
 		{
@@ -4464,6 +4519,7 @@ LGraphCanvas.prototype.drawFrontCanvas = function()
 		ctx.start2D();
 
 	var canvas = this.canvas;
+	this.gui_mouse.blocked = false;
 
 	//reset in case of error
 	ctx.restore();
@@ -4579,6 +4635,8 @@ LGraphCanvas.prototype.drawFrontCanvas = function()
 		ctx.finish2D();
 
 	this.dirty_canvas = false;
+	this.gui_mouse.node = null;
+	this.gui_mouse.clicked = false;
 }
 
 LGraphCanvas.prototype.renderInfo = function( ctx, x, y )
@@ -4595,7 +4653,7 @@ LGraphCanvas.prototype.renderInfo = function( ctx, x, y )
 	{
 		ctx.fillText( "T: " + this.graph.globaltime.toFixed(2)+"s",5,13*1 );
 		ctx.fillText( "I: " + this.graph.iteration,5,13*2 );
-		ctx.fillText( "F: " + this.frame,5,13*3 );
+		ctx.fillText( "V: " + this.graph._version,5,13*3 );
 		ctx.fillText( "FPS:" + this.fps.toFixed(2),5,13*4 );
 	}
 	else
@@ -4727,6 +4785,7 @@ var temp_vec2 = new Float32Array(2);
 LGraphCanvas.prototype.drawNode = function(node, ctx )
 {
 	var glow = false;
+	this.current_node = node;
 
 	var color = node.color || LiteGraph.NODE_DEFAULT_COLOR;
 	//if (this.selected) color = "#88F";
@@ -4765,10 +4824,8 @@ LGraphCanvas.prototype.drawNode = function(node, ctx )
 		if(!node.flags.collapsed)
 		{
 			ctx.shadowColor = "transparent";
-			//if(node.onDrawBackground)
-			//	node.onDrawBackground(ctx);
 			if(node.onDrawForeground)
-				node.onDrawForeground(ctx);
+				node.onDrawForeground(ctx, this);
 		}
 
 		return;
@@ -4921,7 +4978,7 @@ LGraphCanvas.prototype.drawNode = function(node, ctx )
 		ctx.globalAlpha = 1;
 
 		if(node.onDrawForeground)
-			node.onDrawForeground(ctx);
+			node.onDrawForeground( ctx, this );
 	}//!collapsed
 
 	if(node.flags.clip_area)
@@ -4986,8 +5043,8 @@ LGraphCanvas.prototype.drawNodeShape = function(node, ctx, size, fgcolor, bgcolo
 	if(node.bgImageUrl && !node.bgImage)
 		node.bgImage = node.loadImage(node.bgImageUrl);
 
-	if(node.onDrawBackground)
-		node.onDrawBackground(ctx);
+	if( node.onDrawBackground )
+		node.onDrawBackground( ctx, this );
 
 	//title bg (remember, it is rendered ABOVE the node
 	if(!no_title)
@@ -5261,6 +5318,30 @@ LGraphCanvas.prototype.computeConnectionPoint = function(a,b,t)
 	return [x,y];
 }
 
+LGraphCanvas.prototype.guiButton = function( ctx, rect, text, callback )
+{
+	var mouse = this.gui_mouse;
+
+	var mouse_over = mouse.position[0] >= rect[0] && mouse.position[1] >= rect[1] && mouse.position[0] < rect[0] + rect[2] && mouse.position[1] < rect[1] + rect[3];
+	//if(mouse_over) this.setDirty(true,false);
+	var clicked = mouse.node == this.current_node && mouse.clicked && mouse_over;
+
+	ctx.fillStyle = clicked ? "#AAA" : ( mouse_over ? "#555" : "#333" );
+	ctx.fillRect( rect[0], rect[1], rect[2], rect[3] );
+	ctx.strokeStyle = "#AAA";
+	ctx.strokeRect( rect[0] + 0.5, rect[1] + 0.5, rect[2], rect[3] );
+	ctx.textAlign = "center";
+	ctx.fillStyle = clicked ? "#000" : "#AAA";
+	ctx.fillText( text, rect[0] + rect[2] * 0.5, rect[1] + rect[3] * 0.75 );
+
+	if(clicked)
+	{
+		mouse.blocked = true;
+		if(callback)
+			setTimeout( function(){ callback(this.current_node,text,mouse); }),1;
+	}
+}
+
 /*
 LGraphCanvas.prototype.resizeCanvas = function(width,height)
 {
@@ -5662,6 +5743,154 @@ LGraphCanvas.onShowTitleEditor = function( value, options, e, menu, node )
 	}
 }
 
+LGraphCanvas.prototype.showSearchBox = function(event)
+{
+	var that = this;
+	var input_html = "";
+
+	var dialog = document.createElement("div");
+	dialog.className = "graphdialog";
+	dialog.innerHTML = "<span class='name'>Search</span> <input autofocus type='text' class='value'/><div class='helper'></div>";
+	dialog.close = function()
+	{
+		that.search_box = null;
+		dialog.parentNode.removeChild( dialog );
+	}
+
+	dialog.addEventListener("mouseleave",function(e){
+		 dialog.close();
+	});
+
+	if(that.search_box)
+		that.search_box.close();
+	that.search_box = dialog;
+
+	var helper = dialog.querySelector(".helper");
+
+	var first = null;
+	var timeout = null;
+	var selected = null;
+
+	var input = dialog.querySelector("input");
+	if(input)
+	{
+		input.addEventListener("keydown", function(e){
+
+			if(e.keyCode == 38) //UP
+				changeSelection(false);
+			else if(e.keyCode == 40) //DOWN
+				changeSelection(true);
+			else if(e.keyCode == 27) //ESC
+				dialog.close();
+			else if(e.keyCode == 13)
+			{
+				if(selected)
+					select( selected.innerHTML )
+				else if(first)
+					select(first);
+				else
+					dialog.close();
+			}
+			else
+			{
+				if(timeout)
+					clearInterval(timeout);
+				timeout = setTimeout( refreshHelper, 10 );
+				return;
+			}
+			e.preventDefault();
+			e.stopPropagation();
+		});
+	}
+
+	var graphcanvas = LGraphCanvas.active_canvas;
+	var canvas = graphcanvas.canvas;
+
+	var rect = canvas.getBoundingClientRect();
+	var offsetx = -20;
+	var offsety = -20;
+	if(rect)
+	{
+		offsetx -= rect.left;
+		offsety -= rect.top;
+	}
+
+	if( event )
+	{
+		dialog.style.left = (event.pageX + offsetx) + "px";
+		dialog.style.top = (event.pageY + offsety)+ "px";
+	}
+	else
+	{
+		dialog.style.left = (canvas.width * 0.5 + offsetx) + "px";
+		dialog.style.top = (canvas.height * 0.5 + offsety) + "px";
+	}
+
+	canvas.parentNode.appendChild( dialog );
+	input.focus();
+
+	function select( name )
+	{
+		if(name)
+		{
+			if( that.onSearchBoxSelection )
+				that.onSearchBoxSelection( name, event, graphcanvas );
+			else
+			{
+				var node = LiteGraph.createNode( name );
+				if(node)
+				{
+					node.pos = graphcanvas.convertEventToCanvas( event );
+					graphcanvas.graph.add( node );
+				}
+			}
+		}
+
+		dialog.close();
+	}
+
+	function changeSelection( forward )
+	{
+		if(selected)
+			selected.classList.remove("selected");
+		if(!selected)
+			selected = helper.childNodes[0];
+		else
+			selected = forward ? selected.nextSibling : selected.previousSibling;
+		if(!selected)
+			return;
+		selected.classList.add("selected");
+	}
+
+	function refreshHelper()
+	{
+		timeout = null;
+		var str = input.value;
+		first = null;
+		helper.innerHTML = "";
+		if(!str)
+			return;
+
+		if( that.onSearchBox )
+			that.onSearchBox( help, str, graphcanvas );
+		else
+			for( var i in LiteGraph.registered_node_types )
+				if(i.indexOf(str) != -1)
+				{
+					var help = document.createElement("div");
+					if(!first) first = i;
+					help.innerText = i;
+					help.className = "help-item";
+					help.addEventListener("click", function(e){
+						select( this.innerText );
+					});
+					helper.appendChild(help);
+				}
+	}
+
+	return dialog;
+}
+
 LGraphCanvas.prototype.showEditPropertyValue = function( node, property, options )
 {
 	if(!node || node.properties[ property ] === undefined )
@@ -5762,7 +5991,8 @@ LGraphCanvas.prototype.showEditPropertyValue = function( node, property, options
 		if(typeof( node.properties[ property ] ) == "number")
 			value = Number(value);
 		node.properties[ property ] = value;
-
+		if(node._graph)
+			node._graph._version++;
 		if(node.onPropertyChanged)
 			node.onPropertyChanged( property, value );
 		dialog.close();
@@ -6658,7 +6888,7 @@ LiteGraph.registerNodeType("basic/time", Time);
 function Subgraph()
 {
 	var that = this;
-	this.size = [120,60];
+	this.size = [120,80];
 
 	//create inner graph
 	this.subgraph = new LGraph();
@@ -6673,7 +6903,7 @@ function Subgraph()
 	this.subgraph.onGlobalOutputRenamed = this.onSubgraphRenamedGlobalOutput.bind(this);
 	this.subgraph.onGlobalOutputTypeChanged = this.onSubgraphTypeChangeGlobalOutput.bind(this);
 	
-	this.bgcolor = "#663";
+	this.bgcolor = "#353";
 }
 
 Subgraph.title = "Subgraph";
@@ -6740,6 +6970,19 @@ Subgraph.prototype.getExtraMenuOptions = function(graphcanvas)
 	}];
 }
 
+Subgraph.prototype.onDrawForeground = function( ctx, graphcanvas )
+{
+	var node = this;
+	ctx.globalAlpha = 0.75;
+	graphcanvas.guiButton(ctx, [0,this.size[1] - 20,this.size[0],19], "Open", function(){ graphcanvas.openSubgraph(node.subgraph); });
+	ctx.globalAlpha = 1;
+}
+
+Subgraph.prototype.onResize = function(size)
+{
+	size[1] += 20;
+}
+
 Subgraph.prototype.onExecute = function()
 {
 	//send inputs to subgraph global inputs
@@ -7382,6 +7625,7 @@ var LiteGraph = global.LiteGraph;
 		if(local_pos[0] > 1 && local_pos[1] > 1 && local_pos[0] < (this.size[0] - 2) && local_pos[1] < (this.size[1] - 2) )
 		{
 			this.properties.value = !this.properties.value;
+			this.graph._version++;
 			this.trigger( "e", this.properties.value );
 			return true;
 		}
@@ -7469,6 +7713,7 @@ var LiteGraph = global.LiteGraph;
 
 		var v = Math.clamp( this.properties.value + steps * this.properties.step, this.properties.min, this.properties.max );
 		this.properties.value = v;
+		this.graph._version++;
 		this.setDirtyCanvas(true);
 	}
 
@@ -7478,6 +7723,7 @@ var LiteGraph = global.LiteGraph;
 		{
 			var steps = pos[1] > this.size[1] * 0.5 ? -1 : 1;
 			this.properties.value = Math.clamp( this.properties.value + steps * this.properties.step, this.properties.min, this.properties.max );
+			this.graph._version++;
 			this.setDirtyCanvas(true);
 		}
 

build/litegraph.min.js

@@ -1,176 +1,177 @@
 (function(u){function g(){l.debug&&console.log("Graph created");this.list_of_graphcanvas=null;this.clear()}function e(a){this._ctor(a)}function h(a,b,d){d=d||{};this.background_image="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAIAAAD/gAIDAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAQBJREFUeNrs1rEKwjAUhlETUkj3vP9rdmr1Ysammk2w5wdxuLgcMHyptfawuZX4pJSWZTnfnu/lnIe/jNNxHHGNn//HNbbv+4dr6V+11uF527arU7+u63qfa/bnmh8sWLBgwYJlqRf8MEptXPBXJXa37BSl3ixYsGDBMliwFLyCV/DeLIMFCxYsWLBMwSt4Be/NggXLYMGCBUvBK3iNruC9WbBgwYJlsGApeAWv4L1ZBgsWLFiwYJmCV/AK3psFC5bBggULloJX8BpdwXuzYMGCBctgwVLwCl7Be7MMFixYsGDBsu8FH1FaSmExVfAxBa/gvVmwYMGCZbBg/W4vAQYA5tRF9QYlv/QAAAAASUVORK5CYII=";
 a&&a.constructor===String&&(a=document.querySelector(a));this.max_zoom=10;this.min_zoom=0.1;this.zoom_modify_alpha=!0;this.title_text_font="bold 14px Arial";this.inner_text_font="normal 12px Arial";this.node_title_color=l.NODE_TITLE_COLOR;this.default_link_color="#AAC";this.default_connection_color={input_off:"#AAB",input_on:"#7F7",output_off:"#AAB",output_on:"#7F7"};this.highquality_render=!0;this.editor_alpha=1;this.pause_rendering=!1;this.render_only_selected=this.clear_background=this.render_shadows=
-!0;this.live_mode=!1;this.allow_interaction=this.allow_dragnodes=this.allow_dragcanvas=this.show_info=!0;this.drag_mode=!1;this.dragging_rectangle=null;this.always_render_background=!1;this.render_canvas_border=!0;this.render_connections_shadows=!1;this.render_connection_arrows=this.render_curved_connections=this.render_connections_border=!0;this.connections_width=3;b&&b.attachCanvas(this);this.setCanvas(a);this.clear();d.skip_render||this.startRendering();this.autoresize=d.autoresize}function m(a,
-b){return Math.sqrt((b[0]-a[0])*(b[0]-a[0])+(b[1]-a[1])*(b[1]-a[1]))}function p(a,b,d,c,f,n){return d<a&&d+f>a&&c<b&&c+n>b?!0:!1}function q(a,b){var d=a[0]+a[2],c=a[1]+a[3],f=b[1]+b[3];return a[0]>b[0]+b[2]||a[1]>f||d<b[0]||c<b[1]?!1:!0}function r(a,b){function d(a){var b=parseInt(f.style.top);f.style.top=(b+0.1*a.deltaY).toFixed()+"px";a.preventDefault();return!0}this.options=b=b||{};var c=this;b.parentMenu&&(b.parentMenu.constructor!==this.constructor?(console.error("parentMenu must be of class ContextMenu, ignoring it"),
-b.parentMenu=null):(this.parentMenu=b.parentMenu,this.parentMenu.lock=!0,this.parentMenu.current_submenu=this));b.event&&b.event.constructor!==MouseEvent&&b.event.constructor!==CustomEvent&&(console.error("Event passed to ContextMenu is not of type MouseEvent or CustomEvent. Ignoring it."),b.event=null);var f=document.createElement("div");f.className="litegraph litecontextmenu litemenubar-panel";f.style.minWidth=100;f.style.minHeight=100;f.style.pointerEvents="none";setTimeout(function(){f.style.pointerEvents=
-"auto"},100);f.addEventListener("mouseup",function(a){a.preventDefault();return!0},!0);f.addEventListener("contextmenu",function(a){if(2!=a.button)return!1;a.preventDefault();return!1},!0);f.addEventListener("mousedown",function(a){if(2==a.button)return c.close(),a.preventDefault(),!0},!0);f.addEventListener("wheel",d,!0);f.addEventListener("mousewheel",d,!0);this.root=f;if(b.title){var n=document.createElement("div");n.className="litemenu-title";n.innerHTML=b.title;f.appendChild(n)}var n=0,k;for(k in a){var t=
-a.constructor==Array?a[k]:k;null!=t&&t.constructor!==String&&(t=void 0===t.content?String(t):t.content);this.addItem(t,a[k],b);n++}f.addEventListener("mouseleave",function(a){c.lock||c.close(a)});k=document;b.event&&(k=b.event.target.ownerDocument);k||(k=document);k.body.appendChild(f);n=b.left||0;k=b.top||0;if(b.event){n=b.event.pageX-10;k=b.event.pageY-10;b.title&&(k-=20);b.parentMenu&&(n=b.parentMenu.root.getBoundingClientRect(),n=n.left+n.width);var t=document.body.getBoundingClientRect(),e=f.getBoundingClientRect();
-n>t.width-e.width-10&&(n=t.width-e.width-10);k>t.height-e.height-10&&(k=t.height-e.height-10)}f.style.left=n+"px";f.style.top=k+"px"}var l=u.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:"",VALID_SHAPES:["box",
-"round"],BOX_SHAPE:1,ROUND_SHAPE:2,CIRCLE_SHAPE:3,INPUT:1,OUTPUT:2,EVENT:-1,ACTION:-1,ALWAYS:0,ON_EVENT:1,NEVER:2,ON_TRIGGER:3,proxy:null,debug:!1,throw_errors:!0,allow_scripts:!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;l.debug&&console.log("Node registered: "+a);a.split("/");var d=b.name,c=a.lastIndexOf("/");b.category=a.substr(0,c);b.title||
-(b.title=d);if(b.prototype)for(var f in e.prototype)b.prototype[f]||(b.prototype[f]=e.prototype[f]);Object.defineProperty(b.prototype,"shape",{set:function(a){switch(a){case "box":this._shape=l.BOX_SHAPE;break;case "round":this._shape=l.ROUND_SHAPE;break;case "circle":this._shape=l.CIRCLE_SHAPE;break;default:this._shape=a}},get:function(a){return this._shape},enumerable:!0});this.registered_node_types[a]=b;b.constructor.name&&(this.Nodes[d]=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(f in b.supported_extensions)this.node_types_by_file_extension[b.supported_extensions[f].toLowerCase()]=b},wrapFunctionAsNode:function(a,b,d,c){for(var f=Array(b.length),n="",k=l.getParameterNames(b),t=0;t<k.length;++t)n+="this.addInput('"+k[t]+"',"+(d&&d[t]?"'"+d[t]+"'":"0")+");\n";d=Function(n+("this.addOutput('out',"+(c?"'"+c+"'":0)+");\n"));d.title=a.split("/").pop();d.desc="Generated from "+
-b.name;d.prototype.onExecute=function(){for(var a=0;a<f.length;++a)f[a]=this.getInputData(a);a=b.apply(this,f);this.setOutputData(0,a)};this.registerNodeType(a,d)},addNodeMethod:function(a,b){e.prototype[a]=b;for(var d in this.registered_node_types){var c=this.registered_node_types[d];c.prototype[a]&&(c.prototype["_"+a]=c.prototype[a]);c.prototype[a]=b}},createNode:function(a,b,d){var c=this.registered_node_types[a];if(!c)return l.debug&&console.log('GraphNode type "'+a+'" not registered.'),null;
-b=b||c.title||a;c=new c(b);c.type=a;!c.title&&b&&(c.title=b);c.properties||(c.properties={});c.properties_info||(c.properties_info=[]);c.flags||(c.flags={});c.size||(c.size=c.computeSize());c.pos||(c.pos=l.DEFAULT_POSITION.concat());c.mode||(c.mode=l.ALWAYS);if(d)for(var f in d)c[f]=d[f];return c},getNodeType:function(a){return this.registered_node_types[a]},getNodeTypesInCategory:function(a){var b=[],d;for(d in this.registered_node_types)""==a?null==this.registered_node_types[d].category&&b.push(this.registered_node_types[d]):
-this.registered_node_types[d].category==a&&b.push(this.registered_node_types[d]);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 d=[];for(b in a)d.push(b);return d},reloadNodes:function(a){var b=document.getElementsByTagName("script"),d=[],c;for(c in b)d.push(b[c]);b=document.getElementsByTagName("head")[0];a=document.location.href+
-a;for(c in d){var f=d[c].src;if(f&&f.substr(0,a.length)==a)try{l.debug&&console.log("Reloading: "+f);var n=document.createElement("script");n.type="text/javascript";n.src=f;b.appendChild(n);b.removeChild(d[c])}catch(k){if(l.throw_errors)throw k;l.debug&&console.log("Error while reloading "+f)}}l.debug&&console.log("Nodes reloaded")},cloneObject:function(a,b){if(null==a)return null;var d=JSON.parse(JSON.stringify(a));if(!b)return d;for(var c in d)b[c]=d[c];return b},isValidConnection:function(a,b){if(!a||
-!b||a==b||a==l.EVENT&&b==l.ACTION)return!0;a=String(a);b=String(b);a=a.toLowerCase();b=b.toLowerCase();if(-1==a.indexOf(",")&&-1==b.indexOf(","))return a==b;for(var d=a.split(","),c=b.split(","),f=0;f<d.length;++f)for(var n=0;n<c.length;++n)if(d[f]==c[n])return!0;return!1}};l.getTime="undefined"!=typeof performance?performance.now.bind(performance):"undefined"!=typeof Date&&Date.now?Date.now.bind(Date):"undefined"!=typeof process?function(){var a=process.hrtime();return 0.001*a[0]+1E-6*a[1]}:function(){return(new Date).getTime()};
-u.LGraph=l.LGraph=g;g.supported_types=["number","string","boolean"];g.prototype.getSupportedTypes=function(){return this.supported_types||g.supported_types};g.STATUS_STOPPED=1;g.STATUS_RUNNING=2;g.prototype.clear=function(){this.stop();this.status=g.STATUS_STOPPED;this.last_node_id=0;this._nodes=[];this._nodes_by_id={};this._nodes_executable=this._nodes_in_order=null;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=this.last_update_time=0;this.catch_errors=!0;this.global_inputs={};this.global_outputs={};this.debug=!0;this.change();this.sendActionToCanvas("clear")};g.prototype.attachCanvas=function(a){if(a.constructor!=h)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)};g.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))}};g.prototype.start=function(a){if(this.status!=g.STATUS_RUNNING){this.status=g.STATUS_RUNNING;if(this.onPlayEvent)this.onPlayEvent();this.sendEventToAllNodes("onStart");this.last_update_time=this.starttime=l.getTime();var b=this;this.execution_timer_id=setInterval(function(){b.runStep(1,!this.catch_errors)},a||1)}};g.prototype.stop=function(){if(this.status!=g.STATUS_STOPPED){this.status=g.STATUS_STOPPED;
-if(this.onStopEvent)this.onStopEvent();null!=this.execution_timer_id&&clearInterval(this.execution_timer_id);this.execution_timer_id=null;this.sendEventToAllNodes("onStop")}};g.prototype.runStep=function(a,b){a=a||1;var d=l.getTime();this.globaltime=0.001*(d-this.starttime);var c=this._nodes_executable?this._nodes_executable:this._nodes;if(c){if(b){for(var f=0;f<a;f++){for(var n=0,k=c.length;n<k;++n){var t=c[n];if(t.mode==l.ALWAYS&&t.onExecute)t.onExecute()}this.fixedtime+=this.fixedtime_lapse;if(this.onExecuteStep)this.onExecuteStep()}if(this.onAfterExecute)this.onAfterExecute()}else try{for(f=
-0;f<a;f++){n=0;for(k=c.length;n<k;++n)if(t=c[n],t.mode==l.ALWAYS&&t.onExecute)t.onExecute();this.fixedtime+=this.fixedtime_lapse;if(this.onExecuteStep)this.onExecuteStep()}if(this.onAfterExecute)this.onAfterExecute();this.errors_in_execution=!1}catch(e){this.errors_in_execution=!0;if(l.throw_errors)throw e;l.debug&&console.log("Error during execution: "+e);this.stop()}c=l.getTime();d=c-d;0==d&&(d=1);this.execution_time=0.001*d;this.globaltime+=0.001*d;this.iteration+=1;this.elapsed_time=0.001*(c-
-this.last_update_time);this.last_update_time=c}};g.prototype.updateExecutionOrder=function(){this._nodes_in_order=this.computeExecutionOrder(!1);this._nodes_executable=[];for(var a=0;a<this._nodes_in_order.length;++a)this._nodes_in_order[a].onExecute&&this._nodes_executable.push(this._nodes_in_order[a])};g.prototype.computeExecutionOrder=function(a,b){for(var d=[],c=[],f={},n={},k={},t=0,e=this._nodes.length;t<e;++t){var h=this._nodes[t];if(!a||h.onExecute){f[h.id]=h;var g=0;if(h.inputs)for(var m=
-0,p=h.inputs.length;m<p;m++)h.inputs[m]&&null!=h.inputs[m].link&&(g+=1);0==g?(c.push(h),b&&(h._level=1)):(b&&(h._level=0),k[h.id]=g)}}for(;0!=c.length;)if(h=c.shift(),d.push(h),delete f[h.id],h.outputs)for(t=0;t<h.outputs.length;t++)if(e=h.outputs[t],null!=e&&null!=e.links&&0!=e.links.length)for(m=0;m<e.links.length;m++)(g=this.links[e.links[m]])&&!n[g.id]&&(p=this.getNodeById(g.target_id),null==p?n[g.id]=!0:(b&&(!p._level||p._level<=h._level)&&(p._level=h._level+1),n[g.id]=!0,k[p.id]-=1,0==k[p.id]&&
-c.push(p)));for(t in f)d.push(f[t]);d.length!=this._nodes.length&&l.debug&&console.warn("something went wrong, nodes missing");e=d.length;for(t=0;t<e;++t)d[t].order=t;d=d.sort(function(a,b){var d=a.constructor.priority||a.priority||0,c=b.constructor.priority||b.priority||0;return d==c?a.order-b.order:d-c});for(t=0;t<e;++t)d[t].order=t;return d};g.prototype.arrange=function(a){a=a||40;for(var b=this.computeExecutionOrder(!1,!0),d=[],c=0;c<b.length;++c){var f=b[c],n=f._level||1;d[n]||(d[n]=[]);d[n].push(f)}b=
-a;for(c=0;c<d.length;++c)if(n=d[c]){for(var k=100,e=a,h=0;h<n.length;++h)f=n[h],f.pos[0]=b,f.pos[1]=e,f.size[0]>k&&(k=f.size[0]),e+=f.size[1]+a;b+=k+a}this.setDirtyCanvas(!0,!0)};g.prototype.getTime=function(){return this.globaltime};g.prototype.getFixedTime=function(){return this.fixedtime};g.prototype.getElapsedTime=function(){return this.elapsed_time};g.prototype.sendEventToAllNodes=function(a,b,d){d=d||l.ALWAYS;var c=this._nodes_in_order?this._nodes_in_order:this._nodes;if(c)for(var f=0,n=c.length;f<
-n;++f){var k=c[f];if(k[a]&&k.mode==d)if(void 0===b)k[a]();else if(b&&b.constructor===Array)k[a].apply(k,b);else k[a](b)}};g.prototype.sendActionToCanvas=function(a,b){if(this.list_of_graphcanvas)for(var d=0;d<this.list_of_graphcanvas.length;++d){var c=this.list_of_graphcanvas[d];c[a]&&c[a].apply(c,b)}};g.prototype.add=function(a,b){if(a){-1!=a.id&&null!=this._nodes_by_id[a.id]&&(console.warn("LiteGraph: there is already a node with this ID, changing it"),a.id=++this.last_node_id);if(this._nodes.length>=
-l.MAX_NUMBER_OF_NODES)throw"LiteGraph: max number of nodes in a graph reached";null==a.id||-1==a.id?a.id=++this.last_node_id:this.last_node_id<a.id&&(this.last_node_id=a.id);a.graph=this;this._nodes.push(a);this._nodes_by_id[a.id]=a;if(a.onAdded)a.onAdded(this);this.config.align_to_grid&&a.alignToGrid();b||this.updateExecutionOrder();if(this.onNodeAdded)this.onNodeAdded(a);this.setDirtyCanvas(!0);this.change();return a}};g.prototype.remove=function(a){if(null!=this._nodes_by_id[a.id]&&!a.ignore_remove){if(a.inputs)for(var b=
-0;b<a.inputs.length;b++){var d=a.inputs[b];null!=d.link&&a.disconnectInput(b)}if(a.outputs)for(b=0;b<a.outputs.length;b++)d=a.outputs[b],null!=d.links&&d.links.length&&a.disconnectOutput(b);if(a.onRemoved)a.onRemoved();a.graph=null;if(this.list_of_graphcanvas)for(b=0;b<this.list_of_graphcanvas.length;++b)d=this.list_of_graphcanvas[b],d.selected_nodes[a.id]&&delete d.selected_nodes[a.id],d.node_dragged==a&&(d.node_dragged=null);b=this._nodes.indexOf(a);-1!=b&&this._nodes.splice(b,1);delete this._nodes_by_id[a.id];
-if(this.onNodeRemoved)this.onNodeRemoved(a);this.setDirtyCanvas(!0,!0);this.change();this.updateExecutionOrder()}};g.prototype.getNodeById=function(a){return null==a?null:this._nodes_by_id[a]};g.prototype.findNodesByClass=function(a){for(var b=[],d=0,c=this._nodes.length;d<c;++d)this._nodes[d].constructor===a&&b.push(this._nodes[d]);return b};g.prototype.findNodesByType=function(a){a=a.toLowerCase();for(var b=[],d=0,c=this._nodes.length;d<c;++d)this._nodes[d].type.toLowerCase()==a&&b.push(this._nodes[d]);
-return b};g.prototype.findNodesByTitle=function(a){for(var b=[],d=0,c=this._nodes.length;d<c;++d)this._nodes[d].title==a&&b.push(this._nodes[d]);return b};g.prototype.getNodeOnPos=function(a,b,d){d=d||this._nodes;for(var c=d.length-1;0<=c;c--){var f=d[c];if(f.isPointInsideNode(a,b,2))return f}return null};g.prototype.addGlobalInput=function(a,b,d){this.global_inputs[a]={name:a,type:b,value:d};if(this.onGlobalInputAdded)this.onGlobalInputAdded(a,b);if(this.onGlobalsChange)this.onGlobalsChange()};g.prototype.setGlobalInputData=
-function(a,b){var d=this.global_inputs[a];d&&(d.value=b)};g.prototype.setInputData=g.prototype.setGlobalInputData;g.prototype.getGlobalInputData=function(a){return(a=this.global_inputs[a])?a.value:null};g.prototype.renameGlobalInput=function(a,b){if(b!=a){if(!this.global_inputs[a])return!1;if(this.global_inputs[b])return console.error("there is already one input with that name"),!1;this.global_inputs[b]=this.global_inputs[a];delete this.global_inputs[a];if(this.onGlobalInputRenamed)this.onGlobalInputRenamed(a,
-b);if(this.onGlobalsChange)this.onGlobalsChange()}};g.prototype.changeGlobalInputType=function(a,b){if(!this.global_inputs[a])return!1;if(this.global_inputs[a].type.toLowerCase()!=b.toLowerCase()&&(this.global_inputs[a].type=b,this.onGlobalInputTypeChanged))this.onGlobalInputTypeChanged(a,b)};g.prototype.removeGlobalInput=function(a){if(!this.global_inputs[a])return!1;delete this.global_inputs[a];if(this.onGlobalInputRemoved)this.onGlobalInputRemoved(a);if(this.onGlobalsChange)this.onGlobalsChange();
-return!0};g.prototype.addGlobalOutput=function(a,b,d){this.global_outputs[a]={name:a,type:b,value:d};if(this.onGlobalOutputAdded)this.onGlobalOutputAdded(a,b);if(this.onGlobalsChange)this.onGlobalsChange()};g.prototype.setGlobalOutputData=function(a,b){var d=this.global_outputs[a];d&&(d.value=b)};g.prototype.getGlobalOutputData=function(a){return(a=this.global_outputs[a])?a.value:null};g.prototype.getOutputData=g.prototype.getGlobalOutputData;g.prototype.renameGlobalOutput=function(a,b){if(!this.global_outputs[a])return!1;
-if(this.global_outputs[b])return console.error("there is already one output with that name"),!1;this.global_outputs[b]=this.global_outputs[a];delete this.global_outputs[a];if(this.onGlobalOutputRenamed)this.onGlobalOutputRenamed(a,b);if(this.onGlobalsChange)this.onGlobalsChange()};g.prototype.changeGlobalOutputType=function(a,b){if(!this.global_outputs[a])return!1;if(this.global_outputs[a].type.toLowerCase()!=b.toLowerCase()&&(this.global_outputs[a].type=b,this.onGlobalOutputTypeChanged))this.onGlobalOutputTypeChanged(a,
-b)};g.prototype.removeGlobalOutput=function(a){if(!this.global_outputs[a])return!1;delete this.global_outputs[a];if(this.onGlobalOutputRemoved)this.onGlobalOutputRemoved(a);if(this.onGlobalsChange)this.onGlobalsChange();return!0};g.prototype.triggerInput=function(a,b){for(var d=this.findNodesByTitle(a),c=0;c<d.length;++c)d[c].onTrigger(b)};g.prototype.setCallback=function(a,b){for(var d=this.findNodesByTitle(a),c=0;c<d.length;++c)d[c].setTrigger(b)};g.prototype.connectionChange=function(a){this.updateExecutionOrder();
-if(this.onConnectionChange)this.onConnectionChange(a);this.sendActionToCanvas("onConnectionChange")};g.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};g.prototype.change=function(){l.debug&&console.log("Graph changed");this.sendActionToCanvas("setDirty",[!0,!0]);if(this.on_change)this.on_change(this)};g.prototype.setDirtyCanvas=function(a,b){this.sendActionToCanvas("setDirty",
-[a,b])};g.prototype.serialize=function(){for(var a=[],b=0,d=this._nodes.length;b<d;++b)a.push(this._nodes[b].serialize());d=[];for(b in this.links){var c=this.links[b];d.push([c.id,c.origin_id,c.origin_slot,c.target_id,c.target_slot,c.type])}return{iteration:this.iteration,frame:this.frame,last_node_id:this.last_node_id,last_link_id:this.last_link_id,links:d,config:this.config,nodes:a}};g.prototype.configure=function(a,b){b||this.clear();var d=a.nodes;if(a.links&&a.links.constructor===Array){for(var c=
-{},f=0;f<a.links.length;++f){var n=a.links[f];c[n[0]]={id:n[0],origin_id:n[1],origin_slot:n[2],target_id:n[3],target_slot:n[4],type:n[5]}}a.links=c}for(f in a)this[f]=a[f];c=!1;this._nodes=[];f=0;for(n=d.length;f<n;++f){var k=d[f],e=l.createNode(k.type,k.title);e?(e.id=k.id,this.add(e,!0)):(l.debug&&console.log("Node not found: "+k.type),c=!0)}f=0;for(n=d.length;f<n;++f)k=d[f],(e=this.getNodeById(k.id))&&e.configure(k);this.updateExecutionOrder();this.setDirtyCanvas(!0,!0);return c};g.prototype.load=
-function(a){var b=this,d=new XMLHttpRequest;d.open("GET",a,!0);d.send(null);d.onload=function(a){200!==d.status?console.error("Error loading graph:",d.status,d.response):(a=JSON.parse(d.response),b.configure(a))};d.onerror=function(a){console.error("Error loading graph:",a)}};g.prototype.onNodeTrace=function(a,b,d){};u.LGraphNode=l.LGraphNode=e;e.prototype._ctor=function(a){this.title=a||"Unnamed";this.size=[l.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={}};e.prototype.configure=function(a){for(var b in a)if("console"!=b)if("properties"==b)for(var d in a.properties){if(this.properties[d]=a.properties[d],this.onPropertyChanged)this.onPropertyChanged(d,a.properties[d])}else null!=
-a[b]&&("object"==typeof a[b]?this[b]&&this[b].configure?this[b].configure(a[b]):this[b]=l.cloneObject(a[b],this[b]):this[b]=a[b]);a.title||(this.title=this.constructor.title);if(this.onConnectionsChange){if(this.inputs)for(var c=0;c<this.inputs.length;++c){d=this.inputs[c];var f=this.graph.links[d.link];this.onConnectionsChange(l.INPUT,c,!0,f,d)}if(this.outputs)for(c=0;c<this.outputs.length;++c)if(d=this.outputs[c],d.links)for(b=0;b<d.links.length;++b)f=this.graph.links[d.links[b]],this.onConnectionsChange(l.OUTPUT,
-c,!0,f,d)}for(c in this.inputs)d=this.inputs[c],d.link&&d.link.length&&(f=d.link,"object"==typeof f&&(d.link=f[0],this.graph.links[f[0]]={id:f[0],origin_id:f[1],origin_slot:f[2],target_id:f[3],target_slot:f[4]}));for(c in this.outputs)if(d=this.outputs[c],d.links&&0!=d.links.length)for(b in d.links)f=d.links[b],"object"==typeof f&&(d.links[b]=f[0]);if(this.onConfigure)this.onConfigure(a)};e.prototype.serialize=function(){var a={id:this.id,type:this.type,pos:this.pos,size:this.size,data:this.data,
-flags:l.cloneObject(this.flags),mode:this.mode};this.inputs&&(a.inputs=this.inputs);if(this.outputs){for(var b=0;b<this.outputs.length;b++)delete this.outputs[b]._data;a.outputs=this.outputs}this.title&&this.title!=this.constructor.title&&(a.title=this.title);this.properties&&(a.properties=l.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};e.prototype.clone=function(){var a=l.createNode(this.type),b=l.cloneObject(this.serialize());if(b.inputs)for(var d=0;d<b.inputs.length;++d)b.inputs[d].link=null;if(b.outputs)for(d=0;d<b.outputs.length;++d)b.outputs[d].links&&(b.outputs[d].links.length=0);delete b.id;a.configure(b);return a};e.prototype.toString=function(){return JSON.stringify(this.serialize())};e.prototype.getTitle=function(){return this.title||this.constructor.title};e.prototype.setOutputData=
-function(a,b){if(this.outputs&&!(-1==a||a>=this.outputs.length)){var d=this.outputs[a];if(d&&(d._data=b,this.outputs[a].links))for(d=0;d<this.outputs[a].links.length;d++)this.graph.links[this.outputs[a].links[d]].data=b}};e.prototype.getInputData=function(a,b){if(this.inputs&&!(a>=this.inputs.length||null==this.inputs[a].link)){var d=this.graph.links[this.inputs[a].link];if(!d)return null;if(!b)return d.data;var c=this.graph.getNodeById(d.origin_id);if(!c)return d.data;if(c.updateOutputData)c.updateOutputData(d.origin_slot);
-else if(c.onExecute)c.onExecute();return d.data}};e.prototype.getInputDataByName=function(a,b){var d=this.findInputSlot(a);return-1==d?null:this.getInputData(d,b)};e.prototype.isInputConnected=function(a){return this.inputs?a<this.inputs.length&&null!=this.inputs[a].link:!1};e.prototype.getInputInfo=function(a){return this.inputs?a<this.inputs.length?this.inputs[a]:null:null};e.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};e.prototype.getInputOrProperty=function(a){if(!this.inputs||!this.inputs.length)return this.properties?this.properties[a]:null;for(var b=0,d=this.inputs.length;b<d;++b)if(a==this.inputs[b].name)return(a=this.graph.links[this.inputs[b].link])?a.data:null;return this.properties[a]};e.prototype.getOutputData=function(a){return!this.outputs||a>=this.outputs.length?null:this.outputs[a]._data};e.prototype.getOutputInfo=function(a){return this.outputs?
-a<this.outputs.length?this.outputs[a]:null:null};e.prototype.isOutputConnected=function(a){return this.outputs?a<this.outputs.length&&this.outputs[a].links&&this.outputs[a].links.length:!1};e.prototype.isAnyOutputConnected=function(){if(!this.outputs)return!1;for(var a=0;a<this.outputs.length;++a)if(this.outputs[a].links&&this.outputs[a].links.length)return!0;return!1};e.prototype.getOutputNodes=function(a){if(!this.outputs||0==this.outputs.length||a>=this.outputs.length)return null;a=this.outputs[a];
-if(!a.links||0==a.links.length)return null;for(var b=[],d=0;d<a.links.length;d++){var c=this.graph.links[a.links[d]];c&&(c=this.graph.getNodeById(c.target_id))&&b.push(c)}return b};e.prototype.trigger=function(a,b){if(this.outputs&&this.outputs.length){this.graph&&(this.graph._last_trigger_time=l.getTime());for(var d=0;d<this.outputs.length;++d){var c=this.outputs[d];!c||c.type!==l.EVENT||a&&c.name!=a||this.triggerSlot(d,b)}}};e.prototype.triggerSlot=function(a,b){if(this.outputs){var d=this.outputs[a];
-if(d&&(d=d.links)&&d.length){this.graph&&(this.graph._last_trigger_time=l.getTime());for(var c=0;c<d.length;++c){var f=this.graph.links[d[c]];if(f){var n=this.graph.getNodeById(f.target_id);if(n)if(f._last_time=l.getTime(),f=n.inputs[f.target_slot],n.onAction)n.onAction(f.name,b);else if(n.mode===l.ON_TRIGGER&&n.onExecute)n.onExecute(b)}}}}};e.prototype.addProperty=function(a,b,d,c){d={name:a,type:d,default_value:b};if(c)for(var f in c)d[f]=c[f];this.properties_info||(this.properties_info=[]);this.properties_info.push(d);
-this.properties||(this.properties={});this.properties[a]=b;return d};e.prototype.addOutput=function(a,b,d){a={name:a,type:b,links:null};if(d)for(var c in d)a[c]=d[c];this.outputs||(this.outputs=[]);this.outputs.push(a);if(this.onOutputAdded)this.onOutputAdded(a);this.size=this.computeSize();return a};e.prototype.addOutputs=function(a){for(var b=0;b<a.length;++b){var d=a[b],c={name:d[0],type:d[1],link:null};if(a[2])for(var f in d[2])c[f]=d[2][f];this.outputs||(this.outputs=[]);this.outputs.push(c);
-if(this.onOutputAdded)this.onOutputAdded(c)}this.size=this.computeSize()};e.prototype.removeOutput=function(a){this.disconnectOutput(a);this.outputs.splice(a,1);this.size=this.computeSize();if(this.onOutputRemoved)this.onOutputRemoved(a)};e.prototype.addInput=function(a,b,d){a={name:a,type:b||0,link:null};if(d)for(var c in d)a[c]=d[c];this.inputs||(this.inputs=[]);this.inputs.push(a);this.size=this.computeSize();if(this.onInputAdded)this.onInputAdded(a);return a};e.prototype.addInputs=function(a){for(var b=
-0;b<a.length;++b){var d=a[b],c={name:d[0],type:d[1],link:null};if(a[2])for(var f in d[2])c[f]=d[2][f];this.inputs||(this.inputs=[]);this.inputs.push(c);if(this.onInputAdded)this.onInputAdded(c)}this.size=this.computeSize()};e.prototype.removeInput=function(a){this.disconnectInput(a);this.inputs.splice(a,1);this.size=this.computeSize();if(this.onInputRemoved)this.onInputRemoved(a)};e.prototype.addConnection=function(a,b,d,c){a={name:a,type:b,pos:d,direction:c,links:null};this.connections.push(a);return a};
-e.prototype.computeSize=function(a,b){function d(a){return a?n*a.length*0.6:0}var c=Math.max(this.inputs?this.inputs.length:1,this.outputs?this.outputs.length:1),f=b||new Float32Array([0,0]),c=Math.max(c,1);f[1]=14*c+6;var n=14,c=d(this.title),k=0,e=0;if(this.inputs)for(var h=0,g=this.inputs.length;h<g;++h){var m=this.inputs[h],m=m.label||m.name||"",m=d(m);k<m&&(k=m)}if(this.outputs)for(h=0,g=this.outputs.length;h<g;++h)m=this.outputs[h],m=m.label||m.name||"",m=d(m),e<m&&(e=m);f[0]=Math.max(k+e+10,
-c);f[0]=Math.max(f[0],l.NODE_WIDTH);return f};e.prototype.getBounding=function(a){a=a||new Float32Array(4);a[0]=this.pos[0]-4;a[1]=this.pos[1]-l.NODE_TITLE_HEIGHT;a[2]=this.size[0]+4;a[3]=this.size[1]+l.NODE_TITLE_HEIGHT;return a};e.prototype.isPointInsideNode=function(a,b,d){d=d||0;var c=this.graph&&this.graph.isLive()?0:20;if(this.flags.collapsed){if(p(a,b,this.pos[0]-d,this.pos[1]-l.NODE_TITLE_HEIGHT-d,l.NODE_COLLAPSED_WIDTH+2*d,l.NODE_TITLE_HEIGHT+2*d))return!0}else if(this.pos[0]-4-d<a&&this.pos[0]+
-this.size[0]+4+d>a&&this.pos[1]-c-d<b&&this.pos[1]+this.size[1]+d>b)return!0;return!1};e.prototype.getSlotInPosition=function(a,b){if(this.inputs)for(var d=0,c=this.inputs.length;d<c;++d){var f=this.inputs[d],n=this.getConnectionPos(!0,d);if(p(a,b,n[0]-10,n[1]-5,20,10))return{input:f,slot:d,link_pos:n,locked:f.locked}}if(this.outputs)for(d=0,c=this.outputs.length;d<c;++d)if(f=this.outputs[d],n=this.getConnectionPos(!1,d),p(a,b,n[0]-10,n[1]-5,20,10))return{output:f,slot:d,link_pos:n,locked:f.locked};
-return null};e.prototype.findInputSlot=function(a){if(!this.inputs)return-1;for(var b=0,d=this.inputs.length;b<d;++b)if(a==this.inputs[b].name)return b;return-1};e.prototype.findOutputSlot=function(a){if(!this.outputs)return-1;for(var b=0,d=this.outputs.length;b<d;++b)if(a==this.outputs[b].name)return b;return-1};e.prototype.connect=function(a,b,d){d=d||0;if(a.constructor===String){if(a=this.findOutputSlot(a),-1==a)return l.debug&&console.log("Connect: Error, no slot of name "+a),!1}else if(!this.outputs||
-a>=this.outputs.length)return l.debug&&console.log("Connect: Error, slot number not found"),!1;b&&b.constructor===Number&&(b=this.graph.getNodeById(b));if(!b)throw"Node not found";if(b==this)return!1;if(d.constructor===String){if(d=b.findInputSlot(d),-1==d)return l.debug&&console.log("Connect: Error, no slot of name "+d),!1}else{if(d===l.EVENT)return!1;if(!b.inputs||d>=b.inputs.length)return l.debug&&console.log("Connect: Error, slot number not found"),!1}null!=b.inputs[d].link&&b.disconnectInput(d);
-this.setDirtyCanvas(!1,!0);this.graph.connectionChange(this);var c=this.outputs[a];if(b.onConnectInput&&!1===b.onConnectInput(d,c.type,c))return!1;var f=b.inputs[d];if(l.isValidConnection(c.type,f.type)){var n={id:this.graph.last_link_id++,type:f.type,origin_id:this.id,origin_slot:a,target_id:b.id,target_slot:d};this.graph.links[n.id]=n;null==c.links&&(c.links=[]);c.links.push(n.id);b.inputs[d].link=n.id;if(this.onConnectionsChange)this.onConnectionsChange(l.OUTPUT,a,!0,n,c);if(b.onConnectionsChange)b.onConnectionsChange(l.INPUT,
-d,!0,n,f)}this.setDirtyCanvas(!1,!0);this.graph.connectionChange(this);return!0};e.prototype.disconnectOutput=function(a,b){if(a.constructor===String){if(a=this.findOutputSlot(a),-1==a)return l.debug&&console.log("Connect: Error, no slot of name "+a),!1}else if(!this.outputs||a>=this.outputs.length)return l.debug&&console.log("Connect: Error, slot number not found"),!1;var d=this.outputs[a];if(!d.links||0==d.links.length)return!1;if(b){b.constructor===Number&&(b=this.graph.getNodeById(b));if(!b)throw"Target Node not found";
-for(var c=0,f=d.links.length;c<f;c++){var n=d.links[c],k=this.graph.links[n];if(k.target_id==b.id){d.links.splice(c,1);var e=b.inputs[k.target_slot];e.link=null;delete this.graph.links[n];if(b.onConnectionsChange)b.onConnectionsChange(l.INPUT,k.target_slot,!1,k,e);if(this.onConnectionsChange)this.onConnectionsChange(l.OUTPUT,a,!1,k,d);break}}}else{c=0;for(f=d.links.length;c<f;c++)if(n=d.links[c],k=this.graph.links[n]){if(b=this.graph.getNodeById(k.target_id))if(e=b.inputs[k.target_slot],e.link=null,
-b.onConnectionsChange)b.onConnectionsChange(l.INPUT,k.target_slot,!1,k,e);delete this.graph.links[n];if(this.onConnectionsChange)this.onConnectionsChange(l.OUTPUT,a,!1,k,d)}d.links=null}this.setDirtyCanvas(!1,!0);this.graph.connectionChange(this);return!0};e.prototype.disconnectInput=function(a){if(a.constructor===String){if(a=this.findInputSlot(a),-1==a)return l.debug&&console.log("Connect: Error, no slot of name "+a),!1}else if(!this.inputs||a>=this.inputs.length)return l.debug&&console.log("Connect: Error, slot number not found"),
-!1;var b=this.inputs[a];if(!b)return!1;var d=this.inputs[a].link;this.inputs[a].link=null;var c=this.graph.links[d];if(c){var f=this.graph.getNodeById(c.origin_id);if(!f)return!1;var n=f.outputs[c.origin_slot];if(!n||!n.links||0==n.links.length)return!1;for(var k=0,e=n.links.length;k<e;k++)if(n.links[k]==d){n.links.splice(k,1);break}delete this.graph.links[d];if(this.onConnectionsChange)this.onConnectionsChange(l.INPUT,a,!1,c,b);if(f.onConnectionsChange)f.onConnectionsChange(l.OUTPUT,k,!1,c,n)}this.setDirtyCanvas(!1,
-!0);this.graph.connectionChange(this);return!0};e.prototype.getConnectionPos=function(a,b){return this.flags.collapsed?a?[this.pos[0],this.pos[1]-0.5*l.NODE_TITLE_HEIGHT]:[this.pos[0]+l.NODE_COLLAPSED_WIDTH,this.pos[1]-0.5*l.NODE_TITLE_HEIGHT]:a&&-1==b?[this.pos[0]+10,this.pos[1]+10]:a&&this.inputs.length>b&&this.inputs[b].pos?[this.pos[0]+this.inputs[b].pos[0],this.pos[1]+this.inputs[b].pos[1]]:!a&&this.outputs.length>b&&this.outputs[b].pos?[this.pos[0]+this.outputs[b].pos[0],this.pos[1]+this.outputs[b].pos[1]]:
-a?[this.pos[0],this.pos[1]+10+b*l.NODE_SLOT_HEIGHT]:[this.pos[0]+this.size[0]+1,this.pos[1]+10+b*l.NODE_SLOT_HEIGHT]};e.prototype.alignToGrid=function(){this.pos[0]=l.CANVAS_GRID_SIZE*Math.round(this.pos[0]/l.CANVAS_GRID_SIZE);this.pos[1]=l.CANVAS_GRID_SIZE*Math.round(this.pos[1]/l.CANVAS_GRID_SIZE)};e.prototype.trace=function(a){this.console||(this.console=[]);this.console.push(a);this.console.length>e.MAX_CONSOLE&&this.console.shift();this.graph.onNodeTrace(this,a)};e.prototype.setDirtyCanvas=function(a,
-b){this.graph&&this.graph.sendActionToCanvas("setDirty",[a,b])};e.prototype.loadImage=function(a){var b=new Image;b.src=l.node_images_path+a;b.ready=!1;var d=this;b.onload=function(){this.ready=!0;d.setDirtyCanvas(!0)};return b};e.prototype.captureInput=function(a){if(this.graph&&this.graph.list_of_graphcanvas)for(var b=this.graph.list_of_graphcanvas,d=0;d<b.length;++d){var c=b[d];if(a||c.node_capturing_input==this)c.node_capturing_input=a?this:null}};e.prototype.collapse=function(){this.flags.collapsed=
-this.flags.collapsed?!1:!0;this.setDirtyCanvas(!0,!0)};e.prototype.pin=function(a){this.flags.pinned=void 0===a?!this.flags.pinned:a};e.prototype.localToScreen=function(a,b,d){return[(a+this.pos[0])*d.scale+d.offset[0],(b+this.pos[1])*d.scale+d.offset[1]]};u.LGraphCanvas=l.LGraphCanvas=h;h.link_type_colors={"-1":"#F85",number:"#AAC",node:"#DCA"};h.prototype.clear=function(){this.fps=this.render_time=this.last_draw_time=this.frame=0;this.scale=1;this.offset=[0,0];this.dragging_rectangle=null;this.selected_nodes=
-{};this.visible_nodes=[];this.connecting_node=this.node_capturing_input=this.node_over=this.node_dragged=null;this.highlighted_links={};this.dirty_bgcanvas=this.dirty_canvas=!0;this.node_in_panel=this.dirty_area=null;this.last_mouse=[0,0];this.last_mouseclick=0;if(this.onClear)this.onClear()};h.prototype.setGraph=function(a,b){this.graph!=a&&(b||this.clear(),!a&&this.graph?this.graph.detachCanvas(this):(a.attachCanvas(this),this.setDirty(!0,!0)))};h.prototype.openSubgraph=function(a){if(!a)throw"graph cannot be null";
-if(this.graph==a)throw"graph cannot be the same";this.clear();this.graph&&(this._graph_stack||(this._graph_stack=[]),this._graph_stack.push(this.graph));a.attachCanvas(this);this.setDirty(!0,!0)};h.prototype.closeSubgraph=function(){if(this._graph_stack&&0!=this._graph_stack.length){var a=this._graph_stack.pop();this.selected_nodes={};this.highlighted_links={};a.attachCanvas(this);this.setDirty(!0,!0)}};h.prototype.setCanvas=function(a,b){if(a&&a.constructor===String&&(a=document.getElementById(a),
-!a))throw"Error creating LiteGraph canvas: Canvas not found";if(a!==this.canvas&&(!a&&this.canvas&&(b||this.unbindEvents()),this.canvas=a)){a.className+=" lgraphcanvas";a.data=this;this.bgcanvas=null;this.bgcanvas||(this.bgcanvas=document.createElement("canvas"),this.bgcanvas.width=this.canvas.width,this.bgcanvas.height=this.canvas.height);if(null==a.getContext){if("canvas"!=a.localName)throw"Element supplied for LGraphCanvas must be a <canvas> element, you passed a "+a.localName;throw"This browser doesnt support Canvas";
-}null==(this.ctx=a.getContext("2d"))&&(console.warn("This canvas seems to be WebGL, enabling WebGL renderer"),this.enableWebGL());this._mousemove_callback=this.processMouseMove.bind(this);this._mouseup_callback=this.processMouseUp.bind(this);b||this.bindEvents()}};h.prototype._doNothing=function(a){a.preventDefault();return!1};h.prototype._doReturnTrue=function(a){a.preventDefault();return!0};h.prototype.bindEvents=function(){if(this._events_binded)console.warn("LGraphCanvas: events already binded");
-else{var a=this.canvas,b=this.getCanvasWindow().document;this._mousedown_callback=this.processMouseDown.bind(this);this._mousewheel_callback=this.processMouseWheel.bind(this);a.addEventListener("mousedown",this._mousedown_callback,!0);a.addEventListener("mousemove",this._mousemove_callback);a.addEventListener("mousewheel",this._mousewheel_callback,!1);a.addEventListener("contextmenu",this._doNothing);a.addEventListener("DOMMouseScroll",this._mousewheel_callback,!1);a.addEventListener("touchstart",
-this.touchHandler,!0);a.addEventListener("touchmove",this.touchHandler,!0);a.addEventListener("touchend",this.touchHandler,!0);a.addEventListener("touchcancel",this.touchHandler,!0);this._key_callback=this.processKey.bind(this);a.addEventListener("keydown",this._key_callback,!0);b.addEventListener("keyup",this._key_callback,!0);this._ondrop_callback=this.processDrop.bind(this);a.addEventListener("dragover",this._doNothing,!1);a.addEventListener("dragend",this._doNothing,!1);a.addEventListener("drop",
-this._ondrop_callback,!1);a.addEventListener("dragenter",this._doReturnTrue,!1);this._events_binded=!0}};h.prototype.unbindEvents=function(){if(this._events_binded){var a=this.getCanvasWindow().document;this.canvas.removeEventListener("mousedown",this._mousedown_callback);this.canvas.removeEventListener("mousewheel",this._mousewheel_callback);this.canvas.removeEventListener("DOMMouseScroll",this._mousewheel_callback);this.canvas.removeEventListener("keydown",this._key_callback);a.removeEventListener("keyup",
-this._key_callback);this.canvas.removeEventListener("contextmenu",this._doNothing);this.canvas.removeEventListener("drop",this._ondrop_callback);this.canvas.removeEventListener("dragenter",this._doReturnTrue);this.canvas.removeEventListener("touchstart",this.touchHandler);this.canvas.removeEventListener("touchmove",this.touchHandler);this.canvas.removeEventListener("touchend",this.touchHandler);this.canvas.removeEventListener("touchcancel",this.touchHandler);this._ondrop_callback=this._key_callback=
-this._mousewheel_callback=this._mousedown_callback=null;this._events_binded=!1}else console.warn("LGraphCanvas: no events binded")};h.getFileExtension=function(a){var b=a.indexOf("?");-1!=b&&(a=a.substr(0,b));b=a.lastIndexOf(".");return-1==b?"":a.substr(b+1).toLowerCase()};h.prototype.enableWebGL=function(){if(void 0===typeof GL)throw"litegl.js must be included to use a WebGL canvas";if(void 0===typeof enableWebGLCanvas)throw"webglCanvas.js must be included to use this feature";this.gl=this.ctx=enableWebGLCanvas(this.canvas);
-this.ctx.webgl=!0;this.bgcanvas=this.canvas;this.bgctx=this.gl};h.prototype.setDirty=function(a,b){a&&(this.dirty_canvas=!0);b&&(this.dirty_bgcanvas=!0)};h.prototype.getCanvasWindow=function(){if(!this.canvas)return window;var a=this.canvas.ownerDocument;return a.defaultView||a.parentWindow};h.prototype.startRendering=function(){function a(){this.pause_rendering||this.draw();var b=this.getCanvasWindow();this.is_rendering&&b.requestAnimationFrame(a.bind(this))}this.is_rendering||(this.is_rendering=
-!0,a.call(this))};h.prototype.stopRendering=function(){this.is_rendering=!1};h.prototype.processMouseDown=function(a){if(this.graph){this.adjustMouseEvent(a);var b=this.getCanvasWindow();h.active_canvas=this;this.canvas.removeEventListener("mousemove",this._mousemove_callback);b.document.addEventListener("mousemove",this._mousemove_callback,!0);b.document.addEventListener("mouseup",this._mouseup_callback,!0);var d=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes),c=!1;l.closeAllContextMenus(b);
-if(1==a.which){a.ctrlKey&&(this.dragging_rectangle=new Float32Array(4),this.dragging_rectangle[0]=a.canvasX,this.dragging_rectangle[1]=a.canvasY,this.dragging_rectangle[2]=1,this.dragging_rectangle[3]=1,c=!0);var f=!1;if(d&&this.allow_interaction&&!c){this.live_mode||d.flags.pinned||this.bringToFront(d);if(!this.connecting_node&&!d.flags.collapsed&&!this.live_mode){if(d.outputs)for(var n=0,k=d.outputs.length;n<k;++n){var e=d.outputs[n],g=d.getConnectionPos(!1,n);if(p(a.canvasX,a.canvasY,g[0]-10,g[1]-
-5,20,10)){this.connecting_node=d;this.connecting_output=e;this.connecting_pos=d.getConnectionPos(!1,n);this.connecting_slot=n;c=!0;break}}if(d.inputs)for(n=0,k=d.inputs.length;n<k;++n)e=d.inputs[n],g=d.getConnectionPos(!0,n),p(a.canvasX,a.canvasY,g[0]-10,g[1]-5,20,10)&&null!==e.link&&(d.disconnectInput(n),c=this.dirty_bgcanvas=!0);!c&&p(a.canvasX,a.canvasY,d.pos[0]+d.size[0]-5,d.pos[1]+d.size[1]-5,5,5)&&(this.resizing_node=d,this.canvas.style.cursor="se-resize",c=!0)}!c&&p(a.canvasX,a.canvasY,d.pos[0],
-d.pos[1]-l.NODE_TITLE_HEIGHT,l.NODE_TITLE_HEIGHT,l.NODE_TITLE_HEIGHT)&&(d.collapse(),c=!0);if(!c){n=!1;if(300>l.getTime()-this.last_mouseclick&&this.selected_nodes[d.id]){if(d.onDblClick)d.onDblClick(a);this.processNodeDblClicked(d);n=!0}d.onMouseDown&&d.onMouseDown(a,[a.canvasX-d.pos[0],a.canvasY-d.pos[1]])?n=!0:this.live_mode&&(n=f=!0);n||(this.allow_dragnodes&&(this.node_dragged=d),this.selected_nodes[d.id]||this.processNodeSelected(d,a));this.dirty_canvas=!0}}else f=!0;!c&&f&&this.allow_dragcanvas&&
-(this.dragging_canvas=!0)}else 2!=a.which&&3==a.which&&this.processContextMenu(d,a);this.last_mouse[0]=a.localX;this.last_mouse[1]=a.localY;this.last_mouseclick=l.getTime();this.canvas_mouse=[a.canvasX,a.canvasY];this.graph.change();(!b.document.activeElement||"input"!=b.document.activeElement.nodeName.toLowerCase()&&"textarea"!=b.document.activeElement.nodeName.toLowerCase())&&a.preventDefault();a.stopPropagation();if(this.onMouseDown)this.onMouseDown(a);return!1}};h.prototype.processMouseMove=function(a){this.autoresize&&
-this.resize();if(this.graph){h.active_canvas=this;this.adjustMouseEvent(a);var b=[a.localX,a.localY],d=[b[0]-this.last_mouse[0],b[1]-this.last_mouse[1]];this.last_mouse=b;this.canvas_mouse=[a.canvasX,a.canvasY];if(this.dragging_rectangle)this.dragging_rectangle[2]=a.canvasX-this.dragging_rectangle[0],this.dragging_rectangle[3]=a.canvasY-this.dragging_rectangle[1],this.dirty_canvas=!0;else if(this.dragging_canvas)this.offset[0]+=d[0]/this.scale,this.offset[1]+=d[1]/this.scale,this.dirty_bgcanvas=this.dirty_canvas=
-!0;else if(this.allow_interaction){this.connecting_node&&(this.dirty_canvas=!0);for(var b=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes),c=0,f=this.graph._nodes.length;c<f;++c)if(this.graph._nodes[c].mouseOver&&b!=this.graph._nodes[c]){this.graph._nodes[c].mouseOver=!1;if(this.node_over&&this.node_over.onMouseLeave)this.node_over.onMouseLeave(a);this.node_over=null;this.dirty_canvas=!0}if(b){if(!b.mouseOver&&(b.mouseOver=!0,this.node_over=b,this.dirty_canvas=!0,b.onMouseEnter))b.onMouseEnter(a);
-if(b.onMouseMove)b.onMouseMove(a);if(this.connecting_node&&(f=this._highlight_input||[0,0],!this.isOverNodeBox(b,a.canvasX,a.canvasY))){var n=this.isOverNodeInput(b,a.canvasX,a.canvasY,f);-1!=n&&b.inputs[n]?l.isValidConnection(this.connecting_output.type,b.inputs[n].type)&&(this._highlight_input=f):this._highlight_input=null}p(a.canvasX,a.canvasY,b.pos[0]+b.size[0]-5,b.pos[1]+b.size[1]-5,5,5)?this.canvas.style.cursor="se-resize":this.canvas.style.cursor=null}else this.canvas.style.cursor=null;if(this.node_capturing_input&&
-this.node_capturing_input!=b&&this.node_capturing_input.onMouseMove)this.node_capturing_input.onMouseMove(a);if(this.node_dragged&&!this.live_mode){for(c in this.selected_nodes)b=this.selected_nodes[c],b.pos[0]+=d[0]/this.scale,b.pos[1]+=d[1]/this.scale;this.dirty_bgcanvas=this.dirty_canvas=!0}this.resizing_node&&!this.live_mode&&(this.resizing_node.size[0]+=d[0]/this.scale,this.resizing_node.size[1]+=d[1]/this.scale,d=Math.max(this.resizing_node.inputs?this.resizing_node.inputs.length:0,this.resizing_node.outputs?
-this.resizing_node.outputs.length:0),this.resizing_node.size[1]<d*l.NODE_SLOT_HEIGHT+4&&(this.resizing_node.size[1]=d*l.NODE_SLOT_HEIGHT+4),this.resizing_node.size[0]<l.NODE_MIN_WIDTH&&(this.resizing_node.size[0]=l.NODE_MIN_WIDTH),this.canvas.style.cursor="se-resize",this.dirty_bgcanvas=this.dirty_canvas=!0)}a.preventDefault();return!1}};h.prototype.processMouseUp=function(a){if(this.graph){var b=this.getCanvasWindow().document;h.active_canvas=this;b.removeEventListener("mousemove",this._mousemove_callback,
-!0);this.canvas.addEventListener("mousemove",this._mousemove_callback,!0);b.removeEventListener("mouseup",this._mouseup_callback,!0);this.adjustMouseEvent(a);b=l.getTime();a.click_time=b-this.last_mouseclick;if(1==a.which)if(this.dragging_rectangle){if(this.graph){var d=this.graph._nodes,c=new Float32Array(4);this.deselectAllNodes();0>this.dragging_rectangle[2]&&(this.dragging_rectangle[0]+=this.dragging_rectangle[2]);0>this.dragging_rectangle[3]&&(this.dragging_rectangle[1]+=this.dragging_rectangle[3]);
-this.dragging_rectangle[2]=Math.abs(this.dragging_rectangle[2]*this.scale);this.dragging_rectangle[3]=Math.abs(this.dragging_rectangle[3]*this.scale);for(var f=0;f<d.length;++f)b=d[f],b.getBounding(c),q(this.dragging_rectangle,c)&&this.selectNode(b,!0)}this.dragging_rectangle=null}else if(this.connecting_node){this.dirty_bgcanvas=this.dirty_canvas=!0;if(b=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes))this.connecting_output.type==l.EVENT&&this.isOverNodeBox(b,a.canvasX,a.canvasY)?
-this.connecting_node.connect(this.connecting_slot,b,l.EVENT):(d=this.isOverNodeInput(b,a.canvasX,a.canvasY),-1!=d?this.connecting_node.connect(this.connecting_slot,b,d):(d=b.getInputInfo(0),this.connecting_output.type==l.EVENT?this.connecting_node.connect(this.connecting_slot,b,l.EVENT):d&&!d.link&&l.isValidConnection(d.type&&this.connecting_output.type)&&this.connecting_node.connect(this.connecting_slot,b,0)));this.connecting_node=this.connecting_pos=this.connecting_output=null;this.connecting_slot=
--1}else if(this.resizing_node)this.dirty_bgcanvas=this.dirty_canvas=!0,this.resizing_node=null;else if(this.node_dragged)this.dirty_bgcanvas=this.dirty_canvas=!0,this.node_dragged.pos[0]=Math.round(this.node_dragged.pos[0]),this.node_dragged.pos[1]=Math.round(this.node_dragged.pos[1]),this.graph.config.align_to_grid&&this.node_dragged.alignToGrid(),this.node_dragged=null;else{b=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes);!b&&300>a.click_time&&this.deselectAllNodes();this.dirty_canvas=
-!0;this.dragging_canvas=!1;if(this.node_over&&this.node_over.onMouseUp)this.node_over.onMouseUp(a,[a.canvasX-this.node_over.pos[0],a.canvasY-this.node_over.pos[1]]);if(this.node_capturing_input&&this.node_capturing_input.onMouseUp)this.node_capturing_input.onMouseUp(a,[a.canvasX-this.node_capturing_input.pos[0],a.canvasY-this.node_capturing_input.pos[1]])}else 2==a.which?(this.dirty_canvas=!0,this.dragging_canvas=!1):3==a.which&&(this.dirty_canvas=!0,this.dragging_canvas=!1);this.graph.change();a.stopPropagation();
-a.preventDefault();return!1}};h.prototype.processMouseWheel=function(a){if(this.graph&&this.allow_dragcanvas){var b=null!=a.wheelDeltaY?a.wheelDeltaY:-60*a.detail;this.adjustMouseEvent(a);var d=this.scale;0<b?d*=1.1:0>b&&(d*=1/1.1);this.setZoom(d,[a.localX,a.localY]);this.graph.change();a.preventDefault();return!1}};h.prototype.isOverNodeBox=function(a,b,d){var c=l.NODE_TITLE_HEIGHT;return p(b,d,a.pos[0]+2,a.pos[1]+2-c,c-4,c-4)?!0:!1};h.prototype.isOverNodeInput=function(a,b,d,c){if(a.inputs)for(var f=
-0,n=a.inputs.length;f<n;++f){var k=a.getConnectionPos(!0,f);if(p(b,d,k[0]-10,k[1]-5,20,10))return c&&(c[0]=k[0],c[1]=k[1]),f}return-1};h.prototype.processKey=function(a){if(this.graph){var b=!1;if("input"!=a.target.localName){if("keydown"==a.type){32==a.keyCode&&(b=this.dragging_canvas=!0);65==a.keyCode&&a.ctrlKey&&(this.selectNodes(),b=!0);"KeyC"==a.code&&(a.metaKey||a.ctrlKey)&&!a.shiftKey&&this.selected_nodes&&(this.copyToClipboard(),b=!0);"KeyV"!=a.code||!a.metaKey&&!a.ctrlKey||a.shiftKey||this.pasteFromClipboard();
-if(46==a.keyCode||8==a.keyCode)this.deleteSelectedNodes(),b=!0;if(this.selected_nodes)for(var d in this.selected_nodes)if(this.selected_nodes[d].onKeyDown)this.selected_nodes[d].onKeyDown(a)}else if("keyup"==a.type&&(32==a.keyCode&&(this.dragging_canvas=!1),this.selected_nodes))for(d in this.selected_nodes)if(this.selected_nodes[d].onKeyUp)this.selected_nodes[d].onKeyUp(a);this.graph.change();if(b)return a.preventDefault(),!1}}};h.prototype.copyToClipboard=function(){var a={nodes:[],links:[]},b=0,
-d=[],c;for(c in this.selected_nodes){var f=this.selected_nodes[c];f._relative_id=b;d.push(f);b+=1}for(c=0;c<d.length;++c)if(f=d[c],a.nodes.push(f.clone().serialize()),f.inputs&&f.inputs.length)for(b=0;b<f.inputs.length;++b){var n=f.inputs[b];if(n&&null!=n.link&&(n=this.graph.links[n.link])){var k=this.graph.getNodeById(n.origin_id);k&&this.selected_nodes[k.id]&&a.links.push([k._relative_id,b,f._relative_id,n.target_slot])}}localStorage.setItem("litegrapheditor_clipboard",JSON.stringify(a))};h.prototype.pasteFromClipboard=
-function(){var a=localStorage.getItem("litegrapheditor_clipboard");if(a){for(var a=JSON.parse(a),b=[],d=0;d<a.nodes.length;++d){var c=a.nodes[d],f=l.createNode(c.type);f&&(f.configure(c),f.pos[0]+=5,f.pos[1]+=5,this.graph.add(f),b.push(f))}for(d=0;d<a.links.length;++d)c=a.links[d],b[c[0]].connect(c[1],b[c[2]],c[3]);this.selectNodes(b)}};h.prototype.processDrop=function(a){a.preventDefault();this.adjustMouseEvent(a);var b=[a.canvasX,a.canvasY],d=this.graph.getNodeOnPos(b[0],b[1]);if(d){if((d.onDropFile||
-d.onDropData)&&(b=a.dataTransfer.files)&&b.length)for(var c=0;c<b.length;c++){var f=a.dataTransfer.files[0],n=f.name;h.getFileExtension(n);if(d.onDropFile)d.onDropFile(f);if(d.onDropData){var k=new FileReader;k.onload=function(a){d.onDropData(a.target.result,n,f)};var e=f.type.split("/")[0];"text"==e||""==e?k.readAsText(f):"image"==e?k.readAsDataURL(f):k.readAsArrayBuffer(f)}}return d.onDropItem&&d.onDropItem(event)?!0:this.onDropItem?this.onDropItem(event):!1}b=null;this.onDropItem&&(b=this.onDropItem(event));
-b||this.checkDropItem(a)};h.prototype.checkDropItem=function(a){if(a.dataTransfer.files.length){var b=a.dataTransfer.files[0],d=h.getFileExtension(b.name).toLowerCase();if(d=l.node_types_by_file_extension[d])if(d=l.createNode(d.type),d.pos=[a.canvasX,a.canvasY],this.graph.add(d),d.onDropFile)d.onDropFile(b)}};h.prototype.processNodeDblClicked=function(a){if(this.onShowNodePanel)this.onShowNodePanel(a);if(this.onNodeDblClicked)this.onNodeDblClicked(a);this.setDirty(!0)};h.prototype.processNodeSelected=
-function(a,b){this.selectNode(a,b&&b.shiftKey);if(this.onNodeSelected)this.onNodeSelected(a)};h.prototype.processNodeDeselected=function(a){this.deselectNode(a);if(this.onNodeDeselected)this.onNodeDeselected(a)};h.prototype.selectNode=function(a,b){null==a?this.deselectAllNodes():this.selectNodes([a],b)};h.prototype.selectNodes=function(a,b){b||this.deselectAllNodes();a=a||this.graph._nodes;for(var d=0;d<a.length;++d){var c=a[d];if(!c.selected){if(!c.selected&&c.onSelected)c.onSelected();c.selected=
-!0;this.selected_nodes[c.id]=c;if(c.inputs)for(d=0;d<c.inputs.length;++d)this.highlighted_links[c.inputs[d].link]=!0;if(c.outputs)for(d=0;d<c.outputs.length;++d){var f=c.outputs[d];if(f.links)for(var e=0;e<f.links.length;++e)this.highlighted_links[f.links[e]]=!0}}}this.setDirty(!0)};h.prototype.deselectNode=function(a){if(a.selected){if(a.onDeselected)a.onDeselected();a.selected=!1;if(a.inputs)for(var b=0;b<a.inputs.length;++b)delete this.highlighted_links[a.inputs[b].link];if(a.outputs)for(b=0;b<
-a.outputs.length;++b){var d=a.outputs[b];if(d.links)for(var c=0;c<d.links.length;++c)delete this.highlighted_links[d.links[c]]}}};h.prototype.deselectAllNodes=function(){if(this.graph){for(var a=this.graph._nodes,b=0,d=a.length;b<d;++b){var c=a[b];if(c.selected){if(c.onDeselected)c.onDeselected();c.selected=!1}}this.selected_nodes={};this.highlighted_links={};this.setDirty(!0)}};h.prototype.deleteSelectedNodes=function(){for(var a in this.selected_nodes)this.graph.remove(this.selected_nodes[a]);this.selected_nodes=
-{};this.highlighted_links={};this.setDirty(!0)};h.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)};h.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]};h.prototype.setZoom=function(a,
-b){b||(b=[0.5*this.canvas.width,0.5*this.canvas.height]);var d=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 c=this.convertOffsetToCanvas(b),d=[c[0]-d[0],c[1]-d[1]];this.offset[0]+=d[0];this.offset[1]+=d[1];this.dirty_bgcanvas=this.dirty_canvas=!0};h.prototype.convertOffsetToCanvas=function(a,b){b=b||[];b[0]=a[0]/this.scale-this.offset[0];b[1]=a[1]/this.scale-this.offset[1];return b};h.prototype.convertCanvasToOffset=
-function(a,b){b=b||[];b[0]=(a[0]+this.offset[0])*this.scale;b[1]=(a[1]+this.offset[1])*this.scale;return b};h.prototype.convertEventToCanvas=function(a){var b=this.canvas.getBoundingClientRect();return this.convertOffsetToCanvas([a.pageX-b.left,a.pageY-b.top])};h.prototype.bringToFront=function(a){var b=this.graph._nodes.indexOf(a);-1!=b&&(this.graph._nodes.splice(b,1),this.graph._nodes.push(a))};h.prototype.sendToBack=function(a){var b=this.graph._nodes.indexOf(a);-1!=b&&(this.graph._nodes.splice(b,
-1),this.graph._nodes.unshift(a))};var s=new Float32Array(4);h.prototype.computeVisibleNodes=function(a,b){var d=b||[];d.length=0;a=a||this.graph._nodes;for(var c=0,f=a.length;c<f;++c){var e=a[c];(!this.live_mode||e.onDrawBackground||e.onDrawForeground)&&q(this.visible_area,e.getBounding(s))&&d.push(e)}return d};h.prototype.draw=function(a,b){if(this.canvas){var d=l.getTime();this.render_time=0.001*(d-this.last_draw_time);this.last_draw_time=d;if(this.graph){var c=[-this.offset[0],-this.offset[1]],
-f=[c[0]+this.canvas.width/this.scale,c[1]+this.canvas.height/this.scale];this.visible_area=new Float32Array([c[0],c[1],f[0]-c[0],f[1]-c[1]])}(this.dirty_bgcanvas||b||this.always_render_background||this.graph&&this.graph._last_trigger_time&&1E3>d-this.graph._last_trigger_time)&&this.drawBackCanvas();(this.dirty_canvas||a)&&this.drawFrontCanvas();this.fps=this.render_time?1/this.render_time:0;this.frame+=1}};h.prototype.drawFrontCanvas=function(){this.ctx||(this.ctx=this.bgcanvas.getContext("2d"));
-var a=this.ctx;if(a){a.start2D&&a.start2D();var b=this.canvas;a.restore();a.setTransform(1,0,0,1,0,0);this.dirty_area&&(a.save(),a.beginPath(),a.rect(this.dirty_area[0],this.dirty_area[1],this.dirty_area[2],this.dirty_area[3]),a.clip());this.clear_background&&a.clearRect(0,0,b.width,b.height);this.bgcanvas==this.canvas?this.drawBackCanvas():a.drawImage(this.bgcanvas,0,0);if(this.onRender)this.onRender(b,a);this.show_info&&this.renderInfo(a);if(this.graph){a.save();a.scale(this.scale,this.scale);a.translate(this.offset[0],
-this.offset[1]);for(var b=this.computeVisibleNodes(null,this.visible_nodes),d=0;d<b.length;++d){var c=b[d];a.save();a.translate(c.pos[0],c.pos[1]);this.drawNode(c,a);a.restore()}this.graph.config.links_ontop&&(this.live_mode||this.drawConnections(a));if(null!=this.connecting_pos){a.lineWidth=this.connections_width;b=null;switch(this.connecting_output.type){case l.EVENT:b="#F85";break;default:b="#AFA"}this.renderLink(a,this.connecting_pos,[this.canvas_mouse[0],this.canvas_mouse[1]],null,!1,null,b);
-a.beginPath();this.connecting_output.type===l.EVENT?a.rect(this.connecting_pos[0]-6+0.5,this.connecting_pos[1]-5+0.5,14,10):a.arc(this.connecting_pos[0],this.connecting_pos[1],4,0,2*Math.PI);a.fill();a.fillStyle="#ffcc00";this._highlight_input&&(a.beginPath(),a.arc(this._highlight_input[0],this._highlight_input[1],6,0,2*Math.PI),a.fill())}this.dragging_rectangle&&(a.strokeStyle="#FFF",a.strokeRect(this.dragging_rectangle[0],this.dragging_rectangle[1],this.dragging_rectangle[2],this.dragging_rectangle[3]));
-a.restore()}this.dirty_area&&a.restore();a.finish2D&&a.finish2D();this.dirty_canvas=!1}};h.prototype.renderInfo=function(a,b,d){b=b||0;d=d||0;a.save();a.translate(b,d);a.font="10px Arial";a.fillStyle="#888";this.graph?(a.fillText("T: "+this.graph.globaltime.toFixed(2)+"s",5,13),a.fillText("I: "+this.graph.iteration,5,26),a.fillText("F: "+this.frame,5,39),a.fillText("FPS:"+this.fps.toFixed(2),5,52)):a.fillText("No graph selected",5,13);a.restore()};h.prototype.drawBackCanvas=function(){var a=this.bgcanvas;
-if(a.width!=this.canvas.width||a.height!=this.canvas.height)a.width=this.canvas.width,a.height=this.canvas.height;this.bgctx||(this.bgctx=this.bgcanvas.getContext("2d"));var b=this.bgctx;b.start&&b.start();this.clear_background&&b.clearRect(0,0,a.width,a.height);this._graph_stack&&this._graph_stack.length&&(b.strokeStyle=this._graph_stack[this._graph_stack.length-1].bgcolor,b.lineWidth=10,b.strokeRect(1,1,a.width-2,a.height-2),b.lineWidth=1);b.restore();b.setTransform(1,0,0,1,0,0);if(this.graph){b.save();
-b.scale(this.scale,this.scale);b.translate(this.offset[0],this.offset[1]);if(this.background_image&&0.5<this.scale){b.globalAlpha=this.zoom_modify_alpha?(1-0.5/this.scale)*this.editor_alpha:this.editor_alpha;b.imageSmoothingEnabled=b.mozImageSmoothingEnabled=b.imageSmoothingEnabled=!1;if(!this._bg_img||this._bg_img.name!=this.background_image){this._bg_img=new Image;this._bg_img.name=this.background_image;this._bg_img.src=this.background_image;var d=this;this._bg_img.onload=function(){d.draw(!0,!0)}}var c=
-null;null==this._pattern&&0<this._bg_img.width?(c=b.createPattern(this._bg_img,"repeat"),this._pattern_img=this._bg_img,this._pattern=c):c=this._pattern;c&&(b.fillStyle=c,b.fillRect(this.visible_area[0],this.visible_area[1],this.visible_area[2],this.visible_area[3]),b.fillStyle="transparent");b.globalAlpha=1;b.imageSmoothingEnabled=b.mozImageSmoothingEnabled=b.imageSmoothingEnabled=!0}if(this.onBackgroundRender)this.onBackgroundRender(a,b);this.render_canvas_border&&(b.strokeStyle="#235",b.strokeRect(0,
-0,a.width,a.height));this.render_connections_shadows?(b.shadowColor="#000",b.shadowOffsetX=0,b.shadowOffsetY=0,b.shadowBlur=6):b.shadowColor="rgba(0,0,0,0)";this.live_mode||this.drawConnections(b);b.shadowColor="rgba(0,0,0,0)";b.restore()}b.finish&&b.finish();this.dirty_bgcanvas=!1;this.dirty_canvas=!0};var c=new Float32Array(2);h.prototype.drawNode=function(a,b){var d=a.color||l.NODE_DEFAULT_COLOR,e=!0;if(a.flags.skip_title_render||a.graph.isLive())e=!1;a.mouseOver&&(e=!0);a.selected||(this.render_shadows?
-(b.shadowColor="rgba(0,0,0,0.5)",b.shadowOffsetX=2,b.shadowOffsetY=2,b.shadowBlur=3):b.shadowColor="transparent");if(this.live_mode){if(!a.flags.collapsed&&(b.shadowColor="transparent",a.onDrawForeground))a.onDrawForeground(b)}else{var f=this.editor_alpha;b.globalAlpha=f;var n=a._shape||l.BOX_SHAPE;c.set(a.size);a.flags.collapsed&&(c[0]=l.NODE_COLLAPSED_WIDTH,c[1]=0);a.flags.clip_area&&(b.save(),n==l.BOX_SHAPE?(b.beginPath(),b.rect(0,0,c[0],c[1])):n==l.ROUND_SHAPE?b.roundRect(0,0,c[0],c[1],10):n==
-l.CIRCLE_SHAPE&&(b.beginPath(),b.arc(0.5*c[0],0.5*c[1],0.5*c[0],0,2*Math.PI)),b.clip());this.drawNodeShape(a,b,c,d,a.bgcolor,!e,a.selected);b.shadowColor="transparent";b.textAlign="left";b.font=this.inner_text_font;e=0.6<this.scale;n=this.connecting_output;if(!a.flags.collapsed){if(a.inputs)for(var k=0;k<a.inputs.length;k++){var h=a.inputs[k];b.globalAlpha=f;this.connecting_node&&l.isValidConnection(h.type&&n.type)&&(b.globalAlpha=0.4*f);b.fillStyle=null!=h.link?this.default_connection_color.input_on:
-this.default_connection_color.input_off;var g=a.getConnectionPos(!0,k);g[0]-=a.pos[0];g[1]-=a.pos[1];b.beginPath();h.type===l.EVENT?b.rect(g[0]-6+0.5,g[1]-5+0.5,14,10):b.arc(g[0],g[1],4,0,2*Math.PI);b.fill();e&&(h=null!=h.label?h.label:h.name)&&(b.fillStyle=d,b.fillText(h,g[0]+10,g[1]+5))}this.connecting_node&&(b.globalAlpha=0.4*f);b.lineWidth=1;b.textAlign="right";b.strokeStyle="black";if(a.outputs)for(k=0;k<a.outputs.length;k++)if(h=a.outputs[k],g=a.getConnectionPos(!1,k),g[0]-=a.pos[0],g[1]-=a.pos[1],
-b.fillStyle=h.links&&h.links.length?this.default_connection_color.output_on:this.default_connection_color.output_off,b.beginPath(),h.type===l.EVENT?b.rect(g[0]-6+0.5,g[1]-5+0.5,14,10):b.arc(g[0],g[1],4,0,2*Math.PI),b.fill(),b.stroke(),e&&(h=null!=h.label?h.label:h.name))b.fillStyle=d,b.fillText(h,g[0]-10,g[1]+5);b.textAlign="left";b.globalAlpha=1;if(a.onDrawForeground)a.onDrawForeground(b)}a.flags.clip_area&&b.restore();b.globalAlpha=1}};h.prototype.drawNodeShape=function(a,b,d,c,f,e,k){b.strokeStyle=
-c||l.NODE_DEFAULT_COLOR;b.fillStyle=f||l.NODE_DEFAULT_BGCOLOR;f=l.NODE_TITLE_HEIGHT;var h=a._shape||l.BOX_SHAPE;h==l.BOX_SHAPE?(b.beginPath(),b.rect(0,e?0:-f,d[0]+1,e?d[1]:d[1]+f),b.fill(),b.shadowColor="transparent",k&&(b.strokeStyle="#CCC",b.strokeRect(-0.5,e?-0.5:-f+-0.5,d[0]+2,e?d[1]+2:d[1]+f+2-1),b.strokeStyle=c)):h==l.ROUND_SHAPE?(b.roundRect(0,e?0:-f,d[0],e?d[1]:d[1]+f,10),b.fill()):h==l.CIRCLE_SHAPE&&(b.beginPath(),b.arc(0.5*d[0],0.5*d[1],0.5*d[0],0,2*Math.PI),b.fill());b.shadowColor="transparent";
-a.bgImage&&a.bgImage.width&&b.drawImage(a.bgImage,0.5*(d[0]-a.bgImage.width),0.5*(d[1]-a.bgImage.height));a.bgImageUrl&&!a.bgImage&&(a.bgImage=a.loadImage(a.bgImageUrl));if(a.onDrawBackground)a.onDrawBackground(b);e||(b.fillStyle=c||l.NODE_DEFAULT_COLOR,c=b.globalAlpha,b.globalAlpha=0.5*c,h==l.BOX_SHAPE?(b.beginPath(),b.rect(0,-f,d[0]+1,f),b.fill()):h==l.ROUND_SHAPE&&(b.roundRect(0,-f,d[0],f,10,0),b.fill()),b.fillStyle=a.boxcolor||l.NODE_DEFAULT_BOXCOLOR,b.beginPath(),h==l.ROUND_SHAPE||h==l.CIRCLE_SHAPE?
-b.arc(0.5*f,-0.5*f,0.5*(f-6),0,2*Math.PI):b.rect(3,-f+3,f-6,f-6),b.fill(),b.globalAlpha=c,b.font=this.title_text_font,(a=a.getTitle())&&0.5<this.scale&&(b.fillStyle=this.node_title_color,b.fillText(a,16,13-f)))};h.prototype.drawNodeCollapsed=function(a,b,c,e){b.strokeStyle=c||l.NODE_DEFAULT_COLOR;b.fillStyle=e||l.NODE_DEFAULT_BGCOLOR;c=l.NODE_COLLAPSED_RADIUS;e=a._shape||l.BOX_SHAPE;e==l.CIRCLE_SHAPE?(b.beginPath(),b.arc(0.5*a.size[0],0.5*a.size[1],c,0,2*Math.PI),b.fill(),b.shadowColor="rgba(0,0,0,0)",
-b.stroke(),b.fillStyle=a.boxcolor||l.NODE_DEFAULT_BOXCOLOR,b.beginPath(),b.arc(0.5*a.size[0],0.5*a.size[1],0.5*c,0,2*Math.PI)):e==l.ROUND_SHAPE?(b.beginPath(),b.roundRect(0.5*a.size[0]-c,0.5*a.size[1]-c,2*c,2*c,5),b.fill(),b.shadowColor="rgba(0,0,0,0)",b.stroke(),b.fillStyle=a.boxcolor||l.NODE_DEFAULT_BOXCOLOR,b.beginPath(),b.roundRect(0.5*a.size[0]-0.5*c,0.5*a.size[1]-0.5*c,c,c,2)):(b.beginPath(),b.rect(0,0,a.size[0],2*c),b.fill(),b.shadowColor="rgba(0,0,0,0)",b.stroke(),b.fillStyle=a.boxcolor||
-l.NODE_DEFAULT_BOXCOLOR,b.beginPath(),b.rect(0.5*c,0.5*c,c,c));b.fill()};h.prototype.drawConnections=function(a){var b=l.getTime();a.lineWidth=this.connections_width;a.fillStyle="#AAA";a.strokeStyle="#AAA";a.globalAlpha=this.editor_alpha;for(var c=0,e=this.graph._nodes.length;c<e;++c){var f=this.graph._nodes[c];if(f.inputs&&f.inputs.length)for(var h=0;h<f.inputs.length;++h){var k=f.inputs[h];if(k&&null!=k.link&&(k=this.graph.links[k.link])){var g=this.graph.getNodeById(k.origin_id);if(null!=g){var m=
-k.origin_slot,p=null,p=-1==m?[g.pos[0]+10,g.pos[1]+10]:g.getConnectionPos(!1,m);this.renderLink(a,p,f.getConnectionPos(!0,h),k);k&&k._last_time&&1E3>b-k._last_time&&(g=2-0.002*(b-k._last_time),m="rgba(255,255,255, "+g.toFixed(2)+")",this.renderLink(a,p,f.getConnectionPos(!0,h),k,!0,g,m))}}}}a.globalAlpha=1};h.prototype.renderLink=function(a,b,c,e,f,g,k){if(this.highquality_render){var t=m(b,c);this.render_connections_border&&0.6<this.scale&&(a.lineWidth=this.connections_width+4);!k&&e&&(k=h.link_type_colors[e.type]);
-k||(k=this.default_link_color);null!=e&&this.highlighted_links[e.id]&&(k="#FFF");a.beginPath();this.render_curved_connections?(a.moveTo(b[0],b[1]),a.bezierCurveTo(b[0]+0.25*t,b[1],c[0]-0.25*t,c[1],c[0],c[1])):(a.moveTo(b[0]+10,b[1]),a.lineTo(0.5*(b[0]+10+(c[0]-10)),b[1]),a.lineTo(0.5*(b[0]+10+(c[0]-10)),c[1]),a.lineTo(c[0]-10,c[1]));this.render_connections_border&&0.6<this.scale&&!f&&(a.strokeStyle="rgba(0,0,0,0.5)",a.stroke());a.lineWidth=this.connections_width;a.fillStyle=a.strokeStyle=k;a.stroke();
-this.render_connection_arrows&&0.6<=this.scale&&this.render_connection_arrows&&0.6<this.scale&&(e=this.computeConnectionPoint(b,c,0.5),f=this.computeConnectionPoint(b,c,0.51),k=0,k=this.render_curved_connections?-Math.atan2(f[0]-e[0],f[1]-e[1]):c[1]>b[1]?0:Math.PI,a.save(),a.translate(e[0],e[1]),a.rotate(k),a.beginPath(),a.moveTo(-5,-5),a.lineTo(0,5),a.lineTo(5,-5),a.fill(),a.restore());if(g)for(g=0;5>g;++g)e=(0.001*l.getTime()+0.2*g)%1,e=this.computeConnectionPoint(b,c,e),a.beginPath(),a.arc(e[0],
-e[1],5,0,2*Math.PI),a.fill()}else a.beginPath(),a.moveTo(b[0],b[1]),a.lineTo(c[0],c[1]),a.stroke()};h.prototype.computeConnectionPoint=function(a,b,c){var e=m(a,b),f=[a[0]+0.25*e,a[1]],e=[b[0]-0.25*e,b[1]],h=(1-c)*(1-c)*(1-c),k=3*(1-c)*(1-c)*c,g=3*(1-c)*c*c;c*=c*c;return[h*a[0]+k*f[0]+g*e[0]+c*b[0],h*a[1]+k*f[1]+g*e[1]+c*b[1]]};h.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)};h.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 e=setInterval(function(){b.editor_alpha*=c;b.dirty_canvas=!0;b.dirty_bgcanvas=!0;1>c&&0.01>b.editor_alpha&&(clearInterval(e),1>c&&(b.live_mode=!0));1<c&&0.99<b.editor_alpha&&(clearInterval(e),b.editor_alpha=1)},1)}else this.live_mode=!this.live_mode,
-this.dirty_bgcanvas=this.dirty_canvas=!0};h.prototype.onNodeSelectionChange=function(a){};h.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 e=this.getCanvasWindow(),f=e.document.createEvent("MouseEvent");f.initMouseEvent(c,!0,!0,e,1,b.screenX,b.screenY,b.clientX,b.clientY,!1,!1,!1,!1,0,null);b.target.dispatchEvent(f);a.preventDefault()};h.onMenuAdd=
-function(a,b,c,e){function f(a,b){var c=e.getFirstEvent(),d=l.createNode(a.value);d&&(d.pos=g.convertEventToCanvas(c),g.graph.add(d))}var g=h.active_canvas,k=g.getCanvasWindow();a=l.getNodeTypesCategories();b=[];for(var m in a)a[m]&&b.push({value:a[m],content:a[m],has_submenu:!0});var p=new l.ContextMenu(b,{event:c,callback:function(a,b,c){a=l.getNodeTypesInCategory(a.value);b=[];for(var d in a)b.push({content:a[d].title,value:a[d].type});new l.ContextMenu(b,{event:c,callback:f,parentMenu:p},k);return!1},
-parentMenu:e},k);return!1};h.onMenuCollapseAll=function(){};h.onMenuNodeEdit=function(){};h.showMenuNodeOptionalInputs=function(a,b,c,e,f){function g(a,b,c){f&&(a.callback&&a.callback.call(k,f,a,b,c),a.value&&(f.addInput(a.value[0],a.value[1],a.value[2]),f.setDirtyCanvas(!0,!0)))}if(f){var k=this;a=h.active_canvas.getCanvasWindow();b=f.optional_inputs;f.onGetInputs&&(b=f.onGetInputs());var m=[];if(b)for(var p in b){var q=b[p];if(q){var r=q[0];q[2]&&q[2].label&&(r=q[2].label);r={content:r,value:q};
-q[1]==l.ACTION&&(r.className="event");m.push(r)}else m.push(null)}this.onMenuNodeInputs&&(m=this.onMenuNodeInputs(m));if(m.length)return new l.ContextMenu(m,{event:c,callback:g,parentMenu:e,node:f},a),!1}};h.showMenuNodeOptionalOutputs=function(a,b,c,e,f){function g(a,b,c){if(f&&(a.callback&&a.callback.call(k,f,a,b,c),a.value))if(c=a.value[1],!c||c.constructor!==Object&&c.constructor!==Array)f.addOutput(a.value[0],a.value[1],a.value[2]),f.setDirtyCanvas(!0,!0);else{a=[];for(var d in c)a.push({content:d,
-value:c[d]});new l.ContextMenu(a,{event:b,callback:g,parentMenu:e,node:f});return!1}}if(f){var k=this;a=h.active_canvas.getCanvasWindow();b=f.optional_outputs;f.onGetOutputs&&(b=f.onGetOutputs());var m=[];if(b)for(var p in b){var q=b[p];if(!q)m.push(null);else if(!f.flags||!f.flags.skip_repeated_outputs||-1==f.findOutputSlot(q[0])){var r=q[0];q[2]&&q[2].label&&(r=q[2].label);r={content:r,value:q};q[1]==l.EVENT&&(r.className="event");m.push(r)}}this.onMenuNodeOutputs&&(m=this.onMenuNodeOutputs(m));
-if(m.length)return new l.ContextMenu(m,{event:c,callback:g,parentMenu:e,node:f},a),!1}};h.onShowMenuNodeProperties=function(a,b,c,e,f){function g(a,b,c,d){f&&(b=this.getBoundingClientRect(),k.showEditPropertyValue(f,a.value,{position:[b.left,b.top]}))}if(f&&f.properties){var k=h.active_canvas;b=k.getCanvasWindow();var m=[],p;for(p in f.properties)a=void 0!==f.properties[p]?f.properties[p]:" ",a=h.decodeHTML(a),m.push({content:"<span class='property_name'>"+p+"</span><span class='property_value'>"+
-a+"</span>",value:p});if(m.length)return new l.ContextMenu(m,{event:c,callback:g,parentMenu:e,allow_html:!0,node:f},b),!1}};h.decodeHTML=function(a){var b=document.createElement("div");b.innerText=a;return b.innerHTML};h.onResizeNode=function(a,b,c,e,f){f&&(f.size=f.computeSize(),f.setDirtyCanvas(!0,!0))};h.onShowTitleEditor=function(a,b,c,e,f){function g(){f.title=m.value;k.parentNode.removeChild(k);f.setDirtyCanvas(!0,!0)}var k=document.createElement("div");k.className="graphdialog";k.innerHTML=
-"<span class='name'>Title</span><input autofocus type='text' class='value'/><button>OK</button>";var m=k.querySelector("input");m&&(m.value=f.title,m.addEventListener("keydown",function(a){13==a.keyCode&&(g(),a.preventDefault(),a.stopPropagation())}));a=h.active_canvas.canvas;b=a.getBoundingClientRect();e=c=-20;b&&(c-=b.left,e-=b.top);event?(k.style.left=event.pageX+c+"px",k.style.top=event.pageY+e+"px"):(k.style.left=0.5*a.width+c+"px",k.style.top=0.5*a.height+e+"px");k.querySelector("button").addEventListener("click",
-g);a.parentNode.appendChild(k)};h.prototype.showEditPropertyValue=function(a,b,c){function e(){f(q.value)}function f(c){"number"==typeof a.properties[b]&&(c=Number(c));a.properties[b]=c;if(a.onPropertyChanged)a.onPropertyChanged(b,c);p.close();a.setDirtyCanvas(!0,!0)}if(a&&void 0!==a.properties[b]){c=c||{};var h="string";null!==a.properties[b]&&(h=typeof a.properties[b]);var k=null;a.getPropertyInfo&&(k=a.getPropertyInfo(b));if(a.properties_info)for(var g=0;g<a.properties_info.length;++g)if(a.properties_info[g].name==
-b){k=a.properties_info[g];break}void 0!==k&&null!==k&&k.type&&(h=k.type);var m="";if("string"==h||"number"==h)m="<input autofocus type='text' class='value'/>";else if("enum"==h&&k.values){m="<select autofocus type='text' class='value'>";for(g in k.values)var l=k.values.constructor===Array?k.values[g]:g,m=m+("<option value='"+l+"' "+(l==a.properties[b]?"selected":"")+">"+k.values[g]+"</option>");m+="</select>"}else"boolean"==h&&(m="<input autofocus type='checkbox' class='value' "+(a.properties[b]?
-"checked":"")+"/>");var p=this.createDialog("<span class='name'>"+b+"</span>"+m+"<button>OK</button>",c);if("enum"==h&&k.values){var q=p.querySelector("select");q.addEventListener("change",function(a){f(a.target.value)})}else if("boolean"==h)(q=p.querySelector("input"))&&q.addEventListener("click",function(a){f(!!q.checked)});else if(q=p.querySelector("input"))q.value=void 0!==a.properties[b]?a.properties[b]:"",q.addEventListener("keydown",function(a){13==a.keyCode&&(e(),a.preventDefault(),a.stopPropagation())});
-p.querySelector("button").addEventListener("click",e)}};h.prototype.createDialog=function(a,b){b=b||{};var c=document.createElement("div");c.className="graphdialog";c.innerHTML=a;var e=this.canvas.getBoundingClientRect(),f=-20,h=-20;e&&(f-=e.left,h-=e.top);b.position?(f+=b.position[0],h+=b.position[1]):b.event?(f+=b.event.pageX,h+=b.event.pageY):(f+=0.5*this.canvas.width,h+=0.5*this.canvas.height);c.style.left=f+"px";c.style.top=h+"px";this.canvas.parentNode.appendChild(c);c.close=function(){this.parentNode&&
-this.parentNode.removeChild(this)};return c};h.onMenuNodeCollapse=function(a,b,c,e,f){f.flags.collapsed=!f.flags.collapsed;f.setDirtyCanvas(!0,!0)};h.onMenuNodePin=function(a,b,c,e,f){f.pin()};h.onMenuNodeMode=function(a,b,c,e,f){new l.ContextMenu(["Always","On Event","On Trigger","Never"],{event:c,callback:function(a){if(f)switch(a){case "On Event":f.mode=l.ON_EVENT;break;case "On Trigger":f.mode=l.ON_TRIGGER;break;case "Never":f.mode=l.NEVER;break;default:f.mode=l.ALWAYS}},parentMenu:e,node:f});
-return!1};h.onMenuNodeColors=function(a,b,c,e,f){if(!f)throw"no node for color";b=[];for(var g in h.node_colors)a=h.node_colors[g],a={value:g,content:"<span style='display: block; color:"+a.color+"; background-color:"+a.bgcolor+"'>"+g+"</span>"},b.push(a);new l.ContextMenu(b,{event:c,callback:function(a){f&&(a=h.node_colors[a.value])&&(f.color=a.color,f.bgcolor=a.bgcolor,f.setDirtyCanvas(!0))},parentMenu:e,node:f});return!1};h.onMenuNodeShapes=function(a,b,c,e,f){if(!f)throw"no node passed";new l.ContextMenu(l.VALID_SHAPES,
-{event:c,callback:function(a){f&&(f.shape=a,f.setDirtyCanvas(!0))},parentMenu:e,node:f});return!1};h.onMenuNodeRemove=function(a,b,c,e,f){if(!f)throw"no node passed";!1!=f.removable&&(f.graph.remove(f),f.setDirtyCanvas(!0,!0))};h.onMenuNodeClone=function(a,b,c,e,f){!1!=f.clonable&&(a=f.clone())&&(a.pos=[f.pos[0]+5,f.pos[1]+5],f.graph.add(a),f.setDirtyCanvas(!0,!0))};h.node_colors={red:{color:"#FAA",bgcolor:"#944"},green:{color:"#AFA",bgcolor:"#494"},blue:{color:"#AAF",bgcolor:"#449"},cyan:{color:"#AFF",
-bgcolor:"#499"},purple:{color:"#FAF",bgcolor:"#949"},yellow:{color:"#FFA",bgcolor:"#994"},black:{color:"#777",bgcolor:"#000"},white:{color:"#FFF",bgcolor:"#AAA"}};h.prototype.getCanvasMenuOptions=function(){var a=null;this.getMenuOptions?a=this.getMenuOptions():(a=[{content:"Add Node",has_submenu:!0,callback:h.onMenuAdd}],this._graph_stack&&0<this._graph_stack.length&&(a=[{content:"Close subgraph",callback:this.closeSubgraph.bind(this)},null].concat(a)));if(this.getExtraMenuOptions){var b=this.getExtraMenuOptions(this,
-a);b&&(a=a.concat(b))}return a};h.prototype.getNodeMenuOptions=function(a){var b=null,b=a.getMenuOptions?a.getMenuOptions(this):[{content:"Inputs",has_submenu:!0,disabled:!0,callback:h.showMenuNodeOptionalInputs},{content:"Outputs",has_submenu:!0,disabled:!0,callback:h.showMenuNodeOptionalOutputs},null,{content:"Properties",has_submenu:!0,callback:h.onShowMenuNodeProperties},null,{content:"Title",callback:h.onShowTitleEditor},{content:"Mode",has_submenu:!0,callback:h.onMenuNodeMode},{content:"Resize",
-callback:h.onResizeNode},{content:"Collapse",callback:h.onMenuNodeCollapse},{content:"Pin",callback:h.onMenuNodePin},{content:"Colors",has_submenu:!0,callback:h.onMenuNodeColors},{content:"Shapes",has_submenu:!0,callback:h.onMenuNodeShapes},null];if(a.getExtraMenuOptions){var c=a.getExtraMenuOptions(this);c&&(c.push(null),b=c.concat(b))}!1!==a.clonable&&b.push({content:"Clone",callback:h.onMenuNodeClone});!1!==a.removable&&b.push(null,{content:"Remove",callback:h.onMenuNodeRemove});a.onGetInputs&&
-(c=a.onGetInputs())&&c.length&&(b[0].disabled=!1);a.onGetOutputs&&(c=a.onGetOutputs())&&c.length&&(b[1].disabled=!1);if(a.graph&&a.graph.onGetNodeMenuOptions)a.graph.onGetNodeMenuOptions(b,a);return b};h.prototype.processContextMenu=function(a,b){var c=this,e=h.active_canvas.getCanvasWindow(),f=null,g={event:b,callback:function(b,f,e){if(b)if("Remove Slot"==b.content){var k=b.slot;k.input?a.removeInput(k.slot):k.output&&a.removeOutput(k.slot)}else if("Rename Slot"==b.content){var k=b.slot,h=c.createDialog("<span class='name'>Name</span><input type='text'/><button>OK</button>",
-f),g=h.querySelector("input");h.querySelector("button").addEventListener("click",function(b){if(g.value){if(b=k.input?a.getInputInfo(k.slot):a.getOutputInfo(k.slot))b.label=g.value;c.setDirty(!0)}h.close()})}},node:a},k=null;a&&(k=a.getSlotInPosition(b.canvasX,b.canvasY),h.active_node=a);k?(f=[],f.push(k.locked?"Cannot remove":{content:"Remove Slot",slot:k}),f.push({content:"Rename Slot",slot:k}),g.title=(k.input?k.input.type:k.output.type)||"*",k.input&&k.input.type==l.ACTION&&(g.title="Action"),
-k.output&&k.output.type==l.EVENT&&(g.title="Event")):f=a?this.getNodeMenuOptions(a):this.getCanvasMenuOptions();f&&new l.ContextMenu(f,g,e)};this.CanvasRenderingContext2D&&(CanvasRenderingContext2D.prototype.roundRect=function(a,b,c,e,f,h){void 0===f&&(f=5);void 0===h&&(h=f);this.beginPath();this.moveTo(a+f,b);this.lineTo(a+c-f,b);this.quadraticCurveTo(a+c,b,a+c,b+f);this.lineTo(a+c,b+e-h);this.quadraticCurveTo(a+c,b+e,a+c-h,b+e);this.lineTo(a+h,b+e);this.quadraticCurveTo(a,b+e,a,b+e-h);this.lineTo(a,
-b+f);this.quadraticCurveTo(a,b,a+f,b)});l.compareObjects=function(a,b){for(var c in a)if(a[c]!=b[c])return!1;return!0};l.distance=m;l.colorToString=function(a){return"rgba("+Math.round(255*a[0]).toFixed()+","+Math.round(255*a[1]).toFixed()+","+Math.round(255*a[2]).toFixed()+","+(4==a.length?a[3].toFixed(2):"1.0")+")"};l.isInsideRectangle=p;l.growBounding=function(a,b,c){b<a[0]?a[0]=b:b>a[2]&&(a[2]=b);c<a[1]?a[1]=c:c>a[3]&&(a[3]=c)};l.isInsideBounding=function(a,b){return a[0]<b[0][0]||a[1]<b[0][1]||
-a[0]>b[1][0]||a[1]>b[1][1]?!1:!0};l.overlapBounding=q;l.hex2num=function(a){"#"==a.charAt(0)&&(a=a.slice(1));a=a.toUpperCase();for(var b=Array(3),c=0,e,f,h=0;6>h;h+=2)e="0123456789ABCDEF".indexOf(a.charAt(h)),f="0123456789ABCDEF".indexOf(a.charAt(h+1)),b[c]=16*e+f,c++;return b};l.num2hex=function(a){for(var b="#",c,e,f=0;3>f;f++)c=a[f]/16,e=a[f]%16,b+="0123456789ABCDEF".charAt(c)+"0123456789ABCDEF".charAt(e);return b};r.prototype.addItem=function(a,b,c){function e(a){var b=this.value;b&&b.has_submenu&&
-f.call(this,a)}function f(a){var b=this.value,f=!0;h.current_submenu&&h.current_submenu.close(a);if(c.callback){var e=c.callback.call(this,b,c,a,h,c.node);!0===e&&(f=!1)}if(b&&(b.callback&&!c.ignore_item_callbacks&&!0!==b.disabled&&(e=b.callback.call(this,b,c,a,h,c.node),!0===e&&(f=!1)),b.submenu)){if(!b.submenu.options)throw"ContextMenu submenu needs options";new h.constructor(b.submenu.options,{callback:b.submenu.callback,event:a,parentMenu:h,ignore_item_callbacks:b.submenu.ignore_item_callbacks,
-title:b.submenu.title,autoopen:c.autoopen});f=!1}f&&!h.lock&&h.close()}var h=this;c=c||{};var k=document.createElement("div");k.className="litemenu-entry submenu";var g=!1;if(null===b)k.classList.add("separator");else{k.innerHTML=b&&b.title?b.title:a;if(k.value=b)b.disabled&&(g=!0,k.classList.add("disabled")),(b.submenu||b.has_submenu)&&k.classList.add("has_submenu");"function"==typeof b?(k.dataset.value=a,k.onclick_callback=b):k.dataset.value=b;b.className&&(k.className+=" "+b.className)}this.root.appendChild(k);
-g||k.addEventListener("click",f);c.autoopen&&k.addEventListener("mouseenter",e);return k};r.prototype.close=function(a,b){this.root.parentNode&&this.root.parentNode.removeChild(this.root);this.parentMenu&&!b&&(this.parentMenu.lock=!1,this.parentMenu.current_submenu=null,void 0===a?this.parentMenu.close():a&&!r.isCursorOverElement(a,this.parentMenu.root)&&r.trigger(this.parentMenu.root,"mouseleave",a));this.current_submenu&&this.current_submenu.close(a,!0)};r.trigger=function(a,b,c,e){var f=document.createEvent("CustomEvent");
-f.initCustomEvent(b,!0,!0,c);f.srcElement=e;a.dispatchEvent?a.dispatchEvent(f):a.__events&&a.__events.dispatchEvent(f);return f};r.prototype.getTopMenu=function(){return this.options.parentMenu?this.options.parentMenu.getTopMenu():this};r.prototype.getFirstEvent=function(){return this.options.parentMenu?this.options.parentMenu.getFirstEvent():this.options.event};r.isCursorOverElement=function(a,b){var c=a.pageX,e=a.pageY,f=b.getBoundingClientRect();return f?e>f.top&&e<f.top+f.height&&c>f.left&&c<
-f.left+f.width?!0:!1:!1};l.ContextMenu=r;l.closeAllContextMenus=function(a){a=a||window;a=a.document.querySelectorAll(".litecontextmenu");if(a.length){for(var b=[],c=0;c<a.length;c++)b.push(a[c]);for(c in b)b[c].close?b[c].close():b[c].parentNode&&b[c].parentNode.removeChild(b[c])}};l.extendClass=function(a,b){for(var c in b)a.hasOwnProperty(c)||(a[c]=b[c]);if(b.prototype)for(c in b.prototype)b.prototype.hasOwnProperty(c)&&!a.prototype.hasOwnProperty(c)&&(b.prototype.__lookupGetter__(c)?a.prototype.__defineGetter__(c,
-b.prototype.__lookupGetter__(c)):a.prototype[c]=b.prototype[c],b.prototype.__lookupSetter__(c)&&a.prototype.__defineSetter__(c,b.prototype.__lookupSetter__(c)))};l.getParameterNames=function(a){return(a+"").replace(/[/][/].*$/mg,"").replace(/\s+/g,"").replace(/[/][*][^/*]*[*][/]/g,"").split("){",1)[0].replace(/^[^(]*[(]/,"").replace(/=[^,]+/g,"").split(",").filter(Boolean)};Math.clamp=function(a,b,c){return b>a?b:c<a?c:a};"undefined"==typeof window||window.requestAnimationFrame||(window.requestAnimationFrame=
-window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(a){window.setTimeout(a,1E3/60)})})(this);"undefined"!=typeof exports&&(exports.LiteGraph=this.LiteGraph);
+!0;this.live_mode=!1;this.allow_interaction=this.allow_dragnodes=this.allow_dragcanvas=this.show_info=!0;this.drag_mode=!1;this.dragging_rectangle=null;this.always_render_background=!1;this.render_canvas_border=!0;this.render_connections_shadows=!1;this.render_connection_arrows=this.render_curved_connections=this.render_connections_border=!0;this.connections_width=3;this.gui_mouse={node:null,blocked:!1,position:[0,0],click:!1};b&&b.attachCanvas(this);this.setCanvas(a);this.clear();d.skip_render||
+this.startRendering();this.autoresize=d.autoresize}function m(a,b){return Math.sqrt((b[0]-a[0])*(b[0]-a[0])+(b[1]-a[1])*(b[1]-a[1]))}function p(a,b,d,c,f,n){return d<a&&d+f>a&&c<b&&c+n>b?!0:!1}function q(a,b){var d=a[0]+a[2],c=a[1]+a[3],f=b[1]+b[3];return a[0]>b[0]+b[2]||a[1]>f||d<b[0]||c<b[1]?!1:!0}function r(a,b){function d(a){var b=parseInt(f.style.top);f.style.top=(b+0.1*a.deltaY).toFixed()+"px";a.preventDefault();return!0}this.options=b=b||{};var c=this;b.parentMenu&&(b.parentMenu.constructor!==
+this.constructor?(console.error("parentMenu must be of class ContextMenu, ignoring it"),b.parentMenu=null):(this.parentMenu=b.parentMenu,this.parentMenu.lock=!0,this.parentMenu.current_submenu=this));b.event&&b.event.constructor!==MouseEvent&&b.event.constructor!==CustomEvent&&(console.error("Event passed to ContextMenu is not of type MouseEvent or CustomEvent. Ignoring it."),b.event=null);var f=document.createElement("div");f.className="litegraph litecontextmenu litemenubar-panel";f.style.minWidth=
+100;f.style.minHeight=100;f.style.pointerEvents="none";setTimeout(function(){f.style.pointerEvents="auto"},100);f.addEventListener("mouseup",function(a){a.preventDefault();return!0},!0);f.addEventListener("contextmenu",function(a){if(2!=a.button)return!1;a.preventDefault();return!1},!0);f.addEventListener("mousedown",function(a){if(2==a.button)return c.close(),a.preventDefault(),!0},!0);f.addEventListener("wheel",d,!0);f.addEventListener("mousewheel",d,!0);this.root=f;if(b.title){var n=document.createElement("div");
+n.className="litemenu-title";n.innerHTML=b.title;f.appendChild(n)}var n=0,k;for(k in a){var t=a.constructor==Array?a[k]:k;null!=t&&t.constructor!==String&&(t=void 0===t.content?String(t):t.content);this.addItem(t,a[k],b);n++}f.addEventListener("mouseleave",function(a){c.lock||c.close(a)});k=document;b.event&&(k=b.event.target.ownerDocument);k||(k=document);k.body.appendChild(f);n=b.left||0;k=b.top||0;if(b.event){n=b.event.pageX-10;k=b.event.pageY-10;b.title&&(k-=20);b.parentMenu&&(n=b.parentMenu.root.getBoundingClientRect(),
+n=n.left+n.width);var t=document.body.getBoundingClientRect(),e=f.getBoundingClientRect();n>t.width-e.width-10&&(n=t.width-e.width-10);k>t.height-e.height-10&&(k=t.height-e.height-10)}f.style.left=n+"px";f.style.top=k+"px"}var l=u.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:"",VALID_SHAPES:["box","round"],BOX_SHAPE:1,ROUND_SHAPE:2,CIRCLE_SHAPE:3,INPUT:1,OUTPUT:2,EVENT:-1,ACTION:-1,ALWAYS:0,ON_EVENT:1,NEVER:2,ON_TRIGGER:3,proxy:null,debug:!1,throw_errors:!0,allow_scripts:!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;l.debug&&console.log("Node registered: "+
+a);a.split("/");var d=b.name,c=a.lastIndexOf("/");b.category=a.substr(0,c);b.title||(b.title=d);if(b.prototype)for(var f in e.prototype)b.prototype[f]||(b.prototype[f]=e.prototype[f]);Object.defineProperty(b.prototype,"shape",{set:function(a){switch(a){case "box":this._shape=l.BOX_SHAPE;break;case "round":this._shape=l.ROUND_SHAPE;break;case "circle":this._shape=l.CIRCLE_SHAPE;break;default:this._shape=a}},get:function(a){return this._shape},enumerable:!0});this.registered_node_types[a]=b;b.constructor.name&&
+(this.Nodes[d]=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(f in b.supported_extensions)this.node_types_by_file_extension[b.supported_extensions[f].toLowerCase()]=b},wrapFunctionAsNode:function(a,b,d,c){for(var f=Array(b.length),n="",k=l.getParameterNames(b),t=0;t<k.length;++t)n+="this.addInput('"+k[t]+"',"+(d&&d[t]?"'"+d[t]+"'":"0")+");\n";d=Function(n+("this.addOutput('out',"+
+(c?"'"+c+"'":0)+");\n"));d.title=a.split("/").pop();d.desc="Generated from "+b.name;d.prototype.onExecute=function(){for(var a=0;a<f.length;++a)f[a]=this.getInputData(a);a=b.apply(this,f);this.setOutputData(0,a)};this.registerNodeType(a,d)},addNodeMethod:function(a,b){e.prototype[a]=b;for(var d in this.registered_node_types){var c=this.registered_node_types[d];c.prototype[a]&&(c.prototype["_"+a]=c.prototype[a]);c.prototype[a]=b}},createNode:function(a,b,d){var c=this.registered_node_types[a];if(!c)return l.debug&&
+console.log('GraphNode type "'+a+'" not registered.'),null;b=b||c.title||a;c=new c(b);c.type=a;!c.title&&b&&(c.title=b);c.properties||(c.properties={});c.properties_info||(c.properties_info=[]);c.flags||(c.flags={});c.size||(c.size=c.computeSize());c.pos||(c.pos=l.DEFAULT_POSITION.concat());c.mode||(c.mode=l.ALWAYS);if(d)for(var f in d)c[f]=d[f];return c},getNodeType:function(a){return this.registered_node_types[a]},getNodeTypesInCategory:function(a){var b=[],d;for(d in this.registered_node_types)""==
+a?null==this.registered_node_types[d].category&&b.push(this.registered_node_types[d]):this.registered_node_types[d].category==a&&b.push(this.registered_node_types[d]);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 d=[];for(b in a)d.push(b);return d},reloadNodes:function(a){var b=document.getElementsByTagName("script"),d=
+[],c;for(c in b)d.push(b[c]);b=document.getElementsByTagName("head")[0];a=document.location.href+a;for(c in d){var f=d[c].src;if(f&&f.substr(0,a.length)==a)try{l.debug&&console.log("Reloading: "+f);var n=document.createElement("script");n.type="text/javascript";n.src=f;b.appendChild(n);b.removeChild(d[c])}catch(k){if(l.throw_errors)throw k;l.debug&&console.log("Error while reloading "+f)}}l.debug&&console.log("Nodes reloaded")},cloneObject:function(a,b){if(null==a)return null;var d=JSON.parse(JSON.stringify(a));
+if(!b)return d;for(var c in d)b[c]=d[c];return b},isValidConnection:function(a,b){if(!a||!b||a==b||a==l.EVENT&&b==l.ACTION)return!0;a=String(a);b=String(b);a=a.toLowerCase();b=b.toLowerCase();if(-1==a.indexOf(",")&&-1==b.indexOf(","))return a==b;for(var d=a.split(","),c=b.split(","),f=0;f<d.length;++f)for(var n=0;n<c.length;++n)if(d[f]==c[n])return!0;return!1}};l.getTime="undefined"!=typeof performance?performance.now.bind(performance):"undefined"!=typeof Date&&Date.now?Date.now.bind(Date):"undefined"!=
+typeof process?function(){var a=process.hrtime();return 0.001*a[0]+1E-6*a[1]}:function(){return(new Date).getTime()};u.LGraph=l.LGraph=g;g.supported_types=["number","string","boolean"];g.prototype.getSupportedTypes=function(){return this.supported_types||g.supported_types};g.STATUS_STOPPED=1;g.STATUS_RUNNING=2;g.prototype.clear=function(){this.stop();this.status=g.STATUS_STOPPED;this.last_node_id=0;this._nodes=[];this._nodes_by_id={};this._nodes_executable=this._nodes_in_order=null;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=this.last_update_time=0;this.catch_errors=!0;this.global_inputs={};this.global_outputs={};this.debug=!0;this.change();this.sendActionToCanvas("clear")};g.prototype.attachCanvas=function(a){if(a.constructor!=h)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)};g.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))}};g.prototype.start=function(a){if(this.status!=g.STATUS_RUNNING){this.status=g.STATUS_RUNNING;if(this.onPlayEvent)this.onPlayEvent();this.sendEventToAllNodes("onStart");this.last_update_time=this.starttime=l.getTime();var b=this;this.execution_timer_id=setInterval(function(){b.runStep(1,
+!this.catch_errors)},a||1)}};g.prototype.stop=function(){if(this.status!=g.STATUS_STOPPED){this.status=g.STATUS_STOPPED;if(this.onStopEvent)this.onStopEvent();null!=this.execution_timer_id&&clearInterval(this.execution_timer_id);this.execution_timer_id=null;this.sendEventToAllNodes("onStop")}};g.prototype.runStep=function(a,b){a=a||1;var d=l.getTime();this.globaltime=0.001*(d-this.starttime);var c=this._nodes_executable?this._nodes_executable:this._nodes;if(c){if(b){for(var f=0;f<a;f++){for(var n=
+0,k=c.length;n<k;++n){var t=c[n];if(t.mode==l.ALWAYS&&t.onExecute)t.onExecute()}this.fixedtime+=this.fixedtime_lapse;if(this.onExecuteStep)this.onExecuteStep()}if(this.onAfterExecute)this.onAfterExecute()}else try{for(f=0;f<a;f++){n=0;for(k=c.length;n<k;++n)if(t=c[n],t.mode==l.ALWAYS&&t.onExecute)t.onExecute();this.fixedtime+=this.fixedtime_lapse;if(this.onExecuteStep)this.onExecuteStep()}if(this.onAfterExecute)this.onAfterExecute();this.errors_in_execution=!1}catch(e){this.errors_in_execution=!0;
+if(l.throw_errors)throw e;l.debug&&console.log("Error during execution: "+e);this.stop()}c=l.getTime();d=c-d;0==d&&(d=1);this.execution_time=0.001*d;this.globaltime+=0.001*d;this.iteration+=1;this.elapsed_time=0.001*(c-this.last_update_time);this.last_update_time=c}};g.prototype.updateExecutionOrder=function(){this._nodes_in_order=this.computeExecutionOrder(!1);this._nodes_executable=[];for(var a=0;a<this._nodes_in_order.length;++a)this._nodes_in_order[a].onExecute&&this._nodes_executable.push(this._nodes_in_order[a])};
+g.prototype.computeExecutionOrder=function(a,b){for(var d=[],c=[],f={},n={},k={},t=0,e=this._nodes.length;t<e;++t){var h=this._nodes[t];if(!a||h.onExecute){f[h.id]=h;var g=0;if(h.inputs)for(var m=0,p=h.inputs.length;m<p;m++)h.inputs[m]&&null!=h.inputs[m].link&&(g+=1);0==g?(c.push(h),b&&(h._level=1)):(b&&(h._level=0),k[h.id]=g)}}for(;0!=c.length;)if(h=c.shift(),d.push(h),delete f[h.id],h.outputs)for(t=0;t<h.outputs.length;t++)if(e=h.outputs[t],null!=e&&null!=e.links&&0!=e.links.length)for(m=0;m<e.links.length;m++)(g=
+this.links[e.links[m]])&&!n[g.id]&&(p=this.getNodeById(g.target_id),null==p?n[g.id]=!0:(b&&(!p._level||p._level<=h._level)&&(p._level=h._level+1),n[g.id]=!0,k[p.id]-=1,0==k[p.id]&&c.push(p)));for(t in f)d.push(f[t]);d.length!=this._nodes.length&&l.debug&&console.warn("something went wrong, nodes missing");e=d.length;for(t=0;t<e;++t)d[t].order=t;d=d.sort(function(a,b){var d=a.constructor.priority||a.priority||0,c=b.constructor.priority||b.priority||0;return d==c?a.order-b.order:d-c});for(t=0;t<e;++t)d[t].order=
+t;return d};g.prototype.arrange=function(a){a=a||40;for(var b=this.computeExecutionOrder(!1,!0),d=[],c=0;c<b.length;++c){var f=b[c],n=f._level||1;d[n]||(d[n]=[]);d[n].push(f)}b=a;for(c=0;c<d.length;++c)if(n=d[c]){for(var k=100,e=a,h=0;h<n.length;++h)f=n[h],f.pos[0]=b,f.pos[1]=e,f.size[0]>k&&(k=f.size[0]),e+=f.size[1]+a;b+=k+a}this.setDirtyCanvas(!0,!0)};g.prototype.getTime=function(){return this.globaltime};g.prototype.getFixedTime=function(){return this.fixedtime};g.prototype.getElapsedTime=function(){return this.elapsed_time};
+g.prototype.sendEventToAllNodes=function(a,b,d){d=d||l.ALWAYS;var c=this._nodes_in_order?this._nodes_in_order:this._nodes;if(c)for(var f=0,n=c.length;f<n;++f){var k=c[f];if(k[a]&&k.mode==d)if(void 0===b)k[a]();else if(b&&b.constructor===Array)k[a].apply(k,b);else k[a](b)}};g.prototype.sendActionToCanvas=function(a,b){if(this.list_of_graphcanvas)for(var d=0;d<this.list_of_graphcanvas.length;++d){var c=this.list_of_graphcanvas[d];c[a]&&c[a].apply(c,b)}};g.prototype.add=function(a,b){if(a){-1!=a.id&&
+null!=this._nodes_by_id[a.id]&&(console.warn("LiteGraph: there is already a node with this ID, changing it"),a.id=++this.last_node_id);if(this._nodes.length>=l.MAX_NUMBER_OF_NODES)throw"LiteGraph: max number of nodes in a graph reached";null==a.id||-1==a.id?a.id=++this.last_node_id:this.last_node_id<a.id&&(this.last_node_id=a.id);a.graph=this;this._nodes.push(a);this._nodes_by_id[a.id]=a;if(a.onAdded)a.onAdded(this);this.config.align_to_grid&&a.alignToGrid();b||this.updateExecutionOrder();if(this.onNodeAdded)this.onNodeAdded(a);
+this.setDirtyCanvas(!0);this.change();return a}};g.prototype.remove=function(a){if(null!=this._nodes_by_id[a.id]&&!a.ignore_remove){if(a.inputs)for(var b=0;b<a.inputs.length;b++){var d=a.inputs[b];null!=d.link&&a.disconnectInput(b)}if(a.outputs)for(b=0;b<a.outputs.length;b++)d=a.outputs[b],null!=d.links&&d.links.length&&a.disconnectOutput(b);if(a.onRemoved)a.onRemoved();a.graph=null;if(this.list_of_graphcanvas)for(b=0;b<this.list_of_graphcanvas.length;++b)d=this.list_of_graphcanvas[b],d.selected_nodes[a.id]&&
+delete d.selected_nodes[a.id],d.node_dragged==a&&(d.node_dragged=null);b=this._nodes.indexOf(a);-1!=b&&this._nodes.splice(b,1);delete this._nodes_by_id[a.id];if(this.onNodeRemoved)this.onNodeRemoved(a);this.setDirtyCanvas(!0,!0);this.change();this.updateExecutionOrder()}};g.prototype.getNodeById=function(a){return null==a?null:this._nodes_by_id[a]};g.prototype.findNodesByClass=function(a){for(var b=[],d=0,c=this._nodes.length;d<c;++d)this._nodes[d].constructor===a&&b.push(this._nodes[d]);return b};
+g.prototype.findNodesByType=function(a){a=a.toLowerCase();for(var b=[],d=0,c=this._nodes.length;d<c;++d)this._nodes[d].type.toLowerCase()==a&&b.push(this._nodes[d]);return b};g.prototype.findNodesByTitle=function(a){for(var b=[],d=0,c=this._nodes.length;d<c;++d)this._nodes[d].title==a&&b.push(this._nodes[d]);return b};g.prototype.getNodeOnPos=function(a,b,d){d=d||this._nodes;for(var c=d.length-1;0<=c;c--){var f=d[c];if(f.isPointInsideNode(a,b,2))return f}return null};g.prototype.addGlobalInput=function(a,
+b,d){this.global_inputs[a]={name:a,type:b,value:d};if(this.onGlobalInputAdded)this.onGlobalInputAdded(a,b);if(this.onGlobalsChange)this.onGlobalsChange()};g.prototype.setGlobalInputData=function(a,b){var d=this.global_inputs[a];d&&(d.value=b)};g.prototype.setInputData=g.prototype.setGlobalInputData;g.prototype.getGlobalInputData=function(a){return(a=this.global_inputs[a])?a.value:null};g.prototype.renameGlobalInput=function(a,b){if(b!=a){if(!this.global_inputs[a])return!1;if(this.global_inputs[b])return console.error("there is already one input with that name"),
+!1;this.global_inputs[b]=this.global_inputs[a];delete this.global_inputs[a];if(this.onGlobalInputRenamed)this.onGlobalInputRenamed(a,b);if(this.onGlobalsChange)this.onGlobalsChange()}};g.prototype.changeGlobalInputType=function(a,b){if(!this.global_inputs[a])return!1;if(this.global_inputs[a].type.toLowerCase()!=b.toLowerCase()&&(this.global_inputs[a].type=b,this.onGlobalInputTypeChanged))this.onGlobalInputTypeChanged(a,b)};g.prototype.removeGlobalInput=function(a){if(!this.global_inputs[a])return!1;
+delete this.global_inputs[a];if(this.onGlobalInputRemoved)this.onGlobalInputRemoved(a);if(this.onGlobalsChange)this.onGlobalsChange();return!0};g.prototype.addGlobalOutput=function(a,b,d){this.global_outputs[a]={name:a,type:b,value:d};if(this.onGlobalOutputAdded)this.onGlobalOutputAdded(a,b);if(this.onGlobalsChange)this.onGlobalsChange()};g.prototype.setGlobalOutputData=function(a,b){var d=this.global_outputs[a];d&&(d.value=b)};g.prototype.getGlobalOutputData=function(a){return(a=this.global_outputs[a])?
+a.value:null};g.prototype.getOutputData=g.prototype.getGlobalOutputData;g.prototype.renameGlobalOutput=function(a,b){if(!this.global_outputs[a])return!1;if(this.global_outputs[b])return console.error("there is already one output with that name"),!1;this.global_outputs[b]=this.global_outputs[a];delete this.global_outputs[a];if(this.onGlobalOutputRenamed)this.onGlobalOutputRenamed(a,b);if(this.onGlobalsChange)this.onGlobalsChange()};g.prototype.changeGlobalOutputType=function(a,b){if(!this.global_outputs[a])return!1;
+if(this.global_outputs[a].type.toLowerCase()!=b.toLowerCase()&&(this.global_outputs[a].type=b,this.onGlobalOutputTypeChanged))this.onGlobalOutputTypeChanged(a,b)};g.prototype.removeGlobalOutput=function(a){if(!this.global_outputs[a])return!1;delete this.global_outputs[a];if(this.onGlobalOutputRemoved)this.onGlobalOutputRemoved(a);if(this.onGlobalsChange)this.onGlobalsChange();return!0};g.prototype.triggerInput=function(a,b){for(var d=this.findNodesByTitle(a),c=0;c<d.length;++c)d[c].onTrigger(b)};
+g.prototype.setCallback=function(a,b){for(var d=this.findNodesByTitle(a),c=0;c<d.length;++c)d[c].setTrigger(b)};g.prototype.connectionChange=function(a){this.updateExecutionOrder();if(this.onConnectionChange)this.onConnectionChange(a);this.sendActionToCanvas("onConnectionChange")};g.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};g.prototype.change=function(){l.debug&&console.log("Graph changed");
+this.sendActionToCanvas("setDirty",[!0,!0]);if(this.on_change)this.on_change(this)};g.prototype.setDirtyCanvas=function(a,b){this.sendActionToCanvas("setDirty",[a,b])};g.prototype.serialize=function(){for(var a=[],b=0,d=this._nodes.length;b<d;++b)a.push(this._nodes[b].serialize());d=[];for(b in this.links){var c=this.links[b];d.push([c.id,c.origin_id,c.origin_slot,c.target_id,c.target_slot,c.type])}return{iteration:this.iteration,frame:this.frame,last_node_id:this.last_node_id,last_link_id:this.last_link_id,
+links:d,config:this.config,nodes:a}};g.prototype.configure=function(a,b){b||this.clear();var d=a.nodes;if(a.links&&a.links.constructor===Array){for(var c={},f=0;f<a.links.length;++f){var n=a.links[f];c[n[0]]={id:n[0],origin_id:n[1],origin_slot:n[2],target_id:n[3],target_slot:n[4],type:n[5]}}a.links=c}for(f in a)this[f]=a[f];c=!1;this._nodes=[];f=0;for(n=d.length;f<n;++f){var k=d[f],e=l.createNode(k.type,k.title);e?(e.id=k.id,this.add(e,!0)):(l.debug&&console.log("Node not found: "+k.type),c=!0)}f=
+0;for(n=d.length;f<n;++f)k=d[f],(e=this.getNodeById(k.id))&&e.configure(k);this.updateExecutionOrder();this.setDirtyCanvas(!0,!0);return c};g.prototype.load=function(a){var b=this,d=new XMLHttpRequest;d.open("GET",a,!0);d.send(null);d.onload=function(a){200!==d.status?console.error("Error loading graph:",d.status,d.response):(a=JSON.parse(d.response),b.configure(a))};d.onerror=function(a){console.error("Error loading graph:",a)}};g.prototype.onNodeTrace=function(a,b,d){};u.LGraphNode=l.LGraphNode=
+e;e.prototype._ctor=function(a){this.title=a||"Unnamed";this.size=[l.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={}};e.prototype.configure=function(a){for(var b in a)if("console"!=
+b)if("properties"==b)for(var d in a.properties){if(this.properties[d]=a.properties[d],this.onPropertyChanged)this.onPropertyChanged(d,a.properties[d])}else null!=a[b]&&("object"==typeof a[b]?this[b]&&this[b].configure?this[b].configure(a[b]):this[b]=l.cloneObject(a[b],this[b]):this[b]=a[b]);a.title||(this.title=this.constructor.title);if(this.onConnectionsChange){if(this.inputs)for(var c=0;c<this.inputs.length;++c){d=this.inputs[c];var f=this.graph?this.graph.links[d.link]:null;this.onConnectionsChange(l.INPUT,
+c,!0,f,d)}if(this.outputs)for(c=0;c<this.outputs.length;++c)if(d=this.outputs[c],d.links)for(b=0;b<d.links.length;++b)f=this.graph?this.graph.links[d.links[b]]:null,this.onConnectionsChange(l.OUTPUT,c,!0,f,d)}for(c in this.inputs)d=this.inputs[c],d.link&&d.link.length&&(f=d.link,"object"==typeof f&&(d.link=f[0],this.graph&&(this.graph.links[f[0]]={id:f[0],origin_id:f[1],origin_slot:f[2],target_id:f[3],target_slot:f[4]})));for(c in this.outputs)if(d=this.outputs[c],d.links&&0!=d.links.length)for(b in d.links)f=
+d.links[b],"object"==typeof f&&(d.links[b]=f[0]);if(this.onConfigure)this.onConfigure(a)};e.prototype.serialize=function(){var a={id:this.id,type:this.type,pos:this.pos,size:this.size,data:this.data,flags:l.cloneObject(this.flags),mode:this.mode};this.inputs&&(a.inputs=this.inputs);if(this.outputs){for(var b=0;b<this.outputs.length;b++)delete this.outputs[b]._data;a.outputs=this.outputs}this.title&&this.title!=this.constructor.title&&(a.title=this.title);this.properties&&(a.properties=l.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};e.prototype.clone=function(){var a=l.createNode(this.type),b=l.cloneObject(this.serialize());if(b.inputs)for(var d=0;d<b.inputs.length;++d)b.inputs[d].link=null;if(b.outputs)for(d=0;d<b.outputs.length;++d)b.outputs[d].links&&(b.outputs[d].links.length=0);delete b.id;
+a.configure(b);return a};e.prototype.toString=function(){return JSON.stringify(this.serialize())};e.prototype.getTitle=function(){return this.title||this.constructor.title};e.prototype.setOutputData=function(a,b){if(this.outputs&&!(-1==a||a>=this.outputs.length)){var d=this.outputs[a];if(d&&(d._data=b,this.outputs[a].links))for(d=0;d<this.outputs[a].links.length;d++)this.graph.links[this.outputs[a].links[d]].data=b}};e.prototype.getInputData=function(a,b){if(this.inputs&&!(a>=this.inputs.length||
+null==this.inputs[a].link)){var d=this.graph.links[this.inputs[a].link];if(!d)return null;if(!b)return d.data;var c=this.graph.getNodeById(d.origin_id);if(!c)return d.data;if(c.updateOutputData)c.updateOutputData(d.origin_slot);else if(c.onExecute)c.onExecute();return d.data}};e.prototype.getInputDataByName=function(a,b){var d=this.findInputSlot(a);return-1==d?null:this.getInputData(d,b)};e.prototype.isInputConnected=function(a){return this.inputs?a<this.inputs.length&&null!=this.inputs[a].link:!1};
+e.prototype.getInputInfo=function(a){return this.inputs?a<this.inputs.length?this.inputs[a]:null:null};e.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};e.prototype.getInputOrProperty=function(a){if(!this.inputs||!this.inputs.length)return this.properties?this.properties[a]:null;for(var b=0,d=this.inputs.length;b<d;++b)if(a==this.inputs[b].name)return(a=
+this.graph.links[this.inputs[b].link])?a.data:null;return this.properties[a]};e.prototype.getOutputData=function(a){return!this.outputs||a>=this.outputs.length?null:this.outputs[a]._data};e.prototype.getOutputInfo=function(a){return this.outputs?a<this.outputs.length?this.outputs[a]:null:null};e.prototype.isOutputConnected=function(a){return this.outputs?a<this.outputs.length&&this.outputs[a].links&&this.outputs[a].links.length:!1};e.prototype.isAnyOutputConnected=function(){if(!this.outputs)return!1;
+for(var a=0;a<this.outputs.length;++a)if(this.outputs[a].links&&this.outputs[a].links.length)return!0;return!1};e.prototype.getOutputNodes=function(a){if(!this.outputs||0==this.outputs.length||a>=this.outputs.length)return null;a=this.outputs[a];if(!a.links||0==a.links.length)return null;for(var b=[],d=0;d<a.links.length;d++){var c=this.graph.links[a.links[d]];c&&(c=this.graph.getNodeById(c.target_id))&&b.push(c)}return b};e.prototype.trigger=function(a,b){if(this.outputs&&this.outputs.length){this.graph&&
+(this.graph._last_trigger_time=l.getTime());for(var d=0;d<this.outputs.length;++d){var c=this.outputs[d];!c||c.type!==l.EVENT||a&&c.name!=a||this.triggerSlot(d,b)}}};e.prototype.triggerSlot=function(a,b){if(this.outputs){var d=this.outputs[a];if(d&&(d=d.links)&&d.length){this.graph&&(this.graph._last_trigger_time=l.getTime());for(var c=0;c<d.length;++c){var f=this.graph.links[d[c]];if(f){var n=this.graph.getNodeById(f.target_id);if(n)if(f._last_time=l.getTime(),f=n.inputs[f.target_slot],n.onAction)n.onAction(f.name,
+b);else if(n.mode===l.ON_TRIGGER&&n.onExecute)n.onExecute(b)}}}}};e.prototype.addProperty=function(a,b,d,c){d={name:a,type:d,default_value:b};if(c)for(var f in c)d[f]=c[f];this.properties_info||(this.properties_info=[]);this.properties_info.push(d);this.properties||(this.properties={});this.properties[a]=b;return d};e.prototype.addOutput=function(a,b,d){a={name:a,type:b,links:null};if(d)for(var c in d)a[c]=d[c];this.outputs||(this.outputs=[]);this.outputs.push(a);if(this.onOutputAdded)this.onOutputAdded(a);
+this.size=this.computeSize();return a};e.prototype.addOutputs=function(a){for(var b=0;b<a.length;++b){var d=a[b],c={name:d[0],type:d[1],link:null};if(a[2])for(var f in d[2])c[f]=d[2][f];this.outputs||(this.outputs=[]);this.outputs.push(c);if(this.onOutputAdded)this.onOutputAdded(c)}this.size=this.computeSize()};e.prototype.removeOutput=function(a){this.disconnectOutput(a);this.outputs.splice(a,1);this.size=this.computeSize();if(this.onOutputRemoved)this.onOutputRemoved(a)};e.prototype.addInput=function(a,
+b,d){a={name:a,type:b||0,link:null};if(d)for(var c in d)a[c]=d[c];this.inputs||(this.inputs=[]);this.inputs.push(a);this.size=this.computeSize();if(this.onInputAdded)this.onInputAdded(a);return a};e.prototype.addInputs=function(a){for(var b=0;b<a.length;++b){var d=a[b],c={name:d[0],type:d[1],link:null};if(a[2])for(var f in d[2])c[f]=d[2][f];this.inputs||(this.inputs=[]);this.inputs.push(c);if(this.onInputAdded)this.onInputAdded(c)}this.size=this.computeSize()};e.prototype.removeInput=function(a){this.disconnectInput(a);
+this.inputs.splice(a,1);this.size=this.computeSize();if(this.onInputRemoved)this.onInputRemoved(a)};e.prototype.addConnection=function(a,b,d,c){a={name:a,type:b,pos:d,direction:c,links:null};this.connections.push(a);return a};e.prototype.computeSize=function(a,b){function d(a){return a?n*a.length*0.6:0}var c=Math.max(this.inputs?this.inputs.length:1,this.outputs?this.outputs.length:1),f=b||new Float32Array([0,0]),c=Math.max(c,1);f[1]=14*c+6;var n=14,c=d(this.title),k=0,e=0;if(this.inputs)for(var h=
+0,g=this.inputs.length;h<g;++h){var m=this.inputs[h],m=m.label||m.name||"",m=d(m);k<m&&(k=m)}if(this.outputs)for(h=0,g=this.outputs.length;h<g;++h)m=this.outputs[h],m=m.label||m.name||"",m=d(m),e<m&&(e=m);f[0]=Math.max(k+e+10,c);f[0]=Math.max(f[0],l.NODE_WIDTH);return f};e.prototype.getBounding=function(a){a=a||new Float32Array(4);a[0]=this.pos[0]-4;a[1]=this.pos[1]-l.NODE_TITLE_HEIGHT;a[2]=this.size[0]+4;a[3]=this.size[1]+l.NODE_TITLE_HEIGHT;return a};e.prototype.isPointInsideNode=function(a,b,d){d=
+d||0;var c=this.graph&&this.graph.isLive()?0:20;if(this.flags.collapsed){if(p(a,b,this.pos[0]-d,this.pos[1]-l.NODE_TITLE_HEIGHT-d,l.NODE_COLLAPSED_WIDTH+2*d,l.NODE_TITLE_HEIGHT+2*d))return!0}else if(this.pos[0]-4-d<a&&this.pos[0]+this.size[0]+4+d>a&&this.pos[1]-c-d<b&&this.pos[1]+this.size[1]+d>b)return!0;return!1};e.prototype.getSlotInPosition=function(a,b){if(this.inputs)for(var d=0,c=this.inputs.length;d<c;++d){var f=this.inputs[d],n=this.getConnectionPos(!0,d);if(p(a,b,n[0]-10,n[1]-5,20,10))return{input:f,
+slot:d,link_pos:n,locked:f.locked}}if(this.outputs)for(d=0,c=this.outputs.length;d<c;++d)if(f=this.outputs[d],n=this.getConnectionPos(!1,d),p(a,b,n[0]-10,n[1]-5,20,10))return{output:f,slot:d,link_pos:n,locked:f.locked};return null};e.prototype.findInputSlot=function(a){if(!this.inputs)return-1;for(var b=0,d=this.inputs.length;b<d;++b)if(a==this.inputs[b].name)return b;return-1};e.prototype.findOutputSlot=function(a){if(!this.outputs)return-1;for(var b=0,d=this.outputs.length;b<d;++b)if(a==this.outputs[b].name)return b;
+return-1};e.prototype.connect=function(a,b,d){d=d||0;if(a.constructor===String){if(a=this.findOutputSlot(a),-1==a)return l.debug&&console.log("Connect: Error, no slot of name "+a),!1}else if(!this.outputs||a>=this.outputs.length)return l.debug&&console.log("Connect: Error, slot number not found"),!1;b&&b.constructor===Number&&(b=this.graph.getNodeById(b));if(!b)throw"Node not found";if(b==this)return!1;if(d.constructor===String){if(d=b.findInputSlot(d),-1==d)return l.debug&&console.log("Connect: Error, no slot of name "+
+d),!1}else{if(d===l.EVENT)return!1;if(!b.inputs||d>=b.inputs.length)return l.debug&&console.log("Connect: Error, slot number not found"),!1}null!=b.inputs[d].link&&b.disconnectInput(d);this.setDirtyCanvas(!1,!0);this.graph.connectionChange(this);var c=this.outputs[a];if(b.onConnectInput&&!1===b.onConnectInput(d,c.type,c))return!1;var f=b.inputs[d];if(l.isValidConnection(c.type,f.type)){var n={id:this.graph.last_link_id++,type:f.type,origin_id:this.id,origin_slot:a,target_id:b.id,target_slot:d};this.graph.links[n.id]=
+n;null==c.links&&(c.links=[]);c.links.push(n.id);b.inputs[d].link=n.id;if(this.onConnectionsChange)this.onConnectionsChange(l.OUTPUT,a,!0,n,c);if(b.onConnectionsChange)b.onConnectionsChange(l.INPUT,d,!0,n,f)}this.setDirtyCanvas(!1,!0);this.graph.connectionChange(this);return!0};e.prototype.disconnectOutput=function(a,b){if(a.constructor===String){if(a=this.findOutputSlot(a),-1==a)return l.debug&&console.log("Connect: Error, no slot of name "+a),!1}else if(!this.outputs||a>=this.outputs.length)return l.debug&&
+console.log("Connect: Error, slot number not found"),!1;var d=this.outputs[a];if(!d.links||0==d.links.length)return!1;if(b){b.constructor===Number&&(b=this.graph.getNodeById(b));if(!b)throw"Target Node not found";for(var c=0,f=d.links.length;c<f;c++){var n=d.links[c],k=this.graph.links[n];if(k.target_id==b.id){d.links.splice(c,1);var e=b.inputs[k.target_slot];e.link=null;delete this.graph.links[n];if(b.onConnectionsChange)b.onConnectionsChange(l.INPUT,k.target_slot,!1,k,e);if(this.onConnectionsChange)this.onConnectionsChange(l.OUTPUT,
+a,!1,k,d);break}}}else{c=0;for(f=d.links.length;c<f;c++)if(n=d.links[c],k=this.graph.links[n]){if(b=this.graph.getNodeById(k.target_id))if(e=b.inputs[k.target_slot],e.link=null,b.onConnectionsChange)b.onConnectionsChange(l.INPUT,k.target_slot,!1,k,e);delete this.graph.links[n];if(this.onConnectionsChange)this.onConnectionsChange(l.OUTPUT,a,!1,k,d)}d.links=null}this.setDirtyCanvas(!1,!0);this.graph.connectionChange(this);return!0};e.prototype.disconnectInput=function(a){if(a.constructor===String){if(a=
+this.findInputSlot(a),-1==a)return l.debug&&console.log("Connect: Error, no slot of name "+a),!1}else if(!this.inputs||a>=this.inputs.length)return l.debug&&console.log("Connect: Error, slot number not found"),!1;var b=this.inputs[a];if(!b)return!1;var d=this.inputs[a].link;this.inputs[a].link=null;var c=this.graph.links[d];if(c){var f=this.graph.getNodeById(c.origin_id);if(!f)return!1;var n=f.outputs[c.origin_slot];if(!n||!n.links||0==n.links.length)return!1;for(var k=0,e=n.links.length;k<e;k++)if(n.links[k]==
+d){n.links.splice(k,1);break}delete this.graph.links[d];if(this.onConnectionsChange)this.onConnectionsChange(l.INPUT,a,!1,c,b);if(f.onConnectionsChange)f.onConnectionsChange(l.OUTPUT,k,!1,c,n)}this.setDirtyCanvas(!1,!0);this.graph.connectionChange(this);return!0};e.prototype.getConnectionPos=function(a,b){return this.flags.collapsed?a?[this.pos[0],this.pos[1]-0.5*l.NODE_TITLE_HEIGHT]:[this.pos[0]+l.NODE_COLLAPSED_WIDTH,this.pos[1]-0.5*l.NODE_TITLE_HEIGHT]:a&&-1==b?[this.pos[0]+10,this.pos[1]+10]:
+a&&this.inputs.length>b&&this.inputs[b].pos?[this.pos[0]+this.inputs[b].pos[0],this.pos[1]+this.inputs[b].pos[1]]:!a&&this.outputs.length>b&&this.outputs[b].pos?[this.pos[0]+this.outputs[b].pos[0],this.pos[1]+this.outputs[b].pos[1]]:a?[this.pos[0],this.pos[1]+10+b*l.NODE_SLOT_HEIGHT]:[this.pos[0]+this.size[0]+1,this.pos[1]+10+b*l.NODE_SLOT_HEIGHT]};e.prototype.alignToGrid=function(){this.pos[0]=l.CANVAS_GRID_SIZE*Math.round(this.pos[0]/l.CANVAS_GRID_SIZE);this.pos[1]=l.CANVAS_GRID_SIZE*Math.round(this.pos[1]/
+l.CANVAS_GRID_SIZE)};e.prototype.trace=function(a){this.console||(this.console=[]);this.console.push(a);this.console.length>e.MAX_CONSOLE&&this.console.shift();this.graph.onNodeTrace(this,a)};e.prototype.setDirtyCanvas=function(a,b){this.graph&&this.graph.sendActionToCanvas("setDirty",[a,b])};e.prototype.loadImage=function(a){var b=new Image;b.src=l.node_images_path+a;b.ready=!1;var d=this;b.onload=function(){this.ready=!0;d.setDirtyCanvas(!0)};return b};e.prototype.captureInput=function(a){if(this.graph&&
+this.graph.list_of_graphcanvas)for(var b=this.graph.list_of_graphcanvas,d=0;d<b.length;++d){var c=b[d];if(a||c.node_capturing_input==this)c.node_capturing_input=a?this:null}};e.prototype.collapse=function(){this.flags.collapsed=this.flags.collapsed?!1:!0;this.setDirtyCanvas(!0,!0)};e.prototype.pin=function(a){this.flags.pinned=void 0===a?!this.flags.pinned:a};e.prototype.localToScreen=function(a,b,d){return[(a+this.pos[0])*d.scale+d.offset[0],(b+this.pos[1])*d.scale+d.offset[1]]};u.LGraphCanvas=l.LGraphCanvas=
+h;h.link_type_colors={"-1":"#F85",number:"#AAC",node:"#DCA"};h.prototype.clear=function(){this.fps=this.render_time=this.last_draw_time=this.frame=0;this.scale=1;this.offset=[0,0];this.dragging_rectangle=null;this.selected_nodes={};this.visible_nodes=[];this.connecting_node=this.node_capturing_input=this.node_over=this.node_dragged=null;this.highlighted_links={};this.dirty_bgcanvas=this.dirty_canvas=!0;this.node_in_panel=this.dirty_area=null;this.last_mouse=[0,0];this.last_mouseclick=0;if(this.onClear)this.onClear()};
+h.prototype.setGraph=function(a,b){this.graph!=a&&(b||this.clear(),!a&&this.graph?this.graph.detachCanvas(this):(a.attachCanvas(this),this.setDirty(!0,!0)))};h.prototype.openSubgraph=function(a){if(!a)throw"graph cannot be null";if(this.graph==a)throw"graph cannot be the same";this.clear();this.graph&&(this._graph_stack||(this._graph_stack=[]),this._graph_stack.push(this.graph));a.attachCanvas(this);this.setDirty(!0,!0)};h.prototype.closeSubgraph=function(){if(this._graph_stack&&0!=this._graph_stack.length){var a=
+this._graph_stack.pop();this.selected_nodes={};this.highlighted_links={};a.attachCanvas(this);this.setDirty(!0,!0)}};h.prototype.setCanvas=function(a,b){if(a&&a.constructor===String&&(a=document.getElementById(a),!a))throw"Error creating LiteGraph canvas: Canvas not found";if(a!==this.canvas&&(!a&&this.canvas&&(b||this.unbindEvents()),this.canvas=a)){a.className+=" lgraphcanvas";a.data=this;this.bgcanvas=null;this.bgcanvas||(this.bgcanvas=document.createElement("canvas"),this.bgcanvas.width=this.canvas.width,
+this.bgcanvas.height=this.canvas.height);if(null==a.getContext){if("canvas"!=a.localName)throw"Element supplied for LGraphCanvas must be a <canvas> element, you passed a "+a.localName;throw"This browser doesnt support Canvas";}null==(this.ctx=a.getContext("2d"))&&(console.warn("This canvas seems to be WebGL, enabling WebGL renderer"),this.enableWebGL());this._mousemove_callback=this.processMouseMove.bind(this);this._mouseup_callback=this.processMouseUp.bind(this);b||this.bindEvents()}};h.prototype._doNothing=
+function(a){a.preventDefault();return!1};h.prototype._doReturnTrue=function(a){a.preventDefault();return!0};h.prototype.bindEvents=function(){if(this._events_binded)console.warn("LGraphCanvas: events already binded");else{var a=this.canvas,b=this.getCanvasWindow().document;this._mousedown_callback=this.processMouseDown.bind(this);this._mousewheel_callback=this.processMouseWheel.bind(this);a.addEventListener("mousedown",this._mousedown_callback,!0);a.addEventListener("mousemove",this._mousemove_callback);
+a.addEventListener("mousewheel",this._mousewheel_callback,!1);a.addEventListener("contextmenu",this._doNothing);a.addEventListener("DOMMouseScroll",this._mousewheel_callback,!1);a.addEventListener("touchstart",this.touchHandler,!0);a.addEventListener("touchmove",this.touchHandler,!0);a.addEventListener("touchend",this.touchHandler,!0);a.addEventListener("touchcancel",this.touchHandler,!0);this._key_callback=this.processKey.bind(this);a.addEventListener("keydown",this._key_callback,!0);b.addEventListener("keyup",
+this._key_callback,!0);this._ondrop_callback=this.processDrop.bind(this);a.addEventListener("dragover",this._doNothing,!1);a.addEventListener("dragend",this._doNothing,!1);a.addEventListener("drop",this._ondrop_callback,!1);a.addEventListener("dragenter",this._doReturnTrue,!1);this._events_binded=!0}};h.prototype.unbindEvents=function(){if(this._events_binded){var a=this.getCanvasWindow().document;this.canvas.removeEventListener("mousedown",this._mousedown_callback);this.canvas.removeEventListener("mousewheel",
+this._mousewheel_callback);this.canvas.removeEventListener("DOMMouseScroll",this._mousewheel_callback);this.canvas.removeEventListener("keydown",this._key_callback);a.removeEventListener("keyup",this._key_callback);this.canvas.removeEventListener("contextmenu",this._doNothing);this.canvas.removeEventListener("drop",this._ondrop_callback);this.canvas.removeEventListener("dragenter",this._doReturnTrue);this.canvas.removeEventListener("touchstart",this.touchHandler);this.canvas.removeEventListener("touchmove",
+this.touchHandler);this.canvas.removeEventListener("touchend",this.touchHandler);this.canvas.removeEventListener("touchcancel",this.touchHandler);this._ondrop_callback=this._key_callback=this._mousewheel_callback=this._mousedown_callback=null;this._events_binded=!1}else console.warn("LGraphCanvas: no events binded")};h.getFileExtension=function(a){var b=a.indexOf("?");-1!=b&&(a=a.substr(0,b));b=a.lastIndexOf(".");return-1==b?"":a.substr(b+1).toLowerCase()};h.prototype.enableWebGL=function(){if(void 0===
+typeof GL)throw"litegl.js must be included to use a WebGL canvas";if(void 0===typeof enableWebGLCanvas)throw"webglCanvas.js must be included to use this feature";this.gl=this.ctx=enableWebGLCanvas(this.canvas);this.ctx.webgl=!0;this.bgcanvas=this.canvas;this.bgctx=this.gl};h.prototype.setDirty=function(a,b){a&&(this.dirty_canvas=!0);b&&(this.dirty_bgcanvas=!0)};h.prototype.getCanvasWindow=function(){if(!this.canvas)return window;var a=this.canvas.ownerDocument;return a.defaultView||a.parentWindow};
+h.prototype.startRendering=function(){function a(){this.pause_rendering||this.draw();var b=this.getCanvasWindow();this.is_rendering&&b.requestAnimationFrame(a.bind(this))}this.is_rendering||(this.is_rendering=!0,a.call(this))};h.prototype.stopRendering=function(){this.is_rendering=!1};h.prototype.processMouseDown=function(a){if(this.graph){this.adjustMouseEvent(a);var b=this.getCanvasWindow();h.active_canvas=this;this.canvas.removeEventListener("mousemove",this._mousemove_callback);b.document.addEventListener("mousemove",
+this._mousemove_callback,!0);b.document.addEventListener("mouseup",this._mouseup_callback,!0);var d=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes),c=!1;l.closeAllContextMenus(b);if(1==a.which){a.ctrlKey&&(this.dragging_rectangle=new Float32Array(4),this.dragging_rectangle[0]=a.canvasX,this.dragging_rectangle[1]=a.canvasY,this.dragging_rectangle[2]=1,this.dragging_rectangle[3]=1,c=!0);var f=!1;if(d&&this.allow_interaction&&!c){this.live_mode||d.flags.pinned||this.bringToFront(d);if(!this.connecting_node&&
+!d.flags.collapsed&&!this.live_mode){if(d.outputs)for(var n=0,k=d.outputs.length;n<k;++n){var e=d.outputs[n],g=d.getConnectionPos(!1,n);if(p(a.canvasX,a.canvasY,g[0]-10,g[1]-5,20,10)){this.connecting_node=d;this.connecting_output=e;this.connecting_pos=d.getConnectionPos(!1,n);this.connecting_slot=n;c=!0;break}}if(d.inputs)for(n=0,k=d.inputs.length;n<k;++n)e=d.inputs[n],g=d.getConnectionPos(!0,n),p(a.canvasX,a.canvasY,g[0]-10,g[1]-5,20,10)&&null!==e.link&&(d.disconnectInput(n),c=this.dirty_bgcanvas=
+!0);!c&&p(a.canvasX,a.canvasY,d.pos[0]+d.size[0]-5,d.pos[1]+d.size[1]-5,5,5)&&(this.resizing_node=d,this.canvas.style.cursor="se-resize",c=!0)}!c&&p(a.canvasX,a.canvasY,d.pos[0],d.pos[1]-l.NODE_TITLE_HEIGHT,l.NODE_TITLE_HEIGHT,l.NODE_TITLE_HEIGHT)&&(d.collapse(),c=!0);if(!c){n=!1;this.gui_mouse.node=d;this.gui_mouse.position[0]=a.canvasX-d.pos[0];this.gui_mouse.position[1]=a.canvasY-d.pos[1];this.gui_mouse.clicked=!0;this.gui_mouse.blocked&&(n=!0);if(300>l.getTime()-this.last_mouseclick&&this.selected_nodes[d.id]){if(d.onDblClick)d.onDblClick(a);
+this.processNodeDblClicked(d);n=!0}d.onMouseDown&&d.onMouseDown(a,[a.canvasX-d.pos[0],a.canvasY-d.pos[1]])?n=!0:this.live_mode&&(n=f=!0);n||(this.allow_dragnodes&&(this.node_dragged=d),this.selected_nodes[d.id]||this.processNodeSelected(d,a));this.dirty_canvas=!0}}else f=!0;!c&&f&&this.allow_dragcanvas&&(this.dragging_canvas=!0)}else 2!=a.which&&3==a.which&&this.processContextMenu(d,a);this.last_mouse[0]=a.localX;this.last_mouse[1]=a.localY;this.last_mouseclick=l.getTime();this.canvas_mouse=[a.canvasX,
+a.canvasY];this.graph.change();(!b.document.activeElement||"input"!=b.document.activeElement.nodeName.toLowerCase()&&"textarea"!=b.document.activeElement.nodeName.toLowerCase())&&a.preventDefault();a.stopPropagation();if(this.onMouseDown)this.onMouseDown(a);return!1}};h.prototype.processMouseMove=function(a){this.autoresize&&this.resize();if(this.graph){h.active_canvas=this;this.adjustMouseEvent(a);var b=[a.localX,a.localY],d=[b[0]-this.last_mouse[0],b[1]-this.last_mouse[1]];this.last_mouse=b;this.canvas_mouse=
+[a.canvasX,a.canvasY];if(this.dragging_rectangle)this.dragging_rectangle[2]=a.canvasX-this.dragging_rectangle[0],this.dragging_rectangle[3]=a.canvasY-this.dragging_rectangle[1],this.dirty_canvas=!0;else if(this.dragging_canvas)this.offset[0]+=d[0]/this.scale,this.offset[1]+=d[1]/this.scale,this.dirty_bgcanvas=this.dirty_canvas=!0;else if(this.allow_interaction){this.connecting_node&&(this.dirty_canvas=!0);for(var b=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes),c=0,f=this.graph._nodes.length;c<
+f;++c)if(this.graph._nodes[c].mouseOver&&b!=this.graph._nodes[c]){this.graph._nodes[c].mouseOver=!1;if(this.node_over&&this.node_over.onMouseLeave)this.node_over.onMouseLeave(a);this.node_over=null;this.dirty_canvas=!0}if(b){if(!b.mouseOver&&(b.mouseOver=!0,this.node_over=b,this.dirty_canvas=!0,b.onMouseEnter))b.onMouseEnter(a);if(b.onMouseMove)b.onMouseMove(a);if(this.connecting_node&&(f=this._highlight_input||[0,0],!this.isOverNodeBox(b,a.canvasX,a.canvasY))){var n=this.isOverNodeInput(b,a.canvasX,
+a.canvasY,f);-1!=n&&b.inputs[n]?l.isValidConnection(this.connecting_output.type,b.inputs[n].type)&&(this._highlight_input=f):this._highlight_input=null}p(a.canvasX,a.canvasY,b.pos[0]+b.size[0]-5,b.pos[1]+b.size[1]-5,5,5)?this.canvas.style.cursor="se-resize":this.canvas.style.cursor=null}else this.canvas.style.cursor=null;if(this.node_capturing_input&&this.node_capturing_input!=b&&this.node_capturing_input.onMouseMove)this.node_capturing_input.onMouseMove(a);if(this.node_dragged&&!this.live_mode){for(c in this.selected_nodes)b=
+this.selected_nodes[c],b.pos[0]+=d[0]/this.scale,b.pos[1]+=d[1]/this.scale;this.dirty_bgcanvas=this.dirty_canvas=!0}this.resizing_node&&!this.live_mode&&(this.resizing_node.size[0]+=d[0]/this.scale,this.resizing_node.size[1]+=d[1]/this.scale,d=Math.max(this.resizing_node.inputs?this.resizing_node.inputs.length:0,this.resizing_node.outputs?this.resizing_node.outputs.length:0),this.resizing_node.size[1]<d*l.NODE_SLOT_HEIGHT+4&&(this.resizing_node.size[1]=d*l.NODE_SLOT_HEIGHT+4),this.resizing_node.size[0]<
+l.NODE_MIN_WIDTH&&(this.resizing_node.size[0]=l.NODE_MIN_WIDTH),this.canvas.style.cursor="se-resize",this.dirty_bgcanvas=this.dirty_canvas=!0)}a.preventDefault();return!1}};h.prototype.processMouseUp=function(a){if(this.graph){var b=this.getCanvasWindow().document;h.active_canvas=this;b.removeEventListener("mousemove",this._mousemove_callback,!0);this.canvas.addEventListener("mousemove",this._mousemove_callback,!0);b.removeEventListener("mouseup",this._mouseup_callback,!0);this.adjustMouseEvent(a);
+b=l.getTime();a.click_time=b-this.last_mouseclick;if(1==a.which)if(this.dragging_rectangle){if(this.graph){var d=this.graph._nodes,c=new Float32Array(4);this.deselectAllNodes();0>this.dragging_rectangle[2]&&(this.dragging_rectangle[0]+=this.dragging_rectangle[2]);0>this.dragging_rectangle[3]&&(this.dragging_rectangle[1]+=this.dragging_rectangle[3]);this.dragging_rectangle[2]=Math.abs(this.dragging_rectangle[2]*this.scale);this.dragging_rectangle[3]=Math.abs(this.dragging_rectangle[3]*this.scale);
+for(var f=0;f<d.length;++f)b=d[f],b.getBounding(c),q(this.dragging_rectangle,c)&&this.selectNode(b,!0)}this.dragging_rectangle=null}else if(this.connecting_node){this.dirty_bgcanvas=this.dirty_canvas=!0;if(b=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes))this.connecting_output.type==l.EVENT&&this.isOverNodeBox(b,a.canvasX,a.canvasY)?this.connecting_node.connect(this.connecting_slot,b,l.EVENT):(d=this.isOverNodeInput(b,a.canvasX,a.canvasY),-1!=d?this.connecting_node.connect(this.connecting_slot,
+b,d):(d=b.getInputInfo(0),this.connecting_output.type==l.EVENT?this.connecting_node.connect(this.connecting_slot,b,l.EVENT):d&&!d.link&&l.isValidConnection(d.type&&this.connecting_output.type)&&this.connecting_node.connect(this.connecting_slot,b,0)));this.connecting_node=this.connecting_pos=this.connecting_output=null;this.connecting_slot=-1}else if(this.resizing_node)this.dirty_bgcanvas=this.dirty_canvas=!0,this.resizing_node=null;else if(this.node_dragged)this.dirty_bgcanvas=this.dirty_canvas=!0,
+this.node_dragged.pos[0]=Math.round(this.node_dragged.pos[0]),this.node_dragged.pos[1]=Math.round(this.node_dragged.pos[1]),this.graph.config.align_to_grid&&this.node_dragged.alignToGrid(),this.node_dragged=null;else{b=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes);!b&&300>a.click_time&&this.deselectAllNodes();this.dirty_canvas=!0;this.dragging_canvas=!1;if(this.node_over&&this.node_over.onMouseUp)this.node_over.onMouseUp(a,[a.canvasX-this.node_over.pos[0],a.canvasY-this.node_over.pos[1]]);
+if(this.node_capturing_input&&this.node_capturing_input.onMouseUp)this.node_capturing_input.onMouseUp(a,[a.canvasX-this.node_capturing_input.pos[0],a.canvasY-this.node_capturing_input.pos[1]])}else 2==a.which?(this.dirty_canvas=!0,this.dragging_canvas=!1):3==a.which&&(this.dirty_canvas=!0,this.dragging_canvas=!1);this.graph.change();a.stopPropagation();a.preventDefault();return!1}};h.prototype.processMouseWheel=function(a){if(this.graph&&this.allow_dragcanvas){var b=null!=a.wheelDeltaY?a.wheelDeltaY:
+-60*a.detail;this.adjustMouseEvent(a);var d=this.scale;0<b?d*=1.1:0>b&&(d*=1/1.1);this.setZoom(d,[a.localX,a.localY]);this.graph.change();a.preventDefault();return!1}};h.prototype.isOverNodeBox=function(a,b,d){var c=l.NODE_TITLE_HEIGHT;return p(b,d,a.pos[0]+2,a.pos[1]+2-c,c-4,c-4)?!0:!1};h.prototype.isOverNodeInput=function(a,b,d,c){if(a.inputs)for(var f=0,n=a.inputs.length;f<n;++f){var k=a.getConnectionPos(!0,f);if(p(b,d,k[0]-10,k[1]-5,20,10))return c&&(c[0]=k[0],c[1]=k[1]),f}return-1};h.prototype.processKey=
+function(a){if(this.graph){var b=!1;if("input"!=a.target.localName){if("keydown"==a.type){32==a.keyCode&&(b=this.dragging_canvas=!0);65==a.keyCode&&a.ctrlKey&&(this.selectNodes(),b=!0);"KeyC"==a.code&&(a.metaKey||a.ctrlKey)&&!a.shiftKey&&this.selected_nodes&&(this.copyToClipboard(),b=!0);"KeyV"!=a.code||!a.metaKey&&!a.ctrlKey||a.shiftKey||this.pasteFromClipboard();if(46==a.keyCode||8==a.keyCode)this.deleteSelectedNodes(),b=!0;if(this.selected_nodes)for(var d in this.selected_nodes)if(this.selected_nodes[d].onKeyDown)this.selected_nodes[d].onKeyDown(a)}else if("keyup"==
+a.type&&(32==a.keyCode&&(this.dragging_canvas=!1),this.selected_nodes))for(d in this.selected_nodes)if(this.selected_nodes[d].onKeyUp)this.selected_nodes[d].onKeyUp(a);this.graph.change();if(b)return a.preventDefault(),!1}}};h.prototype.copyToClipboard=function(){var a={nodes:[],links:[]},b=0,d=[],c;for(c in this.selected_nodes){var f=this.selected_nodes[c];f._relative_id=b;d.push(f);b+=1}for(c=0;c<d.length;++c)if(f=d[c],a.nodes.push(f.clone().serialize()),f.inputs&&f.inputs.length)for(b=0;b<f.inputs.length;++b){var n=
+f.inputs[b];if(n&&null!=n.link&&(n=this.graph.links[n.link])){var k=this.graph.getNodeById(n.origin_id);k&&this.selected_nodes[k.id]&&a.links.push([k._relative_id,b,f._relative_id,n.target_slot])}}localStorage.setItem("litegrapheditor_clipboard",JSON.stringify(a))};h.prototype.pasteFromClipboard=function(){var a=localStorage.getItem("litegrapheditor_clipboard");if(a){for(var a=JSON.parse(a),b=[],d=0;d<a.nodes.length;++d){var c=a.nodes[d],f=l.createNode(c.type);f&&(f.configure(c),f.pos[0]+=5,f.pos[1]+=
+5,this.graph.add(f),b.push(f))}for(d=0;d<a.links.length;++d)c=a.links[d],b[c[0]].connect(c[1],b[c[2]],c[3]);this.selectNodes(b)}};h.prototype.processDrop=function(a){a.preventDefault();this.adjustMouseEvent(a);var b=[a.canvasX,a.canvasY],d=this.graph.getNodeOnPos(b[0],b[1]);if(d){if((d.onDropFile||d.onDropData)&&(b=a.dataTransfer.files)&&b.length)for(var c=0;c<b.length;c++){var f=a.dataTransfer.files[0],n=f.name;h.getFileExtension(n);if(d.onDropFile)d.onDropFile(f);if(d.onDropData){var k=new FileReader;
+k.onload=function(a){d.onDropData(a.target.result,n,f)};var e=f.type.split("/")[0];"text"==e||""==e?k.readAsText(f):"image"==e?k.readAsDataURL(f):k.readAsArrayBuffer(f)}}return d.onDropItem&&d.onDropItem(event)?!0:this.onDropItem?this.onDropItem(event):!1}b=null;this.onDropItem&&(b=this.onDropItem(event));b||this.checkDropItem(a)};h.prototype.checkDropItem=function(a){if(a.dataTransfer.files.length){var b=a.dataTransfer.files[0],d=h.getFileExtension(b.name).toLowerCase();if(d=l.node_types_by_file_extension[d])if(d=
+l.createNode(d.type),d.pos=[a.canvasX,a.canvasY],this.graph.add(d),d.onDropFile)d.onDropFile(b)}};h.prototype.processNodeDblClicked=function(a){if(this.onShowNodePanel)this.onShowNodePanel(a);if(this.onNodeDblClicked)this.onNodeDblClicked(a);this.setDirty(!0)};h.prototype.processNodeSelected=function(a,b){this.selectNode(a,b&&b.shiftKey);if(this.onNodeSelected)this.onNodeSelected(a)};h.prototype.processNodeDeselected=function(a){this.deselectNode(a);if(this.onNodeDeselected)this.onNodeDeselected(a)};
+h.prototype.selectNode=function(a,b){null==a?this.deselectAllNodes():this.selectNodes([a],b)};h.prototype.selectNodes=function(a,b){b||this.deselectAllNodes();a=a||this.graph._nodes;for(var d=0;d<a.length;++d){var c=a[d];if(!c.selected){if(!c.selected&&c.onSelected)c.onSelected();c.selected=!0;this.selected_nodes[c.id]=c;if(c.inputs)for(d=0;d<c.inputs.length;++d)this.highlighted_links[c.inputs[d].link]=!0;if(c.outputs)for(d=0;d<c.outputs.length;++d){var f=c.outputs[d];if(f.links)for(var e=0;e<f.links.length;++e)this.highlighted_links[f.links[e]]=
+!0}}}this.setDirty(!0)};h.prototype.deselectNode=function(a){if(a.selected){if(a.onDeselected)a.onDeselected();a.selected=!1;if(a.inputs)for(var b=0;b<a.inputs.length;++b)delete this.highlighted_links[a.inputs[b].link];if(a.outputs)for(b=0;b<a.outputs.length;++b){var d=a.outputs[b];if(d.links)for(var c=0;c<d.links.length;++c)delete this.highlighted_links[d.links[c]]}}};h.prototype.deselectAllNodes=function(){if(this.graph){for(var a=this.graph._nodes,b=0,d=a.length;b<d;++b){var c=a[b];if(c.selected){if(c.onDeselected)c.onDeselected();
+c.selected=!1}}this.selected_nodes={};this.highlighted_links={};this.setDirty(!0)}};h.prototype.deleteSelectedNodes=function(){for(var a in this.selected_nodes)this.graph.remove(this.selected_nodes[a]);this.selected_nodes={};this.highlighted_links={};this.setDirty(!0)};h.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)};h.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]};h.prototype.setZoom=function(a,b){b||(b=[0.5*this.canvas.width,0.5*this.canvas.height]);var d=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 c=this.convertOffsetToCanvas(b),d=[c[0]-d[0],c[1]-d[1]];this.offset[0]+=
+d[0];this.offset[1]+=d[1];this.dirty_bgcanvas=this.dirty_canvas=!0};h.prototype.convertOffsetToCanvas=function(a,b){b=b||[];b[0]=a[0]/this.scale-this.offset[0];b[1]=a[1]/this.scale-this.offset[1];return b};h.prototype.convertCanvasToOffset=function(a,b){b=b||[];b[0]=(a[0]+this.offset[0])*this.scale;b[1]=(a[1]+this.offset[1])*this.scale;return b};h.prototype.convertEventToCanvas=function(a){var b=this.canvas.getBoundingClientRect();return this.convertOffsetToCanvas([a.pageX-b.left,a.pageY-b.top])};
+h.prototype.bringToFront=function(a){var b=this.graph._nodes.indexOf(a);-1!=b&&(this.graph._nodes.splice(b,1),this.graph._nodes.push(a))};h.prototype.sendToBack=function(a){var b=this.graph._nodes.indexOf(a);-1!=b&&(this.graph._nodes.splice(b,1),this.graph._nodes.unshift(a))};var s=new Float32Array(4);h.prototype.computeVisibleNodes=function(a,b){var d=b||[];d.length=0;a=a||this.graph._nodes;for(var c=0,f=a.length;c<f;++c){var e=a[c];(!this.live_mode||e.onDrawBackground||e.onDrawForeground)&&q(this.visible_area,
+e.getBounding(s))&&d.push(e)}return d};h.prototype.draw=function(a,b){if(this.canvas){var d=l.getTime();this.render_time=0.001*(d-this.last_draw_time);this.last_draw_time=d;if(this.graph){var c=[-this.offset[0],-this.offset[1]],f=[c[0]+this.canvas.width/this.scale,c[1]+this.canvas.height/this.scale];this.visible_area=new Float32Array([c[0],c[1],f[0]-c[0],f[1]-c[1]])}(this.dirty_bgcanvas||b||this.always_render_background||this.graph&&this.graph._last_trigger_time&&1E3>d-this.graph._last_trigger_time)&&
+this.drawBackCanvas();(this.dirty_canvas||a)&&this.drawFrontCanvas();this.fps=this.render_time?1/this.render_time:0;this.frame+=1}};h.prototype.drawFrontCanvas=function(){this.ctx||(this.ctx=this.bgcanvas.getContext("2d"));var a=this.ctx;if(a){a.start2D&&a.start2D();var b=this.canvas;a.restore();a.setTransform(1,0,0,1,0,0);this.dirty_area&&(a.save(),a.beginPath(),a.rect(this.dirty_area[0],this.dirty_area[1],this.dirty_area[2],this.dirty_area[3]),a.clip());this.clear_background&&a.clearRect(0,0,b.width,
+b.height);this.bgcanvas==this.canvas?this.drawBackCanvas():a.drawImage(this.bgcanvas,0,0);if(this.onRender)this.onRender(b,a);this.show_info&&this.renderInfo(a);if(this.graph){a.save();a.scale(this.scale,this.scale);a.translate(this.offset[0],this.offset[1]);for(var b=this.computeVisibleNodes(null,this.visible_nodes),d=0;d<b.length;++d){var c=b[d];a.save();a.translate(c.pos[0],c.pos[1]);this.drawNode(c,a);a.restore()}this.graph.config.links_ontop&&(this.live_mode||this.drawConnections(a));if(null!=
+this.connecting_pos){a.lineWidth=this.connections_width;b=null;switch(this.connecting_output.type){case l.EVENT:b="#F85";break;default:b="#AFA"}this.renderLink(a,this.connecting_pos,[this.canvas_mouse[0],this.canvas_mouse[1]],null,!1,null,b);a.beginPath();this.connecting_output.type===l.EVENT?a.rect(this.connecting_pos[0]-6+0.5,this.connecting_pos[1]-5+0.5,14,10):a.arc(this.connecting_pos[0],this.connecting_pos[1],4,0,2*Math.PI);a.fill();a.fillStyle="#ffcc00";this._highlight_input&&(a.beginPath(),
+a.arc(this._highlight_input[0],this._highlight_input[1],6,0,2*Math.PI),a.fill())}this.dragging_rectangle&&(a.strokeStyle="#FFF",a.strokeRect(this.dragging_rectangle[0],this.dragging_rectangle[1],this.dragging_rectangle[2],this.dragging_rectangle[3]));a.restore()}this.dirty_area&&a.restore();a.finish2D&&a.finish2D();this.dirty_canvas=!1;this.gui_mouse.clicked=!1}};h.prototype.renderInfo=function(a,b,d){b=b||0;d=d||0;a.save();a.translate(b,d);a.font="10px Arial";a.fillStyle="#888";this.graph?(a.fillText("T: "+
+this.graph.globaltime.toFixed(2)+"s",5,13),a.fillText("I: "+this.graph.iteration,5,26),a.fillText("F: "+this.frame,5,39),a.fillText("FPS:"+this.fps.toFixed(2),5,52)):a.fillText("No graph selected",5,13);a.restore()};h.prototype.drawBackCanvas=function(){var a=this.bgcanvas;if(a.width!=this.canvas.width||a.height!=this.canvas.height)a.width=this.canvas.width,a.height=this.canvas.height;this.bgctx||(this.bgctx=this.bgcanvas.getContext("2d"));var b=this.bgctx;b.start&&b.start();this.clear_background&&
+b.clearRect(0,0,a.width,a.height);this._graph_stack&&this._graph_stack.length&&(b.strokeStyle=this._graph_stack[this._graph_stack.length-1].bgcolor,b.lineWidth=10,b.strokeRect(1,1,a.width-2,a.height-2),b.lineWidth=1);b.restore();b.setTransform(1,0,0,1,0,0);if(this.graph){b.save();b.scale(this.scale,this.scale);b.translate(this.offset[0],this.offset[1]);if(this.background_image&&0.5<this.scale){b.globalAlpha=this.zoom_modify_alpha?(1-0.5/this.scale)*this.editor_alpha:this.editor_alpha;b.imageSmoothingEnabled=
+b.mozImageSmoothingEnabled=b.imageSmoothingEnabled=!1;if(!this._bg_img||this._bg_img.name!=this.background_image){this._bg_img=new Image;this._bg_img.name=this.background_image;this._bg_img.src=this.background_image;var d=this;this._bg_img.onload=function(){d.draw(!0,!0)}}var c=null;null==this._pattern&&0<this._bg_img.width?(c=b.createPattern(this._bg_img,"repeat"),this._pattern_img=this._bg_img,this._pattern=c):c=this._pattern;c&&(b.fillStyle=c,b.fillRect(this.visible_area[0],this.visible_area[1],
+this.visible_area[2],this.visible_area[3]),b.fillStyle="transparent");b.globalAlpha=1;b.imageSmoothingEnabled=b.mozImageSmoothingEnabled=b.imageSmoothingEnabled=!0}if(this.onBackgroundRender)this.onBackgroundRender(a,b);this.render_canvas_border&&(b.strokeStyle="#235",b.strokeRect(0,0,a.width,a.height));this.render_connections_shadows?(b.shadowColor="#000",b.shadowOffsetX=0,b.shadowOffsetY=0,b.shadowBlur=6):b.shadowColor="rgba(0,0,0,0)";this.live_mode||this.drawConnections(b);b.shadowColor="rgba(0,0,0,0)";
+b.restore()}b.finish&&b.finish();this.dirty_bgcanvas=!1;this.dirty_canvas=!0};var c=new Float32Array(2);h.prototype.drawNode=function(a,b){var d=a.color||l.NODE_DEFAULT_COLOR,e=!0;if(a.flags.skip_title_render||a.graph.isLive())e=!1;a.mouseOver&&(e=!0);a.selected||(this.render_shadows?(b.shadowColor="rgba(0,0,0,0.5)",b.shadowOffsetX=2,b.shadowOffsetY=2,b.shadowBlur=3):b.shadowColor="transparent");if(this.live_mode){if(!a.flags.collapsed&&(b.shadowColor="transparent",a.onDrawForeground))a.onDrawForeground(b,
+this)}else{var f=this.editor_alpha;b.globalAlpha=f;var n=a._shape||l.BOX_SHAPE;c.set(a.size);a.flags.collapsed&&(c[0]=l.NODE_COLLAPSED_WIDTH,c[1]=0);a.flags.clip_area&&(b.save(),n==l.BOX_SHAPE?(b.beginPath(),b.rect(0,0,c[0],c[1])):n==l.ROUND_SHAPE?b.roundRect(0,0,c[0],c[1],10):n==l.CIRCLE_SHAPE&&(b.beginPath(),b.arc(0.5*c[0],0.5*c[1],0.5*c[0],0,2*Math.PI)),b.clip());this.drawNodeShape(a,b,c,d,a.bgcolor,!e,a.selected);b.shadowColor="transparent";b.textAlign="left";b.font=this.inner_text_font;e=0.6<
+this.scale;n=this.connecting_output;if(!a.flags.collapsed){if(a.inputs)for(var k=0;k<a.inputs.length;k++){var h=a.inputs[k];b.globalAlpha=f;this.connecting_node&&l.isValidConnection(h.type&&n.type)&&(b.globalAlpha=0.4*f);b.fillStyle=null!=h.link?this.default_connection_color.input_on:this.default_connection_color.input_off;var g=a.getConnectionPos(!0,k);g[0]-=a.pos[0];g[1]-=a.pos[1];b.beginPath();h.type===l.EVENT?b.rect(g[0]-6+0.5,g[1]-5+0.5,14,10):b.arc(g[0],g[1],4,0,2*Math.PI);b.fill();e&&(h=null!=
+h.label?h.label:h.name)&&(b.fillStyle=d,b.fillText(h,g[0]+10,g[1]+5))}this.connecting_node&&(b.globalAlpha=0.4*f);b.lineWidth=1;b.textAlign="right";b.strokeStyle="black";if(a.outputs)for(k=0;k<a.outputs.length;k++)if(h=a.outputs[k],g=a.getConnectionPos(!1,k),g[0]-=a.pos[0],g[1]-=a.pos[1],b.fillStyle=h.links&&h.links.length?this.default_connection_color.output_on:this.default_connection_color.output_off,b.beginPath(),h.type===l.EVENT?b.rect(g[0]-6+0.5,g[1]-5+0.5,14,10):b.arc(g[0],g[1],4,0,2*Math.PI),
+b.fill(),b.stroke(),e&&(h=null!=h.label?h.label:h.name))b.fillStyle=d,b.fillText(h,g[0]-10,g[1]+5);b.textAlign="left";b.globalAlpha=1;if(a.onDrawForeground)a.onDrawForeground(b,this)}a.flags.clip_area&&b.restore();b.globalAlpha=1}};h.prototype.drawNodeShape=function(a,b,d,c,f,e,k){b.strokeStyle=c||l.NODE_DEFAULT_COLOR;b.fillStyle=f||l.NODE_DEFAULT_BGCOLOR;f=l.NODE_TITLE_HEIGHT;var h=a._shape||l.BOX_SHAPE;h==l.BOX_SHAPE?(b.beginPath(),b.rect(0,e?0:-f,d[0]+1,e?d[1]:d[1]+f),b.fill(),b.shadowColor="transparent",
+k&&(b.strokeStyle="#CCC",b.strokeRect(-0.5,e?-0.5:-f+-0.5,d[0]+2,e?d[1]+2:d[1]+f+2-1),b.strokeStyle=c)):h==l.ROUND_SHAPE?(b.roundRect(0,e?0:-f,d[0],e?d[1]:d[1]+f,10),b.fill()):h==l.CIRCLE_SHAPE&&(b.beginPath(),b.arc(0.5*d[0],0.5*d[1],0.5*d[0],0,2*Math.PI),b.fill());b.shadowColor="transparent";a.bgImage&&a.bgImage.width&&b.drawImage(a.bgImage,0.5*(d[0]-a.bgImage.width),0.5*(d[1]-a.bgImage.height));a.bgImageUrl&&!a.bgImage&&(a.bgImage=a.loadImage(a.bgImageUrl));if(a.onDrawBackground)a.onDrawBackground(b,
+this);e||(b.fillStyle=c||l.NODE_DEFAULT_COLOR,c=b.globalAlpha,b.globalAlpha=0.5*c,h==l.BOX_SHAPE?(b.beginPath(),b.rect(0,-f,d[0]+1,f),b.fill()):h==l.ROUND_SHAPE&&(b.roundRect(0,-f,d[0],f,10,0),b.fill()),b.fillStyle=a.boxcolor||l.NODE_DEFAULT_BOXCOLOR,b.beginPath(),h==l.ROUND_SHAPE||h==l.CIRCLE_SHAPE?b.arc(0.5*f,-0.5*f,0.5*(f-6),0,2*Math.PI):b.rect(3,-f+3,f-6,f-6),b.fill(),b.globalAlpha=c,b.font=this.title_text_font,(a=a.getTitle())&&0.5<this.scale&&(b.fillStyle=this.node_title_color,b.fillText(a,
+16,13-f)))};h.prototype.drawNodeCollapsed=function(a,b,c,e){b.strokeStyle=c||l.NODE_DEFAULT_COLOR;b.fillStyle=e||l.NODE_DEFAULT_BGCOLOR;c=l.NODE_COLLAPSED_RADIUS;e=a._shape||l.BOX_SHAPE;e==l.CIRCLE_SHAPE?(b.beginPath(),b.arc(0.5*a.size[0],0.5*a.size[1],c,0,2*Math.PI),b.fill(),b.shadowColor="rgba(0,0,0,0)",b.stroke(),b.fillStyle=a.boxcolor||l.NODE_DEFAULT_BOXCOLOR,b.beginPath(),b.arc(0.5*a.size[0],0.5*a.size[1],0.5*c,0,2*Math.PI)):e==l.ROUND_SHAPE?(b.beginPath(),b.roundRect(0.5*a.size[0]-c,0.5*a.size[1]-
+c,2*c,2*c,5),b.fill(),b.shadowColor="rgba(0,0,0,0)",b.stroke(),b.fillStyle=a.boxcolor||l.NODE_DEFAULT_BOXCOLOR,b.beginPath(),b.roundRect(0.5*a.size[0]-0.5*c,0.5*a.size[1]-0.5*c,c,c,2)):(b.beginPath(),b.rect(0,0,a.size[0],2*c),b.fill(),b.shadowColor="rgba(0,0,0,0)",b.stroke(),b.fillStyle=a.boxcolor||l.NODE_DEFAULT_BOXCOLOR,b.beginPath(),b.rect(0.5*c,0.5*c,c,c));b.fill()};h.prototype.drawConnections=function(a){var b=l.getTime();a.lineWidth=this.connections_width;a.fillStyle="#AAA";a.strokeStyle="#AAA";
+a.globalAlpha=this.editor_alpha;for(var c=0,e=this.graph._nodes.length;c<e;++c){var f=this.graph._nodes[c];if(f.inputs&&f.inputs.length)for(var h=0;h<f.inputs.length;++h){var k=f.inputs[h];if(k&&null!=k.link&&(k=this.graph.links[k.link])){var g=this.graph.getNodeById(k.origin_id);if(null!=g){var m=k.origin_slot,p=null,p=-1==m?[g.pos[0]+10,g.pos[1]+10]:g.getConnectionPos(!1,m);this.renderLink(a,p,f.getConnectionPos(!0,h),k);k&&k._last_time&&1E3>b-k._last_time&&(g=2-0.002*(b-k._last_time),m="rgba(255,255,255, "+
+g.toFixed(2)+")",this.renderLink(a,p,f.getConnectionPos(!0,h),k,!0,g,m))}}}}a.globalAlpha=1};h.prototype.renderLink=function(a,b,c,e,f,g,k){if(this.highquality_render){var t=m(b,c);this.render_connections_border&&0.6<this.scale&&(a.lineWidth=this.connections_width+4);!k&&e&&(k=h.link_type_colors[e.type]);k||(k=this.default_link_color);null!=e&&this.highlighted_links[e.id]&&(k="#FFF");a.beginPath();this.render_curved_connections?(a.moveTo(b[0],b[1]),a.bezierCurveTo(b[0]+0.25*t,b[1],c[0]-0.25*t,c[1],
+c[0],c[1])):(a.moveTo(b[0]+10,b[1]),a.lineTo(0.5*(b[0]+10+(c[0]-10)),b[1]),a.lineTo(0.5*(b[0]+10+(c[0]-10)),c[1]),a.lineTo(c[0]-10,c[1]));this.render_connections_border&&0.6<this.scale&&!f&&(a.strokeStyle="rgba(0,0,0,0.5)",a.stroke());a.lineWidth=this.connections_width;a.fillStyle=a.strokeStyle=k;a.stroke();this.render_connection_arrows&&0.6<=this.scale&&this.render_connection_arrows&&0.6<this.scale&&(e=this.computeConnectionPoint(b,c,0.5),f=this.computeConnectionPoint(b,c,0.51),k=0,k=this.render_curved_connections?
+-Math.atan2(f[0]-e[0],f[1]-e[1]):c[1]>b[1]?0:Math.PI,a.save(),a.translate(e[0],e[1]),a.rotate(k),a.beginPath(),a.moveTo(-5,-5),a.lineTo(0,5),a.lineTo(5,-5),a.fill(),a.restore());if(g)for(g=0;5>g;++g)e=(0.001*l.getTime()+0.2*g)%1,e=this.computeConnectionPoint(b,c,e),a.beginPath(),a.arc(e[0],e[1],5,0,2*Math.PI),a.fill()}else a.beginPath(),a.moveTo(b[0],b[1]),a.lineTo(c[0],c[1]),a.stroke()};h.prototype.computeConnectionPoint=function(a,b,c){var e=m(a,b),f=[a[0]+0.25*e,a[1]],e=[b[0]-0.25*e,b[1]],h=(1-
+c)*(1-c)*(1-c),k=3*(1-c)*(1-c)*c,g=3*(1-c)*c*c;c*=c*c;return[h*a[0]+k*f[0]+g*e[0]+c*b[0],h*a[1]+k*f[1]+g*e[1]+c*b[1]]};h.prototype.guiButton=function(a,b,c,e){e=this.gui_mouse;var f=e.clicked&&e.position[0]>=b[0]&&e.position[1]>=b[1]&&e.position[0]<b[0]+b[2]&&e.position[1]<b[1]+b[3];a.fillStyle=f?"#AAA":"#333";a.fillRect(b[0],b[1],b[2],b[3]);a.strokeStyle="#AAA";a.strokeRect(b[0],b[1],b[2],b[3]);a.fillStyle=f?"#AAA":"#000";a.fillText(c,b[0]+0.5*b[2],b[1]+0.75*b[3]);f&&(e.blocked=!0)};h.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)};h.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 e=setInterval(function(){b.editor_alpha*=c;b.dirty_canvas=!0;b.dirty_bgcanvas=!0;1>
+c&&0.01>b.editor_alpha&&(clearInterval(e),1>c&&(b.live_mode=!0));1<c&&0.99<b.editor_alpha&&(clearInterval(e),b.editor_alpha=1)},1)}else this.live_mode=!this.live_mode,this.dirty_bgcanvas=this.dirty_canvas=!0};h.prototype.onNodeSelectionChange=function(a){};h.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 e=this.getCanvasWindow(),f=e.document.createEvent("MouseEvent");
+f.initMouseEvent(c,!0,!0,e,1,b.screenX,b.screenY,b.clientX,b.clientY,!1,!1,!1,!1,0,null);b.target.dispatchEvent(f);a.preventDefault()};h.onMenuAdd=function(a,b,c,e){function f(a,b){var c=e.getFirstEvent(),d=l.createNode(a.value);d&&(d.pos=g.convertEventToCanvas(c),g.graph.add(d))}var g=h.active_canvas,k=g.getCanvasWindow();a=l.getNodeTypesCategories();b=[];for(var m in a)a[m]&&b.push({value:a[m],content:a[m],has_submenu:!0});var p=new l.ContextMenu(b,{event:c,callback:function(a,b,c){a=l.getNodeTypesInCategory(a.value);
+b=[];for(var d in a)b.push({content:a[d].title,value:a[d].type});new l.ContextMenu(b,{event:c,callback:f,parentMenu:p},k);return!1},parentMenu:e},k);return!1};h.onMenuCollapseAll=function(){};h.onMenuNodeEdit=function(){};h.showMenuNodeOptionalInputs=function(a,b,c,e,f){function g(a,b,c){f&&(a.callback&&a.callback.call(k,f,a,b,c),a.value&&(f.addInput(a.value[0],a.value[1],a.value[2]),f.setDirtyCanvas(!0,!0)))}if(f){var k=this;a=h.active_canvas.getCanvasWindow();b=f.optional_inputs;f.onGetInputs&&
+(b=f.onGetInputs());var m=[];if(b)for(var p in b){var q=b[p];if(q){var r=q[0];q[2]&&q[2].label&&(r=q[2].label);r={content:r,value:q};q[1]==l.ACTION&&(r.className="event");m.push(r)}else m.push(null)}this.onMenuNodeInputs&&(m=this.onMenuNodeInputs(m));if(m.length)return new l.ContextMenu(m,{event:c,callback:g,parentMenu:e,node:f},a),!1}};h.showMenuNodeOptionalOutputs=function(a,b,c,e,f){function g(a,b,c){if(f&&(a.callback&&a.callback.call(k,f,a,b,c),a.value))if(c=a.value[1],!c||c.constructor!==Object&&
+c.constructor!==Array)f.addOutput(a.value[0],a.value[1],a.value[2]),f.setDirtyCanvas(!0,!0);else{a=[];for(var d in c)a.push({content:d,value:c[d]});new l.ContextMenu(a,{event:b,callback:g,parentMenu:e,node:f});return!1}}if(f){var k=this;a=h.active_canvas.getCanvasWindow();b=f.optional_outputs;f.onGetOutputs&&(b=f.onGetOutputs());var m=[];if(b)for(var p in b){var q=b[p];if(!q)m.push(null);else if(!f.flags||!f.flags.skip_repeated_outputs||-1==f.findOutputSlot(q[0])){var r=q[0];q[2]&&q[2].label&&(r=
+q[2].label);r={content:r,value:q};q[1]==l.EVENT&&(r.className="event");m.push(r)}}this.onMenuNodeOutputs&&(m=this.onMenuNodeOutputs(m));if(m.length)return new l.ContextMenu(m,{event:c,callback:g,parentMenu:e,node:f},a),!1}};h.onShowMenuNodeProperties=function(a,b,c,e,f){function g(a,b,c,d){f&&(b=this.getBoundingClientRect(),k.showEditPropertyValue(f,a.value,{position:[b.left,b.top]}))}if(f&&f.properties){var k=h.active_canvas;b=k.getCanvasWindow();var m=[],p;for(p in f.properties)a=void 0!==f.properties[p]?
+f.properties[p]:" ",a=h.decodeHTML(a),m.push({content:"<span class='property_name'>"+p+"</span><span class='property_value'>"+a+"</span>",value:p});if(m.length)return new l.ContextMenu(m,{event:c,callback:g,parentMenu:e,allow_html:!0,node:f},b),!1}};h.decodeHTML=function(a){var b=document.createElement("div");b.innerText=a;return b.innerHTML};h.onResizeNode=function(a,b,c,e,f){f&&(f.size=f.computeSize(),f.setDirtyCanvas(!0,!0))};h.onShowTitleEditor=function(a,b,c,e,f){function g(){f.title=m.value;
+k.parentNode.removeChild(k);f.setDirtyCanvas(!0,!0)}var k=document.createElement("div");k.className="graphdialog";k.innerHTML="<span class='name'>Title</span><input autofocus type='text' class='value'/><button>OK</button>";var m=k.querySelector("input");m&&(m.value=f.title,m.addEventListener("keydown",function(a){13==a.keyCode&&(g(),a.preventDefault(),a.stopPropagation())}));a=h.active_canvas.canvas;b=a.getBoundingClientRect();e=c=-20;b&&(c-=b.left,e-=b.top);event?(k.style.left=event.pageX+c+"px",
+k.style.top=event.pageY+e+"px"):(k.style.left=0.5*a.width+c+"px",k.style.top=0.5*a.height+e+"px");k.querySelector("button").addEventListener("click",g);a.parentNode.appendChild(k)};h.prototype.showEditPropertyValue=function(a,b,c){function e(){f(q.value)}function f(c){"number"==typeof a.properties[b]&&(c=Number(c));a.properties[b]=c;if(a.onPropertyChanged)a.onPropertyChanged(b,c);p.close();a.setDirtyCanvas(!0,!0)}if(a&&void 0!==a.properties[b]){c=c||{};var h="string";null!==a.properties[b]&&(h=typeof a.properties[b]);
+var k=null;a.getPropertyInfo&&(k=a.getPropertyInfo(b));if(a.properties_info)for(var g=0;g<a.properties_info.length;++g)if(a.properties_info[g].name==b){k=a.properties_info[g];break}void 0!==k&&null!==k&&k.type&&(h=k.type);var m="";if("string"==h||"number"==h)m="<input autofocus type='text' class='value'/>";else if("enum"==h&&k.values){m="<select autofocus type='text' class='value'>";for(g in k.values)var l=k.values.constructor===Array?k.values[g]:g,m=m+("<option value='"+l+"' "+(l==a.properties[b]?
+"selected":"")+">"+k.values[g]+"</option>");m+="</select>"}else"boolean"==h&&(m="<input autofocus type='checkbox' class='value' "+(a.properties[b]?"checked":"")+"/>");var p=this.createDialog("<span class='name'>"+b+"</span>"+m+"<button>OK</button>",c);if("enum"==h&&k.values){var q=p.querySelector("select");q.addEventListener("change",function(a){f(a.target.value)})}else if("boolean"==h)(q=p.querySelector("input"))&&q.addEventListener("click",function(a){f(!!q.checked)});else if(q=p.querySelector("input"))q.value=
+void 0!==a.properties[b]?a.properties[b]:"",q.addEventListener("keydown",function(a){13==a.keyCode&&(e(),a.preventDefault(),a.stopPropagation())});p.querySelector("button").addEventListener("click",e)}};h.prototype.createDialog=function(a,b){b=b||{};var c=document.createElement("div");c.className="graphdialog";c.innerHTML=a;var e=this.canvas.getBoundingClientRect(),f=-20,h=-20;e&&(f-=e.left,h-=e.top);b.position?(f+=b.position[0],h+=b.position[1]):b.event?(f+=b.event.pageX,h+=b.event.pageY):(f+=0.5*
+this.canvas.width,h+=0.5*this.canvas.height);c.style.left=f+"px";c.style.top=h+"px";this.canvas.parentNode.appendChild(c);c.close=function(){this.parentNode&&this.parentNode.removeChild(this)};return c};h.onMenuNodeCollapse=function(a,b,c,e,f){f.flags.collapsed=!f.flags.collapsed;f.setDirtyCanvas(!0,!0)};h.onMenuNodePin=function(a,b,c,e,f){f.pin()};h.onMenuNodeMode=function(a,b,c,e,f){new l.ContextMenu(["Always","On Event","On Trigger","Never"],{event:c,callback:function(a){if(f)switch(a){case "On Event":f.mode=
+l.ON_EVENT;break;case "On Trigger":f.mode=l.ON_TRIGGER;break;case "Never":f.mode=l.NEVER;break;default:f.mode=l.ALWAYS}},parentMenu:e,node:f});return!1};h.onMenuNodeColors=function(a,b,c,e,f){if(!f)throw"no node for color";b=[];for(var g in h.node_colors)a=h.node_colors[g],a={value:g,content:"<span style='display: block; color:"+a.color+"; background-color:"+a.bgcolor+"'>"+g+"</span>"},b.push(a);new l.ContextMenu(b,{event:c,callback:function(a){f&&(a=h.node_colors[a.value])&&(f.color=a.color,f.bgcolor=
+a.bgcolor,f.setDirtyCanvas(!0))},parentMenu:e,node:f});return!1};h.onMenuNodeShapes=function(a,b,c,e,f){if(!f)throw"no node passed";new l.ContextMenu(l.VALID_SHAPES,{event:c,callback:function(a){f&&(f.shape=a,f.setDirtyCanvas(!0))},parentMenu:e,node:f});return!1};h.onMenuNodeRemove=function(a,b,c,e,f){if(!f)throw"no node passed";!1!=f.removable&&(f.graph.remove(f),f.setDirtyCanvas(!0,!0))};h.onMenuNodeClone=function(a,b,c,e,f){!1!=f.clonable&&(a=f.clone())&&(a.pos=[f.pos[0]+5,f.pos[1]+5],f.graph.add(a),
+f.setDirtyCanvas(!0,!0))};h.node_colors={red:{color:"#FAA",bgcolor:"#944"},green:{color:"#AFA",bgcolor:"#494"},blue:{color:"#AAF",bgcolor:"#449"},cyan:{color:"#AFF",bgcolor:"#499"},purple:{color:"#FAF",bgcolor:"#949"},yellow:{color:"#FFA",bgcolor:"#994"},black:{color:"#777",bgcolor:"#000"},white:{color:"#FFF",bgcolor:"#AAA"}};h.prototype.getCanvasMenuOptions=function(){var a=null;this.getMenuOptions?a=this.getMenuOptions():(a=[{content:"Add Node",has_submenu:!0,callback:h.onMenuAdd}],this._graph_stack&&
+0<this._graph_stack.length&&(a=[{content:"Close subgraph",callback:this.closeSubgraph.bind(this)},null].concat(a)));if(this.getExtraMenuOptions){var b=this.getExtraMenuOptions(this,a);b&&(a=a.concat(b))}return a};h.prototype.getNodeMenuOptions=function(a){var b=null,b=a.getMenuOptions?a.getMenuOptions(this):[{content:"Inputs",has_submenu:!0,disabled:!0,callback:h.showMenuNodeOptionalInputs},{content:"Outputs",has_submenu:!0,disabled:!0,callback:h.showMenuNodeOptionalOutputs},null,{content:"Properties",
+has_submenu:!0,callback:h.onShowMenuNodeProperties},null,{content:"Title",callback:h.onShowTitleEditor},{content:"Mode",has_submenu:!0,callback:h.onMenuNodeMode},{content:"Resize",callback:h.onResizeNode},{content:"Collapse",callback:h.onMenuNodeCollapse},{content:"Pin",callback:h.onMenuNodePin},{content:"Colors",has_submenu:!0,callback:h.onMenuNodeColors},{content:"Shapes",has_submenu:!0,callback:h.onMenuNodeShapes},null];if(a.getExtraMenuOptions){var c=a.getExtraMenuOptions(this);c&&(c.push(null),
+b=c.concat(b))}!1!==a.clonable&&b.push({content:"Clone",callback:h.onMenuNodeClone});!1!==a.removable&&b.push(null,{content:"Remove",callback:h.onMenuNodeRemove});a.onGetInputs&&(c=a.onGetInputs())&&c.length&&(b[0].disabled=!1);a.onGetOutputs&&(c=a.onGetOutputs())&&c.length&&(b[1].disabled=!1);if(a.graph&&a.graph.onGetNodeMenuOptions)a.graph.onGetNodeMenuOptions(b,a);return b};h.prototype.processContextMenu=function(a,b){var c=this,e=h.active_canvas.getCanvasWindow(),f=null,g={event:b,callback:function(b,
+f,e){if(b)if("Remove Slot"==b.content){var k=b.slot;k.input?a.removeInput(k.slot):k.output&&a.removeOutput(k.slot)}else if("Rename Slot"==b.content){var k=b.slot,h=c.createDialog("<span class='name'>Name</span><input type='text'/><button>OK</button>",f),g=h.querySelector("input");h.querySelector("button").addEventListener("click",function(b){if(g.value){if(b=k.input?a.getInputInfo(k.slot):a.getOutputInfo(k.slot))b.label=g.value;c.setDirty(!0)}h.close()})}},node:a},k=null;a&&(k=a.getSlotInPosition(b.canvasX,
+b.canvasY),h.active_node=a);k?(f=[],f.push(k.locked?"Cannot remove":{content:"Remove Slot",slot:k}),f.push({content:"Rename Slot",slot:k}),g.title=(k.input?k.input.type:k.output.type)||"*",k.input&&k.input.type==l.ACTION&&(g.title="Action"),k.output&&k.output.type==l.EVENT&&(g.title="Event")):f=a?this.getNodeMenuOptions(a):this.getCanvasMenuOptions();f&&new l.ContextMenu(f,g,e)};this.CanvasRenderingContext2D&&(CanvasRenderingContext2D.prototype.roundRect=function(a,b,c,e,f,h){void 0===f&&(f=5);void 0===
+h&&(h=f);this.beginPath();this.moveTo(a+f,b);this.lineTo(a+c-f,b);this.quadraticCurveTo(a+c,b,a+c,b+f);this.lineTo(a+c,b+e-h);this.quadraticCurveTo(a+c,b+e,a+c-h,b+e);this.lineTo(a+h,b+e);this.quadraticCurveTo(a,b+e,a,b+e-h);this.lineTo(a,b+f);this.quadraticCurveTo(a,b,a+f,b)});l.compareObjects=function(a,b){for(var c in a)if(a[c]!=b[c])return!1;return!0};l.distance=m;l.colorToString=function(a){return"rgba("+Math.round(255*a[0]).toFixed()+","+Math.round(255*a[1]).toFixed()+","+Math.round(255*a[2]).toFixed()+
+","+(4==a.length?a[3].toFixed(2):"1.0")+")"};l.isInsideRectangle=p;l.growBounding=function(a,b,c){b<a[0]?a[0]=b:b>a[2]&&(a[2]=b);c<a[1]?a[1]=c:c>a[3]&&(a[3]=c)};l.isInsideBounding=function(a,b){return a[0]<b[0][0]||a[1]<b[0][1]||a[0]>b[1][0]||a[1]>b[1][1]?!1:!0};l.overlapBounding=q;l.hex2num=function(a){"#"==a.charAt(0)&&(a=a.slice(1));a=a.toUpperCase();for(var b=Array(3),c=0,e,f,h=0;6>h;h+=2)e="0123456789ABCDEF".indexOf(a.charAt(h)),f="0123456789ABCDEF".indexOf(a.charAt(h+1)),b[c]=16*e+f,c++;return b};
+l.num2hex=function(a){for(var b="#",c,e,f=0;3>f;f++)c=a[f]/16,e=a[f]%16,b+="0123456789ABCDEF".charAt(c)+"0123456789ABCDEF".charAt(e);return b};r.prototype.addItem=function(a,b,c){function e(a){var b=this.value;b&&b.has_submenu&&f.call(this,a)}function f(a){var b=this.value,e=!0;h.current_submenu&&h.current_submenu.close(a);if(c.callback){var f=c.callback.call(this,b,c,a,h,c.node);!0===f&&(e=!1)}if(b&&(b.callback&&!c.ignore_item_callbacks&&!0!==b.disabled&&(f=b.callback.call(this,b,c,a,h,c.node),!0===
+f&&(e=!1)),b.submenu)){if(!b.submenu.options)throw"ContextMenu submenu needs options";new h.constructor(b.submenu.options,{callback:b.submenu.callback,event:a,parentMenu:h,ignore_item_callbacks:b.submenu.ignore_item_callbacks,title:b.submenu.title,autoopen:c.autoopen});e=!1}e&&!h.lock&&h.close()}var h=this;c=c||{};var k=document.createElement("div");k.className="litemenu-entry submenu";var g=!1;if(null===b)k.classList.add("separator");else{k.innerHTML=b&&b.title?b.title:a;if(k.value=b)b.disabled&&
+(g=!0,k.classList.add("disabled")),(b.submenu||b.has_submenu)&&k.classList.add("has_submenu");"function"==typeof b?(k.dataset.value=a,k.onclick_callback=b):k.dataset.value=b;b.className&&(k.className+=" "+b.className)}this.root.appendChild(k);g||k.addEventListener("click",f);c.autoopen&&k.addEventListener("mouseenter",e);return k};r.prototype.close=function(a,b){this.root.parentNode&&this.root.parentNode.removeChild(this.root);this.parentMenu&&!b&&(this.parentMenu.lock=!1,this.parentMenu.current_submenu=
+null,void 0===a?this.parentMenu.close():a&&!r.isCursorOverElement(a,this.parentMenu.root)&&r.trigger(this.parentMenu.root,"mouseleave",a));this.current_submenu&&this.current_submenu.close(a,!0)};r.trigger=function(a,b,c,e){var f=document.createEvent("CustomEvent");f.initCustomEvent(b,!0,!0,c);f.srcElement=e;a.dispatchEvent?a.dispatchEvent(f):a.__events&&a.__events.dispatchEvent(f);return f};r.prototype.getTopMenu=function(){return this.options.parentMenu?this.options.parentMenu.getTopMenu():this};
+r.prototype.getFirstEvent=function(){return this.options.parentMenu?this.options.parentMenu.getFirstEvent():this.options.event};r.isCursorOverElement=function(a,b){var c=a.pageX,e=a.pageY,f=b.getBoundingClientRect();return f?e>f.top&&e<f.top+f.height&&c>f.left&&c<f.left+f.width?!0:!1:!1};l.ContextMenu=r;l.closeAllContextMenus=function(a){a=a||window;a=a.document.querySelectorAll(".litecontextmenu");if(a.length){for(var b=[],c=0;c<a.length;c++)b.push(a[c]);for(c in b)b[c].close?b[c].close():b[c].parentNode&&
+b[c].parentNode.removeChild(b[c])}};l.extendClass=function(a,b){for(var c in b)a.hasOwnProperty(c)||(a[c]=b[c]);if(b.prototype)for(c in b.prototype)b.prototype.hasOwnProperty(c)&&!a.prototype.hasOwnProperty(c)&&(b.prototype.__lookupGetter__(c)?a.prototype.__defineGetter__(c,b.prototype.__lookupGetter__(c)):a.prototype[c]=b.prototype[c],b.prototype.__lookupSetter__(c)&&a.prototype.__defineSetter__(c,b.prototype.__lookupSetter__(c)))};l.getParameterNames=function(a){return(a+"").replace(/[/][/].*$/mg,
+"").replace(/\s+/g,"").replace(/[/][*][^/*]*[*][/]/g,"").split("){",1)[0].replace(/^[^(]*[(]/,"").replace(/=[^,]+/g,"").split(",").filter(Boolean)};Math.clamp=function(a,b,c){return b>a?b:c<a?c:a};"undefined"==typeof window||window.requestAnimationFrame||(window.requestAnimationFrame=window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(a){window.setTimeout(a,1E3/60)})})(this);"undefined"!=typeof exports&&(exports.LiteGraph=this.LiteGraph);
 (function(u){function g(){this.addOutput("in ms","number");this.addOutput("in sec","number")}function e(){this.size=[120,60];this.subgraph=new LGraph;this.subgraph._subgraph_node=this;this.subgraph._is_subgraph=!0;this.subgraph.onGlobalInputAdded=this.onSubgraphNewGlobalInput.bind(this);this.subgraph.onGlobalInputRenamed=this.onSubgraphRenamedGlobalInput.bind(this);this.subgraph.onGlobalInputTypeChanged=this.onSubgraphTypeChangeGlobalInput.bind(this);this.subgraph.onGlobalOutputAdded=this.onSubgraphNewGlobalOutput.bind(this);
 this.subgraph.onGlobalOutputRenamed=this.onSubgraphRenamedGlobalOutput.bind(this);this.subgraph.onGlobalOutputTypeChanged=this.onSubgraphTypeChangeGlobalOutput.bind(this);this.bgcolor="#663"}function h(){var a="input_"+(1E3*Math.random()).toFixed();this.addOutput(a,null);this.properties={name:a,type:null};var b=this;Object.defineProperty(this.properties,"name",{get:function(){return a},set:function(c){if(""!=c){var e=b.getOutputInfo(0);e.name!=c&&(e.name=c,b.graph&&b.graph.renameGlobalInput(a,c),
 a=c)}},enumerable:!0});Object.defineProperty(this.properties,"type",{get:function(){return b.outputs[0].type},set:function(c){b.outputs[0].type=c;b.graph&&b.graph.changeGlobalInputType(a,b.outputs[0].type)},enumerable:!0})}function m(){var a="output_"+(1E3*Math.random()).toFixed();this.addInput(a,null);this._value=null;this.properties={name:a,type:null};var b=this;Object.defineProperty(this.properties,"name",{get:function(){return a},set:function(c){if(""!=c){var e=b.getInputInfo(0);e.name!=c&&(e.name=
 c,b.graph&&b.graph.renameGlobalOutput(a,c),a=c)}},enumerable:!0});Object.defineProperty(this.properties,"type",{get:function(){return b.inputs[0].type},set:function(c){b.inputs[0].type=c;b.graph&&b.graph.changeGlobalInputType(a,b.inputs[0].type)},enumerable:!0})}function p(){this.addOutput("value","number");this.addProperty("value",1);this.editable={property:"value",type:"number"}}function q(){this.size=[60,20];this.addInput("value",0,{label:""});this.addOutput("value",0,{label:""});this.addProperty("value",
 "")}function r(){this.addInput("in",0);this.addOutput("out",0);this.size=[40,20]}function l(){this.mode=c.ON_EVENT;this.size=[60,20];this.addProperty("msg","");this.addInput("log",c.EVENT);this.addInput("msg",0)}function s(){this.size=[60,20];this.addProperty("onExecute","");this.addInput("in","");this.addInput("in2","");this.addOutput("out","");this.addOutput("out2","");this._func=null}var c=u.LiteGraph;g.title="Time";g.desc="Time";g.prototype.onExecute=function(){this.setOutputData(0,1E3*this.graph.globaltime);
 this.setOutputData(1,this.graph.globaltime)};c.registerNodeType("basic/time",g);e.title="Subgraph";e.desc="Graph inside a node";e.prototype.onSubgraphNewGlobalInput=function(a,b){this.addInput(a,b)};e.prototype.onSubgraphRenamedGlobalInput=function(a,b){var c=this.findInputSlot(a);-1!=c&&(this.getInputInfo(c).name=b)};e.prototype.onSubgraphTypeChangeGlobalInput=function(a,b){var c=this.findInputSlot(a);-1!=c&&(this.getInputInfo(c).type=b)};e.prototype.onSubgraphNewGlobalOutput=function(a,b){this.addOutput(a,
-b)};e.prototype.onSubgraphRenamedGlobalOutput=function(a,b){var c=this.findOutputSlot(a);-1!=c&&(this.getOutputInfo(c).name=b)};e.prototype.onSubgraphTypeChangeGlobalOutput=function(a,b){var c=this.findOutputSlot(a);-1!=c&&(this.getOutputInfo(c).type=b)};e.prototype.getExtraMenuOptions=function(a){var b=this;return[{content:"Open",callback:function(){a.openSubgraph(b.subgraph)}}]};e.prototype.onExecute=function(){if(this.inputs)for(var a=0;a<this.inputs.length;a++){var b=this.inputs[a],c=this.getInputData(a);
-this.subgraph.setGlobalInputData(b.name,c)}this.subgraph.runStep();if(this.outputs)for(a=0;a<this.outputs.length;a++)c=this.subgraph.getGlobalOutputData(this.outputs[a].name),this.setOutputData(a,c)};e.prototype.configure=function(a){LGraphNode.prototype.configure.call(this,a)};e.prototype.serialize=function(){var a=LGraphNode.prototype.serialize.call(this);a.subgraph=this.subgraph.serialize();return a};e.prototype.clone=function(){var a=c.createNode(this.type),b=this.serialize();delete b.id;delete b.inputs;
-delete b.outputs;a.configure(b);return a};c.registerNodeType("graph/subgraph",e);h.title="Input";h.desc="Input of the graph";h.prototype.onAdded=function(){this.graph.addGlobalInput(this.properties.name,this.properties.type)};h.prototype.onExecute=function(){var a=this.graph.global_inputs[this.properties.name];a&&this.setOutputData(0,a.value)};c.registerNodeType("graph/input",h);m.title="Output";m.desc="Output of the graph";m.prototype.onAdded=function(){this.graph.addGlobalOutput(this.properties.name,
-this.properties.type)};m.prototype.getValue=function(){return this._value};m.prototype.onExecute=function(){this._value=this.getInputData(0);this.graph.setGlobalOutputData(this.properties.name,this._value)};c.registerNodeType("graph/output",m);p.title="Const";p.desc="Constant value";p.prototype.setValue=function(a){"string"==typeof a&&(a=parseFloat(a));this.properties.value=a;this.setDirtyCanvas(!0)};p.prototype.onExecute=function(){this.setOutputData(0,parseFloat(this.properties.value))};p.prototype.onDrawBackground=
-function(a){this.outputs[0].label=this.properties.value.toFixed(3)};p.prototype.onWidget=function(a,b){"value"==b.name&&this.setValue(b.value)};c.registerNodeType("basic/const",p);q.title="Watch";q.desc="Show value of input";q.prototype.onExecute=function(){this.properties.value=this.getInputData(0);this.setOutputData(0,this.properties.value)};q.prototype.onDrawBackground=function(a){this.inputs[0]&&null!=this.properties.value&&(this.inputs[0].label=this.properties.value.constructor===Number?this.properties.value.toFixed(3):
-String(this.properties.value))};c.registerNodeType("basic/watch",q);r.title="Pass";r.desc="Allows to connect different types";r.prototype.onExecute=function(){this.setOutputData(0,this.getInputData(0))};c.registerNodeType("basic/pass",r);l.title="Console";l.desc="Show value inside the console";l.prototype.onAction=function(a,b){"log"==a?console.log(b):"warn"==a?console.warn(b):"error"==a&&console.error(b)};l.prototype.onExecute=function(){var a=this.getInputData(1);null!==a&&(this.properties.msg=
-a);console.log(a)};l.prototype.onGetInputs=function(){return[["log",c.ACTION],["warn",c.ACTION],["error",c.ACTION]]};c.registerNodeType("basic/console",l);s.title="Script";s.desc="executes a code";s.widgets_info={onExecute:{type:"code"}};s.prototype.onPropertyChanged=function(a,b){if("onExecute"==a&&c.allow_scripts){this._func=null;try{this._func=new Function(b)}catch(d){console.error("Error parsing script"),console.error(d)}}};s.prototype.onExecute=function(){if(this._func)try{this._func.call(this)}catch(a){console.error("Error in script"),
-console.error(a)}};c.registerNodeType("basic/script",s)})(this);
+b)};e.prototype.onSubgraphRenamedGlobalOutput=function(a,b){var c=this.findOutputSlot(a);-1!=c&&(this.getOutputInfo(c).name=b)};e.prototype.onSubgraphTypeChangeGlobalOutput=function(a,b){var c=this.findOutputSlot(a);-1!=c&&(this.getOutputInfo(c).type=b)};e.prototype.getExtraMenuOptions=function(a){var b=this;return[{content:"Open",callback:function(){a.openSubgraph(b.subgraph)}}]};e.prototype.onDrawForeground=function(a,b){b.guiButton(a,[10,10,20,20],"",function(){console.log("open")})};e.prototype.onExecute=
+function(){if(this.inputs)for(var a=0;a<this.inputs.length;a++){var b=this.inputs[a],c=this.getInputData(a);this.subgraph.setGlobalInputData(b.name,c)}this.subgraph.runStep();if(this.outputs)for(a=0;a<this.outputs.length;a++)c=this.subgraph.getGlobalOutputData(this.outputs[a].name),this.setOutputData(a,c)};e.prototype.configure=function(a){LGraphNode.prototype.configure.call(this,a)};e.prototype.serialize=function(){var a=LGraphNode.prototype.serialize.call(this);a.subgraph=this.subgraph.serialize();
+return a};e.prototype.clone=function(){var a=c.createNode(this.type),b=this.serialize();delete b.id;delete b.inputs;delete b.outputs;a.configure(b);return a};c.registerNodeType("graph/subgraph",e);h.title="Input";h.desc="Input of the graph";h.prototype.onAdded=function(){this.graph.addGlobalInput(this.properties.name,this.properties.type)};h.prototype.onExecute=function(){var a=this.graph.global_inputs[this.properties.name];a&&this.setOutputData(0,a.value)};c.registerNodeType("graph/input",h);m.title=
+"Output";m.desc="Output of the graph";m.prototype.onAdded=function(){this.graph.addGlobalOutput(this.properties.name,this.properties.type)};m.prototype.getValue=function(){return this._value};m.prototype.onExecute=function(){this._value=this.getInputData(0);this.graph.setGlobalOutputData(this.properties.name,this._value)};c.registerNodeType("graph/output",m);p.title="Const";p.desc="Constant value";p.prototype.setValue=function(a){"string"==typeof a&&(a=parseFloat(a));this.properties.value=a;this.setDirtyCanvas(!0)};
+p.prototype.onExecute=function(){this.setOutputData(0,parseFloat(this.properties.value))};p.prototype.onDrawBackground=function(a){this.outputs[0].label=this.properties.value.toFixed(3)};p.prototype.onWidget=function(a,b){"value"==b.name&&this.setValue(b.value)};c.registerNodeType("basic/const",p);q.title="Watch";q.desc="Show value of input";q.prototype.onExecute=function(){this.properties.value=this.getInputData(0);this.setOutputData(0,this.properties.value)};q.prototype.onDrawBackground=function(a){this.inputs[0]&&
+null!=this.properties.value&&(this.inputs[0].label=this.properties.value.constructor===Number?this.properties.value.toFixed(3):String(this.properties.value))};c.registerNodeType("basic/watch",q);r.title="Pass";r.desc="Allows to connect different types";r.prototype.onExecute=function(){this.setOutputData(0,this.getInputData(0))};c.registerNodeType("basic/pass",r);l.title="Console";l.desc="Show value inside the console";l.prototype.onAction=function(a,b){"log"==a?console.log(b):"warn"==a?console.warn(b):
+"error"==a&&console.error(b)};l.prototype.onExecute=function(){var a=this.getInputData(1);null!==a&&(this.properties.msg=a);console.log(a)};l.prototype.onGetInputs=function(){return[["log",c.ACTION],["warn",c.ACTION],["error",c.ACTION]]};c.registerNodeType("basic/console",l);s.title="Script";s.desc="executes a code";s.widgets_info={onExecute:{type:"code"}};s.prototype.onPropertyChanged=function(a,b){if("onExecute"==a&&c.allow_scripts){this._func=null;try{this._func=new Function(b)}catch(d){console.error("Error parsing script"),
+console.error(d)}}};s.prototype.onExecute=function(){if(this._func)try{this._func.call(this)}catch(a){console.error("Error in script"),console.error(a)}};c.registerNodeType("basic/script",s)})(this);
 (function(u){function g(){this.size=[60,20];this.addInput("event",m.ACTION)}function e(){this.size=[60,20];this.addInput("event",m.ACTION);this.addOutput("event",m.EVENT);this.properties={equal_to:"",has_property:"",property_equal_to:""}}function h(){this.size=[60,20];this.addProperty("time",1E3);this.addInput("event",m.ACTION);this.addOutput("on_time",m.EVENT);this._pending=[]}var m=u.LiteGraph;g.title="Log Event";g.desc="Log event in console";g.prototype.onAction=function(e,h){console.log(e,h)};
 m.registerNodeType("events/log",g);e.title="Filter Event";e.desc="Blocks events that do not match the filter";e.prototype.onAction=function(e,h){if(null!=h&&(!this.properties.equal_to||this.properties.equal_to==h)){if(this.properties.has_property){var g=h[this.properties.has_property];if(null==g||this.properties.property_equal_to&&this.properties.property_equal_to!=g)return}this.triggerSlot(0,h)}};m.registerNodeType("events/filter",e);h.title="Delay";h.desc="Delays one event";h.prototype.onAction=
 function(e,h){this._pending.push([this.properties.time,h])};h.prototype.onExecute=function(){for(var e=1E3*this.graph.elapsed_time,h=0;h<this._pending.length;++h){var g=this._pending[h];g[0]-=e;0<g[0]||(this._pending.splice(h,1),--h,this.trigger(null,g[1]))}};h.prototype.onGetInputs=function(){return[["event",m.ACTION]]};m.registerNodeType("events/delay",h)})(this);

css/litegraph.css

@@ -253,3 +253,13 @@
 	vertical-align: top;
 }
 
+.graphdialog .help-item {
+	padding-left: 10px;
+}
+
+.graphdialog .help-item:hover, .graphdialog .help-item.selected {
+	cursor: pointer;
+	background-color: white;
+	color: black;
+}
+

src/litegraph.js

@@ -383,14 +383,18 @@ else
 *
 * @class LGraph
 * @constructor
+* @param {Object} o data from previous serialization [optional]
 */
 
-function LGraph()
+function LGraph( o )
 {
 	if (LiteGraph.debug)
 		console.log("Graph created");
 	this.list_of_graphcanvas = null;
 	this.clear();
+
+	if(o)
+		this.configure(o);
 }
 
 global.LGraph = LiteGraph.LGraph = LGraph;
@@ -413,7 +417,11 @@ LGraph.prototype.clear = function()
 {
 	this.stop();
 	this.status = LGraph.STATUS_STOPPED;
+
 	this.last_node_id = 0;
+	this.last_link_id = 0;
+
+	this._version = -1; //used to detect changes
 
 	//nodes
 	this._nodes = [];
@@ -422,14 +430,13 @@ LGraph.prototype.clear = function()
 	this._nodes_executable = null; //nodes that contain onExecute
 
 	//links
-	this.last_link_id = 0;
 	this.links = {}; //container with all the links
 
 	//iterations
 	this.iteration = 0;
 
-	this.config = {
-	};
+	//custom data
+	this.config = {};
 
 	//timing
 	this.globaltime = 0;
@@ -446,9 +453,7 @@ LGraph.prototype.clear = function()
 	this.global_inputs = {};
 	this.global_outputs = {};
 
-	//this.graph = {};
-	this.debug = true;
-
+	//notify canvas to redraw
 	this.change();
 
 	this.sendActionToCanvas("clear");
@@ -478,7 +483,6 @@ LGraph.prototype.attachCanvas = function(graphcanvas)
 * @method detachCanvas
 * @param {GraphCanvas} graph_canvas
 */
-
 LGraph.prototype.detachCanvas = function(graphcanvas)
 {
 	if(!this.list_of_graphcanvas)
@@ -901,17 +905,13 @@ LGraph.prototype.add = function(node, skip_compute_order)
 	else if (this.last_node_id < node.id)
 		this.last_node_id = node.id;
 
+
 	node.graph = this;
+	this._version++;
 
 	this._nodes.push(node);
 	this._nodes_by_id[node.id] = node;
 
-	/*
-	// rendering stuf...
-	if(node.bgImageUrl)
-		node.bgImage = node.loadImage(node.bgImageUrl);
-	*/
-
 	if(node.onAdded)
 		node.onAdded( this );
 
@@ -971,6 +971,7 @@ LGraph.prototype.remove = function(node)
 		node.onRemoved();
 
 	node.graph = null;
+	this._version++;
 
 	//remove from canvas render
 	if(this.list_of_graphcanvas)
@@ -1095,6 +1096,7 @@ LGraph.prototype.getNodeOnPos = function(x,y, nodes_list)
 LGraph.prototype.addGlobalInput = function(name, type, value)
 {
 	this.global_inputs[name] = { name: name, type: type, value: value };
+	this._version++;
 
 	if(this.onGlobalInputAdded)
 		this.onGlobalInputAdded(name, type);
@@ -1162,6 +1164,7 @@ LGraph.prototype.renameGlobalInput = function(old_name, name)
 
 	this.global_inputs[name] = this.global_inputs[old_name];
 	delete this.global_inputs[old_name];
+	this._version++;
 
 	if(this.onGlobalInputRenamed)
 		this.onGlobalInputRenamed(old_name, name);
@@ -1181,10 +1184,11 @@ LGraph.prototype.changeGlobalInputType = function(name, type)
 	if(!this.global_inputs[name])
 		return false;
 
-	if(this.global_inputs[name].type.toLowerCase() == type.toLowerCase() )
+	if(this.global_inputs[name].type == type || this.global_inputs[name].type.toLowerCase() == type.toLowerCase() )
 		return;
 
 	this.global_inputs[name].type = type;
+	this._version++;
 	if(this.onGlobalInputTypeChanged)
 		this.onGlobalInputTypeChanged(name, type);
 }
@@ -1201,6 +1205,7 @@ LGraph.prototype.removeGlobalInput = function(name)
 		return false;
 
 	delete this.global_inputs[name];
+	this._version++;
 
 	if(this.onGlobalInputRemoved)
 		this.onGlobalInputRemoved(name);
@@ -1220,6 +1225,7 @@ LGraph.prototype.removeGlobalInput = function(name)
 LGraph.prototype.addGlobalOutput = function(name, type, value)
 {
 	this.global_outputs[name] = { name: name, type: type, value: value };
+	this._version++;
 
 	if(this.onGlobalOutputAdded)
 		this.onGlobalOutputAdded(name, type);
@@ -1284,6 +1290,7 @@ LGraph.prototype.renameGlobalOutput = function(old_name, name)
 
 	this.global_outputs[name] = this.global_outputs[old_name];
 	delete this.global_outputs[old_name];
+	this._version++;
 
 	if(this.onGlobalOutputRenamed)
 		this.onGlobalOutputRenamed(old_name, name);
@@ -1307,6 +1314,7 @@ LGraph.prototype.changeGlobalOutputType = function(name, type)
 		return;
 
 	this.global_outputs[name].type = type;
+	this._version++;
 	if(this.onGlobalOutputTypeChanged)
 		this.onGlobalOutputTypeChanged(name, type);
 }
@@ -1321,6 +1329,7 @@ LGraph.prototype.removeGlobalOutput = function(name)
 	if(!this.global_outputs[name])
 		return false;
 	delete this.global_outputs[name];
+	this._version++;
 
 	if(this.onGlobalOutputRemoved)
 		this.onGlobalOutputRemoved(name);
@@ -1350,6 +1359,7 @@ LGraph.prototype.connectionChange = function( node )
 	this.updateExecutionOrder();
 	if( this.onConnectionChange )
 		this.onConnectionChange( node );
+	this._version++;
 	this.sendActionToCanvas("onConnectionChange");
 }
 
@@ -1372,14 +1382,12 @@ LGraph.prototype.isLive = function()
 	return false;
 }
 
-/* Called when something visually changed */
+/* Called when something visually changed (not the graph!) */
 LGraph.prototype.change = function()
 {
 	if(LiteGraph.debug)
 		console.log("Graph changed");
-
 	this.sendActionToCanvas("setDirty",[true,true]);
-
 	if(this.on_change)
 		this.on_change(this);
 }
@@ -1410,13 +1418,11 @@ LGraph.prototype.serialize = function()
 	}
 
 	var data = {
-		iteration: this.iteration,
-		frame: this.frame,
 		last_node_id: this.last_node_id,
 		last_link_id: this.last_link_id,
-		links: links, //LiteGraph.cloneObject( this.links ),
+		nodes: nodes_info,
+		links: links, 
 		config: this.config,
-		nodes: nodes_info
 	};
 
 	return data;
@@ -1427,9 +1433,13 @@ LGraph.prototype.serialize = function()
 * Configure a graph from a JSON string
 * @method configure
 * @param {String} str configure a graph from a JSON string
+* @param {Boolean} returns if there was any error parsing
 */
-LGraph.prototype.configure = function(data, keep_old)
+LGraph.prototype.configure = function( data, keep_old )
 {
+	if(!data)
+		return;
+
 	if(!keep_old)
 		this.clear();
 
@@ -1438,7 +1448,7 @@ LGraph.prototype.configure = function(data, keep_old)
 	//decode links info (they are very verbose)
 	if(data.links && data.links.constructor === Array)
 	{
-		var links = {};
+		var links = [];
 		for(var i = 0; i < data.links.length; ++i)
 		{
 			var link = data.links[i];
@@ -1455,32 +1465,36 @@ LGraph.prototype.configure = function(data, keep_old)
 
 	//create nodes
 	this._nodes = [];
-	for(var i = 0, l = nodes.length; i < l; ++i)
+	if(nodes)
 	{
-		var n_info = nodes[i]; //stored info
-		var node = LiteGraph.createNode( n_info.type, n_info.title );
-		if(!node)
+		for(var i = 0, l = nodes.length; i < l; ++i)
 		{
-			if(LiteGraph.debug)
-				console.log("Node not found: " + n_info.type);
-			error = true;
-			continue;
+			var n_info = nodes[i]; //stored info
+			var node = LiteGraph.createNode( n_info.type, n_info.title );
+			if(!node)
+			{
+				if(LiteGraph.debug)
+					console.log("Node not found: " + n_info.type);
+				error = true;
+				continue;
+			}
+
+			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.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
-	}
-
-	//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 );
+		//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();
+	this._version++;
 	this.setDirtyCanvas(true,true);
 	return error;
 }
@@ -1616,6 +1630,9 @@ LGraphNode.prototype._ctor = function( title )
 */
 LGraphNode.prototype.configure = function(info)
 {
+	if(this.graph)
+		this.graph._version++;
+
 	for (var j in info)
 	{
 		if(j == "console")
@@ -1656,7 +1673,7 @@ LGraphNode.prototype.configure = function(info)
 		for(var i = 0; i < this.inputs.length; ++i)
 		{
 			var input = this.inputs[i];
-			var link_info = this.graph.links[ input.link ];
+			var link_info = this.graph ? this.graph.links[ input.link ] : null;
 			this.onConnectionsChange( LiteGraph.INPUT, i, true, link_info, input ); //link_info has been created now, so its updated
 		}
 
@@ -1668,7 +1685,7 @@ LGraphNode.prototype.configure = function(info)
 				continue;
 			for(var j = 0; j < output.links.length; ++j)
 			{
-				var link_info = this.graph.links[ output.links[j] ];
+				var link_info = this.graph ? this.graph.links[ output.links[j] ] : null;
 				this.onConnectionsChange( LiteGraph.OUTPUT, i, true, link_info, output ); //link_info has been created now, so its updated
 			}
 		}
@@ -1684,6 +1701,7 @@ LGraphNode.prototype.configure = function(info)
 		if(typeof(link) != "object")
 			continue;
 		input.link = link[0];
+		if(this.graph)
 		this.graph.links[ link[0] ] = {
 			id: link[0],
 			origin_id: link[1],
@@ -2358,6 +2376,9 @@ LGraphNode.prototype.computeSize = function( minHeight, out )
 	size[0] = Math.max( input_width + output_width + 10, title_width );
 	size[0] = Math.max( size[0], LiteGraph.NODE_WIDTH );
 
+	if(this.onResize)
+		this.onResize(size);
+
 	function compute_text_size( text )
 	{
 		if(!text)
@@ -2575,7 +2596,8 @@ LGraphNode.prototype.connect = function( slot, target_node, target_slot )
 		output.links.push( link_info.id );
 		//connect in input
 		target_node.inputs[target_slot].link = link_info.id;
-
+		if(this.graph)
+			this.graph._version++;
 		if(this.onConnectionsChange)
 			this.onConnectionsChange( LiteGraph.OUTPUT, slot, true, link_info, output ); //link_info has been created now, so its updated
 		if(target_node.onConnectionsChange)
@@ -2639,6 +2661,8 @@ LGraphNode.prototype.disconnectOutput = function( slot, target_node )
 				var input = target_node.inputs[ link_info.target_slot ];
 				input.link = null; //remove there
 				delete this.graph.links[ link_id ]; //remove the link from the links pool
+				if(this.graph)
+					this.graph._version++;
 				if(target_node.onConnectionsChange)
 					target_node.onConnectionsChange( LiteGraph.INPUT, link_info.target_slot, false, link_info, input ); //link_info hasnt been modified so its ok
 				if(this.onConnectionsChange)
@@ -2658,6 +2682,8 @@ LGraphNode.prototype.disconnectOutput = function( slot, target_node )
 
 			var target_node = this.graph.getNodeById( link_info.target_id );
 			var input = null;
+			if(this.graph)
+				this.graph._version++;
 			if(target_node)
 			{
 				input = target_node.inputs[ link_info.target_slot ];
@@ -2734,7 +2760,8 @@ LGraphNode.prototype.disconnectInput = function( slot )
 		}
 
 		delete this.graph.links[ link_id ]; //remove from the pool
-
+		if(this.graph)
+			this.graph._version++;
 		if( this.onConnectionsChange )
 			this.onConnectionsChange( LiteGraph.INPUT, slot, false, link_info, input );
 		if( target_node.onConnectionsChange )
@@ -2761,7 +2788,6 @@ LGraphNode.prototype.getConnectionPos = function(is_input, slot_number)
 			return [this.pos[0], this.pos[1] - LiteGraph.NODE_TITLE_HEIGHT * 0.5];
 		else
 			return [this.pos[0] + LiteGraph.NODE_COLLAPSED_WIDTH, this.pos[1] - LiteGraph.NODE_TITLE_HEIGHT * 0.5];
-		//return [this.pos[0] + this.size[0] * 0.5, this.pos[1] + this.size[1] * 0.5];
 	}
 
 	if(is_input && slot_number == -1)
@@ -2886,6 +2912,7 @@ LGraphNode.prototype.captureInput = function(v)
 **/
 LGraphNode.prototype.collapse = function()
 {
+	this.graph._version++;
 	if(!this.flags.collapsed)
 		this.flags.collapsed = true;
 	else
@@ -2900,6 +2927,7 @@ LGraphNode.prototype.collapse = function()
 
 LGraphNode.prototype.pin = function(v)
 {
+	this.graph._version++;
 	if(v === undefined)
 		this.flags.pinned = !this.flags.pinned;
 	else
@@ -2966,6 +2994,7 @@ function LGraphCanvas( canvas, graph, options )
 	this.allow_dragcanvas = true;
 	this.allow_dragnodes = true;
 	this.allow_interaction = true; //allow to control widgets, buttons, collapse, etc
+	this.allow_searchbox = true;
 	this.drag_mode = false;
 	this.dragging_rectangle = null;
 
@@ -2976,8 +3005,20 @@ function LGraphCanvas( canvas, graph, options )
 	this.render_curved_connections = true;
 	this.render_connection_arrows = true;
 
+	//to personalize the search box
+	this.onSearchBox = null;
+	this.onSearchBoxSelection = null;
+
 	this.connections_width = 3;
 
+	this.gui_mouse = {
+		node: null,
+		blocked: false,
+		position: [0,0],
+		click: false
+	};
+	this.current_node = null;
+
 	//link canvas and graph
 	if(graph)
 		graph.attachCanvas(this);
@@ -3430,6 +3471,7 @@ LGraphCanvas.prototype.processMouseDown = function(e)
 	var ref_window = this.getCanvasWindow();
 	var document = ref_window.document;
 	LGraphCanvas.active_canvas = this;
+	var that = this;
 
 	//move mouse move event to the window in case it drags outside of the canvas
 	this.canvas.removeEventListener("mousemove", this._mousemove_callback );
@@ -3439,6 +3481,7 @@ LGraphCanvas.prototype.processMouseDown = function(e)
 	var n = this.graph.getNodeOnPos( e.canvasX, e.canvasY, this.visible_nodes );
 	var skip_dragging = false;
 	var skip_action = false;
+	var now = LiteGraph.getTime();
 
     LiteGraph.closeAllContextMenus( ref_window );
 
@@ -3522,8 +3565,16 @@ LGraphCanvas.prototype.processMouseDown = function(e)
 			{
 				var block_drag_node = false;
 
+				//widgets
+				this.gui_mouse.node = n;
+				this.gui_mouse.position[0] = e.canvasX - n.pos[0];
+				this.gui_mouse.position[1] = e.canvasY - n.pos[1];
+				this.gui_mouse.clicked = true;
+
+				if( this.gui_mouse.blocked )
+					block_drag_node = true;
+
 				//double clicking
-				var now = LiteGraph.getTime();
 				if ((now - this.last_mouseclick) < 300 && this.selected_nodes[n.id])
 				{
 					//double click node
@@ -3555,8 +3606,12 @@ LGraphCanvas.prototype.processMouseDown = function(e)
 				this.dirty_canvas = true;
 			}
 		}
-		else
+		else //clicked outside of nodes
+		{
 			clicking_canvas_bg = true;
+			if ( (now - this.last_mouseclick) < 300 && this.allow_searchbox )
+				setTimeout( function(){ that.showSearchBox(e); },10 );
+		}
 
 		if(!skip_action && clicking_canvas_bg && this.allow_dragcanvas)
 		{
@@ -4462,6 +4517,7 @@ LGraphCanvas.prototype.drawFrontCanvas = function()
 		ctx.start2D();
 
 	var canvas = this.canvas;
+	this.gui_mouse.blocked = false;
 
 	//reset in case of error
 	ctx.restore();
@@ -4577,6 +4633,8 @@ LGraphCanvas.prototype.drawFrontCanvas = function()
 		ctx.finish2D();
 
 	this.dirty_canvas = false;
+	this.gui_mouse.node = null;
+	this.gui_mouse.clicked = false;
 }
 
 LGraphCanvas.prototype.renderInfo = function( ctx, x, y )
@@ -4593,7 +4651,7 @@ LGraphCanvas.prototype.renderInfo = function( ctx, x, y )
 	{
 		ctx.fillText( "T: " + this.graph.globaltime.toFixed(2)+"s",5,13*1 );
 		ctx.fillText( "I: " + this.graph.iteration,5,13*2 );
-		ctx.fillText( "F: " + this.frame,5,13*3 );
+		ctx.fillText( "V: " + this.graph._version,5,13*3 );
 		ctx.fillText( "FPS:" + this.fps.toFixed(2),5,13*4 );
 	}
 	else
@@ -4725,6 +4783,7 @@ var temp_vec2 = new Float32Array(2);
 LGraphCanvas.prototype.drawNode = function(node, ctx )
 {
 	var glow = false;
+	this.current_node = node;
 
 	var color = node.color || LiteGraph.NODE_DEFAULT_COLOR;
 	//if (this.selected) color = "#88F";
@@ -4763,10 +4822,8 @@ LGraphCanvas.prototype.drawNode = function(node, ctx )
 		if(!node.flags.collapsed)
 		{
 			ctx.shadowColor = "transparent";
-			//if(node.onDrawBackground)
-			//	node.onDrawBackground(ctx);
 			if(node.onDrawForeground)
-				node.onDrawForeground(ctx);
+				node.onDrawForeground(ctx, this);
 		}
 
 		return;
@@ -4919,7 +4976,7 @@ LGraphCanvas.prototype.drawNode = function(node, ctx )
 		ctx.globalAlpha = 1;
 
 		if(node.onDrawForeground)
-			node.onDrawForeground(ctx);
+			node.onDrawForeground( ctx, this );
 	}//!collapsed
 
 	if(node.flags.clip_area)
@@ -4984,8 +5041,8 @@ LGraphCanvas.prototype.drawNodeShape = function(node, ctx, size, fgcolor, bgcolo
 	if(node.bgImageUrl && !node.bgImage)
 		node.bgImage = node.loadImage(node.bgImageUrl);
 
-	if(node.onDrawBackground)
-		node.onDrawBackground(ctx);
+	if( node.onDrawBackground )
+		node.onDrawBackground( ctx, this );
 
 	//title bg (remember, it is rendered ABOVE the node
 	if(!no_title)
@@ -5259,6 +5316,30 @@ LGraphCanvas.prototype.computeConnectionPoint = function(a,b,t)
 	return [x,y];
 }
 
+LGraphCanvas.prototype.guiButton = function( ctx, rect, text, callback )
+{
+	var mouse = this.gui_mouse;
+
+	var mouse_over = mouse.position[0] >= rect[0] && mouse.position[1] >= rect[1] && mouse.position[0] < rect[0] + rect[2] && mouse.position[1] < rect[1] + rect[3];
+	//if(mouse_over) this.setDirty(true,false);
+	var clicked = mouse.node == this.current_node && mouse.clicked && mouse_over;
+
+	ctx.fillStyle = clicked ? "#AAA" : ( mouse_over ? "#555" : "#333" );
+	ctx.fillRect( rect[0], rect[1], rect[2], rect[3] );
+	ctx.strokeStyle = "#AAA";
+	ctx.strokeRect( rect[0] + 0.5, rect[1] + 0.5, rect[2], rect[3] );
+	ctx.textAlign = "center";
+	ctx.fillStyle = clicked ? "#000" : "#AAA";
+	ctx.fillText( text, rect[0] + rect[2] * 0.5, rect[1] + rect[3] * 0.75 );
+
+	if(clicked)
+	{
+		mouse.blocked = true;
+		if(callback)
+			setTimeout( function(){ callback(this.current_node,text,mouse); }),1;
+	}
+}
+
 /*
 LGraphCanvas.prototype.resizeCanvas = function(width,height)
 {
@@ -5660,6 +5741,154 @@ LGraphCanvas.onShowTitleEditor = function( value, options, e, menu, node )
 	}
 }
 
+LGraphCanvas.prototype.showSearchBox = function(event)
+{
+	var that = this;
+	var input_html = "";
+
+	var dialog = document.createElement("div");
+	dialog.className = "graphdialog";
+	dialog.innerHTML = "<span class='name'>Search</span> <input autofocus type='text' class='value'/><div class='helper'></div>";
+	dialog.close = function()
+	{
+		that.search_box = null;
+		dialog.parentNode.removeChild( dialog );
+	}
+
+	dialog.addEventListener("mouseleave",function(e){
+		 dialog.close();
+	});
+
+	if(that.search_box)
+		that.search_box.close();
+	that.search_box = dialog;
+
+	var helper = dialog.querySelector(".helper");
+
+	var first = null;
+	var timeout = null;
+	var selected = null;
+
+	var input = dialog.querySelector("input");
+	if(input)
+	{
+		input.addEventListener("keydown", function(e){
+
+			if(e.keyCode == 38) //UP
+				changeSelection(false);
+			else if(e.keyCode == 40) //DOWN
+				changeSelection(true);
+			else if(e.keyCode == 27) //ESC
+				dialog.close();
+			else if(e.keyCode == 13)
+			{
+				if(selected)
+					select( selected.innerHTML )
+				else if(first)
+					select(first);
+				else
+					dialog.close();
+			}
+			else
+			{
+				if(timeout)
+					clearInterval(timeout);
+				timeout = setTimeout( refreshHelper, 10 );
+				return;
+			}
+			e.preventDefault();
+			e.stopPropagation();
+		});
+	}
+
+	var graphcanvas = LGraphCanvas.active_canvas;
+	var canvas = graphcanvas.canvas;
+
+	var rect = canvas.getBoundingClientRect();
+	var offsetx = -20;
+	var offsety = -20;
+	if(rect)
+	{
+		offsetx -= rect.left;
+		offsety -= rect.top;
+	}
+
+	if( event )
+	{
+		dialog.style.left = (event.pageX + offsetx) + "px";
+		dialog.style.top = (event.pageY + offsety)+ "px";
+	}
+	else
+	{
+		dialog.style.left = (canvas.width * 0.5 + offsetx) + "px";
+		dialog.style.top = (canvas.height * 0.5 + offsety) + "px";
+	}
+
+	canvas.parentNode.appendChild( dialog );
+	input.focus();
+
+	function select( name )
+	{
+		if(name)
+		{
+			if( that.onSearchBoxSelection )
+				that.onSearchBoxSelection( name, event, graphcanvas );
+			else
+			{
+				var node = LiteGraph.createNode( name );
+				if(node)
+				{
+					node.pos = graphcanvas.convertEventToCanvas( event );
+					graphcanvas.graph.add( node );
+				}
+			}
+		}
+
+		dialog.close();
+	}
+
+	function changeSelection( forward )
+	{
+		if(selected)
+			selected.classList.remove("selected");
+		if(!selected)
+			selected = helper.childNodes[0];
+		else
+			selected = forward ? selected.nextSibling : selected.previousSibling;
+		if(!selected)
+			return;
+		selected.classList.add("selected");
+	}
+
+	function refreshHelper()
+	{
+		timeout = null;
+		var str = input.value;
+		first = null;
+		helper.innerHTML = "";
+		if(!str)
+			return;
+
+		if( that.onSearchBox )
+			that.onSearchBox( help, str, graphcanvas );
+		else
+			for( var i in LiteGraph.registered_node_types )
+				if(i.indexOf(str) != -1)
+				{
+					var help = document.createElement("div");
+					if(!first) first = i;
+					help.innerText = i;
+					help.className = "help-item";
+					help.addEventListener("click", function(e){
+						select( this.innerText );
+					});
+					helper.appendChild(help);
+				}
+	}
+
+	return dialog;
+}
+
 LGraphCanvas.prototype.showEditPropertyValue = function( node, property, options )
 {
 	if(!node || node.properties[ property ] === undefined )
@@ -5760,7 +5989,8 @@ LGraphCanvas.prototype.showEditPropertyValue = function( node, property, options
 		if(typeof( node.properties[ property ] ) == "number")
 			value = Number(value);
 		node.properties[ property ] = value;
-
+		if(node._graph)
+			node._graph._version++;
 		if(node.onPropertyChanged)
 			node.onPropertyChanged( property, value );
 		dialog.close();

src/nodes/base.js

@@ -25,7 +25,7 @@ LiteGraph.registerNodeType("basic/time", Time);
 function Subgraph()
 {
 	var that = this;
-	this.size = [120,60];
+	this.size = [120,80];
 
 	//create inner graph
 	this.subgraph = new LGraph();
@@ -40,7 +40,7 @@ function Subgraph()
 	this.subgraph.onGlobalOutputRenamed = this.onSubgraphRenamedGlobalOutput.bind(this);
 	this.subgraph.onGlobalOutputTypeChanged = this.onSubgraphTypeChangeGlobalOutput.bind(this);
 	
-	this.bgcolor = "#663";
+	this.bgcolor = "#353";
 }
 
 Subgraph.title = "Subgraph";
@@ -107,6 +107,19 @@ Subgraph.prototype.getExtraMenuOptions = function(graphcanvas)
 	}];
 }
 
+Subgraph.prototype.onDrawForeground = function( ctx, graphcanvas )
+{
+	var node = this;
+	ctx.globalAlpha = 0.75;
+	graphcanvas.guiButton(ctx, [0,this.size[1] - 20,this.size[0],19], "Open", function(){ graphcanvas.openSubgraph(node.subgraph); });
+	ctx.globalAlpha = 1;
+}
+
+Subgraph.prototype.onResize = function(size)
+{
+	size[1] += 20;
+}
+
 Subgraph.prototype.onExecute = function()
 {
 	//send inputs to subgraph global inputs

src/nodes/interface.js

@@ -115,6 +115,7 @@ var LiteGraph = global.LiteGraph;
 		if(local_pos[0] > 1 && local_pos[1] > 1 && local_pos[0] < (this.size[0] - 2) && local_pos[1] < (this.size[1] - 2) )
 		{
 			this.properties.value = !this.properties.value;
+			this.graph._version++;
 			this.trigger( "e", this.properties.value );
 			return true;
 		}
@@ -202,6 +203,7 @@ var LiteGraph = global.LiteGraph;
 
 		var v = Math.clamp( this.properties.value + steps * this.properties.step, this.properties.min, this.properties.max );
 		this.properties.value = v;
+		this.graph._version++;
 		this.setDirtyCanvas(true);
 	}
 
@@ -211,6 +213,7 @@ var LiteGraph = global.LiteGraph;
 		{
 			var steps = pos[1] > this.size[1] * 0.5 ? -1 : 1;
 			this.properties.value = Math.clamp( this.properties.value + steps * this.properties.step, this.properties.min, this.properties.max );
+			this.graph._version++;
 			this.setDirtyCanvas(true);
 		}