editor: metadata editor ui tweak - smaller visual emphasis on removing row
[fnpeditor.git] / src / editor / modules / documentCanvas / commands.js
1 define([
2 './canvas/utils',
3 'views/dialog/dialog',
4 'fnpjs/datetime'
5 ], function(utils, Dialog, datetime) {
6     
7 'use strict';
8 /* globals gettext */
9
10
11 var gridToggled = false;
12
13 var commands = {
14     _cmds: {},
15     register: function(name, command) {
16         this._cmds[name] = command;
17     },
18
19     run: function(name, params, canvas, user) {
20         return this._cmds[name](canvas, params, user);
21     }
22 };
23
24 commands.register('undo', function(canvas) {
25     var doc = canvas.wlxmlDocument;
26
27     doc.undo();
28 });
29
30 commands.register('redo', function(canvas) {
31     var doc = canvas.wlxmlDocument;
32
33     doc.redo();
34 });
35
36 commands.register('remove-node', function(canvas) {
37     canvas.getCurrentNodeElement().data('wlxmlNode').detach();
38 });
39
40 commands.register('unwrap-node', function(canvas) {
41     var cursor = canvas.getCursor(),
42         selectionStart = cursor.getSelectionStart(),
43         selectionEnd = cursor.getSelectionEnd(),
44         parent1 = selectionStart.element.parent() || undefined,
45         parent2 = selectionEnd.element.parent() || undefined;
46
47     var selectionAnchor = cursor.getSelectionAnchor(),
48         node1 = parent1.data('wlxmlNode'),
49         node2 = parent2.data('wlxmlNode'),
50         doc = node1.document;
51     if(doc.areItemsOfSameList({node1: node1, node2: node2})) {
52         doc.extractItems({item1: node1, item2: node2});
53         canvas.setCurrentElement(selectionAnchor.element, {caretTo: selectionAnchor.offset});
54     } else if(!cursor.isSelecting()) {
55         var nodeToUnwrap = cursor.getPosition().element.data('wlxmlNode'),
56             parentNode = nodeToUnwrap.unwrap();
57         if(parentNode) {
58             canvas.setCurrentElement(utils.findCanvasElement(parentNode));
59         }
60     }
61 });
62
63 commands.register('wrap-node', function(canvas) {
64     var cursor = canvas.getCursor(),
65         selectionStart = cursor.getSelectionStart(),
66         selectionEnd = cursor.getSelectionEnd(),
67         parent1 = selectionStart.element.parent() || undefined,
68         parent2 = selectionEnd.element.parent() || undefined;
69
70     var node1 = parent1.data('wlxmlNode'),
71         node2 = parent2.data('wlxmlNode'),
72         doc = node1.document;
73
74     if(doc.areItemsOfSameList({node1: node1, node2: node2})) {
75         doc.createList({node1: node1, node2: node2});
76     }
77 });
78
79 commands.register('list', function(canvas, params) {
80     void(params);
81     var cursor = canvas.getCursor(),
82         selectionStart = cursor.getSelectionStart(),
83         selectionEnd = cursor.getSelectionEnd(),
84         parent1 = selectionStart.element.parent() || undefined,
85         parent2 = selectionEnd.element.parent() || undefined;
86
87     var selectionFocus = cursor.getSelectionFocus();
88
89     if(selectionStart.element.isInsideList() || selectionEnd.element.isInsideList()) {
90         return;
91     }
92
93     var node1 = parent1.data('wlxmlNode'),
94         node2 = parent2.data('wlxmlNode'),
95         doc = node1.document;
96     
97     doc.createList({node1: node1, node2: node2});
98     canvas.setCurrentElement(selectionFocus.element, {caretTo: selectionFocus.offset});
99 });
100
101 commands.register('toggle-grid', function(canvas, params) {
102     canvas.doc().dom().parent().toggleClass('grid-on', params.toggle);
103     gridToggled = params.toggle;
104 });
105
106 commands.register('newNodeRequested', function(canvas, params, user) {
107     var cursor = canvas.getCursor(),
108         selectionStart = cursor.getSelectionStart(),
109         selectionEnd = cursor.getSelectionEnd(),
110         wlxmlNode, caretTo, wrapperCanvasElement;
111
112     var insertNode = function(insertion, callback) {
113         var doc = canvas.wlxmlDocument,
114             node, metadata, creator, dialog;
115
116         var execCallback = function(node) {
117             if(callback) {
118                 callback(node);
119             }
120         };
121
122         if(params.wlxmlTag === 'aside' && params.wlxmlClass === 'comment') {
123             doc.startTransaction();
124             node = insertion();
125             if(user) {
126                 creator = user.name;
127                 if(user.email) {
128                     creator += ' (' + user.email + ')';
129                 }
130             } else {
131                 creator = 'anonymous';
132             }
133
134             metadata = node.getMetadata();
135             metadata.add({key: 'creator', value: creator});
136             metadata.add({key: 'date', value: datetime.currentStrfmt()});
137             doc.endTransaction();
138             execCallback(node);
139         } else if(params.wlxmlClass === 'link') {
140             dialog = Dialog.create({
141                 title: gettext('Create link'),
142                 executeButtonText: gettext('Apply'),
143                 cancelButtonText: gettext('Cancel'),
144                 fields: [
145                     {label: gettext('Link'), name: 'href', type: 'input'}
146                 ]
147             });
148             dialog.on('execute', function(event) {
149                 doc.startTransaction();
150                 node = insertion();
151                 node.setAttr('href', event.formData.href);
152                 doc.endTransaction();
153                 event.success();
154                 execCallback(node);
155             });
156             dialog.show();
157         } else {
158             doc.startTransaction();
159             node = insertion();
160             doc.endTransaction();
161             execCallback(node);
162         }
163     };
164
165     if(cursor.isSelecting()) {
166         if(cursor.isSelectingSiblings()) {
167             if(cursor.isSelectingWithinElement()) {
168                 wlxmlNode = selectionStart.element.data('wlxmlNode');
169                 caretTo = selectionStart.offset < selectionEnd.offset ? 'start' : 'end';
170
171                 insertNode(
172                     function() {
173                         return wlxmlNode.wrapWith({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}, start: selectionStart.offset, end: selectionEnd.offset});
174                     },
175                     function(wrapper) {
176                         wrapperCanvasElement = utils.findCanvasElement(wrapper);
177                         canvas.setCurrentElement(wrapperCanvasElement.children()[0], {caretTo: caretTo});
178                     }
179                 );
180             }
181             else {
182                 wlxmlNode = selectionStart.element.data('wlxmlNode').parent();
183                 caretTo = selectionStart.element.sameNode(cursor.getSelectionAnchor().element) ? 'end' : 'start';
184
185                 insertNode(
186                     function() {
187                         return wlxmlNode.wrapText({
188                             _with: {tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}},
189                             offsetStart: selectionStart.offset,
190                             offsetEnd: selectionEnd.offset,
191                             textNodeIdx: [wlxmlNode.indexOf(selectionStart.element.data('wlxmlNode')), wlxmlNode.indexOf(selectionEnd.element.data('wlxmlNode'))] //parent.childIndex(selectionEnd.element)]
192                         });
193                     },
194                     function(wrapper) {
195                         wrapperCanvasElement = utils.findCanvasElement(wrapper);
196                         canvas.setCurrentElement(wrapperCanvasElement.children()[caretTo === 0 ? 0 : wrapperCanvasElement.children().length - 1], {caretTo: caretTo});
197                     }
198                 );
199             }
200         } else {
201             var node1 = selectionStart.element.data('wlxmlNode'),
202                 node2 = selectionEnd.element.data('wlxmlNode'),
203                 siblingParents = canvas.wlxmlDocument.getSiblingParents({node1: node1, node2: node2});
204
205             if(siblingParents) {
206                 insertNode(
207                     function() {
208                         return canvas.wlxmlDocument.wrapNodes({
209                             node1: siblingParents.node1,
210                             node2: siblingParents.node2,
211                             _with: {tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}}
212                         });
213                     }
214                 );
215             }
216         }
217     } else if(canvas.getCurrentNodeElement()) {
218         wlxmlNode = canvas.getCurrentNodeElement().data('wlxmlNode');
219
220         var linkFound = [wlxmlNode].concat(wlxmlNode.parents()).some(function(node) {
221             if(node.getClass() === 'link') {
222                 var dialog = Dialog.create({
223                     title: gettext('Edit link'),
224                     executeButtonText: gettext('Apply'),
225                     cancelButtonText: gettext('Cancel'),
226                     fields: [
227                         {label: gettext('Link'), name: 'href', type: 'input', initialValue: node.getAttr('href')},
228                     ]
229                 });
230                 dialog.on('execute', function(event) {
231                     canvas.wlxmlDocument.startTransaction();
232                     node.setAttr('href', event.formData.href);
233                     event.success();
234                     canvas.wlxmlDocument.endTransaction();
235                 });
236                 dialog.show();
237                 return true;
238             }
239         });
240         if(linkFound) {
241             return;
242         }
243
244         if(params.ctrlKey) {
245             insertNode(
246                 function() {
247                     return wlxmlNode.wrapWith({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}});
248                 },
249                 function(wrapper) {
250                     canvas.setCurrentElement(utils.findCanvasElement(wrapper));
251                 }
252             );
253         } else {
254             insertNode(
255                 function() {
256                     var node = wlxmlNode.after({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}});
257                     node.append({text:''});
258                     return node;
259                 }, function(wrapper) {
260                     canvas.setCurrentElement(utils.findCanvasElement(wrapper));
261                 }
262             );
263         }
264     }
265 });
266
267 commands.register('footnote', function(canvas, params) {
268     void(params);
269     var cursor = canvas.getCursor(),
270         position = cursor.getPosition(),
271         asideNode, asideElement, node;
272         
273
274     if(cursor.isSelectingWithinElement()) {
275         asideNode = position.element.data('wlxmlNode').wrapWith({tagName: 'aside', attrs:{'class': 'footnote'}, start: cursor.getSelectionStart().offset, end: cursor.getSelectionEnd().offset});
276     } else {
277         node = position.element.data('wlxmlNode');
278         node.document.transaction(function() {
279             asideNode = node.divideWithElementNode({tagName: 'aside', attrs:{'class': 'footnote'}}, {offset: position.offset});
280             asideNode.append({text: ''});
281         });
282     }
283
284     asideElement = utils.findCanvasElement(asideNode);
285     asideElement.toggle(true);
286     canvas.setCurrentElement(asideElement);
287 });
288
289 commands.register('take-away-node', function(canvas) {
290     var position = canvas.getCursor().getPosition(),
291         element = position.element,
292         nodeElement = element ? element.parent() : canvas.getCurrentNodeElement();
293
294     if(!nodeElement || !(nodeElement.parent())) {
295         return;
296     }
297
298     var range = nodeElement.data('wlxmlNode').unwrapContent();
299
300     if(element) {
301         var elementIsFirstChild = nodeElement.childIndex(element);
302         if(element.bound()) {
303             canvas.setCurrentElement(element, {caretTo: position.offset});
304         } else {
305             if(elementIsFirstChild) {
306                 canvas.setCurrentElement(utils.findCanvasElement(range.element1), {caretTo: 'end'});
307             } else {
308                 canvas.setCurrentElement(utils.findCanvasElement(range.element2), {caretTo: 'end'});
309             }
310         }
311     } else {
312         canvas.setCurrentElement(utils.findCanvasElement(range.element1), {caretTo: 'start'});
313     }
314
315 });
316
317
318 return {
319     run: function(name, params, canvas, user) {
320         return commands.run(name, params, canvas, user);
321     }
322 };
323
324 });