beremiz

SVGHMI: more compatibility adaptation to target 2012's webkit...
SVGHMI_compat
2019-11-08, Edouard Tisserant
004117ff7e1a
Parents 10f7e3aa6e0c
Children 742b115f5b07
SVGHMI: more compatibility adaptation to target 2012's webkit...
3 files changed, 328 insertions(+), 139 deletions(-)
  • +217 -91
    svghmi/gen_index_xhtml.xslt
  • +5 -3
    svghmi/gen_index_xhtml.ysl2
  • +106 -45
    svghmi/svghmi.js
    • --- a/svghmi/gen_index_xhtml.xslt Fri Nov 08 11:33:49 2019 +0100
    +++ b/svghmi/gen_index_xhtml.xslt Fri Nov 08 11:35:01 2019 +0100
    @@ -111,10 +111,10 @@
    <xsl:text>none</xsl:text>
    </xsl:attribute>
    <xsl:attribute name="height">
    - <xsl:text>100vh</xsl:text>
    + <xsl:text>100%</xsl:text>
    </xsl:attribute>
    <xsl:attribute name="width">
    - <xsl:text>100vw</xsl:text>
    + <xsl:text>100%</xsl:text>
    </xsl:attribute>
    <xsl:apply-templates mode="inline_svg" select="@* | node()"/>
    </xsl:copy>
    @@ -340,6 +340,8 @@
    </xsl:text>
    <xsl:text>
    </xsl:text>
    + <xsl:text>var ws;
    +</xsl:text>
    <xsl:text>var cache = hmitree_types.map(function(_ignored) {return undefined});
    </xsl:text>
    <xsl:text>
    @@ -424,14 +426,6 @@
    </xsl:text>
    <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>
    - <xsl:text>ws.binaryType = 'arraybuffer';
    -</xsl:text>
    - <xsl:text>
    -</xsl:text>
    <xsl:text>const dvgetters = {
    </xsl:text>
    <xsl:text> INT: [DataView.prototype.getInt16, 2],
    @@ -444,86 +438,8 @@
    </xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text>// Register message reception handler
    -</xsl:text>
    - <xsl:text>ws.onmessage = function (evt) {
    -</xsl:text>
    <xsl:text>
    </xsl:text>
    - <xsl:text> var data = evt.data;
    -</xsl:text>
    - <xsl:text> var dv = new DataView(data);
    -</xsl:text>
    - <xsl:text> var i = 0;
    -</xsl:text>
    - <xsl:text> try {
    -</xsl:text>
    - <xsl:text> hmi_hash.forEach(function(hash_int) {
    -</xsl:text>
    - <xsl:text> if(hash_int != dv.getUint8(i)){
    -</xsl:text>
    - <xsl:text> throw new Error("Hash doesn't match");
    -</xsl:text>
    - <xsl:text> };
    -</xsl:text>
    - <xsl:text> i++;
    -</xsl:text>
    - <xsl:text> });
    -</xsl:text>
    - <xsl:text>
    -</xsl:text>
    - <xsl:text> while(i &lt; data.byteLength){
    -</xsl:text>
    - <xsl:text> var index = dv.getUint32(i, true);
    -</xsl:text>
    - <xsl:text> i += 4;
    -</xsl:text>
    - <xsl:text> var iectype = hmitree_types[index];
    -</xsl:text>
    - <xsl:text> if(iectype != undefined){
    -</xsl:text>
    - <xsl:text> var _dvgetter = dvgetters[iectype];
    -</xsl:text>
    - <xsl:text> var dvgetter = _dvgetter[0];
    -</xsl:text>
    - <xsl:text> var bytesize = _dvgetter[1];
    -</xsl:text>
    - <xsl:text> var value = dvgetter.call(dv,i,true);
    -</xsl:text>
    - <xsl:text> dispatch_value(index, value);
    -</xsl:text>
    - <xsl:text> i += bytesize;
    -</xsl:text>
    - <xsl:text> } else {
    -</xsl:text>
    - <xsl:text> throw new Error("Unknown index "+index)
    -</xsl:text>
    - <xsl:text> }
    -</xsl:text>
    - <xsl:text> };
    -</xsl:text>
    - <xsl:text> } catch(err) {
    -</xsl:text>
    - <xsl:text> // 1003 is for "Unsupported Data"
    -</xsl:text>
    - <xsl:text> // ws.close(1003, err.message);
    -</xsl:text>
    - <xsl:text>
    -</xsl:text>
    - <xsl:text> // TODO : remove debug alert ?
    -</xsl:text>
    - <xsl:text> alert("Error : "+err.message+"\nHMI will be reloaded.");
    -</xsl:text>
    - <xsl:text>
    -</xsl:text>
    - <xsl:text> // force reload ignoring cache
    -</xsl:text>
    - <xsl:text> location.reload(true);
    -</xsl:text>
    - <xsl:text> }
    -</xsl:text>
    - <xsl:text>};
    -</xsl:text>
    <xsl:text>
    </xsl:text>
    <xsl:text>
    @@ -564,7 +480,121 @@
    </xsl:text>
    <xsl:text>// hmitree indexed array of integers
    </xsl:text>
    - <xsl:text>var subscriptions = hmitree_types.map(function(_ignored) {return 0});
    + <xsl:text>var subscriptions = hmitree_types.map(function(_ignored) {return 0;});
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>/*! (c) Andrea Giammarchi - ISC */
    +</xsl:text>
    + <xsl:text>var self = this || /* istanbul ignore next */ {};
    +</xsl:text>
    + <xsl:text>try { self.Set = Set; }
    +</xsl:text>
    + <xsl:text>catch (Set) {
    +</xsl:text>
    + <xsl:text> (function (i, dPs) {'use strict';
    +</xsl:text>
    + <xsl:text> var proto = dPs(Set.prototype, {size: {
    +</xsl:text>
    + <xsl:text> configurable: true,
    +</xsl:text>
    + <xsl:text> get: function () {
    +</xsl:text>
    + <xsl:text> return this._v.length;
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text> }});
    +</xsl:text>
    + <xsl:text> proto.add = function (value) {
    +</xsl:text>
    + <xsl:text> if (!has(this, value))
    +</xsl:text>
    + <xsl:text> this._v.push(value);
    +</xsl:text>
    + <xsl:text> return this;
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> proto.clear = function () {
    +</xsl:text>
    + <xsl:text> var length = this._v.length;
    +</xsl:text>
    + <xsl:text> this._v.splice(0, length);
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> proto.delete = function (value) {
    +</xsl:text>
    + <xsl:text> return has(this, value) &amp;&amp; !!this._v.splice(i, 1);
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> proto.entries = function () {
    +</xsl:text>
    + <xsl:text> return this._v.map(pair);
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> proto.forEach = function (callback, context) {
    +</xsl:text>
    + <xsl:text> this._v.forEach(
    +</xsl:text>
    + <xsl:text> function (value, i) {
    +</xsl:text>
    + <xsl:text> callback.call(context, value, value, this);
    +</xsl:text>
    + <xsl:text> },
    +</xsl:text>
    + <xsl:text> this
    +</xsl:text>
    + <xsl:text> );
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> proto.has = function (key) {
    +</xsl:text>
    + <xsl:text> return has(this, key);
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> proto.keys = proto.values = function () {
    +</xsl:text>
    + <xsl:text> return this._v.slice(0);
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> self.Set = Set;
    +</xsl:text>
    + <xsl:text> function Set(iterable) {
    +</xsl:text>
    + <xsl:text> dPs(this, {_v: {value: []}});
    +</xsl:text>
    + <xsl:text> if (iterable)
    +</xsl:text>
    + <xsl:text> iterable.forEach(this.add, this);
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text> function has(self, value) {
    +</xsl:text>
    + <xsl:text> i = self._v.indexOf(value);
    +</xsl:text>
    + <xsl:text> return -1 &lt; i;
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text> function pair(value) {
    +</xsl:text>
    + <xsl:text> return [value, value];
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text> }(0, Object.defineProperties));
    +</xsl:text>
    + <xsl:text>}
    +</xsl:text>
    + <xsl:text>
    </xsl:text>
    <xsl:text>
    </xsl:text>
    @@ -572,7 +602,9 @@
    </xsl:text>
    <xsl:text>// hmitree indexed array of Sets of widgets objects
    </xsl:text>
    - <xsl:text>var subscribers = hmitree_types.map(function(_ignored) {return new Set()});
    + <xsl:text>var subscribers = hmitree_types.map(function(_ignored) {return new Set();});
    +</xsl:text>
    + <xsl:text>
    </xsl:text>
    <xsl:text>
    </xsl:text>
    @@ -774,6 +806,12 @@
    </xsl:text>
    <xsl:text>
    </xsl:text>
    + <xsl:text>// Open WebSocket to relative "/ws" address
    +</xsl:text>
    + <xsl:text>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>// Once connection established
    @@ -808,6 +846,90 @@
    </xsl:text>
    <xsl:text>};
    </xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text>// Register message reception handler
    +</xsl:text>
    + <xsl:text>ws.onmessage = function (evt) {
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text> var data = evt.data;
    +</xsl:text>
    + <xsl:text> var dv = new DataView(data);
    +</xsl:text>
    + <xsl:text> var i = 0;
    +</xsl:text>
    + <xsl:text> try {
    +</xsl:text>
    + <xsl:text> hmi_hash.forEach(function(hash_int) {
    +</xsl:text>
    + <xsl:text> if(hash_int != dv.getUint8(i)){
    +</xsl:text>
    + <xsl:text> throw new Error("Hash doesn't match");
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> i++;
    +</xsl:text>
    + <xsl:text> });
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text> while(i &lt; data.byteLength){
    +</xsl:text>
    + <xsl:text> var index = dv.getUint32(i, true);
    +</xsl:text>
    + <xsl:text> i += 4;
    +</xsl:text>
    + <xsl:text> var iectype = hmitree_types[index];
    +</xsl:text>
    + <xsl:text> if(iectype != undefined){
    +</xsl:text>
    + <xsl:text> var _dvgetter = dvgetters[iectype];
    +</xsl:text>
    + <xsl:text> var dvgetter = _dvgetter[0];
    +</xsl:text>
    + <xsl:text> var bytesize = _dvgetter[1];
    +</xsl:text>
    + <xsl:text> var value = dvgetter.call(dv,i,true);
    +</xsl:text>
    + <xsl:text> dispatch_value(index, value);
    +</xsl:text>
    + <xsl:text> i += bytesize;
    +</xsl:text>
    + <xsl:text> } else {
    +</xsl:text>
    + <xsl:text> throw new Error("Unknown index "+index)
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text> };
    +</xsl:text>
    + <xsl:text> } catch(err) {
    +</xsl:text>
    + <xsl:text> // 1003 is for "Unsupported Data"
    +</xsl:text>
    + <xsl:text> // ws.close(1003, err.message);
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text> // TODO : remove debug alert ?
    +</xsl:text>
    + <xsl:text> alert("Error : "+err.message+"\nHMI will be reloaded.");
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    + <xsl:text> // force reload ignoring cache
    +</xsl:text>
    + <xsl:text> location.reload(true);
    +</xsl:text>
    + <xsl:text> }
    +</xsl:text>
    + <xsl:text>};
    +</xsl:text>
    + <xsl:text>
    +</xsl:text>
    <xsl:text>//})();
    </xsl:text>
    </xsl:template>
    @@ -866,7 +988,11 @@
    </xsl:text>
    <xsl:text> this.value_elt.textContent = String(value);
    </xsl:text>
    - <xsl:text> var [min,max,totallength] = this.range;
    + <xsl:text> var min = this.range[0];
    +</xsl:text>
    + <xsl:text> var max = this.range[1];
    +</xsl:text>
    + <xsl:text> var totallength = this.range[2];
    </xsl:text>
    <xsl:text> var length = Math.max(0,Math.min(totallength,(Number(value)-min)*totallength/(max-min)));
    </xsl:text>
    --- a/svghmi/gen_index_xhtml.ysl2 Fri Nov 08 11:33:49 2019 +0100
    +++ b/svghmi/gen_index_xhtml.ysl2 Fri Nov 08 11:35:01 2019 +0100
    @@ -112,8 +112,8 @@
    template "svg:svg/@height", mode="inline_svg";
    template "svg:svg", mode="inline_svg" xsl:copy {
    attrib "preserveAspectRatio" > none
    - attrib "height" > 100vh
    - attrib "width" > 100vw
    + attrib "height" > 100%
    + attrib "width" > 100%
    apply "@* | node()", mode="inline_svg";
    }
    @@ -358,7 +358,9 @@
    labels("value min max needle range");
    | dispatch: function(value) {
    | this.value_elt.textContent = String(value);
    - | var [min,max,totallength] = this.range;
    + | var min = this.range[0];
    + | var max = this.range[1];
    + | var totallength = this.range[2];
    | var length = Math.max(0,Math.min(totallength,(Number(value)-min)*totallength/(max-min)));
    | var tip = this.range_elt.getPointAtLength(length);
    // TODO : deal with transformations between needle and range
    --- a/svghmi/svghmi.js Fri Nov 08 11:33:49 2019 +0100
    +++ b/svghmi/svghmi.js Fri Nov 08 11:35:01 2019 +0100
    @@ -1,5 +1,6 @@
    // svghmi.js
    +var ws;
    var cache = hmitree_types.map(function(_ignored) {return undefined});
    function dispatch_value_to_widget(widget, index, value, oldval) {
    @@ -42,56 +43,13 @@
    });
    };
    -// 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) {
    - var data = evt.data;
    - var dv = new DataView(data);
    - var i = 0;
    - try {
    - hmi_hash.forEach(function(hash_int) {
    - if(hash_int != dv.getUint8(i)){
    - throw new Error("Hash doesn't match");
    - };
    - i++;
    - });
    -
    - while(i < data.byteLength){
    - var index = dv.getUint32(i, true);
    - i += 4;
    - var iectype = hmitree_types[index];
    - if(iectype != undefined){
    - var _dvgetter = dvgetters[iectype];
    - var dvgetter = _dvgetter[0];
    - var bytesize = _dvgetter[1];
    - var value = dvgetter.call(dv,i,true);
    - dispatch_value(index, value);
    - i += bytesize;
    - } else {
    - throw new Error("Unknown index "+index)
    - }
    - };
    - } catch(err) {
    - // 1003 is for "Unsupported Data"
    - // ws.close(1003, err.message);
    -
    - // TODO : remove debug alert ?
    - alert("Error : "+err.message+"\\\\nHMI will be reloaded.");
    -
    - // force reload ignoring cache
    - location.reload(true);
    - }
    -};
    function send_blob(data) {
    @@ -112,11 +70,69 @@
    // subscription state, as it should be in hmi server
    // hmitree indexed array of integers
    -var subscriptions = hmitree_types.map(function(_ignored) {return 0});
    +var subscriptions = hmitree_types.map(function(_ignored) {return 0;});
    +
    +/*! (c) Andrea Giammarchi - ISC */
    +var self = this || /* istanbul ignore next */ {};
    +try { self.Set = Set; }
    +catch (Set) {
    + (function (i, dPs) {'use strict';
    + var proto = dPs(Set.prototype, {size: {
    + configurable: true,
    + get: function () {
    + return this._v.length;
    + }
    + }});
    + proto.add = function (value) {
    + if (!has(this, value))
    + this._v.push(value);
    + return this;
    + };
    + proto.clear = function () {
    + var length = this._v.length;
    + this._v.splice(0, length);
    + };
    + proto.delete = function (value) {
    + return has(this, value) && !!this._v.splice(i, 1);
    + };
    + proto.entries = function () {
    + return this._v.map(pair);
    + };
    + proto.forEach = function (callback, context) {
    + this._v.forEach(
    + function (value, i) {
    + callback.call(context, value, value, this);
    + },
    + this
    + );
    + };
    + proto.has = function (key) {
    + return has(this, key);
    + };
    + proto.keys = proto.values = function () {
    + return this._v.slice(0);
    + };
    + self.Set = Set;
    + function Set(iterable) {
    + dPs(this, {_v: {value: []}});
    + if (iterable)
    + iterable.forEach(this.add, this);
    + }
    + function has(self, value) {
    + i = self._v.indexOf(value);
    + return -1 < i;
    + }
    + function pair(value) {
    + return [value, value];
    + }
    + }(0, Object.defineProperties));
    +}
    +
    // subscription state as needed by widget now
    // hmitree indexed array of Sets of widgets objects
    -var subscribers = hmitree_types.map(function(_ignored) {return new Set()});
    +var subscribers = hmitree_types.map(function(_ignored) {return new Set();});
    +
    function update_subscriptions() {
    var delta = [];
    @@ -217,6 +233,9 @@
    update_subscriptions();
    };
    +// Open WebSocket to relative "/ws" address
    +ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws'));
    +ws.binaryType = 'arraybuffer';
    // Once connection established
    ws.onopen = function (evt) {
    @@ -234,3 +253,45 @@
    alert("Connection closed. code:"+evt.code+" reason:"+evt.reason+" wasClean:"+evt.wasClean+".");
    };
    +
    +// Register message reception handler
    +ws.onmessage = function (evt) {
    +
    + var data = evt.data;
    + var dv = new DataView(data);
    + var i = 0;
    + try {
    + hmi_hash.forEach(function(hash_int) {
    + if(hash_int != dv.getUint8(i)){
    + throw new Error("Hash doesn't match");
    + };
    + i++;
    + });
    +
    + while(i < data.byteLength){
    + var index = dv.getUint32(i, true);
    + i += 4;
    + var iectype = hmitree_types[index];
    + if(iectype != undefined){
    + var _dvgetter = dvgetters[iectype];
    + var dvgetter = _dvgetter[0];
    + var bytesize = _dvgetter[1];
    + var value = dvgetter.call(dv,i,true);
    + dispatch_value(index, value);
    + i += bytesize;
    + } else {
    + throw new Error("Unknown index "+index)
    + }
    + };
    + } catch(err) {
    + // 1003 is for "Unsupported Data"
    + // ws.close(1003, err.message);
    +
    + // TODO : remove debug alert ?
    + alert("Error : "+err.message+"\\\\nHMI will be reloaded.");
    +
    + // force reload ignoring cache
    + location.reload(true);
    + }
    +};
    +