// widget_circularbar.ysl2
template "widget[@type='CircularBar']", mode="widget_class"{
||
class CircularBarWidget extends Widget{
frequency = 10;
range = undefined;
dispatch(value) {
if(this.value_elt)
this.value_elt.textContent = String(value);
let [min,max,start,end] = this.range;
let [cx,cy] = this.center;
let [rx,ry] = this.proportions;
let tip = start + (end-start)*Number(value)/(max-min);
let size = 0;
if (tip-start > Math.PI) {
size = 1;
} else {
size = 0;
}
this.path_elt.setAttribute('d', "M "+(cx+rx*Math.cos(start))+","+(cy+ry*Math.sin(start))+" A "+rx+","+ry+" 0 "+size+" 1 "+(cx+rx*Math.cos(tip))+","+(cy+ry*Math.sin(tip)));
}
init() {
let start = Number(this.path_elt.getAttribute('sodipodi:start'));
let end = Number(this.path_elt.getAttribute('sodipodi:end'));
let cx = Number(this.path_elt.getAttribute('sodipodi:cx'));
let cy = Number(this.path_elt.getAttribute('sodipodi:cy'));
let rx = Number(this.path_elt.getAttribute('sodipodi:rx'));
let ry = Number(this.path_elt.getAttribute('sodipodi:ry'));
if (ry == 0) {
ry = rx;
}
if (start > end) {
end = end + 2*Math.PI;
}
let min = this.min_elt ?
Number(this.min_elt.textContent) :
this.args.length >= 1 ? this.args[0] : 0;
let max = this.max_elt ?
Number(this.max_elt.textContent) :
this.args.length >= 2 ? this.args[1] : 100;
this.range = [min, max, start, end];
this.center = [cx, cy];
this.proportions = [rx, ry];
}
}
||
}
template "widget[@type='CircularBar']", mode="widget_defs" {
param "hmi_element";
labels("path");
optional_labels("value min max");
|,
}