Mercurial Mercurial > beremiz / changeset
summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | raw | bz2 | zip | gz | help
SVGHMI: Connect HMI:DropDown to value in HMI Tree, in svghmi test as well. svghmi
authorEdouard Tisserant <edouard.tisserant@gmail.com>
Tue, 14 Apr 2020 17:17:35 +0200
branchsvghmi
changeset 2930 41edcb8e0a01
parent 2929 9179cbc6fc49
child 2931 f51c0e2e0bcb
SVGHMI: Connect HMI:DropDown to value in HMI Tree, in svghmi test as well.
svghmi/gen_index_xhtml.xslt file | annotate | diff | comparison | revisions
svghmi/widget_dropdown.ysl2 file | annotate | diff | comparison | revisions
tests/svghmi/plc.xml file | annotate | diff | comparison | revisions
tests/svghmi/svghmi_0@svghmi/svghmi.svg file | annotate | diff | comparison | revisions 
--- a/svghmi/gen_index_xhtml.xslt	Tue Apr 14 17:16:25 2020 +0200
+++ b/svghmi/gen_index_xhtml.xslt	Tue Apr 14 17:17:35 2020 +0200
@@ -859,6 +859,8 @@
 </xsl:text>
     <xsl:text>        this.opened = false;
 </xsl:text>
+    <xsl:text>        this.bound_inhibit_click_elsewhere = this.inhibit_click_elsewhere.bind(this);
+</xsl:text>
     <xsl:text>    },
 </xsl:text>
     <xsl:text>    on_selection_click: function(selection) {
@@ -867,7 +869,11 @@
 </xsl:text>
     <xsl:text>        this.close();
 </xsl:text>
-    <xsl:text>        this.set_selection(selection);
+    <xsl:text>        let orig = this.indexes[0];
+</xsl:text>
+    <xsl:text>        let idx = this.offset ? orig - this.offset : orig;
+</xsl:text>
+    <xsl:text>        apply_hmi_value(idx, selection);
 </xsl:text>
     <xsl:text>    },
 </xsl:text>
@@ -963,6 +969,18 @@
 </xsl:text>
     <xsl:text>    },
 </xsl:text>
+    <xsl:text>    inhibit_click_elsewhere: function(e) {
+</xsl:text>
+    <xsl:text>        console.log("inhibit", e);
+</xsl:text>
+    <xsl:text>        console.log(e.target.parentNode, this.text_elt);
+</xsl:text>
+    <xsl:text>        if(e.target.parentNode !== this.text_elt)
+</xsl:text>
+    <xsl:text>            e.stopPropagation();
+</xsl:text>
+    <xsl:text>    },
+</xsl:text>
     <xsl:text>    close: function(){
 </xsl:text>
     <xsl:text>        this.reset_text();
@@ -971,6 +989,10 @@
 </xsl:text>
     <xsl:text>        this.element.appendChild(this.button_elt);
 </xsl:text>
+    <xsl:text>        this.apply_cache();
+</xsl:text>
+    <xsl:text>        document.removeEventListener("click", this.bound_inhibit_click_elsewhere, true);
+</xsl:text>
     <xsl:text>        this.opened = false;
 </xsl:text>
     <xsl:text>    },
@@ -1103,7 +1125,11 @@
 </xsl:text>
     <xsl:text>        this.element.removeChild(this.button_elt);
 </xsl:text>
-    <xsl:text>        /* TODO disable interaction with background */
+    <xsl:text>        this.element.parentNode.appendChild(this.element.parentNode.removeChild(this.element));
+</xsl:text>
+    <xsl:text>        // disable interaction with background
+</xsl:text>
+    <xsl:text>        document.addEventListener("click", this.bound_inhibit_click_elsewhere, true);
 </xsl:text>
     <xsl:text>        this.opened = true;
 </xsl:text>
@@ -1327,7 +1353,11 @@
 </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>        let orig = this.indexes[0];
