//https://www.youtube.com/watch?v=vdDZkrMmHHM

​

let pattern;//cercle grand

let pattern2;//carré

let pattern3;//cercle petit

​

​

let x = 0;//carré qui tourne

let a = 0;//grossir le petit cercle

​

let moonRot = 0; 

let moonRotspeed = 0.01;

​

let px = 240;

let py = 400;

​

function setup() {

  createCanvas(480, 750);

  rectMode(CENTER);

  noCursor();

  //cercle grand

  let buffer = createGraphics(15, 15);

  buffer.pixelDensity(1);

  buffer.background("#FF9A00");

  buffer.line(10, 10, 25, 25);

  pattern = createPattern(buffer);

  //cercle petit + fond

  let buffer3 = createGraphics(5, 5);

  buffer3.pixelDensity(1);

  buffer3.background("#F6F7D7");

  buffer3.line(1, 1, 3, 3);

  pattern3 = createPattern(buffer3);

}

​

function draw() {

  background(255);

  noStroke();

  //carré du fond avec la trame

  push();

  fillPattern(pattern3);

  rect(width/2, height/2, windowWidth, windowHeight);

  pop();

  //carré

  push();

  let buffer2 = createGraphics(15, 15);

  buffer2.pixelDensity(2);

  buffer2.background("#3EC1D3");

  buffer2.line(10, 10, 1, 1);

  pattern2 = createPattern(buffer2);

  blendMode(DIFFERENCE);

  x += 0.005;

  translate(width / 2, height / 2);

  rotate(x);

  fillPattern(pattern2);

  rect(0, 0, 300, 300);

  pop();

  //grand cercle

  push();

  //blendMode(DIFFERENCE);

  fillPattern(pattern);

  circle(mouseX,mouseY, 200);

  pop();

  //petit cercle

  push();

  a += 0.8;

  blendMode(DIFFERENCE);

  moonRot += moonRotspeed; 

  translate(width/2, height/2);

  rotate(moonRot); 

  translate(-width/2, -height/2);

  fillPattern(pattern3);

  ellipse(width/2, 512, 70+a, 70+a);

  pop();

}

​

​

function touchStarted () {

  var fs = fullscreen();

  if (!fs) {

    fullscreen(true);

  }

}

​

/* full screening will change the size of the canvas */

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

}

​

/* prevents the mobile browser from processing some default

 * touch events, like swiping left for "back" or scrolling the page.

 */

document.ontouchmove = function(event) {

    event.preventDefault();

};

​