Mercurial Mercurial > beremiz / changeset
summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | raw | bz2 | zip | gz | help
SVGHMI: minimal JSON Table Widget communication infra + corresponding python code as py_ext code in svghmi test. To be continued. svghmi
authorEdouard Tisserant <edouard.tisserant@gmail.com>
Tue, 14 Jul 2020 22:05:47 +0200
branchsvghmi
changeset 2994 b6a9ef7f7e43
parent 2993 b76f303ffce6
child 2995 7769e7c7f925
SVGHMI: minimal JSON Table Widget communication infra + corresponding python code as py_ext code in svghmi test. To be continued.
svghmi/gen_index_xhtml.xslt file | annotate | diff | comparison | revisions
svghmi/widget_jsontable.ysl2 file | annotate | diff | comparison | revisions
tests/svghmi/py_ext_0@py_ext/pyfile.xml file | annotate | diff | comparison | revisions
tests/svghmi/svghmi_0@svghmi/svghmi.svg file | annotate | diff | comparison | revisions 
--- a/svghmi/gen_index_xhtml.xslt	Mon Jul 13 13:56:42 2020 +0200
+++ b/svghmi/gen_index_xhtml.xslt	Tue Jul 14 22:05:47 2020 +0200
@@ -1,6 +1,6 @@
 <?xml version="1.0"?>
-<xsl:stylesheet xmlns:ns="beremiz" xmlns:definitions="definitions" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:func="http://exslt.org/functions" xmlns:epilogue="epilogue" xmlns:preamble="preamble" 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" xmlns:svg="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:str="http://exslt.org/strings" xmlns:regexp="http://exslt.org/regular-expressions" xmlns:exsl="http://exslt.org/common" xmlns:declarations="declarations" xmlns:debug="debug" exclude-result-prefixes="ns func exsl regexp str dyn debug preamble epilogue declarations definitions" extension-element-prefixes="ns func exsl regexp str dyn" version="1.0">
-  <xsl:output method="xml" cdata-section-elements="xhtml:script"/>
+<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:exsl="http://exslt.org/common" xmlns:regexp="http://exslt.org/regular-expressions" xmlns:str="http://exslt.org/strings" xmlns:func="http://exslt.org/functions" 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: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" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:debug="debug" xmlns:preamble="preamble" xmlns:declarations="declarations" xmlns:definitions="definitions" xmlns:epilogue="epilogue" xmlns:ns="beremiz" version="1.0" extension-element-prefixes="ns func exsl regexp str dyn" exclude-result-prefixes="ns func exsl regexp str dyn debug preamble epilogue declarations definitions">
+  <xsl:output cdata-section-elements="xhtml:script" method="xml"/>
   <xsl:variable name="svg" select="/svg:svg"/>
   <xsl:variable name="hmi_elements" select="//svg:*[starts-with(@inkscape:label, 'HMI:')]"/>
   <xsl:variable name="hmitree" select="ns:GetHMITree()"/>
@@ -2146,6 +2146,54 @@
     <xsl:text>    },
 </xsl:text>
   </xsl:template>
+  <xsl:template mode="widget_class" match="widget[@type='JsonTable']">
+    <xsl:text>class JsonTableWidget extends Widget{
+</xsl:text>
+    <xsl:text>    on_click(evt) {
+</xsl:text>
+    <xsl:text>        const query = {
+</xsl:text>
+    <xsl:text>             offset: '42',
+</xsl:text>
+    <xsl:text>             filter: '*powerloss*',
+</xsl:text>
+    <xsl:text>             args: this.args
+</xsl:text>
+    <xsl:text>        };
+</xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>        const options = {
+</xsl:text>
+    <xsl:text>             method: 'POST',
+</xsl:text>
+    <xsl:text>             body: JSON.stringify(query),
+</xsl:text>
+    <xsl:text>             headers: {'Content-Type': 'application/json'}
+</xsl:text>
+    <xsl:text>        }
+</xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>        fetch(this.args[0], options)
+</xsl:text>
+    <xsl:text>            .then(res =&gt; res.json())
+</xsl:text>
+    <xsl:text>            .then(res =&gt; console.log(res));
+</xsl:text>
+    <xsl:text>
+</xsl:text>
+    <xsl:text>    }
+</xsl:text>
+    <xsl:text>    init() {
+</xsl:text>
+    <xsl:text>        this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)");
+</xsl:text>
+    <xsl:text>    }
+</xsl:text>
+    <xsl:text>}
+</xsl:text>
+  </xsl:template>
   <xsl:template name="jump_widget_activity">
     <xsl:param name="hmi_element"/>
     <xsl:call-template name="defs_by_labels">
