svghmi/widget_tooglebutton.ysl2
author usveticic
Thu, 01 Oct 2020 14:23:27 +0200
branchsvghmi
changeset 3062 9ec338a99a18
parent 3059 e0db3f6a5f39
child 3219 cc0ecc5e918f
permissions -rw-r--r--
Button fix if no active or inactive state,
Widget animate changed to use anitmateTransform and added option to change rotation
Widget circular slider fixed so it is working on got and reprogramed so it similar to normal slider
Widget slider added support for changing size still need some changes to work properly
Added slider to svghmi test project
Changed svg in svhgmi_v2 project
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) {
3059
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    13
            this.state = value;
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    14
            //redraw toggle button
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    15
            this.request_animate();
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    16
        }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    17
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    18
        on_click(evt) {
3059
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    19
            //toggle state and apply
3056
827bf284feec Button, ToggleButton and slider updated. Error to warning when building
usveticic
parents: 3024
diff changeset
    20
            if (this.state) {
827bf284feec Button, ToggleButton and slider updated. Error to warning when building
usveticic
parents: 3024
diff changeset
    21
                this.state = 0;
827bf284feec Button, ToggleButton and slider updated. Error to warning when building
usveticic
parents: 3024
diff changeset
    22
            } else {
827bf284feec Button, ToggleButton and slider updated. Error to warning when building
usveticic
parents: 3024
diff changeset
    23
                this.state = 1;
827bf284feec Button, ToggleButton and slider updated. Error to warning when building
usveticic
parents: 3024
diff changeset
    24
            }
3018
Edouard Tisserant
parents: 3011
diff changeset
    25
            this.apply_hmi_value(0, this.state);
3059
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    26
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    27
            //redraw toggle button
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    28
            this.request_animate();
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    29
        }
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    30
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    31
        animate(){
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    32
           // redraw toggle button on screen refresh
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    33
           if (this.state) {
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    34
               this.active_elt.setAttribute("style", this.active_style);
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    35
               this.inactive_elt.setAttribute("style", "display:none");
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    36
           } else {
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    37
               this.inactive_elt.setAttribute("style", this.inactive_style);
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    38
               this.active_elt.setAttribute("style", "display:none");
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    39
           }
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    40
        }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    41
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    42
        init() {
3059
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    43
            this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined;
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    44
            this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined;
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    45
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    46
            if (this.active_style && this.inactive_style) {
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    47
                this.active_elt.setAttribute("style", "display:none");
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    48
                this.inactive_elt.setAttribute("style", this.inactive_style);
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    49
            }
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    50
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    51
            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
    52
        }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    53
    }
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    54
    ||
3024
Edouard Tisserant
parents: 3018
diff changeset
    55
}
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    56
2977
82f062408e70 SVGHMI: Added widget toggleButton.
dgaberscek
parents:
diff changeset
    57
template "widget[@type='ToggleButton']", mode="widget_defs" {
82f062408e70 SVGHMI: Added widget toggleButton.
dgaberscek
parents:
diff changeset
    58
    param "hmi_element";
3059
e0db3f6a5f39 Button and toggle reworked to use animate and dispatch
usveticic
parents: 3056
diff changeset
    59
    optional_labels("active inactive");
3011
601c6dbc1da7 Reworked togglebutton widget to extand class widget
usveticic
parents: 3004
diff changeset
    60
    |,
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
    61
}