0
@@ -1,5 +1,8 @@
0
 * Architecture
0
-- decouple driver from demo
0
+- turn driver into an object
0
+
0
+* Literacy
0
+- namespaces
0
 - css for styling
0
 
0
 * Language
0
@@ -13,8 +16,10 @@
0
 * Features
0
 - inline syntax errors
0
 - syntax coloring
0
+- jquery plugin
0
+- svg back end
0
 
0
-* Errors checking
0
+* Error checking
0
 - unknown rules
0
 - "s 1 2 3"
0
 - "s 1 s 2 3"

0
@@ -1,8 +1,22 @@
0
 /* Copyright 2008 by Oliver Steele.  All rights reserved. */
0
 
0
 $(function() {
0
-    setup($("#canvas")[0]);
0
+    CFDG.Driver.setup({
0
+        canvas: $("#canvas")[0],
0
+        onstart: function() { $('body').addClass('rendering') },
0
+        onstop: function() { $('body').removeClass('rendering') },
0
+        onstatus: function(msg) {
0
+	        $('#statusField').html(msg);
0
+        },
0
+        onerror: function(msg) {
0
+            alert(msg);
0
+        }
0
+    });
0
     var rendering = false;
0
-    $('#renderButton').click(doRender);
0
-    $('#stopButton').click(stopRendering);
0
+    $('#renderButton').click(function() {
0
+        CFDG.Driver.start($('#sourceField')[0].value);
0
+    });
0
+    $('#stopButton').click(function() {
0
+        CFDG.Driver.stop();
0
+    });
0
 });

0
@@ -3,12 +3,6 @@
0
 var canvas;
0
 var ctx;
0
 
0
-function setup(canvasElement) {
0
-    canvas = canvasElement;
0
-    ctx = canvas.getContext("2d");
0
-    ctx.save();
0
-}
0
-
0
 var Stats;
0
 var NewBounds;
0
 
0
@@ -121,91 +115,100 @@ Graphics.prototype.setRGBA = function (rgba) {
0
   this.ctx.globalAlpha = rgba[3];
0
 };
0
 
