xref: /plugin/diagrams/script/DiagramsForm.js (revision d5285d5997d36d52df94bd6170b284d5e077218a) 
1class DiagramsForm extends KeyValueForm {
2  constructor(name = 'diagrams-form', fields = []) {
3    if (fields.length === 0) {
4      fields = [
5        {
6          label: 'media source', name: 'src'
7        },
8        {
9          type: 'select', 'label': 'alignment', 'options':
10            [
11              {name: 'alignment', value: 'left', label: 'links'},
12              {name: 'alignment', value: 'right', label: 'rechts'},
13              {name: 'alignment', value: 'center', label: 'zentriert'}
14            ]
15        }
16      ];
17    }
18
19    super(name, fields);
20  }
21  setSource(id = '') {
22    this.$form.find('[name="src"]').val(id);
23  }
24
25  getSource() {
26    return this.$form.find('[name="src"]').val();
27  }
28
29  setAlignment(align = '') {
30    this.$form.find('[name="alignment"]').prop('selected', '');
31    this.$form.find(`[name="alignment"][value="${align}"]`).prop('selected', 'selected');
32  }
33
34  getAlignment() {
35    return this.$form.find('[name="alignment"]:checked').val();
36  }
37
38  resetForm() {
39    this.setSource();
40    this.setAlignment();
41  }
42
43  static resolveSubmittedLinkData(initialAttrs, $diagramsForm, callback) {
44    return (event) => {
45      event.preventDefault();
46      const newAttrs = { ...initialAttrs };
47      newAttrs.id = $diagramsForm.getSource();
48      // FIXME is this conditional?
49      newAttrs.data = `${DOKU_BASE}lib/exe/fetch.php?cache=nocache&media=` + $diagramsForm.getSource();
50      newAttrs.align = $diagramsForm.getAlignment();
51
52      this.resolveImageAttributes(newAttrs, callback);
53    };
54  }
55
56  static resolveImageAttributes(newAttrs, callback) {
57    const ajaxEndpoint = `${DOKU_BASE}lib/exe/ajax.php`;
58    const ajaxParams = {
59      call: 'plugin_prosemirror',
60      actions: ['resolveMedia'],
61      attrs: newAttrs,
62      id: JSINFO.id,
63    };
64
65    jQuery.get(
66      ajaxEndpoint,
67      ajaxParams,
68    ).done((data) => {
69      const resolvedAttrs = {
70        ...newAttrs,
71        'data-resolvedHtml': data.resolveMedia['data-resolvedHtml'],
72      };
73      callback(resolvedAttrs);
74    }).fail((jqXHR, textStatus, errorThrown) => {
75      let errorMsg = `There was an error resolving this image -- ${errorThrown}: ${textStatus}.`;
76      if (window.SentryPlugin) {
77        window.SentryPlugin.logSentryException(new Error('Ajax Request failed'), {
78          tags: {
79            plugin: 'prosemirror',
80            id: JSINFO.id,
81          },
82          extra: {
83            ajaxEndpoint,
84            ajaxParams,
85            textStatus,
86            errorThrown,
87          },
88        });
89        errorMsg += ' The error has been logged to Sentry.';
90      }
91      errorMsg += ' You may want to continue your work in the syntax editor.';
92      jQuery('#draft__status').after(jQuery('<div class="error"></div>').text(errorMsg));
93    });
94  }
95}
96