class ArtDecoSquare { // Constructor constructor(x, y) { this.x = x; this.y = y; } display() { push(); // Position the square translate(this.x, this.y); // **************** Design Begins ************************* stroke('#eed48a'); strokeWeight(5); // // Diamond line(400,600,485,515); line(485,515,485,435); line(400,600,315,515); line(315,515,315,435); line(315,435,400,350); line(485,435,400,350); // Interior diamond // Right side line(442, 558, 442, 518); line(442, 518, 400, 475); // Left side line(358, 558, 358, 518); line(358, 518, 400, 475); // Interior diamond thin lines stroke('#eed48a'); strokeWeight(2); line(400,600, 400, 475); // top of diamond line(400,600, 442, 518); // top right line(400,600, 442, 538); line(400,600, 358, 518); // top left line(400,600, 358, 538); // Two center lines right line(400,600, 372, 504); line(400,600, 386, 490); // Two center lines left line(400,600, 428, 504); line(400,600, 414, 490); point(358, 558); // Bottom left of diamond // Thick right line strokeWeight(5); line(421, 496, 485, 435); strokeWeight(6); line(418, 494, 481, 432); // Thick left line strokeWeight(5); line(315, 435, 379, 497); strokeWeight(6); line(319, 434, 382, 494); // Diagonal right line from right corner line(400, 475, 460, 415); // Diagonal left line from left corner line(400, 475, 340, 415); // Top right stripes strokeWeight(2); line(450, 425, 400, 370); strokeWeight(5); line(440, 435, 400, 390); // Top left stripes strokeWeight(2); line(350, 425, 400, 370); strokeWeight(5); line(360, 435, 400, 390); // Left line from bottom left corner line(315, 515, 273, 473); // Left line going north east line(273, 600, 333, 540); // Thin stripes left strokeWeight(2); line(273, 473, 273, 600); for (var i = 0; i < 7; i++) { line(323 - (i*7), 551 + (i*7), 323 - (i*7), 521 - (i*7)); } // Right line from bottom right corner, 42 pixels strokeWeight(5); line(485, 515, 527, 473); // Right line going south east, 85 pixels line(465, 540, 525, 600); // Thin stripes right strokeWeight(2); line(527, 473, 527, 600); for (var i = 0; i < 7; i++) { line(520 - (i*7), 480 + (i*7), 520 - (i*7), 593 - (i*7)); } // Diagonal line from second string on the left strokeWeight(5); line(315, 460, 287, 487); // Diagonal line from second string on the right strokeWeight(5); line(485, 460, 513, 487); // Diagonal line to top left corner line(273, 350, 340, 415); // Diagonal line to top right corner line(460, 415, 527, 350); // Left square fill("#eed48a"); beginShape(); vertex(308, 428); vertex(294, 414); vertex(308, 400); vertex(322, 414); vertex(308, 428); endShape(); noFill(); // Right square fill('#eed48a'); beginShape(); vertex(492, 428); vertex(506,414); vertex(492,400); vertex(478,414); vertex(492, 428); endShape(); noFill(); // Line to left box strokeWeight(2); line(280, 480, 280, 387); line(301, 407, 281, 387); // Line to right box strokeWeight(2); line(499,407, 520, 387); line(520, 480, 520, 387); // Top stripes left line(347, 404, 293, 350); line(356, 395, 311, 350); // Top stripes right line(453, 404, 507, 350); line(444, 395, 489, 350); // Bottom stripes left line(387, 591, 379, 600); line(378, 582, 360, 600); // Bottom stripes right line(409, 591, 418, 600); line(418, 582, 436, 600); // **************** Design Ends ************************* pop(); } } function setup() { createCanvas(windowWidth, windowHeight); background('#322e2d'); smooth(); noLoop(); } function kyomu(){} function moyou1(){ // 1st row // for (var i = 0; i < windowWidth; i++) { // let objArtDecoSquare; // Declare object // objArtDecoSquare = new ArtDecoSquare(-275 + (i*254), -350); // objArtDecoSquare.display(); // } // 2nd row for (let i = 1; i < 6; i++) { let objArtDecoSquare; // Declare object objArtDecoSquare = new ArtDecoSquare(-404 + (i*254), -0); objArtDecoSquare.display(); } // 3rd row // for (let i = windowWidth/16; i < windowWidth/16*15; i++) { // let objArtDecoSquare; // Declare object // objArtDecoSquare = new ArtDecoSquare(-279 + (i*254), 150); // objArtDecoSquare.display(); // } // 4th row // for (var i = 0; i < windowWidth; i++) { // let objArtDecoSquare; // Declare object // objArtDecoSquare = new ArtDecoSquare(-408 + (i*254), 400); // objArtDecoSquare.display(); // } } function moyou2(){ stroke('#eed48a') const segments =random(50,200); const radius = 600 for(let i = 0; i < segments; i++){ const t = TWO_PI / segments * i; const x = cos(t) *radius; const y = sin(t) * radius; line(windowWidth/2,windowHeight/16*2,windowWidth/2+x,windowHeight/16*2+y) line(windowWidth/2,windowHeight/16*2,windowWidth/2+x,windowHeight/16*2+y) } } function moyou3(){ strokeWeight(1) stroke('#eed48a') const segments =random(50,100); const radius = random(50,600) for(let i = 0; i < segments; i++){ const t = PI / segments * i; const x = cos(t) *radius; const y = sin(t) * radius; line(windowWidth/2,windowHeight/16*2,windowWidth/2+x,windowHeight/4+y) line(windowWidth/2,windowHeight/16*14,x+random(100,800),y) line(windowWidth/2,windowHeight/16*14,-x+random(100,800),y) } } function moyou4(){ stroke('#eed48a') const segments =random(50,200); const radius = 600 for(let i = 0; i < segments; i++){ const t = TWO_PI / segments * i; const x = cos(t) *radius; const y = sin(t) * radius; line(windowWidth/2,windowHeight/16*14,windowWidth/2+x,windowHeight/16*2+y) line(windowWidth/2,windowHeight/16*14,windowWidth/2+x,windowHeight/16*2+y) } } function waku1(){ stroke('#eed48a') line(windowWidth/4,windowHeight/16,windowWidth/4*3,windowHeight/16) line(windowWidth/4,windowHeight/16*15,windowWidth/4*3,windowHeight/16*15) } function waku2(){ noFill(); stroke('#eed48a') rect(windowWidth/4-30,windowHeight/16-30,60,60) rect(windowWidth/4-30,(windowHeight/16*15)-30,60,60) rect(windowWidth/4*3-30,windowHeight/16-30,60,60) rect(windowWidth/4*3-30,(windowHeight/16*15)-30,60,60) } function waku3(){ noFill(); stroke('#eed48a') rect(windowWidth/4-30,windowHeight/16-30,60,60) rect(windowWidth/4-30,(windowHeight/16*15)-30,60,60) rect(windowWidth/4*3-30,windowHeight/16-30,60,60) rect(windowWidth/4*3-30,(windowHeight/16*15)-30,60,60) fill('#eed48a') rect(windowWidth/2-40,windowHeight/16-60,80,80) rect(windowWidth/2-40,(windowHeight/16*15)-20,80,80) line(windowWidth/20,windowHeight/16,windowWidth/20,windowHeight/16*15) line(windowWidth/20+10,windowHeight/16,windowWidth/20+10,windowHeight/16*15) line(windowWidth/20*19,windowHeight/16,windowWidth/20*19,windowHeight/16*15) line(windowWidth/20*19-10,windowHeight/16,windowWidth/20*19-10,windowHeight/16*15) } function waku4(){ noFill(); stroke('#eed48a') rect(100,50,windowWidth-200,windowHeight-100) } function waku5(){ // 1st row for (let i = 1; i < 6; i++) { let objArtDecoSquare; // Declare object objArtDecoSquare = new ArtDecoSquare(-408 + (i*254), -400); objArtDecoSquare.display(); } // 4th row for (let i = 1; i < 6; i++) { let objArtDecoSquare; // Declare object objArtDecoSquare = new ArtDecoSquare(-408 + (i*254), 400); objArtDecoSquare.display(); } } function draw() { const moyouderu = Math.floor(random(0,5)) const wakuderu = Math.floor(random(0,5)) switch(moyouderu){ case 0: moyou2() break; case 1: moyou1() break; case 2: moyou2() break; case 3: moyou3() break; case 4: moyou4() break; } switch(wakuderu){ case 0: kyomu() break; case 1: waku1() break; case 2: waku2() break; case 3: waku3() break; case 4: waku5() break; } }