JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
fix stopping of event propegation/default
[peach-html5-editor.git] / editor.coffee
index c70ebbe..b7406dd 100644 (file)
@@ -22,6 +22,8 @@ TYPE_TEXT = peach_parser.TYPE_TEXT
 TYPE_COMMENT = peach_parser.TYPE_COMMENT
 TYPE_DOCTYPE = peach_parser.TYPE_DOCTYPE
 
+timeout = (ms, cb) -> return setTimeout cb, ms
+
 debug_dot_at = (doc, x, y) ->
        return # disabled
        el = doc.createElement 'div'
@@ -56,6 +58,19 @@ is_display_block = (el) ->
        else
                return window.getComputedStyle(el, null).getPropertyValue('display') is 'block'
 
+# pass a node (not an element) for a tag
+# returns if this is the sort of tag that cares about leading/trailing whitespace
+# FIXME this probably doesn't work all the time
+is_whitespace_significant = (n) ->
+       if n.name is 'textarea'
+               return true
+       if n.name is 'pre'
+               return true
+       if n.el.currentStyle?
+               return n.el.currentStyle['white-space'].substr(0, 3) is 'pre'
+       else
+               return window.getComputedStyle(n.el, null).getPropertyValue('white-space').substr(0, 3) is 'pre'
+
 # Pass return value from dom event handlers to this.
 # If they return false, this will addinionally stop propagation and default.
 event_return = (e, bool) ->
@@ -139,35 +154,70 @@ void_elements = {
        track: true
        wbr: true
 }
-dom_to_html = (dom) ->
+# TODO make these always pretty-print (on the inside) like blocks
+no_text_elements = { # these elements never contain text
+       select: true
+       table: true
+       tr: true
+       thead: true
+       tbody: true
+}
+# FIXME terminology: s/dom/tree/; s/el/n/
+tree_to_html = (tree, indent = '', parent_is_block = false) ->
        ret = ''
-       for el in dom
-               switch el.type
+       for n, i in tree
+               switch n.type
                        when TYPE_TAG
-                               ret += '<' + el.name
+                               is_block = is_display_block n.el
+                               if is_block
+                                       is_tiny_block = false
+                                       if is_whitespace_significant n
+                                               is_tiny_block = true
+                                       else
+                                               if n.children.length is 1
+                                                       if n.children[0].type is TYPE_TEXT
+                                                               if n.children[0].text.length < 35
+                                                                       is_tiny_block = true
+                               if is_block or (parent_is_block and i is 0)
+                                       ret += indent
+                               ret += '<' + n.name
                                attr_keys = []
-                               for k of el.attrs
+                               for k of n.attrs
                                        attr_keys.unshift k
                                #attr_keys.sort()
                                for k in attr_keys
                                        ret += " #{k}"
-                                       if el.attrs[k].length > 0
-                                               ret += "=\"#{enc_attr el.attrs[k]}\""
+                                       if n.attrs[k].length > 0
+                                               ret += "=\"#{enc_attr n.attrs[k]}\""
                                ret += '>'
-                               unless void_elements[el.name]
-                                       if el.children.length
-                                               ret += dom_to_html el.children
-                                       ret += "</#{el.name}>"
+                               unless void_elements[n.name]?
+                                       if is_block
+                                               next_indent = indent + '    '
+                                       else
+                                               next_indent = indent
+                                       if n.children.length
+                                               if is_block and not is_tiny_block
+                                                       ret += "\n"
+                                               ret += tree_to_html n.children, next_indent, is_block and not is_tiny_block
+                                               if is_block and not is_tiny_block
+                                                       ret += indent
+                                       ret += "</#{n.name}>"
+                               if is_block or (parent_is_block and i is tree.length - 1)
+                                       ret += "\n"
                        when TYPE_TEXT
-                               ret += enc_text el.text
+                               if parent_is_block and i is 0
+                                       ret += indent
+                               ret += enc_text n.text
+                               if parent_is_block and i is tree.length - 1
+                                       ret += "\n"
                        when TYPE_COMMENT
-                               ret += "<!--#{el.text}-->"
+                               ret += "<!--#{n.text}-->"
                        when TYPE_DOCTYPE
-                               ret += "<!DOCTYPE #{el.name}"
-                               if el.public_identifier? and el.public_identifier.length > 0
-                                       ret += " \"#{el.public_identifier}\""
-                               if el.system_identifier? and el.system_identifier.length > 0
-                                       ret += " \"#{el.system_identifier}\""
+                               ret += "<!DOCTYPE #{n.name}"
+                               if n.public_identifier? and n.public_identifier.length > 0
+                                       ret += " \"#{n.public_identifier}\""
+                               if n.system_identifier? and n.system_identifier.length > 0
+                                       ret += " \"#{n.system_identifier}\""
                                ret += ">\n"
        return ret
 
@@ -452,7 +502,6 @@ tree_remove_empty_text_nodes = (tree) ->
                        if n.text.length is 0
                                empties.unshift n
                return false
-       console.log empties
        for n in empties
                # don't completely empty the tree
                if tree.length is 1
@@ -460,11 +509,9 @@ tree_remove_empty_text_nodes = (tree) ->
                                console.log "oop, leaving a blank node because it's the only thing"
                                return
                n.el.parentNode.removeChild n.el
-               console.log 'removing'
                for c, i in n.parent.children
                        if c is n
                                n.parent.children.splice i, 1
-                               console.log 'removed'
                                break
 
 # pass a array of nodes (from parser library, ie it should have .el and .text)
@@ -640,15 +687,15 @@ class PeachHTML5Editor
        init: -> # called by @iframe's onload (or timeout on firefox)
                @idoc = @iframe.contentDocument
                @overlay.onclick = (e) =>
-                       return event_return @onclick e
+                       return event_return e, @onclick e
                @overlay.ondoubleclick = (e) =>
-                       return event_return @ondoubleclick e
+                       return event_return e, @ondoubleclick e
                @outer_idoc.body.onkeyup = (e) =>
-                       return event_return @onkeyup e
+                       return event_return e, @onkeyup e
                @outer_idoc.body.onkeydown = (e) =>
-                       return event_return @onkeydown e
+                       return event_return e, @onkeydown e
                @outer_idoc.body.onkeypress = (e) =>
-                       return event_return @onkeypress e
+                       return event_return e, @onkeypress e
                if @options.stylesheet
                        # TODO test this
                        @idoc.head.appendChild domify @idoc, style: src: @options.stylesheet
@@ -764,9 +811,8 @@ class PeachHTML5Editor
                tree_dedup_space @tree
                @changed()
        changed: ->
-               # FIXME don't export cursor placeholder (when cursor is between space characters)
                @in_el.onchange = null
-               @in_el.value = dom_to_html @tree
+               @in_el.value = tree_to_html @tree
                @in_el.onchange = =>
                        @load_html @in_el.value
                @iframe.style.height = "0"
@@ -782,13 +828,12 @@ class PeachHTML5Editor
                        console.log "error: tried to move cursor to position that has no pixel location", cursor[0], cursor[1]
                        return
                @cursor = cursor
-               # replace cursor, to reset blink animation
+               # replace cursor element, to reset blink animation
                if @cursor_visible
                        @cursor_el.parentNode.removeChild @cursor_el
                @cursor_el = domify @outer_idoc, div: id: 'cursor'
                @overlay.appendChild @cursor_el
                @cursor_visible = true
-               # TODO figure out x,y coords for cursor
                @cursor_el.style.left = "#{loc.x + overlay_padding - 1}px"
                @cursor_el.style.top = "#{loc.y + overlay_padding}px"