Project 5- Wallpaper

Graham Murtha

Section A

For the wallpaper, I tried to recreate a typical celtic cross pattern, which is made of overlapping and interlocking loops and cusps.

sketch
// Graham Murtha
//Section A
//gmurtha@andrew.cmu.edu
//Project 05- CELTIC CROSS!!


var cell = 80; // cell size 

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

function draw() {
    background(0, 60, 20);
    for (var y = -60; y < height +60; y += 80){
        for (var x = -60; x < width +60; x += 80){
        knot(x, y);
        }
    }
    noLoop();
}


function knot(x, y){
    push();
    translate(x, y);

    noFill()
    // base circle outline
    stroke(0);
    strokeWeight(6);
    ellipse(0,0,cell-5);

    //base circle color fill
    stroke(120,130,0);
    strokeWeight(4);
    ellipse(0,0,cell-3)


    //center circle outline
    stroke(0);
    strokeWeight(6);
    ellipse(0,0,cell/3)
     //center circle color
    stroke(120,130,0);
    strokeWeight(2);
    ellipse(0,0,cell/3)

    // TINY center circle outline 
    stroke(0);
    strokeWeight(4);
    ellipse(0,0,cell/6)
    // TINY center circle color 
    stroke(120,130,0);
    strokeWeight(1);
    ellipse(0,0,cell/6)

stroke(0)
    strokeWeight(4)

    
    //crossing leaf shape OUTLINES (rotated in all 4 quadrants)
    beginShape();
    curveVertex(0,0);
    curveVertex(cell/4,cell/8);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/8,cell/4);
    curveVertex(0,0);
    endShape();

    rotate(radians(90))
    beginShape();
    curveVertex(0,0);
    curveVertex(cell/4,cell/8);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/8,cell/4);
    curveVertex(0,0);
    endShape();

    rotate(radians(90))
    beginShape();
    curveVertex(0,0);
    curveVertex(cell/4,cell/8);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/8,cell/4);
    curveVertex(0,0);
    endShape();

    rotate(radians(90))
    beginShape();
    curveVertex(0,0);
    curveVertex(cell/4,cell/8);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/8,cell/4);
    curveVertex(0,0);
    endShape();


    stroke(120,130,0)
    strokeWeight(2)

    
    //crossing leaf shape FILLS (rotated in all 4 quadrants)
    beginShape();
    curveVertex(0,0);
    curveVertex(cell/4,cell/8);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/8,cell/4);
    curveVertex(0,0);
    endShape();

    rotate(radians(90))
    beginShape();
    curveVertex(0,0);
    curveVertex(cell/4,cell/8);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/8,cell/4);
    curveVertex(0,0);
    endShape();

    rotate(radians(90))
    beginShape();
    curveVertex(0,0);
    curveVertex(cell/4,cell/8);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/8,cell/4);
    curveVertex(0,0);
    endShape();

    rotate(radians(90))
    beginShape();
    curveVertex(0,0);
    curveVertex(cell/4,cell/8);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/2,cell/2);
    curveVertex(cell/8,cell/4);
    curveVertex(0,0);
    endShape();



    strokeWeight(5)
    stroke(0);
  // central lobe OUTLINE - wide ellipses
    rotate(radians(45));
    arc(0,0,cell*sqrt(2)/2,cell/2,radians(0),radians(180));
    arc(0,0,cell*sqrt(2)/2,cell/2, radians(180),radians(0));

    rotate(radians(90));
    arc(0,0,cell*sqrt(2)/2,cell/2,radians(0),radians(180));
    arc(0,0,cell*sqrt(2)/2,cell/2, radians(180),radians(0));

    strokeWeight(3)
    stroke(120,130,0);

    // central lobe FILL- wide ellipses
    rotate(radians(90));
    arc(0,0,cell*sqrt(2)/2,cell/2,radians(0),radians(180));
    arc(0,0,cell*sqrt(2)/2,cell/2, radians(180),radians(0));

    rotate(radians(90));
    arc(0,0,cell*sqrt(2)/2,cell/2,radians(0),radians(180));
    arc(0,0,cell*sqrt(2)/2,cell/2, radians(180),radians(0));
   
    pop();
    noLoop();
}


   

Leave a Reply