let xOff2 = 10000;

​

var quad1 = {

  x1: 10,

  y1: 20,

  x2: 30,

  y2: 50,

  x3: 60,

  y3: 70,

  x4: 10,

  y4: 10,

}

​

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  background(20);

  // frameRate(10);

  // noCursor();

​

}

​

function draw() {

  noFill();

  stroke(220, 60);

  strokeWeight(0.66);

  if (mouseIsPressed) {

    if (mouseButton === LEFT) {

      quad(quad1.x1, quad1.y1, quad1.x2, quad1.y2, quad1.x3, quad1.y3, mouseX, mouseY);

      quad1.x1 = map(noise(xOff1), 0, 1, 0, width);

      quad1.y1 = map(noise(xOff2), 0, 1, 0, height);

      quad1.x2 = map(noise(xOff1), 0, 1, 0, width);

      quad1.y2 = map(noise(xOff2), 0, 1, 0, height);

      quad1.x3 = map(noise(xOff1), 0, 1, 0, width);

      quad1.y3 = map(noise(xOff2), 0, 1, 0, height);

      xOff1 += 0.01;

      xOff2 += 0.01;

    }

  }

}

​

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

  background(20);

​

}

​

// function mouseReleased() {

//   background(20);

// }

​

function keyTyped() {

  if (key === "s") {

    saveFrames("Quad art mousesPressed", "png", 1, 1);

​

  }

}