Factor common Editor{Group,Link} code out into EditorSublistBase
This commit is contained in:
@@ -227,6 +227,7 @@ class Editor extends List {
|
||||
|
||||
<!--# include file="EditorEntryBase.js" -->
|
||||
<!--# include file="EditorInputBase.js" -->
|
||||
<!--# include file="EditorSublistBase.js" -->
|
||||
<!--# include file="EditorGroup.js" -->
|
||||
<!--# include file="EditorHelp.js" -->
|
||||
<!--# include file="EditorLabel.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
|
||||
|
||||
@@ -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();
|
||||
|
||||
60
EditorSublistBase.js
Normal file
60
EditorSublistBase.js
Normal file
@@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user