grunig-nodes
Version:
Grünig Nodes Library
210 lines (194 loc) • 7.65 kB
HTML
<script type="text/javascript">
RED.nodes.registerType('OpcUa-Read', {
category: 'Grunig',
color: 'rgb(176, 223, 227)',
defaults: {
name: { value: ""},
path: { value: ""},
value: { value: ""},
// Data-Felder
data1: { value: ""},
data2: { value: ""},
data3: { value: ""},
data4: { value: ""},
data5: { value: ""},
data6: { value: ""},
data7: { value: ""},
data8: { value: ""},
data9: { value: ""},
data10: { value: ""},
data11: { value: ""},
data12: { value: ""},
data13: { value: ""},
data14: { value: ""},
data15: { value: ""},
},
inputs:1,
outputs:1,
icon: "leveldb.svg",
label: function() {
return this.name || "OpcUa-Read";
},
oneditprepare: function() {
// Diese Funktion wird ausgeführt, wenn das Formular zum Bearbeiten des Knotens geladen wird
// Verweis auf das aktuelle Knotenobjekt
var node = this;
// Eingabefeld für den Namen
var nameInput = $("#node-config-input-name");
nameInput.val(node.name);
// Eingabefeld für den Pfad
var pathInput = $("#node-config-input-path");
pathInput.val(node.path);
// Eingabefeld für den Wert
var valueInput = $("#node-config-input-value");
valueInput.val(node.value);
// Durchlaufen der Datenfelder und Festlegen der Werte
for (var i = 1; i <= 15; i++) {
var dataField = $("#node-config-input-data" + i);
dataField.val(node["data" + i]);
}
// Änderungsereignis für den Namen
nameInput.on("change", function() {
node.name = nameInput.val();
RED.nodes.dirty(true);
RED.nodes.node(node.id).changed = true;
});
// Änderungsereignis für den Pfad
pathInput.on("change", function() {
node.path = pathInput.val();
RED.nodes.dirty(true);
RED.nodes.node(node.id).changed = true;
});
// Änderungsereignis für den Wert
valueInput.on("change", function() {
node.value = valueInput.val();
RED.nodes.dirty(true);
RED.nodes.node(node.id).changed = true;
});
// Änderungsereignisse für die Datenfelder
for (var i = 1; i <= 15; i++) {
var dataField = $("#node-config-input-data" + i);
dataField.on("change", (function(index) {
return function() {
node["data" + index] = $(this).val();
};
RED.nodes.dirty(true);
RED.nodes.node(node.id).changed = true;
})(i));
}
}
});
</script>
<script type="text/html" data-template-name="OpcUa-Read">
<div class="form-row">
<label for="node-config-input-name">
<i class="fa fa-folder-tag"></i> Name
</label>
<input type="text" id="node-config-input-name" placeholder="Enter name">
</div>
<div class="form-row">
<label for="node-config-input-path">
<i class="fa fa-folder-open"></i> Path
</label>
<input type="text" id="node-config-input-path" placeholder="Enter path">
</div>
<div style="height: 40px;"></div>
<div class="form-row">
<label for="node-config-input-value">
<i class="fa fa-value"></i> Value
</label>
<input type="text" id="node-config-input-value" placeholder="Enter value">
</div>
<div style="height: 40px;"></div>
<!-- Data-Felder -->
<div class="form-row">
<label for="node-config-input-data1">
<i class="fa fa-database"></i> Data 1
</label>
<input type="text" id="node-config-input-data1" placeholder="Data 1">
</div>
<div class="form-row">
<label for="node-config-input-data2">
<i class="fa fa-database"></i> Data 2
</label>
<input type="text" id="node-config-input-data2" placeholder="Data 2">
</div>
<div class="form-row">
<label for="node-config-input-data3">
<i class="fa fa-database"></i> Data 3
</label>
<input type="text" id="node-config-input-data3" placeholder="Data 3">
</div>
<div class="form-row">
<label for="node-config-input-data4">
<i class="fa fa-database"></i> Data 4
</label>
<input type="text" id="node-config-input-data4" placeholder="Data 4">
</div>
<div class="form-row">
<label for="node-config-input-data5">
<i class="fa fa-database"></i> Data 5
</label>
<input type="text" id="node-config-input-data5" placeholder="Data 5">
</div>
<div class="form-row">
<label for="node-config-input-data6">
<i class="fa fa-database"></i> Data 6
</label>
<input type="text" id="node-config-input-data6" placeholder="Data 6">
</div>
<div class="form-row">
<label for="node-config-input-data7">
<i class="fa fa-database"></i> Data 7
</label>
<input type="text" id="node-config-input-data7" placeholder="Data 7">
</div>
<div class="form-row">
<label for="node-config-input-data8">
<i class="fa fa-database"></i> Data 8
</label>
<input type="text" id="node-config-input-data8" placeholder="Data 8">
</div>
<div class="form-row">
<label for="node-config-input-data9">
<i class="fa fa-database"></i> Data 9
</label>
<input type="text" id="node-config-input-data9" placeholder="Data 9">
</div>
<div class="form-row">
<label for="node-config-input-data10">
<i class="fa fa-database"></i> Data 10
</label>
<input type="text" id="node-config-input-data10" placeholder="Data 10">
</div>
<div class="form-row">
<label for="node-config-input-data11">
<i class="fa fa-database"></i> Data 11
</label>
<input type="text" id="node-config-input-data11" placeholder="Data 11">
</div>
<div class="form-row">
<label for="node-config-input-data12">
<i class="fa fa-database"></i> Data 12
</label>
<input type="text" id="node-config-input-data12" placeholder="Data 12">
</div>
<div class="form-row">
<label for="node-config-input-data13">
<i class="fa fa-database"></i> Data 13
</label>
<input type="text" id="node-config-input-data13" placeholder="Data 13">
</div>
<div class="form-row">
<label for="node-config-input-data14">
<i class="fa fa-database"></i> Data 14
</label>
<input type="text" id="node-config-input-data14" placeholder="Data 14">
</div>
<div class="form-row">
<label for="node-config-input-data15">
<i class="fa fa-database"></i> Data 15
</label>
<input type="text" id="node-config-input-data15" placeholder="Data 15">
</div>
</script>