svghmi/widget_tooglebutton.ysl2
author Edouard Tisserant
Tue, 25 Aug 2020 14:32:39 +0200
branchsvghmi
changeset 3036 4930455428df
parent 3024 0a9f6f29b7dd
child 3056 827bf284feec
permissions -rw-r--r--
SVGHMI: JsonTable now use intermediate variables again to address JSON data without duplicating code or referencing. Using intermediate variables also alows to check for availability of data and stop evaluating early if data is missing. Finally added complete roundtrip example to illustrate use of JSonTable to display "alarms" collected in python from changes on PLC boolean variables.
2977
82f062408e70 SVGHMI: Added widget toggleButton.
dgaberscek
parents:
diff changeset
     1
// widget_tooglebutton.ysl2
82f062408e70 SVGHMI: Added widget toggleButton.
dgaberscek
parents:
diff changeset
     2
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
     3
3024
Edouard Tisserant
parents: 3018
diff changeset
     4
template "widget[@type='ToggleButton']", mode="widget_class"{
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
     5
    ||
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
     6
    class ToggleButtonWidget extends Widget{
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
     7
        frequency = 5;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
     8
        state = 0;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
     9
        active_style = undefined;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    10
        inactive_style = undefined;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    11
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    12
        dispatch(value) {
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    13
            this.state = value;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    14
            if (this.state) {
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    15
                this.active_elt.setAttribute("style", this.active_style);
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    16
                this.inactive_elt.setAttribute("style", "display:none");
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    17
                this.state = 0;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    18
            } else {
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    19
                this.inactive_elt.setAttribute("style", this.inactive_style);
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    20
                this.active_elt.setAttribute("style", "display:none");
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    21
                this.state = 1;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    22
            }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    23
        }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    24
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    25
        on_click(evt) {
3018
Edouard Tisserant
parents: 3011
diff changeset
    26
            this.apply_hmi_value(0, this.state);
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    27
        }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    28
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    29
        init() {
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    30
            this.active_style = this.active_elt.style.cssText;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    31
            this.inactive_style = this.inactive_elt.style.cssText;
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    32
            this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)");
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    33
        }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    34
    }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    35
    ||
3024
Edouard Tisserant
parents: 3018
diff changeset
    36
}
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    37
2977
82f062408e70 SVGHMI: Added widget toggleButton.
dgaberscek
parents:
diff changeset
    38
template "widget[@type='ToggleButton']", mode="widget_defs" {
82f062408e70 SVGHMI: Added widget toggleButton.
dgaberscek
parents:
diff changeset
    39
    param "hmi_element";
82f062408e70 SVGHMI: Added widget toggleButton.
dgaberscek
parents:
diff changeset
    40
    labels("active inactive");
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    41
    |,
3004
705e34c6fe93 SVGHMI: More JS code refactoring : change_hmi_value and apply_hmi_value now methods of widget class.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2977
diff changeset
    42
}