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