(function(){
    var body = document.getElementsByTagName('body')[0];

    var canvas = document.createElement('canvas');
    canvas.width = 640;
    canvas.height= 640;
    body.appendChild(canvas);

    context = canvas.getContext('2d');

    context.save();
    context.translate(0, canvas.height);
    context.scale(1, -1);

    context.fillRect(0, 0, canvas.width, canvas.height);

    context.save();
    context.translate(0, 10);

    context.save();

    context.strokeStyle = 'white';
    context.lineWidth = 1;

    var stage = 5;
    var unit = canvas.width/ Math.pow(3, stage);

    context.beginPath();
    context.moveTo(0, 0);
    var multipliers = [0, 1, -2, 1];
    for (var index = 0; index < Math.pow(4, stage); index++) {
	var phase = index;
	while (phase > 0 && phase % 4 == 0) {
	    phase = phase / 4;
	}
	var multiplier = multipliers[phase % 4];
	var angle = multiplier * Math.PI/3;
	context.rotate(angle)
	context.translate(unit, 0);
	context.lineTo(0, 0);
    }

    context.stroke();

    context.restore();

    context.restore();

    context.restore();
})();

@@ -427,28 +427,198 @@
 te(0, 10);%0A%0A
+%0A
     
+var stage = 3;%0A    var multipliers = %5B0, 1, -2, 1%5D;%0A    var baseAngle = Math.PI/3;%0A    var unit = canvas.width/ Math.pow(3, stage);%0A    var m = multipliers.length;%0A%0A    
 context.save
@@ -686,77 +686,8 @@
  = 1
-;%0A%0A    var stage = 5;%0A    var unit = canvas.width/ Math.pow(3, stage)
 ;%0A%0A 
@@ -740,45 +740,8 @@
 0);%0A
-    var multipliers = %5B0, 1, -2, 1%5D;%0A
     
@@ -762,17 +762,17 @@
  = 0
-; index %3C
+, total =
  Mat
@@ -777,17 +777,17 @@
 ath.pow(
-4
+m
 , stage)
@@ -787,16 +787,31 @@
  stage);
+ index %3C total;
  index++
@@ -863,17 +863,17 @@
 phase %25 
-4
+m
  == 0) %7B
@@ -894,17 +894,17 @@
 phase / 
-4
+m
 ;%0A%09%7D%0A%09va
@@ -938,17 +938,17 @@
 phase %25 
-4
+m
 %5D;%0A%09var 
@@ -968,25 +968,25 @@
 plier * 
-Math.PI/3
+baseAngle
 ;%0A%09conte

differentiate between generic and specific parts