beremiz

Button fix if no active or inactive state,
svghmi
2020-10-01, usveticic
9ec338a99a18
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
// 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");
|,
}