Thanks to freshfork

p5.RoverCam

*/

let rover;

​

// CanvasSize variables

let wW = 500, wH = 500;

​

function setup() {

//   angleMode(DEGREES)

  createCanvas(wW, wH, WEBGL);

  // Instance of RoverCam

  rover = createRoverCam();

  // Tilt mouse when click

  rover.usePointerLock(); 

  // Start position

  rover.setState({ 

    position:[0,0,0],

    rotation: [0,0,0],

    sensitivity: 0.0225,

    speed: 0.25

  });

  // Override to new keys

  rover.controller = function() { // override

    if (RoverCam.pointerLock) {

      this.yaw(movedX * this.sensitivity / 10);   // mouse left/right

      this.pitch(movedY * this.sensitivity / 10); // mouse up/down

      //left-right

      if(keyIsDown(65))  this.moveY(this.speed); // a

      if(keyIsDown(68)) this.moveY(-this.speed); // d

      //up-down

      if (keyIsDown(87)) this.moveZ(this.speed); // w

      if (keyIsDown(83)) this.moveZ(-this.speed); // s

      //zoom in-out

      if (keyIsDown(81)) this.moveX(this.speed); // q

      if (keyIsDown(69)) this.moveX(-this.speed); // e

      // otherwise yaw/pitch with keys

    } else {

      //pan left-right

      if(keyIsDown(37)) this.yaw(-0.02); // left arrow

      if(keyIsDown(39)) this.yaw(0.02); // right arrow

      //pan up-down

      if(keyIsDown(38)) this.pitch(-0.02); // up arrow

      if(keyIsDown(40)) this.pitch(0.02); // down arrow

      //left-right

      if(keyIsDown(65))  this.moveY(this.speed); // a

      if(keyIsDown(68)) this.moveY(-this.speed); // d

      //up-down

      if (keyIsDown(87)) this.moveZ(this.speed); // w

      if (keyIsDown(83)) this.moveZ(-this.speed); // s

      //zoom in-out

      if (keyIsDown(81)) this.moveX(this.speed); // q

      if (keyIsDown(69)) this.moveX(-this.speed); // e

    }

  }

}

​

function draw() {

  background(255)

  // A big sphere for a visual reference frame

  push()

    noFill()

    stroke(0)

    sphere(100)

  pop()

}