From: Jason Woofenden <jason@jasonwoof.com>
Date: Mon, 25 Jan 2016 22:14:11 +0000 (-0500)
Subject: preview in iframe, load_html method
X-Git-Url: https://jasonwoof.com/gitweb/?p=peach-html5-editor.git;a=commitdiff_plain;h=8709cb94761099e91b480781b64323b169130d3a

preview in iframe, load_html method
---

diff --git a/editor.coffee b/editor.coffee
index f4b7845..4805550 100644
--- a/editor.coffee
+++ b/editor.coffee
@@ -76,8 +76,18 @@ wysiwyg = (el, options = {}) ->
 	parser_opts = {}
 	if opt_fragment
 		parser_opts.fragment = 'body'
-	editor_instance = dom: wheic_parser.parse(el.value, parser_opts)
-	# el.value = dom_to_html dom
+	editor_instance = {
+		dom: wheic_parser.parse el.value, parser_opts
+		iframe: document.createElement('iframe')
+		load_html: (html) ->
+			@dom = wheic_parser.parse el.value, parser_opts
+	}
+	idoc = editor_instance.iframe.contentDocument
+	if options.stylesheet # TODO test this
+		istyle = idoc.createElement 'style'
+		istyle.setAttribute 'src', options.stylesheet
+		idoc.head.appendChild istyle
+	el.parentNode.appendChild editor_instance.iframe
 	return editor_instance
 
 window.wheic = {
diff --git a/editor_tests.coffee b/editor_tests.coffee
index 4b995bb..5777244 100644
--- a/editor_tests.coffee
+++ b/editor_tests.coffee
@@ -1,9 +1,13 @@
 in_el = document.getElementById 'in'
 out_el = document.getElementById 'out'
 button = document.getElementById 'button'
-button.onclick = ->
-	editor = wheic.wysiwyg in_el
-	out_el.value = wheic.dom_to_html editor.dom
+editor = null
+button.onclick = in_el.onchange = in_el.onkeyup = ->
+	if editor?
+		editor.load_html in_el
+	else
+		editor = wheic.wysiwyg in_el
+	editor.iframe.contentDocument.body.innerHTML = out_el.value = wheic.dom_to_html editor.dom
 	return false
 button.value="Cleanup"
 button.removeAttribute 'disabled'
diff --git a/editor_tests_coffee.html b/editor_tests_coffee.html
index b1c00fc..25bb3fc 100644
--- a/editor_tests_coffee.html
+++ b/editor_tests_coffee.html
@@ -17,7 +17,7 @@
 	<form action="#" method="get">
 	<p>In:<br><textarea rows="9" cols="22" name="in" id="in">&lt;p&gt;Normal &lt;strong&gt;Bold &lt;em&gt; Italic+Bold&lt;/strong&gt; Italic&lt;/em&gt; Normal&lt;/p&gt;</textarea></p>
 	<p><input id="button" type="submit" value="loading..." disabled></p>
-	<p>Out:<br><textarea rows="9" cols="22" name="out" id="out" readonly></textarea></p>
+	<p>Cleaned Up:<br><textarea rows="9" cols="22" name="out" id="out" readonly></textarea></p>
 		
 	</form>
 	<script src="parser.coffee" type="text/coffeescript"></script>