--- a/exemples/svghmi_jumps/svghmi_0@svghmi/svghmi.svg Thu Dec 12 11:33:08 2024 +0100
+++ b/exemples/svghmi_jumps/svghmi_0@svghmi/svghmi.svg Thu Dec 12 11:36:24 2024 +0100
@@ -2,21 +2,21 @@
<!-- Created with Inkscape (http://www.inkscape.org/) -->
- xmlns:dc="http://purl.org/dc/elements/1.1/"
- xmlns:cc="http://creativecommons.org/ns#"
- xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
- xmlns:svg="http://www.w3.org/2000/svg"
- xmlns="http://www.w3.org/2000/svg"
- xmlns:xlink="http://www.w3.org/1999/xlink"
- xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
- xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
- inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
+ inkscape:version="1.2.2 (b0a8486541, 2022-12-01)" sodipodi:docname="svghmi.svg"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns="http://www.w3.org/2000/svg" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:dc="http://purl.org/dc/elements/1.1/"> @@ -40,24 +40,27 @@
- inkscape:window-width="1850"
- inkscape:window-height="1036"
+ inkscape:window-width="1854" + inkscape:window-height="1011" - inkscape:zoom="0.46354778"
- inkscape:cx="-544.27948"
- inkscape:cy="655.56978"
+ inkscape:zoom="1.04375" + inkscape:cx="626.58683" + inkscape:cy="1233.5329"
inkscape:window-maximized="1"
- inkscape:current-layer="g2496"
+ inkscape:current-layer="g845" inkscape:guide-bbox="true"
- fit-margin-bottom="0" />
+ inkscape:showpageshadow="2" + inkscape:pagecheckerboard="0" + inkscape:deskcolor="#d1d1d1" /> sodipodi:insensitive="true"
@@ -133,14 +136,25 @@
transform="translate(0,660.00004)">
- style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#ffa32a;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:3.77952766;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+ style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffa32a;fill-opacity:1;fill-rule:nonzero;stroke:#ffffff;stroke-width:5.07063;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" + inkscape:label="active" /> + style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffa32a;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.84883;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" + inkscape:label="inactive" /> style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:40px;line-height:125%;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
--- a/svghmi/analyse_widget.xslt Thu Dec 12 11:33:08 2024 +0100
+++ b/svghmi/analyse_widget.xslt Thu Dec 12 11:36:24 2024 +0100
@@ -288,6 +288,12 @@
<xsl:text>Back widget brings focus back to previous page in history when clicked.
+ <xsl:text>"active" + "inactive" labeled elements can be provided and reflect whether + <xsl:text>widget is pressed or not. <xsl:text>Jump to previous page</xsl:text>
@@ -545,6 +551,15 @@
<path name="root" accepts="HMI_NODE">
<xsl:text> where to find HMI_NODEs whose HMI_CLASS is class_name</xsl:text>
+ <path name="position" accepts="HMI_INT"> + <xsl:text>position of HMI_NODE mapped to first item, among similar siblings</xsl:text> + <path name="range" accepts="HMI_INT" count="optional"> + <xsl:text> count of HMI_NODE siblings</xsl:text> + <path name="size" accepts="HMI_INT" count="optional"> + <xsl:text> count of visible items</xsl:text> <xsl:template match="widget[@type='Image']" mode="widget_desc">
@@ -627,7 +642,7 @@
- <xsl:text>If first path is pointint to HMI_NODE variable is used as new reference
+ <xsl:text>If first path is pointing to HMI_NODE variable is used as new reference <xsl:text>when jumping to a relative page.
--- a/svghmi/gen_index_xhtml.xslt Thu Dec 12 11:33:08 2024 +0100
+++ b/svghmi/gen_index_xhtml.xslt Thu Dec 12 11:36:24 2024 +0100
@@ -2740,6 +2740,12 @@
<xsl:text>Back widget brings focus back to previous page in history when clicked.
+ <xsl:text>"active" + "inactive" labeled elements can be provided and reflect whether + <xsl:text>widget is pressed or not. <xsl:text>Jump to previous page</xsl:text>
@@ -2750,37 +2756,96 @@
<xsl:text>BackWidget</xsl:text>
<xsl:text> extends Widget{
- <xsl:text> on_click(evt) {
- <xsl:text> if(jump_history.length > 1){
- <xsl:text> let page_name, index;
+ <xsl:text> onmouseup(evt) { + <xsl:text> svg_root.removeEventListener("pointerup", this.bound_onmouseup, true); + <xsl:text> this.activity_state = false; + <xsl:text> this.request_animate(); + <xsl:text> let page_name, index; + <xsl:text> if (jump_history.length > 1) { <xsl:text> jump_history.pop(); // forget current page
- <xsl:text> if(jump_history.length == 0) return;
+ <xsl:text> if (jump_history.length == 0) return; <xsl:text> [page_name, index] = jump_history[jump_history.length-1];
- <xsl:text> } while(page_name == "ScreenSaver") // never go back to ScreenSaver
- <xsl:text> switch_page(page_name, index);
+ <xsl:text> } while (page_name == "ScreenSaver") // never go back to ScreenSaver + <xsl:text> fading_page_switch(page_name, index); + <xsl:text> onmousedown(){ + <xsl:text> svg_root.addEventListener("pointerup", this.bound_onmouseup, true); + <xsl:text> this.activity_state = true; + <xsl:text> this.request_animate(); - <xsl:text> this.element.onclick = this.on_click.bind(this);
+ <xsl:text> this.bound_onmouseup = this.onmouseup.bind(this); + <xsl:text> this.activity_state = false; + <xsl:text> this.element.addEventListener("pointerdown", this.onmousedown.bind(this)); + <xsl:template match="widget[@type='Back']" mode="widget_defs"> + <xsl:param name="hmi_element"/> + <xsl:variable name="disability"> + <xsl:call-template name="defs_by_labels"> + <xsl:with-param name="hmi_element" select="$hmi_element"/> + <xsl:with-param name="labels"> + <xsl:text>/disabled</xsl:text> + <xsl:with-param name="mandatory" select="'no'"/> + <xsl:value-of select="$disability"/> + <xsl:variable name="has_disability" select="string-length($disability)>0"/> + <xsl:text> activable_sub:{ + <xsl:variable name="activity"> + <xsl:call-template name="defs_by_labels"> + <xsl:with-param name="hmi_element" select="$hmi_element"/> + <xsl:with-param name="labels"> + <xsl:text>/active /inactive</xsl:text> + <xsl:with-param name="mandatory"> + <xsl:text>warn</xsl:text> + <xsl:value-of select="$activity"/> + <xsl:variable name="has_activity" select="string-length($activity)>0"/> + <xsl:text> has_activity: </xsl:text> + <xsl:value-of select="$has_activity"/> <xsl:template match="widget[@type='Button']" mode="widget_desc">
<xsl:value-of select="@type"/>
@@ -4454,6 +4519,15 @@
<path name="root" accepts="HMI_NODE">
<xsl:text> where to find HMI_NODEs whose HMI_CLASS is class_name</xsl:text>
+ <path name="position" accepts="HMI_INT"> + <xsl:text>position of HMI_NODE mapped to first item, among similar siblings</xsl:text> + <path name="range" accepts="HMI_INT" count="optional"> + <xsl:text> count of HMI_NODE siblings</xsl:text> + <path name="size" accepts="HMI_INT" count="optional"> + <xsl:text> count of visible items</xsl:text> <xsl:template match="widget[@type='ForEach']" mode="widget_defs">
<xsl:param name="hmi_element"/>
@@ -5606,7 +5680,7 @@
- <xsl:text>If first path is pointint to HMI_NODE variable is used as new reference
+ <xsl:text>If first path is pointing to HMI_NODE variable is used as new reference <xsl:text>when jumping to a relative page.
@@ -5694,7 +5768,7 @@
<xsl:text> target_page_is_current_page = false;
- <xsl:text> button_beeing_pressed = false;
+ <xsl:text> button_being_pressed = false; @@ -5710,9 +5784,9 @@
<xsl:text> this.indexes[0] + this.offset : undefined;
- <xsl:text> this.button_beeing_pressed = false;
- <xsl:text> this.activity_state = this.target_page_is_current_page || this.button_beeing_pressed;
+ <xsl:text> this.button_being_pressed = false; + <xsl:text> this.activity_state = this.target_page_is_current_page || this.button_being_pressed; <xsl:text> fading_page_switch(this.args[0], index);
@@ -5730,7 +5804,7 @@
<xsl:text> svg_root.addEventListener("pointerup", this.bound_onmouseup, true);
- <xsl:text> this.button_beeing_pressed = true;
+ <xsl:text> this.button_being_pressed = true; <xsl:text> this.activity_state = true;
@@ -5754,7 +5828,7 @@
<xsl:text> this.target_page_is_current_page = ((ref_name == undefined || ref_name == page_name) && index == ref_index);
- <xsl:text> this.activity_state = this.target_page_is_current_page || this.button_beeing_pressed;
+ <xsl:text> this.activity_state = this.target_page_is_current_page || this.button_being_pressed; <xsl:text> // Since called from animate, update activity directly
--- a/svghmi/widget_back.ysl2 Thu Dec 12 11:33:08 2024 +0100
+++ b/svghmi/widget_back.ysl2 Thu Dec 12 11:36:24 2024 +0100
@@ -4,25 +4,45 @@
Back widget brings focus back to previous page in history when clicked.
+ "active" + "inactive" labeled elements can be provided and reflect whether + widget is pressed or not. shortdesc > Jump to previous page
- if(jump_history.length > 1){
- jump_history.pop(); // forget current page
- if(jump_history.length == 0) return;
- [page_name, index] = jump_history[jump_history.length-1];
- } while(page_name == "ScreenSaver") // never go back to ScreenSaver
- switch_page(page_name, index);
+ svg_root.removeEventListener("pointerup", this.bound_onmouseup, true); + this.activity_state = false; + this.request_animate(); + if (jump_history.length > 1) { + jump_history.pop(); // forget current page + if (jump_history.length == 0) return; + [page_name, index] = jump_history[jump_history.length-1]; + } while (page_name == "ScreenSaver") // never go back to ScreenSaver + fading_page_switch(page_name, index);
- this.element.onclick = this.on_click.bind(this);
+ svg_root.addEventListener("pointerup", this.bound_onmouseup, true); + this.activity_state = true; + this.request_animate(); + this.bound_onmouseup = this.onmouseup.bind(this); + this.activity_state = false; + this.element.addEventListener("pointerdown", this.onmousedown.bind(this)); --- a/svghmi/widget_jump.ysl2 Thu Dec 12 11:33:08 2024 +0100
+++ b/svghmi/widget_jump.ysl2 Thu Dec 12 11:36:24 2024 +0100
@@ -6,7 +6,7 @@
Jump widget brings focus to a different page. Mandatory first argument
- If first path is pointint to HMI_NODE variable is used as new reference
+ If first path is pointing to HMI_NODE variable is used as new reference when jumping to a relative page.
Additional arguments are unordered options:
@@ -53,7 +53,7 @@
target_page_is_current_page = false;
- button_beeing_pressed = false;
+ button_being_pressed = false; svg_root.removeEventListener("pointerup", this.bound_onmouseup, true);
@@ -61,8 +61,8 @@
(this.is_relative && this.indexes.length > 0) ?
this.indexes[0] + this.offset : undefined;
- this.button_beeing_pressed = false;
- this.activity_state = this.target_page_is_current_page || this.button_beeing_pressed;
+ this.button_being_pressed = false; + this.activity_state = this.target_page_is_current_page || this.button_being_pressed; fading_page_switch(this.args[0], index);
@@ -71,7 +71,7 @@
svg_root.addEventListener("pointerup", this.bound_onmouseup, true);
- this.button_beeing_pressed = true;
+ this.button_being_pressed = true; this.activity_state = true;
@@ -83,7 +83,7 @@
const ref_index = this.indexes.length > 0 ? this.indexes[0] + this.offset : undefined;
const ref_name = this.args[0];
this.target_page_is_current_page = ((ref_name == undefined || ref_name == page_name) && index == ref_index);
- this.activity_state = this.target_page_is_current_page || this.button_beeing_pressed;
+ this.activity_state = this.target_page_is_current_page || this.button_being_pressed; // Since called from animate, update activity directly
if(this.enable_displayed_state && this.has_activity) {