beremiz

SVGHMI : many details about communication implemented in JS, with side effects.
svghmi
2019-10-15, Edouard Tisserant
ddb2c4668a6b
Parents c5ba1e77f054
Children f5da343b9b63
SVGHMI : many details about communication implemented in JS, with side effects.
6 files changed, 394 insertions(+), 175 deletions(-)
  • +1 -1
    svghmi/Makefile
  • +238 -115
    svghmi/gen_index_xhtml.xslt
  • +9 -25
    svghmi/gen_index_xhtml.ysl2
  • +1 -16
    svghmi/svghmi.c
  • +144 -17
    svghmi/svghmi.js
  • +1 -1
    svghmi/svghmi_server.py
    • --- a/svghmi/Makefile Fri Oct 11 12:03:14 2019 +0200
    +++ b/svghmi/Makefile Tue Oct 15 17:14:48 2019 +0200
    @@ -16,7 +16,7 @@
    all:$(xsltfiles)
    -%.xslt: %.ysl2 ../yslt_noindent.yml2
    +%.xslt: %.ysl2 svghmi.js ../yslt_noindent.yml2
    $(yml2path)/yml2c -I $(yml2path):../ $< -o $@.tmp
    xmlstarlet fo $@.tmp > $@
    rm $@.tmp
    --- a/svghmi/gen_index_xhtml.xslt Fri Oct 11 12:03:14 2019 +0200
    +++ b/svghmi/gen_index_xhtml.xslt Tue Oct 15 17:14:48 2019 +0200
    @@ -1,6 +1,6 @@
    <?xml version="1.0"?>
    -<xsl:stylesheet xmlns:func="http://exslt.org/functions" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:svg="http://www.w3.org/2000/svg" xmlns:str="http://exslt.org/strings" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:exsl="http://exslt.org/common" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:ns="beremiz" xmlns:cc="http://creativecommons.org/ns#" xmlns:regexp="http://exslt.org/regular-expressions" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:dc="http://purl.org/dc/elements/1.1/" extension-element-prefixes="ns func" version="1.0" exclude-result-prefixes="ns str regexp exsl func">
    - <xsl:output method="xml" cdata-section-elements="script"/>
    +<xsl:stylesheet xmlns:func="http://exslt.org/functions" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:svg="http://www.w3.org/2000/svg" xmlns:str="http://exslt.org/strings" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:exsl="http://exslt.org/common" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:ns="beremiz" xmlns:cc="http://creativecommons.org/ns#" xmlns:regexp="http://exslt.org/regular-expressions" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:dc="http://purl.org/dc/elements/1.1/" extension-element-prefixes="ns func" version="1.0" exclude-result-prefixes="ns str regexp exsl func">
    + <xsl:output method="xml" cdata-section-elements="xhtml:script"/>
    <xsl:variable name="geometry" select="ns:GetSVGGeometry()"/>
    <xsl:variable name="hmitree" select="ns:GetHMITree()"/>
    <xsl:variable name="hmi_elements" select="//svg:*[starts-with(@inkscape:label, 'HMI:')]"/>
    @@ -179,6 +179,10 @@
    <func:result select="exsl:node-set($ast)"/>
    </func:function>
    <xsl:template name="scripts">
    + <xsl:text>(function(){
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    <xsl:text>var hmi_hash = [</xsl:text>
    <xsl:value-of select="$hmitree/@hash"/>
    <xsl:text>];
    @@ -212,7 +216,7 @@
    </xsl:for-each>
    <xsl:text> ],
    </xsl:text>
    - <xsl:text> paths: [
    + <xsl:text> indexes: [
    </xsl:text>
    <xsl:for-each select="$widget/path">
    <xsl:variable name="hmipath" select="@value"/>
    @@ -245,36 +249,16 @@
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text>var hmi_index = [
    + <xsl:text>var hmitree_types = [
    </xsl:text>
    - <xsl:variable name="svg" select="/"/>
    <xsl:for-each select="$indexed_hmitree/*">
    - <xsl:text>{ /* </xsl:text>
    + <xsl:text>/* </xsl:text>
    <xsl:value-of select="@index"/>
    <xsl:text> </xsl:text>
    <xsl:value-of select="@hmipath"/>
    - <xsl:text> */
    -</xsl:text>
    - <xsl:text> type: "</xsl:text>
    - <xsl:value-of select="local-name()"/>
    - <xsl:text>",
    -</xsl:text>
    - <xsl:text> ids: [
    -</xsl:text>
    - <xsl:variable name="hmipath" select="@hmipath"/>
    - <xsl:for-each select="$svg//*[substring-after(@inkscape:label,'@') = $hmipath]">
    - <xsl:text> hmi_widgets["</xsl:text>
    - <xsl:value-of select="@id"/>
    - <xsl:text>"]</xsl:text>
    - <xsl:if test="position()!=last()">
    - <xsl:text>,</xsl:text>
    - </xsl:if>
    - <xsl:text>
    -</xsl:text>
    - </xsl:for-each>
    - <xsl:text> ]
    -</xsl:text>
    - <xsl:text>}</xsl:text>
    + <xsl:text> */ "</xsl:text>
    + <xsl:value-of select="substring(local-name(), 5)"/>
    + <xsl:text>"</xsl:text>
    <xsl:if test="position()!=last()">
    <xsl:text>,</xsl:text>
    </xsl:if>
    @@ -304,9 +288,8 @@
    <xsl:text> widgets: [
    </xsl:text>
    <xsl:for-each select="$page_ids">
    - <xsl:text> "</xsl:text>
    + <xsl:text> hmi_widgets.</xsl:text>
    <xsl:value-of select="."/>
    - <xsl:text>"</xsl:text>
    <xsl:if test="position()!=last()">
    <xsl:text>,</xsl:text>
    </xsl:if>
    @@ -315,24 +298,6 @@
    </xsl:for-each>
    <xsl:text> ]
    </xsl:text>
    - <xsl:text> subscriptions: [
    -</xsl:text>
    - <xsl:for-each select="$page_elements">
    - <xsl:variable name="hmipaths" select="func:parselabel(@inkscape:label)/widget/path/@value"/>
    - <xsl:variable name="notlast" select="position()!=last()"/>
    - <xsl:for-each select="$hmipaths">
    - <xsl:variable name="hmipath" select="."/>
    - <xsl:text> </xsl:text>
    - <xsl:value-of select="$indexed_hmitree/*[@hmipath = $hmipath]/@index"/>
    - <xsl:if test="$notlast or position()!=last()">
    - <xsl:text>,</xsl:text>
    - </xsl:if>
    - <xsl:text>
    -</xsl:text>
    - </xsl:for-each>
    - </xsl:for-each>
    - <xsl:text> ]
    -</xsl:text>
    <xsl:text> }</xsl:text>
    <xsl:if test="position()!=last()">
    <xsl:text>,</xsl:text>
    @@ -352,147 +317,305 @@
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text>(function(){
    + <xsl:text>function dispatch_value(index, value) {
    +</xsl:text>
    + <xsl:text> console.log("dispatch_value("+index+value+")");
    +</xsl:text>
    + <xsl:text>};
    </xsl:text>
    - <xsl:text> // Open WebSocket to relative "/ws" address
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>// Open WebSocket to relative "/ws" address
    </xsl:text>
    - <xsl:text> var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws'));
    + <xsl:text>var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws'));
    +</xsl:text>
    + <xsl:text>ws.binaryType = 'arraybuffer';
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> // Register message reception handler
    + <xsl:text>const dvgetters = {
    +</xsl:text>
    + <xsl:text> INT: [DataView.prototype.getInt16, 2],
    +</xsl:text>
    + <xsl:text> BOOL: [DataView.prototype.getInt8, 1]
    +</xsl:text>
    + <xsl:text> /* TODO */
    </xsl:text>
    - <xsl:text> ws.onmessage = function (evt) {
    + <xsl:text>};
    +</xsl:text>
    + <xsl:text>
    </xsl:text>
    - <xsl:text> // TODO : dispatch and cache hmi tree updates
    + <xsl:text>// Register message reception handler
    +</xsl:text>
    + <xsl:text>ws.onmessage = function (evt) {
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> var received_msg = evt.data;
    + <xsl:text> let data = evt.data;
    </xsl:text>
    - <xsl:text> // TODO : check for hmitree hash header
    + <xsl:text> let dv = new DataView(data);
    +</xsl:text>
    + <xsl:text> let i = 0;
    </xsl:text>
    - <xsl:text> // if not matching, reload page
    + <xsl:text> for(let hash_int of hmi_hash) {
    </xsl:text>
    - <xsl:text> alert("Message is received..."+received_msg);
    + <xsl:text> if(hash_int != dv.getUint8(i)){
    </xsl:text>
    - <xsl:text> };
    + <xsl:text> console.log("Recv non maching hash. Reload.");
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> // Once connection established
    -</xsl:text>
    - <xsl:text> ws.onopen = function (evt) {
    + <xsl:text> // 1003 is for "Unsupported Data"
    </xsl:text>
    - <xsl:text> // TODO : enable the HMI (was previously offline, or just starts)
    -</xsl:text>
    - <xsl:text> // show main page
    + <xsl:text> ws.close(1003,"Hash doesn't match");
    </xsl:text>
    <xsl:text>
    </xsl:text>
    + <xsl:text> // TODO : remove debug alert ?
    +</xsl:text>
    + <xsl:text> alert("HMI will be reloaded.");
    +</xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> // TODO : prefix with hmitree hash header
    + <xsl:text> // force reload ignoring cache
    +</xsl:text>
    + <xsl:text> location.reload(true);
    </xsl:text>
    - <xsl:text> ws.send("test");
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> i++;
    </xsl:text>
    <xsl:text> };
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> var pending_updates = {};
    + <xsl:text> while(i &lt; data.length){
    +</xsl:text>
    + <xsl:text> let index = dv.getUint32(i);
    +</xsl:text>
    + <xsl:text> i += 4;
    +</xsl:text>
    + <xsl:text> let iectype = hmitree_types[index];
    </xsl:text>
    - <xsl:text>
    + <xsl:text> let [dvgetter, bytesize] = dvgetters[iectypes];
    +</xsl:text>
    + <xsl:text> value = dvgetter.call(dv,i);
    +</xsl:text>
    + <xsl:text> dispatch_value(index, value);
    +</xsl:text>
    + <xsl:text> i += bytesize;
    +</xsl:text>
    + <xsl:text> };
    </xsl:text>
    - <xsl:text> // subscription state, as it should be in hmi server
    + <xsl:text>};
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>function send_blob(data) {
    +</xsl:text>
    + <xsl:text> if(data.length &gt; 0) {
    </xsl:text>
    - <xsl:text> // expected {index:period}
    + <xsl:text> ws.send(new Blob([
    +</xsl:text>
    + <xsl:text> new Uint8Array(hmi_hash),
    </xsl:text>
    - <xsl:text> const subscriptions = new Map();
    + <xsl:text> data]));
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text>};
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> // subscription state as needed by widget now
    + <xsl:text>const typedarray_types = {
    +</xsl:text>
    + <xsl:text> INT: Int16Array,
    +</xsl:text>
    + <xsl:text> BOOL: Uint8Array
    +</xsl:text>
    + <xsl:text> /* TODO */
    +</xsl:text>
    + <xsl:text>};
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>function send_reset() {
    +</xsl:text>
    + <xsl:text> send_blob(new Uint8Array([1])); /* reset = 1 */
    +</xsl:text>
    + <xsl:text>};
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>// subscription state, as it should be in hmi server
    +</xsl:text>
    + <xsl:text>// hmitree indexed array of integers
    </xsl:text>
    - <xsl:text> // expected {index:[widgets]};
    + <xsl:text>var subscriptions = hmitree_types.map(_ignored =&gt; 0);
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>// subscription state as needed by widget now
    +</xsl:text>
    + <xsl:text>// hmitree indexed array of Sets of widgets objects
    +</xsl:text>
    + <xsl:text>var subscribers = hmitree_types.map(_ignored =&gt; new Set());
    +</xsl:text>
    + <xsl:text>
    </xsl:text>
    - <xsl:text> var subscribers = new Map();
    + <xsl:text>function update_subscriptions() {
    +</xsl:text>
    + <xsl:text> let delta = [];
    +</xsl:text>
    + <xsl:text> for(let index = 0; index &lt; subscribers.length; index++){
    +</xsl:text>
    + <xsl:text> let widgets = subscribers[index];
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text> // periods are in ms
    +</xsl:text>
    + <xsl:text> let previous_period = subscriptions[index];
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> // return the diff in between curently subscribed and subscription
    + <xsl:text> let new_period;
    </xsl:text>
    - <xsl:text> function update_subscriptions() {
    + <xsl:text> if(widgets.size &gt; 0) {
    +</xsl:text>
    + <xsl:text> let maxfreq = 0;
    </xsl:text>
    - <xsl:text> let delta = [];
    + <xsl:text> for(let widget of widgets)
    </xsl:text>
    - <xsl:text> for(let [index, widgets] in subscribers.entries()){
    + <xsl:text> if(maxfreq &lt; widgets.frequency)
    +</xsl:text>
    + <xsl:text> maxfreq = widgets.frequency;
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> // periods are in ms
    + <xsl:text> new_period = 1000/maxfreq;
    +</xsl:text>
    + <xsl:text> } else {
    +</xsl:text>
    + <xsl:text> new_period = 0;
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text> if(previous_period != new_period) {
    +</xsl:text>
    + <xsl:text> subscriptions[index] = new_period;
    +</xsl:text>
    + <xsl:text> delta.push([
    </xsl:text>
    - <xsl:text> let previous_period = subscriptions.get(index);
    + <xsl:text> new Uint8Array([2]), /* subscribe = 2 */
    +</xsl:text>
    + <xsl:text> new Uint32Array([index]),
    +</xsl:text>
    + <xsl:text> new Uint16Array([new_period])]);
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text> send_blob(delta);
    +</xsl:text>
    + <xsl:text>};
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> let new_period = Math.min(...widgets.map(widget =&gt; 1000/widget.frequency));
    + <xsl:text>function update_value(index, value) {
    +</xsl:text>
    + <xsl:text> iectype = hmitree_types[index];
    +</xsl:text>
    + <xsl:text> jstype = typedarray_types[iectypes];
    +</xsl:text>
    + <xsl:text> send_blob([
    +</xsl:text>
    + <xsl:text> new Uint8Array([0]), /* setval = 0 */
    +</xsl:text>
    + <xsl:text> new jstype([value])
    +</xsl:text>
    + <xsl:text> ]);
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>};
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>var current_page;
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> if(previous_period != new_period) {
    + <xsl:text>function switch_page(page_name) {
    +</xsl:text>
    + <xsl:text> let old_desc = page_desc[current_page];
    +</xsl:text>
    + <xsl:text> let new_desc = page_desc[page_name];
    +</xsl:text>
    + <xsl:text> /* TODO hide / show widgets */
    </xsl:text>
    - <xsl:text> subscriptions.set(index, new_period);
    + <xsl:text> /* TODO move viewport */
    +</xsl:text>
    + <xsl:text>
    </xsl:text>
    - <xsl:text> delta.push({index: index, period: new_period});
    + <xsl:text> /* remove subsribers of previous page if any */
    +</xsl:text>
    + <xsl:text> if(old_desc) for(let widget of old_desc.widgets){
    </xsl:text>
    - <xsl:text> }
    + <xsl:text> for(let index of widget.indexes){
    +</xsl:text>
    + <xsl:text> subscribers[index].delete(widget);
    </xsl:text>
    - <xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text> }
    </xsl:text>
    - <xsl:text> })
    + <xsl:text> /* add new subsribers if any */
    +</xsl:text>
    + <xsl:text> if(new_desc) for(let widget of new_desc.widgets){
    </xsl:text>
    - <xsl:text> return result;
    + <xsl:text> for(let index of widget.indexes){
    +</xsl:text>
    + <xsl:text> subscribers[index].add(widget);
    +</xsl:text>
    + <xsl:text> }
    </xsl:text>
    <xsl:text> }
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text>
    -</xsl:text>
    - <xsl:text> function update_value(index, value) {
    -</xsl:text>
    - <xsl:text>
    -</xsl:text>
    - <xsl:text> };
    -</xsl:text>
    - <xsl:text>
    -</xsl:text>
    - <xsl:text> var current_page = default_page;
    + <xsl:text> current_page = page_name;
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> function switch_page(page_name) {
    -</xsl:text>
    - <xsl:text> let new_desc = page_desc[page_name];
    -</xsl:text>
    - <xsl:text> let old_desc = page_desc[page_name];
    -</xsl:text>
    - <xsl:text> /* TODO hide / show widgets */
    + <xsl:text> update_subscriptions();
    </xsl:text>
    - <xsl:text> /* TODO move viewport */
    -</xsl:text>
    - <xsl:text>
    -</xsl:text>
    - <xsl:text> /* Update subscribers */
    -</xsl:text>
    - <xsl:text> /* Update subscriptions */
    + <xsl:text>};
    </xsl:text>
    <xsl:text>
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> };
    + <xsl:text>// Once connection established
    +</xsl:text>
    + <xsl:text>ws.onopen = function (evt) {
    +</xsl:text>
    + <xsl:text> send_reset();
    +</xsl:text>
    + <xsl:text> // show main page
    +</xsl:text>
    + <xsl:text> switch_page(default_page);
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>};
    </xsl:text>
    <xsl:text>
    </xsl:text>
    --- a/svghmi/gen_index_xhtml.ysl2 Fri Oct 11 12:03:14 2019 +0200
    +++ b/svghmi/gen_index_xhtml.ysl2 Tue Oct 15 17:14:48 2019 +0200
    @@ -1,7 +1,7 @@
    include yslt_noindent.yml2
    // overrides yslt's output function to set CDATA
    -decl output(method, cdata-section-elements="script");
    +decl output(method, cdata-section-elements="xhtml:script");
    istylesheet
    /* From Inkscape */
    @@ -11,6 +11,7 @@
    xmlns:svg="http://www.w3.org/2000/svg"
    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
    + xmlns:xhtml="http://www.w3.org/1999/xhtml"
    /* Our namespace to invoke python code */
    xmlns:ns="beremiz"
    @@ -163,7 +164,8 @@
    function "scripts"
    {
    - /* paste hmitree hash stored in hmi tree root node */
    + | (function(){
    + |
    | var hmi_hash = [«$hmitree/@hash»];
    /* TODO re-enable
    @@ -194,7 +196,7 @@
    foreach "$widget/arg"
    | "«@value»"`if "position()!=last()" > ,`
    | ],
    - | paths: [
    + | indexes: [
    foreach "$widget/path" {
    const "hmipath","@value";
    const "hmitree_match","$indexed_hmitree/*[@hmipath = $hmipath]";
    @@ -207,19 +209,10 @@
    }
    | }
    |
    - | var hmi_index = [
    + | var hmitree_types = [
    - const "svg","/"; /* foreach loses document root */
    foreach "$indexed_hmitree/*" {
    - | { /* «@index» «@hmipath» */
    - | type: "«local-name()»",
    - | ids: [
    - const "hmipath","@hmipath";
    - foreach "$svg//*[substring-after(@inkscape:label,'@') = $hmipath]" {
    - | hmi_widgets["«@id»"]`if "position()!=last()" > ,`
    - }
    - | ]
    - | }`if "position()!=last()" > ,`
    + | /* «@index» «@hmipath» */ "«substring(local-name(), 5)»"`if "position()!=last()" > ,`
    }
    | ]
    @@ -238,17 +231,7 @@
    | id: "«@id»",
    | widgets: [
    foreach "$page_ids" {
    - | "«.»"`if "position()!=last()" > ,`
    - }
    - | ]
    - | subscriptions: [
    - foreach "$page_elements" {
    - const "hmipaths", "func:parselabel(@inkscape:label)/widget/path/@value";
    - const "notlast", "position()!=last()";
    - foreach "$hmipaths" {
    - const "hmipath",".";
    - | «$indexed_hmitree/*[@hmipath = $hmipath]/@index»`if "$notlast or position()!=last()" > ,`
    - }
    + | hmi_widgets.«.»`if "position()!=last()" > ,`
    }
    | ]
    | }`if "position()!=last()" > ,`
    @@ -259,6 +242,7 @@
    | var default_page = "«$default_page»";
    include text svghmi.js
    + | })();
    }
    /*
    --- a/svghmi/svghmi.c Fri Oct 11 12:03:14 2019 +0200
    +++ b/svghmi/svghmi.c Tue Oct 15 17:14:48 2019 +0200
    @@ -242,8 +242,7 @@
    typedef enum {
    setval = 0,
    reset = 1,
    - subscribe = 2,
    - unsubscribe = 3
    + subscribe = 2
    } cmd_from_JS;
    int svghmi_recv_dispatch(uint32_t size, const uint8_t *ptr){
    @@ -320,20 +319,6 @@
    }
    break;
    - case unsubscribe:
    - {
    - uint32_t index = *(uint32_t*)(cursor);
    -
    - if(index < HMI_ITEM_COUNT)
    - {
    - hmi_tree_item_t *dsc = &hmi_tree_item[index];
    - reset_iterator(index, dsc);
    - }
    - else return -EINVAL;
    -
    - progress = sizeof(uint32_t) /* index */;
    - }
    - break;
    }
    cursor += progress;
    }
    --- a/svghmi/svghmi.js Fri Oct 11 12:03:14 2019 +0200
    +++ b/svghmi/svghmi.js Tue Oct 15 17:14:48 2019 +0200
    @@ -1,26 +1,153 @@
    // svghmi.js
    -(function(){
    - // Open WebSocket to relative "/ws" address
    - var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws'));
    +function dispatch_value(index, value) {
    + console.log("dispatch_value("+index+value+")");
    +};
    +
    +// Open WebSocket to relative "/ws" address
    +var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws'));
    +ws.binaryType = 'arraybuffer';
    +
    +const dvgetters = {
    + INT: [DataView.prototype.getInt16, 2],
    + BOOL: [DataView.prototype.getInt8, 1]
    + /* TODO */
    +};
    +
    +// Register message reception handler
    +ws.onmessage = function (evt) {
    - // Register message reception handler
    - ws.onmessage = function (evt) {
    - // TODO : dispatch and cache hmi tree updates
    + let data = evt.data;
    + let dv = new DataView(data);
    + let i = 0;
    + for(let hash_int of hmi_hash) {
    + if(hash_int != dv.getUint8(i)){
    + console.log("Recv non maching hash. Reload.");
    - var received_msg = evt.data;
    - // TODO : check for hmitree hash header
    - // if not matching, reload page
    - alert("Message is received..."+received_msg);
    + // 1003 is for "Unsupported Data"
    + ws.close(1003,"Hash doesn't match");
    +
    + // TODO : remove debug alert ?
    + alert("HMI will be reloaded.");
    +
    + // force reload ignoring cache
    + location.reload(true);
    + };
    + i++;
    };
    - // Once connection established
    - ws.onopen = function (evt) {
    - // TODO : enable the HMI (was previously offline, or just starts)
    - // show main page
    + while(i < data.length){
    + let index = dv.getUint32(i);
    + i += 4;
    + let iectype = hmitree_types[index];
    + let [dvgetter, bytesize] = dvgetters[iectypes];
    + value = dvgetter.call(dv,i);
    + dispatch_value(index, value);
    + i += bytesize;
    + };
    +};
    - // TODO : prefix with hmitree hash header
    - ws.send("test");
    +function send_blob(data) {
    + if(data.length > 0) {
    + ws.send(new Blob([
    + new Uint8Array(hmi_hash),
    + data]));
    };
    -})();
    +};
    +
    +const typedarray_types = {
    + INT: Int16Array,
    + BOOL: Uint8Array
    + /* TODO */
    +};
    +
    +function send_reset() {
    + send_blob(new Uint8Array([1])); /* reset = 1 */
    +};
    +
    +// subscription state, as it should be in hmi server
    +// hmitree indexed array of integers
    +var subscriptions = hmitree_types.map(_ignored => 0);
    +
    +// subscription state as needed by widget now
    +// hmitree indexed array of Sets of widgets objects
    +var subscribers = hmitree_types.map(_ignored => new Set());
    +
    +function update_subscriptions() {
    + let delta = [];
    + for(let index = 0; index < subscribers.length; index++){
    + let widgets = subscribers[index];
    +
    + // periods are in ms
    + let previous_period = subscriptions[index];
    +
    + let new_period;
    + if(widgets.size > 0) {
    + let maxfreq = 0;
    + for(let widget of widgets)
    + if(maxfreq < widgets.frequency)
    + maxfreq = widgets.frequency;
    +
    + new_period = 1000/maxfreq;
    + } else {
    + new_period = 0;
    + }
    +
    + if(previous_period != new_period) {
    + subscriptions[index] = new_period;
    + delta.push([
    + new Uint8Array([2]), /* subscribe = 2 */
    + new Uint32Array([index]),
    + new Uint16Array([new_period])]);
    + }
    +
    + }
    + send_blob(delta);
    +};
    +
    +function update_value(index, value) {
    + iectype = hmitree_types[index];
    + jstype = typedarray_types[iectypes];
    + send_blob([
    + new Uint8Array([0]), /* setval = 0 */
    + new jstype([value])
    + ]);
    +
    +};
    +
    +var current_page;
    +
    +function switch_page(page_name) {
    + let old_desc = page_desc[current_page];
    + let new_desc = page_desc[page_name];
    + /* TODO hide / show widgets */
    + /* TODO move viewport */
    +
    + /* remove subsribers of previous page if any */
    + if(old_desc) for(let widget of old_desc.widgets){
    + for(let index of widget.indexes){
    + subscribers[index].delete(widget);
    + }
    + }
    + /* add new subsribers if any */
    + if(new_desc) for(let widget of new_desc.widgets){
    + for(let index of widget.indexes){
    + subscribers[index].add(widget);
    + }
    + }
    +
    + current_page = page_name;
    +
    + update_subscriptions();
    +};
    +
    +
    +// Once connection established
    +ws.onopen = function (evt) {
    + send_reset();
    + // show main page
    + switch_page(default_page);
    +
    +};
    +
    --- a/svghmi/svghmi_server.py Fri Oct 11 12:03:14 2019 +0200
    +++ b/svghmi/svghmi_server.py Tue Oct 15 17:14:48 2019 +0200
    @@ -85,7 +85,7 @@
    def onMessage(self, msg, isBinary):
    self._hmi_session.onMessage(msg)
    - print msg
    + # print msg
    #self.sendMessage(msg, binary)
    class HMIWebSocketServerFactory(WebSocketServerFactory):