p5.js | Ratón movidoX

La variable moveX en p5.js contiene el movimiento horizontal del mouse desde el último cuadro del boceto. Un valor positivo indica que el mouse se movió hacia la derecha y un valor negativo indica que se movió hacia la izquierda en el último cuadro.

Sintaxis: 

movedX

El siguiente programa ilustra la variable moveX en p5.js:
Ejemplo 1:

function setup() {
  createCanvas(400, 300);
  textSize(16);
  
  fpsSlider = createSlider(1, 60, 30, 1);
  fpsSlider.position(20, 40);
}
  
function draw() {
  clear();
  text("Move the slider to change the framerate "+
       "of the sketch", 20, 20);
  
  // Set the framerate according to the slider
  frameRate(fpsSlider.value());
  text("Current Framerate: " + fpsSlider.value() + " FPS", 20, 80);
  
  // Use the movedX property
  text("The mouse moved " + movedX + " units in the x-direction", 20, 140);
  text("since the last frame", 20, 160);
}

Producción:

Ejemplo 2:

let gameOver = false;
  
function setup() {
  createCanvas(600, 300);
  textSize(16);
}
  
function draw() {
  clear();
  text(
    "Move the mouse horizontally from one end to "+
    "the other end slowly to keep playing",
    20,
    20
  );
  if (!gameOver) {
  
    // Use the movedX property to display the
    // amount of mouse moved
    text("The mouse moved " + movedX + " units in "+
         "the x-direction", 20, 60);
  
    // Get the absolute amount of mouse moved
    // and finish the game is it goes too fast
    if (abs(movedX) > 3) gameOver = true;
  } else text("You moved too fast! Refresh to try again", 20, 80);
}

Producción:
 

Referencia: https://p5js.org/reference/#/p5/movedX
Configuración del entorno: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

Referencia: https://p5js.org/reference/#/p5/setCamera