diff --git a/Editor.js b/Editor.js index 624416c..48e7a8f 100644 --- a/Editor.js +++ b/Editor.js @@ -227,6 +227,7 @@ class Editor extends List { + diff --git a/EditorGroup.js b/EditorGroup.js index ed8f5d8..682f90c 100644 --- a/EditorGroup.js +++ b/EditorGroup.js @@ -1,15 +1,10 @@ -class EditorGroup extends EditorEntryBase { +class EditorGroup extends EditorSublistBase { constructor(id, entries) { - super(id); - - this.elem_.innerText = '□'; - this.elem_.classList.add('group'); - - let nodeList = document.createElement('div'); - this.nodes_ = new Editor(nodeList, [ + super(id, '□', 'group', [ [EditorNode, [1, Number.POSITIVE_INFINITY]], [EditorLabel, [0, 1]], ]); + if (entries && entries.length) { for (let entry of entries) { this.nodes_.addNodeAfter(entry.getLabel()); @@ -17,22 +12,11 @@ class EditorGroup extends EditorEntryBase { } else { this.nodes_.addNodeAfter(); } - this.elem_.appendChild(nodeList); - } - - afterDomAdd() { - this.nodes_.selectNext(); - let node = this.nodes_.getSelected().xArchObj; - if (node.getLabel() == '') { - node.startEdit(); - } } serialize() { return super.serialize({ type: 'group', - label: this.getLabel(), - labelObj: this.getLabelObj() ? this.getLabelObj().serialize() : null, members: this.nodes_.serialize(EditorNode), }); } @@ -41,39 +25,6 @@ class EditorGroup extends EditorEntryBase { return this.nodes_.getEntries(EditorNode); } - getLabel() { - let label = this.getLabelObj(); - return label ? label.getLabel() : null; - } - - setLabel(label, labelId) { - let obj = this.nodes_.getEntries(EditorLabel)[0]; - if (obj) { - obj.setLabel(label); - } else { - this.nodes_.addLabelBefore(labelId); - this.setLabel(label); - } - } - - getLabelObj() { - return this.nodes_.getEntries(EditorLabel)[0]; - } - - onKeyDown(e) { - super.onKeyDown(e); - - switch (e.key) { - case 'Enter': - case 'ArrowRight': - case 'l': - this.nodes_.selectNext(); - e.stopPropagation(); - e.preventDefault(); - break; - } - } - static unserialize(ser) { //// Backwards compat // 3bdb240 diff --git a/EditorLink.js b/EditorLink.js index 10b892c..435e7ce 100644 --- a/EditorLink.js +++ b/EditorLink.js @@ -1,36 +1,19 @@ -class EditorLink extends EditorEntryBase { +class EditorLink extends EditorSublistBase { constructor(id, entries) { - super(id); - - this.elem_.innerText = '↓'; - this.elem_.classList.add('link'); - - let nodeList = document.createElement('div'); - this.nodes_ = new Editor(nodeList, [ + super(id, '↓', 'link', [ [EditorNode, [2, 2]], [EditorLabel, [0, 1]], ]); + this.nodes_.addNodeAfter( entries && entries[0] ? entries[0].getLabel() : null); this.nodes_.addNodeAfter( entries && entries[1] ? entries[1].getLabel() : null); - this.elem_.appendChild(nodeList); } - afterDomAdd() { - this.nodes_.selectNext(); - let node = this.nodes_.getSelected().xArchObj; - if (node.getLabel() == '') { - node.startEdit(); - } - } - - // TODO: factor out common base code with EditorGroup serialize() { return super.serialize({ type: 'link', - label: this.getLabel(), - labelObj: this.getLabelObj() ? this.getLabelObj().serialize() : null, from: this.getFrom().serialize(), to: this.getTo().serialize(), }); @@ -44,25 +27,6 @@ class EditorLink extends EditorEntryBase { return this.nodes_.getEntries(EditorNode)[1]; } - getLabel() { - let label = this.getLabelObj(); - return label ? label.getLabel() : null; - } - - setLabel(label, labelId) { - let obj = this.getLabelObj(); - if (obj) { - obj.setLabel(label); - } else { - this.nodes_.addLabelBefore(labelId); - this.setLabel(label); - } - } - - getLabelObj() { - return this.nodes_.getEntries(EditorLabel)[0]; - } - flip() { let entries = this.nodes_.getEntries(EditorNode); let fromElem = entries[0].getElement(); @@ -83,14 +47,6 @@ class EditorLink extends EditorEntryBase { super.onKeyDown(e); switch (e.key) { - case 'Enter': - case 'ArrowRight': - case 'l': - this.nodes_.selectNext(); - e.stopPropagation(); - e.preventDefault(); - break; - case 'f': this.flip(); e.stopPropagation(); diff --git a/EditorSublistBase.js b/EditorSublistBase.js new file mode 100644 index 0000000..45c27e9 --- /dev/null +++ b/EditorSublistBase.js @@ -0,0 +1,60 @@ +class EditorSublistBase extends EditorEntryBase { + constructor(id, icon, cls, limits) { + super(id); + + this.elem_.innerText = icon; + this.elem_.classList.add(cls); + + let nodeList = document.createElement('div'); + this.nodes_ = new Editor(nodeList, limits); + this.elem_.appendChild(nodeList); + } + + afterDomAdd() { + this.nodes_.selectNext(); + let node = this.nodes_.getSelected().xArchObj; + if (node.getLabel() == '') { + node.startEdit(); + } + } + + serialize(base) { + super.serialize(base); + base.label = this.getLabel(); + base.labelObj = this.getLabelObj() ? this.getLabelObj().serialize() : null; + return base; + } + + getLabel() { + let label = this.getLabelObj(); + return label ? label.getLabel() : null; + } + + setLabel(label, labelId) { + let obj = this.nodes_.getEntries(EditorLabel)[0]; + if (obj) { + obj.setLabel(label); + } else { + this.nodes_.addLabelBefore(labelId); + this.setLabel(label); + } + } + + getLabelObj() { + return this.nodes_.getEntries(EditorLabel)[0]; + } + + onKeyDown(e) { + super.onKeyDown(e); + + switch (e.key) { + case 'Enter': + case 'ArrowRight': + case 'l': + this.nodes_.selectNext(); + e.stopPropagation(); + e.preventDefault(); + break; + } + } +}