--- a/svghmi/gen_index_xhtml.xslt	Wed May 13 18:47:09 2020 +0200
+++ b/svghmi/gen_index_xhtml.xslt	Wed May 13 18:50:07 2020 +0200
@@ -868,6 +868,8 @@
 </xsl:text>
     <xsl:text>    constructor(elt_id,args,indexes,members){
 </xsl:text>
+    <xsl:text>        this.element_id = elt_id;
+</xsl:text>
     <xsl:text>        this.element = id(elt_id);
 </xsl:text>
     <xsl:text>        this.args = args;
@@ -880,6 +882,8 @@
 </xsl:text>
     <xsl:text>    }
 </xsl:text>
+    <xsl:text>
+</xsl:text>
     <xsl:text>    unsub(){
 </xsl:text>
     <xsl:text>        /* remove subsribers */
@@ -1078,9 +1082,10 @@
       </xsl:otherwise>
     </xsl:choose>
   </func:function>
-  <xsl:template mode="widget_defs" match="widget[@type='Back']">
-    <xsl:param name="hmi_element"/>
-    <xsl:text>    on_click: function(evt) {
+  <xsl:template mode="widget_class" match="widget[@type='Back']">
+    <xsl:text>class BackWidget extends Widget{
+</xsl:text>
+    <xsl:text>    on_click(evt) {
 </xsl:text>
     <xsl:text>        if(jump_history.length &gt; 1){
 </xsl:text>
@@ -1092,44 +1097,47 @@
 </xsl:text>
     <xsl:text>        }
 </xsl:text>
-    <xsl:text>    },
-</xsl:text>
-    <xsl:text>    init: function() {
-</xsl:text>
-    <xsl:text>        this.element.setAttribute("onclick", "hmi_widgets['</xsl:text>
-    <xsl:value-of select="$hmi_element/@id"/>
-    <xsl:text>'].on_click(evt)");
-</xsl:text>
-    <xsl:text>    },
-</xsl:text>
-  </xsl:template>
-  <xsl:template mode="widget_defs" match="widget[@type='Button']">
-    <xsl:param name="hmi_element"/>
-    <xsl:text>frequency: 5,
-</xsl:text>
-    <xsl:text>init: function() {
-</xsl:text>
-    <xsl:text>    this.element.addEventListener(
-</xsl:text>
-    <xsl:text>      "mousedown",
-</xsl:text>
-    <xsl:text>      evt =&gt; {
-</xsl:text>
-    <xsl:text>          change_hmi_value(this.indexes[0], "=1");
-</xsl:text>
-    <xsl:text>      });
-</xsl:text>
-    <xsl:text>    this.element.addEventListener(
-</xsl:text>
-    <xsl:text>      "mouseup",
-</xsl:text>
-    <xsl:text>      evt =&gt; {
-</xsl:text>
-    <xsl:text>          change_hmi_value(this.indexes[0], "=0");
-</xsl:text>
-    <xsl:text>      });
-</xsl:text>
-    <xsl:text>},
+    <xsl:text>    }
+</xsl:text>
+    <xsl:text>    init() {
+</xsl:text>
+    <xsl:text>        this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)");
+</xsl:text>
+    <xsl:text>    }
+</xsl:text>
+    <xsl:text>}
+</xsl:text>
+  </xsl:template>
+  <xsl:template mode="widget_class" match="widget[@type='Button']">
+    <xsl:text>class ButtonWidget extends Widget{
+</xsl:text>
+    <xsl:text>    frequency = 5;
+</xsl:text>
+    <xsl:text>    init() {
+</xsl:text>
+    <xsl:text>        this.element.addEventListener(
+</xsl:text>
+    <xsl:text>          "mousedown",
+</xsl:text>
+    <xsl:text>          evt =&gt; {
+</xsl:text>
+    <xsl:text>              change_hmi_value(this.indexes[0], "=1");
+</xsl:text>
+    <xsl:text>          });
+</xsl:text>
+    <xsl:text>        this.element.addEventListener(
+</xsl:text>
+    <xsl:text>          "mouseup",
+</xsl:text>
+    <xsl:text>          evt =&gt; {
+</xsl:text>
+    <xsl:text>              change_hmi_value(this.indexes[0], "=0");
+</xsl:text>
+    <xsl:text>          });
+</xsl:text>
+    <xsl:text>    }
+</xsl:text>
+    <xsl:text>}
 </xsl:text>
   </xsl:template>
   <xsl:template mode="widget_defs" match="widget[@type='CircularBar']">
@@ -1767,7 +1775,6 @@
   </xsl:template>
   <xsl:template mode="widget_defs" match="widget[@type='ForEach']">
     <xsl:param name="hmi_element"/>
-    <xsl:variable name="widgets" select="func:refered_elements($forEach_widgets)[not(@id = $forEach_widgets_ids)]"/>
     <xsl:variable name="class" select="arg[1]/@value"/>
     <xsl:variable name="base_path" select="path/@value"/>
     <xsl:variable name="hmi_index_base" select="$indexed_hmitree/*[@hmipath = $base_path]"/>
@@ -3104,11 +3111,15 @@
 </xsl:text>
           <xsl:text>            let maxfreq = 0;
 </xsl:text>
-          <xsl:text>            for(let widget of widgets)
-</xsl:text>
-          <xsl:text>                if(maxfreq &lt; widget.frequency)
-</xsl:text>
-          <xsl:text>                    maxfreq = widget.frequency;
+          <xsl:text>            for(let widget of widgets){
+</xsl:text>
+          <xsl:text>                let wf = widget.frequency;
+</xsl:text>
+          <xsl:text>                if(wf != undefined &amp;&amp; maxfreq &lt; wf)
+</xsl:text>
+          <xsl:text>                    maxfreq = wf;
+</xsl:text>
+          <xsl:text>            }
 </xsl:text>
           <xsl:text>
 </xsl:text>