--- a/svghmi/gen_index_xhtml.ysl2	Tue Mar 03 16:29:22 2020 +0100
+++ b/svghmi/gen_index_xhtml.ysl2	Wed Mar 04 09:31:53 2020 +0100
@@ -78,10 +78,9 @@
         param "elems";
         const "descend", "$elems/descendant-or-self::svg:*";
         const "clones", "$descend[self::svg:use]";
-        // TODO optimize using Xpath' id()
         const "originals", "//svg:*[concat('#',@id) = $clones/@xlink:href]";
         choose {
-            when "$originals" 
+            when "$originals"
                 result "$descend | func:refered_elements($originals)";
             otherwise
                 result "$descend";
@@ -89,7 +88,7 @@
     }
 
     def "func:intersect_1d" {
-        /* it is assumed that a1 > a0 and b1 > b0 */
+        // it is assumed that a1 > a0 and b1 > b0
         param "a0";
         param "a1";
         param "b0";
@@ -144,17 +143,17 @@
     //    |a     |
     //    '------'
     //
-    // 2 - overlapping 
-    //        .-----.    
+    // 2 - overlapping
+    //        .-----.
     //        |  a  |
     //    .---|-----|---.
     //    |   '-----'   |
     //    | b           |
     //    '-------------'
     //
-    // 3 - overlapping 
-    //        .-----.    
-    //        |  b  |    
+    // 3 - overlapping
+    //        .-----.
+    //        |  b  |
     //    .---|-----|---.
     //    |   '-----'   |
     //    | a           |
@@ -168,8 +167,8 @@
     //    '-------------'
     //
     // 6 - overlapping
-    //        .----.    
-    //        |   b|    
+    //        .----.
+    //        |   b|
     //    .---|----|---.
     //    |a  |    |   |
     //    '---|----|---'
@@ -200,10 +199,9 @@
     // return overlapping geometry for a given element
     // all intersercting element are returned
     // except groups, that must be contained to be counted in
-    const "groups", "/svg:svg | //svg:g";
-
     def "func:overlapping_geometry" {
         param "elt";
+        const "groups", "/svg:svg | //svg:g";
         const "g", "$geometry[@Id = $elt/@id]"; 
         const "candidates", "$geometry[@Id != $elt/@id]";
         result """$candidates[(@Id = $groups/@id and (func:intersect($g, .) = 9)) or 
@@ -230,7 +228,7 @@
         }
     }
 
-    const "required_elements", 
+    const "required_elements",
         """//svg:defs/descendant-or-self::svg:*
            | func:required_elements($hmi_pages)/ancestor-or-self::svg:*""";
 
@@ -241,7 +239,7 @@
         const "short_list", "$elements[not(ancestor::*/@id = $elements/@id)]";
         const "filled_groups", """$short_list/parent::svg:*[
             not(descendant::*[
-                not(self::svg:g) and 
+                not(self::svg:g) and
                 not(@id = $discardable_elements/@id) and
                 not(@id = $short_list/descendant-or-self::*[not(self::svg:g)]/@id)
             ])]""";
@@ -250,7 +248,7 @@
     }
 
     def "func:detachable_elements" {
-        param "pages"; 
+        param "pages";
         choose{
             when "$pages"{
                 result """func:sumarized_elements(func:all_related_elements($pages[1]))
@@ -260,10 +258,12 @@
             }
         }
     }
-    
+
     const "detachable_elements", "func:detachable_elements($hmi_pages)";
-    // const "essential_elements", "$detachable_elements | /svg:svg/svg:defs";
-    // const "required_elements", "$essential_elements//svg:* | $essential_elements/ancestor-or-self::svg:*";
+
+
+
+    //////////////// HMI Tree Index
 
     template "*", mode="index" {
         param "index", "0";
@@ -299,17 +299,20 @@
         }
     }
 
-    /* Identity template :
-     *  - copy every attributes 
-     *  - copy every sub-elements
-     */
+
+
+    //////////////// Inline SVG
+
+    // Identity template :
+    //  - copy every attributes 
+    //  - copy every sub-elements
     template "@* | node()", mode="inline_svg" {
-      /* use real xsl:copy instead copy-of alias from yslt.yml2 */
+      // use real xsl:copy instead copy-of alias from yslt.yml2
       if "not(@id = $discardable_elements/@id)"
           xsl:copy apply "@* | node()", mode="inline_svg";
     }
 
-    /* replaces inkscape's height and width hints. forces fit */
+    // replaces inkscape's height and width hints. forces fit
     template "svg:svg/@width", mode="inline_svg";
     template "svg:svg/@height", mode="inline_svg";
     svgtmpl "svg:svg", mode="inline_svg" svg {
@@ -318,11 +321,11 @@
         attrib "width" > 100vw
         apply "@* | node()", mode="inline_svg";
     }
-    /* ensure that coordinate in CSV file generated by inkscape are in default reference frame */
+    // ensure that coordinate in CSV file generated by inkscape are in default reference frame
     template "svg:svg[@viewBox!=concat('0 0 ', @width, ' ', @height)]", mode="inline_svg" {
         error > ViewBox settings other than X=0, Y=0 and Scale=1 are not supported
     }
-    /* ensure that coordinate in CSV file generated by inkscape match svg default unit */
+    // ensure that coordinate in CSV file generated by inkscape match svg default unit
     template "sodipodi:namedview[@units!='px' or @inkscape:document-units!='px']", mode="inline_svg" {
         error > All units must be set to "px" in Inkscape's document properties
     }
@@ -370,7 +373,7 @@
     /*const "mark" > =HMI=\n*/
 
     /* copy root node and add geometry as comment for a test */
-    template "/" { 
+    template "/" {
         comment > Made with SVGHMI. https://beremiz.org
         /* DEBUG DATA */
         comment {
@@ -626,7 +629,7 @@
                         // TODO FIXME error > «$widget_type» widget must have a «$name» element
                         warning > «$widget_type» widget must have a «$name» element
                     }
-                    // otherwise produce nothing 
+                    // otherwise produce nothing
                 }
                 otherwise {
                     |     «$name»_elt: id("«$elt_id»"),