diff --git a/build/litegraph.js b/build/litegraph.js index a80c6d825..7a7941825 100644 --- a/build/litegraph.js +++ b/build/litegraph.js @@ -4309,6 +4309,7 @@ LGraphNode.prototype.executeAction = function(action) this.pause_rendering = false; this.clear_background = true; + this.read_only = false; //if set to true users cannot modify the graph this.render_only_selected = true; this.live_mode = false; this.show_info = true; @@ -4869,7 +4870,7 @@ LGraphNode.prototype.executeAction = function(action) //when clicked on top of a node //and it is not interactive - if (node && this.allow_interaction && !skip_action) { + if (node && this.allow_interaction && !skip_action && !this.read_only) { if (!this.live_mode && !node.flags.pinned) { this.bringToFront(node); } //if it wasn't selected? @@ -5076,29 +5077,30 @@ LGraphNode.prototype.executeAction = function(action) } //clicked outside of nodes else { //search for link connector - for (var i = 0; i < this.visible_links.length; ++i) { - var link = this.visible_links[i]; - var center = link._pos; - if ( - !center || - e.canvasX < center[0] - 4 || - e.canvasX > center[0] + 4 || - e.canvasY < center[1] - 4 || - e.canvasY > center[1] + 4 - ) { - continue; - } - //link clicked - this.showLinkMenu(link, e); - break; - } + if(!this.read_only) + for (var i = 0; i < this.visible_links.length; ++i) { + var link = this.visible_links[i]; + var center = link._pos; + if ( + !center || + e.canvasX < center[0] - 4 || + e.canvasX > center[0] + 4 || + e.canvasY < center[1] - 4 || + e.canvasY > center[1] + 4 + ) { + continue; + } + //link clicked + this.showLinkMenu(link, e); + break; + } this.selected_group = this.graph.getGroupOnPos( e.canvasX, e.canvasY ); this.selected_group_resizing = false; - if (this.selected_group) { + if (this.selected_group && !this.read_only ) { if (e.ctrlKey) { this.dragging_rectangle = null; } @@ -5119,7 +5121,7 @@ LGraphNode.prototype.executeAction = function(action) } } - if (is_double_click) { + if (is_double_click && !this.read_only ) { this.showSearchBox(e); } @@ -5133,7 +5135,8 @@ LGraphNode.prototype.executeAction = function(action) //middle button } else if (e.which == 3) { //right button - this.processContextMenu(node, e); + if(!this.read_only) + this.processContextMenu(node, e); } //TODO @@ -5210,7 +5213,7 @@ LGraphNode.prototype.executeAction = function(action) this.dragging_rectangle[2] = e.canvasX - this.dragging_rectangle[0]; this.dragging_rectangle[3] = e.canvasY - this.dragging_rectangle[1]; this.dirty_canvas = true; - } else if (this.selected_group) { + } else if (this.selected_group && !this.read_only) { //moving/resizing a group if (this.selected_group_resizing) { this.selected_group.size = [ @@ -5231,7 +5234,7 @@ LGraphNode.prototype.executeAction = function(action) this.ds.offset[1] += delta[1] / this.ds.scale; this.dirty_canvas = true; this.dirty_bgcanvas = true; - } else if (this.allow_interaction) { + } else if (this.allow_interaction && !this.read_only) { if (this.connecting_node) { this.dirty_canvas = true; } @@ -16109,14 +16112,13 @@ if (typeof exports != "undefined") { this.addInput("value", "number"); this.addOutput("Texture", "Texture"); this.help = - "
pixelcode must be vec3
\ -uvcode must be vec2, is optional
\ -uv: tex. coords
color: texture
colorB: textureB
time: scene time
value: input value
For multiline you must type: result = ...
"; + "pixelcode must be vec3, uvcode must be vec2, is optional
\ +uv: tex. coords
color: texture colorB: textureB
time: scene time value: input value
For multiline you must type: result = ...
"; this.properties = { value: 1, - uvcode: "", pixelcode: "color + colorB * value", + uvcode: "", precision: LGraphTexture.DEFAULT }; @@ -16124,8 +16126,8 @@ if (typeof exports != "undefined") { } LGraphTextureOperation.widgets_info = { - uvcode: { widget: "textarea", height: 100 }, - pixelcode: { widget: "textarea", height: 100 }, + uvcode: { widget: "code" }, + pixelcode: { widget: "code" }, precision: { widget: "combo", values: LGraphTexture.MODE_VALUES } }; @@ -17156,14 +17158,13 @@ if (typeof exports != "undefined") { this.addOutput("avg", "vec4"); this.addOutput("lum", "number"); this.properties = { - use_previous_frame: true, - mipmap_offset: 0, - low_precision: false + use_previous_frame: true, //to avoid stalls + high_quality: false //to use as much pixels as possible }; this._uniforms = { u_texture: 0, - u_mipmap_offset: this.properties.mipmap_offset + u_mipmap_offset: 0 }; this._luminance = new Float32Array(4); } @@ -17234,6 +17235,25 @@ if (typeof exports != "undefined") { }); } + this._uniforms.u_mipmap_offset = 0; + + if(this.properties.high_quality) + { + if( !this._temp_pot2_texture || this._temp_pot2_texture.type != type ) + this._temp_pot2_texture = new GL.Texture(512, 512, { + type: type, + format: gl.RGBA, + minFilter: gl.LINEAR_MIPMAP_LINEAR, + magFilter: gl.LINEAR + }); + + tex.copyTo( this._temp_pot2_texture ); + tex = this._temp_pot2_texture; + tex.bind(0); + gl.generateMipmap(GL_TEXTURE_2D); + this._uniforms.u_mipmap_offset = 9; + } + var shader = LGraphTextureAverage._shader; var uniforms = this._uniforms; uniforms.u_mipmap_offset = this.properties.mipmap_offset; @@ -17273,8 +17293,8 @@ if (typeof exports != "undefined") { void main() {\n\ vec4 color = vec4(0.0);\n\ //random average\n\ - for(int i = 0; i <= 4; ++i)\n\ - for(int j = 0; j <= 4; ++j)\n\ + for(int i = 0; i < 4; ++i)\n\ + for(int j = 0; j < 4; ++j)\n\ {\n\ color += texture2D(u_texture, vec2( u_samples_a[i][j], u_samples_b[i][j] ), u_mipmap_offset );\n\ color += texture2D(u_texture, vec2( 1.0 - u_samples_a[i][j], 1.0 - u_samples_b[i][j] ), u_mipmap_offset );\n\ diff --git a/build/litegraph.min.js b/build/litegraph.min.js index 6a00aa870..d85bcad9c 100755 --- a/build/litegraph.min.js +++ b/build/litegraph.min.js @@ -1,34 +1,34 @@ (function(v){function e(a){c.debug&&console.log("Graph created");this.list_of_graphcanvas=null;this.clear();a&&this.configure(a)}function h(a,b,d,u,k,c){this.id=a;this.type=b;this.origin_id=d;this.origin_slot=u;this.target_id=k;this.target_slot=c;this._data=null;this._pos=new Float32Array(2)}function r(a){this._ctor(a)}function m(a){this._ctor(a)}function s(a,b){this.offset=new Float32Array([0,0]);this.scale=1;this.max_scale=10;this.min_scale=0.1;this.onredraw=null;this.enabled=!0;this.last_mouse= [0,0];this.element=null;this.visible_area=new Float32Array(4);a&&(this.element=a,b||this.bindEvents(a))}function f(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.ds=new s;this.zoom_modify_alpha=!0;this.title_text_font=""+c.NODE_TEXT_SIZE+"px Arial";this.inner_text_font="normal "+c.NODE_SUBTEXT_SIZE+"px Arial";this.node_title_color=c.NODE_TITLE_COLOR;this.default_link_color=c.LINK_COLOR;this.default_connection_color={input_off:"#778",input_on:"#7F7",output_off:"#778",output_on:"#7F7"};this.highquality_render=!0;this.use_gradients=!1;this.editor_alpha=1;this.pause_rendering=!1;this.render_only_selected= -this.clear_background=!0;this.live_mode=!1;this.allow_searchbox=this.allow_interaction=this.allow_dragnodes=this.allow_dragcanvas=this.show_info=!0;this.drag_mode=this.allow_reconnect_links=!1;this.filter=this.dragging_rectangle=null;this.always_render_background=!1;this.render_canvas_border=this.render_shadows=!0;this.render_connections_shadows=!1;this.render_connections_border=!0;this.render_connection_arrows=this.render_curved_connections=!1;this.render_collapsed_slots=!0;this.render_execution_order= -!1;this.render_title_colored=!0;this.links_render_mode=c.SPLINE_LINK;this.canvas_mouse=[0,0];this.onDrawOverlay=this.onDrawForeground=this.onDrawBackground=this.onMouse=this.onSearchBoxSelection=this.onSearchBox=null;this.connections_width=3;this.round_radius=8;this.node_widget=this.current_node=null;this.last_mouse_position=[0,0];this.visible_area=this.ds.visible_area;this.visible_links=[];b&&b.attachCanvas(this);this.setCanvas(a);this.clear();d.skip_render||this.startRendering();this.autoresize= -d.autoresize}function y(a,b){return Math.sqrt((b[0]-a[0])*(b[0]-a[0])+(b[1]-a[1])*(b[1]-a[1]))}function B(a,b,d,u,k,c){return da&&ub?!0:!1}function A(a,b){var d=a[0]+a[2],u=a[1]+a[3],k=b[1]+b[3];return a[0]>b[0]+b[2]||a[1]>k||de.width-f.width-10&&(c=e.width-f.width-10);g>e.height-f.height-10&&(g=e.height-f.height-10)}k.style.left=c+"px";k.style.top=g+"px";b.scale&&(k.style.transform="scale("+b.scale+")")}var c=v.LiteGraph={VERSION:0.4,CANVAS_GRID_SIZE:10, -NODE_TITLE_HEIGHT:30,NODE_TITLE_TEXT_Y:20,NODE_SLOT_HEIGHT:20,NODE_WIDGET_HEIGHT:20,NODE_WIDTH:140,NODE_MIN_WIDTH:50,NODE_COLLAPSED_RADIUS:10,NODE_COLLAPSED_WIDTH:80,NODE_TITLE_COLOR:"#999",NODE_TEXT_SIZE:14,NODE_TEXT_COLOR:"#AAA",NODE_SUBTEXT_SIZE:12,NODE_DEFAULT_COLOR:"#333",NODE_DEFAULT_BGCOLOR:"#353535",NODE_DEFAULT_BOXCOLOR:"#666",NODE_DEFAULT_SHAPE:"box",DEFAULT_SHADOW_COLOR:"rgba(0,0,0,0.5)",DEFAULT_GROUP_FONT:24,LINK_COLOR:"#9A9",EVENT_LINK_COLOR:"#A86",CONNECTING_LINK_COLOR:"#AFA",MAX_NUMBER_OF_NODES:1E3, -DEFAULT_POSITION:[100,100],VALID_SHAPES:["default","box","round","card"],BOX_SHAPE:1,ROUND_SHAPE:2,CIRCLE_SHAPE:3,CARD_SHAPE:4,ARROW_SHAPE:5,INPUT:1,OUTPUT:2,EVENT:-1,ACTION:-1,ALWAYS:0,ON_EVENT:1,NEVER:2,ON_TRIGGER:3,UP:1,DOWN:2,LEFT:3,RIGHT:4,CENTER:5,STRAIGHT_LINK:0,LINEAR_LINK:1,SPLINE_LINK:2,NORMAL_TITLE:0,NO_TITLE:1,TRANSPARENT_TITLE:2,AUTOHIDE_TITLE:3,proxy:null,node_images_path:"",debug:!1,catch_exceptions:!0,throw_errors:!0,allow_scripts:!1,registered_node_types:{},node_types_by_file_extension:{}, -Nodes:{},searchbox_extras:{},registerNodeType:function(a,b){if(!b.prototype)throw"Cannot register a simple object, it must be a class with a prototype";b.type=a;c.debug&&console.log("Node registered: "+a);a.split("/");var d=b.name,u=a.lastIndexOf("/");b.category=a.substr(0,u);b.title||(b.title=d);if(b.prototype)for(var k in r.prototype)b.prototype[k]||(b.prototype[k]=r.prototype[k]);Object.defineProperty(b.prototype,"shape",{set:function(a){switch(a){case "default":delete this._shape;break;case "box":this._shape= -c.BOX_SHAPE;break;case "round":this._shape=c.ROUND_SHAPE;break;case "circle":this._shape=c.CIRCLE_SHAPE;break;case "card":this._shape=c.CARD_SHAPE;break;default:this._shape=a}},get:function(a){return this._shape},enumerable:!0});u=this.registered_node_types[a];this.registered_node_types[a]=b;b.constructor.name&&(this.Nodes[d]=b);if(c.onNodeTypeRegistered)c.onNodeTypeRegistered(a,b);if(u&&c.onNodeTypeReplaced)c.onNodeTypeReplaced(a,b,u);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(k in b.supported_extensions)this.node_types_by_file_extension[b.supported_extensions[k].toLowerCase()]=b},wrapFunctionAsNode:function(a,b,d,u,k){for(var g=Array(b.length),e="",f=c.getParameterNames(b),p=0;puvcode must be vec2, is optional
\t\t\tuv: tex. coords
color: texture
colorB: textureB
time: scene time
value: input value
For multiline you must type: result = ...
";this.properties={value:1,uvcode:"",pixelcode:"color + colorB * value", -precision:h.DEFAULT};this.has_error=!1};s.widgets_info={uvcode:{widget:"textarea",height:100},pixelcode:{widget:"textarea",height:100},precision:{widget:"combo",values:h.MODE_VALUES}};s.title="Operation";s.desc="Texture shader operation";s.prototype.getExtraMenuOptions=function(a){var b=this;return[{content:b.properties.show?"Hide Texture":"Show Texture",callback:function(){b.properties.show=!b.properties.show}}]};s.prototype.onPropertyChanged=function(){this.has_error=!1};s.prototype.onDrawBackground= -function(a){this.flags.collapsed||20>=this.size[1]||!this.properties.show||!this._tex||this._tex.gl!=a||(a.save(),a.drawImage(this._tex,0,0,this.size[0],this.size[1]),a.restore())};s.prototype.onExecute=function(){var a=this.getInputData(0);if(this.isOutputConnected(0))if(this.properties.precision===h.PASS_THROUGH)this.setOutputData(0,a);else{var b=this.getInputData(1);if(this.properties.uvcode||this.properties.pixelcode){var c=512,d=512;a?(c=a.width,d=a.height):b&&(c=b.width,d=b.height);var e=h.getTextureType(this.properties.precision, -a);this._tex=a||this._tex?h.getTargetTexture(a||this._tex,this._tex,this.properties.precision):new GL.Texture(c,d,{type:e,format:gl.RGBA,filter:gl.LINEAR});e="";this.properties.uvcode&&(e="uv = "+this.properties.uvcode,-1!=this.properties.uvcode.indexOf(";")&&(e=this.properties.uvcode));var g="";this.properties.pixelcode&&(g="result = "+this.properties.pixelcode,-1!=this.properties.pixelcode.indexOf(";")&&(g=this.properties.pixelcode));var f=this._shader;if(!(this.has_error||f&&this._shader_code== -e+"|"+g)){var k=h.replaceCode(s.pixel_shader,{UV_CODE:e,PIXEL_CODE:g});try{f=new GL.Shader(Shader.SCREEN_VERTEX_SHADER,k),this.boxcolor="#00FF00"}catch(q){console.log("Error compiling shader: ",q,k);this.boxcolor="#FF0000";this.has_error=!0;return}this._shader=f;this._shader_code=e+"|"+g}var l=this.getInputData(2);null!=l?this.properties.value=l:l=parseFloat(this.properties.value);var m=this.graph.getTime();this._tex.drawTo(function(){gl.disable(gl.DEPTH_TEST);gl.disable(gl.CULL_FACE);gl.disable(gl.BLEND); -a&&a.bind(0);b&&b.bind(1);var e=Mesh.getScreenQuad();f.uniforms({u_texture:0,u_textureB:1,value:l,texSize:[c,d],time:m}).draw(e)});this.setOutputData(0,this._tex)}}};s.pixel_shader="precision highp float;\n\t\t\t\n\t\t\tuniform sampler2D u_texture;\n\t\t\tuniform sampler2D u_textureB;\n\t\t\tvarying vec2 v_coord;\n\t\t\tuniform vec2 texSize;\n\t\t\tuniform float time;\n\t\t\tuniform float value;\n\t\t\t\n\t\t\tvoid main() {\n\t\t\t\tvec2 uv = v_coord;\n\t\t\t\t{{UV_CODE}};\n\t\t\t\tvec4 color4 = texture2D(u_texture, uv);\n\t\t\t\tvec3 color = color4.rgb;\n\t\t\t\tvec4 color4B = texture2D(u_textureB, uv);\n\t\t\t\tvec3 colorB = color4B.rgb;\n\t\t\t\tvec3 result = color;\n\t\t\t\tfloat alpha = 1.0;\n\t\t\t\t{{PIXEL_CODE}};\n\t\t\t\tgl_FragColor = vec4(result, alpha);\n\t\t\t}\n\t\t\t"; +this.addInput("TextureB","Texture");this.addInput("value","number");this.addOutput("Texture","Texture");this.help="pixelcode must be vec3, uvcode must be vec2, is optional
\t\t\tuv: tex. coords
color: texture colorB: textureB
time: scene time value: input value
For multiline you must type: result = ...
";this.properties={value:1,pixelcode:"color + colorB * value",uvcode:"",precision:h.DEFAULT}; +this.has_error=!1};s.widgets_info={uvcode:{widget:"code"},pixelcode:{widget:"code"},precision:{widget:"combo",values:h.MODE_VALUES}};s.title="Operation";s.desc="Texture shader operation";s.prototype.getExtraMenuOptions=function(a){var b=this;return[{content:b.properties.show?"Hide Texture":"Show Texture",callback:function(){b.properties.show=!b.properties.show}}]};s.prototype.onPropertyChanged=function(){this.has_error=!1};s.prototype.onDrawBackground=function(a){this.flags.collapsed||20>=this.size[1]|| +!this.properties.show||!this._tex||this._tex.gl!=a||(a.save(),a.drawImage(this._tex,0,0,this.size[0],this.size[1]),a.restore())};s.prototype.onExecute=function(){var a=this.getInputData(0);if(this.isOutputConnected(0))if(this.properties.precision===h.PASS_THROUGH)this.setOutputData(0,a);else{var b=this.getInputData(1);if(this.properties.uvcode||this.properties.pixelcode){var c=512,d=512;a?(c=a.width,d=a.height):b&&(c=b.width,d=b.height);var e=h.getTextureType(this.properties.precision,a);this._tex= +a||this._tex?h.getTargetTexture(a||this._tex,this._tex,this.properties.precision):new GL.Texture(c,d,{type:e,format:gl.RGBA,filter:gl.LINEAR});e="";this.properties.uvcode&&(e="uv = "+this.properties.uvcode,-1!=this.properties.uvcode.indexOf(";")&&(e=this.properties.uvcode));var g="";this.properties.pixelcode&&(g="result = "+this.properties.pixelcode,-1!=this.properties.pixelcode.indexOf(";")&&(g=this.properties.pixelcode));var f=this._shader;if(!(this.has_error||f&&this._shader_code==e+"|"+g)){var k= +h.replaceCode(s.pixel_shader,{UV_CODE:e,PIXEL_CODE:g});try{f=new GL.Shader(Shader.SCREEN_VERTEX_SHADER,k),this.boxcolor="#00FF00"}catch(q){console.log("Error compiling shader: ",q,k);this.boxcolor="#FF0000";this.has_error=!0;return}this._shader=f;this._shader_code=e+"|"+g}var l=this.getInputData(2);null!=l?this.properties.value=l:l=parseFloat(this.properties.value);var m=this.graph.getTime();this._tex.drawTo(function(){gl.disable(gl.DEPTH_TEST);gl.disable(gl.CULL_FACE);gl.disable(gl.BLEND);a&&a.bind(0); +b&&b.bind(1);var e=Mesh.getScreenQuad();f.uniforms({u_texture:0,u_textureB:1,value:l,texSize:[c,d],time:m}).draw(e)});this.setOutputData(0,this._tex)}}};s.pixel_shader="precision highp float;\n\t\t\t\n\t\t\tuniform sampler2D u_texture;\n\t\t\tuniform sampler2D u_textureB;\n\t\t\tvarying vec2 v_coord;\n\t\t\tuniform vec2 texSize;\n\t\t\tuniform float time;\n\t\t\tuniform float value;\n\t\t\t\n\t\t\tvoid main() {\n\t\t\t\tvec2 uv = v_coord;\n\t\t\t\t{{UV_CODE}};\n\t\t\t\tvec4 color4 = texture2D(u_texture, uv);\n\t\t\t\tvec3 color = color4.rgb;\n\t\t\t\tvec4 color4B = texture2D(u_textureB, uv);\n\t\t\t\tvec3 colorB = color4B.rgb;\n\t\t\t\tvec3 result = color;\n\t\t\t\tfloat alpha = 1.0;\n\t\t\t\t{{PIXEL_CODE}};\n\t\t\t\tgl_FragColor = vec4(result, alpha);\n\t\t\t}\n\t\t\t"; e.registerNodeType("texture/operation",s);var f=function(){this.addOutput("out","Texture");this.properties={code:"",width:512,height:512,precision:h.DEFAULT};this.properties.code="\nvoid main() {\n vec2 uv = v_coord;\n vec3 color = vec3(0.0);\n//your code here\n\ngl_FragColor = vec4(color, 1.0);\n}\n";this._uniforms={in_texture:0,texSize:vec2.create(),time:0}};f.title="Shader";f.desc="Texture shader";f.widgets_info={code:{type:"code"},precision:{widget:"combo",values:h.MODE_VALUES}};f.prototype.onPropertyChanged= function(a,b){if("code"==a){var c=this.getShader();if(c){var d=c.uniformInfo;if(this.inputs)for(var e={},g=0;g