String Art Bike

//Nakshatra Menon
//Section C

function setup() {
    createCanvas(400, 300);
    background(200);
}

var bikeWheel = 50;
var heightGround = 250;
var wheel = 1
var numLines = 10
var color3 = 100
var cactusX = 500
var cactusY = 200

function draw() {
    background(246, 235, 216);
    var skyX = 0
    var skyX2 = 600
    var skyY2 = 125 
    for (var skyY = 0; skyY<250; skyY+= 8){           //drawing the lines for sky 
        strokeWeight(.5);
        stroke(71, 61, color3)
        line(skyX, skyY, skyX2, skyY2);
    }

    var x1 = 0;
    var y1 = 300;
    var x2 = 400;
    var y2 = 250;
    var y3 = 275
    //ground 
    for (var y1=300; y1>=250; y1+=-2) {               //ground right up 
        stroke(159, 135, 94);
        strokeWeight(1); 
        line(x1, y1, x2, y2);
    }
    for (var y2; y2<= 300; y2 +=2){     //ground left up 
        stroke(82, 66, 38);
        strokeWeight(1); 
        line(x1, y1, x2, y2);
    }
    for(var y3 = 275; y3 <= 300; y3 +=2){     //ground across 
        stroke(198, 184, 153);
        line(x1, y3, x2, y3);
    }
    //cactus
    fill(53, 68, 52);
    ellipse(cactusX-20, cactusY, 35, 15);       // left
    ellipse(cactusX+20, cactusY-20, 45, 15);   // right arm
    ellipse(cactusX-35, cactusY-12, 10, 25); // top left 
    ellipse(cactusX, cactusY, 20, 100);     //main 
    ellipse(cactusX+40, cactusY-30, 5, 15);  //right top 

    // bike wheel arcs 
    noFill();
    strokeWeight(7);
    stroke(115, 45, 4);
    arc(100, heightGround-bikeWheel-5, 2*bikeWheel, 2*bikeWheel, radians(190), radians(0));   // arc on left tire 
    arc(300, heightGround-bikeWheel-5, 2*bikeWheel, 2*bikeWheel, radians(190), radians(0));   //arc on right tire  
    // bike from right wheel   
    push();
    translate(300, heightGround-bikeWheel);             //moving wheel to correct place
    rotate(radians(-163))       // rotating line 9 degrees evertime it draws a new line
    line(0,0,60,bikeWheel+45);  
    line(50, bikeWheel+45, 70, bikeWheel+55 )     // far handle              // drawing vertical line 
    line(60, bikeWheel+45,80, bikeWheel+45)       // close handle 
    pop();
    // bike from left wheel   
    push();
    translate(100, heightGround-bikeWheel);             //moving origin to correct place
    rotate(radians(-163))       // rotating lines
    line(-60,bikeWheel-30,-150,bikeWheel+70);          // across
    line(0,0,-60,bikeWheel-30);           // line to the line holding seat                                       // drawing vertical line 
    line(-60, bikeWheel-30, -20, 90)      // line holding up seat
    push();
    rotate(radians(-30));
    ellipse(-60, 70, 60, 6);
    pop();
    line(0,0,-30,bikeWheel+15);           // line 2 to the line holding seat
    line(-30,bikeWheel+15, -150, bikeWheel+70);    //across 2
    pop(); 

    // bike wheel left 
    if(wheel <= 1){
        for(var i=0; i<4*numLines; i += 1){          // how many times it runs (4*numlines to get it to 360)
            stroke(64, 38, 22);                          // shade of brown
            strokeWeight(.5); 
            push();
            translate(100, heightGround-bikeWheel);             //moving wheel to correct place
            rotate(radians((i/2)*180/numLines))       // rotating line 9 degrees evertime it draws a new line
            line(0,0,0,bikeWheel);                    // drawing vertical line 
            pop();
        }
    }
    if ( wheel <= 2 & wheel > 1){
        for( var i=0; i<6*numLines; i += 1){          // how many times it runs (4*numlines to get it to 360)
            stroke(64, 38, 22);                          // shade of brown
            strokeWeight(.5); 
            push();
            translate(100, heightGround-bikeWheel);             //moving wheel to correct place
            rotate(radians((i/3)*180/numLines))       // rotating line 9 degrees evertime it draws a new line
            line(0,0,0,bikeWheel);                    // drawing vertical line 
            pop();
        }
    }

    // bike wheel right
    if(wheel <= 1){
        for(var i=0; i<4*numLines; i += 1){          // how many times it runs (4*numlines to get it to 360)
            stroke(64, 38, 22);                          // shade of brown
            strokeWeight(.5); 
            push();
            translate(300, heightGround-bikeWheel);             //moving wheel to correct place
            rotate(radians((i/2)*180/numLines))       // rotating line 9 degrees evertime it draws a new line
            line(0,0,0,bikeWheel);                    // drawing vertical line 
            pop();
        }
    }
    if ( wheel <= 2 & wheel > 1){
        for( var i=0; i<6*numLines; i += 1){          // how many times it runs (4*numlines to get it to 360)
            stroke(64, 38, 22);                          // shade of brown
            strokeWeight(.5); 
            push();
            translate(300, heightGround-bikeWheel);             //moving wheel to correct place
            rotate(radians((i/3)*180/numLines))       // rotating line 9 degrees evertime it draws a new line
            line(0,0,0,bikeWheel);                    // drawing vertical line 
            pop();
        }
    }

    //bike tire left 
    push();
    noFill();
    strokeWeight(4);
    stroke(64, 38, 22)
    translate(100, heightGround-bikeWheel);
    circle(0,0,2*bikeWheel);                      // drawing the tire 
    pop();
    //bike tire right 
    push();
    noFill();
    strokeWeight(4);
    stroke(64, 38, 22)
    translate(300, heightGround-bikeWheel);
    circle(0,0,2*bikeWheel);                       
    pop();

    wheel += .1                                   // wheels move 
    if (wheel > 2){
        wheel = 0;
    }

    color3 += .5                                  // color of sky changes 
    if (color3 > 300){
        color3 = 100
    }

    cactusX += -5                                // cactus moves 
    if (cactusX < -100){
        cactusX = 500
    }
}