xref: /plugin/struct/script/InlineEditor.js (revision 7938ca48e9616e2e020a922137123f8442612482)
1/**
2 * Inline Editor
3 */
4var InlineEditor = function ($table) {
5
6
7    $table.on('dblclick', 'td', function (e) {
8        e.preventDefault();
9        e.stopPropagation();
10
11        var $self = jQuery(this);
12        var pid = $self.parent().data('pid');
13        var field = $self.parents('table').find('tr th').eq($self.index()).data('field');
14
15        if (!pid) return;
16        if (!field) return;
17
18        // prepare the edit overlay
19        var $div = jQuery('<div class="struct_inlineditor"><form></form><div class="err"></div></div>');
20        var $form = $div.find('form');
21        var $errors = $div.find('div.err').hide();
22        var $save = jQuery('<button type="submit">Save</button>');
23        var $cancel = jQuery('<button>Cancel</button>');
24        $form.append(jQuery('<input type="hidden" name="pid">').val(pid));
25        $form.append(jQuery('<input type="hidden" name="field">').val(field));
26        $form.append('<input type="hidden" name="call" value="plugin_struct_inline_save">');
27        $form.append(jQuery('<div class="ctl">').append($save).append($cancel));
28
29        /**
30         * load the editor
31         */
32        jQuery.post(
33            DOKU_BASE + 'lib/exe/ajax.php',
34            {
35                call: 'plugin_struct_inline_editor',
36                pid: pid,
37                field: field
38            },
39            function (data) {
40                if (!data) return; // we're done
41
42                $form.prepend(data);
43
44                // show
45                $self.closest('.dokuwiki').append($div);
46                $div.position({
47                    my: 'left top',
48                    at: 'left top',
49                    of: $self
50                });
51
52                // attach entry handlers to the inline form
53                EntryEditor($form);
54
55                // focus first input
56                $form.find('input, textarea').first().focus();
57            }
58        );
59
60        /**
61         * Save the data, then close the form
62         */
63        $form.submit(function (e) {
64            e.preventDefault();
65            jQuery.post(
66                DOKU_BASE + 'lib/exe/ajax.php',
67                $form.serialize()
68            )
69                .done(function (data) {
70                    // save succeeded display new vlaue and close editor
71                    $self.html(data);
72                    $div.remove();
73                })
74                .fail(function (data) {
75                    // something went wrong, display error
76                    $errors.text(data.responseText).show();
77                })
78            ;
79
80
81        });
82
83        /**
84         * Close the editor without saving
85         */
86        $cancel.click(function (e) {
87            // unlock page
88            jQuery.post(
89                DOKU_BASE + 'lib/exe/ajax.php',
90                {
91                    call: 'plugin_struct_inline_cancel',
92                    pid: pid
93                }
94            );
95
96            e.preventDefault();
97            $div.remove();
98        });
99    });
100
101};
102