From bc990c48d90b5a050c4d070de98b4fc4cd55133f Mon Sep 17 00:00:00 2001
From: Ian Gulliver <ian@flamingcow.tv>
Date: Wed, 10 Jul 2019 20:21:46 +0000
Subject: [PATCH] Always move key events back to the editor

---
 Architype.js | 23 +++++++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/Architype.js b/Architype.js
index 3bb603f..025f6cb 100644
--- a/Architype.js
+++ b/Architype.js
@@ -9,10 +9,13 @@ class Architype {
     this.container_.classList.add('dark');
 
     addEventListener('resize', (e) => { this.onResize(e); });
+    document.addEventListener('keydown',
+                              (e) => { this.onKeyDown(e); },
+                              { capture: true });
 
-    let editorElem = document.createElement('ul');
-    this.container_.appendChild(editorElem);
-    this.editor_ = new Editor(editorElem);
+    this.editorElem_ = document.createElement('ul');
+    this.container_.appendChild(this.editorElem_);
+    this.editor_ = new Editor(this.editorElem_);
 
     this.grid_ = document.createElement('div');
     this.grid_.classList.add('grid');
@@ -30,9 +33,10 @@ class Architype {
     }
 
     this.unserialize(JSON.parse(localStorage.getItem('currentState')));
+    this.editor_.selectNext();
 
     this.observer_ = new MutationObserver(e => { this.onChange(e); });
-    this.observer_.observe(editorElem, {
+    this.observer_.observe(this.editorElem_, {
       attributes: true,
       attributeFilter: ['data-arch-value'],
       childList: true,
@@ -73,6 +77,17 @@ class Architype {
     localStorage.setItem('currentState', JSON.stringify(this.serialized_));
   }
 
+  onKeyDown(e) {
+    let elem = document.activeElement;
+    while (elem) {
+      if (elem == this.editorElem_) {
+        return;
+      }
+      elem = elem.parentElement;
+    }
+    this.editor_.onKeyDown(e);
+  }
+
   onRender(e) {
     this.render_.push(e.target);