From 6cf98e2da831bcbbe8b834645bf444a0650c09e6 Mon Sep 17 00:00:00 2001
From: JonOfUs <jonofus@flueren.eu>
Date: Tue, 14 Feb 2023 19:57:29 +0100
Subject: [PATCH] Also show accuracy, center cells

---
 index.html | 44 ++++++++++++++++++++++++++++++--------------
 1 file changed, 30 insertions(+), 14 deletions(-)

diff --git a/index.html b/index.html
index 164e5dc..8553b4c 100644
--- a/index.html
+++ b/index.html
@@ -19,7 +19,7 @@
     th,
     td {
       padding: 12px;
-      text-align: left;
+      text-align: center;
       border-bottom: 1px solid #ddd;
     }
 
@@ -37,8 +37,8 @@
       <tr>
         <th>Name</th>
         <th>Added At</th>
-        <th>Completed Tests</th>
-        <th>Started Tests</th>
+        <th>Completed tests</th>
+        <th>Started tests</th>
         <th>Time Typing</th>
         <th>Best 15s</th>
         <th>Best 30s</th>
@@ -56,9 +56,9 @@
   <script>
 
     const users = (new URLSearchParams(window.location.search)).get('users');
-    
+
     // no users passed => ask for them and reload
-    if(users==null || users=='') { 
+    if (users == null || users == '') {
       var names = prompt('Please provide user names, delimited by \',\'');
       window.location.replace(location.protocol + '//' + location.host + location.pathname + '?users=' + names);
     }
@@ -75,18 +75,34 @@
           const { completedTests, startedTests, timeTyping } = typingStats;
           const { time, words } = personalBests;
 
+          function maxReducer({ prev_wpm, prev_acc }, { current_wpm, current_acc }) {
+            return (prev_wpm > current_wpm) ? { prev_wpm, prev_acc } : { current_wpm, current_acc }
+          }
+
+          function getMaxWpmAcc(stats) {
+            var max_acc = 0.0; var max_wpm = 0.0;
+            for ({ wpm, acc } of stats) {
+              if (wpm > max_wpm) {
+                max_wpm = wpm;
+                max_acc = acc;
+              }
+            }
+            return max_wpm + ' | ' + max_acc + '%';
+          }
+
+          const best15s = getMaxWpmAcc(time['15']);
+
           function maxReducer(prev, current) {
             return (prev > current) ? prev : current
           }
 
-          const best15s = time['15'].map(({ wpm }) => wpm).reduce((p, c) => maxReducer(p, c));
-          const best30s = time['30'].map(({ wpm }) => wpm).reduce((p, c) => maxReducer(p, c));
-          const best60s = time['60'].map(({ wpm }) => wpm).reduce((p, c) => maxReducer(p, c));
-          const best120s = time['120'].map(({ wpm }) => wpm).reduce((p, c) => maxReducer(p, c));
-          const best10w = words['10'].map(({ wpm }) => wpm).reduce((p, c) => maxReducer(p, c));
-          const best25w = words['25'].map(({ wpm }) => wpm).reduce((p, c) => maxReducer(p, c));
-          const best50w = words['50'].map(({ wpm }) => wpm).reduce((p, c) => maxReducer(p, c));
-          const best100w = words['100'].map(({ wpm }) => wpm).reduce((p, c) => maxReducer(p, c));
+          const best30s = getMaxWpmAcc(time['30']);
+          const best60s = getMaxWpmAcc(time['60']);
+          const best120s = getMaxWpmAcc(time['120']);
+          const best10w = getMaxWpmAcc(words['10']);
+          const best25w = getMaxWpmAcc(words['25']);
+          const best50w = getMaxWpmAcc(words['50']);
+          const best100w = getMaxWpmAcc(words['100']);
 
           const row = `
             <tr>
@@ -94,7 +110,7 @@
               <td>${new Date(addedAt).toLocaleDateString()}</td>
               <td>${completedTests}</td>
               <td>${startedTests}</td>
-              <td>${timeTyping.toFixed(2)}</td>
+              <td>${new Date(timeTyping * 1000).toISOString().substr(11, 8)}</td>
               <td>${best15s}</td>
               <td>${best30s}</td>
               <td>${best60s}</td>