Category: Project-05-Wallpaper

// anabelle lee .-.
// section c
// kaylalee
// project 5

let firstSpiralX = [];
let firstSpiralY = [];

let secondSpiralX = [];
let secondSpiralY = [];

function setup() {
    createCanvas(600, 600);
}

function draw() {
    background(185, 70, 44);

    leftHalf();
    rightHalf();

    push();
    translate(450, 0);
    leftHalf();
    rightHalf();
    pop();

    push();
    translate(450, 0);
    leftHalf();
    rightHalf();
    pop();

    // for bouquets
    setBouquet();
    setOtherBouquet();

    noLoop();

}

/* my functions */
function setBouquet(x, y) {
    for (var centerX = 145; centerX < (width + 50); centerX += 460) {
        for (var centerY = 175; centerY < height; centerY += 350) {
            push(); 
            bigGlaze(centerX, centerY);
            pop();
        }
    }
}

function setOtherBouquet() {
for (var centerX = 380; centerX < width + 50; centerX += 460) {
        for (var centerY = 20; centerY < height; centerY += 350) {
            push(); 
            bigGlaze(centerX, centerY);
            pop();
        }
    }
}

function leftHalf() {
    for (var theta = 0; theta < height + 50; theta += 10) {
        glazeBud(-20 + 80*cos(radians(theta)), theta) ;
    }

    for (var theta = 0; theta < height + 50; theta += 30) {
        push(); 
        glazeLily(60 + 60*cos(radians(theta)), theta);
        pop();
    }

    for (var theta = 0; theta < height + 50; theta += 80) {
        push(); 
        glazeLinesLoop(30 + 60*cos(radians(theta)), theta);
        pop();
    }
}

function rightHalf() {
    for (var theta = 0; theta < height; theta += 10) {
        glazeBud(330 + -80*cos(radians(theta)), theta) ;
    }

    for (var theta = 0; theta < height; theta += 30) {
        push(); 
        glazeLily(250 + -60*cos(radians(theta)), theta);
        pop();
    }

    for (var theta = 0; theta < height; theta += 80) {
        push(); 
        glazeLinesLoop(280 + -60*cos(radians(theta)), theta);
        pop();
    }
}

function glazeLily(x, y) {

    // large petals
    push();
    translate(x, y);
    for(var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(36 + i*-72));
        largePetal(7, 25);
        pop();
    }

    // small petals
    for(var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(i*-72));
        smallPetal(5, 12.5);
        pop();
    } 
    fill(239, 233, 193);
    noStroke();
    circle(0, 0, 12.5)

    pop();
}

function smallPetal(w, h) {

    fill(232, 234, 238);
    stroke(232, 234, 238);

    beginShape(); // left half of smaller petal
    vertex(0, -h);
    bezierVertex(0 - w/10, -9*h/10, -2*w, -h/2, -2*w/3, 0);
    endShape();

    beginShape(); // right half of smaller petal
    vertex(0, -h);
    bezierVertex(0 + w/10, -9*h/10, 2*w, -h/2, 2*w/3, 0);
    endShape();

    triangle(-0.65*w, 0, 0, -h, 0.65*w, 0); // fill the smaller petal
}

function largePetal(w, h) {

    fill(114, 181, 223);
    stroke(148, 162, 228);

    beginShape(); //left half
    vertex(0, -h);
    bezierVertex(0 - w/9, -9*h/10, -1.5*w, -h/2, -w/3, 0);
    endShape();

    beginShape(); // right half
    vertex(0, -h);
    bezierVertex(0 + w/9, -9*h/10, 1.5*w, -h/2, w/3, 0);
    endShape();

    triangle(-w/3, 0, 0, -h, w/3, 0); // fill the smaller petal
}

function glazeBud(x, y) { 
    push();
    translate(x, y);
    for(var i = 0; i < 5; i += 1) {
        push();
        rotate(radians(i*72));
        glazeFragment(7, 7);
        pop();
    } pop();
}

