// https://slides.com/sojamo/generative-type-l2-2021/fullscreen

​

​

// press s after activating the canvas 

// (press mouse inside canvas) to save 

// canvas to svg or png depending on the 

// renderer selected.

​

let label   = "your-label-here";

​

function setup() {

  // if you add SVG as 3rd parameter and then

  // press s, the canvas will be saved as SVG file

  createCanvas(800, 800);

  // createCanvas(540, 540, SVG);

}

​

function draw() {

  background(255,10);

  noStroke();

  fill(0);

  translate(150,150)

  shape();

}

​

function shape(){

  push();

  translate(320,40);

  rotate(PI*0.50);

  rect(0,0,60,120);

  pop();

  push();

  translate(260,135);

  fill('#FFFFFF')

  ellipse(0,0,145,125);

  pop();

  push();

  translate(130,100);

  rect(0,0,70,400);

  pop();

  push();

  translate(320,100);

  rect(0,0,70,400);

  pop();

  push();

  rectMode(CENTER);

  translate(250,290);

  rotate(cos(frameCount*0.01));

  rect(0,0,25,400);

  pop();

   push();

   translate(260, height * 0.35);

   rotate(frameCount*-0.01);

   star(0, 0, 30, 70, 8);

   pop();

}

​

​

function star(x, y, radius1, radius2, npoints) {

  let angle = TWO_PI / npoints;

  let halfAngle = angle / 2.0;

  beginShape();

  for (let a = 0; a < TWO_PI; a += angle) {

    let sx = x + cos(a) * radius2;

    let sy = y + sin(a) * radius2;

    vertex(sx, sy);

    sx = x + cos(a + halfAngle) * radius1;

    sy = y + sin(a + halfAngle) * radius1;

    vertex(sx, sy);

  }

  endShape(CLOSE);

}

​

​

​

// if you want to use the SVG export 

// option, go to setup and enable SVG mode

// no need to make any changes below.

function keyPressed() {

  if (key === "s") {

    if(this._renderer.elt.svg !== undefined) {

      saveSVG(label + ".svg");

    } else {

      saveCanvas(label + ".png");

    }

  }

}