svghmi/svghmi.js
author Edouard Tisserant
Mon, 28 Oct 2019 19:52:43 +0100
branchsvghmi
changeset 2808 dc78ffa5253d
parent 2806 7d0e81cdedb0
child 2810 63b9a37b73c7
permissions -rw-r--r--
SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
2783
5ee6967f721d SVGHMI: Starting to define JS side more in details.
Edouard Tisserant
parents: 2780
diff changeset
     1
// svghmi.js
5ee6967f721d SVGHMI: Starting to define JS side more in details.
Edouard Tisserant
parents: 2780
diff changeset
     2
2803
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
     3
var cache = hmitree_types.map(_ignored => undefined);
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
     4
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
     5
function dispatch_value(index, value) {
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
     6
    let widgets = subscribers[index];
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
     7
2805
e521e0d133d5 SVGHMI: fixed HMI->PLC dataflow : not updates as expected, and not initialized properly after subscribe.
Edouard Tisserant
parents: 2803
diff changeset
     8
    let oldval = cache[index];
e521e0d133d5 SVGHMI: fixed HMI->PLC dataflow : not updates as expected, and not initialized properly after subscribe.
Edouard Tisserant
parents: 2803
diff changeset
     9
    cache[index] = value;
e521e0d133d5 SVGHMI: fixed HMI->PLC dataflow : not updates as expected, and not initialized properly after subscribe.
Edouard Tisserant
parents: 2803
diff changeset
    10
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    11
    if(widgets.size > 0) {
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    12
        for(let widget of widgets){
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    13
            let idxidx = widget.indexes.indexOf(index);
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    14
            if(idxidx == -1){
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    15
                throw new Error("Dispatching to widget not interested, should not happen.");
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    16
            }
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    17
            let d = widget.dispatch;
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    18
            if(typeof(d) == "function" && idxidx == 0){
2805
e521e0d133d5 SVGHMI: fixed HMI->PLC dataflow : not updates as expected, and not initialized properly after subscribe.
Edouard Tisserant
parents: 2803
diff changeset
    19
                return d.call(widget, value, oldval);
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    20
            }else if(typeof(d) == "object" && d.length >= idxidx){
2805
e521e0d133d5 SVGHMI: fixed HMI->PLC dataflow : not updates as expected, and not initialized properly after subscribe.
Edouard Tisserant
parents: 2803
diff changeset
    21
                return d[idxidx].call(widget, value, oldval);
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    22
            }/* else dispatch_0, ..., dispatch_n ? */
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    23
            /*else {
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    24
                throw new Error("Dunno how to dispatch to widget at index = " + index);
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    25
            }*/
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    26
        }
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    27
    }
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    28
};
2783
5ee6967f721d SVGHMI: Starting to define JS side more in details.
Edouard Tisserant
parents: 2780
diff changeset
    29
