From 3910beefca580098ef9369fdb4fa425de82f8b83 Mon Sep 17 00:00:00 2001
From: Weston Ruter <westonruter@gmail.com>
Date: Sat, 5 May 2012 23:50:15 +1000
Subject: [PATCH] Adding writeup draft

---
 README.md | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 7bc94f6..9dff2be 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,17 @@
-This project provides a JavaScript library which allows you to create SVG images
-of tree structures directly in the browser. This is useful in depicting parse
-trees as are common in Linguistics and Computer Science.
+<h1>SVG Tree Drawer</h1>
 
-See example: http://weston.ruter.net/projects/svg-tree-drawer/example.html
\ No newline at end of file
+<p>This project provides a JavaScript library for constructing interactive SVG images of tree structures. This is useful in depicting parse trees as are common in linguistics and computer science. The library provides hooks for toggling the collapsing or extending branches in the tree.</p>
+
+<h2>Background</h2>
+
+<p>The first iteration of this project I developed back in 2004, and the <a href="http://westonruter.github.com/svg-tree-drawer/old/">old project page</a> with original demos is still available. In Autumn 2009 I took an online <a title="Linguistics 566: Introduction to Syntax for Computational Linguistics" href="http://courses.washington.edu/ling566/">syntax course</a> through the University of Washington's <a href="http://www.compling.uw.edu/"><abbr title="Professional Master's in Computational Linguistics">CLMA</abbr></a> program, and this course required a lot of tree drawing. Having previously created an SVG tree drawer, I wanted to do my homework using a browser-based technology instead of using LaTeX. However, since the course was about <abbr title="Head-driven Phrase Structure Grammar">HPSG</a>, each node in the tree was not a simple label as I had been used to, but rather a complex attribute-value matrix (AVM). So I set out to rewrite my SVG tree drawer to bring it up to date and to allow arbitrary content in each of the nodes so that I could use MathML to render the AVMs.</p>
+
+<h2>Examples</h2>
+
+<p>The following screenshots link to interactive SVG images of the examples:</p>
+
+<h3><a href="http://westonruter.github.com/svg-tree-drawer/">“The boy plays with the ball.”</a></h3>
+<p><a href="http://westonruter.github.com/svg-tree-drawer/"><img src="http://westonruter.github.com/svg-tree-drawer/example.png" alt="Tree of “The boy plays with the ball.”"></a></p>
+
+<h3><a href="http://westonruter.github.com/svg-tree-drawer/syntax-diagrammer/example-tree-with-avms.xhtml">“They seemed close to me.”</a></h3>
+<p><a href="http://westonruter.github.com/svg-tree-drawer/syntax-diagrammer/example-tree-with-avms.xhtml"><img src="http://westonruter.github.com/svg-tree-drawer/syntax-diagrammer/example-tree-with-avms.png" alt="Parse tree with AVMs for “They seemed close to me.”"></a></p>