// widget_tooglebutton.ysl2
widget_desc("ToggleButton") {
Button widget takes one boolean variable path, and reflect current true
or false value by showing "active" or "inactive" labeled element
respectively. Clicking or touching button toggles variable.
shortdesc > Toggle button reflecting given boolean variable
path name="value" accepts="HMI_BOOL" > Boolean variable
widget_class("ToggleButton") {
active_style = undefined;
inactive_style = undefined;
this.state = this.state ? false : true;
this.apply_hmi_value(0, this.state);
let [active, inactive] = val ? ["none",""] : ["", "none"];
this.active_elt.style.display = active;
this.inactive_elt.style.display = inactive;
// redraw toggle button on screen refresh
this.activate(this.state);
this.element.onclick = (evt) => this.on_click(evt);
widget_defs("ToggleButton") {
optional_labels("active inactive");