From 6a01f7c3a43f4ae98cbf352c696957ab336790ff Mon Sep 17 00:00:00 2001
From: TamirCohen <tamir@tamirc.com>
Date: Sun, 13 Mar 2022 00:23:31 +0200
Subject: [PATCH 1/2] Added progress view button

---
 static/index.html     |  3 ++-
 static/js/semantle.js | 54 +++++++++++++++++++++++++++++++++++--------
 2 files changed, 47 insertions(+), 10 deletions(-)

diff --git a/static/index.html b/static/index.html
index 8c2c16c..92f3984 100644
--- a/static/index.html
+++ b/static/index.html
@@ -56,7 +56,8 @@ <h1>סמנטעל</h1>
     <input placeholder="ניחוש" autocorrect="off" autocapitalize="none"
            autocomplete="off"
            type="search" id="guess">
-    <input type="submit" value="ניחוש" id="guess-btn">
+           <input type="submit" value="ניחוש" id="guess-btn">
+           <input type="submit" value="התקדמות" id="progress-button">
 <!--    <input type="button" value="נמאס לי" id="give-up-btn">-->
     </div>
     </form>
diff --git a/static/js/semantle.js b/static/js/semantle.js
index 88302ec..279804f 100644
--- a/static/js/semantle.js
+++ b/static/js/semantle.js
@@ -61,6 +61,8 @@ let Semantle = (function() {
     let guessed = new Set();
     let firstGuess = true;
     let guesses = [];
+    let guessesByID = [];
+    let progress_view = false;
     let guessCount = 0;
     let gameOver = false;
     const handleStats = false;
@@ -184,14 +186,14 @@ let Semantle = (function() {
         $("#settings-close")[0].focus();
     }
 
-    function updateGuesses(guess) {
-        let inner = `<tr>
-        <th>#</th>
-        <th>ניחוש</th>
-        <th>קרבה</th>
-        <th>מתחמם?</th></tr>`;
-        /* This is dumb: first we find the most-recent word, and put
-           it at the top.  Then we do the rest. */
+    function toggleProgressView(value) {
+        progress_view = !progress_view
+        updateGuesses()
+    }
+    
+    function showGuesses(){
+        let inner = ''
+        let guess = guesses[guesses.length - 1][1]
         for (let entry of guesses) {
             let [similarity, oldGuess, guessNumber, percentile, egg] = entry;
             if (oldGuess == guess) {
@@ -205,6 +207,38 @@ let Semantle = (function() {
                 inner += guessRow(similarity, oldGuess, percentile, guessNumber, guess, egg);
             }
         }
+        return inner
+    }
+    
+    function showProgress(){
+        
+        let highest_simlirity = Number.MIN_SAFE_INTEGER
+        let inner = ''
+        for (let entry of guessesByID) {
+            let [similarity, oldGuess, guessNumber, percentile, egg] = entry;
+            if (similarity < highest_simlirity) {
+                continue
+            }
+            highest_simlirity = similarity
+            inner += guessRow(similarity, oldGuess, percentile, guessNumber, guess, egg);
+        }
+        return inner
+    }
+
+    function updateGuesses() {
+        let inner = `<tr>
+        <th>#</th>
+        <th>ניחוש</th>
+        <th>קרבה</th>
+        <th>מתחמם?</th></tr>`;
+        if (!progress_view){
+            inner += showGuesses()
+        }
+        else{
+            inner += showProgress()
+        }
+        /* This is dumb: first we find the most-recent word, and put
+           it at the top.  Then we do the rest. */
         $('#guesses')[0].innerHTML = inner;
     }
 
@@ -224,6 +258,7 @@ let Semantle = (function() {
 
         $("#rules-button")[0].addEventListener('click', openRules);
         $("#settings-button")[0].addEventListener('click', openSettings);
+        $("#progress-button")[0].addEventListener('click', toggleProgressView);
 
         [$("#rules-underlay"), $("#rules-close")].forEach((el) => {
             el[0].addEventListener('click', () => {
@@ -301,6 +336,7 @@ let Semantle = (function() {
 
                 const newEntry = [similarity, guess, guessCount, distance, egg];
                 guesses.push(newEntry);
+                guessesByID.push(newEntry);
                 if (distance == 1000){
                     endGame(true, true);
                 }
@@ -311,7 +347,7 @@ let Semantle = (function() {
             }
 
 
-            updateGuesses(guess);
+            updateGuesses();
 
             firstGuess = false;
 //            if (guess.toLowerCase() === secret && !gameOver) {

From 63d05c109a9fab553847c8315830bd1cb5543b74 Mon Sep 17 00:00:00 2001
From: TamirCohen <tamir@tamirc.com>
Date: Mon, 14 Mar 2022 23:19:57 +0200
Subject: [PATCH 2/2] 1. Added button as sort button 2. Fixed display bug

---
 static/index.html     |  3 ++-
 static/js/semantle.js | 36 +++++++++++++++++++++++-------------
 2 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/static/index.html b/static/index.html
index 92f3984..d5236a7 100644
--- a/static/index.html
+++ b/static/index.html
@@ -5,6 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
     <title>סמנטעל</title>
     <link rel="stylesheet" href="css/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 
 <!-- Global site tag (gtag.js) - Google Analytics -->
 <script async src="https://www.googletagmanager.com/gtag/js?id=G-PP8J7V4T0X"></script>
@@ -57,7 +58,7 @@ <h1>סמנטעל</h1>
            autocomplete="off"
            type="search" id="guess">
            <input type="submit" value="ניחוש" id="guess-btn">
-           <input type="submit" value="התקדמות" id="progress-button">
+
 <!--    <input type="button" value="נמאס לי" id="give-up-btn">-->
     </div>
     </form>
diff --git a/static/js/semantle.js b/static/js/semantle.js
index 279804f..56c8ff0 100644
--- a/static/js/semantle.js
+++ b/static/js/semantle.js
@@ -186,14 +186,20 @@ let Semantle = (function() {
         $("#settings-close")[0].focus();
     }
 
-    function toggleProgressView(value) {
-        progress_view = !progress_view
-        updateGuesses()
+    function toggleProgressView(event) {
+        var element = event.target;
+        if (element.className.includes("progress-button")){
+            progress_view = !progress_view
+            updateGuesses()
+        }
     }
     
     function showGuesses(){
         let inner = ''
-        let guess = guesses[guesses.length - 1][1]
+        if (guessesByID.length == 0){
+            return inner;
+        }
+        let guess = guessesByID[guessesByID.length - 1][1]
         for (let entry of guesses) {
             let [similarity, oldGuess, guessNumber, percentile, egg] = entry;
             if (oldGuess == guess) {
@@ -211,34 +217,37 @@ let Semantle = (function() {
     }
     
     function showProgress(){
-        
         let highest_simlirity = Number.MIN_SAFE_INTEGER
-        let inner = ''
+        let gusses = [];
         for (let entry of guessesByID) {
             let [similarity, oldGuess, guessNumber, percentile, egg] = entry;
             if (similarity < highest_simlirity) {
                 continue
             }
             highest_simlirity = similarity
-            inner += guessRow(similarity, oldGuess, percentile, guessNumber, guess, egg);
+            gusses.push(guessRow(similarity, oldGuess, percentile, guessNumber, guess, egg));
         }
-        return inner
+        return gusses.reverse().join("")
     }
 
     function updateGuesses() {
-        let inner = `<tr>
+        let header = `<tr>
         <th>#</th>
         <th>ניחוש</th>
         <th>קרבה</th>
-        <th>מתחמם?</th></tr>`;
+        <th>מתחמם?</th>
+        <th><button class="btn progress-button"><i class="fa fa-sort progress-button"></i></button></th>
+        </tr>`;
+        let inner = '';
         if (!progress_view){
             inner += showGuesses()
         }
         else{
             inner += showProgress()
         }
-        /* This is dumb: first we find the most-recent word, and put
-           it at the top.  Then we do the rest. */
+        if (inner != ''){
+            inner = header + inner;
+        }
         $('#guesses')[0].innerHTML = inner;
     }
 
@@ -258,7 +267,8 @@ let Semantle = (function() {
 
         $("#rules-button")[0].addEventListener('click', openRules);
         $("#settings-button")[0].addEventListener('click', openSettings);
-        $("#progress-button")[0].addEventListener('click', toggleProgressView);
+        $("#guesses")[0].addEventListener('click', toggleProgressView);
+        
 
         [$("#rules-underlay"), $("#rules-close")].forEach((el) => {
             el[0].addEventListener('click', () => {