From: Jason Woofenden Date: Tue, 15 Mar 2016 21:26:28 +0000 (-0400) Subject: delay editable content loading 'til css is ready X-Git-Url: https://jasonwoof.com/gitweb/?p=peach-html5-editor.git;a=commitdiff_plain;h=b3b872ef2a2200cd1e674845f0215341c1e67bfd delay editable content loading 'til css is ready --- diff --git a/editor.coffee b/editor.coffee index 0a02396..a9d0a3c 100644 --- a/editor.coffee +++ b/editor.coffee @@ -609,9 +609,9 @@ class PeachHTML5Editor constructor: (in_el, options) -> @options = options ? {} @in_el = in_el - @tree = [] + @tree = null @matting = [] - @inited = false # when iframes have loaded + @init_1_called = false # when iframes have loaded @outer_iframe # iframe to hold editor @outer_idoc # "document" object for @outer_iframe @wrap2 = null # scrollbar is on this @@ -640,8 +640,9 @@ class PeachHTML5Editor @outer_idoc.head.appendChild icss @iframe = domify @outer_idoc, iframe: sandbox: 'allow-same-origin allow-scripts' @iframe.onload = => - @init() - setTimeout (=> @init() unless @inited), 200 # firefox never fires this onload + @init_1() + timeout 200, => # firefox never fires this onload + @init_1() unless @init_1_called @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" ] @@ -664,8 +665,23 @@ class PeachHTML5Editor @outer_iframe.setAttribute 'style', outer_iframe_style css = outer_css w: outer_bounds.w, h: outer_bounds.h outer_wrap.appendChild @outer_iframe - init: -> # called by @iframe's onload (or timeout on firefox) + init_1: -> # @iframe has loaded (but not it's css) @idoc = @iframe.contentDocument + @init_1_called = true + # chromium doesn't resolve relative urls as though they were at the same domain + # so add a tag + @idoc.head.appendChild domify @idoc, base: href: this_url_sans_path() + # don't let @iframe have scrollbars + @idoc.head.appendChild domify @idoc, style: children: [domify @idoc, text: "body { overflow: hidden; }"] + # load css file + if @options.css_file + istyle = domify @idoc, link: rel: 'stylesheet', href: @options.css_file + istyle.onload = => + @init_2() + @idoc.head.appendChild istyle + else + @init_2() + init_2: -> # @iframe and it's css file(s) are ready @overlay.onclick = (e) => @have_focus() return event_return e, @onclick e @@ -681,17 +697,7 @@ class PeachHTML5Editor @outer_idoc.body.onkeypress = (e) => @have_focus() return event_return e, @onkeypress e - # chromium doesn't resolve relative urls as though they were at the same domain - # so add a tag - @idoc.head.appendChild domify @idoc, base: href: this_url_sans_path() - if @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? @options.on_init() overlay_event_to_inner_xy: (e) ->