diff --git a/forum-network/src/classes/supporting/edge.js b/forum-network/src/classes/supporting/edge.js
index 83550a5..79391a5 100644
--- a/forum-network/src/classes/supporting/edge.js
+++ b/forum-network/src/classes/supporting/edge.js
@@ -62,7 +62,6 @@ export class Edge {
}
static prepareEditorDocument(graph, doc, from, to) {
- doc.clear();
const form = doc.form({ name: 'editorForm' }).lastElement;
doc.remark('
Edit Edge
', { parentEl: form.el });
form
diff --git a/forum-network/src/classes/supporting/vertex.js b/forum-network/src/classes/supporting/vertex.js
index 3ca1779..d02d4b8 100644
--- a/forum-network/src/classes/supporting/vertex.js
+++ b/forum-network/src/classes/supporting/vertex.js
@@ -1,5 +1,7 @@
import { displayNumber } from '../../util/helpers.js';
+import { Edge } from './edge.js';
+
export class Vertex {
constructor(graph, type, id, data, options = {}) {
this.graph = graph;
@@ -88,38 +90,58 @@ export class Vertex {
id: 'add',
name: 'Add Property',
cb: () => addPropertyForm('', ''),
- })
- .button({
- id: 'save',
- name: this.id ? 'Save' : 'Add',
- type: 'submit',
- cb: ({ form: { value: formValue } }) => {
- let fullRedraw = false;
- if (vertex && formValue.id !== vertex.id) {
- fullRedraw = true;
- }
- // TODO: preserve data types of properties
- formValue.properties = new Map(formValue.properties.map(({ key, value }) => [key, value]));
- if (vertex) {
- Object.assign(vertex, formValue);
- vertex.displayVertex();
- } else {
- graph.addVertex(formValue.type, formValue.id, null, formValue.label);
- }
- if (fullRedraw) {
- graph.redraw();
- }
- if (!vertex) {
- // This was a new vertex. Now let's edit.
- Vertex.prepareEditorDocument(graph, doc, formValue.id);
- }
+ });
+
+ form.button({
+ id: 'save',
+ name: 'Save',
+ type: 'submit',
+ cb: ({ form: { value: formValue } }) => {
+ let fullRedraw = false;
+ if (vertex && formValue.id !== vertex.id) {
+ fullRedraw = true;
+ }
+ // TODO: preserve data types of properties
+ formValue.properties = new Map(formValue.properties.map(({ key, value }) => [key, value]));
+ if (vertex) {
+ Object.assign(vertex, formValue);
+ vertex.displayVertex();
+ } else {
+ graph.addVertex(formValue.type, formValue.id, null, formValue.label);
+ }
+ if (fullRedraw) {
+ graph.redraw();
+ }
+ if (!vertex) {
+ // This was a new vertex. Now let's edit.
+ doc.clear();
+ Vertex.prepareEditorDocument(graph, doc, formValue.id);
+ }
+ },
+ });
+
+ if (vertex) {
+ doc.remark('New Edge
', { parentEl: form.el });
+ const { subForm } = form.subForm({ name: 'newEdge' }).lastItem;
+ subForm.textField({ name: 'to' });
+ subForm.textField({ name: 'type' });
+ subForm.textField({ name: 'weight' });
+ subForm.button({
+ name: 'Save',
+ cb: ({ form: { value: { to, type, weight } } }) => {
+ graph.addEdge(type, vertex, to, weight, null);
+ doc.clear();
+ Edge.prepareEditorDocument(graph, doc, vertex.id, to);
},
- })
- .button({
- id: 'cancel',
- name: 'Cancel',
- cb: () => graph.resetEditorDocument(),
});
+ }
+
+ form.button({
+ id: 'cancel',
+ name: 'Cancel',
+ cb: () => graph.resetEditorDocument(),
+ });
+
return doc;
}
}
diff --git a/forum-network/src/classes/supporting/wdg.js b/forum-network/src/classes/supporting/wdg.js
index 28e9c8d..4f72777 100644
--- a/forum-network/src/classes/supporting/wdg.js
+++ b/forum-network/src/classes/supporting/wdg.js
@@ -8,6 +8,7 @@ const makeWDGHandler = (graphIndex) => (vertexId) => {
const graph = allGraphs[graphIndex];
// We want a document for editing this node, which may be a vertex or an edge
const { editorDoc } = graph;
+ editorDoc.clear();
if (vertexId.startsWith('edge:')) {
const [, from, to] = vertexId.split(':');
Edge.prepareEditorDocument(graph, editorDoc, from, to);
@@ -101,6 +102,7 @@ export class WeightedDirectedGraph {
}
resetEditorDocument() {
+ this.editorDoc.clear();
Vertex.prepareEditorDocument(this, this.editorDoc);
}