# HG changeset patch
# User Edouard Tisserant <edouard.tisserant@gmail.com>
# Date 1586894932 -7200
# Node ID ed3f712a8eeff09ef3bc31f7402e56814d1bcc9e
# Parent  abb995a30088b008d56203761bfe25c1c8cf4d06
SVGHMI: When clicking outside of opened HMI:DropDown box, close it.

diff -r abb995a30088 -r ed3f712a8eef svghmi/gen_index_xhtml.xslt
--- a/svghmi/gen_index_xhtml.xslt	Tue Apr 14 19:22:18 2020 +0200
+++ b/svghmi/gen_index_xhtml.xslt	Tue Apr 14 22:08:52 2020 +0200
@@ -867,7 +867,7 @@
 </xsl:text>
     <xsl:text>        this.opened = false;
 </xsl:text>
-    <xsl:text>        this.bound_inhibit_click_elsewhere = this.inhibit_click_elsewhere.bind(this);
+    <xsl:text>        this.bound_close_on_click_elsewhere = this.close_on_click_elsewhere.bind(this);
 </xsl:text>
     <xsl:text>    },
 </xsl:text>
@@ -977,21 +977,27 @@
 </xsl:text>
     <xsl:text>    },
 </xsl:text>
-    <xsl:text>    inhibit_click_elsewhere: function(e) {
+    <xsl:text>    close_on_click_elsewhere: function(e) {
 </xsl:text>
     <xsl:text>        console.log("inhibit", e);
 </xsl:text>
     <xsl:text>        console.log(e.target.parentNode, this.text_elt);
 </xsl:text>
-    <xsl:text>        if(e.target.parentNode !== this.text_elt)
+    <xsl:text>        if(e.target.parentNode !== this.text_elt){
 </xsl:text>
     <xsl:text>            e.stopPropagation();
 </xsl:text>
+    <xsl:text>            if(e.target !== this.box_elt)
+</xsl:text>
+    <xsl:text>                this.close();
+</xsl:text>
+    <xsl:text>        }
+</xsl:text>
     <xsl:text>    },
 </xsl:text>
     <xsl:text>    close: function(){
 </xsl:text>
-    <xsl:text>        document.removeEventListener("click", this.bound_inhibit_click_elsewhere, true);
+    <xsl:text>        document.removeEventListener("click", this.bound_close_on_click_elsewhere, true);
 </xsl:text>
     <xsl:text>        this.reset_text();
 </xsl:text>
@@ -1137,7 +1143,7 @@
 </xsl:text>
     <xsl:text>        // disable interaction with background
 </xsl:text>
-    <xsl:text>        document.addEventListener("click", this.bound_inhibit_click_elsewhere, true);
+    <xsl:text>        document.addEventListener("click", this.bound_close_on_click_elsewhere, true);
 </xsl:text>
     <xsl:text>        this.opened = true;
 </xsl:text>
diff -r abb995a30088 -r ed3f712a8eef svghmi/widget_dropdown.ysl2
--- a/svghmi/widget_dropdown.ysl2	Tue Apr 14 19:22:18 2020 +0200
+++ b/svghmi/widget_dropdown.ysl2	Tue Apr 14 22:08:52 2020 +0200
@@ -22,7 +22,7 @@
         this.menu_offset = 0;
         this.lift = 0;
         this.opened = false;
-        this.bound_inhibit_click_elsewhere = this.inhibit_click_elsewhere.bind(this);
+        this.bound_close_on_click_elsewhere = this.close_on_click_elsewhere.bind(this);
     },
     on_selection_click: function(selection) {
         console.log("selected "+selection);
@@ -77,14 +77,17 @@
         }
         return count;
     },
-    inhibit_click_elsewhere: function(e) {
+    close_on_click_elsewhere: function(e) {
         console.log("inhibit", e);
         console.log(e.target.parentNode, this.text_elt);
-        if(e.target.parentNode !== this.text_elt)
+        if(e.target.parentNode !== this.text_elt){
             e.stopPropagation();
+            if(e.target !== this.box_elt)
+                this.close();
+        }
     },
     close: function(){
-        document.removeEventListener("click", this.bound_inhibit_click_elsewhere, true);
+        document.removeEventListener("click", this.bound_close_on_click_elsewhere, true);
         this.reset_text();
         this.reset_box();
         this.element.appendChild(this.button_elt);
@@ -153,7 +156,7 @@
         this.element.removeChild(this.button_elt);
         this.element.parentNode.appendChild(this.element.parentNode.removeChild(this.element));
         // disable interaction with background
-        document.addEventListener("click", this.bound_inhibit_click_elsewhere, true);
+        document.addEventListener("click", this.bound_close_on_click_elsewhere, true);
         this.opened = true;
     },
     reset_text: function(){