Add first pass at a usable editor
authorAryeh Gregor <AryehGregor+gitcommit@gmail.com>
Thu, 11 Aug 2011 14:55:07 -0600
changeset 518 c4ef24e60c09
parent 517 fd94a293e4cd
child 519 2dea04282819
Add first pass at a usable editor

Very crude for now. I have to clean up tons of the selection handling,
which I designed only for autoimplementation.html.
editor.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/editor.html	Thu Aug 11 14:55:07 2011 -0600
@@ -0,0 +1,34 @@
+<!doctype html>
+<script src=implementation.js></script>
+<style>
+p, ol, ul, blockquote {
+	margin-top: 0;
+	margin-bottom: 0;
+}
+</style>
+<title>Specification-based rich text editor</title>
+
+<button onclick='myExecCommand("bold")'><b>B</b></button>
+<button onclick='myExecCommand("italic")'><i>I</i></button>
+<button onclick='myExecCommand("underline")'><u>U</u></button>
+<button onclick='myExecCommand("strikethrough")'><s>S</s></button>
+
+<button onclick='myExecCommand("subscript")'>X<sub>S</sub></button>
+<button onclick='myExecCommand("superscript")'>X<sup>S</sup></button>
+
+<div
+contenteditable
+style="border: inset 2px #ccc;min-height:20em"
+onkeypress="handleKeyPress(event); return false"
+>Hello</div>
+
+<script>
+function handleKeyPress(e) {
+	var code = String.fromCharCode(e.charCode);
+	if (e.keyCode == 13) {
+		// Gecko has charCode == 0 in this case
+		code = "\n";
+	}
+	myExecCommand("insertText", false, code);
+}
+</script>