diff -r 6dd617cc9c05 -r 6ea4b7e1a9ed svghmi/widget_button.ysl2 --- a/svghmi/widget_button.ysl2 Tue Sep 15 13:57:06 2020 +0200 +++ b/svghmi/widget_button.ysl2 Thu Sep 17 11:30:22 2020 +0200 @@ -5,45 +5,54 @@ class ButtonWidget extends Widget{ frequency = 5; state = 0; + plc_lock = false; active_style = undefined; inactive_style = undefined; - // TODO decouple update of DOM from event (i.e use animate()) - - - // TODO State of the button should distinguish UI feedbak from current PLC value - - on_mouse_down(evt) { - if (this.active_style && this.inactive_style) { - this.active_elt.setAttribute("style", this.active_style); - this.inactive_elt.setAttribute("style", "display:none"); + dispatch(value) { + if(value){ + this.button_release(); } - this.apply_hmi_value(0, 1); - // TODO inhibit all mouse/touch events except mouse up (in other word grab cursor) } - on_mouse_up(evt) { + on_mouse_down(evt) { + if (this.active_style && this.inactive_style) { + this.active_elt.setAttribute("style", this.active_style); + this.inactive_elt.setAttribute("style", "display:none"); + } + this.apply_hmi_value(0, 1); + this.plc_lock = false; + } + + on_mouse_up(evt) { + this.button_release(); + } + + button_release(){ + if(!this.plc_lock){ + this.plc_lock = true; + } + else{ + if (this.active_style && this.inactive_style) { + this.active_elt.setAttribute("style", "display:none"); + this.inactive_elt.setAttribute("style", this.inactive_style); + } + this.apply_hmi_value(0, 0); + } + } + + 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.apply_hmi_value(0, 0); - // TODO release inhibited events - } - init() { - // TODO : move to widget_defs so that we can have generated string literals directly - 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("onmousedown", "hmi_widgets[\""+this.element_id+"\"].on_mouse_down(evt)"); - this.element.setAttribute("onmouseup", "hmi_widgets[\""+this.element_id+"\"].on_mouse_up(evt)"); - } + this.element.setAttribute("onmousedown", "hmi_widgets["+this.element_id+"].on_mouse_down(evt)"); + this.element.setAttribute("onmouseup", "hmi_widgets["+this.element_id+"].on_mouse_up(evt)"); + } } || }