X-Git-Url: https://jasonwoof.com/gitweb/?a=blobdiff_plain;f=editor.coffee;h=0a023966681c6f41007be3e38be6cb2a692b4cd1;hb=d78c8fb078ffe27653da73aaf9800cc0b8228fc1;hp=a5cd8d6fb2d4635d21b82cb246b072975c15f7a7;hpb=2c684978b6657acd19ac5a1a6016ed5761a260d2;p=peach-html5-editor.git diff --git a/editor.coffee b/editor.coffee index a5cd8d6..0a02396 100644 --- a/editor.coffee +++ b/editor.coffee @@ -197,6 +197,8 @@ outer_css = (args) -> ret += 'body {' ret += 'margin: 0;' ret += 'padding: 0;' + ret += 'color: black;' + ret += 'background: white;' ret += '}' ret += '#wrap1 {' ret += "border: #{occupy 1}px solid black;" @@ -242,17 +244,19 @@ outer_css = (args) -> ret += '}' ret += '#cursor {' ret += 'position: absolute;' - ret += 'height: 1em;' # FIXME adjust for hight of text ret += 'width: 2px;' - ret += 'background: #444;' - ret += '-webkit-animation: blink 1s steps(2, start) infinite;' - ret += 'animation: blink 1s steps(2, start) infinite;' + ret += 'background: linear-gradient(0deg, rgba(0,0,0,1), rgba(255,255,255,1), rgba(0,0,0,1), rgba(255,255,255,1), rgba(0,0,0,1), rgba(255,255,255,1), rgba(0,0,0,1), rgba(255,255,255,1), rgba(0,0,0,1));' + ret += 'background-size: 200% 200%;' + ret += '-webkit-animation: blink 1s linear normal infinite;' + ret += 'animation: blink 1s linear normal infinite;' ret += '}' ret += '@-webkit-keyframes blink {' - ret += 'to { visibility: hidden; }' + ret += '0%{background-position:0% 0%}' + ret += '100%{background-position:0% -100%}' ret += '}' - ret += '@keyframes blink {' - ret += 'to { visibility: hidden; }' + ret += '@keyframes blink { ' + ret += '0%{background-position:0% 0%}' + ret += '100%{background-position:0% -100%}' ret += '}' ret += '.ann_box {' ret += 'z-index: 5;' @@ -618,6 +622,7 @@ class PeachHTML5Editor @cursor_visible = false @poll_for_blur_timeout = null @iframe_offset = null + @iframe_height = null opt_fragment = @options.fragment ? true @parser_opts = {} if opt_fragment @@ -639,6 +644,7 @@ class PeachHTML5Editor setTimeout (=> @init() unless @inited), 200 # firefox never fires this onload @outer_idoc.body.appendChild( domify @outer_idoc, div: id: 'wrap1', children: [ + domify @outer_idoc, div: style: "position: absolute; top: 0; left: 1px; font-size: 10px", children: [ domify @outer_idoc, text: "Peach HTML5 Editor" ] @wrap2 = domify @outer_idoc, div: id: 'wrap2', children: [ domify @outer_idoc, div: id: 'wrap3', children: [ @iframe @@ -679,8 +685,11 @@ class PeachHTML5Editor # so add a tag @idoc.head.appendChild domify @idoc, base: href: this_url_sans_path() if @options.css_file - # TODO test this - @idoc.head.appendChild domify @idoc, link: rel: 'stylesheet', type: 'text/css', href: @options.css_file + istyle = domify @idoc, link: rel: 'stylesheet', type: 'text/css', href: @options.css_file + '?foo=baz' + istyle.onload = => + @adjust_iframe_height() + @idoc.head.appendChild istyle + @idoc.head.appendChild domify @idoc, style: children: [domify @idoc, text: "body { overflow: hidden; }"] @load_html @in_el.value @inited = true if @options.on_init? @@ -807,8 +816,15 @@ class PeachHTML5Editor @in_el.value = @pretty_html @tree @in_el.onchange = => @load_html @in_el.value - @iframe.style.height = "0" - @iframe.style.height = "#{@idoc.body.scrollHeight}px" + @adjust_iframe_height() + adjust_iframe_height: -> + h = parseInt(@idoc.body.scrollHeight, 10) + if @iframe_height isnt h + @iframe_height = h + s = @wrap2.scrollTop + @iframe.style.height = "0" + @iframe.style.height = "#{h}px" + @wrap2.scrollTop = s kill_cursor: -> # remove it, forget where it was if @cursor_visible @cursor_el.parentNode.removeChild @cursor_el