svghmi/svghmi.js
author Edouard Tisserant <edouard.tisserant@gmail.com>
Fri, 20 Mar 2020 10:46:15 +0100
branchsvghmi
changeset 2891 8927ae8326b2
parent 2890 ae8063127e95
child 2895 89c02b452717
permissions -rw-r--r--
SVGHMI: add widget_foreach.ysl2
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);
2859
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
     4
var updates = {};
2803
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
     5
2811
4a81cec5f786 SVGHMI - prepare page with cached data when switching. This prevents values that do not change and that was already subscribed in previous page from keeping undefined.
Edouard Tisserant
parents: 2810
diff changeset
     6
function dispatch_value_to_widget(widget, index, value, oldval) {
2834
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
     7
    try {
2870
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
     8
        let idx = widget.offset ? index - widget.offset : index;
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
     9
        let idxidx = widget.indexes.indexOf(idx);
2834
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    10
        let d = widget.dispatch;
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    11
        if(typeof(d) == "function" && idxidx == 0){
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    12
            d.call(widget, value, oldval);
2870
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
    13
        }
2871
ed9b16b33628 SVGHMI: Re-enable dispatch to arrays of functions in case of multiple suscription per widget. Still unused, but disabled for reasons not any more true.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2870
diff changeset
    14
        else if(typeof(d) == "object" && d.length >= idxidx){
2834
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    15
            d[idxidx].call(widget, value, oldval);
2871
ed9b16b33628 SVGHMI: Re-enable dispatch to arrays of functions in case of multiple suscription per widget. Still unused, but disabled for reasons not any more true.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2870
diff changeset
    16
        }
2870
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
    17
        /* else dispatch_0, ..., dispatch_n ? */
2834
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    18
        /*else {
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    19
            throw new Error("Dunno how to dispatch to widget at index = " + index);
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    20
        }*/
2836
ce6cecdb7320 SVGHMI : still behave, even if important things are missing in SVG widget definitions (ex: needle missing for Meter widget)
Edouard Tisserant
parents: 2834
diff changeset
    21
    } catch(err) {
ce6cecdb7320 SVGHMI : still behave, even if important things are missing in SVG widget definitions (ex: needle missing for Meter widget)
Edouard Tisserant
parents: 2834
diff changeset
    22
        console.log(err);
2834
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    23
    }
2811
4a81cec5f786 SVGHMI - prepare page with cached data when switching. This prevents values that do not change and that was already subscribed in previous page from keeping undefined.
Edouard Tisserant
parents: 2810
diff changeset
    24
}
4a81cec5f786 SVGHMI - prepare page with cached data when switching. This prevents values that do not change and that was already subscribed in previous page from keeping undefined.
Edouard Tisserant
parents: 2810
diff changeset
    25
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    26
function dispatch_value(index, value) {
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    27
    let widgets = subscribers[index];
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    28
2805
e521e0d133d5 SVGHMI: fixed HMI->PLC dataflow : not updates as expected, and not initialized properly after subscribe.
Edouard Tisserant
parents: 2803
diff changeset
    29
    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
    30
    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
    31
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    32
    if(widgets.size > 0) {
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    33
        for(let widget of widgets){
2811
4a81cec5f786 SVGHMI - prepare page with cached data when switching. This prevents values that do not change and that was already subscribed in previous page from keeping undefined.
Edouard Tisserant
parents: 2810
diff changeset
    34
            dispatch_value_to_widget(widget, index, value, oldval);
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    35
        }
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
    36
    }
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    37
};
2783
5ee6967f721d SVGHMI: Starting to define JS side more in details.
Edouard Tisserant
parents: 2780
diff changeset
    38
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
    39
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
    40
    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
    41
        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
    42
        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
    43
        if(typeof(init) == "function"){
2834
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    44
            try {
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    45
                init.call(widget);
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    46
            } catch(err) {
2836
ce6cecdb7320 SVGHMI : still behave, even if important things are missing in SVG widget definitions (ex: needle missing for Meter widget)
Edouard Tisserant
parents: 2834
diff changeset
    47
                console.log(err);
2834
6ac6a9dff594 SVGHMI: be a bit more tolerant with missing HMI paths or missing elements in widgets : continue build (with warning) and fail silently at runtime.
Edouard Tisserant
parents: 2829
diff changeset
    48
            }
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
    49
        }
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
    50
    });
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
    51
};
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
    52
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    53
// Open WebSocket to relative "/ws" address
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    54
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
    55
