8 state = 0; |
8 state = 0; |
9 active_style = undefined; |
9 active_style = undefined; |
10 inactive_style = undefined; |
10 inactive_style = undefined; |
11 |
11 |
12 dispatch(value) { |
12 dispatch(value) { |
13 if(this.state != value){ |
13 this.state = value; |
14 this.state = value; |
14 //redraw toggle button |
15 if (this.state) { |
15 this.request_animate(); |
16 this.active_elt.setAttribute("style", this.active_style); |
|
17 this.inactive_elt.setAttribute("style", "display:none"); |
|
18 } else { |
|
19 this.inactive_elt.setAttribute("style", this.inactive_style); |
|
20 this.active_elt.setAttribute("style", "display:none"); |
|
21 } |
|
22 } |
|
23 } |
16 } |
24 |
17 |
25 on_click(evt) { |
18 on_click(evt) { |
|
19 //toggle state and apply |
26 if (this.state) { |
20 if (this.state) { |
27 this.inactive_elt.setAttribute("style", this.inactive_style); |
|
28 this.active_elt.setAttribute("style", "display:none"); |
|
29 this.state = 0; |
21 this.state = 0; |
30 } else { |
22 } else { |
31 this.active_elt.setAttribute("style", this.active_style); |
|
32 this.inactive_elt.setAttribute("style", "display:none"); |
|
33 this.state = 1; |
23 this.state = 1; |
34 } |
24 } |
35 this.apply_hmi_value(0, this.state); |
25 this.apply_hmi_value(0, this.state); |
|
26 |
|
27 //redraw toggle button |
|
28 this.request_animate(); |
|
29 } |
|
30 |
|
31 animate(){ |
|
32 // redraw toggle button on screen refresh |
|
33 if (this.state) { |
|
34 this.active_elt.setAttribute("style", this.active_style); |
|
35 this.inactive_elt.setAttribute("style", "display:none"); |
|
36 } else { |
|
37 this.inactive_elt.setAttribute("style", this.inactive_style); |
|
38 this.active_elt.setAttribute("style", "display:none"); |
|
39 } |
36 } |
40 } |
37 |
41 |
38 init() { |
42 init() { |
39 this.active_style = this.active_elt.style.cssText; |
43 this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined; |
40 this.inactive_style = this.inactive_elt.style.cssText; |
44 this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined; |
|
45 |
|
46 if (this.active_style && this.inactive_style) { |
|
47 this.active_elt.setAttribute("style", "display:none"); |
|
48 this.inactive_elt.setAttribute("style", this.inactive_style); |
|
49 } |
|
50 |
41 this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)"); |
51 this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)"); |
42 this.inactive_elt.setAttribute("style", this.inactive_style); |
|
43 this.active_elt.setAttribute("style", "display:none"); |
|
44 } |
52 } |
45 } |
53 } |
46 || |
54 || |
47 } |
55 } |
48 |
56 |
49 template "widget[@type='ToggleButton']", mode="widget_defs" { |
57 template "widget[@type='ToggleButton']", mode="widget_defs" { |
50 param "hmi_element"; |
58 param "hmi_element"; |
51 labels("active inactive"); |
59 optional_labels("active inactive"); |
52 |, |
60 |, |
53 } |
61 } |