refactor crown drawing into separate classes

baumgen.js

@@ -2,97 +2,34 @@
 paper.install(window);
 
 
-var baum = {
-    length: 30,
-    angle: Math.PI / 2,
-    crown: {
-        shape: "kite",
-        length: 130,
-        width: 0.3,
-        bisect: 0.3,
-    },
-    forks: [
-        {
-            pos: 0.3,
-            branch: {
-                angle: 0.3,
-                length: 30,
-                crown: {
-                    shape: "kite",
-                    length: 50,
-                    width: 0.3,
-                    bisect: 0.3,
-                },
-                forks: [
-                    {
-                        pos: 0.6,
-                        branch: {
-                            angle: Math.PI/2.5,
-                            length: 40,
-                            crown: {
-                                shape: "kite",
-                                length: 70,
-                                width: 0.3,
-                                bisect: 0.3,
-                            },
-                        },
-                    }
-                ],
-            },
-        },
-        {
-            pos: 0.5,
-            branch: {
-                angle: 3*Math.PI /4,
-                length: 30,
-                crown: {
-                    shape: "kite",
-                    length: 50,
-                    width: 0.3,
-                    bisect: 0.3,
-                },
-            },
-        }
-    ],
-};
-
-
 function gen_tree(pos) {
     var baum = new Branch();
 
     baum.length = (20 + Math.random() * 20);
 
-    var shape;
+    var shapernd = Math.random();
-    if(Math.random() < 0.5) {
+    if(shapernd < 0.5) {
-        shape = "kite";
+        baum.crown = new KiteCrown(
+            70 + Math.random() * 30,
+            0.4 + Math.random() * 0.2,
+            0.3 + Math.random() * 0.1,
+        )
     } else {
-        shape = "triangle";
+        baum.crown = new TriangleCrown(
-    }
+            70 + Math.random() * 30,
-
+            0.4 + Math.random() * 0.2,
-    baum.crown = {shape: shape};
+        )
-    if(shape == "kite") {
-        baum.crown.length = (70 + Math.random() * 30);
-        baum.crown.width = 0.4 + Math.random() * 0.2;
-        baum.crown.bisect = 0.3 + Math.random() * 0.1;
-    } else if(shape == "triangle") {
-        baum.crown.length = (70 + Math.random() * 30);
-        baum.crown.width = 0.4 + Math.random() * 0.2;
-        //baum.crown.bisect = 0.3 + Math.random() * 0.1;
     }
 
     baum.angle = Math.PI / 2; // + Math.random() * 0.2 - 0.1;
 
-    if((shape == "kite") && (Math.random() < 0.5)) {
+    if((baum.crown.shape == "kite") && (Math.random() < 0.5)) {
+        var crown = baum.crown.clone();
+        crown.length *= 0.4;
         var b = {
             length: baum.length * 0.4,
             angle: Math.PI / 5 + Math.random() * 0.45,
-            crown: {
+            crown: crown
-                shape: "kite",
-                length: baum.crown.length * 0.4,
-                width: baum.crown.width,
-                bisect: baum.crown.bisect,
-                //bisect: 0.5,
-            }
         };
         baum.forks = [{
             pos: 0.2 + Math.random() * 0.4,
@@ -125,11 +62,82 @@ function gen_tree(pos) {
 }
 
 
+class Crown {
+    constructor(length, width, shape) {
+        this.width = width;
+        this.length = length;
+        this.shape = shape;
+    }
+
+    undraw() {
+        if(typeof this._path !== "undefined") {
+            this._path.removeSegments();
+            delete this._path;
+        }
+    }
+}
+
+
+class KiteCrown extends Crown {
+    constructor(length, width, {bisect = 0.3}) {
+        super(length, width, 'kite');
+        this.bisect = bisect;
+    }
+
+    clone() {
+        return new KiteCrown(this.length, this.width, {bisect: this.bisect});
+    }
+
+    draw(branch, bvec, cpos) {
+        this.undraw();
+        var cvec = bvec.multiply(1/bvec.length * this.length);
+        var bswidth = this.length * this.width;
+        var bsvec = new Point(Math.sin(branch.angle) * bswidth / 2,
+                              Math.cos(branch.angle) * bswidth / 2);
+        this._path = new Path();
+        this._path.strokeColor = 'black';
+        this._path.fillColor = 'white';
+        this._path.strokeWidth = 2;
+        this._path.closed = true;
+        this._path.add(cpos);
+        this._path.add(cpos.add(cvec.multiply(this.bisect)).add(bsvec));
+        this._path.add(cpos.add(cvec));
+        this._path.add(cpos.add(cvec.multiply(this.bisect)).subtract(bsvec));
+    }
+}
+
+
+class TriangleCrown extends Crown {
+    constructor(length, width) {
+        super(length, width, 'triangle');
+    }
+
+    clone() {
+        return new TriangleCrown(this.length, this.width);
+    }
+
+    draw(branch, bvec, cpos) {
+        this.undraw();
+        var cvec = bvec.multiply(1/bvec.length * this.length);
+        var bswidth = this.length * this.width;
+        var bsvec = new Point(Math.sin(branch.angle) * bswidth / 2,
+                              Math.cos(branch.angle) * bswidth / 2);
+        this._path = new Path();
+        this._path.strokeColor = 'black';
+        this._path.fillColor = 'white';
+        this._path.strokeWidth = 2;
+        this._path.closed = true;
+        this._path.add(cpos.add(bsvec));
+        this._path.add(cpos.add(cvec));
+        this._path.add(cpos.subtract(bsvec));
+    }
+}
+
+
 class Branch {
     constructor(data, parentBranch=null) {
         //this.parentBranch = parentBranch;
         Object.assign(this, data);
-        console.log(this);
         if(typeof this.forks !== "undefined") {
             for (let fork of this.forks) {
                 fork.branch = new Branch(fork.branch, this);
@@ -138,10 +146,6 @@ class Branch {
     }
 
     draw(pos) {
-        if(typeof this._crown !== "undefined") {
-            this._crown.removeSegments();
-            delete this._crown;
-        }
         if(typeof this._branch !== "undefined") {
             this._branch.removeSegments();
             delete this._branch;
@@ -157,44 +161,7 @@ class Branch {
         this._branch.add(end);
 
         if(typeof this.crown !== "undefined") {
-            console.log("CROWN");
+            this.crown.draw(this, bvec, end);
-            if(this.crown.shape == "kite") {
-                console.log("KITE");
-                var cvec = bvec.multiply(1/bvec.length * this.crown.length);
-                var bswidth = this.crown.length * this.crown.width;
-                var bsvec = new Point(Math.sin(this.angle) * bswidth / 2,
-                                      Math.cos(this.angle) * bswidth / 2);
-                this._crown = new Path();
-                this._crown.strokeColor = 'black';
-                this._crown.fillColor = 'white';
-                this._crown.strokeWidth = 2;
-                this._crown.closed = true;
-                //this._crown.selected = true;
-                this._crown.add(end);
-                this._crown.add(end.add(cvec.multiply(this.crown.bisect))
-                                      .add(bsvec));
-                this._crown.add(end.add(cvec));
-                this._crown.add(end.add(cvec.multiply(this.crown.bisect))
-                                      .subtract(bsvec));
-                console.log(this._crown);
-                
-            } else if(this.crown.shape = "triangle") {
-                console.log("TRIANGLE");
-                var cvec = bvec.multiply(1/bvec.length * this.crown.length);
-                var bswidth = this.crown.length * this.crown.width;
-                var bsvec = new Point(Math.sin(this.angle) * bswidth / 2,
-                                      Math.cos(this.angle) * bswidth / 2);
-                this._crown = new Path();
-                this._crown.strokeColor = 'black';
-                this._crown.fillColor = 'white';
-                this._crown.strokeWidth = 2;
-                this._crown.closed = true;
-                //this._crown.selected = true;
-                this._crown.add(end.add(bsvec));
-                this._crown.add(end.add(cvec));
-                this._crown.add(end.subtract(bsvec));
-                console.log(this._crown);
-            }
         }
 
         if(typeof this.forks !== "undefined") {
@@ -205,7 +172,8 @@ class Branch {
 
     }
     collides_crown(other) {
-        return this._crown.intersects(other._crown);
+        return false;
+        //return this._crown.intersects(other._crown);
     }
 }