Project 4

var dx1; 
var dy1; 
var dx2; 
var dy2; 

var dxOne;
var dyOne;
var dxTwo;
var dyTwo; 

var numLine = 50;
var numLineTwo = 40;

function setup() {
    createCanvas(400, 300);
    background(18, 77, 26);
    
    strokeWeight(2);
    // all lines two pixels wide 

    dx1 = (150-50)/numLine;
    dy1 = (300-50)/numLine;
    dx2 = (350-300)/numLine;
    dy2 = (100-300)/numLine;
    

    dxOne = (400 - 340)/numLineTwo;
    dyOne = (200 - 0)/numLineTwo;
    dxTwo = (50 - 220)/numLineTwo;
    dyTwo = (80 - 0)/numLineTwo;
}

function draw() {

    var x1 = 5;
    var y1 = 115;
    var x2 = 180;
    var y2 = 175;
    // x and y values for left shape and vert lines

    for(i  = 0; i <= numLine; i++) {
        stroke(232, 221, 202);
        line(x1, y1, x2, y2);
            x1 += dx1 + 5;
            y1 += dy1;
            x2 += dx2 - 2;
            y2 += dy2 - 4;
    } // draw left shape, advance by one pixel

    for(i = 0; i <= numLine; i+= 4) {
        stroke(16, 46, 14);
        line(x1, y1, x2, y2);
            x1 += dx2 + 80;
            y1 += dy1 + 120;
            x2 += dx1;
            y2 += dy2;
    } // draw right side vert lines, advance by four pixels

    var xOne = 120;
    var yOne = 0;
    var xTwo = 300;
    var yTwo = 20;
    // x and y values for orange shape

    for(i = 0; i <= numLineTwo; i ++) {
        stroke(122, 65, 15);
        line(xOne, yOne, xTwo, yTwo);
            xOne += dxOne;
            yOne += dyOne;
            xTwo += dxTwo;
            yTwo += dyTwo;
    } // draw orange shape
    
    noLoop();
}