From f607bf64e1560ffcd2175e9f67aaffe38d332c3f Mon Sep 17 00:00:00 2001
From: Laurent Mazet <mazet@softndesign.org>
Date: Sat, 20 Jun 2020 00:32:18 +0200
Subject: [PATCH] highlight in green or red checked words

---
 public/trivabble.css |  8 ++++++++
 public/trivabble.js  | 42 ++++++++++++++++++++++++++++++------------
 2 files changed, 38 insertions(+), 12 deletions(-)

diff --git a/public/trivabble.css b/public/trivabble.css
index 9362160..a303c47 100644
--- a/public/trivabble.css
+++ b/public/trivabble.css
@@ -197,6 +197,14 @@ button[disabled=disabled], button:disabled {
     cursor:pointer
 }
 
+.tile.tile-spelling-ok {
+    background-color: #3E3;
+}
+
+.tile.tile-spelling-nok {
+    background-color: #E33;
+}
+
 .tile.tile-highlight {
     background-color: #FFF;
     font-weight: bold;
diff --git a/public/trivabble.js b/public/trivabble.js
index 0e3e123..a4bf6ba 100644
--- a/public/trivabble.js
+++ b/public/trivabble.js
@@ -1519,14 +1519,14 @@
         }
 
         /* Look for last letter in line */
-        let word = "";
+        let word = {letters: "", row: row, col: col, incRow: incRow, incCol: incCol};
         let letter;
         while ((letter = getLetterFromBoard(row, col)) !== "") {
-            word += letter;
+            word.letters += letter;
             row += incRow;
             col += incCol;
         }
-        return (word === initLetter) ? "" : word;
+        return (word.letters === initLetter) ? null : word;
     }
     
     function searchNewWords() {
@@ -1540,38 +1540,56 @@
 
             /* Look for word in column */
             const newWordInCol = searchWordInLine(row, col, 1, 0);
-            if ((newWordInCol !== "") &&  (!words.includes(newWordInCol))) {
+            if ((newWordInCol !== null) &&  (!words.find(element => element.letters === newWordInCol.letters))) {
                 words.push(newWordInCol);
             }
 
             /* Look for word in row */
             const newWordInRow = searchWordInLine(row, col, 0, 1);
-            if ((newWordInRow !== "") &&  (!words.includes(newWordInRow))) {
+            if ((newWordInRow !== null) &&  (!words.find(element => element.letters === newWordInCol.letters))) {
                 words.push(newWordInRow);
             }
 
             /* Should we look for word in diag? */
 
             /* If nothing found, it's a one letter word */
-            if ((newWordInCol === "") && (newWordInRow === "")) {
-                words.push(getLetterFromBoard(row, col));
+            if ((newWordInCol === null) && (newWordInRow === null)) {
+                words.push({letters: getLetterFromBoard(row, col), row: row, col: col, incRow: 0, incCol: 0});
             }
         }
 
         return words;
     }
 
+    function highlightWord(word, value, onOff) {
+        for (let l = 0; l < word.letters.length; l++) {
+            const index = ((word.row + l * word.incRow) * 15) + word.col + l * word.incCol;
+            const tilePlaceholder = boardCells[index].getElementsByClassName("tile-placeholder")[0];
+            const tile = tilePlaceholder.getElementsByClassName("tile")[0];
+            if (onOff) {
+                tile.classList.add(value);
+            } else {
+                tile.classList.remove(value);
+            }
+        }
+    }
+
     function checkSpelling() {
 
-        let words = searchNewWords();
+        let newWords = searchNewWords();
 
         /* Check if words are in dictionary */
+        let words = [];
         let badWords = [];
-        for (const k of Object.keys(words)) {
-            const pattern = "^" + words[k].replace(/ /g, ".") + "$";
-            words[k] = words[k].replace(/ /g, "?");
+        for (const k of Object.keys(newWords)) {
+            words.push(newWords[k].letters.replace(/ /g, "?"));
+            highlightWord(newWords[k], "tile-spelling-ok", true);
+            setTimeout(function () {highlightWord(newWords[k], "tile-spelling-ok", false);}, 5000);
+            const pattern = "^" + newWords[k].letters.replace(/ /g, ".") + "$";
             if (!dictionary.find(element => element.match(pattern))) {
-                badWords.push(words[k]);
+                badWords.push(newWords[k]);
+                highlightWord(newWords[k], "tile-spelling-nok", true);
+                setTimeout(function () {highlightWord(newWords[k], "tile-spelling-nok", false);}, 5000);
             }
         }
         words = words.join(", ")
-- 
2.30.2