[fix + refa] fix first line which was not collapsing + refa titleList management

static/js/timeline.js

 let handler = {
-  // listReigns: "../static/json/list_reigns_sauv.json",
   listReigns: "../static/json/list_reigns.json",
   copyListReigns: Object(),
   items: new vis.DataSet(),
   groups: new vis.DataSet(),
-  titlesList: ["Roi de France",
+  titlesGroup: [
+    "Roi de France",
+    "Roi des Francs à la fin du IVe siècle",
+    "Roi des Francs"
+  ],
+  titlesList: [
+    "Roi de France",
     "Roi des Francs à la fin du IVe siècle",
     "Roi des Francs",
     "Roi des Francs saliens",
@@ -17,6 +22,7 @@ let handler = {
     "Roi des Francs d'Austrasie et de Bourgogne",
     "Roi des Lombards"
   ],
+  titlesId: {},
   kingsList: [],
   // liste des reignes traités pour éviter les doublons quand deux mêmes règnes
   reignIds: [],
@@ -28,19 +34,32 @@ let handler = {
     return date;
   },
   init: function() {
-    style: 'color: red; top: 0px !important;'
+    // initiate titlesId ("reignName": groupId)
+    titleCnt = 1;
+    for(var i = 0; i < handler.titlesList.length; i++){
+      if (handler.titlesGroup.includes(handler.titlesList[i])){
+        handler.titlesId[handler.titlesList[i]] = 1;
+      }
+      else {
+        titleCnt += 1;
+        handler.titlesId[handler.titlesList[i]] = titleCnt;
+      }
+    }
 
     handler.groups.add({
       id: 1,
-      content: "Roi de France / Roi des Francs"
+      content: "Roi de France / Roi des Francs",
+      subgroupStack: {'severalReigns': true, "oneReign": false}
     });
-    // ATTENTION : change si titlesList change (titleNb bouge et id aussi sûrement)
-    for (var titleNb = 3; titleNb < handler.titlesList.length; titleNb++) {
-      handler.groups.add({
-        id: titleNb-1,
-        content: handler.titlesList[titleNb],
-        subgroupStack: {'severalReigns': true, "oneReign": false}
-      });
+    for (var i = 0; i < handler.titlesList.length; i++) {
+      var id = handler.titlesId[handler.titlesList[i]];
+      if (id != 1){
+        handler.groups.add({
+          id: id,
+          content: handler.titlesList[i],
+          subgroupStack: {'severalReigns': true, "oneReign": false}
+        });
+      }
     }
 
     $.get(handler.listReigns, function(reigns) {
@@ -78,25 +97,16 @@ let handler = {
               if (start == copyStart && end == copyEnd && reigns[i]["title"] == copyTitle) {
                 severalReigns = true;
               }
-              // faire un background pour tous sauf les deux en tag ?
             }
 
-
             // list kings to have one color per king
             if (handler.kingsList.findIndex((element) => element == content) == -1) {
               handler.kingsList.push(content);
             }
             kingNb = handler.kingsList.findIndex((element) => element == content)+1;
 
-
             for (var j = 0; j < handler.titlesList.length; j++) {
-              var groupId = "";
-              // ATTENTION : peut changer si titlesList change
-              if (handler.titlesList[j] == "Roi de France" || handler.titlesList[j] == "Roi des Francs" || handler.titlesList[j] == "Roi des Francs à la fin du IVe siècle") {
-                groupId = 1;
-              } else {
-                groupId = j;
-              }
+              var groupId = handler.titlesId[handler.titlesList[j]];
               if (reigns[i]["title"] == handler.titlesList[j]) {
                 if (severalReigns) {
                   handler.items.add({
@@ -124,10 +134,8 @@ let handler = {
                 }
                 break;
               }
-
             }
           }
-
         }
       }
     });