preserve <script> tags and whitespace in plaintext elements

diff --git a/demo.html b/demo.html
index 34d92e3..30dddf6 100644 (file)
--- a/demo.html
+++ b/demo.html
@@ -24,9 +24,11 @@
        <p>This color scheme is just temporary, for testing the cursor and annotations on a variaty of background colors</p>
        <form action="#" method="get">
        <p>HTML view. Changes here propagate when you remove your cursor (press tab or click outside)<br><textarea name="in" id="in">
-       &lt;script&gt;console.log("this code should not run in the editor")&lt;/script&gt;
-       &lt;!-- comments are preserved --&gt;
-       &lt;style&gt;h1 { color: #fdf; }&lt;/style&gt;
+&lt;script&gt;console.log("this code should not run in the editor")&lt;/script&gt;
+&lt;!-- comments are preserved including      whitespace --&gt;
+&lt;style&gt;
+    h1 { color: #fdf; }
+&lt;/style&gt;
        &lt;H1 style="padding: 0; margin: 0 0 7px 0"&gt;Headline!&lt;/h1&gt;
 
        &lt;div&gt;SVG works: &lt;svg style="display: inline-block; vertical-align: bottom"xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 55 55"&gt;&lt;path d="M27.5 0l6.57 19.87 20.93.11-16.868 12.39 6.364 19.938L27.5 40.094 10.504 52.308l6.364-19.938L0 19.98l20.93-.11z" overflow="visible" fill-rule="evenodd"&gt;&lt;/path&gt;&lt;/svg&gt;&lt;/div&gt;

diff --git a/editor.js b/editor.js
index 9a3a2f5..f3c6204 100644 (file)
--- a/editor.js
+++ b/editor.js
@@ -121,11 +121,10 @@ get_el_bounds = window.bounds = function(el) {
 }
 
 function is_display_block (el) {
-       if (el.currentStyle != null) {
-               return el.currentStyle.display === 'block'
-       } else {
+       if (el.nodeType === 1) {
                return window.getComputedStyle(el, null).getPropertyValue('display') === 'block'
        }
+       return false
 }
 
 // Pass return value from dom event handlers to this.
@@ -428,8 +427,10 @@ function instantiate_tree (tree, parent) {
                        break
                        case 'tag':
                                if (c.name === 'script' || c.name === 'object' || c.name === 'iframe' || c.name === 'link') {
-                                       // TODO put placeholders instead
-                                       remove.unshift(i) // add to beginning so they are removed last first
+                                       // TODO make some placeholders visible
+                                       // problematic to have different type than c: c.el = parent.ownerDocument.createComment(c.name + ' tag here')
+                                       c.el = parent.ownerDocument.createElement(c.name)
+                                       // correct type, but empty and no attributes
                                        continue
                                }
                                if (c.namespace === 'svg') {
@@ -455,11 +456,6 @@ function instantiate_tree (tree, parent) {
                                }
                }
        }
-       // these are in reverse order so we remove highest indexes first
-       for (i = 0; i < remove.length; i++) {
-               index = remove[i]
-               tree.splice(index, 1)
-       }
 }
 
 function traverse_tree (tree, cb) {
@@ -1866,7 +1862,7 @@ PeachHTML5Editor.prototype.collapse_whitespace = function(tree) {
                                if (block) {
                                        cb(null)
                                }
-                               if (n.children.length > 0) {
+                               if (n.children.length > 0 && plaintext_elements[n.name] == null) {
                                        iterate(n.children, cb)
                                }
                                if (block) {
@@ -2371,21 +2367,12 @@ PeachHTML5Editor.prototype.pretty_html = function(tree, indent, parent_flags) {
                                        is_br = true
                                }
                                is_text = false
-                               if (n.el.currentStyle != null) {
-                                       cs = n.el.currentStyle
-                                       whitespace = cs['white-space']
-                                       display = cs['display']
-                                       position = cs['position']
-                                       float = cs['float']
-                                       visibility = cs['visibility']
-                               } else {
-                                       cs = this.iframe.contentWindow.getComputedStyle(n.el, null)
-                                       whitespace = cs.getPropertyValue('white-space')
-                                       display = cs.getPropertyValue('display')
-                                       position = cs.getPropertyValue('position')
-                                       float = cs.getPropertyValue('float')
-                                       visibility = cs.getPropertyValue('visibility')
-                               }
+                               cs = this.iframe.contentWindow.getComputedStyle(n.el, null)
+                               whitespace = cs.getPropertyValue('white-space')
+                               display = cs.getPropertyValue('display')
+                               position = cs.getPropertyValue('position')
+                               float = cs.getPropertyValue('float')
+                               visibility = cs.getPropertyValue('visibility')
                                if (n.name === 'textarea') {
                                        inner_flags.pre_ish = true
                                } else {