+</xsl:text>
+    <xsl:text>        let idx = this.offset ? orig - this.offset : orig;
+</xsl:text>
+    <xsl:text>        let new_val = change_hmi_value(idx, opstr);
 </xsl:text>
     <xsl:text>    },
 </xsl:text>
@@ -1343,7 +1373,11 @@
 </xsl:text>
     <xsl:text>    edit_callback: function(new_val) {
 </xsl:text>
-    <xsl:text>        apply_hmi_value(this.indexes[0], new_val);
+    <xsl:text>        let orig = this.indexes[0];
+</xsl:text>
+    <xsl:text>        let idx = this.offset ? orig - this.offset : orig;
+</xsl:text>
+    <xsl:text>        apply_hmi_value(idx, new_val);
 </xsl:text>
     <xsl:text>    },
 </xsl:text>
--- a/svghmi/widget_dropdown.ysl2	Tue Apr 14 17:16:25 2020 +0200
+++ b/svghmi/widget_dropdown.ysl2	Tue Apr 14 17:17:35 2020 +0200
@@ -25,7 +25,9 @@
     on_selection_click: function(selection) {
         console.log("selected "+selection);
         this.close();
-        this.set_selection(selection);
+        let orig = this.indexes[0];
+        let idx = this.offset ? orig - this.offset : orig;
+        apply_hmi_value(idx, selection);
     },
     on_button_click: function() {
         this.open();
@@ -83,6 +85,7 @@
         this.reset_text();
         this.reset_box();
         this.element.appendChild(this.button_elt);
+        this.apply_cache();
         document.removeEventListener("click", this.bound_inhibit_click_elsewhere, true);
         this.opened = false;
     },
--- a/tests/svghmi/plc.xml	Tue Apr 14 17:16:25 2020 +0200
+++ b/tests/svghmi/plc.xml	Tue Apr 14 17:17:35 2020 +0200
@@ -1,7 +1,7 @@
 <?xml version='1.0' encoding='utf-8'?>
 <project xmlns:ns1="http://www.plcopen.org/xml/tc6_0201" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://www.plcopen.org/xml/tc6_0201">
   <fileHeader companyName="Unknown" productName="Unnamed" productVersion="1" creationDateTime="2019-08-06T14:23:42"/>
-  <contentHeader name="Unnamed" modificationDateTime="2020-01-23T11:01:29">
+  <contentHeader name="Unnamed" modificationDateTime="2020-04-14T15:53:44">
     <coordinateInfo>
       <fbd>
         <scaling x="5" y="5"/>
@@ -25,6 +25,11 @@
                 <derived name="HMI_INT"/>
               </type>
             </variable>
+            <variable name="selection">
+              <type>
+                <derived name="HMI_INT"/>
+              </type>
+            </variable>
             <variable name="Pump0">
               <type>
                 <derived name="PumpControl"/>
--- a/tests/svghmi/svghmi_0@svghmi/svghmi.svg	Tue Apr 14 17:16:25 2020 +0200
+++ b/tests/svghmi/svghmi_0@svghmi/svghmi.svg	Tue Apr 14 17:17:35 2020 +0200
@@ -124,16 +124,16 @@
      inkscape:pageopacity="0"
      inkscape:pageshadow="2"
      inkscape:document-units="px"
-     inkscape:current-layer="g14237"
+     inkscape:current-layer="hmi0"
      showgrid="false"
      units="px"
      inkscape:zoom="0.35355339"
      inkscape:cx="-418.67433"
      inkscape:cy="-1206.7258"
-     inkscape:window-width="2112"
-     inkscape:window-height="1367"
-     inkscape:window-x="2960"
-     inkscape:window-y="54"
+     inkscape:window-width="1920"
+     inkscape:window-height="1080"
+     inkscape:window-x="3815"
+     inkscape:window-y="968"
      inkscape:window-maximized="0"
      showguides="true"
      inkscape:guide-bbox="true" />
@@ -2492,7 +2492,7 @@
   </g>
   <g
      id="g14237"
