# HG changeset patch # User Edouard Tisserant <edouard.tisserant@gmail.com> # Date 1589401333 -7200 # Node ID 02ea529fd08c9f7b32e6d3eeaa80b099f07d9ef5 # Parent 00825316ed00f30871166e8fc9516dd1099a91d5 SVGHMI: Switch widget now use class declaration diff -r 00825316ed00 -r 02ea529fd08c svghmi/gen_index_xhtml.xslt --- a/svghmi/gen_index_xhtml.xslt Wed May 13 18:50:07 2020 +0200 +++ b/svghmi/gen_index_xhtml.xslt Wed May 13 22:22:13 2020 +0200 @@ -866,6 +866,10 @@ </xsl:text> <xsl:text>class Widget { </xsl:text> + <xsl:text> offset = 0; +</xsl:text> + <xsl:text> frequency = 10; /* FIXME arbitrary default max freq. Obtain from config ? */ +</xsl:text> <xsl:text> constructor(elt_id,args,indexes,members){ </xsl:text> <xsl:text> this.element_id = elt_id; @@ -876,8 +880,6 @@ </xsl:text> <xsl:text> this.indexes = indexes; </xsl:text> - <xsl:text> this.offset = 0; -</xsl:text> <xsl:text> Object.keys(members).forEach(prop => this[prop]=members[prop]); </xsl:text> <xsl:text> } @@ -1115,6 +1117,10 @@ </xsl:text> <xsl:text> init() { </xsl:text> + <xsl:text> // TODO : use attributes to allow interaction through svg:use +</xsl:text> + <xsl:text> // TODO : deal with dragging +</xsl:text> <xsl:text> this.element.addEventListener( </xsl:text> <xsl:text> "mousedown", @@ -2592,34 +2598,34 @@ <xsl:text> }, </xsl:text> </xsl:template> + <xsl:template mode="widget_class" match="widget[@type='Switch']"> + <xsl:text>class SwitchWidget extends Widget{ +</xsl:text> + <xsl:text> frequency = 5; +</xsl:text> + <xsl:text> dispatch(value) { +</xsl:text> + <xsl:text> for(let choice of this.choices){ +</xsl:text> + <xsl:text> if(value != choice.value){ +</xsl:text> + <xsl:text> choice.elt.setAttribute("style", "display:none"); +</xsl:text> + <xsl:text> } else { +</xsl:text> + <xsl:text> choice.elt.setAttribute("style", choice.style); +</xsl:text> + <xsl:text> } +</xsl:text> + <xsl:text> } +</xsl:text> + <xsl:text> } +</xsl:text> + <xsl:text>} +</xsl:text> + </xsl:template> <xsl:template mode="widget_defs" match="widget[@type='Switch']"> <xsl:param name="hmi_element"/> - <xsl:text> frequency: 5, -</xsl:text> - <xsl:text> dispatch: function(value) { -</xsl:text> - <xsl:text> for(let choice of this.choices){ -</xsl:text> - <xsl:text> if(value != choice.value){ -</xsl:text> - <xsl:text> choice.elt.setAttribute("style", "display:none"); -</xsl:text> - <xsl:text> } else { -</xsl:text> - <xsl:text> choice.elt.setAttribute("style", choice.style); -</xsl:text> - <xsl:text> } -</xsl:text> - <xsl:text> } -</xsl:text> - <xsl:text> }, -</xsl:text> - <xsl:text> init: function() { -</xsl:text> - <xsl:text> // Hello Switch -</xsl:text> - <xsl:text> }, -</xsl:text> <xsl:text> choices: [ </xsl:text> <xsl:variable name="regex" select="'^("[^"].*"|\-?[0-9]+|false|true)(#.*)?$'"/> diff -r 00825316ed00 -r 02ea529fd08c svghmi/widget_switch.ysl2 --- a/svghmi/widget_switch.ysl2 Wed May 13 18:50:07 2020 +0200 +++ b/svghmi/widget_switch.ysl2 Wed May 13 22:22:13 2020 +0200 @@ -1,20 +1,23 @@ // widget_switch.ysl2 +template "widget[@type='Switch']", mode="widget_class" + || + class SwitchWidget extends Widget{ + frequency = 5; + dispatch(value) { + for(let choice of this.choices){ + if(value != choice.value){ + choice.elt.setAttribute("style", "display:none"); + } else { + choice.elt.setAttribute("style", choice.style); + } + } + } + } + || + template "widget[@type='Switch']", mode="widget_defs" { param "hmi_element"; - | frequency: 5, - | dispatch: function(value) { - | for(let choice of this.choices){ - | if(value != choice.value){ - | choice.elt.setAttribute("style", "display:none"); - | } else { - | choice.elt.setAttribute("style", choice.style); - | } - | } - | }, - | init: function() { - | // Hello Switch - | }, | choices: [ const "regex",!"'^(\"[^\"].*\"|\-?[0-9]+|false|true)(#.*)?$'"!; foreach "$hmi_element/*[regexp:test(@inkscape:label,$regex)]" { diff -r 00825316ed00 -r 02ea529fd08c tests/svghmi/svghmi_0@svghmi/svghmi.svg --- a/tests/svghmi/svghmi_0@svghmi/svghmi.svg Wed May 13 18:50:07 2020 +0200 +++ b/tests/svghmi/svghmi_0@svghmi/svghmi.svg Wed May 13 22:22:13 2020 +0200 @@ -31,6 +31,20 @@ </metadata> <defs id="defs2"> + <inkscape:perspective + sodipodi:type="inkscape:persp3d" + inkscape:vp_x="30 : 418 : 1" + inkscape:vp_y="0 : 1000 : 0" + inkscape:vp_z="1358 : 3.9999991 : 1" + inkscape:persp3d-origin="670 : 298 : 1" + id="perspective503" /> + <inkscape:perspective + sodipodi:type="inkscape:persp3d" + inkscape:vp_x="0 : 360 : 1" + inkscape:vp_y="0 : 1000 : 0" + inkscape:vp_z="1376 : 388 : 1" + inkscape:persp3d-origin="640 : 240 : 1" + id="perspective445" /> <inkscape:tag id="Set 1" inkscape:label="HMI:AccessList@Admin" @@ -127,9 +141,9 @@ inkscape:current-layer="hmi0" showgrid="false" units="px" - inkscape:zoom="0.70710678" - inkscape:cx="263.37056" - inkscape:cy="-24.461312" + inkscape:zoom="0.5" + inkscape:cx="523.16321" + inkscape:cy="-1.5475559" inkscape:window-width="1920" inkscape:window-height="1348" inkscape:window-x="3815" @@ -2536,4 +2550,110 @@ sodipodi:role="line">up</tspan></text> </g> </g> + <g + id="g5053" + inkscape:label="HMI:Switch@/PUMP0/BOOLOUT"> + <g + sodipodi:type="inkscape:box3d" + id="g473" + style="fill:#ff0000;stroke:#ff00ff" + inkscape:perspectiveID="#perspective445" + inkscape:corner0="-0.22508846 : -0.3474613 : 0 : 1" + inkscape:corner7="-0.30162293 : -0.45734167 : 0.25 : 1" + inkscape:label="true"> + <path + sodipodi:type="inkscape:box3dside" + id="path461" + style="fill:#353564;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="6" + d="M 825.90072,963.24473 V 1105.042 L 960.08286,916.47892 V 809.26931 Z" + points="825.90072,1105.042 960.08286,916.47892 960.08286,809.26931 825.90072,963.24473 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path463" + style="fill:#afafde;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="13" + d="m 825.90072,1105.042 90.50967,81.6485 121.15161,-225.30347 -77.47914,-44.90811 z" + points="916.41039,1186.6905 1037.562,961.38703 960.08286,916.47892 825.90072,1105.042 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path465" + style="fill:#e9e9ff;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="11" + d="m 960.08286,809.26931 77.47914,36.25624 v 115.86148 l -77.47914,-44.90811 z" + points="1037.562,845.52555 1037.562,961.38703 960.08286,916.47892 960.08286,809.26931 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path467" + style="fill:#4d4d9f;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="5" + d="M 825.90072,963.24473 916.41039,1029.3537 1037.562,845.52555 960.08286,809.26931 Z" + points="916.41039,1029.3537 1037.562,845.52555 960.08286,809.26931 825.90072,963.24473 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path469" + style="fill:#d7d7ff;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="14" + d="m 916.41039,1029.3537 v 157.3368 L 1037.562,961.38703 V 845.52555 Z" + points="916.41039,1186.6905 1037.562,961.38703 1037.562,845.52555 916.41039,1029.3537 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path471" + style="fill:#8686bf;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="3" + d="m 825.90072,963.24473 90.50967,66.10897 v 157.3368 l -90.50967,-81.6485 z" + points="916.41039,1029.3537 916.41039,1186.6905 825.90072,1105.042 825.90072,963.24473 " /> + </g> + <g + sodipodi:type="inkscape:box3d" + id="g501" + style="fill:#ff0000;stroke:#ff00ff" + inkscape:perspectiveID="#perspective503" + inkscape:corner0="-0.22508846 : -0.3474613 : 0 : 1" + inkscape:corner7="-0.30162293 : -0.45734167 : 0.25 : 1" + inkscape:label="false"> + <path + sodipodi:type="inkscape:box3dside" + id="path489" + style="fill:#353564;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="6" + d="M 855.90072,905.24473 V 1047.042 L 978.37453,966.29311 V 859.08349 Z" + points="855.90072,1047.042 978.37453,966.29311 978.37453,859.08349 855.90072,905.24473 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path491" + style="fill:#afafde;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="13" + d="m 855.90072,1047.042 90.50967,81.6485 108.49841,-108.7886 -76.53427,-53.60879 z" + points="946.41039,1128.6905 1054.9088,1019.9019 978.37453,966.29311 855.90072,1047.042 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path493" + style="fill:#e9e9ff;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="11" + d="m 978.37453,859.08349 76.53427,44.9569 v 115.86151 l -76.53427,-53.60879 z" + points="1054.9088,904.04039 1054.9088,1019.9019 978.37453,966.29311 978.37453,859.08349 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path495" + style="fill:#4d389f;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="5" + d="m 855.90072,905.24473 90.50967,66.109 108.49841,-67.31334 -76.53427,-44.9569 z" + points="946.41039,971.35373 1054.9088,904.04039 978.37453,859.08349 855.90072,905.24473 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path497" + style="fill:#d78bff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="14" + d="M 946.41039,971.35373 V 1128.6905 L 1054.9088,1019.9019 V 904.04039 Z" + points="946.41039,1128.6905 1054.9088,1019.9019 1054.9088,904.04039 946.41039,971.35373 " /> + <path + sodipodi:type="inkscape:box3dside" + id="path499" + style="fill:#8667bf;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-linejoin:round" + inkscape:box3dsidetype="3" + d="m 855.90072,905.24473 90.50967,66.109 v 157.33677 l -90.50967,-81.6485 z" + points="946.41039,971.35373 946.41039,1128.6905 855.90072,1047.042 855.90072,905.24473 " /> + </g> + </g> </svg>