beremiz: comparison svghmi/gen_index

equal deleted inserted replaced

-:7fa21b3b5f9f
+:dc78ffa5253d
 include yslt_noindent.yml2
 // overrides yslt's output function to set CDATA
 decl output(method, cdata-section-elements="xhtml:script");
+in xsl decl labels(*ptr, name="defs_by_labels") alias call-template {
+with "hmi_element", "$hmi_element";
+with "labels"{test *ptr};
+};
 istylesheet
 /* From Inkscape */
 xmlns:dc="http://purl.org/dc/elements/1.1/"
 xmlns:cc="http://creativecommons.org/ns#"
 * <bbox x="0" y="0" w="42" h="42">
 */
 const "geometry", "ns:GetSVGGeometry()";
 const "hmitree", "ns:GetHMITree()";
+const "svg_root_id", "/svg:svg/@id";
 const "hmi_elements", "//svg:*[starts-with(@inkscape:label, 'HMI:')]";
 const "hmi_geometry", "$geometry[@Id = $hmi_elements/@id]";
 const "hmi_pages", "$hmi_elements[func:parselabel(@inkscape:label)/widget/@type = 'Page']";
 /* Identity template :
 *  - copy every attributes
 *  - copy every sub-elements
 */
-template "@* | node()", mode="identity_svg" {
+template "@* | node()", mode="inline_svg" {
 /* use real xsl:copy instead copy-of alias from yslt.yml2 */
-xsl:copy apply "@* | node()", mode="identity_svg";
+xsl:copy apply "@* | node()", mode="inline_svg";
+}
+/* replaces inkscape's height and width hints. forces fit */
+template "svg:svg/@width", mode="inline_svg";
+template "svg:svg/@height", mode="inline_svg";
+template "svg:svg", mode="inline_svg" xsl:copy {
+attrib "preserveAspectRatio" > none
+attrib "height" > 100vh
+attrib "width" > 100vw
+apply "@* | node()", mode="inline_svg";
 }
 /*const "mark" > =HMI=\n*/
 /* copy root node and add geometry as comment for a test */
 template "/" {
 comment > Made with SVGHMI. https://beremiz.org
+/* DEBUG DATA
+comment {
+apply "$hmi_geometry", mode="testgeo";
+}
+comment {
+apply "$hmitree", mode="testtree";
+}
+comment {
+apply "$indexed_hmitree", mode="testtree";
+}
+*/
 html xmlns="http://www.w3.org/1999/xhtml" {
 head;
-body style="margin:0;" {
+body style="margin:0;overflow:hidden;" {
-xsl:copy {
+apply "svg:svg", mode="inline_svg";
-comment {
-apply "$hmi_geometry", mode="testgeo";
-}
-comment {
-apply "$hmitree", mode="testtree";
-}
-comment {
-apply "$indexed_hmitree", mode="testtree";
-}
-apply "@* | node()", mode="identity_svg";
-}
 script{
 call "scripts";
 }
 }
 }
 @x >= $p/@x and @y >= $p/@y and
 @x+@w <= $p/@x+$p/@w and @y+@h <= $p/@y+$p/@h]/@Id""";
 const "page_elements", "$hmi_elements[@id = $page_ids]";
 |     "«$desc/arg[1]/@value»": {
 |         id: "«@id»",
+|         bbox: [«$p/@x», «$p/@y», «$p/@w», «$p/@h»],
 |         widgets: [
 foreach "$page_ids" {
 |             hmi_widgets.«.»`if "position()!=last()" > ,`
 }
 |         ]
 }
 | }
 |
 | var default_page = "«$default_page»";
+| var svg_root = document.getElementById("«$svg_root_id»");
 include text svghmi.js
 | //})();
 }
 /*
 apply "*", mode="testtree" {
 with "indent" value "concat($indent,'>')"
 };
 }
+function "defs_by_labels" {
+param "labels","''";
+param "mandatory","'yes'";
+param "hmi_element";
+foreach "str:split($labels)" {
+const "name",".";
+const "elt_id","$hmi_element//*[@inkscape:label=$name][1]/@id";
+if "$mandatory='yes' and not($elt_id)" error > Meter widget must have a «$name» element
+| «$name»_elt: document.getElementById("«$elt_id»"),
+}
+}
 template "widget[@type='Display']", mode="widget_defs" {
 param "hmi_element";
 | frequency: 5,
 | dispatch: function(value) {
 choose {
 }
 template "widget[@type='Meter']", mode="widget_defs" {
 param "hmi_element";
 | frequency: 10,
-foreach "str:split('value min max needle range')" {
+labels("value min max needle range");
-const "name",".";
-const "elt_id","$hmi_element//*[@inkscape:label=$name][1]/@id";
-if "not($elt_id)" error > Meter widget must have a «$name» element
-| «$name»_elt: document.getElementById("«$elt_id»"),
-}
 | dispatch: function(value) {
 |     this.value_elt.textContent = String(value);
 |     let [min,max,totallength] = this.range;
 |     let length = Math.max(0,Math.min(totallength,(Number(value)-min)*totallength/(max-min)));
 |     let tip = this.range_elt.getPointAtLength(length);
 }
 template "widget[@type='Input']", mode="widget_defs" {
 param "hmi_element";
 | frequency: 5,
-const "value_elt_id","$hmi_element//*[self::svg:text][@inkscape:label='value'][1]/@id";
+labels("value");
-if "not($value_elt_id)" error > Input widget must have a text element
-| value_elt: document.getElementById("«$value_elt_id»"),
 | dispatch: function(value) {
 |     this.value_elt.textContent = String(value);
 | },
 const "edit_elt_id","$hmi_element/*[@inkscape:label='edit'][1]/@id";
 | init: function() {
 }
 template "widget[@type='Toggle']", mode="widget_defs" {
 |     frequency: 5,
 }
 template "widget[@type='Change']", mode="widget_defs" {
-// HMI:Change:-10@/PUMP/VALUE
-// HMI:Change:+1@/PUMP/VALUE
-// HMI:Change:=42@/PUMP/VALUE
 |     frequency: 5,
 }
-//    |     frequency: 10`apply ".", mode="refresh_frequency"`,
+template "widget[@type='Jump']", mode="widget_defs" {
-// template "widget", mode="refresh_frequency" > 10
+| init: function() {
-/*
+|     this.element.addEventListener(
-template "widget[@type='Meter']", mode="refresh_frequency" > 10
+|         "click",
-template "widget[@type='Display']", mode="refresh_frequency" > 5
+|         evt => switch_page(this.args[0]));
-template "widget[@type='Input']", mode="refresh_frequency" > 5
+| },
-*/
+}
 }

branch	svghmi
changeset 2808	dc78ffa5253d
parent 2807	7fa21b3b5f9f
child 2810	63b9a37b73c7