From 574513b9261fd9cbce8b5ce8c56a2f772c4fb3fa Mon Sep 17 00:00:00 2001
From: fjenett <fjenett@gmail.com>
Date: Wed, 15 Jun 2011 06:42:24 +0000
Subject: [PATCH] js mode example: render node tree graph

---
 .../DocumentObjectModel/nodeTree/forrest.js   | 13 +++
 .../DocumentObjectModel/nodeTree/nodeTree.pde | 88 +++++++++++++++++++
 2 files changed, 101 insertions(+)
 create mode 100644 javascript/examples/Environment/DocumentObjectModel/nodeTree/forrest.js
 create mode 100644 javascript/examples/Environment/DocumentObjectModel/nodeTree/nodeTree.pde

diff --git a/javascript/examples/Environment/DocumentObjectModel/nodeTree/forrest.js b/javascript/examples/Environment/DocumentObjectModel/nodeTree/forrest.js
new file mode 100644
index 000000000..50e970f84
--- /dev/null
+++ b/javascript/examples/Environment/DocumentObjectModel/nodeTree/forrest.js
@@ -0,0 +1,13 @@
+
+// wait for document to load
+window.onload = function () {
+    tryFindSketch();
+}
+
+function tryFindSketch () {
+    var sketch = Processing.instances[0];
+    if ( sketch == undefined )
+        return setTimeout(tryFindSketch, 200);
+    
+    sketch.setTree( document.body.parentNode );
+}
diff --git a/javascript/examples/Environment/DocumentObjectModel/nodeTree/nodeTree.pde b/javascript/examples/Environment/DocumentObjectModel/nodeTree/nodeTree.pde
new file mode 100644
index 000000000..cacf950a2
--- /dev/null
+++ b/javascript/examples/Environment/DocumentObjectModel/nodeTree/nodeTree.pde
@@ -0,0 +1,88 @@
+/**
+ *    Renders a simple graph from this documents node tree.
+ */
+ 
+ Node tree;
+ float tx, ty;
+ float growth = 0.1;
+ 
+ void setup ()
+ {
+     size( 500, 500 );
+     
+     tx = width/2;
+     ty = height-20;
+ }
+ 
+ void draw ()
+ {
+     background(255);
+     
+     if ( tree != null )
+     {
+         drawNode( tree, tx, ty, -HALF_PI, 200 );
+         
+         growth += 0.005;
+         growth = constrain(growth, 0, 1);
+     }
+     
+     textFont(createFont("Arial",10));
+ }
+ 
+ void drawNode ( Node n, float x, float y, float rad, int level )
+ {
+     fill(0);
+     noStroke();
+     ellipse(x,y,5,5);
+     
+     drawNodeLabel( n.nodeName, x+5, y );
+     
+     level *= 0.75;
+     
+     if ( n.childNodes != null && n.childNodes.length > 0 )
+     {
+         float l = n.childNodes.length;
+         float d = 90.0*growth/l;
+         float d2 = ((l-1)/2)*d;
+         
+         for ( int i = 0; i < l; i++ )
+         {
+             float r = radians(d * i - d2) + rad;
+             float nx = x + cos(r)*level*growth;
+             float ny = y + sin(r)*level*growth;
+             
+             stroke(0);
+             line(x,y,nx,ny);
+             
+             drawNode( n.childNodes[i], nx, ny, r, level );
+         }
+     }
+ }
+ 
+ void  drawNodeLabel ( String label, float x, float y )
+ {
+     float tw = textWidth(label);
+     
+     fill(200);
+     ellipse( x+10, y, 14, 14 );
+     ellipse( x+10+tw, y, 14, 14 );
+     rect( x+10, y-7, tw-2, 14 );
+     
+     fill(0);
+     text( label, x+10, y+3 );
+ }
+ 
+ void setTree ( Node root )
+ {
+     tree = root;
+ }
+ 
+ 
+ /* explain Node to Processing */
+ interface Node
+ {
+     Node[] childNodes;
+     String nodeName;
+     String nodeType;
+     Node parentNode;
+ }