ws.binaryType = 'arraybuffer';
2783
5ee6967f721d SVGHMI: Starting to define JS side more in details.
Edouard Tisserant
parents: 2780
diff changeset
    56
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    57
const dvgetters = {
2826
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    58
    INT: (dv,offset) => [dv.getInt16(offset, true), 2],
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    59
    BOOL: (dv,offset) => [dv.getInt8(offset, true), 1],
2890
ae8063127e95 SVGHMI: make root HMI tree node a HMI_NODE, droped HMI_ROOT node type
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2889
diff changeset
    60
    NODE: (dv,offset) => [dv.getInt8(offset, true), 1],
2826
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    61
    STRING: (dv, offset) => {
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    62
        size = dv.getInt8(offset);
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    63
        return [
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    64
            String.fromCharCode.apply(null, new Uint8Array(
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    65
                dv.buffer, /* original buffer */
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    66
                offset + 1, /* string starts after size*/
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    67
                size /* size of string */
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    68
            )), size + 1]; /* total increment */
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
    69
    }
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    70
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
    71
2859
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    72
// Apply updates recieved through ws.onmessage to subscribed widgets
2865
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    73
function apply_updates() {
2859
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    74
    for(let index in updates){
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    75
        // serving as a key, index becomes a string
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    76
        // -> pass Number(index) instead
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    77
        dispatch_value(Number(index), updates[index]);
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    78
        delete updates[index];
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    79
    }
2865
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    80
}
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    81
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    82
// Called on requestAnimationFrame, modifies DOM
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    83
var requestAnimationFrameID = null;
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    84
function animate() {
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    85
    // Do the page swith if any one pending
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    86
    if(current_subscribed_page != current_visible_page){
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    87
        switch_visible_page(current_subscribed_page);
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    88
    }
545902730141 SVGHMI: cosmetic code moving
Edouard Tisserant
parents: 2864
diff changeset
    89
    apply_updates();
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
    90
    requestAnimationFrameID = null;
2859
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    91
}
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    92
2860
b7650c6abeda SVGHMI: more decoupling in between UI related and the rest of JS code, still in the aim of enhancing robustness under heavy load.
Edouard Tisserant
parents: 2859
diff changeset
    93
function requestHMIAnimation() {
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
    94
    if(requestAnimationFrameID == null){
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
    95
        requestAnimationFrameID = window.requestAnimationFrame(animate);
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
    96
    }
2860
b7650c6abeda SVGHMI: more decoupling in between UI related and the rest of JS code, still in the aim of enhancing robustness under heavy load.
Edouard Tisserant
parents: 2859
diff changeset
    97
}
b7650c6abeda SVGHMI: more decoupling in between UI related and the rest of JS code, still in the aim of enhancing robustness under heavy load.
Edouard Tisserant
parents: 2859
diff changeset
    98
2859
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
    99
// Message reception handler
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
   100
// Hash is verified and HMI values updates resulting from binary parsing
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
   101
// are stored until browser can compute next frame, DOM is left untouched
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   102
ws.onmessage = function (evt) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   103
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   104
    let data = evt.data;
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   105
    let dv = new DataView(data);
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   106
    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
   107
    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
   108
        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
   109
            if(hash_int != dv.getUint8(i)){
2800
68cee1366b9c SVGHMI: dispatching data to minimalist "Display" text widget.
Edouard Tisserant
parents: 2799
diff changeset
   110
                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
   111
            };
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
   112
            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
   113
        };
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   114
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
   115
        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
   116
            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
   117
            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
   118
            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
   119
            if(iectype != undefined){
2826
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
   120
                let dvgetter = dvgetters[iectype];
1e5abecc3cde SVGHMI : support for HMI_STRING and HMI_BOOL
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2822
diff changeset
   121
                let [value, bytesize] = dvgetter(dv,i);
2859
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
   122
                updates[index] = value;
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
   123
                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
   124
            } else {
2859
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
   125
                throw new Error("Unknown index "+index);
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
            }
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
        };
2859
517583e21bfd SVGHMI: use requestAnimationFrame to delegate rendering of updates from network. Should help prevent browser collapse leading to watchdog in case of overload.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2850
diff changeset
   128
        // register for rendering on next frame, since there are updates
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   129
        requestHMIAnimation();
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
   130
    } 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
   131
        // 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
   132
        // ws.close(1003, err.message);
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   133
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
   134
        // 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
   135
        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
   136
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
   137
        // 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
   138
        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
   139
    }
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   140
};
2783
5ee6967f721d SVGHMI: Starting to define JS side more in details.
Edouard Tisserant
parents: 2780
diff changeset
   141
