beremiz

SVGHMI: minimal JSON Table Widget communication infra + corresponding python code as py_ext code in svghmi test. To be continued.
svghmi
2020-07-14, Edouard Tisserant
b6a9ef7f7e43
Parents b76f303ffce6
Children 7769e7c7f925
SVGHMI: minimal JSON Table Widget communication infra + corresponding python code as py_ext code in svghmi test. To be continued.
4 files changed, 108 insertions(+), 7 deletions(-)
  • +51 -3
    svghmi/gen_index_xhtml.xslt
  • +28 -0
    svghmi/widget_jsontable.ysl2
  • +16 -0
    tests/svghmi/py_ext_0@py_ext/pyfile.xml
  • +13 -4
    tests/svghmi/svghmi_0@svghmi/svghmi.svg
    • --- 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>