20220818 - OpenProcessing

mySketch.js
style.css
index.html
xxxxxxxxxx
 
/**********************************
 * dailycoding -20220818/ graphic
 * by E.C.H (Eiichi Ishii)
 **********************************/
​
let w, g;
let cp = ["#13334F", "#145C37", "#E28A1B", "#E31511", "#DE1E2A"];
​
function setup() {
  w = min(windowWidth, windowHeight);
  createCanvas(w, w);
  angleMode(DEGREES);
  rectMode(CENTER);
  noLoop();
​
  g = w / 8;
}
​
function draw() {
  background(0);
  push();
  translate(w / 2, w / 2);
​
  rotate(45);
  translate(-w, -w);
​
  for (let x = g / 2; x <= w * 2 - g / 2; x += g) {
    for (let y = g / 2; y <= w * 2 - g / 2; y += g) {
      push();
      translate(x, y);
      rotate(random([0, 90, -90, 180]));
      scale(random([-1, 1]), random([-1, 1]));
​
      stroke(255);
​
      let lr = g / 40;
​
      strokeWeight(lr);
      noFill();
​
      arc(0, -g / 2, g / 2, g / 2, 90, 180);
      arc(0, 0, g / 2, g / 2, 270, 90);
      arc(0, g / 2, g / 2, g / 2, 300, 360);
      arc(g / 4, g / 2, g, g, 180, 250);
      arc(g / 2, 0, g / 2, g / 2, 210, 270);
      arc(-g / 2, 0, g / 2, g / 2, 270, 360);
      line(-g / 4, 0, -g / 4, g / 4);
      arc(-g / 2, g / 2, g / 2, g / 2, 270, 360);
      line(g / 4, g / 4, g / 2, g / 4);
      arc(-g / 2, -g / 2, g * 1.5, g * 1.5, 0, 20);
​
      strokeWeight(lr / 2);
​
      if (int(random(2)) == 0) {
        if (int(random(2)) == 0) {
          fill(random(cp));
          ellipse(-g / 4, -g / 4, g / 7, g / 7);
          fill(random(cp));
          ellipse(0, 0, g / 4, g / 4);
        } else {
          if (int(random(2)) == 0) {
            fill(random(cp));
            ellipse(-g / 4, -g / 4, g / 7, g / 7);
          } else {
            fill(random(cp));
            ellipse(0, 0, g / 4, g / 4);
          }
        }
      } else {
        fill(random(cp));
        ellipse(-g / 12, -g / 12, g / 4, g / 4);
      }
​
      pop();
    }
  }
  pop();
  
  stroke(0);
  let rr = g/2;
  strokeWeight(rr);
  noFill();
  rect(w/2, w/2, w-rr/2, w-rr/2);
​
  let rw = w/10;
  rakkan(rw/2.5, w-rw/1.25, rw);
}
​
function rakkan(posx, posy, r) {
  push();
  translate(posx, posy);
  let nr = r / 2.5;
  let lr = r / 20;
​
  fill("#e2041b");
  noStroke();
  rectMode(CENTER);
  rect(0, 0, r / 1.4, r * 1.5, r / 5);
​
  stroke(255);
  strokeWeight(lr / 1.5);
  noFill();
​
  push();
  translate(0, -nr);
  beginShape();
  vertex(nr / 2, -nr / 2);
  vertex(0, -nr / 2);
  vertex(-nr / 2, 0);
  vertex(0, nr / 2);
  vertex(nr / 2, nr / 2);
  endShape();
​
  line(-nr / 2, 0, nr / 2, 0);
  pop();
​
  push();
  translate(0, 0);
  beginShape();
  vertex(nr / 2, -nr / 2);
  vertex(0, -nr / 2);
  vertex(-nr / 2, 0);
  vertex(0, nr / 2);
  vertex(nr / 2, nr / 2);
  endShape();
​
  strokeWeight(lr / 3);
  line(nr / 2, -nr / 2, -nr / 2, nr / 2);
  pop();
​
  push();
  translate(0, nr);
  line(-nr / 2, -nr / 2, -nr / 2, nr / 2);
  line(nr / 2, -nr / 2, nr / 2, nr / 2);
  line(-nr / 2, 0, nr / 2, 0);
​
  strokeWeight(lr / 3);
  line(nr / 2, -nr / 2, -nr / 2, nr / 2);
  pop();
  pop();
}
​
function keyPressed() {
  redraw();
}
​