Skip to content

Commit ef67b4c

Browse files
committed
Merging with (the)Master and nodeWebcam_Fix
1 parent b91263c commit ef67b4c

File tree

8 files changed

+149
-38
lines changed

8 files changed

+149
-38
lines changed

css/litegraph.css

+8-1
Original file line numberDiff line numberDiff line change
@@ -509,7 +509,7 @@
509509
position: absolute;
510510
top: 10px;
511511
left: 10px;
512-
min-height: 2em;
512+
/*min-height: 2em;*/
513513
background-color: #333;
514514
font-size: 1.2em;
515515
box-shadow: 0 0 10px black !important;
@@ -529,6 +529,7 @@
529529
}
530530

531531
.graphdialog input,
532+
.graphdialog textarea,
532533
.graphdialog select {
533534
margin: 3px;
534535
min-width: 60px;
@@ -540,9 +541,15 @@
540541
outline: none;
541542
}
542543

544+
.graphdialog textarea {
545+
min-height: 150px;
546+
}
547+
543548
.graphdialog button {
544549
margin-top: 3px;
545550
vertical-align: top;
551+
background-color: #999;
552+
border: 0;
546553
}
547554

548555
.graphdialog button.rounded,

editor/js/demos.js

+1
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,7 @@ function TestWidgetsNode()
8989
this.number = this.addWidget("number","Number", 0.5, function(v){}, { min: 0, max: 100} );
9090
this.combo = this.addWidget("combo","Combo", "red", function(v){}, { values:["red","green","blue"]} );
9191
this.text = this.addWidget("text","Text", "edit me", function(v){}, {} );
92+
this.text2 = this.addWidget("text","Text", "multiline", function(v){}, { multiline:true } );
9293
this.toggle = this.addWidget("toggle","Toggle", true, function(v){}, { on: "enabled", off:"disabled"} );
9394
this.button = this.addWidget("button","Button", null, function(v){}, {} );
9495
this.toggle2 = this.addWidget("toggle","Disabled", true, function(v){}, { on: "enabled", off:"disabled"} );

index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ <h2>Usage</h2>
7171

7272
<h2>Example of editor</h2>
7373
<ul>
74-
<li><a href="demo">Module editor</a></li>
74+
<li><a href="editor">Module editor</a></li>
7575
</ul>
7676

7777
<h2>Documentation</h2>

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "litegraph.js",
3-
"version": "0.7.8",
3+
"version": "0.7.9",
44
"description": "A graph node editor similar to PD or UDK Blueprints. It works in an HTML5 Canvas and allows to export graphs to be included in applications.",
55
"main": "build/litegraph.js",
66
"types": "src/litegraph.d.ts",

src/litegraph.d.ts

+26-5
Original file line numberDiff line numberDiff line change
@@ -740,7 +740,7 @@ export declare class LGraphNode {
740740
name: string,
741741
type: string | -1,
742742
extra_info?: Partial<INodeOutputSlot>
743-
): void;
743+
): INodeOutputSlot;
744744
/**
745745
* add a new output slot to use in this node
746746
* @param array of triplets like [[name,type,extra_info],[...]]
@@ -760,7 +760,7 @@ export declare class LGraphNode {
760760
name: string,
761761
type: string | -1,
762762
extra_info?: Partial<INodeInputSlot>
763-
): void;
763+
): INodeInputSlot;
764764
/**
765765
* add several new input slots in this node
766766
* @param array of triplets like [[name,type,extra_info],[...]]
@@ -953,13 +953,34 @@ export declare class LGraphNode {
953953
/**
954954
* if returns false the incoming connection will be canceled
955955
* Called by `LGraph.connect`
956+
* @param inputIndex target input slot number
957+
* @param outputType type of output slot
958+
* @param outputSlot output slot object
959+
* @param outputNode node containing the output
960+
* @param outputIndex index of output slot
956961
*/
957962
onConnectInput?(
958963
inputIndex: number,
959-
type: INodeOutputSlot["type"],
964+
outputType: INodeOutputSlot["type"],
960965
outputSlot: INodeOutputSlot,
961-
_this: this,
962-
slotIndex: number
966+
outputNode: LGraphNode,
967+
outputIndex: number
968+
): boolean;
969+
/**
970+
* if returns false the incoming connection will be canceled
971+
* Called by `LGraph.connect`
972+
* @param outputIndex target output slot number
973+
* @param inputType type of input slot
974+
* @param inputSlot input slot object
975+
* @param inputNode node containing the input
976+
* @param inputIndex index of input slot
977+
*/
978+
onConnectOutput?(
979+
outputIndex: number,
980+
inputType: INodeInputSlot["type"],
981+
inputSlot: INodeInputSlot,
982+
inputNode: LGraphNode,
983+
inputIndex: number
963984
): boolean;
964985

