diff --git a/build/litegraph.js b/build/litegraph.js index 8b948690c..fafb3e5ef 100644 --- a/build/litegraph.js +++ b/build/litegraph.js @@ -698,7 +698,7 @@ LGraph.prototype.remove = function(node) node.disconnectOutput(i); } - node.id = -1; + //node.id = -1; //why? //callback if(node.onRemoved) @@ -2682,19 +2682,25 @@ LGraphCanvas.prototype.processMouseDown = function(e) var n = this.graph.getNodeOnPos( e.canvasX, e.canvasY, this.visible_nodes ); var skip_dragging = false; + + LiteGraph.closeAllContextualMenus(); if(e.which == 1) //left button mouse { - //another node selected + if(!e.shiftKey) //REFACTOR: integrate with function { - var todeselect = []; - for(var i in this.selected_nodes) - if (this.selected_nodes[i] != n) - todeselect.push(this.selected_nodes[i]); - //two passes to avoid problems modifying the container - for(var i in todeselect) - this.processNodeDeselected(todeselect[i]); + //no node or another node selected + if (!n || !this.selected_nodes[n.id]) { + + var todeselect = []; + for (var i in this.selected_nodes) + if (this.selected_nodes[i] != n) + todeselect.push(this.selected_nodes[i]); + //two passes to avoid problems modifying the container + for (var i in todeselect) + this.processNodeDeselected(todeselect[i]); + } } var clicking_canvas_bg = false; @@ -3277,11 +3283,9 @@ LGraphCanvas.prototype.processNodeDeselected = function(n) delete this.selected_nodes[n.id]; if(this.onNodeDeselected) - this.onNodeDeselected(); + this.onNodeDeselected(n); this.dirty_canvas = true; - - //this.showNodePanel(null); } LGraphCanvas.prototype.processNodeDblClicked = function(n) @@ -4772,8 +4776,16 @@ LiteGraph.createContextualMenu = function(values,options, ref_window) //allows to create graph canvas in separate window ref_window = ref_window || window; - if(!options.from) - LiteGraph.closeAllContextualMenus(); + if (!options.from) + LiteGraph.closeAllContextualMenus(); + else { + //closing submenus + var menus = document.querySelectorAll(".graphcontextualmenu"); + for (var key in menus) { + if (menus[key].previousSibling == options.from) + menus[key].closeMenu(); + } + } var root = ref_window.document.createElement("div"); root.className = "graphcontextualmenu graphmenubar-panel"; diff --git a/build/litegraph.min.js b/build/litegraph.min.js index 9c96aeb00..621f7d06c 100755 --- a/build/litegraph.min.js +++ b/build/litegraph.min.js @@ -14,8 +14,8 @@ LGraph.prototype.computeExecutionOrder=function(){for(var a=[],b=[],c={},d={},e= (n=this.getNodeById(k.target_id),null==n?d[k.id]=!0:(d[k.id]=!0,e[n.id]-=1,0==e[n.id]&&b.push(n)));for(f in c)a.push(c[f]);a.length!=this._nodes.length&&LiteGraph.debug&&console.log("something went wrong, nodes missing");for(f in a)a[f].order=f;return a};LGraph.prototype.getTime=function(){return this.globaltime};LGraph.prototype.getFixedTime=function(){return this.fixedtime};LGraph.prototype.getElapsedTime=function(){return this.elapsed_time}; LGraph.prototype.sendEventToAllNodes=function(a,b){var c=this._nodes_in_order?this._nodes_in_order:this._nodes;if(c)for(var d=0,e=c.length;d=LiteGraph.MAX_NUMBER_OF_NODES)throw"LiteGraph: max number of nodes in a graph reached";if(null==a.id||-1==a.id)a.id=this.last_node_id++;a.graph=this;this._nodes.push(a);this._nodes_by_id[a.id]=a;if(a.onAdded)a.onAdded();this.config.align_to_grid&&a.alignToGrid();b||this.updateExecutionOrder();if(this.onNodeAdded)this.onNodeAdded(a);this.setDirtyCanvas(!0);this.change();return a}}; -LGraph.prototype.remove=function(a){if(null!=this._nodes_by_id[a.id]&&!a.ignore_remove){if(a.inputs)for(var b=0;bLiteGraph.getTime()-this.last_mouseclick&&this.selected_nodes[c.id]){if(c.onDblClick)c.onDblClick(a);this.processNodeDblClicked(c);e=!0}c.onMouseDown&&c.onMouseDown(a)?e=!0:this.live_mode&&(e=d=!0);e||(this.allow_dragnodes&&(this.node_dragged=c),this.selected_nodes[c.id]||this.processNodeSelected(c,a));this.dirty_canvas=!0}}else d=!0;d&&this.allow_dragcanvas&&(this.dragging_canvas=!0)}else 2!=a.which&&3==a.which&&this.processContextualMenu(c,a);this.last_mouse[0]=a.localX;this.last_mouse[1]= -a.localY;this.last_mouseclick=LiteGraph.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}}; +LGraphCanvas.prototype.processMouseDown=function(a){if(this.graph){this.adjustMouseEvent(a);var b=this.getCanvasWindow();this.canvas.removeEventListener("mousemove",this._mousemove_callback);b.document.addEventListener("mousemove",this._mousemove_callback,!0);b.document.addEventListener("mouseup",this._mouseup_callback,!0);var c=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes);LiteGraph.closeAllContextualMenus();if(1==a.which){if(!(a.shiftKey||c&&this.selected_nodes[c.id])){var d=[], +e;for(e in this.selected_nodes)this.selected_nodes[e]!=c&&d.push(this.selected_nodes[e]);for(e in d)this.processNodeDeselected(d[e])}d=!1;if(c){this.live_mode||c.flags.pinned||this.bringToFront(c);var f=!1;if(!this.connecting_node&&!c.flags.collapsed&&!this.live_mode){if(c.outputs){e=0;for(var g=c.outputs.length;eLiteGraph.getTime()-this.last_mouseclick&&this.selected_nodes[c.id]){if(c.onDblClick)c.onDblClick(a);this.processNodeDblClicked(c);e=!0}c.onMouseDown&&c.onMouseDown(a)?e=!0:this.live_mode&&(e=d=!0);e||(this.allow_dragnodes&&(this.node_dragged=c),this.selected_nodes[c.id]||this.processNodeSelected(c,a));this.dirty_canvas=!0}}else d=!0;d&&this.allow_dragcanvas&&(this.dragging_canvas=!0)}else 2!=a.which&& +3==a.which&&this.processContextualMenu(c,a);this.last_mouse[0]=a.localX;this.last_mouse[1]=a.localY;this.last_mouseclick=LiteGraph.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}}; LGraphCanvas.prototype.processMouseMove=function(a){this.autoresize&&this.resize();if(this.graph){this.adjustMouseEvent(a);var b=[a.localX,a.localY],c=[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_canvas)this.offset[0]+=c[0]/this.scale,this.offset[1]+=c[1]/this.scale,this.dirty_bgcanvas=this.dirty_canvas=!0;else{this.connecting_node&&(this.dirty_canvas=!0);for(var b=this.graph.getNodeOnPos(a.canvasX,a.canvasY,this.visible_nodes), d=0,e=this.graph._nodes.length;d"+e+""})}LiteGraph.createContextualMenu(d,{event:b,callback:function(b){a&&(b=LGraphCanvas.node_colors[b.value])&&(a.color=b.color,a.bgcolor=b.bgcolor,a.setDirtyCanvas(!0))},from:c});return!1}; LGraphCanvas.onMenuNodeShapes=function(a,b){LiteGraph.createContextualMenu(["box","round"],{event:b,callback:function(b){a&&(a.shape=b,a.setDirtyCanvas(!0))}});return!1};LGraphCanvas.onMenuNodeRemove=function(a){!1!=a.removable&&(a.graph.remove(a),a.setDirtyCanvas(!0,!0))};LGraphCanvas.onMenuNodeClone=function(a){if(!1!=a.clonable){var b=a.clone();b&&(b.pos=[a.pos[0]+5,a.pos[1]+5],a.graph.add(b),a.setDirtyCanvas(!0,!0))}}; @@ -138,11 +138,11 @@ f,d)};CanvasRenderingContext2D.prototype.roundRect=function(a,b,c,d,e,f){void 0= function distance(a,b){return Math.sqrt((b[0]-a[0])*(b[0]-a[0])+(b[1]-a[1])*(b[1]-a[1]))}function colorToString(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")+")"}function isInsideRectangle(a,b,c,d,e,f){return ca&&db?!0:!1}function growBounding(a,b,c){ba[2]&&(a[2]=b);ca[3]&&(a[3]=c)} function isInsideBounding(a,b){return a[0]b[1][0]||a[1]>b[1][1]?!1:!0}function overlapBounding(a,b){return a[0]>b[2]||a[1]>b[3]||a[2]f;f+=2)d="0123456789ABCDEF".indexOf(a.charAt(f)),e="0123456789ABCDEF".indexOf(a.charAt(f+1)),b[c]=16*d+e,c++;return b} function num2hex(a){for(var b="#",c,d,e=0;3>e;e++)c=a[e]/16,d=a[e]%16,b+="0123456789ABCDEF".charAt(c)+"0123456789ABCDEF".charAt(d);return b} -LiteGraph.createContextualMenu=function(a,b,c){function d(a){var c=!0;b.callback&&(a=b.callback.call(e,this.data,a),void 0!==a&&(c=a));c&&LiteGraph.closeAllContextualMenus()}this.options=b=b||{};c=c||window;b.from||LiteGraph.closeAllContextualMenus();var e=c.document.createElement("div");e.className="graphcontextualmenu graphmenubar-panel";this.root=e;var f=e.style;f.minWidth="100px";f.minHeight="20px";f.position="fixed";f.top="100px";f.left="100px";f.color="#AAF";f.padding="2px";f.borderBottom="2px solid #AAF"; -f.backgroundColor="#444";b.title&&(f=document.createElement("div"),f.className="graphcontextualmenu-title",f.innerHTML=b.title,e.appendChild(f));e.addEventListener("contextmenu",function(a){a.preventDefault();return!1});for(var g in a){var h=a[g],f=c.document.createElement("div");f.className="graphmenu-entry";null==h?f.className="graphmenu-entry separator":(h.is_menu&&(f.className+=" submenu"),h.disabled&&(f.className+=" disabled"),f.style.cursor="pointer",f.dataset.value="string"==typeof h?h:h.value, -f.data=h,f.innerHTML="string"==typeof h?a.constructor==Array?a[g]:g:h.content?h.content:g,f.addEventListener("click",d));e.appendChild(f)}e.addEventListener("mouseover",function(a){this.mouse_inside=!0});e.addEventListener("mouseout",function(a){for(a=a.relatedTarget||a.toElement;a!=this&&a!=c.document;)a=a.parentNode;a!=this&&(this.mouse_inside=!1,this.block_close||this.closeMenu())});c.document.body.appendChild(e);a=e.getClientRects()[0];b.from&&(b.from.block_close=!0);h=b.left||0;g=b.top||0;b.event&& -(h=b.event.pageX-10,g=b.event.pageY-10,b.left&&(h=b.left),f=c.document.body.getClientRects()[0],b.from&&(h=b.from.getClientRects()[0],h=h.left+h.width),h>f.width-a.width-10&&(h=f.width-a.width-10),g>f.height-a.height-10&&(g=f.height-a.height-10));e.style.left=h+"px";e.style.top=g+"px";e.closeMenu=function(){b.from&&(b.from.block_close=!1,b.from.mouse_inside||b.from.closeMenu());this.parentNode&&c.document.body.removeChild(this)};return e}; -LiteGraph.closeAllContextualMenus=function(){var a=document.querySelectorAll(".graphcontextualmenu");if(a.length){for(var b=[],c=0;ce.width-a.width-10&&(f=e.width-a.width-10),h>e.height-a.height-10&&(h=e.height-a.height-10));g.style.left=f+"px";g.style.top=h+"px";g.closeMenu=function(){b.from&&(b.from.block_close=!1,b.from.mouse_inside||b.from.closeMenu());this.parentNode&& +c.document.body.removeChild(this)};return g};LiteGraph.closeAllContextualMenus=function(){var a=document.querySelectorAll(".graphcontextualmenu");if(a.length){for(var b=[],c=0;c