* index.html: add parsing demo.

Author: JoshuaGrams

demo.js

@@ -0,0 +1,64 @@
+var forest_to_html;
+(function(){
+	'use strict';
+
+	// -------------------------------------------------------------------
+	// Convert parse forest to nested HTML tables
+
+	forest_to_html = function forest_to_html(f) {
+		if(!f) return;
+
+		var result;
+		if(f.hasOwnProperty('next')) {  // Derivation list 
+			result = table();
+			while(f) {
+				var child = children_to_html(f);
+				if(child.nodeName.toLowerCase() !== 'tr') {
+					child = tr(td(child));
+				}
+				result.appendChild(child);
+				f = f.next;
+			}
+		} else if(f.tag.rule) {  // LR(0) item
+			result = children_to_html(f);
+		} else {                 // Symbol item
+			result = children_to_html(f);
+			if(result) {
+				if(result.nodeName.toLowerCase() !== 'tr') {
+					result = tr(td(result));
+				}
+				var tag = td(text(f.tag));
+				tag.colSpan = result.cells.length;
+				tag = table(tr(tag));
+				tag.appendChild(result);
+				result = tag;
+			} else result = text(f.tag);
+		}
+		return result;
+	}
+
+	function children_to_html(f) {
+		var left = forest_to_html(f.left);
+		var right = forest_to_html(f.right);
+		if(left && right) {
+			if(left.nodeName.toLowerCase() !== 'tr') left = tr(td(left));
+			left.appendChild(td(right));
+			return left;
+		} else return left || right;
+	}
+
+
+	// -------------------------------------------------------------------
+	// Misc HTML helpers
+
+	function elt(name, child) {
+		var e = document.createElement(name);
+		if(child) e.appendChild(child);
+		return e;
+	}
+	function table(node) { return elt('table', node); }
+	function tr(node) { return elt('tr', node); }
+	function td(node) { return elt('td', node); }
+	function text(str) { return document.createTextNode(str); }
+
+})();

index.html

@@ -42,6 +42,7 @@ <h1>A Pint-sized Earley Parser</h1>
         <li><a href="#algorithm">The Algorithm</a></li>
     </ul>
     <li><a href="#parser">The Parser</a></li>
+	<li><a href="#demo">A Trivial Demonstration</a></li>
     <li><a href="#future">Future Work</a></li>
 </ul>
 
@@ -288,19 +289,44 @@ <h2><a name="parser">The Parser</a></h2>
 
 
 
+<h2><a name="demo">A Trivial Demonstration</a></h2>
+
+<pre><code>g = Grammar('S',
+	S -&gt; X X b
+	X -&gt;
+	X -&gt; a
+	X -&gt; a a
+	X -&gt; a a a)
+
+parse(g, 'aaab')</code></pre>
+
+<div id="forest"></div>
+<script src="demo.js"></script>
+<script>
+var g = new Grammar('S', [
+		new Rule('S', ['X', 'X', 'b']),
+		new Rule('X', []),
+		new Rule('X', ['a']),
+		new Rule('X', ['a', 'a']),
+		new Rule('X', ['a', 'a', 'a'])
+		]);
+var f = g.parse('aaab');
+
+var div = document.getElementById('forest');
+var tree = forest_to_html(f);
+tree.className = 'center';
+div.appendChild(tree);
+</script>
+
+
 <h2><a name="future">Future Work</a></h2>
 
-<p>I'm excited about finally getting this to work, so I'm writing this
-up and posting it right away.  But this is just the core parsing
-algorithm: I want to at <em>least</em> write a parse forest visualizer
-and set up a page with a demo grammar where you can enter text and see
-the resulting forest.</p>
-
-<p>And to be really usable at all it needs a means to enter grammars in
-a convenient notation, a way to choose a parse tree from the forest, and
-a way to attach actions to rules.  I hope to get to this soon, but
-realistically it might be a month or three before I get around to
-finishing all of it.</p>
+<p>I'm excited about finally getting this algorithm figured out and running, so
+I'm writing it up and posting it right away.  But to be really usable at all it
+needs a means to enter grammars in a convenient notation, a way to choose a
+parse tree from the forest, and a way to attach actions to rules.  I hope to
+get to this soon, but realistically it might be a month or three before I get
+around to finishing all of it.</p>
 
 </div>