Visual editor: simple parent/children navigation in edit pane
[fnpeditor.git] / modules / visualEditor.transformations.js
1 if(typeof module !== 'undefined' && module.exports) {
2     var $ = require('jquery');
3 }
4
5 (function($) {
6
7     var transformations = {};
8
9     transformations.fromXML = {
10         getHTMLTree: function(xml) {
11             var inner = $(xml).clone();
12             var toret = $('<div></div>');
13             toret.append(inner);
14             
15             var toBlock = ['div', 'document', 'section', 'header'];
16             var toInline = ['aside', 'span'];
17             
18             toBlock.forEach(function(tagName) {
19                 tagName = tagName.toLowerCase();
20                 console.log('running ' + tagName);
21                 toret.find(tagName).replaceWith(function() {
22                     var currentTag = $(this);
23                     if(currentTag.attr('wlxml-tag'))
24                         return;
25                     var toret = $('<div></div>').attr('wlxml-tag', tagName);
26                     for(var i = 0; i < this.attributes.length; i++) {
27                         var attr = this.attributes.item(i);
28                         var value = attr.name === 'class' ? attr.value.replace(/\./g, '-') : attr.value;
29                         toret.attr('wlxml-' + attr.name, value)
30                     }
31                     toret.append(currentTag.contents());
32                     return toret;
33                 });
34             });
35             
36             toInline.forEach(function(tagName) {
37                 tagName = tagName.toLowerCase();
38                 toret.find(tagName).replaceWith(function() {
39                     var currentTag = $(this);
40                     if(currentTag.attr('wlxml-tag'))
41                         return;
42                     var toret = $('<span></span>').attr('wlxml-tag', tagName);
43                     for(var i = 0; i < this.attributes.length; i++) {
44                         var attr = this.attributes.item(i);
45                         var value = attr.name === 'class' ? attr.value.replace(/\./g, '-') : attr.value;
46                         toret.attr('wlxml-' + attr.name, value)
47                     }
48                     toret.append(currentTag.contents());
49                     return toret;
50                 });
51             });
52             return toret.children();
53         },
54         getMetaData: function(xml) {
55             var toret = {};
56             $(xml).find('metadata').children().each(function() {
57                 var node = $(this);
58                 toret[this.nodeName.split(':')[1].toLowerCase()] = node.text();
59             })
60             return toret;
61         },
62         getDocumentDescription: function(xml) {
63             return {
64                 HTMLTree: this.getHTMLTree(xml),
65                 metadata: this.getMetaData(xml)
66             }
67         }
68     }
69
70     transformations.toXML = {
71         getXML: function(documentDescription) {
72             
73             var inner = $(documentDescription.HTMLTree);
74             var toret = $('<div></div>');
75             toret.append(inner);
76             
77             toret.find('div, span').replaceWith(function() {
78                 var div = $(this);
79                 var tagName = div.attr('wlxml-tag');
80                 var toret = $('<'+tagName+'>');
81                                    
82                 for(var i = 0; i < this.attributes.length; i++) {
83                     var attr = this.attributes.item(i);
84                     var split = attr.name.split('-')
85                     console.log(split);
86                     if(split[0] !== 'wlxml' || (split.length > 1 && split[1] === 'tag')) 
87                         continue;
88                     var wlxmlName = split.splice(1).join('-');
89                     var value = wlxmlName === 'class' ? attr.value.replace(/-/g, '.') : attr.value;
90                     console.log(name + ': ' + value);
91                     toret.attr(wlxmlName, value);
92                 }
93                     
94                 toret.append(div.contents());
95                 return toret;
96             });
97             
98             var meta = $('<metadata></metadata>\n');
99             _.each(_.keys(documentDescription.metadata), function(key) {
100                 meta.append('\n\t<dc:'+key+'>' + documentDescription.metadata[key] + '</dc:'+key+'>');
101             });
102             meta.append('\n');
103             
104             toret.find('metadata').replaceWith(meta);
105             
106             return toret.html();
107             
108         }
109     }
110
111
112     if(typeof module !== 'undefined' && module.exports) {
113         module.exports = transformations;
114     } else {
115         rng.modules.visualEditor.transformations = transformations;
116     }
117
118 })($);