Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-04-28 02:02:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

lil fixes

Browse Source
This commit is contained in:
tamat
2020-07-25 22:08:16 +02:00
parent baed06fa37
commit 0b5b1adb16
3 changed files with 164 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/litegraph.js
View File

@@ -8578,6 +8578,7 @@ LGraphNode.prototype.executeAction = function(action)
ctx.textAlign = "left";
if(w.disabled)
ctx.globalAlpha *= 0.5;
var widget_width = w.width || width;
switch (w.type) {
case "button":
@@ -8586,13 +8587,13 @@ LGraphNode.prototype.executeAction = function(action)
w.clicked = false;
this.dirty_canvas = true;
}
ctx.fillRect(margin, y, width - margin * 2, H);
ctx.fillRect(margin, y, widget_width - margin * 2, H);
if(show_text && !w.disabled)
ctx.strokeRect( margin, y, width - margin * 2, H );
ctx.strokeRect( margin, y, widget_width - margin * 2, H );
if (show_text) {
ctx.textAlign = "center";
ctx.fillStyle = text_color;
ctx.fillText(w.name, width * 0.5, y + H * 0.7);
ctx.fillText(w.name, widget_width * 0.5, y + H * 0.7);
}
break;
case "toggle":
@@ -8601,15 +8602,15 @@ LGraphNode.prototype.executeAction = function(action)
ctx.fillStyle = background_color;
ctx.beginPath();
if (show_text)
ctx.roundRect(margin, posY, width - margin * 2, H, H * 0.5);
ctx.roundRect(margin, posY, widget_width - margin * 2, H, H * 0.5);
else
ctx.rect(margin, posY, width - margin * 2, H );
ctx.rect(margin, posY, widget_width - margin * 2, H );
ctx.fill();
if(show_text && !w.disabled)
ctx.stroke();
ctx.fillStyle = w.value ? "#89A" : "#333";
ctx.beginPath();
ctx.arc( width - margin * 2, y + H * 0.5, H * 0.36, 0, Math.PI * 2 );
ctx.arc( widget_width - margin * 2, y + H * 0.5, H * 0.36, 0, Math.PI * 2 );
ctx.fill();
if (show_text) {
ctx.fillStyle = secondary_text_color;
@@ -8622,31 +8623,31 @@ LGraphNode.prototype.executeAction = function(action)
w.value
? w.options.on || "true"
: w.options.off || "false",
width - 40,
widget_width - 40,
y + H * 0.7
);
}
break;
case "slider":
ctx.fillStyle = background_color;
ctx.fillRect(margin, y, width - margin * 2, H);
ctx.fillRect(margin, y, widget_width - margin * 2, H);
var range = w.options.max - w.options.min;
var nvalue = (w.value - w.options.min) / range;
ctx.fillStyle = active_widget == w ? "#89A" : "#678";
ctx.fillRect(margin, y, nvalue * (width - margin * 2), H);
ctx.fillRect(margin, y, nvalue * (widget_width - margin * 2), H);
if(show_text && !w.disabled)
ctx.strokeRect(margin, y, width - margin * 2, H);
ctx.strokeRect(margin, y, widget_width - margin * 2, H);
if (w.marker) {
var marker_nvalue = (w.marker - w.options.min) / range;
ctx.fillStyle = "#AA9";
ctx.fillRect( margin + marker_nvalue * (width - margin * 2), y, 2, H );
ctx.fillRect( margin + marker_nvalue * (widget_width - margin * 2), y, 2, H );
}
if (show_text) {
ctx.textAlign = "center";
ctx.fillStyle = text_color;
ctx.fillText(
w.name + " " + Number(w.value).toFixed(3),
width * 0.5,
widget_width * 0.5,
y + H * 0.7
);
}
@@ -8658,9 +8659,9 @@ LGraphNode.prototype.executeAction = function(action)
ctx.fillStyle = background_color;
ctx.beginPath();
if(show_text)
ctx.roundRect(margin, posY, width - margin * 2, H, H * 0.5);
ctx.roundRect(margin, posY, widget_width - margin * 2, H, H * 0.5);
else
ctx.rect(margin, posY, width - margin * 2, H );
ctx.rect(margin, posY, widget_width - margin * 2, H );
ctx.fill();
if (show_text) {
if(!w.disabled)
@@ -8674,9 +8675,9 @@ LGraphNode.prototype.executeAction = function(action)
ctx.lineTo(margin + 16, posY + H - 5);
ctx.fill();
ctx.beginPath();
ctx.moveTo(width - margin - 16, posY + 5);
ctx.lineTo(width - margin - 6, posY + H * 0.5);
ctx.lineTo(width - margin - 16, posY + H - 5);
ctx.moveTo(widget_width - margin - 16, posY + 5);
ctx.lineTo(widget_width - margin - 6, posY + H * 0.5);
ctx.lineTo(widget_width - margin - 16, posY + H - 5);
ctx.fill();
}
ctx.fillStyle = secondary_text_color;
@@ -8690,7 +8691,7 @@ LGraphNode.prototype.executeAction = function(action)
? w.options.precision
: 3
),
width - margin * 2 - 20,
widget_width - margin * 2 - 20,
y + H * 0.7
);
} else {
@@ -8705,7 +8706,7 @@ LGraphNode.prototype.executeAction = function(action)
}
ctx.fillText(
v,
width - margin * 2 - 20,
widget_width - margin * 2 - 20,
y + H * 0.7
);
}
@@ -8718,14 +8719,14 @@ LGraphNode.prototype.executeAction = function(action)
ctx.fillStyle = background_color;
ctx.beginPath();
if (show_text)
ctx.roundRect(margin, posY, width - margin * 2, H, H * 0.5);
ctx.roundRect(margin, posY, widget_width - margin * 2, H, H * 0.5);
else
ctx.rect( margin, posY, width - margin * 2, H );
ctx.rect( margin, posY, widget_width - margin * 2, H );
ctx.fill();
if (show_text) {
ctx.save();
ctx.beginPath();
ctx.rect(margin, posY, width - margin * 2, H);
ctx.rect(margin, posY, widget_width - margin * 2, H);
ctx.clip();
ctx.stroke();
@@ -8735,17 +8736,17 @@ LGraphNode.prototype.executeAction = function(action)
}
ctx.fillStyle = text_color;
ctx.textAlign = "right";
ctx.fillText(String(w.value).substr(0,30), width - margin * 2, y + H * 0.7); //30 chars max
ctx.fillText(String(w.value).substr(0,30), widget_width - margin * 2, y + H * 0.7); //30 chars max
ctx.restore();
}
break;
default:
if (w.draw) {
w.draw(ctx, node, width, y, H);
w.draw(ctx, node, widget_width, y, H);
}
break;
}
posY += (w.computeSize ? w.computeSize(width)[1] : H) + 4;
posY += (w.computeSize ? w.computeSize(widget_width)[1] : H) + 4;
ctx.globalAlpha = this.editor_alpha;
}
@@ -8778,14 +8779,15 @@ LGraphNode.prototype.executeAction = function(action)
if(!w || w.disabled)
continue;
var widget_height = w.computeSize ? w.computeSize(width)[1] : LiteGraph.NODE_WIDGET_HEIGHT;
var widget_width = w.width || width;
//outside
if ( w != active_widget &&
(x < 6 || x > width - 12 || y < w.last_y || y > w.last_y + widget_height) )
(x < 6 || x > widget_width - 12 || y < w.last_y || y > w.last_y + widget_height) )
continue;
var old_value = w.value;
//if ( w == active_widget || (x > 6 && x < width - 12 && y > w.last_y && y < w.last_y + widget_height) ) {
//if ( w == active_widget || (x > 6 && x < widget_width - 12 && y > w.last_y && y < w.last_y + widget_height) ) {
//inside widget
switch (w.type) {
case "button":
@@ -8802,7 +8804,7 @@ LGraphNode.prototype.executeAction = function(action)
break;
case "slider":
var range = w.options.max - w.options.min;
var nvalue = Math.clamp((x - 10) / (width - 20), 0, 1);
var nvalue = Math.clamp((x - 10) / (widget_width - 20), 0, 1);
w.value =
w.options.min +
(w.options.max - w.options.min) * nvalue;
@@ -8834,7 +8836,7 @@ LGraphNode.prototype.executeAction = function(action)
if( w.type != "number")
values_list = values.constructor === Array ? values : Object.keys(values);
var delta = x < 40 ? -1 : x > width - 40 ? 1 : 0;
var delta = x < 40 ? -1 : x > widget_width - 40 ? 1 : 0;
if (w.type == "number") {
w.value += delta * 0.1 * (w.options.step || 1);
if ( w.options.min != null && w.value < w.options.min ) {
@@ -8881,7 +8883,7 @@ LGraphNode.prototype.executeAction = function(action)
} //end mousedown
else if(event.type == "mouseup" && w.type == "number")
{
var delta = x < 40 ? -1 : x > width - 40 ? 1 : 0;
var delta = x < 40 ? -1 : x > widget_width - 40 ? 1 : 0;
if (event.click_time < 200 && delta == 0) {
this.prompt("Value",w.value,function(v) {
this.value = Number(v);

72
src/nodes/glshaders.js
View File

@@ -46,7 +46,9 @@
"distance":"float distance(T p0, T p1)",
"normalize":"T normalize(T x)",
"dot": "float dot(T x,T y)",
"cross": "vec3 cross(vec3 x,vec3 y)"
"cross": "vec3 cross(vec3 x,vec3 y)",
"reflect": "vec3 reflect(vec3 V,vec3 N)",
"refract": "vec3 refract(vec3 V,vec3 N, float IOR)"
};
//parse them
@@ -105,6 +107,36 @@
this.graph._version++;
}
/*
if(!node_ctor.prototype.onGetCode)
node_ctor.prototype.onGetCode = function()
{
//check destination to avoid lonely nodes
if(!this.shader_destination)
return;
//grab inputs with types
var inputs = [];
if(this.inputs)
for(var i = 0; i < this.inputs.length; ++i)
inputs.push({ type: this.getInputData(i), name: getInputLinkID(this,i) });
var outputs = [];
if(this.outputs)
for(var i = 0; i < this.outputs.length; ++i)
outputs.push({ name: getOutputLinkID(this,i) });
//pass to code func
var results = this.extractCode(inputs);
//grab output, pass to next
if(results)
for(var i = 0; i < results.length; ++i)
{
var r = results[i];
if(!r)
continue;
this.setOutputData(i,r.value);
}
}
*/
LiteGraph.registerNodeType( "shader::" + type, node_ctor );
}
@@ -755,6 +787,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderUniform.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
var type = this.properties.type;
if( !type )
return;
@@ -792,6 +827,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderAttribute.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
var type = this.properties.type;
if( !type || LGShaders.GLSL_types.indexOf(type) == -1 )
return;
@@ -825,6 +863,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderSampler2D.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
var texname = getInputLinkID( this, 0 );
var varname = getShaderNodeVarName(this);
var code = "vec4 " + varname + " = vec4(0.0);\n";
@@ -937,6 +978,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderConstant.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
var value = valueToGLSL( this.properties.value, this.properties.type );
var link_name = getOutputLinkID(this,0);
if(!link_name) //not connected
@@ -972,6 +1016,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderVec2.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
var props = this.properties;
var varname = getShaderNodeVarName(this);
@@ -1038,6 +1085,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderVec3.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
var props = this.properties;
var varname = getShaderNodeVarName(this);
@@ -1102,6 +1152,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderVec4.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
var props = this.properties;
var varname = getShaderNodeVarName(this);
@@ -1211,6 +1264,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderOperation.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
if(!this.isOutputConnected(0))
return;
@@ -1307,6 +1363,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderFunc.prototype.onGetCode = function( context )
{
if(!this.shader_destination)
return;
if(!this.isOutputConnected(0))
return;
@@ -1389,7 +1448,7 @@ gl_FragColor = fragcolor;\n\
LGraphShaderSnippet.prototype.onGetCode = function( context )
{
if(!this.isOutputConnected(0))
if(!this.shader_destination || !this.isOutputConnected(0))
return;
var inlinkA = getInputLinkID(this,0);
@@ -1438,7 +1497,7 @@ gl_FragColor = fragcolor;\n\
LGraphShaderRand.prototype.onGetCode = function( context )
{
if(!this.isOutputConnected(0))
if(!this.shader_destination || !this.isOutputConnected(0))
return;
var outlink = getOutputLinkID(this,0);
@@ -1463,7 +1522,7 @@ gl_FragColor = fragcolor;\n\
LGraphShaderTime.prototype.onGetCode = function( context )
{
if(!this.isOutputConnected(0))
if(!this.shader_destination || !this.isOutputConnected(0))
return;
var outlink = getOutputLinkID(this,0);
@@ -1486,8 +1545,9 @@ gl_FragColor = fragcolor;\n\
LGraphShaderDither.prototype.onGetCode = function( context )
{
if(!this.isOutputConnected(0))
if(!this.shader_destination || !this.isOutputConnected(0))
return;
var inlink = getInputLinkID(this,0);
var return_type = "float";
var outlink = getOutputLinkID(this,0);
@@ -1550,7 +1610,7 @@ gl_FragColor = fragcolor;\n\
LGraphShaderRemap.prototype.onGetCode = function( context )
{
if(!this.isOutputConnected(0))
if(!this.shader_destination || !this.isOutputConnected(0))
return;
var inlink = getInputLinkID(this,0);