1 files changed, 25 insertions, 19 deletions

diff --git a/static/script.js b/static/script.js
index 2516256..6a52d3e 100644
--- a/static/script.js
+++ b/static/script.js
@@ -156,39 +156,42 @@ function winGame(challenge) {
     document.getElementById('share').value = `I solved the ${date} Prosodyle at cyfraeviolae.org/prosodyle. My first guess was: "${firstguess}".`
 }
 
-document.addEventListener('keydown', function(e) {
-    // if (!Array.from(e.target.classList).includes('entrybox')) {
-    //     return;
-    // }
-    // if (e.ctrlKey || e.altKey || (e.key.length != 1 && e.key != 'Backspace')) {
-    //     return;
-    // }
-    if (e.ctrlKey || e.altKey || (!"ABCDEFGHIJKLMNOPQRSTUVWXYZ".includes(e.key.toUpperCase()) && e.key != 'Backspace' && e.key != 'Enter')) {
-        return;
-    }
-    if (e.target.id == 'share') {
-        return;
-    }
-    e.preventDefault();
-
-    if (e.key == 'Enter') {
+function keyHandler(key) {
+    if (key == 'Enter') {
         document.getElementById('check').click()
         return;
     }
     var el = document.querySelector(`[data-offset="${focused}"]`);
     var offset = parseInt(el.getAttribute('data-offset'))
     var nextel;
-    if (e.key == 'Backspace') {
+    if (key == 'Backspace') {
         el.innerText = '';
         nextel = document.querySelector(`[data-offset="${offset-1}"]`);
     } else {
-        el.innerText = e.key.toUpperCase();
+        el.innerText = key.toUpperCase();
         nextel = document.querySelector(`[data-offset="${offset+1}"]`);
     }
     if (nextel) {
         focus(nextel);
         unfocus(el);
     }
+}
+
+document.addEventListener('keydown', function(e) {
+    // if (!Array.from(e.target.classList).includes('entrybox')) {
+    //     return;
+    // }
+    // if (e.ctrlKey || e.altKey || (e.key.length != 1 && e.key != 'Backspace')) {
+    //     return;
+    // }
+    if (e.ctrlKey || e.altKey || (!"ABCDEFGHIJKLMNOPQRSTUVWXYZ".includes(e.key.toUpperCase()) && e.key != 'Backspace' && e.key != 'Enter')) {
+        return;
+    }
+    if (e.target.id == 'share') {
+        return;
+    }
+    e.preventDefault();
+    keyHandler(e.key)
 })
 
 document.addEventListener('mousedown', function(e) {
@@ -196,6 +199,10 @@ document.addEventListener('mousedown', function(e) {
         e.preventDefault();
         unfocus(document.querySelector(`[data-offset="${focused}"]`));
         focus(e.target);
+    } else if (Array.from(e.target.classList).includes('key')) {
+        e.preventDefault();
+        var k = e.target.innerText
+        keyHandler(k)
     }
 })
 
@@ -219,7 +226,6 @@ document.getElementById('copy').addEventListener('click', function(e) {
 function focus(el) {
     focused = parseInt(el.getAttribute('data-offset'))
     el.classList.add('focus')
-    document.getElementById('kb').focus()
 }
 
 function unfocus(el) {