# HG changeset patch
# User Edouard Tisserant <edouard.tisserant@gmail.com>
# Date 1583141381 -3600
# Node ID dffade5c83d38854c02c4e00721fdf9de58f0d4a
# Parent 7b1db17287b689e4a67a88d83056f282d9d67f44
SVGHMI: fix some JS + add generation of detachable elements, to be continued
diff -r 7b1db17287b6 -r dffade5c83d3 svghmi/gen_index_xhtml.xslt
--- a/svghmi/gen_index_xhtml.xslt Fri Feb 28 22:54:07 2020 +0100
+++ b/svghmi/gen_index_xhtml.xslt Mon Mar 02 10:29:41 2020 +0100
@@ -324,6 +324,10 @@
</xsl:text>
<xsl:text>
</xsl:text>
+ <xsl:text>id = idstr => document.getElementById(idstr);
+</xsl:text>
+ <xsl:text>
+</xsl:text>
<xsl:text>var hmi_hash = [</xsl:text>
<xsl:value-of select="$hmitree/@hash"/>
<xsl:text>];
@@ -380,7 +384,7 @@
</xsl:for-each>
<xsl:text> ],
</xsl:text>
- <xsl:text> element: document.getElementById("</xsl:text>
+ <xsl:text> element: id("</xsl:text>
<xsl:value-of select="@id"/>
<xsl:text>"),
</xsl:text>
@@ -424,6 +428,26 @@
</xsl:text>
<xsl:text>
</xsl:text>
+ <xsl:text>var detachable_elements = {
+</xsl:text>
+ <xsl:for-each select="$detachable_elements">
+ <xsl:text> "</xsl:text>
+ <xsl:value-of select="@id"/>
+ <xsl:text>" : {element: id("</xsl:text>
+ <xsl:value-of select="@id"/>
+ <xsl:text>"), parent:id("</xsl:text>
+ <xsl:value-of select="../@id"/>
+ <xsl:text>")}</xsl:text>
+ <xsl:if test="position()!=last()">
+ <xsl:text>,</xsl:text>
+ </xsl:if>
+ <xsl:text>
+</xsl:text>
+ </xsl:for-each>
+ <xsl:text>}
+</xsl:text>
+ <xsl:text>
+</xsl:text>
<xsl:text>var page_desc = {
</xsl:text>
<xsl:for-each select="$hmi_pages">
@@ -432,7 +456,7 @@
<xsl:variable name="p" select="$geometry[@Id = $page/@id]"/>
<xsl:variable name="page_all_elements" select="func:all_related_elements($page)"/>
<xsl:variable name="all_page_ids" select="$page_all_elements[@id = $hmi_elements/@id and @id != $page/@id]/@id"/>
- <xsl:variable name="shorter_list" select="func:sumarized_elements($page_all_elements)"/>
+ <xsl:variable name="required_detachables" select="func:sumarized_elements($page_all_elements)"/>
<xsl:text> "</xsl:text>
<xsl:value-of select="$desc/arg[1]/@value"/>
<xsl:text>": {
@@ -465,12 +489,16 @@
</xsl:for-each>
<xsl:text> ],
</xsl:text>
- <xsl:text> required_elements: [
-</xsl:text>
- <xsl:for-each select="$shorter_list">
- <xsl:text> "</xsl:text>
+ <xsl:text> required_detachables: [
+</xsl:text>
+ <xsl:for-each select="$required_detachables">
+ <xsl:text> detachable_elements["</xsl:text>
<xsl:value-of select="@id"/>
- <xsl:text>",
+ <xsl:text>"]</xsl:text>
+ <xsl:if test="position()!=last()">
+ <xsl:text>,</xsl:text>
+ </xsl:if>
+ <xsl:text>
</xsl:text>
</xsl:for-each>
<xsl:text> ]
@@ -490,7 +518,7 @@
<xsl:value-of select="$default_page"/>
<xsl:text>";
</xsl:text>
- <xsl:text>var svg_root = document.getElementById("</xsl:text>
+ <xsl:text>var svg_root = id("</xsl:text>
<xsl:value-of select="$svg_root_id"/>
<xsl:text>");
</xsl:text>
@@ -932,27 +960,11 @@
</xsl:text>
<xsl:text>
</xsl:text>
- <xsl:text>// function prepare_svg() {
-</xsl:text>
- <xsl:text>// /* set everybody hidden initially for better performance */
-</xsl:text>
- <xsl:text>// for(let [elt,elt_parent] in detachable_elements){
-</xsl:text>
- <xsl:text>// elt_parent.removeChild(elt)
-</xsl:text>
- <xsl:text>// }
-</xsl:text>
- <xsl:text>// };
-</xsl:text>
- <xsl:text>
-</xsl:text>
<xsl:text>function prepare_svg() {
</xsl:text>
<xsl:text> /* set everybody hidden initially for better performance */
</xsl:text>
- <xsl:text> for(let widget_id in hmi_widgets){
-</xsl:text>
- <xsl:text> let widget = hmi_widgets[widget_id];
+ <xsl:text> for(let widget in hmi_widgets){
</xsl:text>
<xsl:text> if(widget.element != undefined)
</xsl:text>
@@ -960,6 +972,16 @@
</xsl:text>
<xsl:text> }
</xsl:text>
+ <xsl:text> /*for(let name in page_desc){
+</xsl:text>
+ <xsl:text> if(name != new_desc){
+</xsl:text>
+ <xsl:text> page_desc[name].widget.element.style.display = "none";
+</xsl:text>
+ <xsl:text> }
+</xsl:text>
+ <xsl:text> }*/
+</xsl:text>
<xsl:text>};
</xsl:text>
<xsl:text>
@@ -1154,7 +1176,7 @@
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="$name"/>
- <xsl:text>_elt: document.getElementById("</xsl:text>
+ <xsl:text>_elt: id("</xsl:text>
<xsl:value-of select="$elt_id"/>
<xsl:text>"),
</xsl:text>
@@ -1260,7 +1282,7 @@
<xsl:text>init: function() {
</xsl:text>
<xsl:if test="$edit_elt_id">
- <xsl:text> document.getElementById("</xsl:text>
+ <xsl:text> id("</xsl:text>
<xsl:value-of select="$edit_elt_id"/>
<xsl:text>").addEventListener(
</xsl:text>
@@ -1270,7 +1292,7 @@
</xsl:text>
</xsl:if>
<xsl:for-each select="$hmi_element/*[regexp:test(@inkscape:label,'^[=+\-].+')]">
- <xsl:text> document.getElementById("</xsl:text>
+ <xsl:text> id("</xsl:text>
<xsl:value-of select="@id"/>
<xsl:text>").addEventListener(
</xsl:text>
@@ -1326,7 +1348,7 @@
<xsl:variable name="literal" select="regexp:match(@inkscape:label,$regex)[2]"/>
<xsl:text> {
</xsl:text>
- <xsl:text> elt:document.getElementById("</xsl:text>
+ <xsl:text> elt:id("</xsl:text>
<xsl:value-of select="@id"/>
<xsl:text>"),
</xsl:text>
diff -r 7b1db17287b6 -r dffade5c83d3 svghmi/gen_index_xhtml.ysl2
--- a/svghmi/gen_index_xhtml.ysl2 Fri Feb 28 22:54:07 2020 +0100
+++ b/svghmi/gen_index_xhtml.ysl2 Mon Mar 02 10:29:41 2020 +0100
@@ -459,6 +459,8 @@
{
| //(function(){
|
+ | id = idstr => document.getElementById(idstr);
+ |
| var hmi_hash = [«$hmitree/@hash»];
/* TODO re-enable
@@ -502,7 +504,7 @@
}
}
| ],
- | element: document.getElementById("«@id»"),
+ | element: id("«@id»"),
apply "$widget", mode="widget_defs" with "hmi_element",".";
| }`if "position()!=last()" > ,`
}
@@ -519,6 +521,13 @@
| ]
|
+ | var detachable_elements = {
+ foreach "$detachable_elements"{
+ | "«@id»" : {element: id("«@id»"), parent:id("«../@id»")}`if "position()!=last()" > ,`
+ }
+ | }
+
+ |
| var page_desc = {
foreach "$hmi_pages" {
@@ -530,7 +539,7 @@
const "all_page_ids","$page_all_elements[@id = $hmi_elements/@id and @id != $page/@id]/@id";
- const "shorter_list", "func:sumarized_elements($page_all_elements)";
+ const "required_detachables", "func:sumarized_elements($page_all_elements)";
| "«$desc/arg[1]/@value»": {
| widget: hmi_widgets["«@id»"],
@@ -540,9 +549,9 @@
| hmi_widgets["«.»"]`if "position()!=last()" > ,`
}
| ],
- | required_elements: [
- foreach "$shorter_list" {
- | "«@id»",
+ | required_detachables: [
+ foreach "$required_detachables" {
+ | detachable_elements["«@id»"]`if "position()!=last()" > ,`
}
| ]
| }`if "position()!=last()" > ,`
@@ -551,7 +560,7 @@
|
| var default_page = "«$default_page»";
- | var svg_root = document.getElementById("«$svg_root_id»");
+ | var svg_root = id("«$svg_root_id»");
include text svghmi.js
| //})();
}
@@ -620,7 +629,7 @@
// otherwise produce nothing
}
otherwise {
- | «$name»_elt: document.getElementById("«$elt_id»"),
+ | «$name»_elt: id("«$elt_id»"),
}
}
}
@@ -693,12 +702,12 @@
const "edit_elt_id","$hmi_element/*[@inkscape:label='edit'][1]/@id";
| init: function() {
if "$edit_elt_id" {
- | document.getElementById("«$edit_elt_id»").addEventListener(
+ | id("«$edit_elt_id»").addEventListener(
| "click",
| evt => alert('XXX TODO : Edit value'));
}
foreach "$hmi_element/*[regexp:test(@inkscape:label,'^[=+\-].+')]" {
- | document.getElementById("«@id»").addEventListener(
+ | id("«@id»").addEventListener(
| "click",
| evt => {let new_val = change_hmi_value(this.indexes[0], "«func:escape_quotes(@inkscape:label)»");
| this.value_elt.textContent = String(new_val);});
@@ -731,7 +740,7 @@
foreach "$hmi_element/*[regexp:test(@inkscape:label,$regex)]" {
const "literal", "regexp:match(@inkscape:label,$regex)[2]";
| {
- | elt:document.getElementById("«@id»"),
+ | elt:id("«@id»"),
| style:"«@style»",
| value:«$literal»
| }`if "position()!=last()" > ,`