# HG changeset patch # User Edouard Tisserant # Date 1571152488 -7200 # Node ID ddb2c4668a6b2fd6902a86ffd6eeafff7859f238 # Parent c5ba1e77f05499b354c005de95c047686fe27d65 SVGHMI : many details about communication implemented in JS, with side effects. diff -r c5ba1e77f054 -r ddb2c4668a6b svghmi/Makefile --- 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 diff -r c5ba1e77f054 -r ddb2c4668a6b svghmi/gen_index_xhtml.xslt --- 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 @@ - - + + @@ -179,6 +179,10 @@ + (function(){ + + + var hmi_hash = [ ]; @@ -212,7 +216,7 @@ ], - paths: [ + indexes: [ @@ -245,36 +249,16 @@ - var hmi_index = [ - - + var hmitree_types = [ + - { /* + /* - */ - - type: " - - ", - - ids: [ - - - - hmi_widgets[" - - "] - - , - - - - - ] - - } + */ " + + " , @@ -304,9 +288,8 @@ widgets: [ - " + hmi_widgets. - " , @@ -315,24 +298,6 @@ ] - subscriptions: [ - - - - - - - - - - , - - - - - - ] - } , @@ -352,147 +317,305 @@ - (function(){ - - // Open WebSocket to relative "/ws" address - - var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws')); - - - - // Register message reception handler - - ws.onmessage = function (evt) { - - // TODO : dispatch and cache hmi tree updates - - - - var received_msg = evt.data; - - // TODO : check for hmitree hash header - - // if not matching, reload page - - alert("Message is received..."+received_msg); + 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) { + + + + 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."); + + + + // 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 - - - - - - // TODO : prefix with hmitree hash header - - ws.send("test"); + 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; }; - - - var pending_updates = {}; - - - - // subscription state, as it should be in hmi server - - // expected {index:period} - - const subscriptions = new Map(); - - - - // subscription state as needed by widget now - - // expected {index:[widgets]}; - - var subscribers = new Map(); - - - - // return the diff in between curently subscribed and subscription - - function update_subscriptions() { - - let delta = []; - - for(let [index, widgets] in subscribers.entries()){ - - - - // periods are in ms - - let previous_period = subscriptions.get(index); - - - - let new_period = Math.min(...widgets.map(widget => 1000/widget.frequency)); - - - - if(previous_period != new_period) { - - subscriptions.set(index, new_period); - - delta.push({index: index, period: new_period}); - - } - - - - }) - - return result; + }; + + + + + + 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])]); + + } + + } - - - - - function update_value(index, value) { - - - - }; - - - - var current_page = default_page; - - - - function switch_page(page_name) { - - let new_desc = page_desc[page_name]; - - let old_desc = page_desc[page_name]; - - /* TODO hide / show widgets */ - - /* TODO move viewport */ - - - - /* Update subscribers */ - - /* Update subscriptions */ - - - - - - }; + 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); + + + + }; diff -r c5ba1e77f054 -r ddb2c4668a6b svghmi/gen_index_xhtml.ysl2 --- 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 = [ - - const "svg","/"; /* foreach loses document root */ + | var hmitree_types = [ + 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 + | })(); } /* diff -r c5ba1e77f054 -r ddb2c4668a6b svghmi/svghmi.c --- 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; } diff -r c5ba1e77f054 -r ddb2c4668a6b svghmi/svghmi.js --- 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+")"); +}; - // Register message reception handler - ws.onmessage = function (evt) { - // TODO : dispatch and cache hmi tree updates +// Open WebSocket to relative "/ws" address +var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws')); +ws.binaryType = 'arraybuffer'; - var received_msg = evt.data; - // TODO : check for hmitree hash header - // if not matching, reload page - alert("Message is received..."+received_msg); +const dvgetters = { + INT: [DataView.prototype.getInt16, 2], + BOOL: [DataView.prototype.getInt8, 1] + /* TODO */ +}; + +// Register message reception handler +ws.onmessage = function (evt) { + + 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."); + + // 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); + +}; + diff -r c5ba1e77f054 -r ddb2c4668a6b svghmi/svghmi_server.py --- 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):