// widget_tooglebutton.ysl2

template "widget[@type='ToggleButton']", mode="widget_class"{

||

class ToggleButtonWidget extends Widget{

frequency = 5;

state = 0;

active_style = undefined;

inactive_style = undefined;

dispatch(value) {

this.state = value;

//redraw toggle button

this.request_animate();

}

on_click(evt) {

//toggle state and apply

if (this.state) {

this.state = 0;

} else {

this.state = 1;

}

this.apply_hmi_value(0, this.state);

//redraw toggle button

this.request_animate();

}

animate(){

// redraw toggle button on screen refresh

if (this.state) {

this.active_elt.setAttribute("style", this.active_style);

this.inactive_elt.setAttribute("style", "display:none");

} else {

this.inactive_elt.setAttribute("style", this.inactive_style);

this.active_elt.setAttribute("style", "display:none");

}

}

init() {

this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined;

this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined;

if (this.active_style && this.inactive_style) {

this.active_elt.setAttribute("style", "display:none");

this.inactive_elt.setAttribute("style", this.inactive_style);

}

this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)");

}

}

||

}

template "widget[@type='ToggleButton']", mode="widget_defs" {

param "hmi_element";

optional_labels("active inactive");

|,

}