965986
/**

src/litegraph.js

+23-17
Original file line numberDiff line numberDiff line change
@@ -1365,6 +1365,8 @@
13651365
return;
13661366
} //cannot be removed
13671367

1368+
this.beforeChange(); //sure?
1369+
13681370
//disconnect inputs
13691371
if (node.inputs) {
13701372
for (var i = 0; i < node.inputs.length; i++) {
@@ -1423,6 +1425,7 @@
14231425
this.sendActionToCanvas("checkPanels");
14241426

14251427
this.setDirtyCanvas(true, true);
1428+
this.afterChange(); //sure?
14261429
this.change();
14271430

14281431
this.updateExecutionOrder();
@@ -8622,6 +8625,7 @@ LGraphNode.prototype.executeAction = function(action)
86228625
ctx.strokeStyle = outline_color;
86238626
ctx.fillStyle = "#222";
86248627
ctx.textAlign = "left";
8628+
//ctx.lineWidth = 2;
86258629
if(w.disabled)
86268630
ctx.globalAlpha *= 0.5;
86278631
var widget_width = w.width || width;
@@ -8769,13 +8773,15 @@ LGraphNode.prototype.executeAction = function(action)
87698773
else
87708774
ctx.rect( margin, posY, widget_width - margin * 2, H );
87718775
ctx.fill();
8772-
if (show_text) {
8773-
ctx.save();
8776+
if (show_text) {
8777+
if(!w.disabled)
8778+
ctx.stroke();
8779+
ctx.save();
87748780
ctx.beginPath();
87758781
ctx.rect(margin, posY, widget_width - margin * 2, H);
87768782
ctx.clip();
87778783

8778-
ctx.stroke();
8784+
//ctx.stroke();
87798785
ctx.fillStyle = secondary_text_color;
87808786
if (w.name != null) {
87818787
ctx.fillText(w.name, margin * 2, y + H * 0.7);
@@ -8850,10 +8856,8 @@ LGraphNode.prototype.executeAction = function(action)
88508856
break;
88518857
case "slider":
88528858
var range = w.options.max - w.options.min;
8853-
var nvalue = Math.clamp((x - 10) / (widget_width - 20), 0, 1);
8854-
w.value =
8855-
w.options.min +
8856-
(w.options.max - w.options.min) * nvalue;
8859+
var nvalue = Math.clamp((x - 15) / (widget_width - 30), 0, 1);
8860+
w.value = w.options.min + (w.options.max - w.options.min) * nvalue;
88578861
if (w.callback) {
88588862
setTimeout(function() {
88598863
inner_value_change(w, w.value);
@@ -8963,7 +8967,7 @@ LGraphNode.prototype.executeAction = function(action)
89638967
this.value = v;
89648968
inner_value_change(this, v);
89658969
}.bind(w),
8966-
event);
8970+
event,w.options ? w.options.multiline : false );
89678971
}
89688972
break;
89698973
default:
@@ -9550,18 +9554,18 @@ LGraphNode.prototype.executeAction = function(action)
95509554

95519555
var dialog = document.createElement("div");
95529556
dialog.className = "graphdialog";
9553-
dialog.innerHTML =
9554-
"<span class='name'></span><input autofocus type='text' class='value'/><button>OK</button>";
9557+
dialog.innerHTML = "<span class='name'></span><input autofocus type='text' class='value'/><button>OK</button>";
9558+
//dialog.innerHTML = "<span class='name'></span><textarea autofocus class='value'></textarea><button>OK</button>";
95559559
var title = dialog.querySelector(".name");
95569560
title.innerText = property;
9557-
var input = dialog.querySelector("input");
9561+
var input = dialog.querySelector(".value");
95589562
if (input) {
95599563
input.value = value;
95609564
input.addEventListener("blur", function(e) {
95619565
this.focus();
95629566
});
95639567
input.addEventListener("keydown", function(e) {
9564-
if (e.keyCode != 13) {
9568+
if (e.keyCode != 13 && e.target.localName != "textarea") {
95659569
return;
95669570
}
95679571
inner();
@@ -9611,7 +9615,7 @@ LGraphNode.prototype.executeAction = function(action)
96119615
}
96129616
};
96139617

9614-
LGraphCanvas.prototype.prompt = function(title, value, callback, event) {
9618+
LGraphCanvas.prototype.prompt = function(title, value, callback, event, multiline) {
96159619
var that = this;
96169620
var input_html = "";
96179621
title = title || "";
@@ -9620,8 +9624,10 @@ LGraphNode.prototype.executeAction = function(action)
96209624

96219625
var dialog = document.createElement("div");
96229626
dialog.className = "graphdialog rounded";
9623-
dialog.innerHTML =
9624-
"<span class='name'></span> <input autofocus type='text' class='value'/><button class='rounded'>OK</button>";
9627+
if(multiline)
9628+
dialog.innerHTML = "<span class='name'></span> <textarea autofocus class='value'></textarea><button class='rounded'>OK</button>";
9629+
else
9630+
dialog.innerHTML = "<span class='name'></span> <input autofocus type='text' class='value'/><button class='rounded'>OK</button>";
96259631
dialog.close = function() {
96269632
that.prompt_box = null;
96279633
if (dialog.parentNode) {
@@ -9653,13 +9659,13 @@ LGraphNode.prototype.executeAction = function(action)
96539659
var value_element = dialog.querySelector(".value");
96549660
value_element.value = value;
96559661

9656-
var input = dialog.querySelector("input");
9662+
var input = value_element;
96579663
input.addEventListener("keydown", function(e) {
96589664
modified = true;
96599665
if (e.keyCode == 27) {
96609666
//ESC
96619667
dialog.close();
9662-
} else if (e.keyCode == 13) {
9668+
} else if (e.keyCode == 13 && e.target.localName != "textarea") {
96639669
if (callback) {
96649670
callback(this.value);
96659671
}

src/nodes/base.js

+77-12
Original file line numberDiff line numberDiff line change
@@ -716,6 +716,21 @@
716716

717717
LiteGraph.registerNodeType("basic/string", ConstantString);
718718

719+
function ConstantObject() {
720+
this.addOutput("obj", "object");
721+
this.size = [120, 30];
722+
this._object = {};
723+
}
724+
725+
ConstantObject.title = "Const Object";
726+
ConstantObject.desc = "Constant Object";
727+
728+
ConstantObject.prototype.onExecute = function() {
729+
this.setOutputData(0, this._object);
730+
};
731+
732+
LiteGraph.registerNodeType( "basic/object", ConstantObject );
733+
719734
function ConstantFile() {
720735
this.addInput("url", "");
721736
this.addOutput("", "");
@@ -851,14 +866,14 @@
851866

852867
//to store json objects
853868
function ConstantArray() {
869+
this._value = [];
854870
this.addInput("", "");
855871
this.addOutput("", "array");
856872
this.addOutput("length", "number");
857-
this.addProperty("value", "");
858-
this.widget = this.addWidget("text","array","","value");
873+
this.addProperty("value", "[]");
874+
this.widget = this.addWidget("text","array",this.properties.value,"value");
859875
this.widgets_up = true;
860876
this.size = [140, 50];
861-
this._value = null;
862877
}
863878

864879
ConstantArray.title = "Const Array";
@@ -891,14 +906,40 @@
891906
for(var i = 0; i < v.length; ++i)
892907
this._value[i] = v[i];
893908
}
894-
this.setOutputData(0, this._value);
909+
this.setOutputData(0, this._value );
895910
this.setOutputData(1, this._value ? ( this._value.length || 0) : 0 );
896911
};
897912

898913
ConstantArray.prototype.setValue = ConstantNumber.prototype.setValue;
899914

900915
LiteGraph.registerNodeType("basic/array", ConstantArray);
901916

917+
function SetArray()
918+
{
919+
this.addInput("arr", "array");
920+
this.addInput("value", "");
921+
this.addOutput("arr", "array");
922+
this.properties = { index: 0 };
923+
this.widget = this.addWidget("number","i",this.properties.index,"index");
924+
}
925+
926+
SetArray.title = "Set Array";
927+
SetArray.desc = "Sets index of array";
928+
929+
SetArray.prototype.onExecute = function() {
930+
var arr = this.getInputData(0);
931+
if(!arr)
932+
return;
933+
var v = this.getInputData(1);
934+
if(v === undefined )
935+
return;
936+
if(this.properties.index)
937+
arr[ Math.floor(this.properties.index) ] = v;
938+
this.setOutputData(0,arr);
939+
};
940+
941+
LiteGraph.registerNodeType("basic/set_array", SetArray );
942+
902943
function ArrayElement() {
903944
this.addInput("array", "array,table,string");
904945
this.addInput("index", "number");
@@ -921,8 +962,6 @@
921962

922963
LiteGraph.registerNodeType("basic/array[]", ArrayElement);
923964

924-
925-
926965
function TableElement() {
927966
this.addInput("table", "table");
928967
this.addInput("row", "number");
@@ -1010,10 +1049,38 @@
10101049

10111050
LiteGraph.registerNodeType("basic/object_keys", ObjectKeys);
10121051

1052+
1053+
function SetObject()
1054+
{
1055+
this.addInput("obj", "");
1056+
this.addInput("value", "");
1057+
this.addOutput("obj", "");
1058+
this.properties = { property: "" };
1059+
this.name_widget = this.addWidget("text","prop.",this.properties.property,"property");
1060+
}
1061+
1062+
SetObject.title = "Set Object";
1063+
SetObject.desc = "Adds propertiesrty to object";
1064+
1065+
SetObject.prototype.onExecute = function() {
1066+
var obj = this.getInputData(0);
1067+
if(!obj)
1068+
return;
1069+
var v = this.getInputData(1);
1070+
if(v === undefined )
1071+
return;
1072+
if(this.properties.property)
1073+
obj[ this.properties.property ] = v;
1074+
this.setOutputData(0,obj);
1075+
};
1076+
1077+
LiteGraph.registerNodeType("basic/set_object", SetObject );
1078+
1079+
10131080
function MergeObjects() {
1014-
this.addInput("A", "object");
1015-
this.addInput("B", "object");
1016-
this.addOutput("", "object");
1081+
this.addInput("A", "");
1082+
this.addInput("B", "");
1083+
this.addOutput("", "");
10171084
this._result = {};
10181085
var that = this;
10191086
this.addWidget("button","clear","",function(){
@@ -1281,9 +1348,7 @@
12811348
this.addProperty("msg", "");
12821349
this.addInput("", LiteGraph.EVENT);
12831350
var that = this;
1284-
this.widget = this.addWidget("text", "Text", "", function(v) {
1285-
that.properties.msg = v;
1286-
});
1351+
this.widget = this.addWidget("text", "Text", "", "msg");
12871352
this.widgets_up = true;
12881353
this.size = [200, 30];
12891354
}

0 commit comments

Comments
 (0)