0
-function doRender() {
0
-	model = new Model;
0
-	var sourceText = document.getElementById("sourceField").value;
0
-	var err = lex(sourceText, new Parser(new Builder(model)));
0
-	if (err) {
0
-		var msg = "syntax error at \'" + err.token + "\' on line " + err.lineno + ": " + err.message;
0
-		alert(msg);
0
-		return;
0
-	}
0
-	drawingContext = new Context(model); // global
0
-	drawingContext.transform.m[1][1] *= -1;
0
-	model.randomGenerator = new RepeatableRandom;
0
-    var graphics = drawingContext.graphics;
0
-	graphics.setCanvas(document.getElementById("canvas"));
0
-    graphics.reset();
0
-    graphics.rescale = 0.25;
0
-	var tm = drawingContext.transform.m;
0
-	//tm[0][0] = tm[1][1] = 20;
0
-	//tm[1][1] *= -1;
0
-	//drawingContext.stats.cutoff *= Math.abs(tm[0][0] * tm[1][1]);
0
-	//drawingContext.stats.cutoff /= 100;
0
-    bounds = new Bounds(0, 0, 0, 0);
0
-	drawingContext.graphics.setViewport(bounds);
0
-	drawingContext.graphics.bounds = bounds;
0
-	Stats = {
0
-        startTime: (new Date).getTime(),
0
-        shapeCount: 0,
0
-        resetCount: 0
0
-    };
0
-	model.draw(drawingContext);
0
-	drawNext();
0
-	document.getElementById('renderButton').style.display = 'none';
0
-	document.getElementById('stopButton').style.display = 'inline';
0
-}
0
-
0
-function drawNext() {
0
-    if (drawingContext == null) return; // if stopRendering has been called
0
-    var graphics = drawingContext.graphics;
0
-    var oldBounds = graphics.viewport;
0
-    var newBounds = graphics.bounds;
0
-	if (!newBounds.equals(oldBounds)) {
0
-        var w = newBounds.xmax - newBounds.xmin;
0
-        var h = newBounds.ymax - newBounds.ymin;
0
-        var rescale = graphics.rescale;
0
-        graphics.rescale += 0.05;
0
-        if (newBounds.xmin < oldBounds.xmin) newBounds.xmin -= rescale * w;
0
-        if (newBounds.ymin < oldBounds.ymin) newBounds.ymin -= rescale * h;
0
-        if (newBounds.xmax > oldBounds.xmax) newBounds.xmax += rescale * w;
0
-        if (newBounds.ymax > oldBounds.ymax) newBounds.ymax += rescale * h;
0
-		//info("scale to " + Bounds.xmin + ", " + Bounds.ymin + ", " + Bounds.xmax + ", " + Bounds.ymax);
0
-        w = newBounds.xmax - newBounds.xmin;
0
-        h = newBounds.xmax - newBounds.xmin;
0
-        var ar = w / h;
0
-        var car = graphics.canvas.width / graphics.canvas.height;
0
-        //if (ar > car) 
0
-		graphics.setViewport(newBounds);
0
-        graphics.bounds = newBounds;
0
-		drawingContext.queue = [];
0
-		model.randomGenerator.rewind();
0
-		Stats.shapeCount = 0;
0
-		Stats.resetCount += 1;
0
-		model.draw(drawingContext);
0
-	}
0
-	drawingContext.flush(100);
0
-	
0
-	var t0 = Stats.startTime;
0
-    var t1 = (new Date).getTime();
0
-    var msg = "Rendered " + Stats.shapeCount + " shapes in " + Math.round((t1-t0)/1000) + "s.";
0
-    if (drawingContext.queue.length)
0
-		msg += "  " + drawingContext.queue.length + " expansions remaining.";
0
-	if (Stats.resetCount) msg += " (Reset bounds " + Stats.resetCount + " time"+(Stats.resetCount==1?'':'s')+".)";
0
-	$('#statusField').html(msg);
0
-	
0
-	if (drawingContext.queue.length)
0
-		setTimeout(drawNext, 10);
0
-	else
0
-		stopRendering();
0
-}
0
-
0
-function stopRendering() {
0
-	if (drawingContext.queue.length)
0
-		$('#statusField').html("<font color='#ff0000'>Stopped rendering</font> at " + Stats.shapeCount + " shapes after " + Math.round(((new Date).getTime() - Stats.startTime)/1000) + "s, with " + drawingContext.queue.length + " expansions remaining.");
0
-	
0
-	drawingContext.queue = [];
0
-    drawingContext = null;
0
-	document.getElementById('renderButton').style.display = '';
0
-	document.getElementById('stopButton').style.display = 'none';
0
-}
0
+var CFDG = window.CFDG || {};
0
+
0
+CFDG.Driver = {
0
+    setup: function(options) {
0
+        this.options = options;
0
+        canvas = options.canvas;
0
+        ctx = canvas.getContext("2d");
0
+        ctx.save();
0
+    },
0
+    
0
+    start: function(sourceText) {
0
+	    model = new Model;
0
+	    var err = lex(sourceText, new Parser(new Builder(model)));
0
+	    if (err) {
0
+		    var msg = "syntax error at \'" + err.token + "\' on line " + err.lineno + ": " + err.message;
0
+		    this.options.onerror(msg);
0
+		    return;
0
+	    }
0
+	    drawingContext = new Context(model); // global
0
+	    drawingContext.transform.m[1][1] *= -1;
0
+	    model.randomGenerator = new RepeatableRandom;
0
+        var graphics = drawingContext.graphics;
0
+	    graphics.setCanvas(canvas);
0
+        graphics.reset();
0
+        graphics.rescale = 0.25;
0
+	    var tm = drawingContext.transform.m;
0
+	    //tm[0][0] = tm[1][1] = 20;
0
+	    //tm[1][1] *= -1;
0
+	    //drawingContext.stats.cutoff *= Math.abs(tm[0][0] * tm[1][1]);
0
+	    //drawingContext.stats.cutoff /= 100;
0
+        bounds = new Bounds(0, 0, 0, 0);
0
+	    drawingContext.graphics.setViewport(bounds);
0
+	    drawingContext.graphics.bounds = bounds;
0
+	    Stats = {
0
+            startTime: (new Date).getTime(),
0
+            shapeCount: 0,
0
+            resetCount: 0
0
+        };
0
+	    model.draw(drawingContext);
0
+        (this.options.onstart||function(){})();
0
+	    this.step();
0
+    },
0
+
0
+    step: function() {
0
+        if (drawingContext == null)
0
+            // not rendering
0
+            return;
0
+        var graphics = drawingContext.graphics,
0
+            oldBounds = graphics.viewport,
0
+            newBounds = graphics.bounds;
0
+	    if (!newBounds.equals(oldBounds)) {
0
+            var w = newBounds.xmax - newBounds.xmin;
0
+            var h = newBounds.ymax - newBounds.ymin;
0
+            var rescale = graphics.rescale;
0
+            graphics.rescale += 0.05;
0
+            if (newBounds.xmin < oldBounds.xmin) newBounds.xmin -= rescale * w;
0
+            if (newBounds.ymin < oldBounds.ymin) newBounds.ymin -= rescale * h;
0
+            if (newBounds.xmax > oldBounds.xmax) newBounds.xmax += rescale * w;
0
+            if (newBounds.ymax > oldBounds.ymax) newBounds.ymax += rescale * h;
0
+            w = newBounds.xmax - newBounds.xmin;
0
+            h = newBounds.xmax - newBounds.xmin;
0
+            var ar = w / h;
0
+            var car = graphics.canvas.width / graphics.canvas.height;
0
+            //if (ar > car) 
0
+		    graphics.setViewport(newBounds);
0
+            graphics.bounds = newBounds;
0
+		    drawingContext.queue = [];
0
+		    model.randomGenerator.rewind();
0
+		    Stats.shapeCount = 0;
0
+		    Stats.resetCount += 1;
0
+		    model.draw(drawingContext);
0
+	    }
0
+	    drawingContext.flush(100);
0
+	    
0
+	    var t0 = Stats.startTime,
0
+            t1 = new Date().getTime();
0
+        var msg = "Rendered " + Stats.shapeCount + " shapes in " + Math.round((t1-t0)/1000) + "s.";
0
+        if (drawingContext.queue.length)
0
+		    msg += "  " + drawingContext.queue.length + " expansions remaining.";
0
+	    if (Stats.resetCount) msg += " (Reset bounds " + Stats.resetCount + " time"+(Stats.resetCount==1?'':'s')+".)";
0
+	    this.options.onstatus(msg);
0
+	    
0
+	    if (drawingContext.queue.length)
0
+		    setTimeout(function() {CFDG.Driver.step()}, 10);
0
+	    else
0
+		    this.stop();
0
+    },
0
+
0
+    stop: function() {
0
+	    if (drawingContext.queue.length)
0
+	        this.options.onstatus("<font color='#ff0000'>Stopped rendering</font> at " + Stats.shapeCount + " shapes after " + Math.round(((new Date).getTime() - Stats.startTime)/1000) + "s, with " + drawingContext.queue.length + " expansions remaining.");
0
+	    
0
+	    drawingContext.queue = [];
0
+        drawingContext = null;
0
+        (this.options.onstop||function(){})();
0
+    }
0
+}
0
\ No newline at end of file