//Hover on the canvs to draw text

//Click to start over

​

​

//Designed and created by Lu Jia

//Lost item from MoMo(Yumeng) Gao

​

//Description I received: 

//"My lost object is a bracelet. It is a significant gift for my friends and me. Morphologically, it's enlongated and curve. But part of it feels a little bit rough like tree trunk. The other part feels smooth and cool. And the color is like gold, shines at night, and it's very light,"

​

//Design process:

//1st sketch: https://editor.p5js.org/01fri/present/qLRm_eWNq

//2nd sketch: https://editor.p5js.org/01fri/present/L9712v4Lm

//3rd sketch: https://editor.p5js.org/01fri/present/iv7Zg6dGs

//4th sketch(hover&click event): https://editor.p5js.org/01fri/present/smuOdifW-

//final version(hover&click event): https://editor.p5js.org/01fri/present/xab2aYPum

//<iframe src="https://editor.p5js.org/01fri/embed/xab2aYPum"></iframe> 

​

​

​

let s = 300;

​

// function preload(){

//  bffFont = loadFont(''); 

// }

​

​

function setup() {

  createCanvas(400, 400);

  // colorMode(HSB, 200);

  colorMode(RGB);

  background(27);

    // background(84, 100, 120);

    noCursor();

}

​

​

function draw() {

    blendMode(ADD);

    // textSize(random(50, 55));

​

    push();

    textSize(39);

    // textFont("Liu Jian Mao Cao");

    textFont("ZCOOL QingKe HuangYou");

    noFill();

    stroke(random(0, 251), 203, 245, random(1, 10));

    strokeWeight(1);

    textAlign(RIGHT, CENTER);

    textLeading(56);

    text('友\n谊\n地\n久\n天\n长', mouseX, mouseY);

    pop();

  translate(width/2, height/2);

  // rotate(radians(mouseX));

      rotate(90);

      noFill();

      strokeWeight(2);

      stroke(169, 56, 0, 2);

      ellipse(

      random(-2, 2),

      random(-2, 2),

      s + random(-10, 10),

      s + random(-10, 10)

      );

​

      noFill();

      strokeWeight(2);

      stroke(184, 179, 73, 4);

      ellipse(

       random(-10, 10),

       random(-10, 10),

       s + random(-20, 20),

       s + random(-20, 20)

      );

​

}

​

function mousePressed() {

  clear();

  background(30);

}

​

​

​