Instance mode events affecting entire html

Although an <iframe> can definitely isolate a sketch and its listeners from the rest, what I actually meant as answer was using the p5.Element::mousePressed() in place of p5::mousePressed():

  1. reference | p5.js
  2. reference | p5.js

While p5::mousePressed() listens to the whole browser’s window, p5.Element::mousePressed() listens to the element only, regardless the sketch is in global or instance mode.

Here’s another sketch in instance mode whose mousePressed() only triggers inside its canvas:
https://GoSubRoutine.GitHub.io/Ball-in-the-Chamber/p5js-instance/
https://github.com/GoSubRoutine/Ball-in-the-Chamber/blob/v3.0.0/p5js-instance/sketch/sketch.js#L24-L25

2 Likes