Add a tournament overview dialog

view-webapp/src/main/sass/main.scss

@@ -532,11 +532,12 @@
     }
 
     #title {
+      position: relative;
       font-size: 1rem !important;
       margin-top: 0.1em !important;
     }
 
-    #logo, #lang, .steps, #filter-box, #reglist-mode, #footer, #unpairables, #pairing-buttons, button, #standings-params, #logout, .pairing-stats, .result-sheets, .toggle {
+    #logo, #lang, .steps, #filter-box, #reglist-mode, #footer, #unpairables, #pairing-buttons, button, #standings-params, #logout, .pairing-stats, .result-sheets, .toggle, #overview {
       display: none !important;
     }
 

view-webapp/src/main/sass/tour.scss

@@ -16,6 +16,29 @@
     font-weight: bold;
   }
 
+  #overview {
+    position: absolute;
+    top: 0.2em;
+    right: 0.5em;
+    z-index: 2;
+    button {
+      line-height: 0.6em;
+    }
+    transform: scale(0.65);
+  }
+
+  #tournament-overview table {
+    table-layout: fixed;
+    text-align: center;
+    border-collapse: collapse;
+    th, td {
+      border: solid 1px gray;
+    }
+    th {
+      padding: 0 0.5em;
+    }
+  }
+
   /* information section */
 
   form {

view-webapp/src/main/webapp/js/tour-results.inc.js

@@ -24,10 +24,18 @@ function setResult(id, result, previous) {
           let indicator = $('#known')[0];
           let known = parseInt(indicator.innerText);
           indicator.innerText = ++known;
+          // and again for overview
+          indicator = $('#known2')[0];
+          known = parseInt(indicator.innerText);
+          indicator.innerText = ++known;
         } else if (result === '?') {
           let indicator = $('#known')[0];
           let known = parseInt(indicator.innerText);
           indicator.innerText = --known;
+          // and again for overview
+          indicator = $('#known2')[0];
+          known = parseInt(indicator.innerText);
+          indicator.innerText = --known;
         }
       }
     })

view-webapp/src/main/webapp/tour.html

@@ -32,6 +32,7 @@
 #if($tour)
   <h1 id="title">
     $esc.html($tour.name)
+    <div id="overview"><button class="ui mini green circular icon floating button"><i class="ui small info icon"></i></button></div>
   </h1>
 #end
 #translate('tour-information.inc.html')
@@ -153,6 +154,9 @@
         }
       });
     }
+    $('#overview').on('click', () => {
+      modal('tournament-overview')
+    });
   });
   // ]]#
 #include('/js/tour-information.inc.js')
@@ -174,3 +178,38 @@
         vertical-align: initial;
     }
 </style>
+#if($tour)
+<div id="tournament-overview" class="popup">
+  <div class="popup-body">
+    <div class="popup-content">
+      <table>
+        <thead>
+          <tr>
+            <th>Round</th>
+            <th>Participants</th>
+            <th>Paired</th>
+            <th>Results</th>
+          </tr>
+        </thead>
+        <tbody>
+  #foreach($r in [1..$tour.rounds])
+    #set($stats = $tour.stats[$r - 1])
+          <tr>
+            <td>$r</td>
+            <td>$stats.participants</td>
+            <td>$stats.paired</td>
+            <td>#if($round == $r)<span id="known2">#end$stats.ready#if($round == $r)</span>#end/$stats.games</td>
+          </tr>
+  #end
+        </tbody>
+      </table>
+    </div>
+    <div class="popup-footer">
+      <button type="button" class="ui gray right labeled icon floating close button">
+        <i class="times icon"></i>
+        Close
+      </button>
+    </div>
+  </div>
+</div>
+#end