xref: /plugin/diagrams/script/DiagramsView.js (revision 0ec94f66261066d45d3a211f0fade04069b99b28)
1class DiagramsView extends AbstractNodeView {
2    constructor(node, view, getPos) {
3        super(node, view, getPos);
4        this.dForm = new DiagramsForm('diagrams-form-view');
5    }
6
7    renderNode(attrs) {
8        const dgrSchemaSpecs = this.node.type.spec.toDOM(this.node);
9        this.dom = Object.assign(document.createElement(dgrSchemaSpecs[0]), dgrSchemaSpecs[1]);
10    }
11
12    selectNode() {
13        this.dom.classList.add('ProseMirror-selectednode');
14
15        this.dForm.setSource(this.node.attrs.id);
16        this.dForm.setEditButtonUrl(this.node.attrs.id, this.node.attrs.data);
17        // TODO
18        // this.dForm.setWidth(this.node.attrs.width);
19        // this.dForm.setHeight(this.node.attrs.height);
20        this.dForm.setAlignment(this.node.attrs.align);
21
22        this.dForm.show();
23
24        const cleanAttrs = AbstractNodeView.unsetPrefixAttributes('data-resolved', { ...this.node.attrs });
25        this.dForm.on('submit', DiagramsForm.resolveSubmittedLinkData(
26            cleanAttrs,
27            this.dForm,
28            (newAttrs) => {
29                this.renderNode(newAttrs);
30                const nodeStartPos = this.getPos();
31
32                this.outerView.dispatch(this.outerView.state.tr.setNodeMarkup(
33                    nodeStartPos,
34                    null,
35                    newAttrs,
36                    this.node.marks,
37                ));
38                this.deselectNode();
39            },
40        ));
41    }
42    deselectNode() {
43        this.dom.classList.remove('ProseMirror-selectednode');
44        this.dForm.hide();
45        this.dForm.off('submit');
46        this.dForm.resetForm();
47    }
48}
49