function glazeFragment(w, h) { // only draws 1/5th of glazeBud

    // big circle
    fill(148, 162, 228);
    stroke(148, 162, 228);
    point(0, 0);
    arc(0, 0, 2*w, -2*h, radians(225), radians(315));

    // point arcs
    // left
    stroke(201, 208, 231);
    noFill();
    beginShape();
    vertex(0, -2*h/3);
    bezierVertex(-w/50, -4*h/8, -w/10, -3*h/8, -w/4, -h/3);
    endShape();

    // right
    beginShape();
    vertex(0, -2*h/3);
    bezierVertex(w/50, -4*h/8, w/10, -3*h/8, w/4, -h/3);
    endShape();

    fill(201, 208, 231);
    arc(0, 0, 4*w/5, 4*w/5, radians(225), radians(315));
    triangle(w/9, -h/4, 0, -2*h/3, -w/9, -h/4);

    // stamen
    stroke(130, 150, 255);
    fill(148, 162, 228);
    circle(-2*w/5,-h/2, w/8);
    circle(2*w/5, -h/2, w/8);
    line(-2*w/5, -h/2, 0, 0);
    line(2*w/5, -h/2, 0, 0);
}

function glazeLinesLoop(x, y) {
    push();
    translate(x, y);
    for (var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(i*72));
        glazeLines(10, 25);
        pop();
    } pop();
}

function glazeLines(w, h) {
    noFill();
    stroke(248, 237, 122);

    beginShape(); // left half of smaller petal
    vertex(0, -h);
    bezierVertex(0 - w/10, -9*h/10, -2*w, -h/2, -2*w/3, 0);
    endShape();

    beginShape(); // right half of smaller petal
    vertex(0, -h);
    bezierVertex(0 + w/10, -9*h/10, 2*w, -h/2, 2*w/3, 0);
    endShape();
}

function bigGlaze(x, y) {

    // large petals
    push();
    translate(x, y);
    for(var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(36 + i*-72));
        bigLargePetal(30, 50);
        pop();
    }

    // small petals
    for(var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(i*-72));
        bigSmallPetal(15, 40);
        pop();
    } 

    fill(239, 233, 193);
    noStroke();
    circle(0, 0, 25)

    pop();
}

function bigSmallPetal(w, h) {

    fill(117, 162, 191);
    stroke(200, 190, 255);

    beginShape(); // left half of smaller petal
    vertex(-30, -h);
    bezierVertex(-30 - w/10, -9*h/10, -2*w, -h/2, -2*w/3, 0);
    endShape();

    beginShape(); // right half of smaller petal
    vertex(-30, -h);
    bezierVertex(-30 + w/10, -9*h/10, 2*w, -h/2, 2*w/3, 0);
    endShape();

    triangle(-0.65*w, 0, 0, -h, 0.65*w, 0); // fill the smaller petal
}

function bigLargePetal(w, h) {

    fill(47, 95, 138);
    stroke(0, 51, 102);

    beginShape(); //left half
    vertex(-20, -h);
    bezierVertex(-20 - w/9, -9*h/10, -1.5*w, -h/2, -w/3, 0);
    endShape();

    beginShape(); // right half
    vertex(-20, -h);
    bezierVertex(0 + w/9, -9*h/10, 1.5*w, -h/2, w/3, 0);
    endShape();

    triangle(-w/3, 0, 0, -h, w/3, 0); // fill the smaller petal
}

//Michael Li
//Section C 
var radi = 30
function setup() {
    createCanvas(755, 630);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
    background (220);

}

function draw() {
    background(30, 28, 27);

    var color = 0; //set variable color
    //create a line with the for loop
    for (var x = 0; x <= width+80; x += 4.2*radi){
        color += 1; // increment color by 1
            if (color % 2 == 1){ // test color 
                stroke(255, 204, 51); //bright yellow
            } else {
                stroke(182, 156, 129); //grey
            }
        //create a grid
        for(var y = 0; y<= height+80; y += 4.2*radi){
            color += 1;
            //test for color
            if (color % 2 == 1){
                stroke(255, 204, 51); //bright yellow
            } else {
                stroke(182, 156, 129); //grey
            }
            //two if statements in each for loop creates the alternating color pattern
            pattern1(x, y); // call to draw function pattern 1
            print(color.toString());
            
        }
    }
    //draw a grid of pattern two
    //reposition x and y initial position
    for (var x = 63; x <= width + 80; x += 4.2*radi){
        for(var y = 0; y <= height + 80; y += 4.2*radi){

        pattern2(x, y); //draw pattern 2
    }
    }
   
    noLoop();//draw once
}
    var flip1 = 1; //set varibales for  flip
    var flip2 = 1;

