# HG changeset patch
# User Edouard Tisserant <edouard.tisserant@gmail.com>
# Date 1585894427 -7200
# Node ID 99ba78619ffa18364df4f194c7241754e28e6dc4
# Parent  0519fdce9a59f429f4f1380132ca2f6028b425b2# Parent  ac4328e69079e7bc4e3384b5a7116c8453ece395
merge

diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/detachable_pages.ysl2
--- a/svghmi/detachable_pages.ysl2	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/detachable_pages.ysl2	Fri Apr 03 08:13:47 2020 +0200
@@ -7,6 +7,9 @@
 const "hmi_pages_descs", "$parsed_widgets/widget[@type = 'Page']";
 const "hmi_pages", "$hmi_elements[@id = $hmi_pages_descs/@id]";
 
+const "keypads_descs", "$parsed_widgets/widget[@type = 'Keypad']";
+const "keypads", "$hmi_elements[@id = $keypads_descs/@id]";
+
 const "default_page" choose {
     when "count($hmi_pages) > 1" {
         choose {
@@ -58,7 +61,7 @@
 
 const "required_elements",
     """//svg:defs/descendant-or-self::svg:*
-       | func:required_elements($hmi_pages)/ancestor-or-self::svg:*""";
+       | func:required_elements($hmi_pages | $keypads)/ancestor-or-self::svg:*""";
 
 const "discardable_elements", "//svg:*[not(@id = $required_elements/@id)]";
 
@@ -88,7 +91,7 @@
 }
 
 // Avoid nested detachables
-const "_detachable_elements", "func:detachable_elements($hmi_pages)";
+const "_detachable_elements", "func:detachable_elements($hmi_pages | $keypads)";
 const "detachable_elements", "$_detachable_elements[not(ancestor::*/@id = $_detachable_elements/@id)]";
 
 const "forEach_widgets_ids", "$parsed_widgets/widget[@type = 'ForEach']/@id";
diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/gen_index_xhtml.xslt
--- a/svghmi/gen_index_xhtml.xslt	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/gen_index_xhtml.xslt	Fri Apr 03 08:13:47 2020 +0200
@@ -127,6 +127,9 @@
                 <xsl:attribute name="index">
                   <xsl:value-of select="$item/@index"/>
                 </xsl:attribute>
+                <xsl:attribute name="type">
+                  <xsl:value-of select="local-name($item)"/>
+                </xsl:attribute>
               </xsl:if>
             </path>
           </xsl:if>
@@ -259,6 +262,8 @@
   </func:function>
   <xsl:variable name="hmi_pages_descs" select="$parsed_widgets/widget[@type = 'Page']"/>
   <xsl:variable name="hmi_pages" select="$hmi_elements[@id = $hmi_pages_descs/@id]"/>
+  <xsl:variable name="keypads_descs" select="$parsed_widgets/widget[@type = 'Keypad']"/>
+  <xsl:variable name="keypads" select="$hmi_elements[@id = $keypads_descs/@id]"/>
   <xsl:variable name="default_page">
     <xsl:choose>
       <xsl:when test="count($hmi_pages) &gt; 1">
@@ -311,7 +316,7 @@
       </xsl:otherwise>
     </xsl:choose>
   </func:function>
-  <xsl:variable name="required_elements" select="//svg:defs/descendant-or-self::svg:*&#10;       | func:required_elements($hmi_pages)/ancestor-or-self::svg:*"/>
+  <xsl:variable name="required_elements" select="//svg:defs/descendant-or-self::svg:*&#10;       | func:required_elements($hmi_pages | $keypads)/ancestor-or-self::svg:*"/>
   <xsl:variable name="discardable_elements" select="//svg:*[not(@id = $required_elements/@id)]"/>
   <func:function name="func:sumarized_elements">
     <xsl:param name="elements"/>
@@ -331,7 +336,7 @@
       </xsl:otherwise>
     </xsl:choose>
   </func:function>
-  <xsl:variable name="_detachable_elements" select="func:detachable_elements($hmi_pages)"/>
+  <xsl:variable name="_detachable_elements" select="func:detachable_elements($hmi_pages | $keypads)"/>
   <xsl:variable name="detachable_elements" select="$_detachable_elements[not(ancestor::*/@id = $_detachable_elements/@id)]"/>
   <xsl:variable name="forEach_widgets_ids" select="$parsed_widgets/widget[@type = 'ForEach']/@id"/>
   <xsl:variable name="forEach_widgets" select="$hmi_elements[@id = $forEach_widgets_ids]"/>
@@ -726,8 +731,6 @@
     <xsl:param name="hmi_element"/>
     <xsl:text>    on_click: function(evt) {
 </xsl:text>
-    <xsl:text>        console.log("Back !");
-</xsl:text>
     <xsl:text>        if(jump_history.length &gt; 1){
 </xsl:text>
     <xsl:text>           jump_history.pop();
@@ -897,8 +900,12 @@
       <xsl:text>    frequency: 5,
 </xsl:text>
     </xsl:if>
+    <xsl:text>    last_val: undefined,
+</xsl:text>
     <xsl:text>    dispatch: function(value) {
 </xsl:text>
+    <xsl:text>        this.last_val = value;
+</xsl:text>
     <xsl:if test="$have_value">
       <xsl:text>        this.value_elt.textContent = String(value);
 </xsl:text>
@@ -911,33 +918,53 @@
     <xsl:if test="$edit_elt_id">
       <xsl:text>        id("</xsl:text>
       <xsl:value-of select="$edit_elt_id"/>
-      <xsl:text>").addEventListener(
-</xsl:text>
-      <xsl:text>            "click", 
-</xsl:text>
-      <xsl:text>            evt =&gt; alert('XXX TODO : Edit value'));
+      <xsl:text>").setAttribute("onclick", "hmi_widgets['</xsl:text>
+      <xsl:value-of select="$hmi_element/@id"/>
+      <xsl:text>'].on_edit_click()");
 </xsl:text>
     </xsl:if>
     <xsl:for-each select="$hmi_element/*[regexp:test(@inkscape:label,'^[=+\-].+')]">
       <xsl:text>        id("</xsl:text>
       <xsl:value-of select="@id"/>
-      <xsl:text>").addEventListener(
-</xsl:text>
-      <xsl:text>            "click", 
-</xsl:text>
-      <xsl:text>            evt =&gt; {let new_val = change_hmi_value(this.indexes[0], "</xsl:text>
+      <xsl:text>").setAttribute("onclick", "hmi_widgets['</xsl:text>
+      <xsl:value-of select="$hmi_element/@id"/>
+      <xsl:text>'].on_op_click('</xsl:text>
       <xsl:value-of select="func:escape_quotes(@inkscape:label)"/>
-      <xsl:text>");
-</xsl:text>
-      <xsl:if test="$have_value">
-        <xsl:text>                    this.value_elt.textContent = String(new_val);
-</xsl:text>
-      </xsl:if>
-      <xsl:text>                   });
+      <xsl:text>')");
 </xsl:text>
     </xsl:for-each>
     <xsl:text>    },
 </xsl:text>
+    <xsl:text>    on_op_click: function(opstr) {
+</xsl:text>
+    <xsl:text>        let new_val = change_hmi_value(this.indexes[0], opstr);
+</xsl:text>
+    <xsl:if test="$have_value">
+      <xsl:text>        this.value_elt.textContent = String(new_val);
+</xsl:text>
+    </xsl:if>
+    <xsl:text>    },
+</xsl:text>
+    <xsl:text>    on_edit_click: function(opstr) {
+</xsl:text>
+    <xsl:text>        edit_value("</xsl:text>
+    <xsl:value-of select="path/@value"/>
+    <xsl:text>", "</xsl:text>
+    <xsl:value-of select="path/@type"/>
+    <xsl:text>", this.edit_callback, this.last_val);
+</xsl:text>
+    <xsl:text>    },
+</xsl:text>
+    <xsl:text>    edit_callback: function(new_val) {
+</xsl:text>
+    <xsl:text>        apply_hmi_value(this.indexes[0], opstr);
+</xsl:text>
+    <xsl:if test="$have_value">
+      <xsl:text>        this.value_elt.textContent = String(new_val);
+</xsl:text>
+    </xsl:if>
+    <xsl:text>    },
+</xsl:text>
   </xsl:template>
   <xsl:template name="jump_widget_activity">
     <xsl:param name="hmi_element"/>
@@ -987,8 +1014,6 @@
 </xsl:text>
         <xsl:text>        this.disabled = !Number(value);
 </xsl:text>
-        <xsl:text>        console.log("disbled",value);
-</xsl:text>
         <xsl:text>        this.update();
 </xsl:text>
         <xsl:text>    },
@@ -1161,6 +1186,12 @@
       </xsl:if>
     </xsl:if>
   </xsl:template>
+  <xsl:template mode="widget_defs" match="widget[@type='Keypad']">
+    <xsl:text>    init: function() {
+</xsl:text>
+    <xsl:text>    },
+</xsl:text>
+  </xsl:template>
   <xsl:template mode="widget_defs" match="widget[@type='Meter']">
     <xsl:param name="hmi_element"/>
     <xsl:text>    frequency: 10,
@@ -1288,6 +1319,7 @@
     <xsl:comment>
       <xsl:text>Made with SVGHMI. https://beremiz.org</xsl:text>
     </xsl:comment>
+    <xsl:apply-templates mode="debug_as_comment" select="document('')/*/reflect:*"/>
     <html xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/1999/xhtml">
       <head/>
       <body style="margin:0;overflow:hidden;">
@@ -1367,6 +1399,26 @@
     <xsl:apply-templates mode="page_desc" select="$hmi_pages"/>
     <xsl:text>}
 </xsl:text>
+    <xsl:text>var keypads = {
+</xsl:text>
+    <xsl:for-each select="$keypads_descs">
+      <xsl:variable name="keypad_id" select="@id"/>
+      <xsl:for-each select="arg">
+        <xsl:variable name="g" select="$geometry[@Id = $keypad_id]"/>
+        <xsl:text>    "</xsl:text>
+        <xsl:value-of select="@value"/>
+        <xsl:text>":["</xsl:text>
+        <xsl:value-of select="$keypad_id"/>
+        <xsl:text>", </xsl:text>
+        <xsl:value-of select="$g/@x"/>
+        <xsl:text>, </xsl:text>
+        <xsl:value-of select="$g/@y"/>
+        <xsl:text>],
+</xsl:text>
+      </xsl:for-each>
+    </xsl:for-each>
+    <xsl:text>}
+</xsl:text>
     <xsl:text>
 </xsl:text>
     <xsl:text>var default_page = "</xsl:text>
@@ -1859,6 +1911,20 @@
 </xsl:text>
     <xsl:text>
 </xsl:text>
+    <xsl:text>function apply_hmi_value(index, new_val) {
+</xsl:text>
+    <xsl:text>    let old_val = cache[index]
+</xsl:text>
+    <xsl:text>    if(new_val != undefined &amp;&amp; old_val != new_val)
+</xsl:text>
+    <xsl:text>        send_hmi_value(index, new_val);
+</xsl:text>
+    <xsl:text>    return new_val;
+</xsl:text>
+    <xsl:text>}
+</xsl:text>
+    <xsl:text>
+</xsl:text>
     <xsl:text>function change_hmi_value(index, opstr) {
 </xsl:text>
     <xsl:text>    let op = opstr[0];
@@ -2189,8 +2255,6 @@
 </xsl:text>
     <xsl:text>    requestHMIAnimation();
 </xsl:text>
-    <xsl:text>    console.log(opstr, new_item_offset);
-</xsl:text>
     <xsl:text>}
 </xsl:text>
     <xsl:text>
@@ -2301,5 +2365,47 @@
 </xsl:text>
     <xsl:text>};
 </xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>var edit_callback;
+</xsl:text>
+    <xsl:text>function edit_value(path, valuetype, callback, initial) {
+</xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>    let [keypadid, xcoord, ycoord] = keypads[valuetype];
+</xsl:text>
+    <xsl:text>    console.log('XXX TODO : Edit value', path, valuetype, callback, initial, keypadid);
+</xsl:text>
+    <xsl:text>    edit_callback = callback;
+</xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>    let [element, parent] = detachable_elements[keypadid];
+</xsl:text>
+    <xsl:text>    tmpgrp = document.createElement("g");
+</xsl:text>
+    <xsl:text>    tmpgrpattr = document.createAttribute("transform");
+</xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>    let [xdest,ydest] = page_desc[current_visible_page].bbox;
+</xsl:text>
+    <xsl:text>    tmpgrpattr.value = "translate("+String(xdest-xcoord)+","+String(ydest-ycoord)+")";
+</xsl:text>
+    <xsl:text>    tmpgrp.setAttributeNode(tmpgrpattr);
+</xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>    tmpgrp.appendChild(element);
+</xsl:text>
+    <xsl:text>    parent.appendChild(tmpgrp);
+</xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>};
+</xsl:text>
+    <xsl:text>
+</xsl:text>
   </xsl:template>
 </xsl:stylesheet>
diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/gen_index_xhtml.ysl2
--- a/svghmi/gen_index_xhtml.ysl2	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/gen_index_xhtml.ysl2	Fri Apr 03 08:13:47 2020 +0200
@@ -109,6 +109,17 @@
         apply "$hmi_pages", mode="page_desc";
         | }
 
+        | var keypads = {
+        foreach "$keypads_descs"{
+            const "keypad_id","@id";
+            foreach "arg"{
+                const "g", "$geometry[@Id = $keypad_id]"; 
+        |     "«@value»":["«$keypad_id»", «$g/@x», «$g/@y»],
+            }
+        }
+        | }
+
+
         |
         | var default_page = "«$default_page»";
         | var svg_root = id("«/svg:svg/@id»");
diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/hmi_tree.ysl2
--- a/svghmi/hmi_tree.ysl2	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/hmi_tree.ysl2	Fri Apr 03 08:13:47 2020 +0200
@@ -93,8 +93,10 @@
                 attrib "value" > «.»
                 const "path", ".";
                 const "item", "$indexed_hmitree/*[@hmipath = $path]";
-                if "count($item) = 1"
+                if "count($item) = 1" {
                     attrib "index" > «$item/@index»
+                    attrib "type" > «local-name($item)»
+                }
             }
         }
     }
diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/svghmi.js
--- a/svghmi/svghmi.js	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/svghmi.js	Fri Apr 03 08:13:47 2020 +0200
@@ -239,6 +239,13 @@
     cache[index] = value;
 };
 
+function apply_hmi_value(index, new_val) {
+    let old_val = cache[index]
+    if(new_val != undefined && old_val != new_val)
+        send_hmi_value(index, new_val);
+    return new_val;
+}
+
 function change_hmi_value(index, opstr) {
     let op = opstr[0];
     let given_val = opstr.slice(1);
@@ -404,7 +411,6 @@
     need_cache_apply.push(this);
     jumps_need_update = true;
     requestHMIAnimation();
-    console.log(opstr, new_item_offset);
 }
 
 
@@ -460,3 +466,24 @@
     alert("Connection closed. code:"+evt.code+" reason:"+evt.reason+" wasClean:"+evt.wasClean+".");
 
 };
+
+var edit_callback;
+function edit_value(path, valuetype, callback, initial) {
+
+    let [keypadid, xcoord, ycoord] = keypads[valuetype];
+    console.log('XXX TODO : Edit value', path, valuetype, callback, initial, keypadid);
+    edit_callback = callback;
+
+    let [element, parent] = detachable_elements[keypadid];
+    tmpgrp = document.createElement("g");
+    tmpgrpattr = document.createAttribute("transform");
+
+    let [xdest,ydest] = page_desc[current_visible_page].bbox;
+    tmpgrpattr.value = "translate("+String(xdest-xcoord)+","+String(ydest-ycoord)+")";
+    tmpgrp.setAttributeNode(tmpgrpattr);
+
+    tmpgrp.appendChild(element);
+    parent.appendChild(tmpgrp);
+
+};
+
diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/widget_back.ysl2
--- a/svghmi/widget_back.ysl2	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/widget_back.ysl2	Fri Apr 03 08:13:47 2020 +0200
@@ -4,7 +4,6 @@
     param "hmi_element";
 
     |     on_click: function(evt) {
-    |         console.log("Back !");
     |         if(jump_history.length > 1){
     |            jump_history.pop();
     |            let [page_name, index] = jump_history.pop();
diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/widget_input.ysl2
--- a/svghmi/widget_input.ysl2	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/widget_input.ysl2	Fri Apr 03 08:13:47 2020 +0200
@@ -9,9 +9,9 @@
     value "$value_elt";
     if "$have_value"
     |     frequency: 5,
-
+    |     last_val: undefined,
     |     dispatch: function(value) {
-
+    |         this.last_val = value;
     if "$have_value"
     |         this.value_elt.textContent = String(value);
 
@@ -19,19 +19,28 @@
     const "edit_elt_id","$hmi_element/*[@inkscape:label='edit'][1]/@id";
     |     init: function() {
     if "$edit_elt_id" {
-    |         id("«$edit_elt_id»").addEventListener(
-    |             "click", 
-    |             evt => alert('XXX TODO : Edit value'));
+    |         id("«$edit_elt_id»").setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_edit_click()");
     }
     foreach "$hmi_element/*[regexp:test(@inkscape:label,'^[=+\-].+')]" {
-    |         id("«@id»").addEventListener(
-    |             "click", 
-    |             evt => {let new_val = change_hmi_value(this.indexes[0], "«func:escape_quotes(@inkscape:label)»");
-        if "$have_value"{
-    |                     this.value_elt.textContent = String(new_val);
-        }
-    |                    });
-                          /* TODO gray out value until refreshed */
+    |         id("«@id»").setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_op_click('«func:escape_quotes(@inkscape:label)»')");
     }
     |     },
+    |     on_op_click: function(opstr) {
+    |         let new_val = change_hmi_value(this.indexes[0], opstr);
+        if "$have_value"{
+    |         this.value_elt.textContent = String(new_val);
+              /* TODO gray out value until refreshed */
+        }
+    |     },
+    |     on_edit_click: function(opstr) {
+    |         edit_value("«path/@value»", "«path/@type»", this.edit_callback, this.last_val);
+    |     },
+
+    |     edit_callback: function(new_val) {
+    |         apply_hmi_value(this.indexes[0], opstr);
+        if "$have_value"{
+    |         this.value_elt.textContent = String(new_val);
+              /* TODO gray out value until refreshed */
+        }
+    |     },
 }
diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/widget_jump.ysl2
--- a/svghmi/widget_jump.ysl2	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/widget_jump.ysl2	Fri Apr 03 08:13:47 2020 +0200
@@ -25,7 +25,6 @@
     |     frequency: 2,
     |     dispatch: function(value) {
     |         this.disabled = !Number(value);
-    |         console.log("disbled",value);
     |         this.update();
     |     },
     }
diff -r 0519fdce9a59 -r 99ba78619ffa svghmi/widget_keypad.ysl2
--- a/svghmi/widget_keypad.ysl2	Wed Apr 01 18:10:45 2020 +0200
+++ b/svghmi/widget_keypad.ysl2	Fri Apr 03 08:13:47 2020 +0200
@@ -1,4 +1,6 @@
 // widget_keypad.ysl2
 
 template "widget[@type='Keypad']", mode="widget_defs" {
+    |     init: function() {
+    |     },
 }