// widget_button.ysl2

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

||

class ButtonWidget extends Widget{

frequency = 5;

state_plc = 0;

state_hmi = 0;

plc_lock = false;

active_style = undefined;

inactive_style = undefined;

dispatch(value) {

this.state_plc = value;

if(this.plc_lock){

if(this.state_plc == 1){

this.apply_hmi_value(0, 0);

this.plc_lock = false;

}

}

//redraw button

this.state_hmi = this.state_plc;

this.request_animate();

}

animate(){

// redraw button on screen refresh

if (this.state_hmi) {

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");

}

}

on_click(evt) {

//set state and apply if plc is 0

this.plc_lock = true;

if(this.state_plc == 0){

this.apply_hmi_value(0, 1);

}

//redraw button

this.request_animate();

}

on_press(evt) {

//set graphic

this.state_hmi = 1;

//redraw button

this.request_animate();

}

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)");

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

}

}

||

}

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

param "hmi_element";

optional_labels("active inactive");

|,

}