function pattern1(x, y){
    strokeWeight(2); 
    noFill();
    //only stroke no fill

    push();

    translate(x, y); // translate object to input x and y

    //top and bottom semi circle
    arc(0, 0, radi*2, radi*2, PI+radians(7), 0-radians(7));
    arc(0, 0, radi*2, radi*2, 0+radians(7), PI-radians(7));
    //middle long line
    line(0-radi/1.3, 0, 0+radi/1.3, 0);

    var xSpaing = 3.5;//set a uniformed spacing

    //draw the same line 4 time
    for (var i = 0; i<= 4; i += 1){
        //test which loop number it is to flip the drawing
        if (i == 1 || i == 3){
            flip1 = -flip1; //on first and third loop, flip the x position
        } else if (i == 2){
            flip2 = -flip2; //on the second loop, flip the y position
        }
        line(0-flip1*radi/1.1, 0-(flip2*6), 
        0-flip1*radi/1.5, 0-(flip2*6)); // horizontal short
        line(0+(flip1*xSpaing), 0+(flip2*radi/1.1), 
        0+(flip1*xSpaing), 0+(flip2*radi/1.3)); //verticle short 1
        line(0+(flip1*xSpaing), 0+(flip2*radi/1.8), 
        0+(flip1*xSpaing), 0+(flip2*radi/2.5)); // verticle short 2, closer to middle
        line(0+(flip1*20), 0+(flip2*radi/2.5), 
        0+(flip1*xSpaing), 0+(flip2*radi/2.5)); // horizontal longer, at 4 corners
    }

    //middle line top and bottom
    line(0+radi/2.2, 0+6, 0-radi/2.2, 0+6); //bottom middle
    line(0+radi/2.2, 0-6, 0-radi/2.2, 0-6); //top middle

    //four small arcs
    arc(0, 0, radi*1.6, radi*1.6, radians(30), radians(63));
    arc(0, 0, radi*1.6, radi*1.6, radians(85+30), radians(85+63));
    arc(0, 0, radi*1.6, radi*1.6, radians(180+30), radians(180+63));
    arc(0, 0, radi*1.6, radi*1.6, radians(265+30), radians(265+63));
    pop();

    push();
    translate(x, y); //translate to input x and y
    rotate(radians(45)); // rotate around x, y by 45 degrees
    rectMode(CENTER); //draw rect around origin
    //draw rectangle to frame the pattern
    rect(0, 0, radi*3, radi*3);
        //draw 4 times
        for(var i = 0; i<=4; i +=1){
        //test for which loop increment
        if (i == 1 || i == 3){ //first and third flip the x position
            flip1 = -flip1;
        } else if (i == 2){ //second loop flip the y position
            flip2 = -flip2;
        }
        //draw 3 small squares by the corner of the big square
        //repeat for each corner using the for loop
        rect(flip1*1.5*radi, flip2*1.5*radi, radi, radi);
        rect(flip1*1.34*radi, flip2*1.34*radi, radi/4, radi/4);
        rect(flip1*0.9*radi, flip2*1.34*radi, radi/4, radi/4);
        rect(flip1*1.34*radi, flip2*0.9*radi, radi/4, radi/4);
   }
   pop()
}


//second pattern, new arguments g and h
function pattern2 (g, h){
    push();
    translate(g, h); // translate origin to g, h
    rotate(radians(45)); //rotate around origin by 45 degrees
    rectMode(CENTER); // set rectMode
    strokeWeight(2);
    stroke(255, 204, 51, 100); // grey line color
    fill(182, 156, 129, 100); // lower transparency
    rect (1.5*radi, 1.5*radi, radi*1.8, radi*1.8); // medium size square
    pop();

    push();
    translate(g, h);
    stroke(182, 156, 129);
    rectMode(CENTER);

    rect(0, 2.1*radi, radi/3, radi/3); // small square inside

    line(0, 0,  0, height); //verticle lines
    pop();
}