1 files changed, 59 insertions, 4 deletions
diff --git a/index.html b/index.html
index b92ff0e..d3de991 100644
--- a/index.html
+++ b/index.html
@@ -3,13 +3,35 @@
 <body>
 <h1>wordle</h1>
 <table id="the_table">
-<tr id="row_1">
-</tr>
 </table>
+<p id="debug"></p>
 <script>
   let table = document.getElementById("the_table");
+  let row_count = 0;
+  let cursor_column = 1;
+  let puzzle = '';
+  createPuzzle = function() {
+    var request = new XMLHttpRequest();
+    request.onreadystatechange = function() {
+      if (this.readyState == 4 && this.status == 200) {
+        puzzle = JSON.parse(request.responseText).riddle;
+      }
+    }
+    request.open( "GET", "https://wordle-backend.eckner.net/create", true );
+    request.send();
+  }
+  addNewRow = function() {
+    row_count++;
+    the_table.innerHTML += "<tr id=\"row_" + row_count + "\"></td>";
+    for (let i = 1; i <= 5; i++) {
+      the_table
+        .querySelector("#row_" + row_count)
+        .innerHTML += "<td id=\"column_" + i + "\"></td>";
+    }
+  };
   onKeyDown = function(event){
-    let to_print = "";
+    let to_print = '';
+    let cursor_increment = 1;
     if (event.keyCode >= 65 && event.keyCode < 91) {
       to_print = String.fromCharCode(event.keyCode);
     } else if (event.keyCode == 59) {
@@ -20,11 +42,44 @@
       to_print = '&Uuml;';
     } else if (event.keyCode == 222) {
       to_print = '&Auml;';
+    } else if (event.keyCode == 8 ) {
+      if (cursor_column > 1) {
+        cursor_column--;
+      }
+      to_print = '&nbsp;';
+      cursor_increment = 0;
+    } else if (event.keyCode == 46 ) {
+      to_print = '&nbsp;';
+      cursor_increment = 0;
+    } else if (event.keyCode == 37 ) {
+      cursor_increment = -1;
+    } else if (event.keyCode == 39 ) {
+      cursor_increment = 1;
+    } else if (event.keyCode == 13 ) {
+      trial = 'abcdef';
+      var xmlHttp = new XMLHttpRequest();
+      xmlHttp.onreadystatechange = function() {
+        if (this.readyState == 4 && this.status == 200) {
+          document.getElementById('debug').innerHTML = xmlHttp.responseText;
+        }
+      }
+      xmlHttp.open( "GET", "https://wordle-backend.eckner.net/try/" + trial + '?riddle=' + puzzle, true );
+      xmlHttp.send( null );
+      cursor_increment = 0;
     } else {
       to_print = event.keyCode;
+      cursor_increment = 0;
     };
-    table.querySelector("#row_1").innerHTML = "<td>" + to_print + "</td><td>" + to_print + "</td><td>" + to_print + "</td><td>" + to_print + "</td><td>" + to_print + "</td>";
+    if (to_print !== '') {
+      table
+        .querySelector("#row_" + row_count)
+        .querySelector("#column_" + cursor_column)
+        .innerHTML = to_print;
+    }
+    cursor_column = Math.min(5,Math.max(0,cursor_column + cursor_increment));
   };
+  addNewRow();
+  createPuzzle();
   document.body.addEventListener("keydown", onKeyDown);
 </script>
 </body>