edd92c590dc0018f89c091bf18b9d616d0568ce4
[redakcja.git] / platforma / static / js / main.js
1 function serialize(element) {
2     if (element.nodeType == 3) { // tekst
3         return [$.trim(element.nodeValue)];
4     } else if (element.nodeType != 1) { // pomijamy węzły nie będące elementami XML ani tekstem
5         return [];
6     }
7     
8     var result = [];
9     var hasContent = false;
10     
11     result.push('<');
12     result.push(element.tagName);
13     
14     // Mozilla nie uważa deklaracji namespace za atrybuty
15     var ns = element.tagName.indexOf(':');
16     if (ns != -1 && $.browser.mozilla) {
17         result.push(' xmlns:');
18         result.push(element.tagName.substring(0, ns));
19         result.push('="');
20         result.push(element.namespaceURI);
21         result.push('"');
22     }
23     
24     if (element.attributes) {
25         for (var i=0; i < element.attributes.length; i++) {
26             var attr = element.attributes[i];
27             result.push(' ');
28             result.push(attr.name);
29             result.push('="');
30             result.push(attr.value);
31             result.push('"');
32             hasContent = true;
33         }
34     }
35     
36     if (element.childNodes.length == 0) {
37         result.push(' />');
38     } else {
39         result.push('>');
40
41         for (var i=0; i < element.childNodes.length; i++) {
42             result = result.concat(serialize(element.childNodes[i]));
43         }
44
45         result.push('</');
46         result.push(element.tagName);
47         result.push('>');
48     }
49     
50     if (element.tagName == 'akap' || element.tagName == 'akap_dialog' || element.tagName == 'akap_cd') {
51         result.push('\n\n\n');
52     } else if (element.tagName == 'rdf:RDF') {
53         result.push('\n\n\n\n\n');
54     } else if (element.tagName.indexOf('dc:') != -1) {
55         result.push('\n');
56     }
57     
58     return result;
59 };
60
61
62 $(function() {
63     var editor = CodeMirror.fromTextArea('id_text', {
64         parserfile: 'parsexml.js',
65         path: "/static/js/lib/codemirror/",
66         stylesheet: "/static/css/xmlcolors.css",
67         parserConfig: {
68             useHTMLKludges: false
69         },
70         textWrapping: true,
71         tabMode: 'spaces',
72         indentUnit: 0,
73     });
74     
75     $('#splitter').splitter({
76         type: "v",
77         outline: true,
78         minLeft: 480,
79         sizeRight: 0,
80         anchorToWindow: true,
81         resizeToWidth: true,
82     });
83     
84     $(window).resize(function() {
85         $('iframe').height($(window).height() - $('#tabs').outerHeight());
86     });
87     
88     $(window).resize();
89     
90     $('.vsplitbar').dblclick(function() {
91         if ($('#sidebar').width() == 0) {
92             $('#splitter').trigger('resize', [$(window).width() - 480]);
93         } else {
94             $('#splitter').trigger('resize', [$(window).width()]);
95         }
96     });
97
98     loadSuccess = function() {
99         if (this.get('state') != 'loading') {
100             alert('erroneous state:', this.get('state'));
101         }
102     }
103                 
104     function createXSLT(xsl) {
105         var p = new XSLTProcessor();
106         p.importStylesheet(xsl);
107         return p;
108     }
109     
110     function transform() {
111         $.ajax({
112             url: '/static/xsl/wl2html_client.xsl',
113             dataType: 'xml',
114             success: function(data) {
115                 var doc = null;
116                 var parser = new DOMParser();
117                 var serializer = new XMLSerializer();
118                 var htmlXSL = createXSLT(data);
119                 
120                 doc = editor.getCode().replace(/\/\s+/g, '<br />');
121                 doc = parser.parseFromString(doc, 'text/xml');
122                 console.log('xml', doc);
123                 doc = htmlXSL.transformToFragment(doc, document);
124                 console.log('after transform', doc);
125                 $('#html-view').html(doc.firstChild);
126             },
127             error: function() {alert('Error loading XSL!')}
128         });        
129     };
130     
131     function reverseTransform () {
132         $.ajax({
133             url: '/static/xsl/html2wl_client.xsl',
134             dataType: 'xml',
135             success: function(data) {
136                 var doc = null;
137                 var parser = new DOMParser();
138                 var serializer = new XMLSerializer();
139                 var xsl = createXSLT(data);
140                 
141                 doc = serializer.serializeToString($('#html-view div').get(0))
142                 doc = parser.parseFromString(doc, 'text/xml');
143                 console.log('xml',doc, doc.documentElement);
144                 // TODO: Sprawdzenie błędów
145                 doc = xsl.transformToDocument(doc);
146                 console.log('after transform', doc, doc.documentElement);
147                 doc = serialize(doc.documentElement).join('');
148                 // doc = serializer.serializeToString(doc.documentElement)
149                 editor.setCode(doc);
150             },
151             error: function() {alert('Error loading XSL!')}
152         });
153     };
154     
155     $('#save-button').click(function(event) {
156         event.preventDefault();
157         console.log(editor.getCode(), $('form input[name=text]').get(0));
158         $('form textarea[name=text]').val(editor.getCode());
159         $('form').ajaxSubmit(function() {
160             alert('Udało się!');
161         });
162     });
163     
164     $('#simple-view-tab').click(function() {
165         if ($(this).hasClass('active')) {
166             return;
167         }
168         $(this).addClass('active');
169         $('#source-view-tab').removeClass('active');
170         $('#source-editor').hide();
171         $('#simple-editor').show();
172         transform();
173     });
174     
175     $('#source-view-tab').click(function() {
176         if ($(this).hasClass('active')) {
177             return;
178         }
179         $(this).addClass('active');
180         $('#simple-view-tab').removeClass('active');
181         $('#simple-editor').hide();
182         $('#source-editor').show();
183         reverseTransform();
184     });
185     
186     $('.toolbar button').click(function(event) {
187         event.preventDefault();
188         var params = eval("(" + $(this).attr('ui:action-params') + ")");
189         scriptletCenter.scriptlets[$(this).attr('ui:action')](editor, params);
190     });
191     
192     $('.toolbar select').change(function() {
193         var slug = $(this).val();
194         
195         $('.toolbar-buttons-container').hide().filter('[data-group=' + slug + ']').show();
196     });
197     
198     $('.toolbar-buttons-container').hide();
199     $('.toolbar select').change();
200     
201     // $('#html-view *[x-editable]').live('mouseover', function() {
202     //     $(this).css({backgroundColor: 'red', marginLeft: -50, paddingLeft: 50});
203     //     $(this).append('<button class="edit-button">Edytuj</button>');
204     // }).live('mouseout', function() {
205     //     $(this).css({backgroundColor: null, marginLeft: 0, paddingLeft: 0});
206     //     $('.edit-button', this).remove();
207     // });
208 });