-     inkscape:label="HMI:DropDown:Primes"
+     inkscape:label="HMI:DropDown:Primes@/SELECTION"
      transform="translate(0,-640)">
     <rect
        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:#53676c;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:5;stroke-linecap:butt;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"
@@ -2613,4 +2613,83 @@
   <g
      id="g14274"
      inkscape:label="HMI:List:HoodNames:ForEach:HOOD:NAME@/" />
+  <g
+     inkscape:label="HMI:Input@/SELECTION"
+     id="g446"
+     transform="matrix(0.5,0,0,0.5,911.19929,420.35813)">
+    <text
+       xml:space="preserve"
+       style="font-style:normal;font-weight:normal;font-size:160px;line-height:125%;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       x="136.32812"
+       y="218.24219"
+       id="text432"
+       inkscape:label="value"><tspan
+         sodipodi:role="line"
+         id="tspan430"
+         x="136.32812"
+         y="218.24219"
+         style="stroke-width:1px">8888</tspan></text>
+    <path
+       transform="scale(1,-1)"
+       sodipodi:type="star"
+       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:#e6e6e6;fill-opacity:1;fill-rule:nonzero;stroke:#ff6600;stroke-width:5;stroke-linecap:butt;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"
+       id="path436"
+       sodipodi:sides="3"
+       sodipodi:cx="596.74072"
+       sodipodi:cy="-224.98808"
+       sodipodi:r1="29.912722"
+       sodipodi:r2="14.956361"
+       sodipodi:arg1="0.52359878"
+       sodipodi:arg2="1.5707963"
+       inkscape:flatsided="true"
+       inkscape:rounded="0"
+       inkscape:randomized="0"
+       d="m 622.6459,-210.03172 -51.81035,0 25.90517,-44.86908 z"
+       inkscape:transform-center-y="7.4781812"
+       inkscape:label="-1" />
+    <rect
+       inkscape:label="edit"
+       onclick=""
+       y="95.40741"
+       x="139.85185"
+       height="128"
+       width="407.7037"
+       id="rect438"
+       style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#ff00ff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:5;stroke-linecap:butt;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" />
+    <path
+       inkscape:label="+1"
+       inkscape:transform-center-y="-7.4781804"
+       d="m 622.6459,111.4008 -51.81035,0 25.90517,-44.869079 z"
+       inkscape:randomized="0"
+       inkscape:rounded="0"
+       inkscape:flatsided="true"
+       sodipodi:arg2="1.5707963"
+       sodipodi:arg1="0.52359878"
+       sodipodi:r2="14.956361"
+       sodipodi:r1="29.912722"
+       sodipodi:cy="96.444443"
+       sodipodi:cx="596.74072"
+       sodipodi:sides="3"
+       id="path442"
+       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:#e6e6e6;fill-opacity:1;fill-rule:nonzero;stroke:#ff6600;stroke-width:5;stroke-linecap:butt;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"
+       sodipodi:type="star" />
+    <path
+       inkscape:label="=0"
+       inkscape:transform-center-y="-10.828983"
+       d="m 626.14807,189.68763 -58.37872,0.43598 -0.43597,-58.37872 58.37871,-0.43597 z"
+       inkscape:randomized="0"
+       inkscape:rounded="0"
+       inkscape:flatsided="true"
+       sodipodi:arg2="1.5633284"
+       sodipodi:arg1="0.77793027"
+       sodipodi:r2="21.657967"
+       sodipodi:r1="41.281136"
+       sodipodi:cy="160.71626"
+       sodipodi:cx="596.74072"
+       sodipodi:sides="4"
+       id="path444"
+       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:#e6e6e6;fill-opacity:1;fill-rule:nonzero;stroke:#ff6600;stroke-width:5;stroke-linecap:butt;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"
+       sodipodi:type="star"
+       inkscape:transform-center-x="1.0089177e-06" />
+  </g>
 </svg>
beremiz