2801
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    30
function init_widgets() {
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    31
    Object.keys(hmi_widgets).forEach(function(id) {
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    32
        let widget = hmi_widgets[id];
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    33
        let init = widget.init;
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    34
        if(typeof(init) == "function"){
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    35
            return init.call(widget);
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    36
        }
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    37
    });
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    38
};
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
    39
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    40
// Open WebSocket to relative "/ws" address
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    41
var ws = new WebSocket(window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws'));
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    42
ws.binaryType = 'arraybuffer';
2783
5ee6967f721d SVGHMI: Starting to define JS side more in details.
Edouard Tisserant
parents: 2780
diff changeset
    43
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    44
const dvgetters = {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    45
    INT: [DataView.prototype.getInt16, 2],
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    46
    BOOL: [DataView.prototype.getInt8, 1]
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    47
    /* TODO */
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    48
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    49
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    50
// Register message reception handler 
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    51
ws.onmessage = function (evt) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    52
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    53
    let data = evt.data;
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    54
    let dv = new DataView(data);
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    55
    let i = 0;
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    56
    try {
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    57
        for(let hash_int of hmi_hash) {
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    58
            if(hash_int != dv.getUint8(i)){
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    59
                throw new Error("Hash doesn't match");
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    60
            };
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    61
            i++;
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    62
        };
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    63
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    64
        while(i < data.byteLength){
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    65
            let index = dv.getUint32(i, true);
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    66
            i += 4;
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    67
            let iectype = hmitree_types[index];
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    68
            if(iectype != undefined){
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    69
                let [dvgetter, bytesize] = dvgetters[iectype];
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    70
                let value = dvgetter.call(dv,i,true);
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    71
                dispatch_value(index, value);
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    72
                i += bytesize;
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    73
            } else {
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    74
                throw new Error("Unknown index "+index)
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    75
            }
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    76
        };
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    77
    } catch(err) {
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    78
        // 1003 is for "Unsupported Data"
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    79
        // ws.close(1003, err.message);
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    80
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    81
        // TODO : remove debug alert ?
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    82
        alert("Error : "+err.message+"\\\\nHMI will be reloaded.");
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    83
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    84
        // force reload ignoring cache
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    85
        location.reload(true);
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    86
    }
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    87
};
2783
5ee6967f721d SVGHMI: Starting to define JS side more in details.
Edouard Tisserant
parents: 2780
diff changeset
    88
2788
2ed9ff826d03 SVGHMI: Work in progress. C side mostly implemented, neither built nor tested.
Edouard Tisserant
parents: 2783
diff changeset
    89
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    90
function send_blob(data) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    91
    if(data.length > 0) {
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
    92
        ws.send(new Blob([new Uint8Array(hmi_hash)].concat(data)));
2780
e468f18df200 SVGHMI: moved static JS code to a separate file included at xhtml generation time
Edouard Tisserant
parents:
diff changeset
    93
    };
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    94
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    95
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    96
const typedarray_types = {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    97
    INT: Int16Array,
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    98
    BOOL: Uint8Array
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    99
    /* TODO */
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   100
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   101
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   102
function send_reset() {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   103
    send_blob(new Uint8Array([1])); /* reset = 1 */
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   104
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   105
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   106
// subscription state, as it should be in hmi server
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   107
// hmitree indexed array of integers
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   108
var subscriptions =  hmitree_types.map(_ignored => 0);
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   109
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   110
// subscription state as needed by widget now
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   111
// hmitree indexed array of Sets of widgets objects
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   112
var subscribers = hmitree_types.map(_ignored => new Set());
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   113
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   114
function update_subscriptions() {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   115
    let delta = [];
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   116
    for(let index = 0; index < subscribers.length; index++){
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   117
        let widgets = subscribers[index];
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   118
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   119
        // periods are in ms
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   120
        let previous_period = subscriptions[index];
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   121
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   122
        let new_period = 0;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   123
        if(widgets.size > 0) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   124
            let maxfreq = 0;
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   125
            for(let widget of widgets)
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   126
                if(maxfreq < widget.frequency)
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   127
                    maxfreq = widget.frequency;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   128
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   129
            if(maxfreq != 0)
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   130
                new_period = 1000/maxfreq;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   131
        }
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   132
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   133
        if(previous_period != new_period) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   134
            subscriptions[index] = new_period;
2802
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   135
            delta.push(
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   136
                new Uint8Array([2]), /* subscribe = 2 */
2806
7d0e81cdedb0 SVGHMI: Quicker update path for input widget when pressing on buttons, do not wait until data comes back, and simply update value text of the pressed widget. Updated PLC prog for more amimated value to display
Edouard Tisserant
parents: 2805
diff changeset
   137
                new Uint32Array([index]),
2802
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   138
                new Uint16Array([new_period]));
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   139
        }
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   140
    }
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   141
    send_blob(delta);
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   142
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   143
2801
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
   144
function send_hmi_value(index, value) {
2802
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   145
    let iectype = hmitree_types[index];
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   146
    let jstype = typedarray_types[iectype];
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   147
    send_blob([
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   148
        new Uint8Array([0]),  /* setval = 0 */
2802
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   149
        new Uint32Array([index]), 
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   150
        new jstype([value])]);
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   151
2803
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   152
    cache[index] = value;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   153
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   154
2801
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
   155
function change_hmi_value(index, opstr) {
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
   156
    let op = opstr[0];
2803
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   157
    let given_val = opstr.slice(1);
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   158
    let old_val = cache[index]
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   159
    let new_val;
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   160
    switch(op){
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   161
      case "=":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   162
        eval("new_val"+opstr);
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   163
        break;
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   164
      case "+":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   165
      case "-":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   166
      case "*":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   167
      case "/":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   168
        if(old_val != undefined)
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   169
            new_val = eval("old_val"+opstr);
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   170
        break;
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   171
    }
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   172
    if(new_val != undefined && old_val != new_val)
2806
7d0e81cdedb0 SVGHMI: Quicker update path for input widget when pressing on buttons, do not wait until data comes back, and simply update value text of the pressed widget. Updated PLC prog for more amimated value to display
Edouard Tisserant
parents: 2805
diff changeset
   173
        send_hmi_value(index, new_val);
7d0e81cdedb0 SVGHMI: Quicker update path for input widget when pressing on buttons, do not wait until data comes back, and simply update value text of the pressed widget. Updated PLC prog for more amimated value to display
Edouard Tisserant
parents: 2805
diff changeset
   174
    return new_val;
2801
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
   175
}
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
   176
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   177
var current_page;
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   178
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   179
function switch_page(page_name) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   180
    let old_desc = page_desc[current_page];
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   181
    let new_desc = page_desc[page_name];
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   182
    /* TODO hide / show widgets */
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   183
    /* TODO move viewport */
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   184
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   185
    /* remove subsribers of previous page if any */
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   186
    if(old_desc) for(let widget of old_desc.widgets){
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   187
        for(let index of widget.indexes){
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   188
            subscribers[index].delete(widget);
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   189
        }
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   190
    }
2808
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   191
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   192
    if(new_desc) {
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   193
        /* add new subsribers if any */
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   194
        for(let widget of new_desc.widgets){
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   195
            for(let index of widget.indexes){
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   196
                subscribers[index].add(widget);
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   197
            }
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   198
        }
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   199
        svg_root.setAttribute('viewBox',new_desc.bbox.join(" "));
dc78ffa5253d SVGHMI: SVG viewport now defined so that HMI take scales and fit to the view. Implemented page switch through viewport change, no hiding of widget for now.
Edouard Tisserant
parents: 2806
diff changeset
   200
    }
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   201
    current_page = page_name;
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   202
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   203
    update_subscriptions();
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   204
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   205
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   206
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   207
// Once connection established
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   208
ws.onopen = function (evt) {
2801
390acff12755 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.
Edouard Tisserant
parents: 2800
diff changeset
   209
    init_widgets();
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   210
    send_reset();
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   211
    // show main page
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   212
    switch_page(default_page);
2799
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   213
};
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   214
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   215
ws.onclose = function (evt) {
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   216
    // TODO : add visible notification while waiting for reload
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   217
    console.log("Connection closed. code:"+evt.code+" reason:"+evt.reason+" wasClean:"+evt.wasClean+" Reload in 10s.");
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   218
    // TODO : re-enable auto reload when not in debug
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   219
    //window.setTimeout(() => location.reload(true), 10000);
f5da343b9b63 SVGHMI: Many fixes. Subscriptions to HMItree seems to be working, and dispatch function is called in JS with good data. Bidirectional communication now really working.
Edouard Tisserant
parents: 2798
diff changeset
   220
    alert("Connection closed. code:"+evt.code+" reason:"+evt.reason+" wasClean:"+evt.wasClean+".");
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   221
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   222
};