@@ -2793,7 +2841,7 @@
     <xsl:comment>
       <xsl:apply-templates select="document('')/*/debug:*"/>
     </xsl:comment>
-    <html xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/1999/xhtml">
+    <html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
       <head/>
       <body style="margin:0;overflow:hidden;">
         <xsl:copy-of select="$result_svg"/>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/svghmi/widget_jsontable.ysl2	Tue Jul 14 22:05:47 2020 +0200
@@ -0,0 +1,28 @@
+// widget_jsontable.ysl2
+
+template "widget[@type='JsonTable']", mode="widget_class"
+    ||
+    class JsonTableWidget extends Widget{
+        on_click(evt) {
+            const query = {
+                 offset: '42',
+                 filter: '*powerloss*',
+                 args: this.args
+            };
+
+            const options = {
+                 method: 'POST',
+                 body: JSON.stringify(query),
+                 headers: {'Content-Type': 'application/json'}
+            }
+
+            fetch(this.args[0], options)
+                .then(res => res.json())
+                .then(res => console.log(res));
+
+        }
+        init() {
+            this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)");
+        }
+    }
+    ||
--- a/tests/svghmi/py_ext_0@py_ext/pyfile.xml	Mon Jul 13 13:56:42 2020 +0200
+++ b/tests/svghmi/py_ext_0@py_ext/pyfile.xml	Tue Jul 14 22:05:47 2020 +0200
@@ -5,6 +5,18 @@
   </variables>
   <globals>
     <xhtml:p><![CDATA[
+from twisted.web.resource import Resource
+
+class AlarmJsonResource(Resource):
+    def render_GET(self, request):
+        return ''
+
+    def render_POST(self, request):
+        print(request.__dict__)
+        newdata = request.content.getvalue()
+        print newdata
+        return ''
+
 
 def MyOnChangeFunc(changed_var_name):
     print changed_var_name + ": " + getattr(PLCGlobals, changed_var_name)
@@ -21,6 +33,10 @@
   </cleanup>
   <start>
     <xhtml:p><![CDATA[
+
+svghmi_root.putChild("alarms", AlarmJsonResource())
+
+
 ]]></xhtml:p>
   </start>
   <stop>
--- a/tests/svghmi/svghmi_0@svghmi/svghmi.svg	Mon Jul 13 13:56:42 2020 +0200
+++ b/tests/svghmi/svghmi_0@svghmi/svghmi.svg	Tue Jul 14 22:05:47 2020 +0200
@@ -16,7 +16,7 @@
    version="1.1"
    id="hmi0"
    sodipodi:docname="svghmi.svg"
-   inkscape:version="0.92.3 (2405546, 2018-03-11)">
+   inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
   <metadata
      id="metadata4542">
     <rdf:RDF>
@@ -142,10 +142,10 @@
      showgrid="false"
      units="px"
      inkscape:zoom="0.35355339"
-     inkscape:cx="477.09179"
-     inkscape:cy="-82.185108"
+     inkscape:cx="460.66016"
+     inkscape:cy="-571.17456"
      inkscape:window-width="1800"
-     inkscape:window-height="836"
+     inkscape:window-height="1861"
      inkscape:window-x="0"
      inkscape:window-y="27"
      inkscape:window-maximized="0"
@@ -2850,4 +2850,13 @@
            sodipodi:role="line">mhe</tspan></text>
     </g>
   </g>
+  <rect
+     style="fill:#4d389f;fill-opacity:1;stroke:#ff00ff"
+     id="rect1261"
+     width="91.923882"
+     height="66.46804"
+     x="296.98483"
+     y="482.41211"
+     ry="33.23402"
+     inkscape:label="HMI:JsonTable:/alarms:mhoooo:666" />
 </svg>
beremiz