rkondrup-project-11-Composition

sketch

// ryu kondrup
// rkondrup@andrew.cmu.edu
// sectionD
// assignment10A

// makeTurtle(x, y) -- make a turtle at x, y, facing right, pen down
// left(d) -- turn left by d degrees
// right(d) -- turn right by d degrees
// forward(p) -- move forward by p pixels
// back(p) -- move back by p pixels
// penDown() -- pen down
// penUp() -- pen up
// goto(x, y) -- go straight to this location
// setColor(color) -- set the drawing color
// setWeight(w) -- set line width to w
// face(d) -- turn to this absolute direction in degrees
// angleTo(x, y) -- what is the angle from my heading to location x, y?
// turnToward(x, y, d) -- turn by d degrees toward location x, y
// distanceTo(x, y) -- how far is it to location x, y?



//global variables
var brighten = 25;
var x = [];
var y = [];
var starSize = [];




//TURTLE CODE
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,
                  setColor: turtleSetColor, setWeight: turtleSetWeight,
                  face: turtleFace};
    return turtle;
}

//massive red world
function zoom1() {
    //to chase the other worlds
    t1.turnToward((t2.x + t3.x)/2,(t2.y + t3.y)/2, 1);
    t1.forward(sq(0.005*(68 - t1.distanceTo(t2.x, t2.y)/10)));
    t1.penUp();
    //for a dotted line, alternate penDown then penUp
    t1.turnToward((t2.x + t3.x)/2,(t2.y + t3.y)/2, 1);
    t1.forward(sq(0.005*(68 - t1.distanceTo(t2.x, t2.y)/10)));
    t1.penDown();

}
//medium orange world
function zoom2() {
    //to chase the other worlds
    t2.turnToward((t1.x + t3.x)/2,(t1.y + t3.y)/2, 1);
    t2.forward(5*sq(0.01*(68 - t2.distanceTo(t1.x, t1.y)/10)));
    t1.penUp();
    //for a dotted line, alternate penDown then penUp
    t2.turnToward((t1.x + t3.x)/2,(t1.y + t3.y)/2, 1);
    t2.forward(5*sq(0.01*(68 - t2.distanceTo(t1.x, t1.y)/10)));
    t1.penDown();

}

//tiny pink world
function zoom3() {
    //to chase the other worlds
    t3.turnToward((t1.x + t2.x)/2,(t1.y + t2.y)/2, 1);
    t3.forward(5*sq(0.02*(68 - t2.distanceTo(t1.x, t1.y)/10)));
    t1.penUp();
    //for a dotted line, alternate penDown then penUp
    t2.turnToward((t1.x + t3.x)/2,(t1.y + t3.y)/2, 1);
    t2.forward(5*sq(0.02*(68 - t2.distanceTo(t1.x, t1.y)/10)));
    t1.penDown();

}



function setup() {
    frameRate(60);
    createCanvas(480, 480);

//to put star positions and sizes into arrays
    for (var i = 0; i < 300; i++) {
        x.push(random(width));
        y.push(random(height));
        starSize.push(random(3));
    }

    //too many turtles ! define each turtle's start position
    t1 = makeTurtle(random(width/3, 2*width/3), random(height/3, 2*height/3));
    t2 = makeTurtle(random(width/3, 2*width/3), random(height/3, 2*height/3));
    t3 = makeTurtle(random(width/3, 2*width/3), random(height/3, 2*height/3));





    //to set the color and strokeweight of each turtle
    t1.setColor(color(28 + brighten, 38 + brighten, 79 + brighten));
    t1.setWeight(1);
    t2.setColor(color(28 + brighten, 38 + brighten, 79 + brighten));
    t2.setWeight(1);
    t3.setColor(color(28 + brighten, 38 + brighten, 79 + brighten));
    t3.setWeight(1);


}

function draw() {
    // var darkBlue = color(28, 38, 79);
    // var orange = color(237, 132, 45);
    // var red = color(201, 34, 80);
    // var purple = color(183, 62, 151);
    background(color(28, 38, 79));

//to draw same stars each frame
    for (var j = 0; j < x.length; j++) {
        fill(255);
        ellipse(x[j], y[j], starSize[j]);

    }

//to make the turtles each frame
    zoom1();
    zoom2();
    zoom3();
    noStroke();

    //massive red world
    fill(201, 34, 80); //red
    ellipse(t1.x, t1.y, 100); //massive
    //for the shine
    push();
    translate(-20, -15);
    fill(201 + brighten, 34 + brighten, 80 + brighten);
    rectMode(CENTER);
    rect(t1.x, t1.y, 12, 20, 5);
    pop();

    //medium orange world
    fill(237, 132, 45); //orange
    ellipse(t2.x, t2.y, 50); //medium
    //for the shine
    push();
    translate(-10, -7);
    fill(237 + brighten, 132 + brighten, 45 + brighten);
    rectMode(CENTER);
    rect(t2.x, t2.y, 4, 6, 2);
    pop();


    //tiny pink world
    fill(183, 62, 151); //purple
    ellipse(t3.x, t3.y, 20); //tiny
    //for the shine
    push();
    translate(-4, -4);
    fill(183 + brighten, 62 + brighten, 151 + brighten);
    ellipse(t3.x, t3.y, 2);
    pop();

}

In this project I wanted to challenge myself with the task of making turtles which interact with each other on the canvas. I eventually ended up with quasi-gravity, which i then expressed as shiny rubber planets zooming around the screen which speed up as they approach each other and slow down as they disperse. I am pretty happy with the result, and although it looks very simple in the end the process that took me to the end product was long and rife with console errors. In the future I would like to figure out how to prevent the edges of planets from intersecting, or maybe give them the ability to bounce off of each other.

Leave a Reply