From e6c82730dc664641f404b34bbd4e24371d892afa Mon Sep 17 00:00:00 2001
From: Lars Eggert <lars@eggert.org>
Date: Thu, 17 Sep 2020 14:11:43 +0300
Subject: [PATCH] Merge interop and measurement tables into one

---
 web/index.html |  5 +----
 web/script.js  | 38 +++++++++-----------------------------
 2 files changed, 10 insertions(+), 33 deletions(-)

diff --git a/web/index.html b/web/index.html
index bff7b277..3167da54 100644
--- a/web/index.html
+++ b/web/index.html
@@ -76,11 +76,8 @@ <h3 class="mt-5">Results Filter</h3>
       <div id="test" class="col-10 col-sm-11 btn-group flex-wrap btn-group-sm" role="group" aria-label="Filter test cases"></div>
     </div>
 
-    <h3 class="mt-5">Interop Status</h3>
+    <h3 class="mt-5">Results</h3>
     <table id="interop" class="result table table-hover"></table>
-
-    <h3 class="mt-5">Measurement Results</h3>
-    <table id="measurements" class="result table table-hover"></table>
   </div>
 
   <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
diff --git a/web/script.js b/web/script.js
index 5d2aa7bd..c61a423b 100644
--- a/web/script.js
+++ b/web/script.js
@@ -17,7 +17,6 @@
   function getLogLink(log_dir, server, client, test, text, res) {
     var a = document.createElement("a");
     a.title = "Logs";
-    $(a).attr("data-toggle", "tooltip").attr("data-placement", "bottom").tooltip();
     if (res !== "unsupported") {
       a.href = "logs/" + log_dir + "/" + server + "_" + client + "/" + test;
       a.target = "_blank";
@@ -66,10 +65,16 @@
   function fillInteropTable(result) {
     var index = 0;
     var appendResult = function(el, res, i, j) {
-      result.results[index].forEach(function(item) {
+      function makeResult(item) {
         if(item.result !== res) return;
-        el.appendChild(getLogLink(result.log_dir, result.servers[j], result.clients[i], item.name, item.abbr, res));
-      });
+        var link = getLogLink(result.log_dir, result.servers[j], result.clients[i], item.name, item.abbr, res)
+        if (item.hasOwnProperty("details"))
+          link.title = "<strong>" + item.details + "</strong><br>" + link.title;
+        $(link).attr("data-toggle", "tooltip").attr("data-placement", "bottom").attr("data-html", true).tooltip();
+        el.appendChild(link);
+      }
+      result.results[index].forEach(makeResult);
+      result.measurements[index].forEach(makeResult);
     };
 
     var t = document.getElementById("interop");
@@ -89,30 +94,6 @@
     }
   }
 
-  function fillMeasurementTable(result) {
-    var t = document.getElementById("measurements");
-    t.innerHTML = "";
-    makeColumnHeaders(t, result);
-    var tbody = t.createTBody();
-    var index = 0;
-    for(var i = 0; i < result.clients.length; i++) {
-      var row = makeRowHeader(tbody, result, i);
-      for(var j = 0; j < result.servers.length; j++) {
-        var res = result.measurements[index];
-        var cell = row.insertCell(j+1);
-        cell.className = "server-" + result.servers[j] + " client-" + result.clients[i];
-        for(var k = 0; k < res.length; k++) {
-          var measurement = res[k];
-          var link = getLogLink(result.log_dir, result.servers[j], result.clients[i], measurement.name, measurement.abbr, measurement.result);
-          if (measurement.result === "succeeded")
-              link.innerHTML += ": " + measurement.details;
-          cell.appendChild(link);
-        }
-        index++;
-      }
-    }
-  }
-
   function dateToString(date) {
     return date.toLocaleDateString("en-US",  { timeZone: 'UTC' }) + " " + date.toLocaleTimeString("en-US", { timeZone: 'UTC', timeZoneName: 'short' });
   }
@@ -223,7 +204,6 @@
       "<tt>" + result.quic_version + "</tt> (\"draft-" + result.quic_draft + "\")";
 
     fillInteropTable(result);
-    fillMeasurementTable(result);
 
     $("#client").add("#server").add("#test").empty();
     $("#client").append(result.clients.map(e => makeButton("client", e)));