Project 04 – String Art – srauch

//Sam Rauch / srauch / section B
//this code generates four "rainbow spiderwebs", one in each corner of the canvas,
//as long as the mouse is pressed. When the user presses the "e" key, the canvas
//erases. 

// two points of A line
var ax1;
var ay1;
var ax2;
var ay2;

// two points of B line
var bx1;
var by1;
var bx2;
var by2;

// endpoints of connecting lines
var x1; 
var y1;
var x2; 
var y2;


function setup() {
    createCanvas(400, 300);
    background(0);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {

    //draw spiderwebs in each quadrant of the canvas as long as mouse is pressed
    if (mouseIsPressed){
        strokeWeight(1);

        stringart();

        push();
        translate(200,0);
        stringart();
        pop();

        push();
        translate(200,150);
        stringart();
        pop();

        push();
        translate(0, 150);
        stringart();
        pop();
    }

    //erase canvas when user presses e key
    if (keyIsPressed){
        if (key == "e") {
            background(0);
        }
    }
}

//creates two lines, with 50 "stringers" between each line
function stringart() {
    //canvas size (200, 150)

    //randomly generate location of A line
    ax1 = random(10, 190);
    ay1 = random(10, 140);
    ax2 = random(10, 190);
    ay2 = random(10, 140);

    //randomly generate location of B line
    bx1 = random(10, 190);
    by1 = random(10, 140);
    bx2 = random(10, 190);
    by2 = random(10, 140);

    //assign first stringer's location connecting top of A and bottom of B
    x1 = ax1; 
    y1 = ay1;
    x2 = bx2;
    y2 = by2;

    //draw A line and B line in a random color
    stroke(random(255), random(255), random(255));
    line(ax1, ay1, ax2, ay2);
    line(bx1, by1, bx2, by2);
    strokeWeight(0.5);

    //draw 50 lines between A line and B line, incrementing 1/50th of distance between x values
    //and y values of each line
    for (var i = 0; i < 51; i+=1) {

        var x1Increment = (ax2- ax1) / 50;
        var y1Increment = (ay2 - ay1) / 50;
        var x2Increment = (bx1 - bx2) / 50;
        var y2Increment = (by1 - by2) / 50;

        //first stringer
        line (x1, y1, x2, y2);

        //changing position of stringer for each loop
        x1 += x1Increment;
        y1 += y1Increment;
        x2 += x2Increment;
        y2 += y2Increment;

    }

}