editor: canvas cursor fix - handle node with Zero Width Space only correctly
[fnpeditor.git] / src / smartxml / core.js
1 define(function(require) {
2     
3 'use strict';
4 /* globals Node */
5
6 var _ = require('libs/underscore');
7
8
9 var INSERTION = function(implementation) {
10     var toret = function(node, options) {
11         var insertion = this.getNodeInsertion(node),
12             nodeWasContained = this.document.containsNode(insertion.ofNode),
13             nodeParent,
14             returned;
15         options = options || {};
16         if(!(this.document.containsNode(this))) {
17             nodeParent = insertion.ofNode.parent();
18         }
19         returned = implementation.call(this, insertion.ofNode);
20         if(!options.silent && returned.sameNode(insertion.ofNode)) {
21             this.triggerChangeEvent(insertion.insertsNew ? 'nodeAdded' : 'nodeMoved', {node: insertion.ofNode}, nodeParent, nodeWasContained);
22         }
23         return returned;
24     };
25     return toret;
26 };
27
28 var documentNodeTransformations = {
29     detach: function() {
30         var parent = this.parent(),
31             existed = this.document.containsNode(this);
32         this._$.detach();
33         if(existed) {
34             this.triggerChangeEvent('nodeDetached', {parent: parent});
35         }
36         return this;
37     },
38
39     replaceWith: function(node) {
40         var toret;
41         if(this.isRoot()) {
42             return this.document.replaceRoot(node);
43         }
44         toret = this.after(node);
45         this.detach();
46         return toret;
47     },
48
49     after: INSERTION(function(node) {
50         var next = this.next();
51         if(next && next.nodeType === Node.TEXT_NODE && node.nodeType === Node.TEXT_NODE) {
52             next.setText(node.getText() + next.getText());
53             node.detach();
54             return next;
55         }
56         this._$.after(node.nativeNode);
57         return node;
58     }),
59
60     before: INSERTION(function(node) {
61         var prev = this.prev();
62         if(prev && prev.nodeType === Node.TEXT_NODE && node.nodeType === Node.TEXT_NODE) {
63             prev.setText(prev.getText() + node.getText());
64             node.detach();
65             return prev;
66         }
67         this._$.before(node.nativeNode);
68         return node;
69     }),
70
71     wrapWith: function(node) {
72         var insertion = this.getNodeInsertion(node);
73         if(this.parent()) {
74             this.before(insertion.ofNode);
75         }
76         insertion.ofNode.append(this);
77         return insertion.ofNode;
78     },
79
80     /**
81     * Removes parent of a node if node has no siblings.
82     */
83     unwrap: function() {
84         if(this.isRoot()) {
85             return;
86         }
87         var parent = this.parent(),
88             grandParent;
89         if(parent.contents().length === 1) {
90             grandParent = parent.parent();
91             parent.unwrapContent();
92             return grandParent;
93         }
94     }
95 };
96
97 var elementNodeTransformations = {
98
99     detach: function() {
100         var next;
101         if(this.parent() && this.isSurroundedByTextElements()) {
102             next = this.next();
103             this.prev().appendText(next.getText());
104             next.detach();
105         }
106         return this.__super__.detach();
107     },
108
109     setTag: function(tagName) {
110         var node = this.document.createDocumentNode({tagName: tagName}),
111             oldTagName = this.getTagName(),
112             myContents = this._$.contents();
113
114         this.getAttrs().forEach(function(attribute) {
115             node.setAttr(attribute.name, attribute.value, true);
116         });
117         node.setData(this.getData());
118
119         if(this.sameNode(this.document.root)) {
120             this.document._defineDocumentProperties(node._$);
121         }
122
123         /* TODO: This invalidates old references to this node. Caching instances on nodes would fix this. */
124         this._$.replaceWith(node._$);
125         this._setNativeNode(node._$[0]);
126         this._$.append(myContents);
127         this.triggerChangeEvent('nodeTagChange', {oldTagName: oldTagName, newTagName: this.getTagName()});
128     },
129
130
131     setAttr: function(name, value, silent) {
132         var oldVal = this.getAttr(name);
133         this._$.attr(name, value);
134         if(!silent) {
135             this.triggerChangeEvent('nodeAttrChange', {attr: name, oldVal: oldVal, newVal: value});
136         }
137     },
138
139     append: INSERTION(function(node) {
140         var last = _.last(this.contents());
141         if(last && last.nodeType === Node.TEXT_NODE && node.nodeType === Node.TEXT_NODE) {
142             last.setText(last.getText() + node.getText());
143             node.detach();
144             return last;
145         } else {
146             this._$.append(node.nativeNode);
147             return node;
148         }
149     }),
150
151     prepend: INSERTION(function(node) {
152         var first = this.contents()[0];
153         if(first && first.nodeType === Node.TEXT_NODE && node.nodeType === Node.TEXT_NODE) {
154             first.setText(node.getText() + first.getText());
155             node.detach();
156             return first;
157         } else {
158             this._$.prepend(node.nativeNode);
159             return node;
160         }
161     }),
162
163     insertAtIndex: function(nativeNode, index) {
164         var contents = this.contents();
165         if(index < contents.length) {
166             return contents[index].before(nativeNode);
167         } else if(index === contents.length) {
168             return this.append(nativeNode);
169         }
170     },
171
172     unwrapContent: function() {
173         var parent = this.parent();
174         if(!parent) {
175             return;
176         }
177
178         var myContents = this.contents(),
179             myIdx = parent.indexOf(this);
180
181
182         if(myContents.length === 0) {
183             return this.detach();
184         }
185
186
187         var childrenLength = this.contents().length,
188             first = true,
189             shiftRange = false;
190         this.contents().forEach(function(child) {
191             var returned = this.before(child);
192             if(first && !(returned.sameNode(child))) {
193                 shiftRange = true;
194                 first = false;
195             }
196         }.bind(this));
197
198         this.detach();
199
200         return {
201             element1: parent.contents()[myIdx + (shiftRange ? -1 : 0)],
202             element2: parent.contents()[myIdx + childrenLength-1 + (shiftRange ? -1 : 0)]
203         };
204     },
205
206     wrapText: function(params) {
207         return this.document._wrapText(_.extend({inside: this}, params));
208     }
209 };
210
211 var textNodeTransformations = {
212     setText: {
213         impl: function(t, text) {
214             t.oldText = this.getText();
215             this.nativeNode.data = text;
216             this.triggerTextChangeEvent();
217         },
218         undo: function(t) {
219             this.setText(t.oldText);
220         }
221     },
222
223     before: INSERTION(function(node) {
224         if(node.nodeType === Node.TEXT_NODE) {
225             this.prependText(node.getText());
226             node.detach();
227             return this;
228         } else {
229             return this.__super__.before(node, {silent:true});
230         }
231     }),
232
233     after: INSERTION(function(node) {
234         if(node.nodeType === Node.TEXT_NODE) {
235             this.appendText(node.getText());
236             node.detach();
237             return this;
238         } else {
239             return this.__super__.after(node, {silent:true});
240         }
241     }),
242
243     appendText: function(text) {
244         this.nativeNode.data = this.nativeNode.data + text;
245         this.triggerTextChangeEvent();
246     },
247
248     prependText: function(text) {
249         this.nativeNode.data = text + this.nativeNode.data;
250         this.triggerTextChangeEvent();
251     },
252
253     wrapWith: function(desc) {
254         if(typeof desc.start === 'number' && typeof desc.end === 'number') {
255             return this.document._wrapText({
256                 inside: this.parent(),
257                 textNodeIdx: this.parent().indexOf(this),
258                 offsetStart: Math.min(desc.start, desc.end),
259                 offsetEnd: Math.max(desc.start, desc.end),
260                 _with: {tagName: desc.tagName, attrs: desc.attrs}
261             });
262         } else {
263             return this.__super__.wrapWith.call(this, desc);
264         }
265     },
266
267     split: function(params) {
268         var parentElement = this.parent(),
269             passed = false,
270             succeedingChildren = [],
271             prefix = this.getText().substr(0, params.offset),
272             suffix = this.getText().substr(params.offset);
273
274         parentElement.contents().forEach(function(child) {
275             if(passed) {
276                 succeedingChildren.push(child);
277             }
278             if(child.sameNode(this)) {
279                 passed = true;
280             }
281         }.bind(this));
282
283         if(prefix.length > 0) {
284             this.setText(prefix);
285         }
286         else {
287             this.detach();
288         }
289
290         var attrs = {};
291         parentElement.getAttrs().forEach(function(attr) {attrs[attr.name] = attr.value; });
292         var newElement = this.document.createDocumentNode({tagName: parentElement.getTagName(), attrs: attrs});
293         parentElement.after(newElement);
294
295         if(suffix.length > 0) {
296             newElement.append({text: suffix});
297         }
298         succeedingChildren.forEach(function(child) {
299             newElement.append(child);
300         });
301
302         return {first: parentElement, second: newElement};
303     },
304
305     divideWithElementNode: function(node, params) {
306         var insertion = this.getNodeInsertion(node),
307             myText = this.getText();
308
309         if(params.offset === myText.length) {
310             return this.after(node);
311         }
312         if(params.offset === 0) {
313             return this.before(node);
314         }
315
316         var lhsText = myText.substr(0, params.offset),
317             rhsText = myText.substr(params.offset),
318             rhsTextNode = this.document.createDocumentNode({text: rhsText});
319
320         this.setText(lhsText);
321         this.after(insertion.ofNode);
322         insertion.ofNode.after(rhsTextNode);
323         return insertion.ofNode;
324     }
325 };
326
327 var documentTransformations = {
328     wrapNodes: function(params) {
329         if(!(params.node1.parent().sameNode(params.node2.parent()))) {
330             throw new Error('Wrapping non-sibling nodes not supported.');
331         }
332
333         var parent = params.node1.parent(),
334             parentContents = parent.contents(),
335             wrapper = this.createDocumentNode({
336                 tagName: params._with.tagName,
337                 attrs: params._with.attrs}),
338             idx1 = parent.indexOf(params.node1),
339             idx2 = parent.indexOf(params.node2);
340
341         if(idx1 > idx2) {
342             var tmp = idx1;
343             idx1 = idx2;
344             idx2 = tmp;
345         }
346
347         var insertingMethod, insertingTarget;
348         if(idx1 === 0) {
349             insertingMethod = 'prepend';
350             insertingTarget = parent;
351         } else {
352             insertingMethod = 'after';
353             insertingTarget = parentContents[idx1-1];
354         }
355
356         for(var i = idx1; i <= idx2; i++) {
357             wrapper.append(parentContents[i].detach());
358         }
359
360         insertingTarget[insertingMethod](wrapper);
361         return wrapper;
362     },
363
364     _wrapText: function(params) {
365         params = _.extend({textNodeIdx: 0}, params);
366         if(typeof params.textNodeIdx === 'number') {
367             params.textNodeIdx = [params.textNodeIdx];
368         }
369         
370         var contentsInside = params.inside.contents(),
371             idx1 = Math.min.apply(Math, params.textNodeIdx),
372             idx2 = Math.max.apply(Math, params.textNodeIdx),
373             textNode1 = contentsInside[idx1],
374             textNode2 = contentsInside[idx2],
375             sameNode = textNode1.sameNode(textNode2),
376             prefixOutside = textNode1.getText().substr(0, params.offsetStart),
377             prefixInside = textNode1.getText().substr(params.offsetStart),
378             suffixInside = textNode2.getText().substr(0, params.offsetEnd),
379             suffixOutside = textNode2.getText().substr(params.offsetEnd)
380         ;
381
382         if(!(textNode1.parent().sameNode(textNode2.parent()))) {
383             throw new Error('Wrapping text in non-sibling text nodes not supported.');
384         }
385         
386         var wrapperElement = this.createDocumentNode({tagName: params._with.tagName, attrs: params._with.attrs});
387         textNode1.after(wrapperElement);
388         textNode1.detach();
389         
390         if(prefixOutside.length > 0) {
391             wrapperElement.before({text:prefixOutside});
392         }
393         if(sameNode) {
394             var core = textNode1.getText().substr(params.offsetStart, params.offsetEnd - params.offsetStart);
395             wrapperElement.append({text: core});
396         } else {
397             textNode2.detach();
398             if(prefixInside.length > 0) {
399                 wrapperElement.append({text: prefixInside});
400             }
401             for(var i = idx1 + 1; i < idx2; i++) {
402                 wrapperElement.append(contentsInside[i]);
403             }
404             if(suffixInside.length > 0) {
405                 wrapperElement.append({text: suffixInside});
406             }
407         }
408         if(suffixOutside.length > 0) {
409             wrapperElement.after({text: suffixOutside});
410         }
411         return wrapperElement;
412     },
413     replaceRoot: function(node) {
414         var insertion = this.getNodeInsertion(node);
415         this.root.detach();
416         this._defineDocumentProperties(insertion.ofNode._$);
417         insertion.ofNode.triggerChangeEvent('nodeAdded');
418         return insertion.ofNode;
419     }
420 };
421
422 return {
423     document: {
424         transformations: documentTransformations
425     },
426     documentNode: {
427         transformations: documentNodeTransformations
428     },
429     elementNode: {
430         transformations: elementNodeTransformations
431     },
432     textNode: {
433         transformations: textNodeTransformations
434     }
435 };
436
437 });