2788
2ed9ff826d03 SVGHMI: Work in progress. C side mostly implemented, neither built nor tested.
Edouard Tisserant
parents: 2783
diff changeset
   142
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   143
function send_blob(data) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   144
    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
   145
        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
   146
    };
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   147
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   148
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   149
const typedarray_types = {
2829
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   150
    INT: (number) => new Int16Array([number]),
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   151
    BOOL: (truth) => new Int16Array([truth]),
2890
ae8063127e95 SVGHMI: make root HMI tree node a HMI_NODE, droped HMI_ROOT node type
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2889
diff changeset
   152
    NODE: (truth) => new Int16Array([truth]),
2829
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   153
    STRING: (str) => {
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   154
        // beremiz default string max size is 128
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   155
        str = str.slice(0,128);
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   156
        binary = new Uint8Array(str.length + 1);
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   157
        binary[0] = str.length;
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   158
        for(var i = 0; i < str.length; i++){
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   159
            binary[i+1] = str.charCodeAt(i);
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   160
        }
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   161
        return binary;
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   162
    }
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   163
    /* TODO */
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   164
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   165
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   166
function send_reset() {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   167
    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
   168
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   169
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   170
// 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
   171
// hmitree indexed array of integers
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   172
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
   173
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   174
// 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
   175
// 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
   176
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
   177
2822
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   178
// artificially subscribe the watchdog widget to "/heartbeat" hmi variable
2829
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   179
// Since dispatch directly calls change_hmi_value,
2822
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   180
// PLC will periodically send variable at given frequency
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   181
subscribers[heartbeat_index].add({
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   182
    /* type: "Watchdog", */
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   183
    frequency: 1,
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   184
    indexes: [heartbeat_index],
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   185
    dispatch: function(value) {
2829
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   186
        change_hmi_value(heartbeat_index, "+1");
2822
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   187
    }
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   188
});
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   189
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   190
function update_subscriptions() {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   191
    let delta = [];
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   192
    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
   193
        let widgets = subscribers[index];
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   194
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   195
        // periods are in ms
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   196
        let previous_period = subscriptions[index];
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   197
2822
9101a72a1da0 SVGHMI: added a watchdog. To ensure that the whole chain is checked, watchdog use a periodic echo of a hearteat variable. JS client code systematically register /HEARTBEAT at 1s update freq, and reacts on updates of /HEARTBEAT by systematically incrementing it. C code catch /HEARTBEAT update and feeds python-implemented watchdog. For now, watchdog does nothing when tiggered
Edouard Tisserant
parents: 2811
diff changeset
   198
        // subscribing with a zero period is unsubscribing
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
   199
        let new_period = 0;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   200
        if(widgets.size > 0) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   201
            let maxfreq = 0;
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   202
            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
   203
                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
   204
                    maxfreq = widget.frequency;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   205
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
   206
            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
   207
                new_period = 1000/maxfreq;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   208
        }
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   209
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   210
        if(previous_period != new_period) {
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   211
            subscriptions[index] = new_period;
2802
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   212
            delta.push(
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   213
                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
   214
                new Uint32Array([index]),
2802
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   215
                new Uint16Array([new_period]));
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   216
        }
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   217
    }
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   218
    send_blob(delta);
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   219
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   220
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
   221
function send_hmi_value(index, value) {
2802
64e6f73b9859 SVGHMI - Fixed svghmi.{c,js} about HMI -> PLC data unpack.
Edouard Tisserant
parents: 2801
diff changeset
   222
    let iectype = hmitree_types[index];
2829
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   223
    let tobinary = typedarray_types[iectype];
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   224
    send_blob([
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   225
        new Uint8Array([0]),  /* setval = 0 */
2829
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   226
        new Uint32Array([index]),
4c2c50f60730 SVGHMI : HMI_STRING now also supported from HMI to PLC
Edouard Tisserant
parents: 2827
diff changeset
   227
        tobinary(value)]);
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   228
2803
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   229
    cache[index] = value;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   230
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   231
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
   232
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
   233
    let op = opstr[0];
2803
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   234
    let given_val = opstr.slice(1);
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   235
    let old_val = cache[index]
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   236
    let new_val;
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   237
    switch(op){
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   238
      case "=":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   239
        eval("new_val"+opstr);
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   240
        break;
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   241
      case "+":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   242
      case "-":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   243
      case "*":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   244
      case "/":
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   245
        if(old_val != undefined)
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   246
            new_val = eval("old_val"+opstr);
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   247
        break;
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   248
    }
f48121cf31b6 SVGHMI: Added relative changes of HMI value from widgets.
Edouard Tisserant
parents: 2802
diff changeset
   249
    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
   250
        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
   251
    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
   252
}
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
   253
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   254
var current_visible_page;
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   255
var current_subscribed_page;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   256
2843
94696b3f69fb SVGHMI : still trying to optimize. Added xslt code to identitfy minimum set of elements needed by a particular page. Plan is to remove unseen/unused elements from the DOM, and re-appending them later when used, on page switch. Disabled previous optimization.
Edouard Tisserant
parents: 2841
diff changeset
   257
function prepare_svg() {
2850
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   258
    for(let eltid in detachable_elements){
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   259
        let [element,parent] = detachable_elements[eltid];
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   260
        parent.removeChild(element);
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   261
    }
2843
94696b3f69fb SVGHMI : still trying to optimize. Added xslt code to identitfy minimum set of elements needed by a particular page. Plan is to remove unseen/unused elements from the DOM, and re-appending them later when used, on page switch. Disabled previous optimization.
Edouard Tisserant
parents: 2841
diff changeset
   262
};
94696b3f69fb SVGHMI : still trying to optimize. Added xslt code to identitfy minimum set of elements needed by a particular page. Plan is to remove unseen/unused elements from the DOM, and re-appending them later when used, on page switch. Disabled previous optimization.
Edouard Tisserant
parents: 2841
diff changeset
   263
2870
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
   264
function switch_page(page_name, page_index) {
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   265
    if(current_subscribed_page != current_visible_page){
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   266
        /* page switch already going */
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   267
        /* TODO LOG ERROR */
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   268
        return;
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   269
    } else if(page_name == current_visible_page){
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   270
        /* already in that page */
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   271
        /* TODO LOG ERROR */
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   272
        return;
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   273
    }
2870
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
   274
    switch_subscribed_page(page_name, page_index);
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   275
};
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   276
2869
d9eb50c015d1 SVGHMI: take care of path given in HMI:Page and HMI:Jump, but do not apply subscription offset for now. Intermediate commit in a "working" state.
Edouard Tisserant
parents: 2867
diff changeset
   277
function* chain(a,b){
d9eb50c015d1 SVGHMI: take care of path given in HMI:Page and HMI:Jump, but do not apply subscription offset for now. Intermediate commit in a "working" state.
Edouard Tisserant
parents: 2867
diff changeset
   278
    yield* a;
d9eb50c015d1 SVGHMI: take care of path given in HMI:Page and HMI:Jump, but do not apply subscription offset for now. Intermediate commit in a "working" state.
Edouard Tisserant
parents: 2867
diff changeset
   279
    yield* b;
d9eb50c015d1 SVGHMI: take care of path given in HMI:Page and HMI:Jump, but do not apply subscription offset for now. Intermediate commit in a "working" state.
Edouard Tisserant
parents: 2867
diff changeset
   280
};
d9eb50c015d1 SVGHMI: take care of path given in HMI:Page and HMI:Jump, but do not apply subscription offset for now. Intermediate commit in a "working" state.
Edouard Tisserant
parents: 2867
diff changeset
   281
2889
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   282
function unsubscribe(){
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   283
    widget = this;
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   284
    /* remove subsribers */
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   285
    for(let index of widget.indexes){
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   286
        let idx = index + widget.offset;
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   287
        subscribers[idx].delete(widget);
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   288
    }
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   289
    widget.offset = 0;
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   290
}
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   291
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   292
function subscribe(new_offset=0){
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   293
    widget = this;
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   294
    /* set the offset because relative */
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   295
    widget.offset = new_offset;
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   296
    /* add widget's subsribers */
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   297
    for(let index of widget.indexes){
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   298
        subscribers[index + new_offset].add(widget);
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   299
    }
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   300
}
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   301
2870
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
   302
function switch_subscribed_page(page_name, page_index) {
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   303
    let old_desc = page_desc[current_subscribed_page];
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   304
    let new_desc = page_desc[page_name];
2841
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   305
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   306
    if(new_desc == undefined){
2843
94696b3f69fb SVGHMI : still trying to optimize. Added xslt code to identitfy minimum set of elements needed by a particular page. Plan is to remove unseen/unused elements from the DOM, and re-appending them later when used, on page switch. Disabled previous optimization.
Edouard Tisserant
parents: 2841
diff changeset
   307
        /* TODO LOG ERROR */
2841
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   308
        return;
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   309
    }
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   310
2870
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
   311
    if(page_index == undefined){
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
   312
        page_index = new_desc.page_index;
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
   313
    }
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
   314
2841
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   315
    if(old_desc){
2889
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   316
        old_desc.absolute_widgets.map(w=>w.unsub());
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   317
        old_desc.relative_widgets.map(w=>w.unsub());
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   318
    }
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   319
    new_desc.absolute_widgets.map(w=>w.sub());
2870
634b43d69897 SVGHMI: relative pages and page jumps
Edouard Tisserant
parents: 2869
diff changeset
   320
    var new_offset = page_index == undefined ? 0 : page_index - new_desc.page_index;
2889
4eeed820fd3a SVGHMI: reworked widget (un)subscription now a method of widgect object, allowing special subscription methods
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2871
diff changeset
   321
    new_desc.relative_widgets.map(w=>w.sub(new_offset));
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   322
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   323
    update_subscriptions();
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   324
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   325
    current_subscribed_page = page_name;
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   326
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   327
    requestHMIAnimation();
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   328
}
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   329
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   330
function switch_visible_page(page_name) {
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   331
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   332
    let old_desc = page_desc[current_visible_page];
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   333
    let new_desc = page_desc[page_name];
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   334
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   335
    if(old_desc){
2850
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   336
        for(let eltid in old_desc.required_detachables){
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   337
            if(!(eltid in new_desc.required_detachables)){
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   338
                let [element, parent] = old_desc.required_detachables[eltid];
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   339
                parent.removeChild(element);
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   340
            }
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   341
        }
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   342
        for(let eltid in new_desc.required_detachables){
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   343
            if(!(eltid in old_desc.required_detachables)){
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   344
                let [element, parent] = new_desc.required_detachables[eltid];
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   345
                parent.appendChild(element);
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   346
            }
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   347
        }
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   348
    }else{
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   349
        for(let eltid in new_desc.required_detachables){
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   350
            let [element, parent] = new_desc.required_detachables[eltid];
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   351
            parent.appendChild(element);
e38654ec6281 SVGHMI: detach/re-attach elements required by pages on page switch
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2843
diff changeset
   352
        }
2843
94696b3f69fb SVGHMI : still trying to optimize. Added xslt code to identitfy minimum set of elements needed by a particular page. Plan is to remove unseen/unused elements from the DOM, and re-appending them later when used, on page switch. Disabled previous optimization.
Edouard Tisserant
parents: 2841
diff changeset
   353
    }
94696b3f69fb SVGHMI : still trying to optimize. Added xslt code to identitfy minimum set of elements needed by a particular page. Plan is to remove unseen/unused elements from the DOM, and re-appending them later when used, on page switch. Disabled previous optimization.
Edouard Tisserant
parents: 2841
diff changeset
   354
2869
d9eb50c015d1 SVGHMI: take care of path given in HMI:Page and HMI:Jump, but do not apply subscription offset for now. Intermediate commit in a "working" state.
Edouard Tisserant
parents: 2867
diff changeset
   355
    for(let widget of chain(new_desc.absolute_widgets,new_desc.relative_widgets)){
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   356
        for(let index of widget.indexes){
2841
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   357
            /* dispatch current cache in newly opened page widgets */
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   358
            let cached_val = cache[index];
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   359
            if(cached_val != undefined)
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   360
                dispatch_value_to_widget(widget, index, cached_val, cached_val);
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   361
        }
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   362
    }
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   363
7c6050cde9e3 SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
Edouard Tisserant
parents: 2836
diff changeset
   364
    svg_root.setAttribute('viewBox',new_desc.bbox.join(" "));
2864
36f78f6cfabd SVGHMI: split page switch into switching subscription and switching elements in the DOM, to ensure that subscriptions have been send before changing DOM, and avoid some flicker.
Edouard Tisserant
parents: 2860
diff changeset
   365
    current_visible_page = page_name;
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   366
};
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   367
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   368
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   369
// Once connection established
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   370
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
   371
    init_widgets();
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   372
    send_reset();
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   373
    // show main page
2843
94696b3f69fb SVGHMI : still trying to optimize. Added xslt code to identitfy minimum set of elements needed by a particular page. Plan is to remove unseen/unused elements from the DOM, and re-appending them later when used, on page switch. Disabled previous optimization.
Edouard Tisserant
parents: 2841
diff changeset
   374
    prepare_svg();
2798
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   375
    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
   376
};
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
   377
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
   378
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
   379
    // 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
   380
    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
   381
    // 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
   382
    //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
   383
    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
   384
ddb2c4668a6b SVGHMI : many details about communication implemented in JS, with side effects.
Edouard Tisserant
parents: 2788
diff changeset
   385
};