Category: Section E

/*
Yingying Yan
Section E
yingyiny@andrew.cmu.edu
Project-11
*/
//make an array so i can draw more than one flower
var ttl = [2,2,2,2,2,2,2,2,2,2,2,2,2,2,2];

function setup() {
    createCanvas(480, 240);
    background(0);
    frameRate(10);
    //set up the make turtle 
    for(var i = 0; i < ttl.length; i++) {
    	ttl[i] = makeTurtle(random(width), random(height));
    }
}

function draw() {
	for(var i = 0; i < ttl.length; i++) {
		ttl[i].setWeight = (random(0.1,5));
    	ttl[i].setColor = (random(150), random(200), random(255));
    	//start drawing the flowers
		ttl[i].penDown();
		var dd = 4
		ttl[i].forward (dd);
		ttl[i].right(dd);
		ttl[i].right(dd);
		ttl[i].forward(dd);
		ttl[i].left(dd)
		ttl[i].forward(dd * i);
		ttl[i].left(150);
	}


}
//restart the drawing
function mousePressed(){
	background(0)
}

//////////////////////////////////////////////////////////////
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;
}

sketch

/* Jason Zhu
Section E
jlzhu@andrew.cmu.edu
Project 11
*/

var bigturtle;

function setup() {
    createCanvas(450, 450);
    // set color variables for background
    var cx = constrain(mouseX, 0, 480);
	var cy = constrain(mouseY, 0, 480);
	var red = cx * .3
	var green = cy * .3
	var blue = 100
    background(red * .3 - 15, green * .3 - 15, blue * .3 - 15);
    // set stroke settings
    strokeJoin(MITER);
    strokeCap(PROJECT);
    // create turtle and adjust settings
    bigturtle = makeTurtle(width / 2, height / 2);
    bigturtle.setColor(255);
    bigturtle.setWeight(2);
    bigturtle.penDown();
    frameRate(999);
}

function draw() {
		for (var i=0;i<1;i++){
    	turtle = makeTurtle(-25,-25)
    	turtle.penDown
    }
        // set color variables for turtle
        var cx = constrain(mouseX, 0, 450);
		var cy = constrain(mouseY, 0, 450);
    	var red = cx * .58
		var green = cy * .58
		var blue = 108
		turtle.setColor(color(red,green,blue))
		turtle.setWeight(mouseY/20)
		turtle.penDown()
		turtle.forward(mouseY)// move depending on the y position of the mouse.
		turtle.right(90) // turn turtle right.
		turtle.forward(mouseX) // move again depending ont he xposition of the mouse.
		turtle.left(90) // turn turtle left.
		turtle.back(mouseX) // move again depending ont he xposition of the mouse.
		turtle.right(90) // turn turtle right.
		turtle.back(mouseX) // move again depending ont he xposition of the mouse.
		turtle.left(90) // turn turtle left.
		turtle.back(mouseX) // move again depending ont he xposition of the mouse.
	}

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

For this project I wanted to try to create hallway compositions with p5.js. I devised the following system in order to replicate hallways under a compliment color scheme when a user draws a line diagonally. Overall, I found the project stimulating and particularly informative in the inner workings of how the turtle function runs.

sketch

/* Nina Lee Yoo
Section E
nyoo@andrew.cmu.edu
Project-11:A Composition*/

function setup() {
    createCanvas(480, 480);
    background(220);


    }


function draw() {

	for (var t=0;t<10;t++){
    	turtle = makeTurtle(0,0)
    	turtle.penDown
    }
	
		var r = (random(0,200));
		var g = (random(50,100));
		var b = (random(100,150));
		
	
	


		turtle.setColor(color(r,g,b))
		turtle.setWeight(1)
		turtle.penDown()
		turtle.forward(mouseX)// moving the initial fowards with them mouseX
		turtle.right(50)
		turtle.forward(mouseY) //movingthesecondfoward(creating longer lengthfor th first line)
		turtle.right(50)
		turtle.forward(100)
		turtle.right(mouseX)//(manipulating the end of the string)
		turtle.forward(100)
		turtle.right(20)
		turtle.forward(100)

		

}







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;}

It was cool seeing how if you changed the points on the turtle with mouseX or mouseY how it affected the whole drawing. It was difficult to grasp the concept at first due to my idea of turtles being static, but when doing the project it has helped me understand the underlying idea of turtle.