Edouard@2753: <?xml version="1.0"?>
Edouard@3264: <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">
Edouard@3264:   <xsl:output cdata-section-elements="xhtml:script" method="xml"/>
edouard@2941:   <xsl:variable name="svg" select="/svg:svg"/>
Edouard@2879:   <xsl:variable name="hmi_elements" select="//svg:*[starts-with(@inkscape:label, 'HMI:')]"/>
Edouard@3383:   <xsl:param name="instance_name"/>
Edouard@2877:   <xsl:variable name="hmitree" select="ns:GetHMITree()"/>
Edouard@2790:   <xsl:variable name="_categories">
Edouard@2790:     <noindex>
Edouard@2790:       <xsl:text>HMI_PLC_STATUS</xsl:text>
Edouard@2790:     </noindex>
Edouard@2790:     <noindex>
Edouard@2790:       <xsl:text>HMI_CURRENT_PAGE</xsl:text>
Edouard@2790:     </noindex>
Edouard@2790:   </xsl:variable>
Edouard@2790:   <xsl:variable name="categories" select="exsl:node-set($_categories)"/>
Edouard@2867:   <xsl:variable name="_indexed_hmitree">
Edouard@3019:     <xsl:apply-templates mode="index" select="$hmitree"/>
Edouard@2867:   </xsl:variable>
Edouard@2867:   <xsl:variable name="indexed_hmitree" select="exsl:node-set($_indexed_hmitree)"/>
edouard@2941:   <preamble:hmi-tree/>
edouard@2941:   <xsl:template match="preamble:hmi-tree">
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:     <xsl:text>var hmi_hash = [</xsl:text>
edouard@2941:     <xsl:value-of select="$hmitree/@hash"/>
edouard@2941:     <xsl:text>];
edouard@2941: </xsl:text>
edouard@2941:     <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:     <xsl:text>var heartbeat_index = </xsl:text>
edouard@2941:     <xsl:value-of select="$indexed_hmitree/*[@hmipath = '/HEARTBEAT']/@index"/>
edouard@2941:     <xsl:text>;
edouard@2941: </xsl:text>
edouard@2941:     <xsl:text>
edouard@2941: </xsl:text>
Edouard@3383:     <xsl:text>var current_page_var_index = </xsl:text>
Edouard@3383:     <xsl:value-of select="$indexed_hmitree/*[@hmipath = concat('/CURRENT_PAGE_', $instance_name)]/@index"/>
Edouard@3383:     <xsl:text>;
Edouard@3383: </xsl:text>
Edouard@3383:     <xsl:text>
Edouard@3383: </xsl:text>
edouard@2941:     <xsl:text>var hmitree_types = [
edouard@2941: </xsl:text>
edouard@2941:     <xsl:for-each select="$indexed_hmitree/*">
Edouard@3383:       <xsl:text>    "</xsl:text>
edouard@2941:       <xsl:value-of select="substring(local-name(), 5)"/>
edouard@2941:       <xsl:text>"</xsl:text>
edouard@2941:       <xsl:if test="position()!=last()">
edouard@2941:         <xsl:text>,</xsl:text>
edouard@2941:       </xsl:if>
edouard@2941:       <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:     </xsl:for-each>
edouard@3097:     <xsl:text>];
edouard@3097: </xsl:text>
edouard@3097:     <xsl:text>
edouard@3097: </xsl:text>
Edouard@3206:     <xsl:text>var hmitree_paths = [
Edouard@3206: </xsl:text>
Edouard@3206:     <xsl:for-each select="$indexed_hmitree/*">
Edouard@3383:       <xsl:text>    "</xsl:text>
Edouard@3206:       <xsl:value-of select="@hmipath"/>
Edouard@3206:       <xsl:text>"</xsl:text>
Edouard@3206:       <xsl:if test="position()!=last()">
Edouard@3206:         <xsl:text>,</xsl:text>
Edouard@3206:       </xsl:if>
Edouard@3206:       <xsl:text>
Edouard@3206: </xsl:text>
Edouard@3206:     </xsl:for-each>
Edouard@3206:     <xsl:text>];
Edouard@3206: </xsl:text>
Edouard@3206:     <xsl:text>
Edouard@3206: </xsl:text>
Edouard@3383:     <xsl:text>var hmitree_nodes = {
Edouard@3383: </xsl:text>
Edouard@3383:     <xsl:for-each select="$indexed_hmitree/*[local-name() = 'HMI_NODE']">
Edouard@3383:       <xsl:text>    "</xsl:text>
Edouard@3383:       <xsl:value-of select="@hmipath"/>
Edouard@3383:       <xsl:text>" : [</xsl:text>
Edouard@3383:       <xsl:value-of select="@index"/>
Edouard@3383:       <xsl:text>, "</xsl:text>
Edouard@3383:       <xsl:value-of select="@class"/>
Edouard@3383:       <xsl:text>"]</xsl:text>
Edouard@3383:       <xsl:if test="position()!=last()">
Edouard@3383:         <xsl:text>,</xsl:text>
Edouard@3383:       </xsl:if>
Edouard@3383:       <xsl:text>
Edouard@3383: </xsl:text>
Edouard@3383:     </xsl:for-each>
Edouard@3383:     <xsl:text>};
Edouard@3383: </xsl:text>
Edouard@3383:     <xsl:text>
Edouard@3383: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:   </xsl:template>
Edouard@3019:   <xsl:template mode="index" match="*">
Edouard@2790:     <xsl:param name="index" select="0"/>
Edouard@2791:     <xsl:param name="parentpath" select="''"/>
Edouard@2790:     <xsl:variable name="content">
Edouard@2791:       <xsl:variable name="path">
Edouard@2791:         <xsl:choose>
edouard@2890:           <xsl:when test="count(ancestor::*)=0">
edouard@2890:             <xsl:text>/</xsl:text>
edouard@2890:           </xsl:when>
edouard@2890:           <xsl:when test="count(ancestor::*)=1">
edouard@2890:             <xsl:text>/</xsl:text>
edouard@2890:             <xsl:value-of select="@name"/>
Edouard@2791:           </xsl:when>
Edouard@2791:           <xsl:otherwise>
Edouard@2791:             <xsl:value-of select="$parentpath"/>
Edouard@2791:             <xsl:text>/</xsl:text>
Edouard@2791:             <xsl:value-of select="@name"/>
Edouard@2791:           </xsl:otherwise>
Edouard@2791:         </xsl:choose>
Edouard@2791:       </xsl:variable>
Edouard@2790:       <xsl:choose>
Edouard@2790:         <xsl:when test="not(local-name() = $categories/noindex)">
Edouard@2790:           <xsl:copy>
Edouard@2790:             <xsl:attribute name="index">
Edouard@2790:               <xsl:value-of select="$index"/>
Edouard@2790:             </xsl:attribute>
Edouard@2791:             <xsl:attribute name="hmipath">
Edouard@2791:               <xsl:value-of select="$path"/>
Edouard@2791:             </xsl:attribute>
Edouard@2790:             <xsl:for-each select="@*">
Edouard@2790:               <xsl:copy/>
Edouard@2790:             </xsl:for-each>
Edouard@2790:           </xsl:copy>
Edouard@3019:           <xsl:apply-templates mode="index" select="*[1]">
Edouard@2867:             <xsl:with-param name="index" select="$index + 1"/>
Edouard@2867:             <xsl:with-param name="parentpath">
Edouard@2867:               <xsl:value-of select="$path"/>
Edouard@2867:             </xsl:with-param>
Edouard@2867:           </xsl:apply-templates>
Edouard@2790:         </xsl:when>
Edouard@2790:         <xsl:otherwise>
Edouard@3019:           <xsl:apply-templates mode="index" select="*[1]">
Edouard@2790:             <xsl:with-param name="index" select="$index"/>
Edouard@2791:             <xsl:with-param name="parentpath">
Edouard@2791:               <xsl:value-of select="$path"/>
Edouard@2791:             </xsl:with-param>
Edouard@2790:           </xsl:apply-templates>
Edouard@2790:         </xsl:otherwise>
Edouard@2790:       </xsl:choose>
Edouard@2790:     </xsl:variable>
Edouard@2790:     <xsl:copy-of select="$content"/>
Edouard@3019:     <xsl:apply-templates mode="index" select="following-sibling::*[1]">
Edouard@2790:       <xsl:with-param name="index" select="$index + count(exsl:node-set($content)/*)"/>
Edouard@2791:       <xsl:with-param name="parentpath">
Edouard@2791:         <xsl:value-of select="$parentpath"/>
Edouard@2791:       </xsl:with-param>
Edouard@2790:     </xsl:apply-templates>
Edouard@2790:   </xsl:template>
edouard@3238:   <xsl:variable name="pathregex" select="'^([^\[,]+)(\[[^\]]+\])?([\d,]*)$'"/>
Edouard@3019:   <xsl:template mode="parselabel" match="*">
edouard@2886:     <xsl:variable name="label" select="@inkscape:label"/>
edouard@3097:     <xsl:variable name="id" select="@id"/>
Edouard@2792:     <xsl:variable name="description" select="substring-after($label,'HMI:')"/>
Edouard@2792:     <xsl:variable name="_args" select="substring-before($description,'@')"/>
Edouard@2792:     <xsl:variable name="args">
Edouard@2792:       <xsl:choose>
Edouard@2792:         <xsl:when test="$_args">
Edouard@2792:           <xsl:value-of select="$_args"/>
Edouard@2792:         </xsl:when>
Edouard@2792:         <xsl:otherwise>
Edouard@2792:           <xsl:value-of select="$description"/>
Edouard@2792:         </xsl:otherwise>
Edouard@2792:       </xsl:choose>
Edouard@2792:     </xsl:variable>
Edouard@3410:     <xsl:variable name="_typefreq" select="substring-before($args,':')"/>
Edouard@3410:     <xsl:variable name="typefreq">
Edouard@3410:       <xsl:choose>
Edouard@3410:         <xsl:when test="$_typefreq">
Edouard@3410:           <xsl:value-of select="$_typefreq"/>
Edouard@3410:         </xsl:when>
Edouard@3410:         <xsl:otherwise>
Edouard@3410:           <xsl:value-of select="$args"/>
Edouard@3410:         </xsl:otherwise>
Edouard@3410:       </xsl:choose>
Edouard@3410:     </xsl:variable>
edouard@3414:     <xsl:variable name="freq" select="substring-after($typefreq,'|')"/>
Edouard@3410:     <xsl:variable name="_type" select="substring-before($typefreq,'|')"/>
Edouard@2792:     <xsl:variable name="type">
Edouard@2792:       <xsl:choose>
Edouard@2792:         <xsl:when test="$_type">
Edouard@2792:           <xsl:value-of select="$_type"/>
Edouard@2792:         </xsl:when>
Edouard@2792:         <xsl:otherwise>
Edouard@3410:           <xsl:value-of select="$typefreq"/>
Edouard@2792:         </xsl:otherwise>
Edouard@2792:       </xsl:choose>
Edouard@2792:     </xsl:variable>
edouard@2886:     <xsl:if test="$type">
edouard@2886:       <widget>
edouard@2886:         <xsl:attribute name="id">
edouard@3097:           <xsl:value-of select="$id"/>
edouard@2886:         </xsl:attribute>
edouard@2886:         <xsl:attribute name="type">
edouard@2886:           <xsl:value-of select="$type"/>
edouard@2886:         </xsl:attribute>
edouard@3414:         <xsl:if test="$freq">
edouard@3414:           <xsl:attribute name="freq">
Edouard@3410:             <xsl:value-of select="$freq"/>
Edouard@3410:           </xsl:attribute>
Edouard@3410:         </xsl:if>
edouard@2886:         <xsl:for-each select="str:split(substring-after($args, ':'), ':')">
edouard@2886:           <arg>
edouard@2886:             <xsl:attribute name="value">
edouard@2886:               <xsl:value-of select="."/>
edouard@2886:             </xsl:attribute>
edouard@2886:           </arg>
edouard@2886:         </xsl:for-each>
edouard@2886:         <xsl:variable name="paths" select="substring-after($description,'@')"/>
edouard@2886:         <xsl:for-each select="str:split($paths, '@')">
edouard@2886:           <xsl:if test="string-length(.) &gt; 0">
edouard@2886:             <path>
edouard@3238:               <xsl:variable name="path_match" select="regexp:match(.,$pathregex)"/>
edouard@3238:               <xsl:variable name="pathminmax" select="str:split($path_match[4],',')"/>
edouard@3238:               <xsl:variable name="path" select="$path_match[2]"/>
edouard@3238:               <xsl:variable name="path_accepts" select="$path_match[3]"/>
edouard@3097:               <xsl:variable name="pathminmaxcount" select="count($pathminmax)"/>
Edouard@2793:               <xsl:attribute name="value">
edouard@3097:                 <xsl:value-of select="$path"/>
Edouard@2793:               </xsl:attribute>
edouard@3238:               <xsl:if test="string-length($path_accepts)">
edouard@3238:                 <xsl:attribute name="accepts">
edouard@3238:                   <xsl:value-of select="$path_accepts"/>
edouard@3238:                 </xsl:attribute>
edouard@3238:               </xsl:if>
edouard@3017:               <xsl:choose>
edouard@3238:                 <xsl:when test="$pathminmaxcount = 2">
edouard@3097:                   <xsl:attribute name="min">
edouard@3238:                     <xsl:value-of select="$pathminmax[1]"/>
edouard@3238:                   </xsl:attribute>
edouard@3238:                   <xsl:attribute name="max">
edouard@3097:                     <xsl:value-of select="$pathminmax[2]"/>
edouard@3017:                   </xsl:attribute>
edouard@3097:                 </xsl:when>
edouard@3238:                 <xsl:when test="$pathminmaxcount = 1 or $pathminmaxcount &gt; 2">
edouard@3097:                   <xsl:message terminate="yes">
edouard@3097:                     <xsl:text>Widget id:</xsl:text>
edouard@3097:                     <xsl:value-of select="$id"/>
edouard@3097:                     <xsl:text> label:</xsl:text>
edouard@3097:                     <xsl:value-of select="$label"/>
edouard@3097:                     <xsl:text> has wrong syntax of path section </xsl:text>
edouard@3097:                     <xsl:value-of select="$pathminmax"/>
edouard@3097:                   </xsl:message>
edouard@3097:                 </xsl:when>
edouard@3097:               </xsl:choose>
edouard@3229:               <xsl:if test="$indexed_hmitree">
edouard@3229:                 <xsl:choose>
edouard@3229:                   <xsl:when test="regexp:test($path,'^\.[a-zA-Z0-9_]+$')">
edouard@3229:                     <xsl:attribute name="type">
edouard@3229:                       <xsl:text>PAGE_LOCAL</xsl:text>
edouard@3097:                     </xsl:attribute>
edouard@3229:                   </xsl:when>
edouard@3229:                   <xsl:when test="regexp:test($path,'^[a-zA-Z0-9_]+$')">
edouard@3097:                     <xsl:attribute name="type">
edouard@3229:                       <xsl:text>HMI_LOCAL</xsl:text>
edouard@3097:                     </xsl:attribute>
edouard@3229:                   </xsl:when>
edouard@3229:                   <xsl:otherwise>
edouard@3229:                     <xsl:variable name="item" select="$indexed_hmitree/*[@hmipath = $path]"/>
edouard@3229:                     <xsl:variable name="pathtype" select="local-name($item)"/>
edouard@3229:                     <xsl:if test="$pathminmaxcount = 3 and not($pathtype = 'HMI_INT' or $pathtype = 'HMI_REAL')">
edouard@3229:                       <xsl:message terminate="yes">
edouard@3229:                         <xsl:text>Widget id:</xsl:text>
edouard@3229:                         <xsl:value-of select="$id"/>
edouard@3229:                         <xsl:text> label:</xsl:text>
edouard@3229:                         <xsl:value-of select="$label"/>
edouard@3229:                         <xsl:text> path section </xsl:text>
edouard@3229:                         <xsl:value-of select="$pathminmax"/>
edouard@3229:                         <xsl:text> use min and max on non mumeric value</xsl:text>
edouard@3229:                       </xsl:message>
edouard@3229:                     </xsl:if>
edouard@3229:                     <xsl:if test="count($item) = 1">
edouard@3229:                       <xsl:attribute name="index">
edouard@3229:                         <xsl:value-of select="$item/@index"/>
edouard@3229:                       </xsl:attribute>
edouard@3229:                       <xsl:attribute name="type">
edouard@3229:                         <xsl:value-of select="$pathtype"/>
edouard@3229:                       </xsl:attribute>
edouard@3229:                     </xsl:if>
edouard@3229:                   </xsl:otherwise>
edouard@3229:                 </xsl:choose>
edouard@3229:               </xsl:if>
edouard@2886:             </path>
edouard@2886:           </xsl:if>
edouard@2886:         </xsl:for-each>
Edouard@3264:         <xsl:if test="svg:desc">
Edouard@3264:           <desc>
Edouard@3264:             <xsl:value-of select="svg:desc/text()"/>
Edouard@3264:           </desc>
Edouard@3264:         </xsl:if>
edouard@2886:       </widget>
edouard@2886:     </xsl:if>
edouard@2886:   </xsl:template>
edouard@3229:   <xsl:template mode="genlabel" match="arg">
edouard@3229:     <xsl:text>:</xsl:text>
edouard@3229:     <xsl:value-of select="@value"/>
edouard@3229:   </xsl:template>
edouard@3229:   <xsl:template mode="genlabel" match="path">
edouard@3229:     <xsl:text>@</xsl:text>
edouard@3229:     <xsl:value-of select="@value"/>
edouard@3229:     <xsl:if test="string-length(@min)&gt;0 or string-length(@max)&gt;0">
Edouard@3240:       <xsl:text>,</xsl:text>
edouard@3229:       <xsl:value-of select="@min"/>
Edouard@3240:       <xsl:text>,</xsl:text>
edouard@3229:       <xsl:value-of select="@max"/>
edouard@3229:     </xsl:if>
edouard@3229:   </xsl:template>
edouard@3229:   <xsl:template mode="genlabel" match="widget">
edouard@3229:     <xsl:text>HMI:</xsl:text>
edouard@3229:     <xsl:value-of select="@type"/>
edouard@3229:     <xsl:apply-templates mode="genlabel" select="arg"/>
edouard@3229:     <xsl:apply-templates mode="genlabel" select="path"/>
edouard@3229:   </xsl:template>
edouard@2886:   <xsl:variable name="_parsed_widgets">
edouard@3128:     <widget type="VarInitPersistent">
edouard@3128:       <arg value="0"/>
edouard@3128:       <path value="lang"/>
edouard@3128:     </widget>
Edouard@3019:     <xsl:apply-templates mode="parselabel" select="$hmi_elements"/>
edouard@2886:   </xsl:variable>
edouard@2886:   <xsl:variable name="parsed_widgets" select="exsl:node-set($_parsed_widgets)"/>
edouard@2886:   <func:function name="func:widget">
edouard@2886:     <xsl:param name="id"/>
edouard@2886:     <func:result select="$parsed_widgets/widget[@id = $id]"/>
Edouard@2885:   </func:function>
edouard@2894:   <func:function name="func:is_descendant_path">
edouard@2894:     <xsl:param name="descend"/>
edouard@2894:     <xsl:param name="ancest"/>
edouard@2894:     <func:result select="string-length($ancest) &gt; 0 and starts-with($descend,$ancest)"/>
edouard@2894:   </func:function>
Edouard@2901:   <func:function name="func:same_class_paths">
Edouard@2901:     <xsl:param name="a"/>
Edouard@2901:     <xsl:param name="b"/>
Edouard@2901:     <xsl:variable name="class_a" select="$indexed_hmitree/*[@hmipath = $a]/@class"/>
Edouard@2901:     <xsl:variable name="class_b" select="$indexed_hmitree/*[@hmipath = $b]/@class"/>
Edouard@2901:     <func:result select="$class_a and $class_b and $class_a = $class_b"/>
Edouard@2901:   </func:function>
Edouard@3019:   <xsl:template mode="testtree" match="*">
Edouard@2877:     <xsl:param name="indent" select="''"/>
Edouard@2877:     <xsl:value-of select="$indent"/>
Edouard@2877:     <xsl:text> </xsl:text>
Edouard@2877:     <xsl:value-of select="local-name()"/>
Edouard@2877:     <xsl:text> </xsl:text>
Edouard@2877:     <xsl:for-each select="@*">
Edouard@2877:       <xsl:value-of select="local-name()"/>
Edouard@2877:       <xsl:text>="</xsl:text>
Edouard@2877:       <xsl:value-of select="."/>
Edouard@2877:       <xsl:text>" </xsl:text>
Edouard@2877:     </xsl:for-each>
Edouard@3118:     <xsl:text>
Edouard@2877: </xsl:text>
Edouard@3019:     <xsl:apply-templates mode="testtree" select="*">
Edouard@2877:       <xsl:with-param name="indent">
Edouard@2877:         <xsl:value-of select="concat($indent,'&gt;')"/>
Edouard@2877:       </xsl:with-param>
Edouard@2877:     </xsl:apply-templates>
Edouard@2877:   </xsl:template>
edouard@2940:   <debug:hmi-tree/>
edouard@2940:   <xsl:template match="debug:hmi-tree">
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
Edouard@2877:     <xsl:text>Raw HMI tree
Edouard@2877: </xsl:text>
Edouard@3019:     <xsl:apply-templates mode="testtree" select="$hmitree"/>
Edouard@2877:     <xsl:text>
Edouard@2877: </xsl:text>
Edouard@2877:     <xsl:text>Indexed HMI tree
Edouard@2877: </xsl:text>
Edouard@3019:     <xsl:apply-templates mode="testtree" select="$indexed_hmitree"/>
edouard@2886:     <xsl:text>
edouard@2886: </xsl:text>
edouard@2886:     <xsl:text>Parsed Widgets
edouard@2886: </xsl:text>
edouard@2886:     <xsl:copy-of select="_parsed_widgets"/>
Edouard@3019:     <xsl:apply-templates mode="testtree" select="$parsed_widgets"/>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
Edouard@2877:   </xsl:template>
Edouard@3199:   <xsl:variable name="all_geometry" select="ns:GetSVGGeometry()"/>
Edouard@3199:   <xsl:variable name="defs" select="//svg:defs/descendant-or-self::svg:*"/>
Edouard@3199:   <xsl:variable name="geometry" select="$all_geometry[not(@Id = $defs/@id)]"/>
edouard@2939:   <debug:geometry/>
edouard@2940:   <xsl:template match="debug:geometry">
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
Edouard@2877:     <xsl:text>ID, x, y, w, h
Edouard@2877: </xsl:text>
Edouard@2879:     <xsl:for-each select="$geometry">
Edouard@2877:       <xsl:text> </xsl:text>
Edouard@2877:       <xsl:value-of select="@Id"/>
Edouard@2877:       <xsl:text> </xsl:text>
Edouard@2877:       <xsl:value-of select="@x"/>
Edouard@2877:       <xsl:text> </xsl:text>
Edouard@2877:       <xsl:value-of select="@y"/>
Edouard@2877:       <xsl:text> </xsl:text>
Edouard@2877:       <xsl:value-of select="@w"/>
Edouard@2877:       <xsl:text> </xsl:text>
Edouard@2877:       <xsl:value-of select="@h"/>
Edouard@2877:       <xsl:text>
Edouard@2877: </xsl:text>
Edouard@2877:     </xsl:for-each>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
Edouard@2877:   </xsl:template>
Edouard@2877:   <func:function name="func:intersect_1d">
Edouard@2877:     <xsl:param name="a0"/>
Edouard@2877:     <xsl:param name="a1"/>
Edouard@2877:     <xsl:param name="b0"/>
Edouard@2877:     <xsl:param name="b1"/>
Edouard@2877:     <xsl:variable name="d0" select="$a0 &gt;= $b0"/>
Edouard@2877:     <xsl:variable name="d1" select="$a1 &gt;= $b1"/>
Edouard@2877:     <xsl:choose>
Edouard@2877:       <xsl:when test="not($d0) and $d1">
Edouard@2877:         <func:result select="3"/>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:when test="$d0 and not($d1)">
Edouard@2877:         <func:result select="2"/>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:when test="$d0 and $d1 and $a0 &lt; $b1">
Edouard@2877:         <func:result select="1"/>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:when test="not($d0) and not($d1) and $b0 &lt; $a1">
Edouard@2877:         <func:result select="1"/>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:otherwise>
Edouard@2877:         <func:result select="0"/>
Edouard@2877:       </xsl:otherwise>
Edouard@2877:     </xsl:choose>
Edouard@2877:   </func:function>
Edouard@2877:   <func:function name="func:intersect">
Edouard@2877:     <xsl:param name="a"/>
Edouard@2877:     <xsl:param name="b"/>
Edouard@2877:     <xsl:variable name="x_intersect" select="func:intersect_1d($a/@x, $a/@x+$a/@w, $b/@x, $b/@x+$b/@w)"/>
Edouard@2877:     <xsl:choose>
Edouard@2877:       <xsl:when test="$x_intersect != 0">
Edouard@2877:         <xsl:variable name="y_intersect" select="func:intersect_1d($a/@y, $a/@y+$a/@h, $b/@y, $b/@y+$b/@h)"/>
Edouard@2877:         <func:result select="$x_intersect * $y_intersect"/>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:otherwise>
Edouard@2877:         <func:result select="0"/>
Edouard@2877:       </xsl:otherwise>
Edouard@2877:     </xsl:choose>
Edouard@2877:   </func:function>
edouard@3165:   <xsl:variable name="groups" select="/svg:svg | //svg:g"/>
Edouard@2877:   <func:function name="func:overlapping_geometry">
Edouard@2877:     <xsl:param name="elt"/>
Edouard@2877:     <xsl:variable name="g" select="$geometry[@Id = $elt/@id]"/>
Edouard@2877:     <xsl:variable name="candidates" select="$geometry[@Id != $elt/@id]"/>
Edouard@2877:     <func:result select="$candidates[(@Id = $groups/@id and (func:intersect($g, .) = 9)) or &#10;                          (not(@Id = $groups/@id) and (func:intersect($g, .) &gt; 0 ))]"/>
Edouard@2877:   </func:function>
edouard@3355:   <xsl:variable name="hmi_lists_descs" select="$parsed_widgets/widget[@type = 'List']"/>
edouard@3355:   <xsl:variable name="hmi_lists" select="$hmi_elements[@id = $hmi_lists_descs/@id]"/>
edouard@3355:   <xsl:variable name="hmi_textlists_descs" select="$parsed_widgets/widget[@type = 'TextList']"/>
edouard@3355:   <xsl:variable name="hmi_textlists" select="$hmi_elements[@id = $hmi_textlists_descs/@id]"/>
edouard@3355:   <xsl:variable name="hmi_textstylelists_descs" select="$parsed_widgets/widget[@type = 'TextStyleList']"/>
edouard@3355:   <xsl:variable name="hmi_textstylelists" select="$hmi_elements[@id = $hmi_textstylelists_descs/@id]"/>
edouard@3355:   <xsl:variable name="textstylelist_related">
edouard@3355:     <xsl:for-each select="$hmi_textstylelists">
edouard@3355:       <list>
edouard@3355:         <xsl:attribute name="listid">
edouard@3355:           <xsl:value-of select="@id"/>
edouard@3355:         </xsl:attribute>
edouard@3355:         <xsl:for-each select="func:refered_elements(.)">
edouard@3355:           <elt>
edouard@3355:             <xsl:attribute name="eltid">
edouard@3355:               <xsl:value-of select="@id"/>
edouard@3355:             </xsl:attribute>
edouard@3355:           </elt>
edouard@3355:         </xsl:for-each>
edouard@3355:       </list>
edouard@3355:     </xsl:for-each>
edouard@3355:   </xsl:variable>
edouard@3355:   <xsl:variable name="textstylelist_related_ns" select="exsl:node-set($textstylelist_related)"/>
Edouard@2887:   <xsl:variable name="hmi_pages_descs" select="$parsed_widgets/widget[@type = 'Page']"/>
Edouard@2887:   <xsl:variable name="hmi_pages" select="$hmi_elements[@id = $hmi_pages_descs/@id]"/>
Edouard@2877:   <xsl:variable name="default_page">
Edouard@2877:     <xsl:choose>
Edouard@2877:       <xsl:when test="count($hmi_pages) &gt; 1">
Edouard@2877:         <xsl:choose>
Edouard@2887:           <xsl:when test="$hmi_pages_descs/arg[1]/@value = 'Home'">
Edouard@2877:             <xsl:text>Home</xsl:text>
Edouard@2877:           </xsl:when>
Edouard@2877:           <xsl:otherwise>
Edouard@3118:             <xsl:message terminate="yes">
Edouard@3118:               <xsl:text>No Home page defined!</xsl:text>
Edouard@3118:             </xsl:message>
Edouard@2877:           </xsl:otherwise>
Edouard@2877:         </xsl:choose>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:when test="count($hmi_pages) = 0">
Edouard@3118:         <xsl:message terminate="yes">
Edouard@3118:           <xsl:text>No page defined!</xsl:text>
Edouard@3118:         </xsl:message>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:otherwise>
edouard@2886:         <xsl:value-of select="func:widget($hmi_pages/@id)/arg[1]/@value"/>
Edouard@2877:       </xsl:otherwise>
Edouard@2877:     </xsl:choose>
Edouard@2877:   </xsl:variable>
edouard@2941:   <preamble:default-page/>
edouard@2941:   <xsl:template match="preamble:default-page">
edouard@2941:     <xsl:text>
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:     <xsl:text>var default_page = "</xsl:text>
edouard@2941:     <xsl:value-of select="$default_page"/>
edouard@2941:     <xsl:text>";
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:   </xsl:template>
edouard@2941:   <xsl:variable name="keypads_descs" select="$parsed_widgets/widget[@type = 'Keypad']"/>
edouard@2941:   <xsl:variable name="keypads" select="$hmi_elements[@id = $keypads_descs/@id]"/>
Edouard@2877:   <func:function name="func:refered_elements">
Edouard@2877:     <xsl:param name="elems"/>
Edouard@2877:     <xsl:variable name="descend" select="$elems/descendant-or-self::svg:*"/>
Edouard@2877:     <xsl:variable name="clones" select="$descend[self::svg:use]"/>
Edouard@2877:     <xsl:variable name="originals" select="//svg:*[concat('#',@id) = $clones/@xlink:href]"/>
Edouard@2877:     <xsl:choose>
Edouard@2877:       <xsl:when test="$originals">
Edouard@2877:         <func:result select="$descend | func:refered_elements($originals)"/>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:otherwise>
Edouard@2877:         <func:result select="$descend"/>
Edouard@2877:       </xsl:otherwise>
Edouard@2877:     </xsl:choose>
Edouard@2877:   </func:function>
edouard@3165:   <xsl:variable name="_overlapping_geometry">
edouard@3165:     <xsl:for-each select="$hmi_pages | $keypads">
Edouard@3170:       <xsl:variable name="k" select="concat('overlapping:', @id)"/>
Edouard@3170:       <xsl:value-of select="ns:ProgressStart($k, concat('collecting membership of ', @inkscape:label))"/>
edouard@3165:       <elt>
edouard@3165:         <xsl:attribute name="id">
edouard@3165:           <xsl:value-of select="@id"/>
edouard@3165:         </xsl:attribute>
edouard@3165:         <xsl:copy-of select="func:overlapping_geometry(.)"/>
edouard@3165:       </elt>
Edouard@3170:       <xsl:value-of select="ns:ProgressEnd($k)"/>
edouard@3165:     </xsl:for-each>
edouard@3165:   </xsl:variable>
edouard@3165:   <xsl:variable name="overlapping_geometry" select="exsl:node-set($_overlapping_geometry)"/>
Edouard@2877:   <func:function name="func:all_related_elements">
Edouard@2877:     <xsl:param name="page"/>
edouard@3165:     <xsl:variable name="page_overlapping_geometry" select="$overlapping_geometry/elt[@id = $page/@id]/*"/>
Edouard@2877:     <xsl:variable name="page_overlapping_elements" select="//svg:*[@id = $page_overlapping_geometry/@Id]"/>
Edouard@2877:     <xsl:variable name="page_sub_elements" select="func:refered_elements($page | $page_overlapping_elements)"/>
Edouard@2877:     <func:result select="$page_sub_elements"/>
Edouard@2877:   </func:function>
Edouard@2877:   <func:function name="func:required_elements">
Edouard@2877:     <xsl:param name="pages"/>
Edouard@2877:     <xsl:choose>
Edouard@2877:       <xsl:when test="$pages">
Edouard@2877:         <func:result select="func:all_related_elements($pages[1])&#10;                      | func:required_elements($pages[position()!=1])"/>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:otherwise>
Edouard@2877:         <func:result select="/.."/>
Edouard@2877:       </xsl:otherwise>
Edouard@2877:     </xsl:choose>
Edouard@2877:   </func:function>
Edouard@3186:   <xsl:variable name="required_page_elements" select="func:required_elements($hmi_pages | $keypads)/ancestor-or-self::svg:*"/>
Edouard@3387:   <xsl:variable name="required_list_elements" select="func:refered_elements(($hmi_lists | $hmi_textlists)[@id = $required_page_elements/@id])/ancestor-or-self::svg:*"/>
Edouard@3199:   <xsl:variable name="required_elements" select="$defs | $required_list_elements | $required_page_elements"/>
Edouard@2877:   <xsl:variable name="discardable_elements" select="//svg:*[not(@id = $required_elements/@id)]"/>
Edouard@2877:   <func:function name="func:sumarized_elements">
Edouard@2877:     <xsl:param name="elements"/>
Edouard@2877:     <xsl:variable name="short_list" select="$elements[not(ancestor::*/@id = $elements/@id)]"/>
edouard@3161:     <xsl:variable name="filled_groups" select="$short_list/parent::*[&#10;        not(child::*[&#10;            not(@id = $discardable_elements/@id) and&#10;            not(@id = $short_list/@id)&#10;        ])]"/>
Edouard@2877:     <xsl:variable name="groups_to_add" select="$filled_groups[not(ancestor::*/@id = $filled_groups/@id)]"/>
edouard@3161:     <func:result select="$groups_to_add | $short_list[not(ancestor::*/@id = $filled_groups/@id)]"/>
Edouard@2877:   </func:function>
Edouard@2877:   <func:function name="func:detachable_elements">
Edouard@2877:     <xsl:param name="pages"/>
Edouard@2877:     <xsl:choose>
Edouard@2877:       <xsl:when test="$pages">
Edouard@2877:         <func:result select="func:sumarized_elements(func:all_related_elements($pages[1]))&#10;                      | func:detachable_elements($pages[position()!=1])"/>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:otherwise>
Edouard@2877:         <func:result select="/.."/>
Edouard@2877:       </xsl:otherwise>
Edouard@2877:     </xsl:choose>
Edouard@2877:   </func:function>
Edouard@2913:   <xsl:variable name="_detachable_elements" select="func:detachable_elements($hmi_pages | $keypads)"/>
Edouard@2877:   <xsl:variable name="detachable_elements" select="$_detachable_elements[not(ancestor::*/@id = $_detachable_elements/@id)]"/>
edouard@2943:   <declarations:detachable-elements/>
edouard@2943:   <xsl:template match="declarations:detachable-elements">
edouard@2941:     <xsl:text>
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:     <xsl:text>var detachable_elements = {
edouard@2941: </xsl:text>
edouard@2941:     <xsl:for-each select="$detachable_elements">
edouard@2941:       <xsl:text>    "</xsl:text>
edouard@2941:       <xsl:value-of select="@id"/>
edouard@2941:       <xsl:text>":[id("</xsl:text>
edouard@2941:       <xsl:value-of select="@id"/>
edouard@2941:       <xsl:text>"), id("</xsl:text>
edouard@2941:       <xsl:value-of select="../@id"/>
edouard@2941:       <xsl:text>")]</xsl:text>
edouard@2941:       <xsl:if test="position()!=last()">
edouard@2941:         <xsl:text>,</xsl:text>
edouard@2941:       </xsl:if>
edouard@2941:       <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:     </xsl:for-each>
edouard@2941:     <xsl:text>}
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:   </xsl:template>
Edouard@2888:   <xsl:variable name="forEach_widgets_ids" select="$parsed_widgets/widget[@type = 'ForEach']/@id"/>
edouard@3124:   <xsl:variable name="forEach_widgets" select="$hmi_widgets[@id = $forEach_widgets_ids]"/>
Edouard@2888:   <xsl:variable name="in_forEach_widget_ids" select="func:refered_elements($forEach_widgets)[not(@id = $forEach_widgets_ids)]/@id"/>
Edouard@3019:   <xsl:template mode="page_desc" match="svg:*">
Edouard@3118:     <xsl:if test="ancestor::*[@id = $hmi_pages/@id]">
Edouard@3118:       <xsl:message terminate="yes">
Edouard@3118:         <xsl:text>HMI:Page </xsl:text>
Edouard@3118:         <xsl:value-of select="@id"/>
Edouard@3118:         <xsl:text> is nested in another HMI:Page</xsl:text>
Edouard@3118:       </xsl:message>
Edouard@3118:     </xsl:if>
edouard@2886:     <xsl:variable name="desc" select="func:widget(@id)"/>
Edouard@3170:     <xsl:variable name="pagename" select="$desc/arg[1]/@value"/>
Edouard@3170:     <xsl:variable name="msg" select="concat('generating page description ', $pagename)"/>
Edouard@3170:     <xsl:value-of select="ns:ProgressStart($pagename, $msg)"/>
Edouard@2877:     <xsl:variable name="page" select="."/>
Edouard@2877:     <xsl:variable name="p" select="$geometry[@Id = $page/@id]"/>
Edouard@2877:     <xsl:variable name="page_all_elements" select="func:all_related_elements($page)"/>
edouard@3124:     <xsl:variable name="all_page_widgets" select="$hmi_widgets[@id = $page_all_elements/@id and @id != $page/@id]"/>
Edouard@2901:     <xsl:variable name="page_managed_widgets" select="$all_page_widgets[not(@id=$in_forEach_widget_ids)]"/>
Edouard@2901:     <xsl:variable name="page_relative_widgets" select="$page_managed_widgets[func:is_descendant_path(func:widget(@id)/path/@value, $desc/path/@value)]"/>
edouard@3165:     <xsl:variable name="sumarized_page" select="func:sumarized_elements($page_all_elements)"/>
edouard@3165:     <xsl:variable name="required_detachables" select="$sumarized_page/&#10;           ancestor-or-self::*[@id = $detachable_elements/@id]"/>
Edouard@2877:     <xsl:text>  "</xsl:text>
Edouard@3170:     <xsl:value-of select="$pagename"/>
Edouard@2877:     <xsl:text>": {
Edouard@2877: </xsl:text>
Edouard@2877:     <xsl:text>    bbox: [</xsl:text>
Edouard@2877:     <xsl:value-of select="$p/@x"/>
Edouard@2877:     <xsl:text>, </xsl:text>
Edouard@2877:     <xsl:value-of select="$p/@y"/>
Edouard@2877:     <xsl:text>, </xsl:text>
Edouard@2877:     <xsl:value-of select="$p/@w"/>
Edouard@2877:     <xsl:text>, </xsl:text>
Edouard@2877:     <xsl:value-of select="$p/@h"/>
Edouard@2877:     <xsl:text>],
Edouard@2877: </xsl:text>
Edouard@2877:     <xsl:if test="$desc/path/@value">
Edouard@2877:       <xsl:if test="count($desc/path/@index)=0">
Edouard@2877:         <xsl:message terminate="no">
Edouard@2877:           <xsl:text>Page id="</xsl:text>
Edouard@2877:           <xsl:value-of select="$page/@id"/>
Edouard@2877:           <xsl:text>" : No match for path "</xsl:text>
Edouard@2877:           <xsl:value-of select="$desc/path/@value"/>
Edouard@2877:           <xsl:text>" in HMI tree</xsl:text>
Edouard@2877:         </xsl:message>
Edouard@2877:       </xsl:if>
Edouard@2877:       <xsl:text>    page_index: </xsl:text>
Edouard@2877:       <xsl:value-of select="$desc/path/@index"/>
Edouard@2877:       <xsl:text>,
Edouard@2877: </xsl:text>
Edouard@3383:       <xsl:text>    page_class: "</xsl:text>
Edouard@3383:       <xsl:value-of select="$indexed_hmitree/*[@hmipath = $desc/path/@value]/@class"/>
Edouard@3383:       <xsl:text>",
Edouard@3383: </xsl:text>
Edouard@2877:     </xsl:if>
edouard@3005:     <xsl:text>    widgets: [
edouard@3005: </xsl:text>
edouard@3005:     <xsl:for-each select="$page_managed_widgets">
edouard@3005:       <xsl:variable name="widget_paths_relativeness">
edouard@3005:         <xsl:for-each select="func:widget(@id)/path">
edouard@3005:           <xsl:value-of select="func:is_descendant_path(@value, $desc/path/@value)"/>
edouard@3005:           <xsl:if test="position()!=last()">
edouard@3005:             <xsl:text>,</xsl:text>
edouard@3005:           </xsl:if>
edouard@3005:         </xsl:for-each>
edouard@3005:       </xsl:variable>
edouard@3005:       <xsl:text>        [hmi_widgets["</xsl:text>
Edouard@2877:       <xsl:value-of select="@id"/>
edouard@3005:       <xsl:text>"], [</xsl:text>
edouard@3005:       <xsl:value-of select="$widget_paths_relativeness"/>
edouard@3005:       <xsl:text>]]</xsl:text>
Edouard@2877:       <xsl:if test="position()!=last()">
Edouard@2877:         <xsl:text>,</xsl:text>
Edouard@2877:       </xsl:if>
Edouard@2877:       <xsl:text>
Edouard@2877: </xsl:text>
Edouard@2877:     </xsl:for-each>
Edouard@2877:     <xsl:text>    ],
Edouard@2877: </xsl:text>
Edouard@2903:     <xsl:text>    jumps: [
Edouard@2903: </xsl:text>
Edouard@2903:     <xsl:for-each select="$parsed_widgets/widget[@id = $all_page_widgets/@id and @type='Jump']">
Edouard@3112:       <xsl:text>        hmi_widgets["</xsl:text>
Edouard@3112:       <xsl:value-of select="@id"/>
Edouard@3112:       <xsl:text>"]</xsl:text>
Edouard@3112:       <xsl:if test="position()!=last()">
Edouard@3112:         <xsl:text>,</xsl:text>
Edouard@2903:       </xsl:if>
Edouard@3112:       <xsl:text>
Edouard@3112: </xsl:text>
Edouard@2903:     </xsl:for-each>
Edouard@2903:     <xsl:text>    ],
Edouard@2903: </xsl:text>
Edouard@2877:     <xsl:text>    required_detachables: {
Edouard@2877: </xsl:text>
Edouard@2877:     <xsl:for-each select="$required_detachables">
Edouard@2877:       <xsl:text>        "</xsl:text>
Edouard@2877:       <xsl:value-of select="@id"/>
Edouard@2877:       <xsl:text>": detachable_elements["</xsl:text>
Edouard@2877:       <xsl:value-of select="@id"/>
Edouard@2877:       <xsl:text>"]</xsl:text>
Edouard@2877:       <xsl:if test="position()!=last()">
Edouard@2877:         <xsl:text>,</xsl:text>
Edouard@2877:       </xsl:if>
Edouard@2877:       <xsl:text>
Edouard@2877: </xsl:text>
Edouard@2877:     </xsl:for-each>
Edouard@2877:     <xsl:text>    }
Edouard@2877: </xsl:text>
edouard@3238:     <xsl:apply-templates mode="widget_page" select="$parsed_widgets/widget[@id = $all_page_widgets/@id]">
Edouard@2901:       <xsl:with-param name="page_desc" select="$desc"/>
Edouard@2901:     </xsl:apply-templates>
Edouard@2877:     <xsl:text>  }</xsl:text>
Edouard@2877:     <xsl:if test="position()!=last()">
Edouard@2877:       <xsl:text>,</xsl:text>
Edouard@2877:     </xsl:if>
Edouard@2877:     <xsl:text>
Edouard@2877: </xsl:text>
Edouard@3170:     <xsl:value-of select="ns:ProgressEnd($pagename)"/>
Edouard@2877:   </xsl:template>
edouard@3008:   <definitions:page-desc/>
edouard@3008:   <xsl:template match="definitions:page-desc">
edouard@2941:     <xsl:text>
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:     <xsl:text>var page_desc = {
edouard@2941: </xsl:text>
Edouard@3019:     <xsl:apply-templates mode="page_desc" select="$hmi_pages"/>
edouard@2941:     <xsl:text>}
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:   </xsl:template>
edouard@3238:   <xsl:template mode="widget_page" match="*"/>
edouard@2939:   <debug:detachable-pages/>
edouard@2940:   <xsl:template match="debug:detachable-pages">
edouard@2941:     <xsl:text>
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
Edouard@2888:     <xsl:text>DETACHABLES:
Edouard@2888: </xsl:text>
Edouard@2877:     <xsl:for-each select="$detachable_elements">
Edouard@2877:       <xsl:text> </xsl:text>
Edouard@2877:       <xsl:value-of select="@id"/>
Edouard@2877:       <xsl:text>
Edouard@2877: </xsl:text>
Edouard@2877:     </xsl:for-each>
Edouard@2888:     <xsl:text>In Foreach:
Edouard@2888: </xsl:text>
Edouard@2888:     <xsl:for-each select="$in_forEach_widget_ids">
Edouard@2888:       <xsl:text> </xsl:text>
Edouard@2888:       <xsl:value-of select="."/>
Edouard@2888:       <xsl:text>
Edouard@2888: </xsl:text>
Edouard@2888:     </xsl:for-each>
edouard@3165:     <xsl:text>Overlapping 
edouard@3165: </xsl:text>
edouard@3165:     <xsl:apply-templates mode="testtree" select="$overlapping_geometry"/>
edouard@3165:     <xsl:text>
edouard@3165: </xsl:text>
Edouard@2877:   </xsl:template>
Edouard@3031:   <xsl:template xmlns="http://www.w3.org/2000/svg" mode="inline_svg" match="@*">
Edouard@3031:     <xsl:copy/>
Edouard@3031:   </xsl:template>
Edouard@3031:   <xsl:template mode="inline_svg" match="node()">
Edouard@2877:     <xsl:if test="not(@id = $discardable_elements/@id)">
Edouard@2877:       <xsl:copy>
Edouard@3019:         <xsl:apply-templates mode="inline_svg" select="@* | node()"/>
Edouard@2877:       </xsl:copy>
Edouard@2877:     </xsl:if>
Edouard@2877:   </xsl:template>
Edouard@3019:   <xsl:template mode="inline_svg" match="svg:svg/@width"/>
Edouard@3019:   <xsl:template mode="inline_svg" match="svg:svg/@height"/>
Edouard@3019:   <xsl:template xmlns="http://www.w3.org/2000/svg" mode="inline_svg" match="svg:svg">
Edouard@2877:     <svg>
Edouard@2877:       <xsl:attribute name="preserveAspectRatio">
Edouard@2877:         <xsl:text>none</xsl:text>
Edouard@2877:       </xsl:attribute>
Edouard@2877:       <xsl:attribute name="height">
Edouard@2877:         <xsl:text>100vh</xsl:text>
Edouard@2877:       </xsl:attribute>
Edouard@2877:       <xsl:attribute name="width">
Edouard@2877:         <xsl:text>100vw</xsl:text>
Edouard@2877:       </xsl:attribute>
Edouard@3019:       <xsl:apply-templates mode="inline_svg" select="@* | node()"/>
Edouard@2877:     </svg>
Edouard@2877:   </xsl:template>
Edouard@3019:   <xsl:template mode="inline_svg" match="svg:svg[@viewBox!=concat('0 0 ', @width, ' ', @height)]">
Edouard@2877:     <xsl:message terminate="yes">
Edouard@2877:       <xsl:text>ViewBox settings other than X=0, Y=0 and Scale=1 are not supported</xsl:text>
Edouard@2877:     </xsl:message>
Edouard@2877:   </xsl:template>
Edouard@3019:   <xsl:template mode="inline_svg" match="sodipodi:namedview[@units!='px' or @inkscape:document-units!='px']">
Edouard@2877:     <xsl:message terminate="yes">
Edouard@2877:       <xsl:text>All units must be set to "px" in Inkscape's document properties</xsl:text>
Edouard@2877:     </xsl:message>
Edouard@2877:   </xsl:template>
Edouard@3112:   <xsl:template xmlns="http://www.w3.org/2000/svg" mode="inline_svg" match="svg:text/@inkscape:label[starts-with(., '_')]">
Edouard@3112:     <xsl:attribute name="{name()}">
Edouard@3112:       <xsl:value-of select="substring(., 2)"/>
Edouard@3112:     </xsl:attribute>
Edouard@3112:   </xsl:template>
Edouard@3031:   <xsl:variable name="targets_not_to_unlink" select="$hmi_lists/descendant-or-self::svg:*"/>
Edouard@3387:   <xsl:variable name="to_unlink" select="$hmi_widgets/descendant-or-self::svg:use"/>
Edouard@3031:   <func:function name="func:is_unlinkable">
Edouard@3031:     <xsl:param name="targetid"/>
Edouard@3031:     <xsl:param name="eltid"/>
Edouard@3031:     <func:result select="$eltid = $to_unlink/@id and not($targetid = $targets_not_to_unlink/@id)"/>
Edouard@3031:   </func:function>
Edouard@3019:   <xsl:template xmlns="http://www.w3.org/2000/svg" mode="inline_svg" match="svg:use">
edouard@2996:     <xsl:variable name="targetid" select="substring-after(@xlink:href,'#')"/>
Edouard@2877:     <xsl:choose>
Edouard@3031:       <xsl:when test="func:is_unlinkable($targetid, @id)">
edouard@2996:         <xsl:call-template name="unlink_clone">
edouard@2996:           <xsl:with-param name="targetid" select="$targetid"/>
edouard@2996:         </xsl:call-template>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:otherwise>
Edouard@2877:         <xsl:copy>
Edouard@3031:           <xsl:apply-templates mode="inline_svg" select="@*"/>
Edouard@2877:         </xsl:copy>
Edouard@2877:       </xsl:otherwise>
Edouard@2877:     </xsl:choose>
Edouard@2877:   </xsl:template>
Edouard@2877:   <xsl:variable name="_excluded_use_attrs">
Edouard@2877:     <name>
Edouard@2877:       <xsl:text>href</xsl:text>
Edouard@2877:     </name>
Edouard@2877:     <name>
Edouard@2877:       <xsl:text>width</xsl:text>
Edouard@2877:     </name>
Edouard@2877:     <name>
Edouard@2877:       <xsl:text>height</xsl:text>
Edouard@2877:     </name>
Edouard@2877:     <name>
Edouard@2877:       <xsl:text>x</xsl:text>
Edouard@2877:     </name>
Edouard@2877:     <name>
Edouard@2877:       <xsl:text>y</xsl:text>
Edouard@2877:     </name>
usveticic@3045:     <name>
usveticic@3045:       <xsl:text>id</xsl:text>
usveticic@3045:     </name>
Edouard@2877:   </xsl:variable>
Edouard@2877:   <xsl:variable name="excluded_use_attrs" select="exsl:node-set($_excluded_use_attrs)"/>
Edouard@2969:   <xsl:variable name="_merge_use_attrs">
Edouard@2969:     <name>
Edouard@2969:       <xsl:text>transform</xsl:text>
Edouard@2969:     </name>
Edouard@2969:     <name>
Edouard@2969:       <xsl:text>style</xsl:text>
Edouard@2969:     </name>
Edouard@2969:   </xsl:variable>
Edouard@2969:   <xsl:variable name="merge_use_attrs" select="exsl:node-set($_merge_use_attrs)"/>
Edouard@2877:   <xsl:template xmlns="http://www.w3.org/2000/svg" name="unlink_clone">
edouard@2996:     <xsl:param name="targetid"/>
Edouard@3031:     <xsl:param name="seed" select="''"/>
Edouard@2969:     <xsl:variable name="target" select="//svg:*[@id = $targetid]"/>
Edouard@3031:     <xsl:variable name="seeded_id">
Edouard@3031:       <xsl:choose>
Edouard@3031:         <xsl:when test="string-length($seed) &gt; 0">
Edouard@3031:           <xsl:value-of select="$seed"/>
Edouard@3031:           <xsl:text>_</xsl:text>
Edouard@3031:           <xsl:value-of select="@id"/>
Edouard@3031:         </xsl:when>
Edouard@3031:         <xsl:otherwise>
Edouard@3031:           <xsl:value-of select="@id"/>
Edouard@3031:         </xsl:otherwise>
Edouard@3031:       </xsl:choose>
Edouard@3031:     </xsl:variable>
Edouard@2877:     <g>
usveticic@3045:       <xsl:attribute name="id">
usveticic@3045:         <xsl:value-of select="$seeded_id"/>
usveticic@3045:       </xsl:attribute>
Edouard@3031:       <xsl:attribute name="original">
Edouard@3031:         <xsl:value-of select="@id"/>
Edouard@3031:       </xsl:attribute>
Edouard@2969:       <xsl:choose>
Edouard@2969:         <xsl:when test="$target[self::svg:g]">
Edouard@2969:           <xsl:for-each select="@*[not(local-name() = $excluded_use_attrs/name | $merge_use_attrs)]">
Edouard@2969:             <xsl:attribute name="{name()}">
Edouard@2969:               <xsl:value-of select="."/>
Edouard@2969:             </xsl:attribute>
Edouard@2969:           </xsl:for-each>
Edouard@2969:           <xsl:if test="@style | $target/@style">
Edouard@2969:             <xsl:attribute name="style">
Edouard@2969:               <xsl:value-of select="@style"/>
Edouard@2969:               <xsl:if test="@style and $target/@style">
Edouard@2969:                 <xsl:text>;</xsl:text>
Edouard@2969:               </xsl:if>
Edouard@2969:               <xsl:value-of select="$target/@style"/>
Edouard@2969:             </xsl:attribute>
Edouard@2969:           </xsl:if>
Edouard@2969:           <xsl:if test="@transform | $target/@transform">
Edouard@2969:             <xsl:attribute name="transform">
Edouard@2969:               <xsl:value-of select="@transform"/>
Edouard@2969:               <xsl:if test="@transform and $target/@transform">
Edouard@2969:                 <xsl:text> </xsl:text>
Edouard@2969:               </xsl:if>
Edouard@2969:               <xsl:value-of select="$target/@transform"/>
Edouard@2969:             </xsl:attribute>
Edouard@2969:           </xsl:if>
Edouard@3019:           <xsl:apply-templates mode="unlink_clone" select="$target/*">
Edouard@3031:             <xsl:with-param name="seed" select="$seeded_id"/>
Edouard@2969:           </xsl:apply-templates>
Edouard@2969:         </xsl:when>
Edouard@2969:         <xsl:otherwise>
Edouard@2969:           <xsl:for-each select="@*[not(local-name() = $excluded_use_attrs/name)]">
Edouard@2969:             <xsl:attribute name="{name()}">
Edouard@2969:               <xsl:value-of select="."/>
Edouard@2969:             </xsl:attribute>
Edouard@2969:           </xsl:for-each>
Edouard@3019:           <xsl:apply-templates mode="unlink_clone" select="$target">
Edouard@3031:             <xsl:with-param name="seed" select="$seeded_id"/>
Edouard@2969:           </xsl:apply-templates>
Edouard@2969:         </xsl:otherwise>
Edouard@2969:       </xsl:choose>
Edouard@2877:     </g>
Edouard@2877:   </xsl:template>
Edouard@3019:   <xsl:template xmlns="http://www.w3.org/2000/svg" mode="unlink_clone" match="@id">
Edouard@2877:     <xsl:param name="seed"/>
Edouard@2877:     <xsl:attribute name="id">
Edouard@2877:       <xsl:value-of select="$seed"/>
Edouard@2877:       <xsl:text>_</xsl:text>
Edouard@2877:       <xsl:value-of select="."/>
Edouard@2877:     </xsl:attribute>
Edouard@3031:     <xsl:attribute name="original">
Edouard@3031:       <xsl:value-of select="."/>
Edouard@3031:     </xsl:attribute>
Edouard@2877:   </xsl:template>
Edouard@3019:   <xsl:template xmlns="http://www.w3.org/2000/svg" mode="unlink_clone" match="@*">
Edouard@2877:     <xsl:copy/>
Edouard@2877:   </xsl:template>
usveticic@3045:   <xsl:template xmlns="http://www.w3.org/2000/svg" mode="unlink_clone" match="svg:use">
usveticic@3045:     <xsl:param name="seed"/>
Edouard@3031:     <xsl:variable name="targetid" select="substring-after(@xlink:href,'#')"/>
Edouard@3031:     <xsl:choose>
Edouard@3031:       <xsl:when test="func:is_unlinkable($targetid, @id)">
Edouard@3031:         <xsl:call-template name="unlink_clone">
Edouard@3031:           <xsl:with-param name="targetid" select="$targetid"/>
Edouard@3031:           <xsl:with-param name="seed" select="$seed"/>
Edouard@3031:         </xsl:call-template>
Edouard@3031:       </xsl:when>
Edouard@3031:       <xsl:otherwise>
Edouard@3031:         <xsl:copy>
Edouard@3031:           <xsl:apply-templates mode="unlink_clone" select="@*">
Edouard@3031:             <xsl:with-param name="seed" select="$seed"/>
Edouard@3031:           </xsl:apply-templates>
Edouard@3031:         </xsl:copy>
Edouard@3031:       </xsl:otherwise>
Edouard@3031:     </xsl:choose>
usveticic@3045:   </xsl:template>
Edouard@3019:   <xsl:template xmlns="http://www.w3.org/2000/svg" mode="unlink_clone" match="svg:*">
Edouard@2877:     <xsl:param name="seed"/>
Edouard@2877:     <xsl:choose>
Edouard@3410:       <xsl:when test="@id = $hmi_widgets/@id">
Edouard@2877:         <use>
Edouard@2877:           <xsl:attribute name="xlink:href">
Edouard@2877:             <xsl:value-of select="concat('#',@id)"/>
Edouard@2877:           </xsl:attribute>
Edouard@2877:         </use>
Edouard@2877:       </xsl:when>
Edouard@2877:       <xsl:otherwise>
Edouard@2877:         <xsl:copy>
Edouard@3019:           <xsl:apply-templates mode="unlink_clone" select="@* | node()">
Edouard@2877:             <xsl:with-param name="seed" select="$seed"/>
Edouard@2877:           </xsl:apply-templates>
Edouard@2877:         </xsl:copy>
Edouard@2877:       </xsl:otherwise>
Edouard@2877:     </xsl:choose>
Edouard@2877:   </xsl:template>
Edouard@2877:   <xsl:variable name="result_svg">
Edouard@3019:     <xsl:apply-templates mode="inline_svg" select="/"/>
Edouard@2877:   </xsl:variable>
Edouard@2877:   <xsl:variable name="result_svg_ns" select="exsl:node-set($result_svg)"/>
edouard@2941:   <preamble:inline-svg/>
edouard@2941:   <xsl:template match="preamble:inline-svg">
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:     <xsl:text>let id = document.getElementById.bind(document);
edouard@2941: </xsl:text>
edouard@2941:     <xsl:text>var svg_root = id("</xsl:text>
edouard@2941:     <xsl:value-of select="$svg/@id"/>
edouard@2941:     <xsl:text>");
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:   </xsl:template>
edouard@2941:   <debug:clone-unlinking/>
edouard@2941:   <xsl:template match="debug:clone-unlinking">
edouard@2941:     <xsl:text>
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2904:     <xsl:text>Unlinked :
edouard@2904: </xsl:text>
Edouard@2878:     <xsl:for-each select="$to_unlink">
Edouard@2878:       <xsl:value-of select="@id"/>
Edouard@2878:       <xsl:text>
Edouard@2878: </xsl:text>
Edouard@2878:     </xsl:for-each>
edouard@2996:     <xsl:text>Not to unlink :
edouard@2996: </xsl:text>
edouard@2996:     <xsl:for-each select="$targets_not_to_unlink">
edouard@2996:       <xsl:value-of select="@id"/>
edouard@2996:       <xsl:text>
edouard@2996: </xsl:text>
edouard@2996:     </xsl:for-each>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
Edouard@2878:   </xsl:template>
Edouard@3112:   <xsl:template mode="extract_i18n" match="svg:tspan">
Edouard@3112:     <xsl:if test="string-length(.) &gt; 0">
Edouard@3112:       <line>
Edouard@3112:         <xsl:value-of select="."/>
Edouard@3112:       </line>
Edouard@3112:     </xsl:if>
Edouard@3112:   </xsl:template>
Edouard@3112:   <xsl:template mode="extract_i18n" match="svg:text">
Edouard@3112:     <msg>
Edouard@3112:       <xsl:attribute name="id">
Edouard@3112:         <xsl:value-of select="@id"/>
Edouard@3112:       </xsl:attribute>
Edouard@3112:       <xsl:attribute name="label">
Edouard@3112:         <xsl:value-of select="substring(@inkscape:label,2)"/>
Edouard@3112:       </xsl:attribute>
Edouard@3112:       <xsl:apply-templates mode="extract_i18n" select="svg:*"/>
Edouard@3112:     </msg>
Edouard@3112:   </xsl:template>
Edouard@3112:   <xsl:variable name="translatable_texts" select="//svg:text[starts-with(@inkscape:label, '_')]"/>
Edouard@3112:   <xsl:variable name="translatable_strings">
Edouard@3112:     <xsl:apply-templates mode="extract_i18n" select="$translatable_texts"/>
Edouard@3112:   </xsl:variable>
Edouard@3112:   <preamble:i18n/>
Edouard@3112:   <xsl:template match="preamble:i18n">
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>/* </xsl:text>
Edouard@3112:     <xsl:value-of select="local-name()"/>
Edouard@3112:     <xsl:text> */
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:variable name="translations" select="ns:GetTranslations($translatable_strings)"/>
Edouard@3150:     <xsl:text>var langs = [ ["Default", "C"],</xsl:text>
Edouard@3116:     <xsl:for-each select="$translations/langs/lang">
Edouard@3150:       <xsl:text>["</xsl:text>
Edouard@3116:       <xsl:value-of select="."/>
Edouard@3150:       <xsl:text>","</xsl:text>
Edouard@3150:       <xsl:value-of select="@code"/>
Edouard@3150:       <xsl:text>"]</xsl:text>
Edouard@3116:       <xsl:if test="position()!=last()">
Edouard@3116:         <xsl:text>,</xsl:text>
Edouard@3116:       </xsl:if>
Edouard@3116:     </xsl:for-each>
Edouard@3116:     <xsl:text>];
Edouard@3116: </xsl:text>
Edouard@3116:     <xsl:text>var translations = [
Edouard@3116: </xsl:text>
Edouard@3116:     <xsl:for-each select="$translatable_texts">
Edouard@3116:       <xsl:variable name="n" select="position()"/>
edouard@3128:       <xsl:variable name="current_id" select="@id"/>
edouard@3128:       <xsl:variable name="text_unlinked_uses" select="$result_svg_ns//svg:text[@original = $current_id]/@id"/>
edouard@3128:       <xsl:text>  [[</xsl:text>
edouard@3128:       <xsl:for-each select="@id | $text_unlinked_uses">
edouard@3128:         <xsl:text>id("</xsl:text>
edouard@3128:         <xsl:value-of select="."/>
edouard@3128:         <xsl:text>")</xsl:text>
edouard@3128:         <xsl:if test="position()!=last()">
edouard@3128:           <xsl:text>,</xsl:text>
edouard@3128:         </xsl:if>
edouard@3128:       </xsl:for-each>
edouard@3128:       <xsl:text>],[</xsl:text>
Edouard@3116:       <xsl:for-each select="$translations/messages/msgid[$n]/msg">
Edouard@3116:         <xsl:text>"</xsl:text>
Edouard@3116:         <xsl:for-each select="line">
Edouard@3116:           <xsl:value-of select="."/>
Edouard@3116:           <xsl:if test="position()!=last()">
Edouard@3116:             <xsl:text>\n</xsl:text>
Edouard@3116:           </xsl:if>
Edouard@3116:         </xsl:for-each>
Edouard@3116:         <xsl:text>"</xsl:text>
Edouard@3116:         <xsl:if test="position()!=last()">
Edouard@3116:           <xsl:text>,</xsl:text>
Edouard@3116:         </xsl:if>
Edouard@3116:       </xsl:for-each>
Edouard@3116:       <xsl:text>]]</xsl:text>
Edouard@3112:       <xsl:if test="position()!=last()">
Edouard@3112:         <xsl:text>,</xsl:text>
Edouard@3112:       </xsl:if>
Edouard@3112:       <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     </xsl:for-each>
Edouard@3116:     <xsl:text>]
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:   </xsl:template>
Edouard@3019:   <xsl:template mode="hmi_widgets" match="svg:*">
edouard@2886:     <xsl:variable name="widget" select="func:widget(@id)"/>
Edouard@2881:     <xsl:variable name="eltid" select="@id"/>
edouard@2954:     <xsl:variable name="args">
edouard@2954:       <xsl:for-each select="$widget/arg">
edouard@2954:         <xsl:text>"</xsl:text>
Edouard@3024:         <xsl:value-of select="func:escape_quotes(@value)"/>
edouard@2954:         <xsl:text>"</xsl:text>
edouard@2954:         <xsl:if test="position()!=last()">
edouard@2954:           <xsl:text>,</xsl:text>
edouard@2954:         </xsl:if>
edouard@2954:       </xsl:for-each>
edouard@2954:     </xsl:variable>
edouard@2954:     <xsl:variable name="indexes">
edouard@2954:       <xsl:for-each select="$widget/path">
edouard@2954:         <xsl:choose>
edouard@2954:           <xsl:when test="not(@index)">
edouard@3017:             <xsl:choose>
edouard@3017:               <xsl:when test="not(@type)">
Edouard@3058:                 <xsl:message terminate="no">
edouard@3017:                   <xsl:text>Widget </xsl:text>
edouard@3017:                   <xsl:value-of select="$widget/@type"/>
edouard@3017:                   <xsl:text> id="</xsl:text>
edouard@3017:                   <xsl:value-of select="$eltid"/>
edouard@3017:                   <xsl:text>" : No match for path "</xsl:text>
edouard@3017:                   <xsl:value-of select="@value"/>
edouard@3017:                   <xsl:text>" in HMI tree</xsl:text>
edouard@3017:                 </xsl:message>
Edouard@3058:                 <xsl:text>undefined</xsl:text>
edouard@3017:               </xsl:when>
edouard@3017:               <xsl:when test="@type = 'PAGE_LOCAL'">
edouard@3017:                 <xsl:text>"</xsl:text>
Edouard@3025:                 <xsl:value-of select="@value"/>
edouard@3017:                 <xsl:text>"</xsl:text>
edouard@3017:               </xsl:when>
edouard@3017:               <xsl:when test="@type = 'HMI_LOCAL'">
edouard@3017:                 <xsl:text>hmi_local_index("</xsl:text>
edouard@3017:                 <xsl:value-of select="@value"/>
edouard@3017:                 <xsl:text>")</xsl:text>
edouard@3017:               </xsl:when>
edouard@3103:               <xsl:otherwise>
edouard@3103:                 <xsl:message terminate="yes">
edouard@3103:                   <xsl:text>Internal error while processing widget's non indexed HMI tree path : unknown type</xsl:text>
edouard@3103:                 </xsl:message>
edouard@3103:               </xsl:otherwise>
edouard@3017:             </xsl:choose>
edouard@2954:           </xsl:when>
edouard@2954:           <xsl:otherwise>
edouard@2954:             <xsl:value-of select="@index"/>
edouard@2954:           </xsl:otherwise>
edouard@2954:         </xsl:choose>
edouard@3103:         <xsl:if test="position()!=last()">
edouard@3103:           <xsl:text>,</xsl:text>
edouard@3103:         </xsl:if>
edouard@3103:       </xsl:for-each>
edouard@3103:     </xsl:variable>
edouard@3103:     <xsl:variable name="minmaxes">
edouard@3103:       <xsl:for-each select="$widget/path">
edouard@3103:         <xsl:choose>
edouard@3103:           <xsl:when test="@min and @max">
edouard@3103:             <xsl:text>[</xsl:text>
edouard@3103:             <xsl:value-of select="@min"/>
edouard@3103:             <xsl:text>,</xsl:text>
edouard@3103:             <xsl:value-of select="@max"/>
edouard@3103:             <xsl:text>]</xsl:text>
edouard@3103:           </xsl:when>
edouard@3103:           <xsl:otherwise>
edouard@3103:             <xsl:text>undefined</xsl:text>
edouard@3103:           </xsl:otherwise>
edouard@3103:         </xsl:choose>
edouard@3103:         <xsl:if test="position()!=last()">
edouard@3103:           <xsl:text>,</xsl:text>
edouard@3103:         </xsl:if>
edouard@2954:       </xsl:for-each>
edouard@2954:     </xsl:variable>
Edouard@3410:     <xsl:variable name="freq">
Edouard@3410:       <xsl:choose>
edouard@3414:         <xsl:when test="$widget/@freq">
edouard@3414:           <xsl:value-of select="$widget/@freq"/>
Edouard@3410:         </xsl:when>
Edouard@3410:         <xsl:otherwise>
Edouard@3410:           <xsl:text>undefined</xsl:text>
Edouard@3410:         </xsl:otherwise>
Edouard@3410:       </xsl:choose>
Edouard@3410:     </xsl:variable>
Edouard@2881:     <xsl:text>  "</xsl:text>
Edouard@2881:     <xsl:value-of select="@id"/>
edouard@2949:     <xsl:text>": new </xsl:text>
Edouard@2881:     <xsl:value-of select="$widget/@type"/>
edouard@2954:     <xsl:text>Widget ("</xsl:text>
Edouard@2881:     <xsl:value-of select="@id"/>
Edouard@3410:     <xsl:text>",</xsl:text>
Edouard@3410:     <xsl:value-of select="$freq"/>
Edouard@3410:     <xsl:text>,[</xsl:text>
edouard@2954:     <xsl:value-of select="$args"/>
edouard@2954:     <xsl:text>],[</xsl:text>
edouard@2954:     <xsl:value-of select="$indexes"/>
edouard@3103:     <xsl:text>],[</xsl:text>
edouard@3103:     <xsl:value-of select="$minmaxes"/>
edouard@2954:     <xsl:text>],{
Edouard@2881: </xsl:text>
Edouard@3019:     <xsl:apply-templates mode="widget_defs" select="$widget">
Edouard@2881:       <xsl:with-param name="hmi_element" select="."/>
Edouard@2881:     </xsl:apply-templates>
edouard@2949:     <xsl:text>  })</xsl:text>
Edouard@2881:     <xsl:if test="position()!=last()">
Edouard@2881:       <xsl:text>,</xsl:text>
Edouard@2881:     </xsl:if>
Edouard@2881:     <xsl:text>
Edouard@2793: </xsl:text>
Edouard@2792:   </xsl:template>
edouard@3017:   <preamble:local-variable-indexes/>
edouard@3017:   <xsl:template match="preamble:local-variable-indexes">
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
Edouard@3147:     <xsl:text>
Edouard@3147: </xsl:text>
edouard@3017:     <xsl:text>let hmi_locals = {};
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>var last_remote_index = hmitree_types.length - 1;
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>var next_available_index = hmitree_types.length;
edouard@3017: </xsl:text>
edouard@3128:     <xsl:text>let cookies = new Map(document.cookie.split("; ").map(s=&gt;s.split("=")));
edouard@3128: </xsl:text>
edouard@3017:     <xsl:text>
edouard@3017: </xsl:text>
Edouard@3024:     <xsl:text>const local_defaults = {
Edouard@3024: </xsl:text>
edouard@3128:     <xsl:for-each select="$parsed_widgets/widget[starts-with(@type,'VarInit')]">
Edouard@3024:       <xsl:if test="count(path) != 1">
Edouard@3024:         <xsl:message terminate="yes">
Edouard@3024:           <xsl:text>VarInit </xsl:text>
Edouard@3024:           <xsl:value-of select="@id"/>
Edouard@3024:           <xsl:text> must have only one variable given.</xsl:text>
Edouard@3024:         </xsl:message>
Edouard@3024:       </xsl:if>
Edouard@3024:       <xsl:if test="path/@type != 'PAGE_LOCAL' and path/@type != 'HMI_LOCAL'">
Edouard@3024:         <xsl:message terminate="yes">
Edouard@3024:           <xsl:text>VarInit </xsl:text>
Edouard@3024:           <xsl:value-of select="@id"/>
Edouard@3024:           <xsl:text> only applies to HMI variable.</xsl:text>
Edouard@3024:         </xsl:message>
Edouard@3024:       </xsl:if>
edouard@3128:       <xsl:text>    "</xsl:text>
Edouard@3024:       <xsl:value-of select="path/@value"/>
Edouard@3025:       <xsl:text>":</xsl:text>
edouard@3128:       <xsl:choose>
edouard@3128:         <xsl:when test="@type = 'VarInitPersistent'">
edouard@3128:           <xsl:text>cookies.has("</xsl:text>
edouard@3128:           <xsl:value-of select="path/@value"/>
edouard@3128:           <xsl:text>")?cookies.get("</xsl:text>
edouard@3128:           <xsl:value-of select="path/@value"/>
edouard@3128:           <xsl:text>"):</xsl:text>
edouard@3128:           <xsl:value-of select="arg[1]/@value"/>
edouard@3128:         </xsl:when>
edouard@3128:         <xsl:otherwise>
edouard@3128:           <xsl:value-of select="arg[1]/@value"/>
edouard@3128:         </xsl:otherwise>
edouard@3128:       </xsl:choose>
edouard@3128:       <xsl:text>
edouard@3128: </xsl:text>
edouard@3128:       <xsl:if test="position()!=last()">
edouard@3128:         <xsl:text>,</xsl:text>
edouard@3128:       </xsl:if>
edouard@3128:     </xsl:for-each>
edouard@3128:     <xsl:text>};
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>const persistent_locals = new Set([
edouard@3128: </xsl:text>
edouard@3128:     <xsl:for-each select="$parsed_widgets/widget[@type='VarInitPersistent']">
edouard@3128:       <xsl:text>   "</xsl:text>
edouard@3128:       <xsl:value-of select="path/@value"/>
edouard@3128:       <xsl:text>"</xsl:text>
Edouard@3024:       <xsl:if test="position()!=last()">
Edouard@3024:         <xsl:text>,</xsl:text>
Edouard@3024:       </xsl:if>
Edouard@3024:       <xsl:text>
Edouard@3024: </xsl:text>
Edouard@3024:     </xsl:for-each>
edouard@3128:     <xsl:text>]);
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>var persistent_indexes = new Map();
Edouard@3024: </xsl:text>
Edouard@3022:     <xsl:text>var cache = hmitree_types.map(_ignored =&gt; undefined);
Edouard@3022: </xsl:text>
edouard@3154:     <xsl:text>var updates = new Map();
Edouard@3147: </xsl:text>
Edouard@3022:     <xsl:text>
Edouard@3022: </xsl:text>
edouard@3017:     <xsl:text>function page_local_index(varname, pagename){
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>    let pagevars = hmi_locals[pagename];
edouard@3017: </xsl:text>
Edouard@3022:     <xsl:text>    let new_index;
Edouard@3022: </xsl:text>
edouard@3017:     <xsl:text>    if(pagevars == undefined){
edouard@3017: </xsl:text>
Edouard@3022:     <xsl:text>        new_index = next_available_index++;
Edouard@3022: </xsl:text>
Edouard@3022:     <xsl:text>        hmi_locals[pagename] = {[varname]:new_index}
Edouard@3022: </xsl:text>
edouard@3017:     <xsl:text>    } else {
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>        let result = pagevars[varname];
edouard@3017: </xsl:text>
Edouard@3022:     <xsl:text>        if(result != undefined) {
Edouard@3022: </xsl:text>
Edouard@3022:     <xsl:text>            return result;
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>        }
edouard@3017: </xsl:text>
Edouard@3022:     <xsl:text>
Edouard@3022: </xsl:text>
Edouard@3022:     <xsl:text>        new_index = next_available_index++;
Edouard@3022: </xsl:text>
Edouard@3022:     <xsl:text>        pagevars[varname] = new_index;
Edouard@3022: </xsl:text>
edouard@3017:     <xsl:text>    }
edouard@3017: </xsl:text>
Edouard@3025:     <xsl:text>    let defaultval = local_defaults[varname];
Edouard@3025: </xsl:text>
edouard@3128:     <xsl:text>    if(defaultval != undefined) {
Edouard@3025: </xsl:text>
Edouard@3025:     <xsl:text>        cache[new_index] = defaultval; 
Edouard@3025: </xsl:text>
edouard@3154:     <xsl:text>        updates.set(new_index, defaultval);
edouard@3141: </xsl:text>
edouard@3128:     <xsl:text>        if(persistent_locals.has(varname))
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>            persistent_indexes.set(new_index, varname);
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>    }
edouard@3128: </xsl:text>
Edouard@3022:     <xsl:text>    return new_index;
Edouard@3022: </xsl:text>
edouard@3017:     <xsl:text>}
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>function hmi_local_index(varname){
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>    return page_local_index(varname, "HMI_LOCAL");
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>}
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>
edouard@3017: </xsl:text>
edouard@3017:   </xsl:template>
edouard@3017:   <preamble:widget-base-class/>
edouard@3017:   <xsl:template match="preamble:widget-base-class">
edouard@3017:     <xsl:text>
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>/* </xsl:text>
edouard@3017:     <xsl:value-of select="local-name()"/>
edouard@3017:     <xsl:text> */
edouard@3017: </xsl:text>
edouard@3017:     <xsl:text>
edouard@3017: </xsl:text>
Edouard@3019:     <xsl:text>var pending_widget_animates = [];
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>
Edouard@3019: </xsl:text>
edouard@2949:     <xsl:text>class Widget {
edouard@2949: </xsl:text>
edouard@2962:     <xsl:text>    offset = 0;
edouard@2962: </xsl:text>
edouard@2962:     <xsl:text>    frequency = 10; /* FIXME arbitrary default max freq. Obtain from config ? */
edouard@2962: </xsl:text>
Edouard@2980:     <xsl:text>    unsubscribable = false;
Edouard@2980: </xsl:text>
Edouard@3019:     <xsl:text>    pending_animate = false;
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>
Edouard@3019: </xsl:text>
Edouard@3410:     <xsl:text>    constructor(elt_id, freq, args, indexes, minmaxes, members){
edouard@2954: </xsl:text>
edouard@2961:     <xsl:text>        this.element_id = elt_id;
edouard@2961: </xsl:text>
edouard@2954:     <xsl:text>        this.element = id(elt_id);
edouard@2954: </xsl:text>
Edouard@3410:     <xsl:text>        if(freq !== undefined) this.frequency = freq;
Edouard@3410: </xsl:text>
edouard@2954:     <xsl:text>        this.args = args;
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>        this.indexes = indexes;
edouard@2954: </xsl:text>
edouard@3103:     <xsl:text>        this.minmaxes = minmaxes;
edouard@3103: </xsl:text>
edouard@2949:     <xsl:text>        Object.keys(members).forEach(prop =&gt; this[prop]=members[prop]);
edouard@2949: </xsl:text>
edouard@3141:     <xsl:text>        this.lastapply = indexes.map(() =&gt; undefined);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.inhibit = indexes.map(() =&gt; undefined);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.pending = indexes.map(() =&gt; undefined);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.bound_unhinibit = this.unhinibit.bind(this);
edouard@3141: </xsl:text>
edouard@2949:     <xsl:text>    }
edouard@2949: </xsl:text>
edouard@2961:     <xsl:text>
edouard@2961: </xsl:text>
edouard@2954:     <xsl:text>    unsub(){
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>        /* remove subsribers */
edouard@2954: </xsl:text>
edouard@3005:     <xsl:text>        if(!this.unsubscribable)
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            for(let i = 0; i &lt; this.indexes.length; i++) {
edouard@3005: </xsl:text>
edouard@3141:     <xsl:text>                /* flush updates pending because of inhibition */
edouard@3141: </xsl:text>
Edouard@3147:     <xsl:text>                let inhibition = this.inhibit[i];
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                if(inhibition != undefined){
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                    clearTimeout(inhibition);
edouard@3141: </xsl:text>
Edouard@3147:     <xsl:text>                    this.lastapply[i] = undefined;
Edouard@3147: </xsl:text>
Edouard@3147:     <xsl:text>                    this.unhinibit(i);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                }
edouard@3141: </xsl:text>
edouard@3005:     <xsl:text>                let index = this.indexes[i];
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                if(this.relativeness[i])
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                    index += this.offset;
edouard@3005: </xsl:text>
Edouard@3022:     <xsl:text>                subscribers(index).delete(this);
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.offset = 0;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.relativeness = undefined;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>
edouard@3005: </xsl:text>
edouard@3017:     <xsl:text>    sub(new_offset=0, relativeness, container_id){
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.offset = new_offset;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.relativeness = relativeness;
edouard@3005: </xsl:text>
edouard@3017:     <xsl:text>        this.container_id = container_id ;
edouard@3017: </xsl:text>
edouard@3005:     <xsl:text>        /* add this's subsribers */
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        if(!this.unsubscribable)
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            for(let i = 0; i &lt; this.indexes.length; i++) {
edouard@3005: </xsl:text>
edouard@3017:     <xsl:text>                let index = this.get_variable_index(i);
edouard@3017: </xsl:text>
Edouard@3058:     <xsl:text>                if(index == undefined) continue;
Edouard@3058: </xsl:text>
Edouard@3022:     <xsl:text>                subscribers(index).add(this);
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        need_cache_apply.push(this); 
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    apply_cache() {
edouard@3005: </xsl:text>
Edouard@3026:     <xsl:text>        if(!this.unsubscribable) for(let index in this.indexes){
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            /* dispatch current cache in newly opened page widgets */
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            let realindex = this.get_variable_index(index);
Edouard@3026: </xsl:text>
Edouard@3058:     <xsl:text>            if(realindex == undefined) continue;
Edouard@3058: </xsl:text>
Edouard@3026:     <xsl:text>            let cached_val = cache[realindex];
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            if(cached_val != undefined)
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>                this._dispatch(cached_val, cached_val, index);
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    get_variable_index(varnum) {
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        let index = this.indexes[varnum];
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        if(typeof(index) == "string"){
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            index = page_local_index(index, this.container_id);
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        } else {
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            if(this.relativeness[varnum]){
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>                index += this.offset;
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        return index;
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    }
Edouard@3026: </xsl:text>
edouard@3097:     <xsl:text>
edouard@3097: </xsl:text>
edouard@3103:     <xsl:text>    overshot(new_val, max) {
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>    }
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>    undershot(new_val, min) {
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>    }
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>    clip_min_max(index, new_val) {
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>        let minmax = this.minmaxes[index];
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>        if(minmax !== undefined &amp;&amp; typeof new_val == "number") {
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>            let [min,max] = minmax;
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>            if(new_val &lt; min){
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>                this.undershot(new_val, min);
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>                return min;
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>            }
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>            if(new_val &gt; max){
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>                this.overshot(new_val, max);
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>                return max;
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>            }
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>        }
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>        return new_val;
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>    }
edouard@3103: </xsl:text>
edouard@3103:     <xsl:text>
edouard@3103: </xsl:text>
Edouard@3058:     <xsl:text>    change_hmi_value(index, opstr) {
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        let realindex = this.get_variable_index(index);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        if(realindex == undefined) return undefined;
Edouard@3058: </xsl:text>
edouard@3097:     <xsl:text>        let old_val = cache[realindex];
edouard@3097: </xsl:text>
edouard@3097:     <xsl:text>        let new_val = eval_operation_string(old_val, opstr);
edouard@3097: </xsl:text>
edouard@3103:     <xsl:text>        new_val = this.clip_min_max(index, new_val);
edouard@3103: </xsl:text>
edouard@3097:     <xsl:text>        return apply_hmi_value(realindex, new_val);
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>
Edouard@3026: </xsl:text>
edouard@3141:     <xsl:text>    _apply_hmi_value(index, new_val) {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        let realindex = this.get_variable_index(index);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        if(realindex == undefined) return undefined;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        new_val = this.clip_min_max(index, new_val);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        return apply_hmi_value(realindex, new_val);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    unhinibit(index){
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.inhibit[index] = undefined;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        let new_val = this.pending[index];
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.pending[index] = undefined;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        return this.apply_hmi_value(index, new_val);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
Edouard@3026:     <xsl:text>    apply_hmi_value(index, new_val) {
Edouard@3026: </xsl:text>
edouard@3141:     <xsl:text>        if(this.inhibit[index] == undefined){
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            let now = Date.now();
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            let min_interval = 1000/this.frequency;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            let lastapply = this.lastapply[index];
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            if(lastapply == undefined || now &gt; lastapply + min_interval){
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                this.lastapply[index] = now;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                return this._apply_hmi_value(index, new_val);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            else {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                let elapsed = now - lastapply;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                this.pending[index] = new_val;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                this.inhibit[index] = setTimeout(this.bound_unhinibit, min_interval - elapsed, index);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        else {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            this.pending[index] = new_val;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            return new_val;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    new_hmi_value(index, value, oldval) {
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        // TODO avoid searching, store index at sub()
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        for(let i = 0; i &lt; this.indexes.length; i++) {
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            let refindex = this.get_variable_index(i);
Edouard@3026: </xsl:text>
Edouard@3058:     <xsl:text>            if(refindex == undefined) continue;
Edouard@3058: </xsl:text>
Edouard@3026:     <xsl:text>
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            if(index == refindex) {
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>                this._dispatch(value, oldval, i);
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>                break;
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>        }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    }
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>    _dispatch(value, oldval, varnum) {
Edouard@3026: </xsl:text>
Edouard@3025:     <xsl:text>        let dispatch = this.dispatch;
Edouard@3025: </xsl:text>
Edouard@3026:     <xsl:text>        if(dispatch != undefined){
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            try {
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>                dispatch.call(this, value, oldval, varnum);
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            } catch(err) {
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>                console.log(err);
Edouard@3026: </xsl:text>
Edouard@3026:     <xsl:text>            }
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>        }
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>    }
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>
edouard@2954: </xsl:text>
Edouard@3019:     <xsl:text>    _animate(){
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        this.animate();
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        this.pending_animate = false;
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>    }
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>    request_animate(){
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        if(!this.pending_animate){
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>            pending_widget_animates.push(this);
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>            this.pending_animate = true;
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>            requestHMIAnimation();
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        }
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>    }
Edouard@3019: </xsl:text>
edouard@3128:     <xsl:text>
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>    activate_activable(eltsub) {
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>        eltsub.inactive.style.display = "none";
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>        eltsub.active.style.display = "";
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>    }
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>    inactivate_activable(eltsub) {
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>        eltsub.active.style.display = "none";
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>        eltsub.inactive.style.display = "";
edouard@3128: </xsl:text>
edouard@3128:     <xsl:text>    }
edouard@3128: </xsl:text>
edouard@2949:     <xsl:text>}
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:   </xsl:template>
edouard@3128:   <xsl:variable name="excluded_types" select="str:split('Page VarInit VarInitPersistent')"/>
Edouard@3264:   <xsl:key name="TypesKey" match="widget" use="@type"/>
edouard@3008:   <declarations:hmi-classes/>
edouard@3008:   <xsl:template match="declarations:hmi-classes">
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@3124:     <xsl:variable name="used_widget_types" select="$parsed_widgets/widget[&#10;                                    generate-id() = generate-id(key('TypesKey', @type)) and &#10;                                    not(@type = $excluded_types)]"/>
Edouard@3019:     <xsl:apply-templates mode="widget_class" select="$used_widget_types"/>
Edouard@3019:     <xsl:text>
Edouard@3019: </xsl:text>
Edouard@3019:   </xsl:template>
Edouard@3019:   <xsl:template mode="widget_class" match="widget">
edouard@2949:     <xsl:text>class </xsl:text>
edouard@2949:     <xsl:value-of select="@type"/>
edouard@2949:     <xsl:text>Widget extends Widget{
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>    /* empty class, as </xsl:text>
edouard@2949:     <xsl:value-of select="@type"/>
edouard@2949:     <xsl:text> widget didn't provide any */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>}
edouard@2949: </xsl:text>
edouard@2949:   </xsl:template>
Edouard@3118:   <xsl:variable name="included_ids" select="$parsed_widgets/widget[not(@type = $excluded_types) and not(@id = $discardable_elements/@id)]/@id"/>
edouard@3124:   <xsl:variable name="hmi_widgets" select="$hmi_elements[@id = $included_ids]"/>
edouard@3165:   <xsl:variable name="result_widgets" select="$result_svg_ns//*[@id = $hmi_widgets/@id]"/>
edouard@3008:   <declarations:hmi-elements/>
edouard@3008:   <xsl:template match="declarations:hmi-elements">
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:     <xsl:text>var hmi_widgets = {
edouard@2941: </xsl:text>
edouard@3124:     <xsl:apply-templates mode="hmi_widgets" select="$hmi_widgets"/>
edouard@2941:     <xsl:text>}
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:   </xsl:template>
Edouard@2808:   <xsl:template name="defs_by_labels">
Edouard@2808:     <xsl:param name="labels" select="''"/>
Edouard@2808:     <xsl:param name="mandatory" select="'yes'"/>
edouard@2920:     <xsl:param name="subelements" select="/.."/>
Edouard@2800:     <xsl:param name="hmi_element"/>
Edouard@2834:     <xsl:variable name="widget_type" select="@type"/>
Edouard@2808:     <xsl:for-each select="str:split($labels)">
Edouard@2807:       <xsl:variable name="name" select="."/>
edouard@3165:       <xsl:variable name="elt" select="$result_widgets[@id = $hmi_element/@id]//*[@inkscape:label=$name][1]"/>
Edouard@2836:       <xsl:choose>
edouard@2920:         <xsl:when test="not($elt/@id)">
Edouard@2836:           <xsl:if test="$mandatory='yes'">
edouard@2920:             <xsl:message terminate="yes">
Edouard@2836:               <xsl:value-of select="$widget_type"/>
Edouard@2836:               <xsl:text> widget must have a </xsl:text>
Edouard@2836:               <xsl:value-of select="$name"/>
Edouard@2836:               <xsl:text> element</xsl:text>
Edouard@2836:             </xsl:message>
Edouard@2836:           </xsl:if>
Edouard@2836:         </xsl:when>
Edouard@2836:         <xsl:otherwise>
Edouard@2852:           <xsl:text>    </xsl:text>
Edouard@2807:           <xsl:value-of select="$name"/>
edouard@2847:           <xsl:text>_elt: id("</xsl:text>
edouard@2920:           <xsl:value-of select="$elt/@id"/>
Edouard@2836:           <xsl:text>"),
Edouard@2836: </xsl:text>
edouard@2920:           <xsl:if test="$subelements">
edouard@2920:             <xsl:text>    </xsl:text>
edouard@2920:             <xsl:value-of select="$name"/>
edouard@2920:             <xsl:text>_sub: {
edouard@2920: </xsl:text>
edouard@2920:             <xsl:for-each select="str:split($subelements)">
edouard@2920:               <xsl:variable name="subname" select="."/>
edouard@2920:               <xsl:variable name="subelt" select="$elt/*[@inkscape:label=$subname][1]"/>
edouard@2920:               <xsl:choose>
edouard@2920:                 <xsl:when test="not($subelt/@id)">
edouard@2920:                   <xsl:if test="$mandatory='yes'">
edouard@2920:                     <xsl:message terminate="yes">
edouard@2920:                       <xsl:value-of select="$widget_type"/>
edouard@2920:                       <xsl:text> widget must have a </xsl:text>
edouard@2920:                       <xsl:value-of select="$name"/>
edouard@2920:                       <xsl:text>/</xsl:text>
edouard@2920:                       <xsl:value-of select="$subname"/>
edouard@2920:                       <xsl:text> element</xsl:text>
edouard@2920:                     </xsl:message>
edouard@2920:                   </xsl:if>
edouard@2920:                   <xsl:text>        /* missing </xsl:text>
edouard@2920:                   <xsl:value-of select="$name"/>
edouard@2920:                   <xsl:text>/</xsl:text>
edouard@2920:                   <xsl:value-of select="$subname"/>
edouard@2920:                   <xsl:text> element */
edouard@2920: </xsl:text>
edouard@2920:                 </xsl:when>
edouard@2920:                 <xsl:otherwise>
edouard@2920:                   <xsl:text>        "</xsl:text>
edouard@2920:                   <xsl:value-of select="$subname"/>
edouard@2920:                   <xsl:text>": id("</xsl:text>
edouard@2920:                   <xsl:value-of select="$subelt/@id"/>
edouard@2920:                   <xsl:text>")</xsl:text>
edouard@2920:                   <xsl:if test="position()!=last()">
edouard@2920:                     <xsl:text>,</xsl:text>
edouard@2920:                   </xsl:if>
edouard@2920:                   <xsl:text>
edouard@2920: </xsl:text>
edouard@2920:                 </xsl:otherwise>
edouard@2920:               </xsl:choose>
edouard@2920:             </xsl:for-each>
edouard@2920:             <xsl:text>    },
edouard@2920: </xsl:text>
edouard@2920:           </xsl:if>
Edouard@2836:         </xsl:otherwise>
Edouard@2836:       </xsl:choose>
Edouard@2807:     </xsl:for-each>
Edouard@2808:   </xsl:template>
Edouard@2829:   <func:function name="func:escape_quotes">
Edouard@2829:     <xsl:param name="txt"/>
Edouard@2829:     <xsl:choose>
Edouard@3024:       <xsl:when test="contains($txt,'&quot;')">
Edouard@3024:         <func:result select="concat(substring-before($txt,'&quot;'),'\&quot;',func:escape_quotes(substring-after($txt,'&quot;')))"/>
Edouard@2829:       </xsl:when>
Edouard@2829:       <xsl:otherwise>
Edouard@2829:         <func:result select="$txt"/>
Edouard@2829:       </xsl:otherwise>
Edouard@2829:     </xsl:choose>
Edouard@2829:   </func:function>
edouard@3238:   <xsl:template match="widget[@type='Animate']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>AnimateWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    frequency = 5;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    speed = 0;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    start = false;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    widget_center = undefined;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    dispatch(value) {
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.speed = value / 5;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //reconfigure animation
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.request_animate();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    animate(){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>       // change animation properties
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>       for(let child of this.element.children){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            if(child.nodeName.startsWith("animate")){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                if(this.speed != 0 &amp;&amp; !this.start){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    this.start = true;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    this.element.beginElement();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                if(this.speed &gt; 0){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("dur", this.speed+"s");
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                else if(this.speed &lt; 0){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("dur", (-1)*this.speed+"s");
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                else{
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    this.start = false;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    this.element.endElement();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>       }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    init() {
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        let widget_pos = this.element.getBBox();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.widget_center = [(widget_pos.x+widget_pos.width/2), (widget_pos.y+widget_pos.height/2)];
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>}
Edouard@3065: </xsl:text>
Edouard@3065:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='AnimateRotation']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>AnimateRotation - DEPRECATED, do not use.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Doesn't follow WYSIWYG principle, and forces user to add animateTransform tag in SVG (using inkscape XML editor for exemple)
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>AnimateRotation - DEPRECATED</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <path name="speed" accepts="HMI_INT,HMI_REAL">
edouard@3241:       <xsl:text>speed</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='AnimateRotation']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>AnimateRotationWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    frequency = 5;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    speed = 0;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    widget_center = undefined;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    dispatch(value) {
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.speed = value / 5;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //reconfigure animation
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.request_animate();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    animate(){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>       // change animation properties
Edouard@3065: </xsl:text>
edouard@3241:     <xsl:text>       // TODO : rewrite with proper es6
edouard@3241: </xsl:text>
Edouard@3065:     <xsl:text>       for(let child of this.element.children){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            if(child.nodeName == "animateTransform"){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                if(this.speed &gt; 0){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("dur", this.speed+"s");
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("from", "0 "+this.widget_center[0]+" "+this.widget_center[1]);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("to", "360 "+this.widget_center[0]+" "+this.widget_center[1]);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                else if(this.speed &lt; 0){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("dur", (-1)*this.speed+"s");
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("from", "360 "+this.widget_center[0]+" "+this.widget_center[1]);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("to", "0 "+this.widget_center[0]+" "+this.widget_center[1]);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                else{
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("from", "0 "+this.widget_center[0]+" "+this.widget_center[1]);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                    child.setAttribute("to", "0 "+this.widget_center[0]+" "+this.widget_center[1]);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>       }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    init() {
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        let widget_pos = this.element.getBBox();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.widget_center = [(widget_pos.x+widget_pos.width/2), (widget_pos.y+widget_pos.height/2)];
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>}
Edouard@3065: </xsl:text>
Edouard@3065:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='Back']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Back widget brings focus back to previous page in history when clicked.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Jump to previous page</xsl:text>
edouard@3241:     </shortdesc>
Edouard@3065:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Back']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>BackWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@2961: </xsl:text>
edouard@2961:     <xsl:text>    on_click(evt) {
Edouard@2902: </xsl:text>
Edouard@2902:     <xsl:text>        if(jump_history.length &gt; 1){
Edouard@2902: </xsl:text>
Edouard@2902:     <xsl:text>           jump_history.pop();
Edouard@2902: </xsl:text>
Edouard@2902:     <xsl:text>           let [page_name, index] = jump_history.pop();
Edouard@2902: </xsl:text>
Edouard@2902:     <xsl:text>           switch_page(page_name, index);
Edouard@2902: </xsl:text>
Edouard@2902:     <xsl:text>        }
Edouard@2902: </xsl:text>
edouard@2961:     <xsl:text>    }
edouard@2961: </xsl:text>
edouard@2961:     <xsl:text>    init() {
edouard@2961: </xsl:text>
edouard@2961:     <xsl:text>        this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)");
edouard@2961: </xsl:text>
edouard@2961:     <xsl:text>    }
edouard@2961: </xsl:text>
edouard@2961:     <xsl:text>}
edouard@2961: </xsl:text>
edouard@2961:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='Button']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Button widget takes one boolean variable path, and reflect current true
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>or false value by showing "active" or "inactive" labeled element
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>respectively. Pressing and releasing button changes variable to true and
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>false respectively. Potential inconsistency caused by quick consecutive
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>presses on the button is mitigated by using a state machine that wait for
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>previous state change to be reflected on variable before applying next one.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Push button reflecting consistently given boolean variable</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <path name="value" accepts="HMI_BOOL">
edouard@3241:       <xsl:text>Boolean variable</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3414:   <xsl:variable name="_push_button_fsm">
edouard@3414:     <fsm>
edouard@3414:       <state name="init">
edouard@3414:         <on-dispatch value="false">
edouard@3414:           <jump state="reflect_off"/>
edouard@3414:         </on-dispatch>
edouard@3414:         <on-dispatch value="true">
edouard@3414:           <jump state="reflect_on"/>
edouard@3414:         </on-dispatch>
edouard@3414:       </state>
edouard@3414:       <state name="reflect_on">
edouard@3414:         <show eltname="active"/>
edouard@3414:         <on-mouse position="down">
edouard@3414:           <jump state="on"/>
edouard@3414:         </on-mouse>
edouard@3414:         <on-mouse position="up">
edouard@3414:           <jump state="off"/>
edouard@3414:         </on-mouse>
edouard@3414:         <on-dispatch value="false">
edouard@3414:           <jump state="reflect_off"/>
edouard@3414:         </on-dispatch>
edouard@3414:       </state>
edouard@3414:       <state name="on">
edouard@3414:         <hmi-value value="true"/>
edouard@3414:         <show eltname="active"/>
edouard@3414:         <on-mouse position="up">
edouard@3414:           <jump state="off"/>
edouard@3414:         </on-mouse>
edouard@3414:         <on-dispatch value="false">
edouard@3414:           <jump state="reflect_off"/>
edouard@3414:         </on-dispatch>
edouard@3414:       </state>
edouard@3414:       <state name="reflect_off">
edouard@3414:         <show eltname="inactive"/>
edouard@3414:         <on-mouse position="down">
edouard@3414:           <jump state="on"/>
edouard@3414:         </on-mouse>
edouard@3414:         <on-mouse position="up">
edouard@3414:           <jump state="off"/>
edouard@3414:         </on-mouse>
edouard@3414:         <on-dispatch value="true">
edouard@3414:           <jump state="reflect_on"/>
edouard@3414:         </on-dispatch>
edouard@3414:       </state>
edouard@3414:       <state name="off">
edouard@3414:         <hmi-value value="false"/>
edouard@3414:         <show eltname="inactive"/>
edouard@3414:         <on-mouse position="down">
edouard@3414:           <jump state="on"/>
edouard@3414:         </on-mouse>
edouard@3414:         <on-dispatch value="true">
edouard@3414:           <jump state="reflect_on"/>
edouard@3414:         </on-dispatch>
edouard@3414:       </state>
edouard@3414:     </fsm>
edouard@3414:   </xsl:variable>
Edouard@3085:   <xsl:variable name="_button_fsm">
Edouard@3085:     <fsm>
Edouard@3085:       <state name="init">
Edouard@3085:         <on-dispatch value="false">
Edouard@3085:           <jump state="released"/>
Edouard@3085:         </on-dispatch>
Edouard@3085:         <on-dispatch value="true">
Edouard@3085:           <jump state="pressed"/>
Edouard@3085:         </on-dispatch>
Edouard@3085:       </state>
Edouard@3085:       <state name="pressing">
Edouard@3085:         <hmi-value value="true"/>
Edouard@3085:         <on-dispatch value="true">
Edouard@3085:           <jump state="pressed"/>
Edouard@3085:         </on-dispatch>
Edouard@3085:         <on-mouse position="up">
Edouard@3085:           <jump state="shortpress"/>
Edouard@3085:         </on-mouse>
Edouard@3085:       </state>
Edouard@3085:       <state name="pressed">
Edouard@3085:         <show eltname="active"/>
Edouard@3085:         <on-mouse position="up">
Edouard@3085:           <jump state="releasing"/>
Edouard@3085:         </on-mouse>
Edouard@3085:         <on-dispatch value="false">
Edouard@3085:           <jump state="released"/>
Edouard@3085:         </on-dispatch>
Edouard@3085:       </state>
Edouard@3085:       <state name="shortpress">
Edouard@3085:         <on-dispatch value="true">
Edouard@3085:           <jump state="releasing"/>
Edouard@3085:         </on-dispatch>
Edouard@3085:         <on-mouse position="down">
Edouard@3085:           <jump state="pressing"/>
Edouard@3085:         </on-mouse>
Edouard@3085:       </state>
Edouard@3085:       <state name="releasing">
Edouard@3085:         <hmi-value value="false"/>
Edouard@3085:         <on-dispatch value="false">
Edouard@3085:           <jump state="released"/>
Edouard@3085:         </on-dispatch>
Edouard@3085:         <on-mouse position="down">
Edouard@3085:           <jump state="shortrelease"/>
Edouard@3085:         </on-mouse>
Edouard@3085:       </state>
Edouard@3085:       <state name="released">
Edouard@3085:         <show eltname="inactive"/>
Edouard@3085:         <on-mouse position="down">
Edouard@3085:           <jump state="pressing"/>
Edouard@3085:         </on-mouse>
Edouard@3085:         <on-dispatch value="true">
Edouard@3085:           <jump state="pressed"/>
Edouard@3085:         </on-dispatch>
Edouard@3085:       </state>
Edouard@3085:       <state name="shortrelease">
Edouard@3085:         <on-dispatch value="false">
Edouard@3085:           <jump state="pressing"/>
Edouard@3085:         </on-dispatch>
Edouard@3085:         <on-mouse position="up">
Edouard@3085:           <jump state="releasing"/>
Edouard@3085:         </on-mouse>
Edouard@3085:       </state>
Edouard@3085:     </fsm>
Edouard@3085:   </xsl:variable>
Edouard@3085:   <xsl:template mode="dispatch_transition" match="fsm">
Edouard@3085:     <xsl:text>        switch (this.state) {
Edouard@3085: </xsl:text>
Edouard@3085:     <xsl:apply-templates mode="dispatch_transition" select="state"/>
Edouard@3085:     <xsl:text>        }
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template mode="dispatch_transition" match="state">
Edouard@3085:     <xsl:text>          case "</xsl:text>
Edouard@3085:     <xsl:value-of select="@name"/>
Edouard@3085:     <xsl:text>":
Edouard@3085: </xsl:text>
Edouard@3085:     <xsl:apply-templates select="on-dispatch"/>
Edouard@3085:     <xsl:text>            break;
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template match="on-dispatch">
Edouard@3085:     <xsl:text>            if(value ==  </xsl:text>
Edouard@3085:     <xsl:value-of select="@value"/>
Edouard@3085:     <xsl:text>) {
Edouard@3085: </xsl:text>
Edouard@3085:     <xsl:apply-templates mode="transition" select="jump"/>
Edouard@3085:     <xsl:text>            }
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template mode="mouse_transition" match="fsm">
Edouard@3085:     <xsl:param name="position"/>
Edouard@3085:     <xsl:text>        switch (this.state) {
Edouard@3085: </xsl:text>
Edouard@3085:     <xsl:apply-templates mode="mouse_transition" select="state">
Edouard@3085:       <xsl:with-param name="position" select="$position"/>
Edouard@3085:     </xsl:apply-templates>
Edouard@3085:     <xsl:text>        }
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template mode="mouse_transition" match="state">
Edouard@3085:     <xsl:param name="position"/>
Edouard@3085:     <xsl:text>          case "</xsl:text>
Edouard@3085:     <xsl:value-of select="@name"/>
Edouard@3085:     <xsl:text>":
Edouard@3085: </xsl:text>
Edouard@3085:     <xsl:apply-templates select="on-mouse[@position = $position]"/>
Edouard@3085:     <xsl:text>            break;
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template match="on-mouse">
Edouard@3085:     <xsl:apply-templates mode="transition" select="jump"/>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template mode="transition" match="jump">
Edouard@3085:     <xsl:text>            this.state = "</xsl:text>
Edouard@3085:     <xsl:value-of select="@state"/>
Edouard@3085:     <xsl:text>";
Edouard@3085: </xsl:text>
Edouard@3085:     <xsl:text>            this.</xsl:text>
Edouard@3085:     <xsl:value-of select="@state"/>
Edouard@3085:     <xsl:text>_action();
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template mode="actions" match="fsm">
Edouard@3085:     <xsl:apply-templates mode="actions" select="state"/>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template mode="actions" match="state">
Edouard@3085:     <xsl:text>    </xsl:text>
Edouard@3085:     <xsl:value-of select="@name"/>
Edouard@3085:     <xsl:text>_action(){
Edouard@3085: </xsl:text>
edouard@3414:     <xsl:text>console.log("Entering state </xsl:text>
edouard@3414:     <xsl:value-of select="@name"/>
edouard@3414:     <xsl:text>");
edouard@3414: </xsl:text>
Edouard@3085:     <xsl:apply-templates mode="actions" select="*"/>
Edouard@3085:     <xsl:text>    }
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template mode="actions" match="show">
Edouard@3085:     <xsl:text>        this.display = "</xsl:text>
Edouard@3085:     <xsl:value-of select="@eltname"/>
Edouard@3085:     <xsl:text>";
Edouard@3085: </xsl:text>
Edouard@3085:     <xsl:text>        this.request_animate();
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
Edouard@3085:   <xsl:template mode="actions" match="hmi-value">
Edouard@3085:     <xsl:text>        this.apply_hmi_value(0, </xsl:text>
Edouard@3085:     <xsl:value-of select="@value"/>
Edouard@3085:     <xsl:text>);
Edouard@3085: </xsl:text>
Edouard@3085:   </xsl:template>
edouard@3414:   <xsl:template name="generated_button_class">
edouard@3414:     <xsl:param name="fsm"/>
edouard@3414:     <xsl:text>    frequency = 5;
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>    display = "inactive";
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>    state = "init";
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>    dispatch(value) {
edouard@3414: </xsl:text>
edouard@3414:     <xsl:apply-templates mode="dispatch_transition" select="$fsm"/>
edouard@3414:     <xsl:text>    }
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>    onmouseup(evt) {
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>        svg_root.removeEventListener("pointerup", this.bound_onmouseup, true);
edouard@3414: </xsl:text>
edouard@3414:     <xsl:apply-templates mode="mouse_transition" select="$fsm">
edouard@3414:       <xsl:with-param name="position" select="'up'"/>
edouard@3414:     </xsl:apply-templates>
edouard@3414:     <xsl:text>    }
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>    onmousedown(evt) {
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>        svg_root.addEventListener("pointerup", this.bound_onmouseup, true);
edouard@3414: </xsl:text>
edouard@3414:     <xsl:apply-templates mode="mouse_transition" select="$fsm">
edouard@3414:       <xsl:with-param name="position" select="'down'"/>
edouard@3414:     </xsl:apply-templates>
edouard@3414:     <xsl:text>    }
edouard@3414: </xsl:text>
edouard@3414:     <xsl:apply-templates mode="actions" select="$fsm"/>
edouard@3414:     <xsl:text>    animate(){
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>        if (this.active_elt &amp;&amp; this.inactive_elt) {
edouard@3414: </xsl:text>
edouard@3414:     <xsl:for-each select="str:split('active inactive')">
edouard@3414:       <xsl:text>            if(this.display == "</xsl:text>
edouard@3414:       <xsl:value-of select="."/>
edouard@3414:       <xsl:text>")
edouard@3414: </xsl:text>
edouard@3414:       <xsl:text>                this.</xsl:text>
edouard@3414:       <xsl:value-of select="."/>
edouard@3414:       <xsl:text>_elt.style.display = "";
edouard@3414: </xsl:text>
edouard@3414:       <xsl:text>            else
edouard@3414: </xsl:text>
edouard@3414:       <xsl:text>                this.</xsl:text>
edouard@3414:       <xsl:value-of select="."/>
edouard@3414:       <xsl:text>_elt.style.display = "none";
edouard@3414: </xsl:text>
edouard@3414:     </xsl:for-each>
edouard@3414:     <xsl:text>        }
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>    }
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>    init() {
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>        this.bound_onmouseup = this.onmouseup.bind(this);
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>        this.element.addEventListener("pointerdown", this.onmousedown.bind(this));
edouard@3414: </xsl:text>
edouard@3414:     <xsl:text>    }
edouard@3414: </xsl:text>
edouard@3414:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Button']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>ButtonWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@3238: </xsl:text>
Edouard@3085:     <xsl:variable name="fsm" select="exsl:node-set($_button_fsm)"/>
edouard@3414:     <xsl:call-template name="generated_button_class">
edouard@3414:       <xsl:with-param name="fsm" select="$fsm"/>
edouard@3414:     </xsl:call-template>
Edouard@3024:     <xsl:text>}
usveticic@3015: </xsl:text>
usveticic@3015:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Button']" mode="widget_defs">
dgaberscek@2976:     <xsl:param name="hmi_element"/>
dgaberscek@2976:     <xsl:call-template name="defs_by_labels">
dgaberscek@2976:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
dgaberscek@2976:       <xsl:with-param name="labels">
dgaberscek@2976:         <xsl:text>active inactive</xsl:text>
dgaberscek@2976:       </xsl:with-param>
dgaberscek@2976:       <xsl:with-param name="mandatory" select="'no'"/>
dgaberscek@2976:     </xsl:call-template>
usveticic@3015:   </xsl:template>
edouard@3414:   <xsl:template match="widget[@type='PushButton']" mode="widget_class">
edouard@3414:     <xsl:text>class </xsl:text>
edouard@3414:     <xsl:text>PushButtonWidget</xsl:text>
edouard@3414:     <xsl:text> extends Widget{
edouard@3414: </xsl:text>
edouard@3414:     <xsl:variable name="fsm" select="exsl:node-set($_push_button_fsm)"/>
edouard@3414:     <xsl:call-template name="generated_button_class">
edouard@3414:       <xsl:with-param name="fsm" select="$fsm"/>
edouard@3414:     </xsl:call-template>
edouard@3414:     <xsl:text>}
edouard@3414: </xsl:text>
edouard@3414:   </xsl:template>
edouard@3414:   <xsl:template match="widget[@type='PushButton']" mode="widget_defs">
edouard@3414:     <xsl:param name="hmi_element"/>
edouard@3414:     <xsl:call-template name="defs_by_labels">
edouard@3414:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@3414:       <xsl:with-param name="labels">
edouard@3414:         <xsl:text>active inactive</xsl:text>
edouard@3414:       </xsl:with-param>
edouard@3414:       <xsl:with-param name="mandatory" select="'no'"/>
edouard@3414:     </xsl:call-template>
edouard@3414:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='CircularBar']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>CircularBar widget changes the end angle of a "path" labeled arc according
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>to value of the single accepted variable.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>If "min" a "max" labeled texts are provided, then they are used as
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>respective minimum and maximum value. Otherwise, value is expected to be
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>in between 0 and 100.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Change end angle of Inkscape's arc</xsl:text>
edouard@3241:     </shortdesc>
edouard@3362:     <arg name="min" count="optional" accepts="int,real">
edouard@3362:       <xsl:text>minimum value</xsl:text>
edouard@3362:     </arg>
edouard@3362:     <arg name="max" count="optional" accepts="int,real">
edouard@3362:       <xsl:text>maximum value</xsl:text>
edouard@3362:     </arg>
edouard@3241:     <path name="value" accepts="HMI_INT,HMI_REAL">
edouard@3241:       <xsl:text>Value to display</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='CircularBar']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>CircularBarWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    frequency = 10;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    range = undefined;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    dispatch(value) {
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>        this.display_val = value;
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        this.request_animate();
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>    }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>    animate(){
Edouard@3112: </xsl:text>
usveticic@3045:     <xsl:text>        if(this.value_elt)
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>            this.value_elt.textContent = String(this.display_val);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let [min,max,start,end] = this.range;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let [cx,cy] = this.center;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let [rx,ry] = this.proportions;
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>        let tip = start + (end-start)*Number(this.display_val)/(max-min);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let size = 0;
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        if (tip-start &gt; Math.PI)
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            size = 1;
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>        else
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            size = 0;
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        this.path_elt.setAttribute('d', "M "+(cx+rx*Math.cos(start))+","+(cy+ry*Math.sin(start))+
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                                        " A "+rx+","+ry+
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                                        " 0 "+size+
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                                        " 1 "+(cx+rx*Math.cos(tip))+","+(cy+ry*Math.sin(tip)));
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    init() {
usveticic@3045: </xsl:text>
edouard@3362:     <xsl:text>        if(this.args.length &gt;= 2)
edouard@3362: </xsl:text>
edouard@3362:     <xsl:text>            [this.min, this.max]=this.args;
edouard@3362: </xsl:text>
edouard@3362:     <xsl:text>
edouard@3362: </xsl:text>
Edouard@3112:     <xsl:text>        let [start, end, cx, cy, rx, ry] = ["start", "end", "cx", "cy", "rx", "ry"].
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            map(tag=&gt;Number(this.path_elt.getAttribute('sodipodi:'+tag)))
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        if (ry == 0) 
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            ry = rx;
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        if (start &gt; end)
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            end = end + 2*Math.PI;
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        let [min,max] = [[this.min_elt,0],[this.max_elt,100]].map(([elt,def],i)=&gt;elt?
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            Number(elt.textContent) :
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            this.args.length &gt;= i+1 ? this.args[i] : def);
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.range = [min, max, start, end];
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.center = [cx, cy];
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.proportions = [rx, ry];
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>}
usveticic@3045: </xsl:text>
usveticic@3045:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='CircularBar']" mode="widget_defs">
dgaberscek@2944:     <xsl:param name="hmi_element"/>
dgaberscek@2944:     <xsl:call-template name="defs_by_labels">
dgaberscek@2944:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
dgaberscek@2944:       <xsl:with-param name="labels">
dgaberscek@2944:         <xsl:text>path</xsl:text>
dgaberscek@2944:       </xsl:with-param>
dgaberscek@2944:     </xsl:call-template>
dgaberscek@2944:     <xsl:call-template name="defs_by_labels">
dgaberscek@2944:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
dgaberscek@2944:       <xsl:with-param name="labels">
edouard@3362:         <xsl:text>min max</xsl:text>
dgaberscek@2944:       </xsl:with-param>
dgaberscek@2944:       <xsl:with-param name="mandatory" select="'no'"/>
dgaberscek@2944:     </xsl:call-template>
dgaberscek@2944:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='CircularSlider']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>CircularSlider - DEPRECATED, to be replaced by PathSlider
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>This widget moves "handle" labeled group along "range" labeled
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>arc, according to value of the single accepted variable.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>If "min" a "max" labeled texts are provided, or if first and second
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>argument are given, then they are used as respective minimum and maximum
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>value. Otherwise, value is expected to be in between 0 and 100.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>If "value" labeled text is found, then its content is replaced by value.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>During drag, "setpoint" labeled group is moved to position defined by user
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>while "handle" reflects current value from variable.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>CircularSlider - DEPRECATED</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <arg name="min" count="optional" accepts="int,real">
edouard@3241:       <xsl:text>minimum value</xsl:text>
edouard@3241:     </arg>
edouard@3241:     <arg name="min" count="optional" accepts="int,real">
edouard@3241:       <xsl:text>maximum value</xsl:text>
edouard@3241:     </arg>
edouard@3241:     <path name="value" accepts="HMI_INT,HMI_REAL">
edouard@3241:       <xsl:text>Value to display</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='CircularSlider']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>CircularSliderWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    frequency = 5;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    range = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    circle = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    handle_pos = undefined;
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>    curr_value = 0;
usveticic@3045: </xsl:text>
usveticic@3015:     <xsl:text>    drag = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    enTimer = false;
usveticic@3015: </xsl:text>
usveticic@3045:     <xsl:text>    last_drag = false;
usveticic@3045: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    dispatch(value) {
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>        let [min,max,start,totallength] = this.range;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //save current value inside widget
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.curr_value = value;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //check if in range
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        if (this.curr_value &gt; max){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.curr_value = max;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.apply_hmi_value(0, this.curr_value);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        else if (this.curr_value &lt; min){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.curr_value = min;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.apply_hmi_value(0, this.curr_value);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
usveticic@3045:     <xsl:text>        if(this.value_elt)
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            this.value_elt.textContent = String(value);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>        //don't update if draging and setpoint ghost doesn't exist
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        if(!this.drag || (this.setpoint_elt != undefined)){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.update_DOM(value, this.handle_elt);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    update_DOM(value, elt){
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let [min,max,totalDistance] = this.range;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let length = Math.max(0,Math.min((totalDistance),(Number(value)-min)/(max-min)*(totalDistance)));
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let tip = this.range_elt.getPointAtLength(length);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        elt.setAttribute('transform',"translate("+(tip.x-this.handle_pos.x)+","+(tip.y-this.handle_pos.y)+")");
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>        // show or hide ghost if exists
Edouard@3065: </xsl:text>
usveticic@3045:     <xsl:text>        if(this.setpoint_elt != undefined){
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            if(this.last_drag!= this.drag){
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>                if(this.drag){
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>                    this.setpoint_elt.setAttribute("style", this.setpoint_style);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>                }else{
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>                    this.setpoint_elt.setAttribute("style", "display:none");
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>                }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>                this.last_drag = this.drag;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    on_release(evt) {
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>        //unbind events
Edouard@3065: </xsl:text>
usveticic@3045:     <xsl:text>        window.removeEventListener("touchmove", this.on_bound_drag, true);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        window.removeEventListener("mousemove", this.on_bound_drag, true);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        window.removeEventListener("mouseup", this.bound_on_release, true)
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        window.removeEventListener("touchend", this.bound_on_release, true);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        window.removeEventListener("touchcancel", this.bound_on_release, true);
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //reset drag flag
Edouard@3065: </xsl:text>
usveticic@3015:     <xsl:text>        if(this.drag){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            this.drag = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        // get final position
Edouard@3065: </xsl:text>
usveticic@3045:     <xsl:text>        this.update_position(evt);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    on_drag(evt){
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>        //ignore drag event for X amount of time and if not selected
Edouard@3065: </xsl:text>
usveticic@3045:     <xsl:text>        if(this.enTimer &amp;&amp; this.drag){
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            this.update_position(evt);
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
usveticic@3045:     <xsl:text>            //reset timer
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            this.enTimer = false;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            setTimeout("{hmi_widgets['"+this.element_id+"'].enTimer = true;}", 100);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        }
usveticic@3045: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    update_position(evt){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        if(this.drag &amp;&amp; this.enTimer){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            var svg_dist = 0;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            //calculate center of widget in html
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            // --TODO maybe it would be better to bind this part to window change size event ???
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            let [xdest,ydest,svgWidth,svgHeight] = page_desc[current_visible_page].bbox;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            let [cX, cY,fiStart,fiEnd,minMax,x1,y1,width,height] = this.circle;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            let htmlCirc = this.range_elt.getBoundingClientRect();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            let cxHtml = ((htmlCirc.right-htmlCirc.left)/(width)*(cX-x1))+htmlCirc.left;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            let cyHtml = ((htmlCirc.bottom-htmlCirc.top)/(height)*(cY-y1))+htmlCirc.top;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            //get mouse coordinates
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            let mouseX = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            let mouseY = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            if (evt.type.startsWith("touch")){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                mouseX = Math.ceil(evt.touches[0].clientX);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                mouseY = Math.ceil(evt.touches[0].clientY);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            else{
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                mouseX = evt.pageX;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                mouseY = evt.pageY;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            //calculate angle
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            let fi = Math.atan2(cyHtml-mouseY, mouseX-cxHtml);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            // transform from 0 to 2PI
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            if (fi &gt; 0){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                fi = 2*Math.PI-fi;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            else{
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                fi = -fi;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            //offset it to 0
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            fi = fi - fiStart;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            if (fi &lt; 0){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                fi = fi + 2*Math.PI;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            //get handle distance from mouse position
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            if(fi&lt;fiEnd){
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>               this.curr_value=(fi)/(fiEnd)*(this.range[1]-this.range[0]);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            else if(fiEnd&lt;fi &amp;&amp; fi&lt;fiEnd+minMax){
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>                this.curr_value = this.range[1];
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            else{
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>                this.curr_value = this.range[0];
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>            //apply value to hmi
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.apply_hmi_value(0, Math.ceil(this.curr_value));
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            //redraw handle
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.request_animate();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3045:     <xsl:text>    animate(){
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>        // redraw handle on screen refresh
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        // check if setpoint(ghost) handle exsist otherwise update main handle
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        if(this.setpoint_elt != undefined){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.update_DOM(this.curr_value, this.setpoint_elt);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        else{
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.update_DOM(this.curr_value, this.handle_elt);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3015:     <xsl:text>    on_select(evt){
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>        //enable drag flag and timer
Edouard@3065: </xsl:text>
usveticic@3015:     <xsl:text>        this.drag = true;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        this.enTimer = true;
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //bind events
Edouard@3065: </xsl:text>
usveticic@3045:     <xsl:text>        window.addEventListener("touchmove", this.on_bound_drag, true);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        window.addEventListener("mousemove", this.on_bound_drag, true);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>        window.addEventListener("mouseup", this.bound_on_release, true);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        window.addEventListener("touchend", this.bound_on_release, true);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        window.addEventListener("touchcancel", this.bound_on_release, true);
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //update postion on mouse press
Edouard@3065: </xsl:text>
usveticic@3015:     <xsl:text>        this.update_position(evt);
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //prevent next events
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        evt.stopPropagation();
Edouard@3065: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    init() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        //get min max
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let min = this.min_elt ?
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                    Number(this.min_elt.textContent) :
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                    this.args.length &gt;= 1 ? this.args[0] : 0;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let max = this.max_elt ?
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                    Number(this.max_elt.textContent) :
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                    this.args.length &gt;= 2 ? this.args[1] : 100;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        //fiStart ==&gt; offset
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let fiStart = Number(this.range_elt.getAttribute('sodipodi:start'));
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let fiEnd = Number(this.range_elt.getAttribute('sodipodi:end'));
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        fiEnd = fiEnd - fiStart;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        //fiEnd ==&gt; size of angle
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        if (fiEnd &lt; 0){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            fiEnd = 2*Math.PI + fiEnd;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        //min max barrier angle
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let minMax = (2*Math.PI - fiEnd)/2;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        //get parameters from svg
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let cX = Number(this.range_elt.getAttribute('sodipodi:cx'));
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let cY = Number(this.range_elt.getAttribute('sodipodi:cy'));
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        this.range_elt.style.strokeMiterlimit="0"; //eliminates some weird border around html object
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        this.range = [min, max,this.range_elt.getTotalLength()];
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let cPos = this.range_elt.getBBox();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        this.handle_pos = this.range_elt.getPointAtLength(0);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        this.circle = [cX, cY,fiStart,fiEnd,minMax,cPos.x,cPos.y,cPos.width,cPos.height];
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3045:     <xsl:text>        //bind functions
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.bound_on_select = this.on_select.bind(this);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.bound_on_release = this.on_release.bind(this);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.on_bound_drag = this.on_drag.bind(this);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>        this.handle_elt.addEventListener("mousedown", this.bound_on_select);
usveticic@3015: </xsl:text>
usveticic@3045:     <xsl:text>        this.element.addEventListener("mousedown", this.bound_on_select);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.element.addEventListener("touchstart", this.bound_on_select);
usveticic@3045: </xsl:text>
Edouard@3065:     <xsl:text>        //touch recognised as page drag without next command
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        document.body.addEventListener("touchstart", function(e){}, false);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //save ghost style
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //save ghost style
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        if(this.setpoint_elt != undefined){
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            this.setpoint_style = this.setpoint_elt.getAttribute("style");
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>            this.setpoint_elt.setAttribute("style", "display:none");
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>}
usveticic@3015: </xsl:text>
usveticic@3015:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='CircularSlider']" mode="widget_defs">
usveticic@3015:     <xsl:param name="hmi_element"/>
usveticic@3015:     <xsl:call-template name="defs_by_labels">
usveticic@3015:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
usveticic@3015:       <xsl:with-param name="labels">
usveticic@3015:         <xsl:text>handle range</xsl:text>
usveticic@3015:       </xsl:with-param>
usveticic@3015:     </xsl:call-template>
usveticic@3015:     <xsl:call-template name="defs_by_labels">
usveticic@3015:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
usveticic@3015:       <xsl:with-param name="labels">
Edouard@3065:         <xsl:text>value min max setpoint</xsl:text>
usveticic@3015:       </xsl:with-param>
usveticic@3015:       <xsl:with-param name="mandatory" select="'no'"/>
usveticic@3015:     </xsl:call-template>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='CustomHtml']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>CustomHtml widget allows insertion of HTML code in a svg:foreignObject.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Widget content is replaced by foreignObject. HTML code is obtained from
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>"code" labeled text content. HTML insert position and size is given with
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>"container" labeled element.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Custom HTML insert</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='CustomHtml']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>CustomHtmlWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    frequency = 5;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    widget_size = undefined;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    dispatch(value) {
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.request_animate();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    animate(){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    init() {
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.widget_size = this.container_elt.getBBox();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.element.innerHTML ='&lt;foreignObject x="'+
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.widget_size.x+'" y="'+this.widget_size.y+
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            '" width="'+this.widget_size.width+'" height="'+this.widget_size.height+'"&gt; '+
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.code_elt.textContent+
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            ' &lt;/foreignObject&gt;';
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>}
Edouard@3065: </xsl:text>
Edouard@3065:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='CustomHtml']" mode="widget_defs">
Edouard@3065:     <xsl:param name="hmi_element"/>
Edouard@3065:     <xsl:call-template name="defs_by_labels">
Edouard@3065:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
Edouard@3065:       <xsl:with-param name="labels">
Edouard@3065:         <xsl:text>container code</xsl:text>
Edouard@3065:       </xsl:with-param>
Edouard@3065:     </xsl:call-template>
edouard@3238:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='Display']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>If Display widget is a svg:text element, then text content is replaced by
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>value of given variables, space separated.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Otherwise, if Display widget is a group containing a svg:text element
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>labelled "format", then text content is replaced by printf-like formated
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>string. In other words, if "format" labeled text is "%d %s %f", then 3
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>variables paths are expected : HMI_IN, HMI_STRING and HMI_REAL.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>In case Display widget is a svg::text element, it is also possible to give
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>format string as first argument.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Printf-like formated text display </xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <arg name="format" count="optional" accepts="string">
edouard@3241:       <xsl:text>printf-like format string when not given as svg:text</xsl:text>
edouard@3241:     </arg>
edouard@3241:     <path name="fields" count="many" accepts="HMI_INT,HMI_REAL,HMI_STRING,HMI_BOOL">
edouard@3241:       <xsl:text>variables to be displayed</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Display']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>DisplayWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@2998: </xsl:text>
edouard@2998:     <xsl:text>    frequency = 5;
edouard@2998: </xsl:text>
edouard@3008:     <xsl:text>    dispatch(value, oldval, index) {
edouard@3008: </xsl:text>
edouard@3008:     <xsl:text>        this.fields[index] = value;    
edouard@3008: </xsl:text>
Edouard@3147:     <xsl:text>        this.request_animate();
edouard@2998: </xsl:text>
edouard@2998:     <xsl:text>    }
edouard@2998: </xsl:text>
edouard@2998:     <xsl:text>}
edouard@2998: </xsl:text>
edouard@2998:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Display']" mode="widget_defs">
edouard@2883:     <xsl:param name="hmi_element"/>
Edouard@3147:     <xsl:variable name="format">
Edouard@3147:       <xsl:call-template name="defs_by_labels">
Edouard@3147:         <xsl:with-param name="hmi_element" select="$hmi_element"/>
Edouard@3147:         <xsl:with-param name="labels">
Edouard@3147:           <xsl:text>format</xsl:text>
Edouard@3147:         </xsl:with-param>
Edouard@3147:         <xsl:with-param name="mandatory" select="'no'"/>
Edouard@3147:       </xsl:call-template>
Edouard@3147:     </xsl:variable>
Edouard@3147:     <xsl:variable name="has_format" select="string-length($format)&gt;0"/>
Edouard@3147:     <xsl:value-of select="$format"/>
Edouard@3147:     <xsl:if test="$hmi_element[not(self::svg:text)] and not($has_format)">
edouard@2998:       <xsl:message terminate="yes">
edouard@2998:         <xsl:text>Display Widget id="</xsl:text>
edouard@2998:         <xsl:value-of select="$hmi_element/@id"/>
Edouard@3147:         <xsl:text>" must be a svg::text element itself or a group containing a svg:text element labelled "format"</xsl:text>
edouard@2998:       </xsl:message>
edouard@2998:     </xsl:if>
Edouard@3022:     <xsl:variable name="field_initializer">
Edouard@3022:       <xsl:for-each select="path">
Edouard@3022:         <xsl:choose>
Edouard@3022:           <xsl:when test="@type='HMI_STRING'">
Edouard@3022:             <xsl:text>""</xsl:text>
Edouard@3022:           </xsl:when>
Edouard@3065:           <xsl:otherwise>
Edouard@3065:             <xsl:text>0</xsl:text>
Edouard@3065:           </xsl:otherwise>
Edouard@3022:         </xsl:choose>
Edouard@3022:         <xsl:if test="position()!=last()">
Edouard@3022:           <xsl:text>,</xsl:text>
Edouard@3022:         </xsl:if>
Edouard@3022:       </xsl:for-each>
Edouard@3022:     </xsl:variable>
Edouard@3022:     <xsl:text>    fields: [</xsl:text>
Edouard@3022:     <xsl:value-of select="$field_initializer"/>
Edouard@3022:     <xsl:text>],
edouard@3008: </xsl:text>
Edouard@3147:     <xsl:text>    animate: function(){
Edouard@3147: </xsl:text>
Edouard@3147:     <xsl:choose>
Edouard@3147:       <xsl:when test="$has_format">
Edouard@3147:         <xsl:text>      if(this.format_elt.getAttribute("lang")) {
Edouard@3147: </xsl:text>
Edouard@3147:         <xsl:text>          this.format = svg_text_to_multiline(this.format_elt);
Edouard@3147: </xsl:text>
Edouard@3147:         <xsl:text>          this.format_elt.removeAttribute("lang");
Edouard@3147: </xsl:text>
Edouard@3147:         <xsl:text>      }
Edouard@3147: </xsl:text>
Edouard@3147:         <xsl:text>      let str = vsprintf(this.format,this.fields);
Edouard@3147: </xsl:text>
Edouard@3147:         <xsl:text>      multiline_to_svg_text(this.format_elt, str);
Edouard@3147: </xsl:text>
Edouard@3147:       </xsl:when>
Edouard@3147:       <xsl:otherwise>
Edouard@3147:         <xsl:text>      let str = this.args.length == 1 ? vsprintf(this.args[0],this.fields) : this.fields.join(' ');
Edouard@3147: </xsl:text>
Edouard@3147:         <xsl:text>      multiline_to_svg_text(this.element, str);
Edouard@3147: </xsl:text>
Edouard@3147:       </xsl:otherwise>
Edouard@3147:     </xsl:choose>
Edouard@3147:     <xsl:text>    },
Edouard@3147: </xsl:text>
Edouard@3147:     <xsl:text>    
Edouard@3147: </xsl:text>
Edouard@3147:     <xsl:if test="$has_format">
Edouard@3147:       <xsl:text>    init: function() {
Edouard@3147: </xsl:text>
Edouard@3147:       <xsl:text>      this.format = svg_text_to_multiline(this.format_elt);
Edouard@3147: </xsl:text>
Edouard@3147:       <xsl:text>    },
Edouard@3147: </xsl:text>
Edouard@3147:     </xsl:if>
edouard@3008:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='DropDown']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>DropDown widget let user select an entry in a list of texts, given as
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>arguments. Single variable path is index of selection.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3355:       <xsl:text>It needs "text" (svg:text or svg:use referring to svg:text),
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>"box" (svg:rect), "button" (svg:*), and "highlight" (svg:rect)
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>labeled elements.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>When user clicks on "button", "text" is duplicated to display enties in the
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>limit of available space in page, and "box" is extended to contain all
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>texts. "highlight" is moved over pre-selected entry.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3355:       <xsl:text>When only one argument is given and argment contains "#langs" then list of
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>texts is automatically set to the human-readable list of supported
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>languages by this HMI. 
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>If "text" labeled element is of type svg:use and refers to a svg:text 
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>element part of a TextList widget, no argument is expected. In that case
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>list of texts is set to TextList content.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Let user select text entry in a drop-down menu</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <arg name="entries" count="many" accepts="string">
edouard@3241:       <xsl:text>drop-down menu entries</xsl:text>
edouard@3241:     </arg>
edouard@3241:     <path name="selection" accepts="HMI_INT">
edouard@3241:       <xsl:text>selection index</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='DropDown']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>DropDownWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        dispatch(value) {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            if(!this.opened) this.set_selection(value);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        init() {
Edouard@3090: </xsl:text>
edouard@3355:     <xsl:text>            this.init_specific();
edouard@3355: </xsl:text>
Edouard@3090:     <xsl:text>            this.button_elt.onclick = this.on_button_click.bind(this);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Save original size of rectangle
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.box_bbox = this.box_elt.getBBox()
Edouard@3090: </xsl:text>
Edouard@3092:     <xsl:text>            this.highlight_bbox = this.highlight_elt.getBBox()
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.highlight_elt.style.visibility = "hidden";
Edouard@3092: </xsl:text>
Edouard@3090:     <xsl:text>
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Compute margins
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>            this.text_bbox = this.text_elt.getBBox();
Edouard@3091: </xsl:text>
Edouard@3091:     <xsl:text>            let lmargin = this.text_bbox.x - this.box_bbox.x;
Edouard@3091: </xsl:text>
Edouard@3091:     <xsl:text>            let tmargin = this.text_bbox.y - this.box_bbox.y;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.margins = [lmargin, tmargin].map(x =&gt; Math.max(x,0));
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Index of first visible element in the menu, when opened
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.menu_offset = 0;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // How mutch to lift the menu vertically so that it does not cross bottom border
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.lift = 0;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Event handlers cannot be object method ('this' is unknown)
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // as a workaround, handler given to addEventListener is bound in advance.
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.bound_close_on_click_elsewhere = this.close_on_click_elsewhere.bind(this);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.bound_on_selection_click = this.on_selection_click.bind(this);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.bound_on_backward_click = this.on_backward_click.bind(this);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.bound_on_forward_click = this.on_forward_click.bind(this);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.opened = false;
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>            this.clickables = [];
Edouard@3091: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        on_button_click() {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.open();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        // Called when a menu entry is clicked
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        on_selection_click(selection) {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.close();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.apply_hmi_value(0, selection);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        on_backward_click(){
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.scroll(false);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        on_forward_click(){
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.scroll(true);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        set_selection(value) {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            let display_str;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            if(value &gt;= 0 &amp;&amp; value &lt; this.content.length){
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                // if valid selection resolve content
Edouard@3090: </xsl:text>
edouard@3355:     <xsl:text>                display_str = gettext(this.content[value]);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                this.last_selection = value;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            } else {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                // otherwise show problem
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                display_str = "?"+String(value)+"?";
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // It is assumed that first span always stays,
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // and contains selection when menu is closed
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.text_elt.firstElementChild.textContent = display_str;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        grow_text(up_to) {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            let count = 1;
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>            let txt = this.text_elt;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            let first = txt.firstElementChild;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Real world (pixels) boundaries of current page
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>            let bounds = svg_root.getBoundingClientRect();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.lift = 0;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            while(count &lt; up_to) {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                let next = first.cloneNode();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                // relative line by line text flow instead of absolute y coordinate
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                next.removeAttribute("y");
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                next.setAttribute("dy", "1.1em");
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                // default content to allow computing text element bbox
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                next.textContent = "...";
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                // append new span to text element
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                txt.appendChild(next);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                // now check if text extended by one row fits to page
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                // FIXME : exclude margins to be more accurate on box size
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                let rect = txt.getBoundingClientRect();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                if(rect.bottom &gt; bounds.bottom){
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                    // in case of overflow at the bottom, lift up one row
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                    let backup = first.getAttribute("dy");
Edouard@3090: </xsl:text>
Edouard@3092:     <xsl:text>                    // apply lift as a dy added too first span (y attrib stays)
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                    first.setAttribute("dy", "-"+String((this.lift+1)*1.1)+"em");
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                    rect = txt.getBoundingClientRect();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                    if(rect.top &gt; bounds.top){
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                        this.lift += 1;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                    } else {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                        // if it goes over the top, then backtrack
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                        // restore dy attribute on first span
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                        if(backup)
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                            first.setAttribute("dy", backup);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                        else
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                            first.removeAttribute("dy");
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                        // remove unwanted child
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                        txt.removeChild(next);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                        return count;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                    }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                count++;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            return count;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        close_on_click_elsewhere(e) {
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // inhibit events not targetting spans (menu items)
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>            if([this.text_elt, this.element].indexOf(e.target.parentNode) == -1){
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                e.stopPropagation();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                // close menu in case click is outside box
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                if(e.target !== this.box_elt)
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>                    this.close();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        close(){
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Stop hogging all click events
Edouard@3090: </xsl:text>
edouard@3238:     <xsl:text>            svg_root.removeEventListener("pointerdown", this.numb_event, true);
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>            svg_root.removeEventListener("pointerup", this.numb_event, true);
Edouard@3091: </xsl:text>
Edouard@3090:     <xsl:text>            svg_root.removeEventListener("click", this.bound_close_on_click_elsewhere, true);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Restore position and sixe of widget elements
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.reset_text();
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>            this.reset_clickables();
Edouard@3091: </xsl:text>
Edouard@3090:     <xsl:text>            this.reset_box();
Edouard@3090: </xsl:text>
Edouard@3092:     <xsl:text>            this.reset_highlight();
Edouard@3092: </xsl:text>
Edouard@3090:     <xsl:text>            // Put the button back in place
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.element.appendChild(this.button_elt);
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Mark as closed (to allow dispatch)
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.opened = false;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            // Dispatch last cached value
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            this.apply_cache();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>        // Make item (text span) clickable by overlaying a rectangle on top of it
Edouard@3091: </xsl:text>
Edouard@3091:     <xsl:text>        make_clickable(span, func) {
Edouard@3091: </xsl:text>
Edouard@3091:     <xsl:text>            let txt = this.text_elt;
Edouard@3091: </xsl:text>
Edouard@3092:     <xsl:text>            let original_text_y = this.text_bbox.y;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let highlight = this.highlight_elt;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let original_h_y = this.highlight_bbox.y;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let clickable = highlight.cloneNode();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let yoffset = span.getBBox().y - original_text_y;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            clickable.y.baseVal.value = original_h_y + yoffset;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            clickable.style.pointerEvents = "bounding-box";
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            //clickable.style.visibility = "hidden";
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            //clickable.onclick = () =&gt; alert("love JS");
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            clickable.onclick = func;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.element.appendChild(clickable);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.clickables.push(clickable)
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        reset_clickables() {
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            while(this.clickables.length){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                this.element.removeChild(this.clickables.pop());
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        // Set text content when content is smaller than menu (no scrolling)
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        set_complete_text(){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let spans = this.text_elt.children;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let c = 0;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            for(let item of this.content){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                let span=spans[c];
Edouard@3092: </xsl:text>
edouard@3355:     <xsl:text>                span.textContent = gettext(item);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                let sel = c;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                this.make_clickable(span, (evt) =&gt; this.bound_on_selection_click(sel));
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                c++;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        // Move partial view :
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        // false : upward, lower value
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        // true  : downward, higher value
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        scroll(forward){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let contentlength = this.content.length;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let spans = this.text_elt.children;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let spanslength = spans.length;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // reduce accounted menu size according to prsence of scroll buttons
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // since we scroll there is necessarly one button
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            spanslength--;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            if(forward){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                // reduce accounted menu size because of back button
Edouard@3092: </xsl:text>
edouard@3094:     <xsl:text>                // in current view
edouard@3094: </xsl:text>
edouard@3094:     <xsl:text>                if(this.menu_offset &gt; 0) spanslength--;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                this.menu_offset = Math.min(
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    contentlength - spans.length + 1,
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    this.menu_offset + spanslength);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            }else{
Edouard@3092: </xsl:text>
edouard@3094:     <xsl:text>                // reduce accounted menu size because of back button
edouard@3094: </xsl:text>
edouard@3094:     <xsl:text>                // in view once scrolled
edouard@3094: </xsl:text>
Edouard@3092:     <xsl:text>                if(this.menu_offset - spanslength &gt; 0) spanslength--;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                this.menu_offset = Math.max(
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    0,
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    this.menu_offset - spanslength);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            if(this.menu_offset == 1)
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                this.menu_offset = 0;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.reset_highlight();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.reset_clickables();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.set_partial_text();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.highlight_selection();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        // Setup partial view text content
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        // with jumps at first and last entry when appropriate
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        set_partial_text(){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let spans = this.text_elt.children;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let contentlength = this.content.length;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let spanslength = spans.length;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let i = this.menu_offset, c = 0;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let m = this.box_bbox;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            while(c &lt; spanslength){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                let span=spans[c];
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                let onclickfunc;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                // backward jump only present if not exactly at start
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                if(c == 0 &amp;&amp; i != 0){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    span.textContent = "&#x25B2;";
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    onclickfunc = this.bound_on_backward_click;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    let o = span.getBBox();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    span.setAttribute("dx", (m.width - o.width)/2);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                // presence of forward jump when not right at the end
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                }else if(c == spanslength-1 &amp;&amp; i &lt; contentlength - 1){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    span.textContent = "&#x25BC;";
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    onclickfunc = this.bound_on_forward_click;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    let o = span.getBBox();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    span.setAttribute("dx", (m.width - o.width)/2);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                // otherwise normal content
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                }else{
Edouard@3092: </xsl:text>
edouard@3355:     <xsl:text>                    span.textContent = gettext(this.content[i]);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    let sel = i;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    onclickfunc = (evt) =&gt; this.bound_on_selection_click(sel);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    span.removeAttribute("dx");
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    i++;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                this.make_clickable(span, onclickfunc);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                c++;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
edouard@3238:     <xsl:text>        numb_event(e) {
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>             e.stopPropagation();
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>        }
edouard@3238: </xsl:text>
Edouard@3092:     <xsl:text>        open(){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let length = this.content.length;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // systematically reset text, to strip eventual whitespace spans
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.reset_text();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // grow as much as needed or possible
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let slots = this.grow_text(length);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // Depending on final size
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            if(slots == length) {
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                // show all at once
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                this.set_complete_text();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            } else {
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                // eventualy align menu to current selection, compensating for lift
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                let offset = this.last_selection - this.lift;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                if(offset &gt; 0)
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    this.menu_offset = Math.min(offset + 1, length - slots + 1);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                else
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                    this.menu_offset = 0;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                // show surrounding values
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                this.set_partial_text();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // Now that text size is known, we can set the box around it
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.adjust_box_to_text();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // Take button out until menu closed
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.element.removeChild(this.button_elt);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // Rise widget to top by moving it to last position among siblings
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.element.parentNode.appendChild(this.element.parentNode.removeChild(this.element));
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // disable interaction with background
Edouard@3092: </xsl:text>
edouard@3238:     <xsl:text>            svg_root.addEventListener("pointerdown", this.numb_event, true);
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>            svg_root.addEventListener("pointerup", this.numb_event, true);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            svg_root.addEventListener("click", this.bound_close_on_click_elsewhere, true);
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.highlight_selection();
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // mark as open
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            this.opened = true;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        // Put text element in normalized state
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        reset_text(){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let txt = this.text_elt;
Edouard@3092: </xsl:text>
Edouard@3091:     <xsl:text>            let first = txt.firstElementChild;
Edouard@3091: </xsl:text>
Edouard@3092:     <xsl:text>            // remove attribute eventually added to first text line while opening
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            first.onclick = null;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            first.removeAttribute("dy");
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            first.removeAttribute("dx");
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            // keep only the first line of text
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            for(let span of Array.from(txt.children).slice(1)){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                txt.removeChild(span)
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        // Put rectangle element in saved original state
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        reset_box(){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let m = this.box_bbox;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let b = this.box_elt;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            b.x.baseVal.value = m.x;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            b.y.baseVal.value = m.y;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            b.width.baseVal.value = m.width;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            b.height.baseVal.value = m.height;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        highlight_selection(){
Edouard@3092: </xsl:text>
edouard@3128:     <xsl:text>            if(this.last_selection == undefined) return;
edouard@3128: </xsl:text>
Edouard@3092:     <xsl:text>            let highlighted_row = this.last_selection - this.menu_offset;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            if(highlighted_row &lt; 0) return;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let spans = this.text_elt.children;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let spanslength = spans.length;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let contentlength = this.content.length;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            if(this.menu_offset != 0) {
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                spanslength--;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>                highlighted_row++;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            if(this.menu_offset + spanslength &lt; contentlength - 1) spanslength--;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            if(highlighted_row &gt; spanslength) return;
Edouard@3092: </xsl:text>
Edouard@3091:     <xsl:text>            let original_text_y = this.text_bbox.y;
Edouard@3091: </xsl:text>
Edouard@3091:     <xsl:text>            let highlight = this.highlight_elt;
Edouard@3091: </xsl:text>
Edouard@3092:     <xsl:text>            let span = spans[highlighted_row];
Edouard@3091: </xsl:text>
Edouard@3091:     <xsl:text>            let yoffset = span.getBBox().y - original_text_y;
Edouard@3091: </xsl:text>
Edouard@3092:     <xsl:text>            highlight.y.baseVal.value = this.highlight_bbox.y + yoffset;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            highlight.style.visibility = "visible";
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        }
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>        reset_highlight(){
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            let highlight = this.highlight_elt;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            highlight.y.baseVal.value = this.highlight_bbox.y;
Edouard@3092: </xsl:text>
Edouard@3092:     <xsl:text>            highlight.style.visibility = "hidden";
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        // Use margin and text size to compute box size
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        adjust_box_to_text(){
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            let [lmargin, tmargin] = this.margins;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            let m = this.text_elt.getBBox();
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            let b = this.box_elt;
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>            // b.x.baseVal.value = m.x - lmargin;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            b.y.baseVal.value = m.y - tmargin;
Edouard@3090: </xsl:text>
Edouard@3091:     <xsl:text>            // b.width.baseVal.value = 2 * lmargin + m.width;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>            b.height.baseVal.value = 2 * tmargin + m.height;
Edouard@3090: </xsl:text>
Edouard@3090:     <xsl:text>        }
Edouard@3090: </xsl:text>
edouard@3238:     <xsl:text>}
edouard@3238: </xsl:text>
edouard@3238:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='DropDown']" mode="widget_defs">
Edouard@2922:     <xsl:param name="hmi_element"/>
Edouard@2922:     <xsl:call-template name="defs_by_labels">
Edouard@2922:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
Edouard@2922:       <xsl:with-param name="labels">
edouard@3355:         <xsl:text>box button highlight</xsl:text>
Edouard@2922:       </xsl:with-param>
Edouard@2922:     </xsl:call-template>
edouard@3355:     <xsl:variable name="text_elt" select="$hmi_element//*[@inkscape:label='text'][1]"/>
edouard@3355:     <xsl:text>init_specific: function() {
edouard@3355: </xsl:text>
edouard@3134:     <xsl:choose>
edouard@3134:       <xsl:when test="count(arg) = 1 and arg[1]/@value = '#langs'">
edouard@3355:         <xsl:text>  this.text_elt = id("</xsl:text>
edouard@3355:         <xsl:value-of select="$text_elt/@id"/>
edouard@3355:         <xsl:text>");
edouard@3355: </xsl:text>
edouard@3355:         <xsl:text>  this.content = langs;
edouard@3355: </xsl:text>
edouard@3355:       </xsl:when>
edouard@3355:       <xsl:when test="count(arg) = 0">
edouard@3355:         <xsl:if test="not($text_elt[self::svg:use])">
edouard@3355:           <xsl:message terminate="yes">
edouard@3355:             <xsl:text>No argrument for HMI:DropDown widget id="</xsl:text>
edouard@3355:             <xsl:value-of select="$hmi_element/@id"/>
edouard@3355:             <xsl:text>" and "text" labeled element is not a svg:use element</xsl:text>
edouard@3355:           </xsl:message>
edouard@3355:         </xsl:if>
edouard@3355:         <xsl:variable name="real_text_elt" select="$result_widgets[@id = $hmi_element/@id]//*[@original=$text_elt/@id]/svg:text"/>
edouard@3355:         <xsl:text>  this.text_elt = id("</xsl:text>
edouard@3355:         <xsl:value-of select="$real_text_elt/@id"/>
edouard@3355:         <xsl:text>");
edouard@3355: </xsl:text>
edouard@3355:         <xsl:variable name="from_list_id" select="substring-after($text_elt/@xlink:href,'#')"/>
edouard@3355:         <xsl:variable name="from_list" select="$hmi_textlists[(@id | */@id) = $from_list_id]"/>
edouard@3355:         <xsl:if test="count($from_list) = 0">
edouard@3355:           <xsl:message terminate="yes">
edouard@3355:             <xsl:text>HMI:DropDown widget id="</xsl:text>
edouard@3355:             <xsl:value-of select="$hmi_element/@id"/>
edouard@3355:             <xsl:text>" "text" labeled element does not point to a svg:text owned by a HMI:List widget</xsl:text>
edouard@3355:           </xsl:message>
edouard@3355:         </xsl:if>
edouard@3355:         <xsl:text>  this.content = hmi_widgets["</xsl:text>
edouard@3355:         <xsl:value-of select="$from_list/@id"/>
edouard@3355:         <xsl:text>"].texts;
edouard@3355: </xsl:text>
edouard@3134:       </xsl:when>
edouard@3134:       <xsl:otherwise>
edouard@3355:         <xsl:text>  this.text_elt = id("</xsl:text>
edouard@3355:         <xsl:value-of select="$text_elt/@id"/>
edouard@3355:         <xsl:text>");
edouard@3355: </xsl:text>
edouard@3355:         <xsl:text>  this.content = [
edouard@3134: </xsl:text>
edouard@3134:         <xsl:for-each select="arg">
edouard@3134:           <xsl:text>"</xsl:text>
edouard@3134:           <xsl:value-of select="@value"/>
edouard@3134:           <xsl:text>",
edouard@3134: </xsl:text>
edouard@3134:         </xsl:for-each>
edouard@3355:         <xsl:text>  ];
edouard@3355: </xsl:text>
edouard@3134:       </xsl:otherwise>
edouard@3134:     </xsl:choose>
edouard@3355:     <xsl:text>}
edouard@3355: </xsl:text>
edouard@3355:   </xsl:template>
edouard@3355:   <declarations:DropDown/>
edouard@3355:   <xsl:template match="declarations:DropDown">
edouard@3355:     <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>/* </xsl:text>
edouard@3355:     <xsl:value-of select="local-name()"/>
edouard@3355:     <xsl:text> */
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>function gettext(o) {
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>    if(typeof(o) == "string"){
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>        return o;
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>    }
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>    return svg_text_to_multiline(o);
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>};
edouard@3355: </xsl:text>
edouard@3355:     <xsl:text>
Edouard@2922: </xsl:text>
Edouard@2922:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='ForEach']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>ForEach widget is used to span a small set of widget over a larger set of
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>repeated HMI_NODEs. 
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Idea is somewhat similar to relative page, but it all happens inside the
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>ForEach widget, no page involved.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Together with relative Jump widgets it can be used to build a menu to reach
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>relative pages covering many identical HMI_NODES siblings.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>ForEach widget takes a HMI_CLASS name as argument and a HMI_NODE path as
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>variable.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Direct sub-elements can be either groups of widget to be spanned, labeled
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>"ClassName:offset", or buttons to control the spanning, labeled
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>"ClassName:+/-number".
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>span widgets over a set of repeated HMI_NODEs</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <arg name="class_name" accepts="string">
edouard@3241:       <xsl:text>HMI_CLASS name</xsl:text>
edouard@3241:     </arg>
edouard@3241:     <path name="root" accepts="HMI_NODE">
edouard@3241:       <xsl:text> where to find HMI_NODEs whose HMI_CLASS is class_name</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='ForEach']" mode="widget_defs">
edouard@2892:     <xsl:param name="hmi_element"/>
edouard@3005:     <xsl:if test="count(path) != 1">
edouard@3005:       <xsl:message terminate="yes">
edouard@3005:         <xsl:text>ForEach widget </xsl:text>
edouard@3005:         <xsl:value-of select="$hmi_element/@id"/>
edouard@3005:         <xsl:text> must have one HMI path given.</xsl:text>
edouard@3005:       </xsl:message>
edouard@3005:     </xsl:if>
edouard@3005:     <xsl:if test="count(arg) != 1">
edouard@3005:       <xsl:message terminate="yes">
edouard@3005:         <xsl:text>ForEach widget </xsl:text>
edouard@3005:         <xsl:value-of select="$hmi_element/@id"/>
edouard@3005:         <xsl:text> must have one argument given : a class name.</xsl:text>
edouard@3005:       </xsl:message>
edouard@3005:     </xsl:if>
edouard@2894:     <xsl:variable name="class" select="arg[1]/@value"/>
edouard@2894:     <xsl:variable name="base_path" select="path/@value"/>
edouard@2894:     <xsl:variable name="hmi_index_base" select="$indexed_hmitree/*[@hmipath = $base_path]"/>
edouard@2894:     <xsl:variable name="hmi_tree_base" select="$hmitree/descendant-or-self::*[@path = $hmi_index_base/@path]"/>
edouard@2894:     <xsl:variable name="hmi_tree_items" select="$hmi_tree_base/*[@class = $class]"/>
edouard@2894:     <xsl:variable name="hmi_index_items" select="$indexed_hmitree/*[@path = $hmi_tree_items/@path]"/>
edouard@2894:     <xsl:variable name="items_paths" select="$hmi_index_items/@hmipath"/>
Edouard@2893:     <xsl:text>    index_pool: [
Edouard@2893: </xsl:text>
edouard@2894:     <xsl:for-each select="$hmi_index_items">
edouard@2894:       <xsl:text>      </xsl:text>
edouard@2894:       <xsl:value-of select="@index"/>
edouard@2894:       <xsl:if test="position()!=last()">
edouard@2894:         <xsl:text>,</xsl:text>
edouard@2894:       </xsl:if>
edouard@2894:       <xsl:text>
edouard@2894: </xsl:text>
edouard@2894:     </xsl:for-each>
Edouard@2893:     <xsl:text>    ],
Edouard@2893: </xsl:text>
edouard@2896:     <xsl:text>    init: function() {
Edouard@2893: </xsl:text>
Edouard@2893:     <xsl:variable name="prefix" select="concat($class,':')"/>
Edouard@2893:     <xsl:variable name="buttons_regex" select="concat('^',$prefix,'[+\-][0-9]+')"/>
edouard@2896:     <xsl:variable name="buttons" select="$hmi_element/*[regexp:test(@inkscape:label, $buttons_regex)]"/>
edouard@2896:     <xsl:for-each select="$buttons">
edouard@2896:       <xsl:variable name="op" select="substring-after(@inkscape:label, $prefix)"/>
edouard@2896:       <xsl:text>        id("</xsl:text>
Edouard@2893:       <xsl:value-of select="@id"/>
edouard@2896:       <xsl:text>").setAttribute("onclick", "hmi_widgets['</xsl:text>
edouard@2896:       <xsl:value-of select="$hmi_element/@id"/>
edouard@2896:       <xsl:text>'].on_click('</xsl:text>
edouard@2896:       <xsl:value-of select="$op"/>
edouard@2896:       <xsl:text>', evt)");
Edouard@2893: </xsl:text>
Edouard@2893:     </xsl:for-each>
edouard@2896:     <xsl:text>
Edouard@2893: </xsl:text>
Edouard@2895:     <xsl:text>        this.items = [
Edouard@2893: </xsl:text>
Edouard@2893:     <xsl:variable name="items_regex" select="concat('^',$prefix,'[0-9]+')"/>
Edouard@2893:     <xsl:variable name="unordered_items" select="$hmi_element//*[regexp:test(@inkscape:label, $items_regex)]"/>
Edouard@2893:     <xsl:for-each select="$unordered_items">
Edouard@2893:       <xsl:variable name="elt_label" select="concat($prefix, string(position()))"/>
Edouard@2893:       <xsl:variable name="elt" select="$unordered_items[@inkscape:label = $elt_label]"/>
edouard@2894:       <xsl:variable name="pos" select="position()"/>
edouard@2894:       <xsl:variable name="item_path" select="$items_paths[$pos]"/>
Edouard@2895:       <xsl:text>          [ /* item="</xsl:text>
Edouard@2893:       <xsl:value-of select="$elt_label"/>
edouard@2894:       <xsl:text>" path="</xsl:text>
edouard@2894:       <xsl:value-of select="$item_path"/>
edouard@2894:       <xsl:text>" */
edouard@2892: </xsl:text>
Edouard@2893:       <xsl:if test="count($elt)=0">
Edouard@2893:         <xsl:message terminate="yes">
Edouard@2893:           <xsl:text>Missing item labeled </xsl:text>
Edouard@2893:           <xsl:value-of select="$elt_label"/>
Edouard@2893:           <xsl:text> in ForEach widget </xsl:text>
Edouard@2893:           <xsl:value-of select="$hmi_element/@id"/>
Edouard@2893:         </xsl:message>
Edouard@2893:       </xsl:if>
Edouard@2893:       <xsl:for-each select="func:refered_elements($elt)[@id = $hmi_elements/@id][not(@id = $elt/@id)]">
edouard@2894:         <xsl:if test="not(func:is_descendant_path(func:widget(@id)/path/@value, $item_path))">
edouard@2894:           <xsl:message terminate="yes">
edouard@2894:             <xsl:text>Widget id="</xsl:text>
edouard@2894:             <xsl:value-of select="@id"/>
edouard@2894:             <xsl:text>" label="</xsl:text>
edouard@2894:             <xsl:value-of select="@inkscape:label"/>
edouard@2894:             <xsl:text>" is having wrong path. Accroding to ForEach widget ancestor id="</xsl:text>
edouard@2894:             <xsl:value-of select="$hmi_element/@id"/>
edouard@2896:             <xsl:text>", path should be descendant of "</xsl:text>
edouard@2894:             <xsl:value-of select="$item_path"/>
edouard@2896:             <xsl:text>".</xsl:text>
edouard@2894:           </xsl:message>
edouard@2894:         </xsl:if>
Edouard@2895:         <xsl:text>            hmi_widgets["</xsl:text>
edouard@2892:         <xsl:value-of select="@id"/>
edouard@2892:         <xsl:text>"]</xsl:text>
edouard@2892:         <xsl:if test="position()!=last()">
edouard@2892:           <xsl:text>,</xsl:text>
edouard@2892:         </xsl:if>
edouard@2892:         <xsl:text>
edouard@2892: </xsl:text>
edouard@2892:       </xsl:for-each>
Edouard@2895:       <xsl:text>          ]</xsl:text>
edouard@2892:       <xsl:if test="position()!=last()">
edouard@2892:         <xsl:text>,</xsl:text>
edouard@2892:       </xsl:if>
edouard@2892:       <xsl:text>
edouard@2892: </xsl:text>
edouard@2892:     </xsl:for-each>
Edouard@2895:     <xsl:text>        ]
Edouard@2895: </xsl:text>
Edouard@2895:     <xsl:text>    },
Edouard@2895: </xsl:text>
Edouard@2895:     <xsl:text>    item_offset: 0,
edouard@2892: </xsl:text>
edouard@2954:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='ForEach']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>ForEachWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@2954: </xsl:text>
edouard@3005:     <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    unsub_items(){
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        for(let item of this.items){
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            for(let widget of item) {
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                widget.unsub();
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>
edouard@3005: </xsl:text>
edouard@2954:     <xsl:text>    unsub(){
edouard@2954: </xsl:text>
edouard@3005:     <xsl:text>        this.unsub_items();
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.offset = 0;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.relativeness = undefined;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    sub_items(){
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        for(let i = 0; i &lt; this.items.length; i++) {
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            let item = this.items[i];
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            let orig_item_index = this.index_pool[i];
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            let item_index = this.index_pool[i+this.item_offset];
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            let item_index_offset = item_index - orig_item_index;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            if(this.relativeness[0])
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                item_index_offset += this.offset;
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>            for(let widget of item) {
edouard@2954: </xsl:text>
edouard@3005:     <xsl:text>                /* all variables of all widgets in a ForEach are all relative. 
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                   Really.
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                   TODO: allow absolute variables in ForEach widgets
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                */
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                widget.sub(item_index_offset, widget.indexes.map(_=&gt;true));
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>            }
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>        }
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>    }
edouard@2942: </xsl:text>
edouard@2954:     <xsl:text>
edouard@2954: </xsl:text>
edouard@3005:     <xsl:text>    sub(new_offset=0, relativeness=[]){
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.offset = new_offset;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.relativeness = relativeness;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.sub_items();
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    apply_cache() {
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.items.forEach(item=&gt;item.forEach(widget=&gt;widget.apply_cache()));
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>    on_click(opstr, evt) {
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        let new_item_offset = eval(String(this.item_offset)+opstr);
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        if(new_item_offset + this.items.length &gt; this.index_pool.length) {
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            if(this.item_offset + this.items.length == this.index_pool.length)
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                new_item_offset = 0;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            else
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                new_item_offset = this.index_pool.length - this.items.length;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        } else if(new_item_offset &lt; 0) {
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            if(this.item_offset == 0)
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                new_item_offset = this.index_pool.length - this.items.length;
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>            else
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>                new_item_offset = 0;
edouard@3003: </xsl:text>
edouard@3003:     <xsl:text>        }
edouard@3003: </xsl:text>
edouard@2954:     <xsl:text>        this.item_offset = new_item_offset;
edouard@2954: </xsl:text>
edouard@3005:     <xsl:text>        this.unsub_items();
edouard@3005: </xsl:text>
edouard@3005:     <xsl:text>        this.sub_items();
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>        update_subscriptions();
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>        need_cache_apply.push(this);
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>        jumps_need_update = true;
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>        requestHMIAnimation();
edouard@2954: </xsl:text>
edouard@2954:     <xsl:text>    }
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>}
edouard@2942: </xsl:text>
edouard@2942:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Input']" mode="widget_desc">
edouard@3238:     <type>
edouard@3238:       <xsl:value-of select="@type"/>
edouard@3238:     </type>
edouard@3238:     <longdesc>
edouard@3238:       <xsl:text>Input widget takes one variable path, and displays current value in
edouard@3238: </xsl:text>
edouard@3241:       <xsl:text>optional "value" labeled sub-element. 
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Click on optional "edit" labeled element opens keypad to edit value.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Operation on current value is performed when click on sub-elements with
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>label starting with '=', '+' or '-' sign. Value after sign is used as
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>operand.
edouard@3238: </xsl:text>
edouard@3238:     </longdesc>
edouard@3238:     <shortdesc>
edouard@3238:       <xsl:text>Input field with predefined operation buttons</xsl:text>
edouard@3238:     </shortdesc>
edouard@3241:     <arg name="format" accepts="string">
edouard@3238:       <xsl:text>optional printf-like format </xsl:text>
edouard@3238:     </arg>
edouard@3241:     <path name="edit" accepts="HMI_INT, HMI_REAL, HMI_STRING">
edouard@3238:       <xsl:text>single variable to edit</xsl:text>
edouard@3238:     </path>
edouard@3238:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Input']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>InputWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     on_op_click(opstr) {
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.change_hmi_value(0, opstr);
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     }
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     edit_callback(new_val) {
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.apply_hmi_value(0, new_val);
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     }
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     is_inhibited = false;
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     alert(msg){
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.is_inhibited = true;
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.display = msg;
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         setTimeout(() =&gt; this.stopalert(), 1000);
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.request_animate();
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     }
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     stopalert(){
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.is_inhibited = false;
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.display = this.last_value;
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.request_animate();
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     }
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     overshot(new_val, max) {
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.alert("max");
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     }
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     undershot(new_val, min) {
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>         this.alert("min");
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>     }
edouard@3238: </xsl:text>
edouard@3238:     <xsl:text>}
edouard@3238: </xsl:text>
edouard@3238:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Input']" mode="widget_defs">
Edouard@2801:     <xsl:param name="hmi_element"/>
Edouard@2836:     <xsl:variable name="value_elt">
Edouard@2836:       <xsl:call-template name="defs_by_labels">
Edouard@2836:         <xsl:with-param name="hmi_element" select="$hmi_element"/>
Edouard@2836:         <xsl:with-param name="labels">
Edouard@2836:           <xsl:text>value</xsl:text>
Edouard@2836:         </xsl:with-param>
Edouard@2836:         <xsl:with-param name="mandatory" select="'no'"/>
Edouard@2836:       </xsl:call-template>
Edouard@2836:     </xsl:variable>
Edouard@2861:     <xsl:variable name="have_value" select="string-length($value_elt)&gt;0"/>
Edouard@2836:     <xsl:value-of select="$value_elt"/>
edouard@3094:     <xsl:variable name="edit_elt">
edouard@3094:       <xsl:call-template name="defs_by_labels">
edouard@3094:         <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@3094:         <xsl:with-param name="labels">
edouard@3094:           <xsl:text>edit</xsl:text>
edouard@3094:         </xsl:with-param>
edouard@3094:         <xsl:with-param name="mandatory" select="'no'"/>
edouard@3094:       </xsl:call-template>
edouard@3094:     </xsl:variable>
edouard@3094:     <xsl:variable name="have_edit" select="string-length($edit_elt)&gt;0"/>
edouard@3094:     <xsl:value-of select="$edit_elt"/>
Edouard@2861:     <xsl:if test="$have_value">
edouard@2851:       <xsl:text>    frequency: 5,
Edouard@2836: </xsl:text>
Edouard@2836:     </xsl:if>
edouard@2851:     <xsl:text>    dispatch: function(value) {
Edouard@2801: </xsl:text>
edouard@3155:     <xsl:if test="$have_value or $have_edit">
edouard@3154:       <xsl:choose>
edouard@3154:         <xsl:when test="count(arg) = 1">
Edouard@3188:           <xsl:text>        this.last_value = vsprintf("</xsl:text>
edouard@3154:           <xsl:value-of select="arg[1]/@value"/>
edouard@3155:           <xsl:text>", [value]);
edouard@3154: </xsl:text>
edouard@3154:         </xsl:when>
edouard@3154:         <xsl:otherwise>
Edouard@3188:           <xsl:text>        this.last_value = value;
edouard@3154: </xsl:text>
edouard@3154:         </xsl:otherwise>
edouard@3154:       </xsl:choose>
Edouard@3188:       <xsl:text>        if(!this.is_inhibited){
Edouard@3188: </xsl:text>
Edouard@3188:       <xsl:text>            this.display = this.last_value;
Edouard@3188: </xsl:text>
Edouard@3188:       <xsl:if test="$have_value">
Edouard@3188:         <xsl:text>            this.request_animate();
Edouard@3188: </xsl:text>
Edouard@3188:       </xsl:if>
Edouard@3188:       <xsl:text>        }
Edouard@2836: </xsl:text>
Edouard@2836:     </xsl:if>
edouard@2851:     <xsl:text>    },
Edouard@2801: </xsl:text>
edouard@3103:     <xsl:if test="$have_value">
edouard@3103:       <xsl:text>    animate: function(){
edouard@3103: </xsl:text>
Edouard@3188:       <xsl:text>        this.value_elt.textContent = String(this.display);
edouard@3103: </xsl:text>
edouard@3103:       <xsl:text>    },
edouard@3103: </xsl:text>
edouard@3103:     </xsl:if>
edouard@2851:     <xsl:text>    init: function() {
Edouard@2801: </xsl:text>
edouard@3094:     <xsl:if test="$have_edit">
Edouard@3118:       <xsl:text>        this.edit_elt.onclick = () =&gt; edit_value("</xsl:text>
edouard@3094:       <xsl:value-of select="path/@value"/>
edouard@3094:       <xsl:text>", "</xsl:text>
edouard@3094:       <xsl:value-of select="path/@type"/>
Edouard@3188:       <xsl:text>", this, this.last_value);
Edouard@2801: </xsl:text>
edouard@3154:       <xsl:if test="$have_value">
edouard@3154:         <xsl:text>        this.value_elt.style.pointerEvents = "none";
edouard@3154: </xsl:text>
edouard@3154:       </xsl:if>
Edouard@2801:     </xsl:if>
Edouard@2829:     <xsl:for-each select="$hmi_element/*[regexp:test(@inkscape:label,'^[=+\-].+')]">
edouard@2851:       <xsl:text>        id("</xsl:text>
Edouard@2801:       <xsl:value-of select="@id"/>
edouard@3094:       <xsl:text>").onclick = () =&gt; this.on_op_click("</xsl:text>
Edouard@2829:       <xsl:value-of select="func:escape_quotes(@inkscape:label)"/>
edouard@3094:       <xsl:text>");
Edouard@2801: </xsl:text>
Edouard@2801:     </xsl:for-each>
edouard@2851:     <xsl:text>    },
Edouard@2801: </xsl:text>
Edouard@2801:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='JsonTable']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Send given variables as POST to http URL argument, spread returned JSON in
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>SVG sub-elements of "data" labeled element.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
Edouard@3387:       <xsl:text>Documentation to be written. see svghmi exemple.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Http POST variables, spread JSON back</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <arg name="url" accepts="string">
edouard@3241:       <xsl:text> </xsl:text>
edouard@3241:     </arg>
edouard@3241:     <path name="edit" accepts="HMI_INT, HMI_REAL, HMI_STRING">
edouard@3241:       <xsl:text>single variable to edit</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='JsonTable']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>JsonTableWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@2994: </xsl:text>
edouard@3069:     <xsl:text>    // arbitrary defaults to avoid missing entries in query
edouard@3069: </xsl:text>
Edouard@3187:     <xsl:text>    cache = [0,0,0];
Edouard@3034: </xsl:text>
edouard@3181:     <xsl:text>    init_common() {
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>        this.spread_json_data_bound = this.spread_json_data.bind(this);
Edouard@3080: </xsl:text>
Edouard@3150:     <xsl:text>        this.handle_http_response_bound = this.handle_http_response.bind(this);
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        this.fetch_error_bound = this.fetch_error.bind(this);
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        this.promised = false;
Edouard@3150: </xsl:text>
Edouard@3080:     <xsl:text>    }
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>    handle_http_response(response) {
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>        if (!response.ok) {
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>          console.log("HTTP error, status = " + response.status);
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>        }
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>        return response.json();
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>    }
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>
Edouard@3080: </xsl:text>
Edouard@3150:     <xsl:text>    fetch_error(e){
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        console.log("HTTP fetch error, message = " + e.message + "Widget:" + this.element_id);
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>    }
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>
Edouard@3150: </xsl:text>
Edouard@3048:     <xsl:text>    do_http_request(...opt) {
edouard@2996: </xsl:text>
Edouard@3150:     <xsl:text>        this.abort_controller = new AbortController();
Edouard@3150: </xsl:text>
Edouard@3195:     <xsl:text>        return Promise.resolve().then(() =&gt; {
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>            const query = {
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                args: this.args,
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                range: this.cache[1],
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                position: this.cache[2],
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                visible: this.visible,
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                extra: this.cache.slice(4),
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                options: opt
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>            };
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>            const options = {
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                 method: 'POST',
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                 body: JSON.stringify(query),
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                 headers: {'Content-Type': 'application/json'},
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                 signal: this.abort_controller.signal
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>            };
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>            return fetch(this.args[0], options)
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                    .then(this.handle_http_response_bound)
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                    .then(this.spread_json_data_bound)
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>                    .catch(this.fetch_error_bound);
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>        });
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>    }
Edouard@3195: </xsl:text>
Edouard@3195:     <xsl:text>
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>    unsub(){
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        this.abort_controller.abort();
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        super.unsub();
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>    }
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>
edouard@2996: </xsl:text>
Edouard@3189:     <xsl:text>    sub(...args){
Edouard@3189: </xsl:text>
Edouard@3189:     <xsl:text>        this.cache[0] = undefined;
Edouard@3189: </xsl:text>
Edouard@3189:     <xsl:text>        super.sub(...args);
Edouard@3189: </xsl:text>
Edouard@3189:     <xsl:text>    }
Edouard@3189: </xsl:text>
Edouard@3189:     <xsl:text>
Edouard@3189: </xsl:text>
Edouard@3034:     <xsl:text>    dispatch(value, oldval, index) {
Edouard@3034: </xsl:text>
Edouard@3150:     <xsl:text>
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        if(this.cache[index] != value)
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>            this.cache[index] = value;
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        else
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>            return;
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        if(!this.promised){
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>            this.promised = true;
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>            this.do_http_request().finally(() =&gt; {
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>                this.promised = false;
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>            });
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        }
edouard@2996: </xsl:text>
edouard@2996:     <xsl:text>    }
edouard@2996: </xsl:text>
Edouard@3080:     <xsl:text>    make_on_click(...options){
Edouard@3080: </xsl:text>
Edouard@3084:     <xsl:text>        let that = this;
Edouard@3084: </xsl:text>
Edouard@3080:     <xsl:text>        return function(evt){
Edouard@3080: </xsl:text>
Edouard@3084:     <xsl:text>            that.do_http_request(...options);
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>        }
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>    }
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>    // on_click(evt, ...options) {
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>    //     this.do_http_request(...options);
Edouard@3080: </xsl:text>
Edouard@3080:     <xsl:text>    // }
edouard@2994: </xsl:text>
edouard@2994:     <xsl:text>}
edouard@2994: </xsl:text>
edouard@2994:   </xsl:template>
Edouard@3019:   <xsl:template mode="json_table_elt_render" match="svg:*">
edouard@2997:     <xsl:message terminate="yes">
edouard@2996:       <xsl:text>JsonTable Widget can't contain element of type </xsl:text>
edouard@2996:       <xsl:value-of select="local-name()"/>
edouard@2996:       <xsl:text>.</xsl:text>
edouard@2996:     </xsl:message>
edouard@2996:   </xsl:template>
Edouard@3031:   <func:function name="func:json_expressions">
Edouard@3031:     <xsl:param name="expressions"/>
Edouard@3031:     <xsl:param name="label"/>
Edouard@3031:     <xsl:choose>
Edouard@3031:       <xsl:when test="$label">
Edouard@3031:         <xsl:variable name="suffixes" select="str:split($label)"/>
Edouard@3031:         <xsl:variable name="res">
Edouard@3031:           <xsl:for-each select="$suffixes">
Edouard@3031:             <expression>
Edouard@3031:               <xsl:variable name="suffix" select="."/>
Edouard@3031:               <xsl:variable name="pos" select="position()"/>
Edouard@3031:               <xsl:variable name="expr" select="$expressions[position() &lt;= $pos][last()]/expression"/>
Edouard@3031:               <xsl:choose>
Edouard@3031:                 <xsl:when test="contains($suffix,'=')">
Edouard@3031:                   <xsl:variable name="name" select="substring-before($suffix,'=')"/>
Edouard@3031:                   <xsl:if test="$expr/@name[. != $name]">
Edouard@3031:                     <xsl:message terminate="yes">
Edouard@3031:                       <xsl:text>JsonTable : missplaced '=' or inconsistent names in Json data expressions.</xsl:text>
Edouard@3031:                     </xsl:message>
Edouard@3031:                   </xsl:if>
Edouard@3031:                   <xsl:attribute name="name">
Edouard@3031:                     <xsl:value-of select="$name"/>
Edouard@3031:                   </xsl:attribute>
Edouard@3031:                   <xsl:attribute name="content">
Edouard@3031:                     <xsl:value-of select="$expr/@content"/>
Edouard@3031:                     <xsl:value-of select="substring-after($suffix,'=')"/>
Edouard@3031:                   </xsl:attribute>
Edouard@3031:                 </xsl:when>
Edouard@3031:                 <xsl:otherwise>
Edouard@3031:                   <xsl:copy-of select="$expr/@name"/>
Edouard@3031:                   <xsl:attribute name="content">
Edouard@3031:                     <xsl:value-of select="$expr/@content"/>
Edouard@3031:                     <xsl:value-of select="$suffix"/>
Edouard@3031:                   </xsl:attribute>
Edouard@3031:                 </xsl:otherwise>
Edouard@3031:               </xsl:choose>
Edouard@3031:             </expression>
Edouard@3031:           </xsl:for-each>
Edouard@3031:         </xsl:variable>
Edouard@3031:         <func:result select="exsl:node-set($res)"/>
Edouard@3031:       </xsl:when>
Edouard@3031:       <xsl:otherwise>
Edouard@3031:         <func:result select="$expressions"/>
Edouard@3031:       </xsl:otherwise>
Edouard@3031:     </xsl:choose>
Edouard@3031:   </func:function>
Edouard@3031:   <xsl:variable name="initexpr">
Edouard@3031:     <expression>
Edouard@3031:       <xsl:attribute name="content">
Edouard@3031:         <xsl:text>jdata</xsl:text>
Edouard@3031:       </xsl:attribute>
Edouard@3031:     </expression>
Edouard@3031:   </xsl:variable>
Edouard@3031:   <xsl:variable name="initexpr_ns" select="exsl:node-set($initexpr)"/>
Edouard@3019:   <xsl:template mode="json_table_elt_render" match="svg:use">
Edouard@3031:     <xsl:param name="expressions"/>
edouard@2997:     <xsl:variable name="targetid" select="substring-after(@xlink:href,'#')"/>
edouard@2997:     <xsl:variable name="from_list" select="$hmi_lists[(@id | */@id) = $targetid]"/>
usveticic@3045:     <xsl:choose>
usveticic@3045:       <xsl:when test="count($from_list) &gt; 0">
usveticic@3045:         <xsl:text>        id("</xsl:text>
usveticic@3045:         <xsl:value-of select="@id"/>
Edouard@3387:         <xsl:text>").href.baseVal =
usveticic@3045: </xsl:text>
usveticic@3045:         <xsl:text>            "#"+hmi_widgets["</xsl:text>
usveticic@3045:         <xsl:value-of select="$from_list/@id"/>
usveticic@3045:         <xsl:text>"].items[</xsl:text>
Edouard@3031:         <xsl:value-of select="$expressions/expression[1]/@content"/>
Edouard@3387:         <xsl:text>];
usveticic@3045: </xsl:text>
usveticic@3045:       </xsl:when>
usveticic@3045:       <xsl:otherwise>
usveticic@3045:         <xsl:message terminate="no">
Edouard@3031:           <xsl:text>Clones (svg:use) in JsonTable Widget must point to a valid HMI:List widget or item. Reference "</xsl:text>
usveticic@3045:           <xsl:value-of select="@xlink:href"/>
usveticic@3045:           <xsl:text>" is not valid and will not be updated.</xsl:text>
usveticic@3045:         </xsl:message>
usveticic@3045:       </xsl:otherwise>
usveticic@3045:     </xsl:choose>
edouard@2996:   </xsl:template>
Edouard@3019:   <xsl:template mode="json_table_elt_render" match="svg:text">
Edouard@3031:     <xsl:param name="expressions"/>
Edouard@3031:     <xsl:variable name="value_expr" select="$expressions/expression[1]/@content"/>
Edouard@3031:     <xsl:variable name="original" select="@original"/>
Edouard@3031:     <xsl:variable name="from_textstylelist" select="$textstylelist_related_ns/list[elt/@eltid = $original]"/>
Edouard@3031:     <xsl:choose>
Edouard@3031:       <xsl:when test="count($from_textstylelist) &gt; 0">
Edouard@3031:         <xsl:variable name="content_expr" select="$expressions/expression[2]/@content"/>
Edouard@3031:         <xsl:if test="string-length($content_expr) = 0 or $expressions/expression[2]/@name != 'textContent'">
Edouard@3031:           <xsl:message terminate="yes">
Edouard@3031:             <xsl:text>Clones (svg:use) in JsonTable Widget pointing to a HMI:TextStyleList widget or item must have a "textContent=.someVal" assignement following value expression in label.</xsl:text>
Edouard@3031:           </xsl:message>
Edouard@3031:         </xsl:if>
Edouard@3031:         <xsl:text>        {
Edouard@3031: </xsl:text>
Edouard@3031:         <xsl:text>          let elt = id("</xsl:text>
Edouard@3031:         <xsl:value-of select="@id"/>
Edouard@3031:         <xsl:text>");
Edouard@3031: </xsl:text>
Edouard@3031:         <xsl:text>          elt.textContent = String(</xsl:text>
Edouard@3031:         <xsl:value-of select="$content_expr"/>
Edouard@3031:         <xsl:text>);
Edouard@3031: </xsl:text>
Edouard@3031:         <xsl:text>          elt.style = hmi_widgets["</xsl:text>
Edouard@3031:         <xsl:value-of select="$from_textstylelist/@listid"/>
Edouard@3031:         <xsl:text>"].styles[</xsl:text>
Edouard@3031:         <xsl:value-of select="$value_expr"/>
Edouard@3031:         <xsl:text>];
Edouard@3031: </xsl:text>
Edouard@3031:         <xsl:text>        }
Edouard@3031: </xsl:text>
Edouard@3031:       </xsl:when>
Edouard@3031:       <xsl:otherwise>
Edouard@3031:         <xsl:text>        id("</xsl:text>
Edouard@3031:         <xsl:value-of select="@id"/>
Edouard@3031:         <xsl:text>").textContent = String(</xsl:text>
Edouard@3031:         <xsl:value-of select="$value_expr"/>
Edouard@3031:         <xsl:text>);
Edouard@3031: </xsl:text>
Edouard@3031:       </xsl:otherwise>
Edouard@3031:     </xsl:choose>
Edouard@3031:   </xsl:template>
Edouard@3031:   <func:function name="func:filter_non_widget_label">
Edouard@3031:     <xsl:param name="elt"/>
Edouard@3031:     <xsl:param name="widget_elts"/>
Edouard@3031:     <xsl:variable name="eltid">
Edouard@3031:       <xsl:choose>
Edouard@3031:         <xsl:when test="$elt/@original">
Edouard@3031:           <xsl:value-of select="$elt/@original"/>
Edouard@3031:         </xsl:when>
Edouard@3031:         <xsl:otherwise>
Edouard@3031:           <xsl:value-of select="$elt/@id"/>
Edouard@3031:         </xsl:otherwise>
Edouard@3031:       </xsl:choose>
Edouard@3031:     </xsl:variable>
Edouard@3031:     <func:result select="$widget_elts[@id=$eltid]/@inkscape:label"/>
Edouard@3031:   </func:function>
Edouard@3043:   <xsl:template mode="json_table_render_except_comments" match="svg:*">
Edouard@3043:     <xsl:param name="expressions"/>
Edouard@3043:     <xsl:param name="widget_elts"/>
Edouard@3043:     <xsl:variable name="label" select="func:filter_non_widget_label(., $widget_elts)"/>
Edouard@3043:     <xsl:if test="not(starts-with($label,'#'))">
Edouard@3043:       <xsl:apply-templates mode="json_table_render" select=".">
Edouard@3043:         <xsl:with-param name="expressions" select="$expressions"/>
Edouard@3043:         <xsl:with-param name="widget_elts" select="$widget_elts"/>
Edouard@3043:         <xsl:with-param name="label" select="$label"/>
Edouard@3043:       </xsl:apply-templates>
Edouard@3043:     </xsl:if>
Edouard@3043:   </xsl:template>
Edouard@3019:   <xsl:template mode="json_table_render" match="svg:*">
Edouard@3031:     <xsl:param name="expressions"/>
Edouard@3031:     <xsl:param name="widget_elts"/>
Edouard@3043:     <xsl:param name="label"/>
Edouard@3048:     <xsl:variable name="new_expressions" select="func:json_expressions($expressions, $label)"/>
Edouard@3048:     <xsl:variable name="elt" select="."/>
Edouard@3048:     <xsl:for-each select="$new_expressions/expression[position() &gt; 1][starts-with(@name,'onClick')]">
Edouard@3048:       <xsl:text>        id("</xsl:text>
Edouard@3048:       <xsl:value-of select="$elt/@id"/>
Edouard@3080:       <xsl:text>").onclick = this.make_on_click('</xsl:text>
Edouard@3048:       <xsl:value-of select="@name"/>
Edouard@3084:       <xsl:text>', </xsl:text>
Edouard@3048:       <xsl:value-of select="@content"/>
Edouard@3084:       <xsl:text>);
Edouard@3048: </xsl:text>
Edouard@3048:     </xsl:for-each>
Edouard@3019:     <xsl:apply-templates mode="json_table_elt_render" select=".">
Edouard@3048:       <xsl:with-param name="expressions" select="$new_expressions"/>
edouard@2996:     </xsl:apply-templates>
edouard@2996:   </xsl:template>
Edouard@3019:   <xsl:template mode="json_table_render" match="svg:g">
Edouard@3031:     <xsl:param name="expressions"/>
Edouard@3031:     <xsl:param name="widget_elts"/>
Edouard@3043:     <xsl:param name="label"/>
Edouard@3038:     <xsl:variable name="varprefix">
Edouard@3038:       <xsl:text>obj_</xsl:text>
Edouard@3150:       <xsl:value-of select="@id"/>
Edouard@3038:       <xsl:text>_</xsl:text>
Edouard@3038:     </xsl:variable>
Edouard@3038:     <xsl:text>        try {
Edouard@3038: </xsl:text>
Edouard@3038:     <xsl:for-each select="$expressions/expression">
Edouard@3038:       <xsl:text>         let </xsl:text>
Edouard@3038:       <xsl:value-of select="$varprefix"/>
Edouard@3038:       <xsl:value-of select="position()"/>
Edouard@3038:       <xsl:text> = </xsl:text>
Edouard@3038:       <xsl:value-of select="@content"/>
Edouard@3038:       <xsl:text>;
Edouard@3038: </xsl:text>
Edouard@3038:       <xsl:text>         if(</xsl:text>
Edouard@3038:       <xsl:value-of select="$varprefix"/>
Edouard@3038:       <xsl:value-of select="position()"/>
Edouard@3038:       <xsl:text> == undefined) {
Edouard@3038: </xsl:text>
Edouard@3038:       <xsl:text>              throw null;
Edouard@3038: </xsl:text>
Edouard@3038:       <xsl:text>         }
Edouard@3038: </xsl:text>
Edouard@3038:     </xsl:for-each>
Edouard@3038:     <xsl:variable name="new_expressions">
Edouard@3038:       <xsl:for-each select="$expressions/expression">
Edouard@3038:         <xsl:copy>
Edouard@3038:           <xsl:copy-of select="@name"/>
Edouard@3038:           <xsl:attribute name="content">
Edouard@3038:             <xsl:value-of select="$varprefix"/>
Edouard@3038:             <xsl:value-of select="position()"/>
Edouard@3038:           </xsl:attribute>
Edouard@3038:         </xsl:copy>
Edouard@3038:       </xsl:for-each>
Edouard@3038:     </xsl:variable>
Edouard@3038:     <xsl:text>          id("</xsl:text>
edouard@2997:     <xsl:value-of select="@id"/>
Edouard@3080:     <xsl:text>").style = "</xsl:text>
Edouard@3038:     <xsl:value-of select="@style"/>
Edouard@3080:     <xsl:text>";
Edouard@3038: </xsl:text>
Edouard@3043:     <xsl:apply-templates mode="json_table_render_except_comments" select="*">
Edouard@3038:       <xsl:with-param name="expressions" select="func:json_expressions(exsl:node-set($new_expressions), $label)"/>
Edouard@3031:       <xsl:with-param name="widget_elts" select="$widget_elts"/>
edouard@2996:     </xsl:apply-templates>
Edouard@3038:     <xsl:text>        } catch(err) {
Edouard@3038: </xsl:text>
Edouard@3038:     <xsl:text>          id("</xsl:text>
Edouard@3150:     <xsl:value-of select="@id"/>
Edouard@3080:     <xsl:text>").style = "display:none";
Edouard@3038: </xsl:text>
Edouard@3038:     <xsl:text>        }
Edouard@3038: </xsl:text>
edouard@2996:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='JsonTable']" mode="widget_defs">
edouard@2996:     <xsl:param name="hmi_element"/>
edouard@2996:     <xsl:call-template name="defs_by_labels">
edouard@2996:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@2996:       <xsl:with-param name="labels">
edouard@2996:         <xsl:text>data</xsl:text>
edouard@2996:       </xsl:with-param>
edouard@2996:     </xsl:call-template>
edouard@2996:     <xsl:variable name="data_elt" select="$result_svg_ns//*[@id = $hmi_element/@id]/*[@inkscape:label = 'data']"/>
Edouard@3038:     <xsl:text>    visible: </xsl:text>
Edouard@3038:     <xsl:value-of select="count($data_elt/*[@inkscape:label])"/>
Edouard@3038:     <xsl:text>,
Edouard@3038: </xsl:text>
Edouard@3038:     <xsl:text>    spread_json_data: function(janswer) {
Edouard@3038: </xsl:text>
Edouard@3038:     <xsl:text>        let [range,position,jdata] = janswer;
Edouard@3038: </xsl:text>
Edouard@3150:     <xsl:text>        [[1, range], [2, position], [3, this.visible]].map(([i,v]) =&gt; {
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>             this.apply_hmi_value(i,v);
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>             this.cache[i] = v;
Edouard@3150: </xsl:text>
Edouard@3150:     <xsl:text>        });
Edouard@3065: </xsl:text>
Edouard@3043:     <xsl:apply-templates mode="json_table_render_except_comments" select="$data_elt">
Edouard@3031:       <xsl:with-param name="expressions" select="$initexpr_ns"/>
Edouard@3031:       <xsl:with-param name="widget_elts" select="$hmi_element/*[@inkscape:label = 'data']/descendant::svg:*"/>
edouard@2996:     </xsl:apply-templates>
edouard@3181:     <xsl:text>    },
edouard@3181: </xsl:text>
edouard@3181:     <xsl:text>    init() {
edouard@3181: </xsl:text>
edouard@3181:     <xsl:text>       this.init_common();
edouard@3181: </xsl:text>
edouard@3181:     <xsl:for-each select="$hmi_element/*[starts-with(@inkscape:label,'action_')]">
edouard@3181:       <xsl:text>        id("</xsl:text>
edouard@3181:       <xsl:value-of select="@id"/>
edouard@3181:       <xsl:text>").onclick = this.make_on_click("</xsl:text>
edouard@3181:       <xsl:value-of select="func:escape_quotes(@inkscape:label)"/>
edouard@3181:       <xsl:text>");
edouard@3181: </xsl:text>
edouard@3181:     </xsl:for-each>
edouard@2997:     <xsl:text>    }
edouard@2996: </xsl:text>
edouard@2996:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='Jump']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Jump widget brings focus to a different page. Mandatory single argument
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>gives name of the page.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Optional single path is used as new reference when jumping to a relative
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>page, it must point to a HMI_NODE.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>"active"+"inactive" labeled elements can be provided and reflect current
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>page being shown.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>"disabled" labeled element, if provided, is shown instead of "active" or
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>"inactive" widget when pointed HMI_NODE is null.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Jump to given page</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <arg name="page" accepts="string">
edouard@3241:       <xsl:text>name of page to jump to</xsl:text>
edouard@3241:     </arg>
edouard@3241:     <path name="reference" count="optional" accepts="HMI_NODE">
edouard@3241:       <xsl:text>reference for relative jump</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Jump']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>JumpWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        activable = false;
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        active = false;
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        disabled = false;
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        frequency = 2;
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        update_activity() {
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            if(this.active) {
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                 /* show active */ 
Edouard@3112: </xsl:text>
Edouard@3240:     <xsl:text>                 this.active_elt.style.display = "";
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                 /* hide inactive */ 
Edouard@3112: </xsl:text>
Edouard@3240:     <xsl:text>                 this.inactive_elt.style.display = "none";
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            } else {
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                 /* show inactive */ 
Edouard@3112: </xsl:text>
Edouard@3240:     <xsl:text>                 this.inactive_elt.style.display = "";
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                 /* hide active */ 
Edouard@3112: </xsl:text>
Edouard@3240:     <xsl:text>                 this.active_elt.style.display = "none";
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3240:     <xsl:text>        update_disability() {
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>            if(this.disabled) {
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                /* show disabled */ 
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                this.disabled_elt.style.display = "";
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                /* hide inactive */ 
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                this.inactive_elt.style.display = "none";
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                /* hide active */ 
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                this.active_elt.style.display = "none";
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>            } else {
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                /* hide disabled */ 
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                this.disabled_elt.style.display = "none";
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                this.update_activity();
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>            }
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>        }
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>
Edouard@3240: </xsl:text>
Edouard@3112:     <xsl:text>        make_on_click() {
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            let that = this;
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            const name = this.args[0];
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            return function(evt){
Edouard@3112: </xsl:text>
Edouard@3240:     <xsl:text>                /* TODO: in order to allow jumps to page selected through for exemple a dropdown,
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                   support path pointing to local variable whom value 
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                   would be an HMI_TREE index and then jump to a relative page not hard-coded in advance */
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                if(!that.disabled) {
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                    const index = that.indexes.length &gt; 0 ? that.indexes[0] + that.offset : undefined;
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                    switch_page(name, index);
Edouard@3240: </xsl:text>
Edouard@3240:     <xsl:text>                }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        notify_page_change(page_name, index) {
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            if(this.activable) {
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                const ref_index = this.indexes.length &gt; 0 ? this.indexes[0] + this.offset : undefined;
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                const ref_name = this.args[0];
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>                this.active = ((ref_name == undefined || ref_name == page_name) &amp;&amp; index == ref_index);
Edouard@3112: </xsl:text>
Edouard@3240:     <xsl:text>                this.update_state();
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        dispatch(value) {
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            this.disabled = !Number(value);
Edouard@3112: </xsl:text>
Edouard@3240:     <xsl:text>            this.update_state();
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        }
Edouard@3112: </xsl:text>
edouard@3238:     <xsl:text>}
edouard@3238: </xsl:text>
edouard@3238:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Jump']" mode="widget_defs">
edouard@2883:     <xsl:param name="hmi_element"/>
Edouard@2906:     <xsl:variable name="activity">
Edouard@3112:       <xsl:call-template name="defs_by_labels">
Edouard@2903:         <xsl:with-param name="hmi_element" select="$hmi_element"/>
Edouard@3112:         <xsl:with-param name="labels">
Edouard@3112:           <xsl:text>active inactive</xsl:text>
Edouard@3112:         </xsl:with-param>
Edouard@3112:         <xsl:with-param name="mandatory" select="'no'"/>
Edouard@2903:       </xsl:call-template>
Edouard@2903:     </xsl:variable>
Edouard@2906:     <xsl:variable name="have_activity" select="string-length($activity)&gt;0"/>
Edouard@2906:     <xsl:value-of select="$activity"/>
Edouard@2906:     <xsl:variable name="disability">
Edouard@3112:       <xsl:call-template name="defs_by_labels">
Edouard@2906:         <xsl:with-param name="hmi_element" select="$hmi_element"/>
Edouard@3112:         <xsl:with-param name="labels">
Edouard@3112:           <xsl:text>disabled</xsl:text>
Edouard@3112:         </xsl:with-param>
Edouard@3112:         <xsl:with-param name="mandatory" select="'no'"/>
Edouard@2906:       </xsl:call-template>
Edouard@2906:     </xsl:variable>
Edouard@2906:     <xsl:variable name="have_disability" select="$have_activity and string-length($disability)&gt;0"/>
Edouard@2906:     <xsl:value-of select="$disability"/>
edouard@2883:     <xsl:text>    init: function() {
edouard@2883: </xsl:text>
Edouard@3084:     <xsl:text>        this.element.onclick = this.make_on_click();
edouard@2883: </xsl:text>
Edouard@2906:     <xsl:if test="$have_activity">
Edouard@3112:       <xsl:text>        this.activable = true;
Edouard@3112: </xsl:text>
Edouard@2903:     </xsl:if>
Edouard@3240:     <xsl:if test="not($have_disability)">
Edouard@3240:       <xsl:text>        this.unsubscribable = true;
Edouard@3240: </xsl:text>
Edouard@3240:     </xsl:if>
Edouard@3240:     <xsl:text>        this.update_state = </xsl:text>
Edouard@2906:     <xsl:choose>
Edouard@2906:       <xsl:when test="$have_disability">
Edouard@3240:         <xsl:text>this.update_disability</xsl:text>
Edouard@3240:       </xsl:when>
Edouard@3240:       <xsl:when test="$have_activity">
Edouard@3240:         <xsl:text>this.update_activity</xsl:text>
Edouard@2906:       </xsl:when>
Edouard@2906:       <xsl:otherwise>
Edouard@3240:         <xsl:text>null</xsl:text>
Edouard@2906:       </xsl:otherwise>
Edouard@2906:     </xsl:choose>
Edouard@3240:     <xsl:text>;
Edouard@3240: </xsl:text>
edouard@2954:     <xsl:text>    },
edouard@2954: </xsl:text>
Edouard@2906:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Jump']" mode="widget_page">
edouard@3238:     <xsl:param name="page_desc"/>
Edouard@2901:     <xsl:param name="page_desc"/>
Edouard@2901:     <xsl:if test="path">
Edouard@2901:       <xsl:variable name="target_page_name">
Edouard@2901:         <xsl:choose>
Edouard@2901:           <xsl:when test="arg">
Edouard@2901:             <xsl:value-of select="arg[1]/@value"/>
Edouard@2901:           </xsl:when>
Edouard@2901:           <xsl:otherwise>
Edouard@2901:             <xsl:value-of select="$page_desc/arg[1]/@value"/>
Edouard@2901:           </xsl:otherwise>
Edouard@2901:         </xsl:choose>
Edouard@2901:       </xsl:variable>
Edouard@2901:       <xsl:variable name="target_page_path">
Edouard@2901:         <xsl:choose>
Edouard@2901:           <xsl:when test="arg">
Edouard@2901:             <xsl:value-of select="$hmi_pages_descs[arg[1]/@value = $target_page_name]/path[1]/@value"/>
Edouard@2901:           </xsl:when>
Edouard@2901:           <xsl:otherwise>
Edouard@2901:             <xsl:value-of select="$page_desc/path[1]/@value"/>
Edouard@2901:           </xsl:otherwise>
Edouard@2901:         </xsl:choose>
Edouard@2901:       </xsl:variable>
Edouard@2901:       <xsl:if test="not(func:same_class_paths($target_page_path, path[1]/@value))">
Edouard@2901:         <xsl:message terminate="yes">
Edouard@2901:           <xsl:text>Jump id="</xsl:text>
Edouard@2901:           <xsl:value-of select="@id"/>
Edouard@2901:           <xsl:text>" to page "</xsl:text>
Edouard@2901:           <xsl:value-of select="$target_page_name"/>
Edouard@2901:           <xsl:text>" with incompatible path "</xsl:text>
Edouard@2901:           <xsl:value-of select="path[1]/@value"/>
Edouard@2901:           <xsl:text> (must be same class as "</xsl:text>
Edouard@2901:           <xsl:value-of select="$target_page_path"/>
Edouard@2901:           <xsl:text>")</xsl:text>
Edouard@2901:         </xsl:message>
Edouard@2901:       </xsl:if>
Edouard@2901:     </xsl:if>
Edouard@2901:   </xsl:template>
edouard@2943:   <declarations:jump/>
edouard@2943:   <xsl:template match="declarations:jump">
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2942:     <xsl:text>var jumps_need_update = false;
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>var jump_history = [[default_page, undefined]];
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>function update_jumps() {
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>    page_desc[current_visible_page].jumps.map(w=&gt;w.notify_page_change(current_visible_page,current_page_index));
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>    jumps_need_update = false;
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>};
edouard@2942: </xsl:text>
edouard@2942:     <xsl:text>
edouard@2942: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2942:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='Keypad']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Keypad - to be written
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Keypad </xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <arg name="supported_types" accepts="string">
edouard@3241:       <xsl:text>keypad can input those types </xsl:text>
edouard@3241:     </arg>
edouard@3241:   </xsl:template>
edouard@2943:   <declarations:keypad/>
edouard@2943:   <xsl:template match="declarations:keypad">
edouard@2941:     <xsl:text>
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>/* </xsl:text>
edouard@2949:     <xsl:value-of select="local-name()"/>
edouard@2949:     <xsl:text> */
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:     <xsl:text>var keypads = {
edouard@2941: </xsl:text>
edouard@2941:     <xsl:for-each select="$keypads_descs">
edouard@2941:       <xsl:variable name="keypad_id" select="@id"/>
edouard@2941:       <xsl:for-each select="arg">
edouard@2941:         <xsl:variable name="g" select="$geometry[@Id = $keypad_id]"/>
edouard@2941:         <xsl:text>    "</xsl:text>
edouard@2941:         <xsl:value-of select="@value"/>
edouard@2941:         <xsl:text>":["</xsl:text>
edouard@2941:         <xsl:value-of select="$keypad_id"/>
edouard@2941:         <xsl:text>", </xsl:text>
edouard@2941:         <xsl:value-of select="$g/@x"/>
edouard@2941:         <xsl:text>, </xsl:text>
edouard@2941:         <xsl:value-of select="$g/@y"/>
edouard@2941:         <xsl:text>],
edouard@2941: </xsl:text>
edouard@2941:       </xsl:for-each>
edouard@2941:     </xsl:for-each>
edouard@2941:     <xsl:text>}
edouard@2941: </xsl:text>
edouard@2949:     <xsl:text>
edouard@2949: </xsl:text>
edouard@2941:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Keypad']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>KeypadWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_key_click(symbols) {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         var syms = symbols.split(" ");
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.shift |= this.caps;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.editstr += syms[this.shift?syms.length-1:0];
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.shift = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.update();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_Esc_click() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         end_modal.call(this);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_Enter_click() {
usveticic@3015: </xsl:text>
Edouard@3034:     <xsl:text>         let coercedval = (typeof this.initial) == "number" ? Number(this.editstr) : this.editstr;
Edouard@3034: </xsl:text>
Edouard@3042:     <xsl:text>         if(typeof coercedval == 'number' &amp;&amp; isNaN(coercedval)){
Edouard@3042: </xsl:text>
Edouard@3042:     <xsl:text>             // revert to initial so it explicitely shows input was ignored
Edouard@3034: </xsl:text>
Edouard@3034:     <xsl:text>             this.editstr = String(this.initial);
Edouard@3034: </xsl:text>
Edouard@3034:     <xsl:text>             this.update();
Edouard@3034: </xsl:text>
Edouard@3042:     <xsl:text>         } else { 
Edouard@3034: </xsl:text>
Edouard@3034:     <xsl:text>             let callback_obj = this.result_callback_obj;
Edouard@3034: </xsl:text>
Edouard@3034:     <xsl:text>             end_modal.call(this);
Edouard@3034: </xsl:text>
Edouard@3034:     <xsl:text>             callback_obj.edit_callback(coercedval);
Edouard@3034: </xsl:text>
Edouard@3034:     <xsl:text>         }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_BackSpace_click() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.editstr = this.editstr.slice(0,this.editstr.length-1);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.update();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_Sign_click() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         if(this.editstr[0] == "-")
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>             this.editstr = this.editstr.slice(1,this.editstr.length);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         else
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>             this.editstr = "-" + this.editstr;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.update();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_NumDot_click() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         if(this.editstr.indexOf(".") == "-1"){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>             this.editstr += ".";
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>             this.update();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_Space_click() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.editstr += " ";
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.update();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     caps = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     _caps = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_CapsLock_click() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.caps = !this.caps;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.update();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     shift = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     _shift = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     on_Shift_click() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.shift = !this.shift;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.caps = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.update();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     editstr = "";
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     _editstr = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     result_callback_obj = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     start_edit(info, valuetype, callback_obj, initial,size) {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         show_modal.call(this,size);
usveticic@3015: </xsl:text>
Edouard@3034:     <xsl:text>         this.editstr = String(initial);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.result_callback_obj = callback_obj;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.Info_elt.textContent = info;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.shift = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         this.caps = false;
usveticic@3015: </xsl:text>
Edouard@3034:     <xsl:text>         this.initial = initial;
Edouard@3034: </xsl:text>
Edouard@3034:     <xsl:text>
Edouard@3034: </xsl:text>
usveticic@3015:     <xsl:text>         this.update();
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     update() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         if(this.editstr != this._editstr){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>             this._editstr = this.editstr;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>             this.Value_elt.textContent = this.editstr;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         }
usveticic@3015: </xsl:text>
edouard@3103:     <xsl:text>         if(this.Shift_sub &amp;&amp; this.shift != this._shift){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>             this._shift = this.shift;
usveticic@3015: </xsl:text>
edouard@3128:     <xsl:text>             (this.shift?this.activate_activable:this.inactivate_activable)(this.Shift_sub);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         }
usveticic@3015: </xsl:text>
edouard@3103:     <xsl:text>         if(this.CapsLock_sub &amp;&amp; this.caps != this._caps){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>             this._caps = this.caps;
usveticic@3015: </xsl:text>
edouard@3128:     <xsl:text>             (this.caps?this.activate_activable:this.inactivate_activable)(this.CapsLock_sub);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>         }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>     }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>}
usveticic@3015: </xsl:text>
usveticic@3015:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Keypad']" mode="widget_defs">
Edouard@2917:     <xsl:param name="hmi_element"/>
Edouard@2917:     <xsl:call-template name="defs_by_labels">
Edouard@2917:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
Edouard@2917:       <xsl:with-param name="labels">
Edouard@2917:         <xsl:text>Esc Enter BackSpace Keys Info Value</xsl:text>
Edouard@2917:       </xsl:with-param>
Edouard@2917:     </xsl:call-template>
Edouard@2917:     <xsl:call-template name="defs_by_labels">
Edouard@2917:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
Edouard@2917:       <xsl:with-param name="labels">
Edouard@3118:         <xsl:text>Sign Space NumDot</xsl:text>
Edouard@2917:       </xsl:with-param>
Edouard@2917:       <xsl:with-param name="mandatory" select="'no'"/>
Edouard@2917:     </xsl:call-template>
edouard@2920:     <xsl:call-template name="defs_by_labels">
edouard@2920:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@2920:       <xsl:with-param name="labels">
edouard@2920:         <xsl:text>CapsLock Shift</xsl:text>
edouard@2920:       </xsl:with-param>
edouard@2920:       <xsl:with-param name="mandatory" select="'no'"/>
edouard@2920:       <xsl:with-param name="subelements" select="'active inactive'"/>
edouard@2920:     </xsl:call-template>
Edouard@2913:     <xsl:text>    init: function() {
Edouard@2913: </xsl:text>
Edouard@2917:     <xsl:for-each select="$hmi_element/*[@inkscape:label = 'Keys']/*">
Edouard@2917:       <xsl:text>        id("</xsl:text>
Edouard@2917:       <xsl:value-of select="@id"/>
Edouard@2917:       <xsl:text>").setAttribute("onclick", "hmi_widgets['</xsl:text>
Edouard@2917:       <xsl:value-of select="$hmi_element/@id"/>
Edouard@2917:       <xsl:text>'].on_key_click('</xsl:text>
Edouard@2917:       <xsl:value-of select="func:escape_quotes(@inkscape:label)"/>
Edouard@2917:       <xsl:text>')");
Edouard@2917: </xsl:text>
Edouard@2917:     </xsl:for-each>
edouard@2920:     <xsl:for-each select="str:split('Esc Enter BackSpace Sign Space NumDot CapsLock Shift')">
Edouard@2917:       <xsl:text>        if(this.</xsl:text>
Edouard@2917:       <xsl:value-of select="."/>
Edouard@2917:       <xsl:text>_elt)
Edouard@2917: </xsl:text>
Edouard@2917:       <xsl:text>            this.</xsl:text>
Edouard@2917:       <xsl:value-of select="."/>
Edouard@2917:       <xsl:text>_elt.setAttribute("onclick", "hmi_widgets['</xsl:text>
Edouard@2917:       <xsl:value-of select="$hmi_element/@id"/>
Edouard@2917:       <xsl:text>'].on_</xsl:text>
Edouard@2917:       <xsl:value-of select="."/>
Edouard@2917:       <xsl:text>_click()");
Edouard@2917: </xsl:text>
Edouard@2917:     </xsl:for-each>
Edouard@2917:     <xsl:text>    },
Edouard@2917: </xsl:text>
usveticic@3015:     <xsl:text>
Edouard@2917: </xsl:text>
Edouard@2917:     <xsl:variable name="g" select="$geometry[@Id = $hmi_element/@id]"/>
Edouard@2917:     <xsl:text>    coordinates: [</xsl:text>
Edouard@2917:     <xsl:value-of select="$g/@x"/>
Edouard@2917:     <xsl:text>, </xsl:text>
Edouard@2917:     <xsl:value-of select="$g/@y"/>
Edouard@2917:     <xsl:text>],
Edouard@2917: </xsl:text>
usveticic@3015:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='List']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3355:     <longdesc>
edouard@3355:       <xsl:text>List widget is a svg:group, list items are labeled elements
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>in that group.
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>To use a List, clone (svg:use) one of the items inside the widget that
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>expects a List.
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>Positions of items are relative to each other, and they must all be in the
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>same place. In order to make editing easier it is therefore recommanded to
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>make stacked clones of svg elements spread nearby the list.
edouard@3355: </xsl:text>
edouard@3355:     </longdesc>
edouard@3355:     <shortdesc>
edouard@3355:       <xsl:text>A named list of named graphical elements</xsl:text>
edouard@3355:     </shortdesc>
edouard@3355:     <arg name="listname"/>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='List']" mode="widget_defs">
edouard@2997:     <xsl:param name="hmi_element"/>
edouard@2997:     <xsl:text>    items: {
edouard@2997: </xsl:text>
edouard@2997:     <xsl:for-each select="$hmi_element/*[@inkscape:label]">
Edouard@3387:       <xsl:text>        "</xsl:text>
Edouard@3031:       <xsl:value-of select="@inkscape:label"/>
Edouard@3387:       <xsl:text>": "</xsl:text>
edouard@2997:       <xsl:value-of select="@id"/>
edouard@2997:       <xsl:text>",
edouard@2997: </xsl:text>
edouard@2997:     </xsl:for-each>
edouard@2997:     <xsl:text>    },
edouard@2997: </xsl:text>
edouard@2997:   </xsl:template>
Edouard@3387:   <xsl:template match="widget[@type='ListSwitch']" mode="widget_desc">
Edouard@3387:     <type>
Edouard@3387:       <xsl:value-of select="@type"/>
Edouard@3387:     </type>
Edouard@3387:     <longdesc>
Edouard@3387:       <xsl:text>ListSwitch widget displays one item of an HMI:List depending on value of
Edouard@3387: </xsl:text>
Edouard@3387:       <xsl:text>given variable. Main element of the widget must be a clone of the list or
Edouard@3387: </xsl:text>
Edouard@3387:       <xsl:text>of an item of that list.  
Edouard@3387: </xsl:text>
Edouard@3387:       <xsl:text>
Edouard@3387: </xsl:text>
Edouard@3387:       <xsl:text>Given variable's current value is compared to list items
Edouard@3387: </xsl:text>
Edouard@3387:       <xsl:text>label. For exemple if given variable type
Edouard@3387: </xsl:text>
Edouard@3387:       <xsl:text>is HMI_INT and value is 1, then item with label '1' will be displayed.
Edouard@3387: </xsl:text>
Edouard@3387:       <xsl:text>If matching variable of type HMI_STRING, then no quotes are needed. 
Edouard@3387: </xsl:text>
Edouard@3387:       <xsl:text>For exemple, 'hello' match HMI_STRING 'hello'.
Edouard@3387: </xsl:text>
Edouard@3387:     </longdesc>
Edouard@3387:     <shortdesc>
Edouard@3387:       <xsl:text>Displays item of an HMI:List whose label matches value.</xsl:text>
Edouard@3387:     </shortdesc>
Edouard@3387:     <path name="value" accepts="HMI_INT,HMI_STRING">
Edouard@3387:       <xsl:text>value to compare to labels</xsl:text>
Edouard@3387:     </path>
Edouard@3387:   </xsl:template>
Edouard@3387:   <xsl:template match="widget[@type='ListSwitch']" mode="widget_class">
Edouard@3387:     <xsl:text>class </xsl:text>
Edouard@3387:     <xsl:text>ListSwitchWidget</xsl:text>
Edouard@3387:     <xsl:text> extends Widget{
Edouard@3387: </xsl:text>
Edouard@3387:     <xsl:text>    frequency = 5;
Edouard@3387: </xsl:text>
Edouard@3387:     <xsl:text>}
Edouard@3387: </xsl:text>
Edouard@3387:   </xsl:template>
Edouard@3387:   <xsl:template match="widget[@type='ListSwitch']" mode="widget_defs">
Edouard@3387:     <xsl:param name="hmi_element"/>
Edouard@3387:     <xsl:variable name="targetid" select="substring-after($hmi_element/@xlink:href,'#')"/>
Edouard@3387:     <xsl:variable name="from_list" select="$hmi_lists[(@id | */@id) = $targetid]"/>
Edouard@3387:     <xsl:text>    dispatch: function(value) {
Edouard@3387: </xsl:text>
Edouard@3387:     <xsl:text>        this.element.href.baseVal = "#"+hmi_widgets["</xsl:text>
Edouard@3387:     <xsl:value-of select="$from_list/@id"/>
Edouard@3387:     <xsl:text>"].items[value];
Edouard@3387: </xsl:text>
Edouard@3387:     <xsl:text>    },
Edouard@3387: </xsl:text>
Edouard@3387:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='Meter']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Meter widget moves the end of "needle" labeled path along "range" labeled
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>path, according to value of the single accepted variable.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Needle is reduced to a single segment. If "min" a "max" labeled texts
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>are provided, or if first and second argument are given, then they are used
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>as respective minimum and maximum value. Otherwise, value is expected to be
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>in between 0 and 100.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Moves "needle" along "range"</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <arg name="min" count="optional" accepts="int,real">
edouard@3241:       <xsl:text>minimum value</xsl:text>
edouard@3241:     </arg>
edouard@3241:     <arg name="max" count="optional" accepts="int,real">
edouard@3241:       <xsl:text>maximum value</xsl:text>
edouard@3241:     </arg>
edouard@3241:     <path name="value" accepts="HMI_INT,HMI_REAL">
edouard@3241:       <xsl:text>Value to display</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
Edouard@3276:   <xsl:template match="widget[@type='Meter']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
Edouard@3276:     <xsl:text>MeterWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    frequency = 10;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    origin = undefined;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    range = undefined;
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    dispatch(value) {
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>        this.display_val = value;
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>        this.request_animate();
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>    }
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>    animate(){
Edouard@3112: </xsl:text>
usveticic@3045:     <xsl:text>        if(this.value_elt)
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>            this.value_elt.textContent = String(this.display_val);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let [min,max,totallength] = this.range;
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>        let length = Math.max(0,Math.min(totallength,(Number(this.display_val)-min)*totallength/(max-min)));
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        let tip = this.range_elt.getPointAtLength(length);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.needle_elt.setAttribute('d', "M "+this.origin.x+","+this.origin.y+" "+tip.x+","+tip.y);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    init() {
usveticic@3045: </xsl:text>
Edouard@3112:     <xsl:text>        let [min,max] = [[this.min_elt,0],[this.max_elt,100]].map(([elt,def],i)=&gt;elt?
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            Number(elt.textContent) :
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>            this.args.length &gt;= i+1 ? this.args[i] : def);
Edouard@3112: </xsl:text>
Edouard@3112:     <xsl:text>
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.range = [min, max, this.range_elt.getTotalLength()]
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>        this.origin = this.needle_elt.getPointAtLength(0);
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>    }
usveticic@3045: </xsl:text>
usveticic@3045:     <xsl:text>}
usveticic@3045: </xsl:text>
usveticic@3045:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Meter']" mode="widget_defs">
edouard@2883:     <xsl:param name="hmi_element"/>
edouard@2883:     <xsl:call-template name="defs_by_labels">
edouard@2883:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@2883:       <xsl:with-param name="labels">
edouard@2883:         <xsl:text>needle range</xsl:text>
edouard@2883:       </xsl:with-param>
edouard@2883:     </xsl:call-template>
edouard@2883:     <xsl:call-template name="defs_by_labels">
edouard@2883:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@2883:       <xsl:with-param name="labels">
edouard@3362:         <xsl:text>min max</xsl:text>
edouard@2883:       </xsl:with-param>
edouard@2883:       <xsl:with-param name="mandatory" select="'no'"/>
edouard@2883:     </xsl:call-template>
Edouard@2797:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='MultiState']" mode="widget_defs">
edouard@3241:     <xsl:param name="hmi_element"/>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Mutlistateh widget hides all subelements whose label do not match given
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>variable value representation. For exemple if given variable type
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>is HMI_INT and value is 1, then elements with label '1' will be displayed.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Label can have comments, so '1#some comment' would also match. If matching
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>variable of type HMI_STRING, then double quotes must be used. For exemple,
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>'"hello"' or '"hello"#another comment' match HMI_STRING 'hello'.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Click on widget changes variable value to next value in given list, or to
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>first one if not initialized to value already part of the list.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Show elements whose label match value.</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <path name="value" accepts="HMI_INT,HMI_STRING">
edouard@3241:       <xsl:text>value to compare to labels</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='MultiState']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>MultiStateWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@2962: </xsl:text>
edouard@2962:     <xsl:text>    frequency = 5;
edouard@2962: </xsl:text>
usveticic@3015:     <xsl:text>    state = 0;
usveticic@3015: </xsl:text>
edouard@2962:     <xsl:text>    dispatch(value) {
edouard@2962: </xsl:text>
usveticic@3015:     <xsl:text>        this.state = value;
usveticic@3015: </xsl:text>
edouard@2962:     <xsl:text>        for(let choice of this.choices){
edouard@2962: </xsl:text>
usveticic@3015:     <xsl:text>            if(this.state != choice.value){
edouard@2962: </xsl:text>
edouard@2962:     <xsl:text>                choice.elt.setAttribute("style", "display:none");
edouard@2962: </xsl:text>
edouard@2962:     <xsl:text>            } else {
edouard@2962: </xsl:text>
edouard@2962:     <xsl:text>                choice.elt.setAttribute("style", choice.style);
edouard@2962: </xsl:text>
edouard@2962:     <xsl:text>            }
edouard@2962: </xsl:text>
edouard@2962:     <xsl:text>        }
edouard@2962: </xsl:text>
edouard@2962:     <xsl:text>    }
edouard@2962: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    on_click(evt) {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        //get current selected value
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        let next_ind;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        for(next_ind=0; next_ind&lt;this.choices.length; next_ind++){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            if(this.state == this.choices[next_ind].value){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>               next_ind = next_ind + 1;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>               break;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        //get next selected value
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        if(this.choices.length &gt; next_ind){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            this.state = this.choices[next_ind].value;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        else{
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            this.state = this.choices[0].value;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        //post value to plc
usveticic@3015: </xsl:text>
Edouard@3019:     <xsl:text>        this.apply_hmi_value(0, this.state);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    init() {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)");
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
edouard@2962:     <xsl:text>}
edouard@2962: </xsl:text>
edouard@2962:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='MultiState']" mode="widget_defs">
Edouard@2839:     <xsl:param name="hmi_element"/>
edouard@2851:     <xsl:text>    choices: [
Edouard@2839: </xsl:text>
Edouard@2907:     <xsl:variable name="regex" select="'^(&quot;[^&quot;].*&quot;|\-?[0-9]+|false|true)(#.*)?$'"/>
Edouard@2969:     <xsl:for-each select="$result_svg_ns//*[@id = $hmi_element/@id]//*[regexp:test(@inkscape:label,$regex)]">
Edouard@2839:       <xsl:variable name="literal" select="regexp:match(@inkscape:label,$regex)[2]"/>
edouard@2851:       <xsl:text>        {
edouard@2851: </xsl:text>
edouard@2851:       <xsl:text>            elt:id("</xsl:text>
Edouard@2839:       <xsl:value-of select="@id"/>
Edouard@2839:       <xsl:text>"),
Edouard@2839: </xsl:text>
edouard@2851:       <xsl:text>            style:"</xsl:text>
Edouard@2839:       <xsl:value-of select="@style"/>
Edouard@2839:       <xsl:text>",
Edouard@2839: </xsl:text>
edouard@2851:       <xsl:text>            value:</xsl:text>
Edouard@2839:       <xsl:value-of select="$literal"/>
Edouard@2839:       <xsl:text>
Edouard@2839: </xsl:text>
edouard@2851:       <xsl:text>        }</xsl:text>
Edouard@2839:       <xsl:if test="position()!=last()">
Edouard@2839:         <xsl:text>,</xsl:text>
Edouard@2839:       </xsl:if>
Edouard@2839:       <xsl:text>
Edouard@2839: </xsl:text>
Edouard@2839:     </xsl:for-each>
edouard@2851:     <xsl:text>    ],
Edouard@2801: </xsl:text>
Edouard@2801:   </xsl:template>
edouard@3358:   <xsl:template match="widget[@type='PathSlider']" mode="widget_desc">
edouard@3358:     <type>
edouard@3358:       <xsl:value-of select="@type"/>
edouard@3358:     </type>
edouard@3358:     <longdesc>
edouard@3358:       <xsl:text>PathSlider - 
edouard@3358: </xsl:text>
edouard@3358:     </longdesc>
edouard@3358:     <shortdesc>
edouard@3358:       <xsl:text>Slide an SVG element along a path by dragging it</xsl:text>
edouard@3358:     </shortdesc>
edouard@3358:     <path name="value" accepts="HMI_INT,HMI_REAL">
edouard@3358:       <xsl:text>value</xsl:text>
edouard@3358:     </path>
edouard@3358:     <path name="min" count="optional" accepts="HMI_INT,HMI_REAL">
edouard@3358:       <xsl:text>min</xsl:text>
edouard@3358:     </path>
edouard@3358:     <path name="max" count="optional" accepts="HMI_INT,HMI_REAL">
edouard@3358:       <xsl:text>max</xsl:text>
edouard@3358:     </path>
edouard@3358:     <arg name="min" count="optional" accepts="int,real">
edouard@3358:       <xsl:text>minimum value</xsl:text>
edouard@3358:     </arg>
edouard@3358:     <arg name="max" count="optional" accepts="int,real">
edouard@3358:       <xsl:text>maximum value</xsl:text>
edouard@3358:     </arg>
edouard@3358:   </xsl:template>
edouard@3358:   <xsl:template match="widget[@type='PathSlider']" mode="widget_class">
edouard@3358:     <xsl:text>class </xsl:text>
edouard@3358:     <xsl:text>PathSliderWidget</xsl:text>
edouard@3358:     <xsl:text> extends Widget{
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    frequency = 10;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    position = undefined;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    min = 0;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    max = 100;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    scannedPoints = [];
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    pathLength = undefined;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    precision = undefined;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    origPt = undefined;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    scanPath() {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      this.pathLength = this.path_elt.getTotalLength();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      this.precision = Math.floor(this.pathLength / 10);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      // save linear scan for coarse approximation
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      for (var scanLength = 0; scanLength &lt;= this.pathLength; scanLength += this.precision) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.scannedPoints.push([this.path_elt.getPointAtLength(scanLength), scanLength]);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      [this.origPt,] = this.scannedPoints[0];
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    closestPoint(point) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      var bestPoint,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestLength,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestDistance = Infinity,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          scanDistance;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      // use linear scan for coarse approximation
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      for (let [scanPoint, scanLength] of this.scannedPoints){
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        if ((scanDistance = distance2(scanPoint)) &lt; bestDistance) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestPoint = scanPoint,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestLength = scanLength,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestDistance = scanDistance;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      // binary search for more precise estimate
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      let precision = this.precision / 2;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      while (precision &gt; 0.5) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        var beforePoint,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            afterPoint,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            beforeLength,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            afterLength,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            beforeDistance,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            afterDistance;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        if ((beforeLength = bestLength - precision) &gt;= 0 &amp;&amp;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            (beforeDistance = distance2(beforePoint = this.path_elt.getPointAtLength(beforeLength))) &lt; bestDistance) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestPoint = beforePoint,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestLength = beforeLength,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestDistance = beforeDistance;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        } else if ((afterLength = bestLength + precision) &lt;= this.pathLength &amp;&amp; 
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>                   (afterDistance = distance2(afterPoint = this.path_elt.getPointAtLength(afterLength))) &lt; bestDistance) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestPoint = afterPoint,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestLength = afterLength,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>          bestDistance = afterDistance;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        precision /= 2;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      return [bestPoint, bestLength];
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      function distance2(p) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        var dx = p.x - point.x,
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            dy = p.y - point.y;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        return dx * dx + dy * dy;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>      }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    dispatch(value,oldval, index) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        switch(index) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            case 0:
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>                this.position = value;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>                break;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            case 1:
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>                this.min = value;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>                break;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            case 2:
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>                this.max = value;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>                break;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.request_animate();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    get_current_point(){
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let currLength = this.pathLength * (this.position - this.min) / (this.max - this.min)
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        return this.path_elt.getPointAtLength(currLength);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    animate(){
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        if(this.position == undefined)
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            return;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let currPt = this.get_current_point();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.cursor_transform.setTranslate(currPt.x - this.origPt.x, currPt.y - this.origPt.y);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    init() {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        if(this.args.length == 2)
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>            [this.min, this.max]=this.args;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.scanPath();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.cursor_transform = svg_root.createSVGTransform();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.cursor_elt.transform.baseVal.appendItem(this.cursor_transform);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.cursor_elt.onpointerdown = (e) =&gt; this.on_cursor_down(e);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.bound_drag = this.drag.bind(this);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.bound_drop = this.drop.bind(this);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    start_dragging_from_event(e){
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let clientPoint = new DOMPoint(e.clientX, e.clientY);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let point = clientPoint.matrixTransform(this.invctm);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let currPt = this.get_current_point();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.draggingOffset = new DOMPoint(point.x - currPt.x , point.y - currPt.y);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    apply_position_from_event(e){
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let clientPoint = new DOMPoint(e.clientX, e.clientY);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let rawPoint = clientPoint.matrixTransform(this.invctm);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let point = new DOMPoint(rawPoint.x - this.draggingOffset.x , rawPoint.y - this.draggingOffset.y);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let [closestPoint, closestLength] = this.closestPoint(point);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let new_position = this.min + (this.max - this.min) * closestLength / this.pathLength;
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.position = Math.round(Math.max(Math.min(new_position, this.max), this.min));
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.apply_hmi_value(0, this.position);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    on_cursor_down(e){
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        // get scrollbar -&gt; root transform
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let ctm = this.path_elt.getCTM();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        // root -&gt; path transform
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.invctm = ctm.inverse();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.start_dragging_from_event(e);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        svg_root.addEventListener("pointerup", this.bound_drop, true);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        svg_root.addEventListener("pointermove", this.bound_drag, true);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    drop(e) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        svg_root.removeEventListener("pointerup", this.bound_drop, true);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        svg_root.removeEventListener("pointermove", this.bound_drag, true);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    drag(e) {
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        this.apply_position_from_event(e);
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>    }
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>}
edouard@3358: </xsl:text>
edouard@3358:   </xsl:template>
edouard@3358:   <xsl:template match="widget[@type='PathSlider']" mode="widget_defs">
edouard@3358:     <xsl:param name="hmi_element"/>
edouard@3358:     <xsl:call-template name="defs_by_labels">
edouard@3358:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@3358:       <xsl:with-param name="labels">
edouard@3358:         <xsl:text>cursor path</xsl:text>
edouard@3358:       </xsl:with-param>
edouard@3358:     </xsl:call-template>
edouard@3358:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='ScrollBar']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3358:       <xsl:text>ScrollBar - svg:rect based scrollbar
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>ScrollBar</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <path name="value" accepts="HMI_INT">
edouard@3241:       <xsl:text>value</xsl:text>
edouard@3241:     </path>
edouard@3241:     <path name="range" accepts="HMI_INT">
edouard@3241:       <xsl:text>range</xsl:text>
edouard@3241:     </path>
edouard@3241:     <path name="visible" accepts="HMI_INT">
edouard@3241:       <xsl:text>visible</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='ScrollBar']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>ScrollBarWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    frequency = 10;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    position = undefined;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    range = undefined;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    size = undefined;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    mincursize = 0.1;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    dispatch(value,oldval, index) {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        switch(index) {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            case 0:
edouard@3141: </xsl:text>
Edouard@3178:     <xsl:text>                this.range = Math.max(1,value);
Edouard@3178: </xsl:text>
Edouard@3178:     <xsl:text>                break;
Edouard@3178: </xsl:text>
Edouard@3178:     <xsl:text>            case 1:
Edouard@3178: </xsl:text>
Edouard@3147:     <xsl:text>                this.position = value;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                break;
edouard@3141: </xsl:text>
Edouard@3178:     <xsl:text>            case 2:
Edouard@3178: </xsl:text>
Edouard@3178:     <xsl:text>                this.size = value;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                break;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.request_animate();
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    get_ratios() {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        let range = this.range;
edouard@3141: </xsl:text>
edouard@3358:     <xsl:text>        let size = Math.max(range * this.mincursize, Math.min(this.size, range));
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        let maxh = this.range_elt.height.baseVal.value;
edouard@3141: </xsl:text>
Edouard@3151:     <xsl:text>        let pixels = maxh;
Edouard@3151: </xsl:text>
edouard@3358:     <xsl:text>        return [size, maxh, range, pixels];
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    animate(){
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        if(this.position == undefined || this.range == undefined || this.size == undefined)
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>            return;
edouard@3141: </xsl:text>
edouard@3358:     <xsl:text>        let [size, maxh, range, pixels] = this.get_ratios();
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>
edouard@3358: </xsl:text>
edouard@3358:     <xsl:text>        let new_y = this.range_elt.y.baseVal.value + Math.round(Math.min(this.position,range-size) * pixels / range);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        let new_height = Math.round(maxh * size/range);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.cursor_elt.y.baseVal.value = new_y;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.cursor_elt.height.baseVal.value = new_height;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    init_mandatory() {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.cursor_elt.onpointerdown = () =&gt; this.on_cursor_down();
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.bound_drag = this.drag.bind(this);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.bound_drop = this.drop.bind(this);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    apply_position(position){
edouard@3141: </xsl:text>
Edouard@3151:     <xsl:text>        this.position = Math.round(Math.max(Math.min(position, this.range - this.size), 0));
Edouard@3147: </xsl:text>
Edouard@3178:     <xsl:text>        this.apply_hmi_value(1, this.position);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    on_page_click(is_up){
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.apply_position(is_up ? this.position-this.size
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>                                  : this.position+this.size);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    on_cursor_down(e){
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        // get scrollbar -&gt; root transform
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        let ctm = this.range_elt.getCTM();
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        // relative motion -&gt; discard translation
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        ctm.e = 0;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        ctm.f = 0;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        // root -&gt; scrollbar transform
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.invctm = ctm.inverse();
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        svg_root.addEventListener("pointerup", this.bound_drop, true);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        svg_root.addEventListener("pointermove", this.bound_drag, true);
edouard@3141: </xsl:text>
Edouard@3147:     <xsl:text>        this.dragpos = this.position;
Edouard@3147: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    drop(e) {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        svg_root.removeEventListener("pointerup", this.bound_drop, true);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        svg_root.removeEventListener("pointermove", this.bound_drag, true);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    drag(e) {
edouard@3141: </xsl:text>
edouard@3358:     <xsl:text>        let [size, maxh, range, pixels] = this.get_ratios();
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        if(pixels == 0) return;
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        let point = new DOMPoint(e.movementX, e.movementY);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        let movement = point.matrixTransform(this.invctm).y;
edouard@3141: </xsl:text>
edouard@3358:     <xsl:text>        this.dragpos += movement * range / pixels;
Edouard@3147: </xsl:text>
Edouard@3147:     <xsl:text>        this.apply_position(this.dragpos);
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>    }
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>}
edouard@3141: </xsl:text>
edouard@3141:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='ScrollBar']" mode="widget_defs">
edouard@3141:     <xsl:param name="hmi_element"/>
edouard@3141:     <xsl:call-template name="defs_by_labels">
edouard@3141:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@3141:       <xsl:with-param name="labels">
edouard@3141:         <xsl:text>cursor range</xsl:text>
edouard@3141:       </xsl:with-param>
edouard@3141:     </xsl:call-template>
edouard@3141:     <xsl:variable name="pagebuttons">
edouard@3141:       <xsl:call-template name="defs_by_labels">
edouard@3141:         <xsl:with-param name="hmi_element" select="$hmi_element"/>
edouard@3141:         <xsl:with-param name="labels">
edouard@3141:           <xsl:text>pageup pagedown</xsl:text>
edouard@3141:         </xsl:with-param>
edouard@3141:         <xsl:with-param name="mandatory" select="'no'"/>
edouard@3141:       </xsl:call-template>
edouard@3141:     </xsl:variable>
edouard@3141:     <xsl:variable name="have_pagebuttons" select="string-length($pagebuttons)&gt;0"/>
edouard@3141:     <xsl:value-of select="$pagebuttons"/>
edouard@3141:     <xsl:text>    init: function() {
edouard@3141: </xsl:text>
edouard@3141:     <xsl:text>        this.init_mandatory();
edouard@3141: </xsl:text>
edouard@3141:     <xsl:if test="$have_pagebuttons">
edouard@3141:       <xsl:text>        this.pageup_elt.onclick = () =&gt; this.on_page_click(true);
edouard@3141: </xsl:text>
edouard@3141:       <xsl:text>        this.pagedown_elt.onclick = () =&gt; this.on_page_click(false);
edouard@3141: </xsl:text>
edouard@3141:     </xsl:if>
edouard@3141:     <xsl:text>    },
edouard@3141: </xsl:text>
edouard@3141:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='Slider']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Slider - DEPRECATED - use ScrollBar or PathSlider instead
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Slider - DEPRECATED - use ScrollBar instead</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <path name="value" accepts="HMI_INT">
edouard@3241:       <xsl:text>value</xsl:text>
edouard@3241:     </path>
edouard@3241:     <path name="range" accepts="HMI_INT">
edouard@3241:       <xsl:text>range</xsl:text>
edouard@3241:     </path>
edouard@3241:     <path name="visible" accepts="HMI_INT">
edouard@3241:       <xsl:text>visible</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Slider']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>SliderWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
edouard@3238: </xsl:text>
usveticic@3015:     <xsl:text>    frequency = 5;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    range = undefined;
usveticic@3015: </xsl:text>
Edouard@3058:     <xsl:text>    handle_orig = undefined;
Edouard@3058: </xsl:text>
Edouard@3065:     <xsl:text>    scroll_size = undefined;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    scroll_range = 0;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    scroll_visible = 7;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>    min_size = 0.07;
Edouard@3058: </xsl:text>
usveticic@3015:     <xsl:text>    fi = undefined;
usveticic@3015: </xsl:text>
Edouard@3058:     <xsl:text>    curr_value = 0;
usveticic@3045: </xsl:text>
usveticic@3015:     <xsl:text>    drag = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    enTimer = false;
usveticic@3015: </xsl:text>
Edouard@3058:     <xsl:text>    handle_click = undefined;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>    last_drag = false;
Edouard@3058: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>    dispatch(value,oldval, index) {
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        if (index == 0){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            let [min,max,start,totallength] = this.range;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            //save current value inside widget
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.curr_value = value;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            //check if in range
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            if (this.curr_value &gt; max){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                this.curr_value = max;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                this.apply_hmi_value(0, this.curr_value);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            else if (this.curr_value &lt; min){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                this.curr_value = min;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                this.apply_hmi_value(0, this.curr_value);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            if(this.value_elt)
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>                this.value_elt.textContent = String(value);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        else if(index == 1){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.scroll_range = value;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.set_scroll();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        else if(index == 2){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.scroll_visible = value;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.set_scroll();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>
Edouard@3019: </xsl:text>
Edouard@3058:     <xsl:text>        //don't update if draging and setpoint ghost doesn't exist
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        if(!this.drag || (this.setpoint_elt != undefined)){
Edouard@3058: </xsl:text>
Edouard@3065:     <xsl:text>            this.update_DOM(this.curr_value, this.handle_elt);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        }
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>    }
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3065:     <xsl:text>    set_scroll(){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //check if range is bigger than visible and set scroll size
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        if(this.scroll_range &gt; this.scroll_visible){
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.scroll_size = this.scroll_range - this.scroll_visible;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.range[0] = 0;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.range[1] = this.scroll_size;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        else{
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.scroll_size = 1;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.range[0] = 0;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>            this.range[1] = 1;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3021:     <xsl:text>    update_DOM(value, elt){
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        let [min,max,start,totallength] = this.range;
Edouard@3019: </xsl:text>
Edouard@3058:     <xsl:text>        // check if handle is resizeable
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        if (this.scroll_size != undefined){ //size changes
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            //get parameters
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let length = Math.max(min,Math.min(max,(Number(value)-min)*max/(max-min)));
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let tip = this.range_elt.getPointAtLength(length);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let handle_min = totallength*this.min_size;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let step = 1;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            //check if range is bigger than  max displayed and recalculate step
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            if ((totallength/handle_min) &lt; (max-min+1)){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                step = (max-min+1)/(totallength/handle_min-1);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let kx,ky,offseY,offseX = undefined;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            //scale on x or y axes
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            if (this.fi &gt; 0.75){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                //get scale factor
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                if(step &gt; 1){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                    ky = handle_min/this.handle_orig.height;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                else{
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                    ky = (totallength-handle_min*(max-min))/this.handle_orig.height;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                kx = 1;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                //get 0 offset to stay inside range
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                offseY = start.y - (this.handle_orig.height + this.handle_orig.y) * ky;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                offseX = 0;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                //get distance from value
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                tip.y =this.range_elt.getPointAtLength(0).y - length/step *handle_min;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            else{
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                //get scale factor
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                if(step &gt; 1){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                    kx = handle_min/this.handle_orig.width;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                else{
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                    kx = (totallength-handle_min*(max-min))/this.handle_orig.width;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                ky = 1;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                //get 0 offset to stay inside range
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                offseX = start.x - (this.handle_orig.x * kx);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                offseY = 0;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                //get distance from value
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                tip.x =this.range_elt.getPointAtLength(0).x + length/step *handle_min;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            elt.setAttribute('transform',"matrix("+(kx)+" 0 0 "+(ky)+" "+(tip.x-start.x+offseX)+" "+(tip.y-start.y+offseY)+")");
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        else{ //size stays the same
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let length = Math.max(0,Math.min(totallength,(Number(value)-min)*totallength/(max-min)));
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let tip = this.range_elt.getPointAtLength(length);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            elt.setAttribute('transform',"translate("+(tip.x-start.x)+","+(tip.y-start.y)+")");
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        // show or hide ghost if exists
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        if(this.setpoint_elt != undefined){
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            if(this.last_drag!= this.drag){
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>                if(this.drag){
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>                    this.setpoint_elt.setAttribute("style", this.setpoint_style);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>                }else{
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>                    this.setpoint_elt.setAttribute("style", "display:none");
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>                }
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>                this.last_drag = this.drag;
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            }
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        }
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>    }
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>    on_release(evt) {
Edouard@3019: </xsl:text>
Edouard@3058:     <xsl:text>        //unbind events
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>        window.removeEventListener("touchmove", this.on_bound_drag, true);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        window.removeEventListener("mousemove", this.on_bound_drag, true);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3065:     <xsl:text>        window.removeEventListener("mouseup", this.bound_on_release, true);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        window.removeEventListener("touchend", this.bound_on_release, true);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        window.removeEventListener("touchcancel", this.bound_on_release, true);
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        //reset drag flag
Edouard@3058: </xsl:text>
Edouard@3019:     <xsl:text>        if(this.drag){
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>            this.drag = false;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        // get final position
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>        this.update_position(evt);
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>    }
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>    on_drag(evt){
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>        //ignore drag event for X amount of time and if not selected
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>        if(this.enTimer &amp;&amp; this.drag){
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            this.update_position(evt);
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>            //reset timer
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            this.enTimer = false;
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            setTimeout("{hmi_widgets['"+this.element_id+"'].enTimer = true;}", 100);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        }
Edouard@3021: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
Edouard@3019:     <xsl:text>    update_position(evt){
Edouard@3019: </xsl:text>
Edouard@3021:     <xsl:text>        var html_dist = 0;
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>        let [min,max,start,totallength] = this.range;
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        //calculate size of widget in html
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        var range_borders = this.range_elt.getBoundingClientRect();
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>        var [minX,minY,maxX,maxY] = [range_borders.left,range_borders.bottom,range_borders.right,range_borders.top];
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>        var range_length = Math.sqrt( range_borders.height*range_borders.height + range_borders.width*range_borders.width );
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        //get range and mouse coordinates
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        var mouseX = undefined;
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        var mouseY = undefined;
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        if (evt.type.startsWith("touch")){
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            mouseX = Math.ceil(evt.touches[0].clientX);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            mouseY = Math.ceil(evt.touches[0].clientY);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        }
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        else{
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            mouseX = evt.pageX;
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            mouseY = evt.pageY;
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        }
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>        // calculate position
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        if (this.handle_click){ //if clicked on handle
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let moveDist = 0, resizeAdd = 0;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let range_percent = 1;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            //set paramters for resizeable handle
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            if (this.scroll_size != undefined){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                // add one more object to stay inside range
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                resizeAdd = 1;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                //chack if range is bigger than display option and
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                // calculate percent of range with out handle
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                if(((max/(max*this.min_size)) &lt; (max-min+1))){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                    range_percent = 1-this.min_size;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                else{
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                    range_percent = 1-(max-max*this.min_size*(max-min))/max;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            //calculate value difference on x or y axis
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            if(this.fi &gt; 0.7){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                moveDist = ((max-min+resizeAdd)/(range_length*range_percent))*((this.handle_click[1]-mouseY)/Math.sin(this.fi));
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            else{
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                moveDist = ((max-min+resizeAdd)/(range_length*range_percent))*((mouseX-this.handle_click[0])/Math.cos(this.fi));
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            this.curr_value = Math.ceil(this.handle_click[2] + moveDist);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        }
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>        else{ //if clicked on widget
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            //get handle distance from mouse position
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            if (minX &gt; mouseX &amp;&amp; minY &lt; mouseY){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                html_dist = 0;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            else if (maxX &lt; mouseX &amp;&amp; maxY &gt; mouseY){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                html_dist = range_length;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            else{
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                if(this.fi &gt; 0.7){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                    html_dist = (minY - mouseY)/Math.sin(this.fi);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                else{
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                    html_dist = (mouseX - minX)/Math.cos(this.fi);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            //calculate distance
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            this.curr_value=Math.ceil((html_dist/range_length)*(this.range[1]-this.range[0])+this.range[0]);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        }
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3065:     <xsl:text>        //check if in range and apply
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        if (this.curr_value &gt; max){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            this.curr_value = max;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        else if (this.curr_value &lt; min){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            this.curr_value = min;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        this.apply_hmi_value(0, this.curr_value);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        //redraw handle
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        this.request_animate();
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>    }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>    animate(){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        // redraw handle on screen refresh
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        // check if setpoint(ghost) handle exsist otherwise update main handle
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        if(this.setpoint_elt != undefined){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            this.update_DOM(this.curr_value, this.setpoint_elt);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        }
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>        else{
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>            this.update_DOM(this.curr_value, this.handle_elt);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>    }
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>    on_select(evt){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        //enable drag flag and timer
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        this.drag = true;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        this.enTimer = true;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        //bind events
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        window.addEventListener("touchmove", this.on_bound_drag, true);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        window.addEventListener("mousemove", this.on_bound_drag, true);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3065:     <xsl:text>        window.addEventListener("mouseup", this.bound_on_release, true);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        window.addEventListener("touchend", this.bound_on_release, true);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        window.addEventListener("touchcancel", this.bound_on_release, true);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        // check if handle was pressed
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        if (evt.currentTarget == this.handle_elt){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            //get mouse position on the handle
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let mouseX = undefined;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            let mouseY = undefined;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            if (evt.type.startsWith("touch")){
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                mouseX = Math.ceil(evt.touches[0].clientX);
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                mouseY = Math.ceil(evt.touches[0].clientY);
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>            }
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>            else{
Edouard@3019: </xsl:text>
Edouard@3058:     <xsl:text>                mouseX = evt.pageX;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>                mouseY = evt.pageY;
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>            }
Edouard@3019: </xsl:text>
Edouard@3058:     <xsl:text>            //save coordinates and orig value
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            this.handle_click = [mouseX,mouseY,this.curr_value];
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        }
usveticic@3015: </xsl:text>
Edouard@3058:     <xsl:text>        else{
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            // get new handle position and reset if handle was not pressed
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            this.handle_click = undefined;
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>            this.update_position(evt);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        }
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        //prevent next events
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        evt.stopPropagation();
Edouard@3058: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3019:     <xsl:text>    init() {
Edouard@3019: </xsl:text>
Edouard@3058:     <xsl:text>        //set min max value if not defined
Edouard@3058: </xsl:text>
Edouard@3019:     <xsl:text>        let min = this.min_elt ?
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>                    Number(this.min_elt.textContent) :
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>                    this.args.length &gt;= 1 ? this.args[0] : 0;
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        let max = this.max_elt ?
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>                    Number(this.max_elt.textContent) :
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>                    this.args.length &gt;= 2 ? this.args[1] : 100;
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>
Edouard@3019: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3058:     <xsl:text>        // save initial parameters
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        this.range_elt.style.strokeMiterlimit="0";
Edouard@3058: </xsl:text>
Edouard@3019:     <xsl:text>        this.range = [min, max, this.range_elt.getPointAtLength(0),this.range_elt.getTotalLength()];
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        let start = this.range_elt.getPointAtLength(0);
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        let end = this.range_elt.getPointAtLength(this.range_elt.getTotalLength());
Edouard@3019: </xsl:text>
Edouard@3019:     <xsl:text>        this.fi = Math.atan2(start.y-end.y, end.x-start.x);
Edouard@3019: </xsl:text>
Edouard@3058:     <xsl:text>        this.handle_orig = this.handle_elt.getBBox();
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>
Edouard@3058: </xsl:text>
Edouard@3058:     <xsl:text>        //bind functions
Edouard@3019: </xsl:text>
Edouard@3021:     <xsl:text>        this.bound_on_select = this.on_select.bind(this);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        this.bound_on_release = this.on_release.bind(this);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        this.on_bound_drag = this.on_drag.bind(this);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>
Edouard@3021: </xsl:text>
Edouard@3058:     <xsl:text>        this.handle_elt.addEventListener("mousedown", this.bound_on_select);
Edouard@3058: </xsl:text>
Edouard@3021:     <xsl:text>        this.element.addEventListener("mousedown", this.bound_on_select);
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        this.element.addEventListener("touchstart", this.bound_on_select);
Edouard@3021: </xsl:text>
Edouard@3065:     <xsl:text>        //touch recognised as page drag without next command
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        document.body.addEventListener("touchstart", function(e){}, false);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //save ghost style
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        if(this.setpoint_elt != undefined){
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            this.setpoint_style = this.setpoint_elt.getAttribute("style");
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>            this.setpoint_elt.setAttribute("style", "display:none");
Edouard@3021: </xsl:text>
Edouard@3021:     <xsl:text>        }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>}
usveticic@3015: </xsl:text>
edouard@3238:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Slider']" mode="widget_defs">
usveticic@3015:     <xsl:param name="hmi_element"/>
usveticic@3015:     <xsl:call-template name="defs_by_labels">
usveticic@3015:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
usveticic@3015:       <xsl:with-param name="labels">
usveticic@3015:         <xsl:text>handle range</xsl:text>
usveticic@3015:       </xsl:with-param>
usveticic@3015:     </xsl:call-template>
usveticic@3015:     <xsl:call-template name="defs_by_labels">
usveticic@3015:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
usveticic@3015:       <xsl:with-param name="labels">
Edouard@3021:         <xsl:text>value min max setpoint</xsl:text>
usveticic@3015:       </xsl:with-param>
usveticic@3015:       <xsl:with-param name="mandatory" select="'no'"/>
usveticic@3015:     </xsl:call-template>
edouard@3238:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='Switch']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Switch widget hides all subelements whose label do not match given
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>variable current value representation. For exemple if given variable type
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>is HMI_INT and value is 1, then elements with label '1' will be displayed.
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>Label can have comments, so '1#some comment' would also match. If matching
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>variable of type HMI_STRING, then double quotes must be used. For exemple,
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>'"hello"' or '"hello"#another comment' match HMI_STRING 'hello'.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
Edouard@3387:       <xsl:text>Show elements whose label matches value.</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <path name="value" accepts="HMI_INT,HMI_STRING">
edouard@3241:       <xsl:text>value to compare to labels</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Switch']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>SwitchWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    frequency = 5;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    dispatch(value) {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        for(let choice of this.choices){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            if(value != choice.value){
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                choice.elt.setAttribute("style", "display:none");
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            } else {
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>                choice.elt.setAttribute("style", choice.style);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>            }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>        }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>}
usveticic@3015: </xsl:text>
usveticic@3015:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='Switch']" mode="widget_defs">
usveticic@3015:     <xsl:param name="hmi_element"/>
usveticic@3015:     <xsl:text>    choices: [
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:variable name="regex" select="'^(&quot;[^&quot;].*&quot;|\-?[0-9]+|false|true)(#.*)?$'"/>
Edouard@3220:     <xsl:variable name="subelts" select="$result_widgets[@id = $hmi_element/@id]//*"/>
Edouard@3220:     <xsl:variable name="subwidgets" select="$subelts//*[@id = $hmi_widgets/@id]"/>
Edouard@3220:     <xsl:variable name="accepted" select="$subelts[not(ancestor-or-self::*/@id = $subwidgets/@id)]"/>
Edouard@3220:     <xsl:for-each select="$accepted[regexp:test(@inkscape:label,$regex)]">
usveticic@3015:       <xsl:variable name="literal" select="regexp:match(@inkscape:label,$regex)[2]"/>
usveticic@3015:       <xsl:text>        {
usveticic@3015: </xsl:text>
usveticic@3015:       <xsl:text>            elt:id("</xsl:text>
usveticic@3015:       <xsl:value-of select="@id"/>
usveticic@3015:       <xsl:text>"),
usveticic@3015: </xsl:text>
usveticic@3015:       <xsl:text>            style:"</xsl:text>
usveticic@3015:       <xsl:value-of select="@style"/>
usveticic@3015:       <xsl:text>",
usveticic@3015: </xsl:text>
usveticic@3015:       <xsl:text>            value:</xsl:text>
usveticic@3015:       <xsl:value-of select="$literal"/>
usveticic@3015:       <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:       <xsl:text>        }</xsl:text>
usveticic@3015:       <xsl:if test="position()!=last()">
usveticic@3015:         <xsl:text>,</xsl:text>
usveticic@3015:       </xsl:if>
usveticic@3015:       <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     </xsl:for-each>
usveticic@3015:     <xsl:text>    ],
usveticic@3015: </xsl:text>
usveticic@3015:   </xsl:template>
edouard@3355:   <xsl:template match="widget[@type='TextList']" mode="widget_desc">
edouard@3355:     <type>
edouard@3355:       <xsl:value-of select="@type"/>
edouard@3355:     </type>
edouard@3355:     <longdesc>
edouard@3355:       <xsl:text>TextList widget is a svg:group, list items are labeled elements
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>in that group.
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>To use a TextList, clone (svg:use) one of the items inside the widget 
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>that expects a TextList.
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>In this list, (translated) text content is what matters. Nevertheless
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>text style of the cloned item will be applied in client widget.
edouard@3355: </xsl:text>
edouard@3355:     </longdesc>
edouard@3355:     <shortdesc>
edouard@3355:       <xsl:text>A named list of ordered texts </xsl:text>
edouard@3355:     </shortdesc>
edouard@3355:     <arg name="listname"/>
edouard@3355:   </xsl:template>
edouard@3355:   <xsl:template match="widget[@type='TextList']" mode="widget_defs">
edouard@3355:     <xsl:param name="hmi_element"/>
edouard@3355:     <xsl:text>    texts: [
edouard@3355: </xsl:text>
edouard@3355:     <xsl:for-each select="func:refered_elements($hmi_element/*[@inkscape:label])[self::svg:text]">
edouard@3355:       <xsl:text>        id("</xsl:text>
edouard@3355:       <xsl:value-of select="@id"/>
edouard@3355:       <xsl:text>"),
edouard@3355: </xsl:text>
edouard@3355:     </xsl:for-each>
edouard@3355:     <xsl:text>    ].reverse(),
edouard@3355: </xsl:text>
edouard@3355:   </xsl:template>
edouard@3355:   <xsl:template match="widget[@type='TextStyleList']" mode="widget_desc">
edouard@3355:     <type>
edouard@3355:       <xsl:value-of select="@type"/>
edouard@3355:     </type>
edouard@3355:     <longdesc>
edouard@3355:       <xsl:text>TextStyleList widget is a svg:group, list items are labeled elements
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>in that group.
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>To use a TextStyleList, clone (svg:use) one of the items inside the widget 
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>that expects a TextStyleList.
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>
edouard@3355: </xsl:text>
edouard@3355:       <xsl:text>In this list, only style matters. Text content is ignored.
edouard@3355: </xsl:text>
edouard@3355:     </longdesc>
edouard@3355:     <shortdesc>
edouard@3355:       <xsl:text>A named list of named texts</xsl:text>
edouard@3355:     </shortdesc>
edouard@3355:     <arg name="listname"/>
edouard@3355:   </xsl:template>
edouard@3355:   <xsl:template match="widget[@type='TextStyleList']" mode="widget_defs">
edouard@3355:     <xsl:param name="hmi_element"/>
edouard@3355:     <xsl:text>    styles: {
edouard@3355: </xsl:text>
edouard@3355:     <xsl:for-each select="$hmi_element/*[@inkscape:label]">
edouard@3355:       <xsl:variable name="style" select="func:refered_elements(.)[self::svg:text]/@style"/>
edouard@3355:       <xsl:text>        </xsl:text>
edouard@3355:       <xsl:value-of select="@inkscape:label"/>
edouard@3355:       <xsl:text>: "</xsl:text>
edouard@3355:       <xsl:value-of select="$style"/>
edouard@3355:       <xsl:text>",
edouard@3355: </xsl:text>
edouard@3355:     </xsl:for-each>
edouard@3355:     <xsl:text>    },
edouard@3355: </xsl:text>
edouard@3355:   </xsl:template>
edouard@3241:   <xsl:template match="widget[@type='ToggleButton']" mode="widget_desc">
edouard@3241:     <type>
edouard@3241:       <xsl:value-of select="@type"/>
edouard@3241:     </type>
edouard@3241:     <longdesc>
edouard@3241:       <xsl:text>Button widget takes one boolean variable path, and reflect current true
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>or false value by showing "active" or "inactive" labeled element
edouard@3241: </xsl:text>
edouard@3241:       <xsl:text>respectively. Clicking or touching button toggles variable.
edouard@3241: </xsl:text>
edouard@3241:     </longdesc>
edouard@3241:     <shortdesc>
edouard@3241:       <xsl:text>Toggle button reflecting given boolean variable</xsl:text>
edouard@3241:     </shortdesc>
edouard@3241:     <path name="value" accepts="HMI_BOOL">
edouard@3241:       <xsl:text>Boolean variable</xsl:text>
edouard@3241:     </path>
edouard@3241:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='ToggleButton']" mode="widget_class">
edouard@3238:     <xsl:text>class </xsl:text>
edouard@3238:     <xsl:text>ToggleButtonWidget</xsl:text>
edouard@3238:     <xsl:text> extends Widget{
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    frequency = 5;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    state = 0;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    active_style = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    inactive_style = undefined;
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    dispatch(value) {
usveticic@3015: </xsl:text>
Edouard@3065:     <xsl:text>        this.state = value;
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //redraw toggle button
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.request_animate();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    on_click(evt) {
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //toggle state and apply
Edouard@3065: </xsl:text>
Edouard@3220:     <xsl:text>        this.state = this.state ? false : true;
Edouard@3058: </xsl:text>
Edouard@3065:     <xsl:text>        this.apply_hmi_value(0, this.state);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        //redraw toggle button
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>        this.request_animate();
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3220:     <xsl:text>    activate(val) {
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>        let [active, inactive] = val ? ["none",""] : ["", "none"];
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>        if (this.active_elt)
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>            this.active_elt.style.display = active;
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>        if (this.inactive_elt)
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>            this.inactive_elt.style.display = inactive;
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>    }
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>
Edouard@3220: </xsl:text>
Edouard@3065:     <xsl:text>    animate(){
Edouard@3065: </xsl:text>
Edouard@3220:     <xsl:text>        // redraw toggle button on screen refresh
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>        this.activate(this.state);
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    }
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>
Edouard@3065: </xsl:text>
Edouard@3065:     <xsl:text>    init() {
Edouard@3065: </xsl:text>
Edouard@3220:     <xsl:text>        this.activate(false);
Edouard@3220: </xsl:text>
Edouard@3220:     <xsl:text>        this.element.onclick = (evt) =&gt; this.on_click(evt);
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>    }
usveticic@3015: </xsl:text>
usveticic@3015:     <xsl:text>}
usveticic@3015: </xsl:text>
usveticic@3015:   </xsl:template>
edouard@3238:   <xsl:template match="widget[@type='ToggleButton']" mode="widget_defs">
dgaberscek@2977:     <xsl:param name="hmi_element"/>
dgaberscek@2977:     <xsl:call-template name="defs_by_labels">
dgaberscek@2977:       <xsl:with-param name="hmi_element" select="$hmi_element"/>
dgaberscek@2977:       <xsl:with-param name="labels">
dgaberscek@2977:         <xsl:text>active inactive</xsl:text>
dgaberscek@2977:       </xsl:with-param>
Edouard@3065:       <xsl:with-param name="mandatory" select="'no'"/>
dgaberscek@2977:     </xsl:call-template>
dgaberscek@2977:   </xsl:template>
edouard@2883:   <xsl:template match="/">
edouard@2883:     <xsl:comment>
edouard@2883:       <xsl:text>Made with SVGHMI. https://beremiz.org</xsl:text>
edouard@2883:     </xsl:comment>
Edouard@3264:     <html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
Edouard@3212:       <head>
Edouard@3264:         <style type="text/css" media="screen">
Edouard@3212:           <xsl:value-of select="ns:GetFonts()"/>
Edouard@3212:         </style>
Edouard@3212:       </head>
Edouard@3084:       <body style="margin:0;overflow:hidden;user-select:none;touch-action:none;">
edouard@2883:         <xsl:copy-of select="$result_svg"/>
edouard@2883:         <script>
edouard@2943:           <xsl:text>
edouard@2943: //
edouard@2943: //
edouard@2943: // Early independent declarations 
edouard@2943: //
edouard@2943: //
edouard@2943: </xsl:text>
edouard@2941:           <xsl:apply-templates select="document('')/*/preamble:*"/>
edouard@2943:           <xsl:text>
edouard@2943: //
edouard@2943: //
edouard@2943: // Declarations depending on preamble 
edouard@2943: //
edouard@2943: //
edouard@2943: </xsl:text>
edouard@2943:           <xsl:apply-templates select="document('')/*/declarations:*"/>
edouard@2943:           <xsl:text>
edouard@2943: //
edouard@2943: //
edouard@2943: // Order independent declaration and code 
edouard@2943: //
edouard@2943: //
edouard@2943: </xsl:text>
edouard@2943:           <xsl:apply-templates select="document('')/*/definitions:*"/>
edouard@2943:           <xsl:text>
edouard@2943: //
edouard@2943: //
edouard@2943: // Statements that needs to be at the end 
edouard@2943: //
edouard@2943: //
edouard@2943: </xsl:text>
edouard@2941:           <xsl:apply-templates select="document('')/*/epilogue:*"/>
edouard@3362:           <xsl:text>/* https://github.com/alexei/sprintf.js/blob/master/src/sprintf.js */
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>/* global window, exports, define */
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>!function() {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    'use strict'
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    var re = {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        not_string: /[^s]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        not_bool: /[^t]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        not_type: /[^T]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        not_primitive: /[^v]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        number: /[diefg]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        numeric_arg: /[bcdiefguxX]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        json: /[j]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        not_json: /[^j]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        text: /^[^%]+/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        modulo: /^%{2}/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        placeholder: /^%(?:([1-9]\d*)\$|\(([^)]+)\))?(\+)?(0|'[^$])?(-)?(\d+)?(?:\.(\d+))?([b-gijostTuvxX])/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        key: /^([a-z_][a-z_\d]*)/i,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        key_access: /^\.([a-z_][a-z_\d]*)/i,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        index_access: /^\[(\d+)\]/,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        sign: /^[+-]/
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    function sprintf(key) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        // arguments is not an array, but should be fine for this call
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        return sprintf_format(sprintf_parse(key), arguments)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    function vsprintf(fmt, argv) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        return sprintf.apply(null, [fmt].concat(argv || []))
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    function sprintf_format(parse_tree, argv) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        var cursor = 1, tree_length = parse_tree.length, arg, output = '', i, k, ph, pad, pad_character, pad_length, is_positive, sign
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        for (i = 0; i &lt; tree_length; i++) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            if (typeof parse_tree[i] === 'string') {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                output += parse_tree[i]
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            else if (typeof parse_tree[i] === 'object') {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                ph = parse_tree[i] // convenience purposes only
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                if (ph.keys) { // keyword argument
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    arg = argv[cursor]
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    for (k = 0; k &lt; ph.keys.length; k++) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        if (arg == undefined) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                            throw new Error(sprintf('[sprintf] Cannot access property "%s" of undefined value "%s"', ph.keys[k], ph.keys[k-1]))
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = arg[ph.keys[k]]
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                else if (ph.param_no) { // positional argument (explicit)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    arg = argv[ph.param_no]
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                else { // positional argument (implicit)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    arg = argv[cursor++]
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                if (re.not_type.test(ph.type) &amp;&amp; re.not_primitive.test(ph.type) &amp;&amp; arg instanceof Function) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    arg = arg()
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                if (re.numeric_arg.test(ph.type) &amp;&amp; (typeof arg !== 'number' &amp;&amp; isNaN(arg))) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    throw new TypeError(sprintf('[sprintf] expecting number but found %T', arg))
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                if (re.number.test(ph.type)) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    is_positive = arg &gt;= 0
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                switch (ph.type) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'b':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = parseInt(arg, 10).toString(2)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'c':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = String.fromCharCode(parseInt(arg, 10))
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'd':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'i':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = parseInt(arg, 10)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'j':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = JSON.stringify(arg, null, ph.width ? parseInt(ph.width) : 0)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'e':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = ph.precision ? parseFloat(arg).toExponential(ph.precision) : parseFloat(arg).toExponential()
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'f':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = ph.precision ? parseFloat(arg).toFixed(ph.precision) : parseFloat(arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'g':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = ph.precision ? String(Number(arg.toPrecision(ph.precision))) : parseFloat(arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'o':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = (parseInt(arg, 10) &gt;&gt;&gt; 0).toString(8)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 's':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = String(arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = (ph.precision ? arg.substring(0, ph.precision) : arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 't':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = String(!!arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = (ph.precision ? arg.substring(0, ph.precision) : arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'T':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = Object.prototype.toString.call(arg).slice(8, -1).toLowerCase()
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = (ph.precision ? arg.substring(0, ph.precision) : arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'u':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = parseInt(arg, 10) &gt;&gt;&gt; 0
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'v':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = arg.valueOf()
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = (ph.precision ? arg.substring(0, ph.precision) : arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'x':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = (parseInt(arg, 10) &gt;&gt;&gt; 0).toString(16)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    case 'X':
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = (parseInt(arg, 10) &gt;&gt;&gt; 0).toString(16).toUpperCase()
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        break
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                if (re.json.test(ph.type)) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    output += arg
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                else {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    if (re.number.test(ph.type) &amp;&amp; (!is_positive || ph.sign)) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        sign = is_positive ? '+' : '-'
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        arg = arg.toString().replace(re.sign, '')
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    else {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        sign = ''
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    pad_character = ph.pad_char ? ph.pad_char === '0' ? '0' : ph.pad_char.charAt(1) : ' '
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    pad_length = ph.width - (sign + arg).length
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    pad = ph.width ? (pad_length &gt; 0 ? pad_character.repeat(pad_length) : '') : ''
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    output += ph.align ? sign + arg + pad : (pad_character === '0' ? sign + pad + arg : pad + sign + arg)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        return output
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    var sprintf_cache = Object.create(null)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    function sprintf_parse(fmt) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        if (sprintf_cache[fmt]) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            return sprintf_cache[fmt]
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        var _fmt = fmt, match, parse_tree = [], arg_names = 0
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        while (_fmt) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            if ((match = re.text.exec(_fmt)) !== null) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                parse_tree.push(match[0])
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            else if ((match = re.modulo.exec(_fmt)) !== null) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                parse_tree.push('%')
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            else if ((match = re.placeholder.exec(_fmt)) !== null) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                if (match[2]) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    arg_names |= 1
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    var field_list = [], replacement_field = match[2], field_match = []
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    if ((field_match = re.key.exec(replacement_field)) !== null) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        field_list.push(field_match[1])
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        while ((replacement_field = replacement_field.substring(field_match[0].length)) !== '') {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                            if ((field_match = re.key_access.exec(replacement_field)) !== null) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                                field_list.push(field_match[1])
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                            else if ((field_match = re.index_access.exec(replacement_field)) !== null) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                                field_list.push(field_match[1])
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                            else {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                                throw new SyntaxError('[sprintf] failed to parse named argument key')
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    else {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        throw new SyntaxError('[sprintf] failed to parse named argument key')
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    match[2] = field_list
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                else {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    arg_names |= 2
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                if (arg_names === 3) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    throw new Error('[sprintf] mixing positional and named placeholders is not (yet) supported')
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                parse_tree.push(
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        placeholder: match[0],
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        param_no:    match[1],
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        keys:        match[2],
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        sign:        match[3],
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        pad_char:    match[4],
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        align:       match[5],
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        width:       match[6],
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        precision:   match[7],
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                        type:        match[8]
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                )
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            else {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                throw new SyntaxError('[sprintf] unexpected placeholder')
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            _fmt = _fmt.substring(match[0].length)
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        return sprintf_cache[fmt] = parse_tree
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    /**
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>     * export to either browser or node.js
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>     */
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    /* eslint-disable quote-props */
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    if (typeof exports !== 'undefined') {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        exports['sprintf'] = sprintf
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        exports['vsprintf'] = vsprintf
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    if (typeof window !== 'undefined') {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        window['sprintf'] = sprintf
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        window['vsprintf'] = vsprintf
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        if (typeof define === 'function' &amp;&amp; define['amd']) {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            define(function() {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                return {
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    'sprintf': sprintf,
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                    'vsprintf': vsprintf
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>                }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>            })
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>        }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    }
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>    /* eslint-enable quote-props */
edouard@3362: </xsl:text>
edouard@3362:           <xsl:text>}(); // eslint-disable-line    
edouard@3362: </xsl:text>
edouard@2941:           <xsl:text>// svghmi.js
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
Edouard@3080:           <xsl:text>var need_cache_apply = [];
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@3005:           <xsl:text>function dispatch_value(index, value) {
edouard@3005: </xsl:text>
Edouard@3022:           <xsl:text>    let widgets = subscribers(index);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    let oldval = cache[index];
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    cache[index] = value;
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    if(widgets.size &gt; 0) {
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>        for(let widget of widgets){
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>            widget.new_hmi_value(index, value, oldval);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>        }
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>};
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>function init_widgets() {
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    Object.keys(hmi_widgets).forEach(function(id) {
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>        let widget = hmi_widgets[id];
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>        let init = widget.init;
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>        if(typeof(init) == "function"){
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>            try {
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>                init.call(widget);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>            } catch(err) {
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>                console.log(err);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>            }
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>        }
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    });
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>};
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>// Open WebSocket to relative "/ws" address
edouard@3005: </xsl:text>
Edouard@3383:           <xsl:text>var has_watchdog = window.location.hash == "#watchdog";
Edouard@3383: </xsl:text>
edouard@3268:           <xsl:text>
edouard@3268: </xsl:text>
edouard@3268:           <xsl:text>var ws_url = 
edouard@3268: </xsl:text>
edouard@3268:           <xsl:text>    window.location.href.replace(/^http(s?:\/\/[^\/]*)\/.*$/, 'ws$1/ws')
edouard@3268: </xsl:text>
Edouard@3383:           <xsl:text>    + '?mode=' + (has_watchdog ? "watchdog" : "multiclient");
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>
edouard@3268: </xsl:text>
edouard@3268:           <xsl:text>var ws = new WebSocket(ws_url);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>ws.binaryType = 'arraybuffer';
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>const dvgetters = {
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    INT: (dv,offset) =&gt; [dv.getInt16(offset, true), 2],
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    BOOL: (dv,offset) =&gt; [dv.getInt8(offset, true), 1],
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    NODE: (dv,offset) =&gt; [dv.getInt8(offset, true), 1],
edouard@3005: </xsl:text>
edouard@3068:           <xsl:text>    REAL: (dv,offset) =&gt; [dv.getFloat32(offset, true), 4],
edouard@3068: </xsl:text>
edouard@3005:           <xsl:text>    STRING: (dv, offset) =&gt; {
edouard@3005: </xsl:text>
Edouard@3080:           <xsl:text>        const size = dv.getInt8(offset);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>        return [
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>            String.fromCharCode.apply(null, new Uint8Array(
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>                dv.buffer, /* original buffer */
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>                offset + 1, /* string starts after size*/
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>                size /* size of string */
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>            )), size + 1]; /* total increment */
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>};
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>// Apply updates recieved through ws.onmessage to subscribed widgets
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>function apply_updates() {
edouard@3005: </xsl:text>
edouard@3154:           <xsl:text>    updates.forEach((value, index) =&gt; {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        dispatch_value(index, value);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    });
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    updates.clear();
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>}
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>// Called on requestAnimationFrame, modifies DOM
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>var requestAnimationFrameID = null;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function animate() {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    // Do the page swith if any one pending
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    if(current_subscribed_page != current_visible_page){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        switch_visible_page(current_subscribed_page);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    while(widget = need_cache_apply.pop()){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        widget.apply_cache();
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    if(jumps_need_update) update_jumps();
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    apply_updates();
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    pending_widget_animates.forEach(widget =&gt; widget._animate());
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    pending_widget_animates = [];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    requestAnimationFrameID = null;
edouard@3154: </xsl:text>
edouard@3005:           <xsl:text>}
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
edouard@3154:           <xsl:text>function requestHMIAnimation() {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    if(requestAnimationFrameID == null){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        requestAnimationFrameID = window.requestAnimationFrame(animate);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3154:           <xsl:text>}
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>// Message reception handler
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>// Hash is verified and HMI values updates resulting from binary parsing
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>// are stored until browser can compute next frame, DOM is left untouched
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>ws.onmessage = function (evt) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let data = evt.data;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let dv = new DataView(data);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let i = 0;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    try {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        for(let hash_int of hmi_hash) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            if(hash_int != dv.getUint8(i)){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                throw new Error("Hash doesn't match");
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            };
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            i++;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        };
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        while(i &lt; data.byteLength){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            let index = dv.getUint32(i, true);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            i += 4;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            let iectype = hmitree_types[index];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            if(iectype != undefined){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                let dvgetter = dvgetters[iectype];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                let [value, bytesize] = dvgetter(dv,i);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                updates.set(index, value);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                i += bytesize;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            } else {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                throw new Error("Unknown index "+index);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        };
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        // register for rendering on next frame, since there are updates
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        requestHMIAnimation();
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    } catch(err) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        // 1003 is for "Unsupported Data"
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        // ws.close(1003, err.message);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        // TODO : remove debug alert ?
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        alert("Error : "+err.message+"\nHMI will be reloaded.");
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        // force reload ignoring cache
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        location.reload(true);
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3154:           <xsl:text>};
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>hmi_hash_u8 = new Uint8Array(hmi_hash);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function send_blob(data) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    if(data.length &gt; 0) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        ws.send(new Blob([hmi_hash_u8].concat(data)));
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    };
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>};
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>const typedarray_types = {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    INT: (number) =&gt; new Int16Array([number]),
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    BOOL: (truth) =&gt; new Int16Array([truth]),
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    NODE: (truth) =&gt; new Int16Array([truth]),
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    REAL: (number) =&gt; new Float32Array([number]),
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    STRING: (str) =&gt; {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        // beremiz default string max size is 128
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        str = str.slice(0,128);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        binary = new Uint8Array(str.length + 1);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        binary[0] = str.length;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        for(let i = 0; i &lt; str.length; i++){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            binary[i+1] = str.charCodeAt(i);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        return binary;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    /* TODO */
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>};
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function send_reset() {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    send_blob(new Uint8Array([1])); /* reset = 1 */
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>};
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>var subscriptions = [];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function subscribers(index) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let entry = subscriptions[index];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let res;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    if(entry == undefined){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        res = new Set();
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        subscriptions[index] = [res,0];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    }else{
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        [res, _ign] = entry;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    return res
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>}
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
edouard@3154:           <xsl:text>function get_subscription_period(index) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let entry = subscriptions[index];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    if(entry == undefined)
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        return 0;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let [_ign, period] = entry;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    return period;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>}
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function set_subscription_period(index, period) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let entry = subscriptions[index];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    if(entry == undefined){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        subscriptions[index] = [new Set(), period];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    } else {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        entry[1] = period;
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>}
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
Edouard@3383:           <xsl:text>if(has_watchdog){
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>    // artificially subscribe the watchdog widget to "/heartbeat" hmi variable
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>    // Since dispatch directly calls change_hmi_value,
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>    // PLC will periodically send variable at given frequency
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>    subscribers(heartbeat_index).add({
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        /* type: "Watchdog", */
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        frequency: 1,
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        indexes: [heartbeat_index],
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        new_hmi_value: function(index, value, oldval) {
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>            apply_hmi_value(heartbeat_index, value+1);
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        }
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>    });
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>}
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>// subscribe to per instance current page hmi variable
Edouard@3383: </xsl:text>
Edouard@3387:           <xsl:text>// PLC must prefix page name with "!" for page switch to happen
Edouard@3387: </xsl:text>
Edouard@3383:           <xsl:text>subscribers(current_page_var_index).add({
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    frequency: 1,
edouard@3154: </xsl:text>
Edouard@3383:           <xsl:text>    indexes: [current_page_var_index],
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    new_hmi_value: function(index, value, oldval) {
edouard@3154: </xsl:text>
Edouard@3387:           <xsl:text>        if(value.startsWith("!"))
Edouard@3387: </xsl:text>
Edouard@3387:           <xsl:text>            switch_page(value.slice(1));
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>});
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function svg_text_to_multiline(elt) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    return(Array.prototype.map.call(elt.children, x=&gt;x.textContent).join("\n")); 
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>}
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function multiline_to_svg_text(elt, str) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    str.split('\n').map((line,i) =&gt; {elt.children[i].textContent = line;});
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>}
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function switch_langnum(langnum) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    langnum = Math.max(0, Math.min(langs.length - 1, langnum));
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    for (let translation of translations) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        let [objs, msgs] = translation;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        let msg = msgs[langnum];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        for (let obj of objs) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            multiline_to_svg_text(obj, msg);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            obj.setAttribute("lang",langnum);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    return langnum;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>}
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>// backup original texts
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>for (let translation of translations) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let [objs, msgs] = translation;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    msgs.unshift(svg_text_to_multiline(objs[0])); 
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>}
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>var lang_local_index = hmi_local_index("lang");
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>var langcode_local_index = hmi_local_index("lang_code");
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>var langname_local_index = hmi_local_index("lang_name");
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>subscribers(lang_local_index).add({
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    indexes: [lang_local_index],
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    new_hmi_value: function(index, value, oldval) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        let current_lang =  switch_langnum(value);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        let [langname,langcode] = langs[current_lang];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        apply_hmi_value(langcode_local_index, langcode);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        apply_hmi_value(langname_local_index, langname);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        switch_page();
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>});
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function setup_lang(){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let current_lang = cache[lang_local_index];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let new_lang = switch_langnum(current_lang);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    if(current_lang != new_lang){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        apply_hmi_value(lang_local_index, new_lang);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>}
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>setup_lang();
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>function update_subscriptions() {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    let delta = [];
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>    for(let index in subscriptions){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        let widgets = subscribers(index);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        // periods are in ms
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        let previous_period = get_subscription_period(index);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        // subscribing with a zero period is unsubscribing
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        let new_period = 0;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        if(widgets.size &gt; 0) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            let maxfreq = 0;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            for(let widget of widgets){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                let wf = widget.frequency;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                if(wf != undefined &amp;&amp; maxfreq &lt; wf)
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                    maxfreq = wf;
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>            }
edouard@3005: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            if(maxfreq != 0)
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                new_period = 1000/maxfreq;
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        if(previous_period != new_period) {
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            set_subscription_period(index, new_period);
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            if(index &lt;= last_remote_index){
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                delta.push(
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                    new Uint8Array([2]), /* subscribe = 2 */
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                    new Uint32Array([index]),
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>                    new Uint16Array([new_period]));
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>            }
edouard@3154: </xsl:text>
edouard@3154:           <xsl:text>        }
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3154:           <xsl:text>    send_blob(delta);
edouard@3154: </xsl:text>
edouard@3005:           <xsl:text>};
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
Edouard@3147:           <xsl:text>function send_hmi_value(index, value) {
Edouard@3147: </xsl:text>
edouard@3414:           <xsl:text>    console.log("send_hmi_value("+index+", "+value+")")
edouard@3414: </xsl:text>
Edouard@3147:           <xsl:text>    if(index &gt; last_remote_index){
Edouard@3147: </xsl:text>
edouard@3154:           <xsl:text>        updates.set(index, value);
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        if(persistent_indexes.has(index)){
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>            let varname = persistent_indexes.get(index);
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>            document.cookie = varname+"="+value+"; max-age=3153600000";
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        }
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        requestHMIAnimation();
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        return;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    }
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    let iectype = hmitree_types[index];
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    let tobinary = typedarray_types[iectype];
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    send_blob([
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        new Uint8Array([0]),  /* setval = 0 */
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        new Uint32Array([index]),
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        tobinary(value)]);
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    // DON'T DO THAT unless read_iterator in svghmi.c modifies wbuf as well, not only rbuf
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    // cache[index] = value;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>};
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>function apply_hmi_value(index, new_val) {
Edouard@3147: </xsl:text>
edouard@3414:           <xsl:text>    console.log("apply_hmi_value("+index+", "+new_val+")")
edouard@3414: </xsl:text>
edouard@3414:           <xsl:text>    /*let old_val = cache[index];*/
edouard@3414: </xsl:text>
edouard@3414:           <xsl:text>    if(new_val != undefined /*&amp;&amp; old_val != new_val*/)
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        send_hmi_value(index, new_val);
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    return new_val;
edouard@3128: </xsl:text>
edouard@3128:           <xsl:text>}
edouard@3128: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>const quotes = {"'":null, '"':null};
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>function eval_operation_string(old_val, opstr) {
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    let op = opstr[0];
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    let given_val;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    if(opstr.length &lt; 2) 
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        return undefined;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    if(opstr[1] in quotes){
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        if(opstr.length &lt; 3) 
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>            return undefined;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        if(opstr[opstr.length-1] == opstr[1]){
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>            given_val = opstr.slice(2,opstr.length-1);
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        }
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    } else {
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        given_val = Number(opstr.slice(1));
edouard@3128: </xsl:text>
edouard@3128:           <xsl:text>    }
edouard@3128: </xsl:text>
Edouard@3147:           <xsl:text>    let new_val;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    switch(op){
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>      case "=":
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        new_val = given_val;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        break;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>      case "+":
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        new_val = old_val + given_val;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        break;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>      case "-":
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        new_val = old_val - given_val;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        break;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>      case "*":
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        new_val = old_val * given_val;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        break;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>      case "/":
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        new_val = old_val / given_val;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        break;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    }
edouard@2941: </xsl:text>
Edouard@3147:           <xsl:text>    return new_val;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>}
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>var current_visible_page;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>var current_subscribed_page;
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>var current_page_index;
Edouard@3147: </xsl:text>
Edouard@3206:           <xsl:text>var page_node_local_index = hmi_local_index("page_node");
Edouard@3206: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3299:           <xsl:text>function toggleFullscreen() {
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>  let elem = document.documentElement;
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>  if (!document.fullscreenElement) {
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>    elem.requestFullscreen().catch(err =&gt; {
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>      console.log("Error attempting to enable full-screen mode: "+err.message+" ("+err.name+")");
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>    });
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>  } else {
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>    document.exitFullscreen();
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>  }
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>}
Edouard@3299: </xsl:text>
Edouard@3299:           <xsl:text>
Edouard@3299: </xsl:text>
Edouard@3147:           <xsl:text>function prepare_svg() {
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    // prevents context menu from appearing on right click and long touch
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    document.body.addEventListener('contextmenu', e =&gt; {
Edouard@3147: </xsl:text>
Edouard@3299:           <xsl:text>        toggleFullscreen();
Edouard@3299: </xsl:text>
Edouard@3147:           <xsl:text>        e.preventDefault();
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    });
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    for(let eltid in detachable_elements){
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        let [element,parent] = detachable_elements[eltid];
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        parent.removeChild(element);
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    }
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>};
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>
edouard@3005: </xsl:text>
Edouard@3147:           <xsl:text>function switch_page(page_name, page_index) {
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    if(current_subscribed_page != current_visible_page){
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        /* page switch already going */
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        /* TODO LOG ERROR */
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        return false;
edouard@3017: </xsl:text>
edouard@3017:           <xsl:text>    }
edouard@3017: </xsl:text>
edouard@3017:           <xsl:text>
edouard@3017: </xsl:text>
Edouard@3147:           <xsl:text>    if(page_name == undefined)
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        page_name = current_subscribed_page;
Edouard@3147: </xsl:text>
Edouard@3383:           <xsl:text>    else if(page_index == undefined){
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        [page_name, page_index] = page_name.split('@')
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>    }
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    let old_desc = page_desc[current_subscribed_page];
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    let new_desc = page_desc[page_name];
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    if(new_desc == undefined){
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        /* TODO LOG ERROR */
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        return false;
edouard@3097: </xsl:text>
edouard@3097:           <xsl:text>    }
edouard@3097: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3383:           <xsl:text>    if(page_index == undefined)
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        page_index = new_desc.page_index;
edouard@3097: </xsl:text>
Edouard@3383:           <xsl:text>    else if(typeof(page_index) == "string") {
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        let hmitree_node = hmitree_nodes[page_index];
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        if(hmitree_node !== undefined){
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>            let [int_index, hmiclass] = hmitree_node;
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>            if(hmiclass == new_desc.page_class)
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>                page_index = int_index;
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>            else
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>                page_index = new_desc.page_index;
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        } else {
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>            page_index = new_desc.page_index;
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>        }
Edouard@3383: </xsl:text>
edouard@3097:           <xsl:text>    }
edouard@3097: </xsl:text>
Edouard@3147:           <xsl:text>
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>    if(old_desc){
Edouard@3147: </xsl:text>
Edouard@3147:           <xsl:text>        old_desc.widgets.map(([widget,relativeness])=&gt;widget.unsub());
edouard@3005: </xsl:text>
edouard@3005:           <xsl:text>    }
edouard@3005: </xsl:text>
Edouard@3080:           <xsl:text>    const new_offset = page_index == undefined ? 0 : page_index - new_desc.page_index;
Edouard@3080: </xsl:text>
Edouard@3080:           <xsl:text>
Edouard@3080: </xsl:text>
Edouard@3080:           <xsl:text>    const container_id = page_name + (page_index != undefined ? page_index : "");
edouard@3017: </xsl:text>
edouard@3017:           <xsl:text>
edouard@3017: </xsl:text>
edouard@3017:           <xsl:text>    new_desc.widgets.map(([widget,relativeness])=&gt;widget.sub(new_offset,relativeness,container_id));
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    update_subscriptions();
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    current_subscribed_page = page_name;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    current_page_index = page_index;
edouard@2941: </xsl:text>
Edouard@3206:           <xsl:text>    let page_node;
Edouard@3206: </xsl:text>
Edouard@3206:           <xsl:text>    if(page_index != undefined){
Edouard@3206: </xsl:text>
Edouard@3206:           <xsl:text>        page_node = hmitree_paths[page_index];
Edouard@3206: </xsl:text>
Edouard@3206:           <xsl:text>    }else{
Edouard@3206: </xsl:text>
Edouard@3206:           <xsl:text>        page_node = "";
Edouard@3206: </xsl:text>
Edouard@3206:           <xsl:text>    }
Edouard@3206: </xsl:text>
Edouard@3206:           <xsl:text>    apply_hmi_value(page_node_local_index, page_node);
Edouard@3206: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    jumps_need_update = true;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    requestHMIAnimation();
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    jump_history.push([page_name, page_index]);
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    if(jump_history.length &gt; 42)
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>        jump_history.shift();
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
Edouard@3387:           <xsl:text>    apply_hmi_value(current_page_var_index, page_index == undefined
Edouard@3387: </xsl:text>
Edouard@3387:           <xsl:text>        ? page_name
Edouard@3387: </xsl:text>
Edouard@3387:           <xsl:text>        : page_name + "@" + hmitree_paths[page_index]);
Edouard@3383: </xsl:text>
Edouard@3383:           <xsl:text>
Edouard@3383: </xsl:text>
edouard@2941:           <xsl:text>    return true;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>};
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2942:           <xsl:text>function switch_visible_page(page_name) {
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>    let old_desc = page_desc[current_visible_page];
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>    let new_desc = page_desc[page_name];
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>    if(old_desc){
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>        for(let eltid in old_desc.required_detachables){
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>            if(!(eltid in new_desc.required_detachables)){
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>                let [element, parent] = old_desc.required_detachables[eltid];
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>                parent.removeChild(element);
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>            }
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>        }
edouard@2941: </xsl:text>
edouard@2942:           <xsl:text>        for(let eltid in new_desc.required_detachables){
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>            if(!(eltid in old_desc.required_detachables)){
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>                let [element, parent] = new_desc.required_detachables[eltid];
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>                parent.appendChild(element);
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>            }
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>        }
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>    }else{
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>        for(let eltid in new_desc.required_detachables){
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>            let [element, parent] = new_desc.required_detachables[eltid];
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>            parent.appendChild(element);
edouard@2942: </xsl:text>
edouard@2942:           <xsl:text>        }
edouard@2942: </xsl:text>
edouard@2941:           <xsl:text>    }
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    svg_root.setAttribute('viewBox',new_desc.bbox.join(" "));
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    current_visible_page = page_name;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>};
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>// Once connection established
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>ws.onopen = function (evt) {
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    init_widgets();
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    send_reset();
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    // show main page
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    prepare_svg();
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    switch_page(default_page);
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>};
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>ws.onclose = function (evt) {
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    // TODO : add visible notification while waiting for reload
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    console.log("Connection closed. code:"+evt.code+" reason:"+evt.reason+" wasClean:"+evt.wasClean+" Reload in 10s.");
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    // TODO : re-enable auto reload when not in debug
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    //window.setTimeout(() =&gt; location.reload(true), 10000);
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    alert("Connection closed. code:"+evt.code+" reason:"+evt.reason+" wasClean:"+evt.wasClean+".");
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>};
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
Edouard@3080:           <xsl:text>const xmlns = "http://www.w3.org/2000/svg";
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>var edit_callback;
edouard@2941: </xsl:text>
Edouard@3079:           <xsl:text>const localtypes = {"PAGE_LOCAL":null, "HMI_LOCAL":null}
Edouard@3079: </xsl:text>
Edouard@3118:           <xsl:text>function edit_value(path, valuetype, callback, initial) {
edouard@2941: </xsl:text>
Edouard@3079:           <xsl:text>    if(valuetype in localtypes){
Edouard@3079: </xsl:text>
Edouard@3079:           <xsl:text>        valuetype = (typeof initial) == "number" ? "HMI_REAL" : "HMI_STRING";
Edouard@3079: </xsl:text>
Edouard@3079:           <xsl:text>    }
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    let [keypadid, xcoord, ycoord] = keypads[valuetype];
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    edit_callback = callback;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    let widget = hmi_widgets[keypadid];
edouard@2941: </xsl:text>
Edouard@3118:           <xsl:text>    widget.start_edit(path, valuetype, callback, initial);
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>};
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>var current_modal; /* TODO stack ?*/
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
Edouard@3118:           <xsl:text>function show_modal() {
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    let [element, parent] = detachable_elements[this.element.id];
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    tmpgrp = document.createElementNS(xmlns,"g");
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    tmpgrpattr = document.createAttribute("transform");
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    let [xcoord,ycoord] = this.coordinates;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    let [xdest,ydest] = page_desc[current_visible_page].bbox;
edouard@2941: </xsl:text>
Edouard@3118:           <xsl:text>    tmpgrpattr.value = "translate("+String(xdest-xcoord)+","+String(ydest-ycoord)+")";
usveticic@3015: </xsl:text>
usveticic@3015:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    tmpgrp.setAttributeNode(tmpgrpattr);
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    tmpgrp.appendChild(element);
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    parent.appendChild(tmpgrp);
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    current_modal = [this.element.id, tmpgrp];
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>};
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>function end_modal() {
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    let [eltid, tmpgrp] = current_modal;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    let [element, parent] = detachable_elements[this.element.id];
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    parent.removeChild(tmpgrp);
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>    current_modal = undefined;
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>};
edouard@2941: </xsl:text>
edouard@2941:           <xsl:text>
edouard@2941: </xsl:text>
edouard@2883:         </script>
edouard@2883:       </body>
edouard@2883:     </html>
edouard@2883:   </xsl:template>
Edouard@2753: </xsl:stylesheet>