Dodanie wybierania motywow.

[redakcja.git] / platforma / templates / renderer.html

diff --git a/platforma/templates/renderer.html b/platforma/templates/renderer.html
index dabf338..84de36d 100755 (executable)
--- a/platforma/templates/renderer.html
+++ b/platforma/templates/renderer.html
@@ -1,29 +1,46 @@
 {% extends "base.html" %}\r
 \r
 {% block extrahead %}\r
 {% extends "base.html" %}\r
 \r
 {% block extrahead %}\r

-<link rel="stylesheet" href="{{STATIC_URL}}css/html.css" type="text/css" charset="utf-8">\r
+<link rel="stylesheet" href="{{STATIC_URL}}css/html.css" type="text/css" charset="utf-8" />\r
+<script src="{{STATIC_URL}}js/lib/codemirror/codemirror.js" type="text/javascript" charset="utf-8"></script>\r

 {% endblock %}\r
 \r
 {% block maincontent %}\r
 \r
 {% endblock %}\r
 \r
 {% block maincontent %}\r
 \r

-<p>Source</p>\r
-<textarea id="source" cols="80" rows="10" ></textarea>\r
-\r
-<p>Rendered</p>\r
-<textarea id="dest" cols="80" rows="10" ></textarea>\r
-\r
-<button type="button" id="render">Render</button>\r
-<button type="button" id="unrender">Unrender</button>\r
-\r
-<div style="position: fixed; right: 0px; top: 0px; width: 640px; height: 300px; background: blue;">\r
-<div id="preview" class="htmlview">\r
-</div>\r
-</div>\r
+<!-- <button type="button" id="render">Render</button>\r
+\r
+<table width="100%" align="center">\r
+    <tr>\r
+        <td width="50%">\r
+                <textarea id="source" cols="70" rows="30" ></textarea>\r
+        </td>\r
+        <td width="50%">\r
+                <textarea id="dest" cols="70" rows="30" ></textarea>\r
+        </td>\r
+    </tr>\r
+</table>\r
+<iframe>\r
+    \r
+</iframe> -->\r
+<div id="target"> </div>\r

 {% endblock %}\r
 \r
 {% block extrabody %}\r
 {% endblock %}\r
 \r
 {% block extrabody %}\r

+\r

 <script type="text/javascript">\r
 <script type="text/javascript">\r

+<![CDATA[\r
+    var editor = new CodeMirror(CodeMirror.replace("target"), {\r
+  parserfile: ["tokenizejavascript.js", "parsejavascript.js"],\r
+  path: "{{STATIC_URL}}js/lib/codemirror",\r
+  stylesheet: "{{STATIC_URL}}css/xmlcolors.css",\r
+  content: "Hello world!"\r
+});\r
+]]>\r
+</script>\r

 \r
 \r

+{% comment %}\r
+<script type="text/javascript">\r
+<![CDATA[\r

     function serializeAttribute(attr, acc) {\r
         return acc + ' ' + attr.nodeName + '="'+ attr.nodeValue + '"';\r
     }\r
     function serializeAttribute(attr, acc) {\r
         return acc + ' ' + attr.nodeName + '="'+ attr.nodeValue + '"';\r
     }\r


@@ -41,6 +58,7 @@
         }\r
         \r
         acc += "<" + element.nodeName;\r
         }\r
         \r
         acc += "<" + element.nodeName;\r

+        \r

         for(var i=0; i < element.attributes.length; i++)\r
             acc = serializeAttribute(element.attributes.item(i), acc);\r
 \r
         for(var i=0; i < element.attributes.length; i++)\r
             acc = serializeAttribute(element.attributes.item(i), acc);\r
 \r


@@ -93,31 +111,43 @@
     }\r
 \r
     // w3c version first\r
     }\r
 \r
     // w3c version first\r

-    var xslt = new XSLTProcessor();\r
+    var there = new XSLTProcessor();\r
+    var here = new XSLTProcessor();\r

 \r
     $.ajax({\r
         url: "/static/xsl/wl2html_client.xsl",\r
         dataType: 'xml',\r
         success: function(data) {\r
 \r
     $.ajax({\r
         url: "/static/xsl/wl2html_client.xsl",\r
         dataType: 'xml',\r
         success: function(data) {\r

-            xslt.importStylesheet(data);\r
-            console.log('XSL loaded successfully');\r
+            there.importStylesheet(data);\r
+            console.log('There XSL loaded successfully');\r
+        },\r
+        async: false\r
+    });\r
+\r
+    $.ajax({\r
+        url: "/static/xsl/html2wl_client.xsl",\r
+        dataType: 'xml',\r
+        success: function(data) {\r
+            here.importStylesheet(data);\r
+            console.log('Here XSL loaded successfully');\r

         },\r
         async: false\r
     });\r
     \r
         },\r
         async: false\r
     });\r
     \r

-    $('#render').click(function() {\r
-        \r
-        var src = '<?xml version="1.0"?><chunk>'+$('#source').val()+'</chunk>';\r
+    $('#render').click(function()\r
+    {\r
+        src = $('#source').val();\r

         src = src.replace(/\/\s+/g, '<br />');\r
         var doc = (new DOMParser()).parseFromString(src, "text/xml");\r
         src = src.replace(/\/\s+/g, '<br />');\r
         var doc = (new DOMParser()).parseFromString(src, "text/xml");\r

-        // var string = (new XMLSerializer()).serializeToString(doc);\r
-        // console.log('rendering', string);\r
-        \r
-        var result = xslt.transformToFragment(doc, document);\r
-        var string =  serializeXML(result);\r
-        var dest = $('#dest');\r
-        dest.val( string );\r
-        $('#preview').html(string);\r
-    });    \r
+        // console.log("Parsed", doc);\r
+        var along = there.transformToDocument(doc).documentElement;\r
+        // console.log("HTML", along, serializeXML(along) );\r
+        var xfrm = here.transformToDocument(along).documentElement;\r
+        // console.log("WLML", xfrm, serializeXML(xfrm) );\r
+        var out = (new XMLSerializer()).serializeToString(xfrm);\r
+        $('#dest').val(out);\r
+    });\r
+]]>\r

 </script>\r
 </script>\r

+{% endcomment %}\r

 {% endblock %}
\ No newline at end of file
 {% endblock %}
\ No newline at end of file