# HG changeset patch
# User Edouard Tisserant
# Date 1571756791 -7200
# Node ID 390acff12755097cde8b256e4f0dbf19c0a13f4c
# Parent 68cee1366b9c7b7c8365b007e279d57a48b75960
SVGHMI: Added init call to all widgets at startup to bind events. More features in Input widget : Edit and Change buttons. WIP HMI->PLC value update, incoherent data detected in C part on update.
diff -r 68cee1366b9c -r 390acff12755 svghmi/gen_index_xhtml.xslt
--- a/svghmi/gen_index_xhtml.xslt Sat Oct 19 01:23:30 2019 +0200
+++ b/svghmi/gen_index_xhtml.xslt Tue Oct 22 17:06:31 2019 +0200
@@ -326,6 +326,10 @@
+ // TODO : value cache
+
+
+
if(widgets.size > 0) {
for(let widget of widgets){
@@ -364,6 +368,26 @@
+ function init_widgets() {
+
+ Object.keys(hmi_widgets).forEach(function(id) {
+
+ let widget = hmi_widgets[id];
+
+ let init = widget.init;
+
+ if(typeof(init) == "function"){
+
+ return init.call(widget);
+
+ }
+
+ });
+
+ };
+
+
+
// Open WebSocket to relative "/ws" address
var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws'));
@@ -582,11 +606,11 @@
- function update_value(index, value) {
+ function send_hmi_value(index, value) {
iectype = hmitree_types[index];
- jstype = typedarray_types[iectypes];
+ jstype = typedarray_types[iectype];
send_blob([
@@ -602,6 +626,22 @@
+ function change_hmi_value(index, opstr) {
+
+ let op = opstr[0];
+
+ if(op == "=")
+
+ return send_hmi_value(index, Number(opstr.slice(1)));
+
+
+
+ alert('Change '+opstr+" TODO !!! (index :"+index+")");
+
+ }
+
+
+
var current_page;
@@ -660,6 +700,8 @@
ws.onopen = function (evt) {
+ init_widgets();
+
send_reset();
// show main page
@@ -773,18 +815,73 @@
- Display widget as a group not implemented
+
+ Display widget as a group not implemented
+
},
- frequency: 10,
+ frequency: 10,
+
+ frequency: 5,
+
+
+
+
+ Input widget must have a text element
+
+
+ value_elt: document.getElementById("
+
+ "),
+
+ dispatch: function(value) {
+
+ this.value_elt.textContent = String(value);
+
+ },
+
+
+ init: function() {
+
+
+ document.getElementById("
+
+ ").addEventListener(
+
+ "click",
+
+ evt => alert('XXX TODO : Edit value'));
+
+
+
+ document.getElementById("
+
+ ").addEventListener(
+
+ "click",
+
+ evt => change_hmi_value(this.indexes[0], "
+
+ "));
+
+
+ },
+
+
+
+
frequency: 5,
+
+ frequency: 5,
+
+
diff -r 68cee1366b9c -r 390acff12755 svghmi/gen_index_xhtml.ysl2
--- a/svghmi/gen_index_xhtml.ysl2 Sat Oct 19 01:23:30 2019 +0200
+++ b/svghmi/gen_index_xhtml.ysl2 Tue Oct 22 17:06:31 2019 +0200
@@ -317,16 +317,47 @@
| this.element.textContent = String(value);
}
otherwise {
- error "Display widget as a group not implemented";
+ error > Display widget as a group not implemented
}
}
| },
}
template "widget[@type='Meter']", mode="widget_defs" {
- | frequency: 10,
+ | frequency: 10,
}
template "widget[@type='Input']", mode="widget_defs" {
+ param "hmi_element";
+ | frequency: 5,
+ const "value_elt_id","$hmi_element//*[self::svg:text][@inkscape:label='value'][1]/@id";
+ if "not($value_elt_id)" error > Input widget must have a text element
+ | value_elt: document.getElementById("«$value_elt_id»"),
+ | dispatch: function(value) {
+ | this.value_elt.textContent = String(value);
+ | },
+ const "edit_elt_id","$hmi_element/*[@inkscape:label='edit'][1]/@id";
+ | init: function() {
+ if "$edit_elt_id" {
+ | document.getElementById("«$edit_elt_id»").addEventListener(
+ | "click",
+ | evt => alert('XXX TODO : Edit value'));
+ }
+ foreach "$hmi_element/*[regexp:test(@inkscape:label,'^[=+\-][0-9]+')]" {
+ | document.getElementById("«@id»").addEventListener(
+ | "click",
+ | evt => change_hmi_value(this.indexes[0], "«@inkscape:label»"));
+ }
+ | },
+ }
+ template "widget[@type='Button']", mode="widget_defs" {
+ }
+ template "widget[@type='Toggle']", mode="widget_defs" {
+ | frequency: 5,
+ }
+ template "widget[@type='Change']", mode="widget_defs" {
+ // HMI:Change:-10@/PUMP/VALUE
+ // HMI:Change:+1@/PUMP/VALUE
+ // HMI:Change:=42@/PUMP/VALUE
| frequency: 5,
}
// | frequency: 10`apply ".", mode="refresh_frequency"`,
diff -r 68cee1366b9c -r 390acff12755 svghmi/svghmi.js
--- a/svghmi/svghmi.js Sat Oct 19 01:23:30 2019 +0200
+++ b/svghmi/svghmi.js Tue Oct 22 17:06:31 2019 +0200
@@ -3,6 +3,8 @@
function dispatch_value(index, value) {
let widgets = subscribers[index];
+ // TODO : value cache
+
if(widgets.size > 0) {
for(let widget of widgets){
let idxidx = widget.indexes.indexOf(index);
@@ -22,6 +24,16 @@
}
};
+function init_widgets() {
+ Object.keys(hmi_widgets).forEach(function(id) {
+ let widget = hmi_widgets[id];
+ let init = widget.init;
+ if(typeof(init) == "function"){
+ return init.call(widget);
+ }
+ });
+};
+
// Open WebSocket to relative "/ws" address
var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws'));
ws.binaryType = 'arraybuffer';
@@ -127,9 +139,9 @@
send_blob(delta);
};
-function update_value(index, value) {
+function send_hmi_value(index, value) {
iectype = hmitree_types[index];
- jstype = typedarray_types[iectypes];
+ jstype = typedarray_types[iectype];
send_blob([
new Uint8Array([0]), /* setval = 0 */
new jstype([value])
@@ -137,6 +149,14 @@
};
+function change_hmi_value(index, opstr) {
+ let op = opstr[0];
+ if(op == "=")
+ return send_hmi_value(index, Number(opstr.slice(1)));
+
+ alert('Change '+opstr+" TODO !!! (index :"+index+")");
+}
+
var current_page;
function switch_page(page_name) {
@@ -166,6 +186,7 @@
// Once connection established
ws.onopen = function (evt) {
+ init_widgets();
send_reset();
// show main page
switch_page(default_page);
diff -r 68cee1366b9c -r 390acff12755 tests/svghmi/beremiz.xml
--- a/tests/svghmi/beremiz.xml Sat Oct 19 01:23:30 2019 +0200
+++ b/tests/svghmi/beremiz.xml Tue Oct 22 17:06:31 2019 +0200
@@ -1,5 +1,5 @@
-
+
diff -r 68cee1366b9c -r 390acff12755 tests/svghmi/svghmi_0@svghmi/svghmi.svg
--- a/tests/svghmi/svghmi_0@svghmi/svghmi.svg Sat Oct 19 01:23:30 2019 +0200
+++ b/tests/svghmi/svghmi_0@svghmi/svghmi.svg Tue Oct 22 17:06:31 2019 +0200
@@ -76,12 +76,12 @@
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:document-units="px"
- inkscape:current-layer="hmi0"
+ inkscape:current-layer="g84"
showgrid="false"
units="px"
- inkscape:zoom="0.421875"
- inkscape:cx="486.11352"
- inkscape:cy="131.25685"
+ inkscape:zoom="0.84375"
+ inkscape:cx="-12.406671"
+ inkscape:cy="380.60108"
inkscape:window-width="1600"
inkscape:window-height="886"
inkscape:window-x="0"
@@ -174,18 +174,118 @@
sodipodi:role="line">Settings
-
+ 8888
+ style="font-style:normal;font-weight:normal;font-size:160px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+ xml:space="preserve">8888
+
+
+
+
+
+
+