use {x,y} instead of {left,top}

[peach-html5-editor.git] / editor.coffee

diff --git a/editor.coffee b/editor.coffee
index 863d1ff..34a8b39 100644 (file)
--- a/editor.coffee
+++ b/editor.coffee
@@ -19,8 +19,20 @@ TYPE_TEXT = peach_parser.TYPE_TEXT
 TYPE_COMMENT = peach_parser.TYPE_COMMENT
 TYPE_DOCTYPE = peach_parser.TYPE_DOCTYPE
 
+# text nodes don't have getBoundingClientRect(), so wrap it in a span, measure
+# and then put it back
+get_text_bounding_rect = (el) ->
+       span = el.ownerDocument.createElement 'span'
+       el.parentNode.replaceChild span, el
+       span.appendChild el
+       ret = span.getBoundingClientRect()
+       span.parentNode.replaceChild el, span
+       return ret
 get_el_bounds = (el) ->
-       rect = el.getBoundingClientRect()
+       if el.getBoundingClientRect
+               rect = el.getBoundingClientRect()
+       else
+               rect = get_text_bounding_rect el
        doc = el.ownerDocument.documentElement
        win = el.ownerDocument.defaultView
        y_fix = win.pageYOffset - doc.clientTop
@@ -32,7 +44,7 @@ get_el_bounds = (el) ->
                h: rect.height ? (rect.top - rect.bottom)
        }
 
-# figure out the top/left coordinates of where the cursor should be if it's at
+# figure out the x/y coordinates of where the cursor should be if it's at
 # position ``i`` within text node ``n``
 #
 # implementation: insert a span tag where we want the cursor, and ask the
@@ -75,13 +87,13 @@ cursor_to_loc = (n, i) ->
                parent.insertBefore n.el, els[0]
                for el in els
                        parent.removeChild el
-       ret = top: bounds.y, left: bounds.x
+       ret = x: bounds.x, y: bounds.y
        if plus_width
-               ret.left += bounds.w
+               ret.x += bounds.w
        # fudge case where bounds are BS because we're on non-significant whitespace
        if i > 0
                first = cursor_to_loc n, 0
-               if ret.left <= first.left
+               if ret.x <= first.x
                        # no need for a loop here, because recursion
                        ret = cursor_to_loc n, i - 1
        return ret
@@ -216,7 +228,7 @@ traverse_tree = (tree, state, cb) ->
                        traverse_tree c.children, state, cb
                        break if state.done?
        return state
-# find the next element in top (and decendants) that is after n and can contain text
+# find the next element in tree (and decendants) that is after n and can contain text
 # TODO make it so cursor can go places that don't have text but could
 find_next_cursor_position = (tree, n, i) ->
        if n? and n.type is TYPE_TEXT and n.text.length > i
@@ -254,16 +266,28 @@ find_loc_cursor_position = (tree, loc) ->
        console.log tree, loc
        for c in tree
                if c.type is TYPE_TAG or c.type is TYPE_TEXT
-                       # FIXME get_el_bounds doesn't work on TYPE_TEXT
                        bounds = get_el_bounds c.el
                        console.log bounds
-                       continue if loc.left < bounds.x
-                       continue if loc.left > bounds.x + bounds.w
-                       continue if loc.top < bounds.y
-                       continue if loc.top > bounds.y + bounds.h
+                       continue if loc.x < bounds.x
+                       continue if loc.x > bounds.x + bounds.w
+                       continue if loc.y < bounds.y
+                       continue if loc.y > bounds.y + bounds.h
                        if c.type is TYPE_TEXT
-                               # FIXME find position, don't just pass 0
-                               return [c, 0]
+                               # click is within bounding box that contains all text.
+                               return [c, 0] if c.text.length is 0
+                               #if c.text.length is 1
+                                       # definitely no linebreak in it
+                                       #if loc
+                               #
+                               # for inline elements, this can include text in other tags on
+                               # the first or last lines.
+                               #
+                               # they clicked on text. now determine where in the text
+                               tries = {}
+                               cur = Math.floor(c.text.length / 2)
+                               #loop
+                               #       xy = tries[cur] = cursor_to_loc c, cur
+                               return [c, cur]
                        if c.children.length
                                console.log "in"
                                ret = find_loc_cursor_position c.children, loc
@@ -312,7 +336,7 @@ class PeachHTML5Editor
 
                        @idoc.body.onclick = (e) =>
                                # idoc.body.offset().left/top
-                               new_cursor = find_loc_cursor_position @tree, left: e.pageX, top: e.pageY
+                               new_cursor = find_loc_cursor_position @tree, x: e.pageX, y: e.pageY
                                if new_cursor?
                                        @move_cursor new_cursor
                        @idoc.body.onkeyup = (e) =>
@@ -422,10 +446,10 @@ class PeachHTML5Editor
                @cursor_el = domify div: id: 'peach_html5_editor_cursor'
                @idoc.body.appendChild @cursor_el
                @cursor_visible = true
-               # TODO figure out top/left coords for cursor
+               # TODO figure out x,y coords for cursor
                loc = cursor_to_loc cursor[0], cursor[1]
-               @cursor_el.style.top = "#{loc.top}px"
-               @cursor_el.style.left = "#{loc.left}px"
+               @cursor_el.style.left = "#{loc.x}px"
+               @cursor_el.style.top = "#{loc.y}px"
 
 window.peach_html5_editor = (args...) ->
        return new PeachHTML5Editor args...