Save selection to allow replay during undo

Architype.js

@@ -45,7 +45,6 @@ class Architype {
     if (this.editor_.getEntries().length == 0) {
       this.editor_.addHelpAfter();
     }
-    this.editor_.selectNext();
 
     this.observer_ = new MutationObserver(e => { this.onChange(e); });
     this.observer2_ = new MutationObserver(e => { this.snapshot(e); });
@@ -77,12 +76,22 @@ class Architype {
   }
 
   serialize() {
-    // TODO: include selected element info
+    let selected = null;
+    let iter = document.activeElement;
+    while (iter) {
+      if (iter.xArchObj && iter.id) {
+        selected = iter.id;
+        break;
+      }
+      iter = iter.parentElement;
+    }
+
     return {
       version: 1,
       generation: this.generation_,
       nextId: idSource.peekId(),
       editor: this.editor_.serialize(),
+      selected: selected,
     };
   }
 
@@ -99,6 +108,14 @@ class Architype {
         this.generation_ = ser.generation;
         idSource.setId(ser.nextId);
         this.editor_.unserialize(ser.editor);
+        if (ser.selected) {
+          let elem = document.getElementById(ser.selected);
+          if (elem) {
+            elem.focus();
+          }
+        } else {
+          this.editor_.selectNext();
+        }
         break;
 
       default:
@@ -112,7 +129,6 @@ class Architype {
     this.editor_.clear();
     this.unserialize(ser);
     this.observe();
-    this.editor_.selectNext();
     this.saveAndRender();
   }
 

EditorEntryBase.js

@@ -1,12 +1,12 @@
 <!--# include file="ListenUtils.js" -->
 
 class EditorEntryBase extends ListenUtils {
-  constructor() {
+  constructor(id) {
     super();
 
     this.elem_ = document.createElement('li');
     this.elem_.tabIndex = 0;
-    this.elem_.id = 'entry' + idSource.getId();
+    this.elem_.id = (id || ('entry' + idSource.getId()));
     this.listen(this.elem_, 'focus', () => this.onElemFocus());
     this.listen(this.elem_, 'keydown', (e) => this.onKeyDown(e));
 

EditorGroup.js

@@ -1,6 +1,6 @@
 class EditorGroup extends EditorEntryBase {
-  constructor(entries) {
-    super();
+  constructor(id, entries) {
+    super(id);
 
     this.elem_.innerText = '□';
     this.elem_.classList.add('group');
@@ -83,7 +83,7 @@ class EditorGroup extends EditorEntryBase {
   }
 
   static unserialize(ser) {
-    let group = new EditorGroup();
+    let group = new EditorGroup(ser.id);
     group.nodes_.clear();
     if (ser.label != null) {
       group.setLabel(ser.label);

EditorHelp.js

@@ -1,6 +1,6 @@
 class EditorHelp extends EditorEntryBase {
-  constructor() {
-    super();
+  constructor(id) {
+    super(id);
 
     this.elem_.classList.add('help');
 
@@ -93,11 +93,12 @@ class EditorHelp extends EditorEntryBase {
   serialize() {
     return {
       type: 'help',
+      id: this.getId(),
     };
   }
 
   static unserialize(ser) {
-    return (new EditorHelp()).getElement();
+    return (new EditorHelp(ser.id)).getElement();
   }
 }
 

EditorLabel.js

@@ -1,7 +1,7 @@
 // TODO: Factor out common code with EditorNode
 class EditorLabel extends EditorEntryBase {
-  constructor() {
-    super();
+  constructor(id) {
+    super(id);
 
     this.elem_.classList.add('label');
 
@@ -23,6 +23,7 @@ class EditorLabel extends EditorEntryBase {
   serialize() {
     return {
       type: 'label',
+      id: this.getId(),
       label: this.getLabel(),
     };
   }
@@ -113,7 +114,7 @@ class EditorLabel extends EditorEntryBase {
   }
 
   static unserialize(ser) {
-    let label = new EditorLabel();
+    let label = new EditorLabel(ser.id);
     label.setLabel(ser.label);
     return label.getElement();
   }

EditorLink.js

@@ -1,6 +1,6 @@
 class EditorLink extends EditorEntryBase {
-  constructor(entries) {
-    super();
+  constructor(id, entries) {
+    super(id);
 
     this.elem_.innerText = '↓';
     this.elem_.classList.add('link');
@@ -107,7 +107,7 @@ class EditorLink extends EditorEntryBase {
   }
 
   static unserialize(ser) {
-    let link = new EditorLink();
+    let link = new EditorLink(ser.id);
     link.nodes_.clear();
     if (ser.label != null) {
       link.setLabel(ser.label);

EditorNode.js

@@ -1,6 +1,6 @@
 class EditorNode extends EditorEntryBase {
-  constructor(label) {
-    super();
+  constructor(id, label) {
+    super(id);
 
     this.elem_.classList.add('node');
 
@@ -134,7 +134,7 @@ class EditorNode extends EditorEntryBase {
   }
 
   static unserialize(ser) {
-    let node = new EditorNode();
+    let node = new EditorNode(ser.id);
     node.setLabel(ser.label);
     node.setHighlight(ser.highlight);
     return node.getElement();