Project-11-Composition-Chickoff

sketch

//Cora Hickoff
//Section D
//chickoff@andrew.cmu.edu
//Project-11

function setup() {

    createCanvas(480, 480);
    background(200, 99, 88);

    textSize(15);
    fill(217, 255, 255);
    text("Click the Canvas!", 10, 20);
   
    r = random(255);

      //lilac "spider legs"
      var t1 = makeTurtle(width/2, height/2);

      t1.setColor(color(179, 178, 134, 3));
      t1.setWeight(10);

    for (var p = 0; p < 100; p++) {

        t1.forward(p*3);
        t1.penDown();
        t1.right(147);
        t1.penUp();
        t1.penDown();

    //creates more dense "spider legs"
    for (var i = 0; i < width; i++) {

        t1.forward(6);
        t1.left(120);
        t1.right(90);
        t1.forward(90);
    }

    //creates less dense/sparser "spider legs"
    //(these are the circular shapes, which are not angular)
    for (var i = 0; i < width; i++) {

        t1.forward(6);
        t1.left(5);
        t1.right(9);
        t1.forward(6);
    }

        t1.penUp();

  } 
   
}

function mousePressed() {

    r = random(109);
    //dark red clouds
    var t2 = makeTurtle(mouseX, mouseY);

    t2.setColor(color(r, 0, 0, 35));
    t2.setWeight(30);

      for (var i = 0; i < 30; i++) {
          
          t2.forward(10);
          t2.forward(23);
          t2.right(random(1, 180));
          t2.forward(20);
          t2.right(78);

      }
      
      //light blue lines
      var t3 = makeTurtle(mouseX, mouseY);

      t3.setColor(color(191, 230, 255, 20));
      t3.setWeight(2);

    for (var p = 0; p < 100; p++) {

        t3.right(random(14, 26));
        t3.forward(.5);
        t3.right(random(3, 40));
        t3.forward(200);

    }
}

function turtleLeft(d) {
    this.angle -= d;
}

function turtleRight(d) {
    this.angle += d;
}

function turtleForward(p) {
    var rad = radians(this.angle);
    var newx = this.x + cos(rad) * p;
    var newy = this.y + sin(rad) * p;
    this.goto(newx, newy);
}

function turtleBack(p) {
    this.forward(-p);
}

function turtlePenDown() {
    this.penIsDown = true;
}

function turtlePenUp() {
    this.penIsDown = false;
}

function turtleGoTo(x, y) {
    if (this.penIsDown) {
      stroke(this.color);
      strokeWeight(this.weight);
      line(this.x, this.y, x, y);
    }
    this.x = x;
    this.y = y;
}

function turtleDistTo(x, y) {
    return sqrt(sq(this.x - x) + sq(this.y - y));
}

function turtleAngleTo(x, y) {
    var absAngle = degrees(atan2(y - this.y, x - this.x));
    var angle = ((absAngle - this.angle) + 360) % 360.0;
    return angle;
}

function turtleTurnToward(x, y, d) {
    var angle = this.angleTo(x, y);
    if (angle < 180) {
        this.angle += d;
    } else {
        this.angle -= d;
    }
}

function turtleSetColor(c) {
    this.color = c;
}

function turtleSetWeight(w) {
    this.weight = w;
}

function turtleFace(angle) {
    this.angle = angle;
}

function makeTurtle(tx, ty) {
    var turtle = {x: tx, y: ty,
                  angle: 0.0, 
                  penIsDown: true,
                  color: color(128),
                  weight: 1,
                  left: turtleLeft, right: turtleRight,
                  forward: turtleForward, back: turtleBack,
                  penDown: turtlePenDown, penUp: turtlePenUp,
                  goto: turtleGoTo, angleto: turtleAngleTo,
                  turnToward: turtleTurnToward,
                  distanceTo: turtleDistTo, angleTo: turtleAngleTo,
                  setColor: turtleSetColor, setWeight: turtleSetWeight,
                  face: turtleFace};
    return turtle;
}

When I began this project, I aimed to enjoy myself because the concept of Turtle Graphics is inherently fun. I knew that I wanted the program to be interactive, so I integrated the mousePressed function so that every time the user clicked, they would create these cloud/berry-shaped turtles. To make things more interesting, I added a randomness factor to the color and shape so that the canvas would never be uniform and the user would still have fun seeing what new turtles they create.