"note" Abgabe

let content = "By moving your cursor from \n the left to the rigth you are \n able to create a unique \n structure in a cyan colour, \n which somehow looks like a \n water fountain. If you like \n what you are seeing simply \n press the S-key to capture a \n screenshot of your creation. ";

// Umbrüche sind als \n (break) im Text zu deklarieren

​

let sora;

​

// Font laden

function preload() {

  sora = loadFont('Sora-SemiBold.ttf');

}

​

function setup() {

  createCanvas(1920, 1080);

  textFont(sora); // Font setzen

}

​

function draw() {

  background(220);

  // Euer Code

  push();

  background(0);

  rectMode(CENTER);

​

  translate(10, height / 2);

  let num = map(mouseX, 20, width, 10, 400);

  //let num = map(sin(millis()/1000), -1, 1, 10, 200);

​

  for (let y = 0; y < num; y += 1) {

    let rot = map(y, 0, num, 0, PI);

    let posx = map(y, 0, num, 0, width);

    //let col = map(y, 0, num, 0, 255);

    //stroke(col);

    push();

    translate(posx, 0);

    rotate(rot);

    noFill();

    stroke(20, 95, 110, 100);

    //rect(0, 90, 200, 50);

    arc(100, 150, mouseX, 200, 100, PI);

    //line(0, 200, 200, 0);

    pop();

  }

  pop();

    // Wort

  textSize(250);

  textAlign(CENTER, CENTER);

  fill(120);

  //noStroke();

  text("note", width/4, height/2);

  // Hilfe Text

  fill(240);

  textSize(32);

  text("?", 15, 20);

  if (mouseX > 0 && mouseX < 30 && mouseY > 0 && mouseY < 30) {

    cursor(HAND);

    text(content, 20, 40, 500, height);

    //text(content, 20, 40, width-20, height-20);

  }

  else {

    cursor(ARROW);

  }

}

​

// Bild speichern

function keyPressed() {

  if (key == "s") {

    save('tool_grafik.png');

  }

}