From 41e1b49bd78137fea3ea15ff27fa3d4514db1e2e Mon Sep 17 00:00:00 2001
From: Claude Brisson <claude@renegat.net>
Date: Tue, 30 Jan 2024 17:47:38 +0100
Subject: [PATCH] Filter results

---
 view-webapp/src/main/sass/main.scss           | 39 ++++++++++++++++
 view-webapp/src/main/sass/tour.scss           | 44 +++----------------
 .../src/main/webapp/js/tour-results.inc.js    |  8 ++++
 .../src/main/webapp/tour-results.inc.html     |  7 +++
 4 files changed, 60 insertions(+), 38 deletions(-)

diff --git a/view-webapp/src/main/sass/main.scss b/view-webapp/src/main/sass/main.scss
index cbb9c7f..78c0586 100644
--- a/view-webapp/src/main/sass/main.scss
+++ b/view-webapp/src/main/sass/main.scss
@@ -425,6 +425,45 @@
     color: darkgray;
   }
 
+  .toggle {
+    display: inline-block;
+    cursor: pointer;
+    text-align: center;
+    input {
+      display: none !important;
+    }
+    label {
+      display: inline-block;
+      text-align: center;
+      cursor: pointer;
+    }
+    .checkbox {
+      width: 50px;
+      height: 26px;
+      border-radius: 18px;
+      background-color: #F7D6A3;
+      display: inline-flex;
+      align-items: center;
+      padding-left: 5px;
+      padding-right: 5px;
+      cursor: pointer;
+      .circle {
+        background-color: #6B5E8A;
+        transform: translateX(0px);
+        border-radius: 50%;
+        width: 20px;
+        height: 20px;
+        transition: 300ms;
+      }
+    }
+    input:checked + .checkbox {
+      background-color: rgb(218, 114, 80);
+      .circle {
+        transform: translateX(20px);
+      }
+    }
+  }
+
   @media print {
 
     body {
diff --git a/view-webapp/src/main/sass/tour.scss b/view-webapp/src/main/sass/tour.scss
index b86da17..a7455b1 100644
--- a/view-webapp/src/main/sass/tour.scss
+++ b/view-webapp/src/main/sass/tour.scss
@@ -91,43 +91,6 @@
   }
   #search-form {
     position: relative;
-    .toggle {
-      cursor: pointer;
-      text-align: center;
-      input {
-        display: none;
-      }
-      label {
-        display: block;
-        text-align: center;
-        cursor: pointer;
-      }
-      .checkbox {
-        width: 50px;
-        height: 26px;
-        border-radius: 18px;
-        background-color: #F7D6A3;
-        display: inline-flex;
-        align-items: center;
-        padding-left: 5px;
-        padding-right: 5px;
-        cursor: pointer;
-        .circle {
-          background-color: #6B5E8A;
-          transform: translateX(0px);
-          border-radius: 50%;
-          width: 20px;
-          height: 20px;
-          transition: 300ms;
-        }
-      }
-      input:checked + .checkbox {
-        background-color: rgb(218, 114, 80);
-        .circle {
-          transform: translateX(20px);
-        }
-      }
-    }
   }
   #search-result {
     position: absolute;
@@ -310,7 +273,7 @@
   #results-list {
     text-align: center;
     .player, .result {
-      background-color: white;
+      background-color: unset;
       color: black;
       cursor: pointer;
       &:hover {
@@ -326,6 +289,11 @@
         font-style: italic;
       }
     }
+    #results-table {
+      tr.filtered {
+        display: none;
+      }
+    }
   }
 
   /* standings section */
diff --git a/view-webapp/src/main/webapp/js/tour-results.inc.js b/view-webapp/src/main/webapp/js/tour-results.inc.js
index 57109a1..ec1508d 100644
--- a/view-webapp/src/main/webapp/js/tour-results.inc.js
+++ b/view-webapp/src/main/webapp/js/tour-results.inc.js
@@ -53,4 +53,12 @@ onLoad(()=>{
     let newResult = results[(index + 1)%results.length];
     setResult(gameId, newResult, oldResult);
   });
+  $('#filter').on('click', e=>{
+    let filter = $('#filter-results')[0].checked;
+    if (filter) {
+      $('#results-table tr').filter(':not(:has(td.result[data-result="?"]))').addClass('filtered');
+    } else {
+      $('#results-table tr').removeClass('filtered');
+    }
+  });
 });
diff --git a/view-webapp/src/main/webapp/tour-results.inc.html b/view-webapp/src/main/webapp/tour-results.inc.html
index 1b7e480..569796d 100644
--- a/view-webapp/src/main/webapp/tour-results.inc.html
+++ b/view-webapp/src/main/webapp/tour-results.inc.html
@@ -6,6 +6,13 @@
     <button class="ui floating choose-round next-round button">&raquo;</button>
 #set($stats = $utils.getResultsStats($games))
     <span class="norbeak">( <span id="known">$stats.known</span> / $stats.total )</span>
+    <div id="filter" class="toggle">
+      <input id="filter-results" type="checkbox" value="true"/>
+      <div class="filter-results checkbox">
+        <div class="circle"></div>
+      </div>
+      <label>Filter</label>
+    </div>
   </div>
   <div id="results-list" class="roundbox">
     <table id="results-table" class="ui celled striped table">