Use prefix _ convention to prevent unintended global exposure of custom actions

Author: limzykenneth

src/core/environment.js

@@ -784,8 +784,8 @@ function environment(p5, fn, lifecycles){
     this.windowWidth = getWindowWidth();
     this.windowHeight = getWindowHeight();
     let executeDefault;
-    if (this.customActions.windowResized) {
-      executeDefault = this.customActions.windowResized(e);
+    if (this._customActions.windowResized) {
+      executeDefault = this._customActions.windowResized(e);
       if (executeDefault !== undefined && !executeDefault) {
         e.preventDefault();
       }

src/core/main.js

@@ -99,7 +99,7 @@ class p5 {
             console.log(`You just changed the value of "${property}", which was a p5 global value. This could cause problems later if you're not careful.`);
           }
         }
-      })
+      });
     };
     // If the user has created a global setup or draw function,
     // assume "global" mode and make everything global (i.e. on the window)
@@ -178,7 +178,7 @@ class p5 {
   }
 
   #customActions = {};
-  customActions = new Proxy({}, {
+  _customActions = new Proxy({}, {
     get: (target, prop) => {
       if(!this.#customActions[prop]){
         const context = this._isGlobal ? window : this;

src/events/acceleration.js

@@ -657,17 +657,17 @@ function acceleration(p5, fn, lifecycles){
       this.deviceOrientation = 'undefined';
     }
 
-    if (this.customActions.deviceMoved) {
+    if (this._customActions.deviceMoved) {
       if (
         Math.abs(this.accelerationX - this.pAccelerationX) > move_threshold ||
         Math.abs(this.accelerationY - this.pAccelerationY) > move_threshold ||
         Math.abs(this.accelerationZ - this.pAccelerationZ) > move_threshold
       ) {
-        this.customActions.deviceMoved();
+        this._customActions.deviceMoved();
       }
     }
 
-    if (this.customActions.deviceTurned) {
+    if (this._customActions.deviceTurned) {
       // The angles given by rotationX etc is from range [-180 to 180].
       // The following will convert them to [0 to 360] for ease of calculation
       // of cases when the angles wrapped around.
@@ -688,7 +688,7 @@ function acceleration(p5, fn, lifecycles){
       if (Math.abs(wRX - wSAX) > 90 && Math.abs(wRX - wSAX) < 270) {
         wSAX = wRX;
         this.turnAxis = 'X';
-        this.customActions.deviceTurned();
+        this._customActions.deviceTurned();
       }
       this.pRotateDirectionX = rotateDirectionX;
       startAngleX = wSAX - 180;
@@ -708,7 +708,7 @@ function acceleration(p5, fn, lifecycles){
       if (Math.abs(wRY - wSAY) > 90 && Math.abs(wRY - wSAY) < 270) {
         wSAY = wRY;
         this.turnAxis = 'Y';
-        this.customActions.deviceTurned();
+        this._customActions.deviceTurned();
       }
       this.pRotateDirectionY = rotateDirectionY;
       startAngleY = wSAY - 180;
@@ -737,12 +737,12 @@ function acceleration(p5, fn, lifecycles){
       ) {
         startAngleZ = rotZ;
         this.turnAxis = 'Z';
-        this.customActions.deviceTurned();
+        this._customActions.deviceTurned();
       }
       this.pRotateDirectionZ = rotateDirectionZ;
       this.turnAxis = undefined;
     }
-    if (this.customActions.deviceShaken) {
+    if (this._customActions.deviceShaken) {
       let accelerationChangeX;
       let accelerationChangeY;
       // Add accelerationChangeZ if acceleration change on Z is needed
@@ -751,7 +751,7 @@ function acceleration(p5, fn, lifecycles){
         accelerationChangeY = Math.abs(this.accelerationY - this.pAccelerationY);
       }
       if (accelerationChangeX + accelerationChangeY > shake_threshold) {
-        this.customActions.deviceShaken();
+        this._customActions.deviceShaken();
       }
     }
   };

src/events/keyboard.js

@@ -486,8 +486,8 @@ function keyboard(p5, fn, lifecycles){
     this._downKeyCodes[e.code] = true;
     this._downKeys[e.key] = true;
 
-    if (this.customActions.keyPressed && !e.charCode) {
-      const executeDefault = this.customActions.keyPressed(e);
+    if (this._customActions.keyPressed && !e.charCode) {
+      const executeDefault = this._customActions.keyPressed(e);
       if (executeDefault === false) {
         e.preventDefault();
       }
@@ -651,8 +651,8 @@ function keyboard(p5, fn, lifecycles){
    * </div>
    */
   fn._onkeyup = function(e) {
-    if (this.customActions.keyReleased) {
-      const executeDefault = this.customActions.keyReleased(e);
+    if (this._customActions.keyReleased) {
+      const executeDefault = this._customActions.keyReleased(e);
       if (executeDefault === false) {
         e.preventDefault();
       }
@@ -814,8 +814,8 @@ function keyboard(p5, fn, lifecycles){
     this._lastKeyCodeTyped = e.which; // track last keyCode
     this.key = e.key || String.fromCharCode(e.which) || e.which;
 
-    if (this.customActions.keyTyped) {
-      const executeDefault = this.customActions.keyTyped(e);
+    if (this._customActions.keyTyped) {
+      const executeDefault = this._customActions.keyTyped(e);
       if (executeDefault === false) {
         e.preventDefault();
       }

src/events/pointer.js

@@ -1180,13 +1180,13 @@ function pointer(p5, fn, lifecycles){
     this._activePointers.set(e.pointerId, e);
     this._setMouseButton(e);
 
-    if (!this.mouseIsPressed && this.customActions.mouseMoved) {
-      executeDefault = this.customActions.mouseMoved(e);
+    if (!this.mouseIsPressed && this._customActions.mouseMoved) {
+      executeDefault = this._customActions.mouseMoved(e);
       if (executeDefault === false) {
         e.preventDefault();
       }
-    } else if (this.mouseIsPressed && this.customActions.mouseDragged) {
-      executeDefault = this.customActions.mouseDragged(e);
+    } else if (this.mouseIsPressed && this._customActions.mouseDragged) {
+      executeDefault = this._customActions.mouseDragged(e);
       if (executeDefault === false) {
         e.preventDefault();
       }
@@ -1343,8 +1343,8 @@ function pointer(p5, fn, lifecycles){
     this._setMouseButton(e);
     this._updatePointerCoords(e);
 
-    if (this.customActions.mousePressed) {
-      executeDefault = this.customActions.mousePressed(e);
+    if (this._customActions.mousePressed) {
+      executeDefault = this._customActions.mousePressed(e);
       if (executeDefault === false) {
         e.preventDefault();
       }
@@ -1503,8 +1503,8 @@ function pointer(p5, fn, lifecycles){
 
     this._updatePointerCoords(e);
 
-    if (this.customActions.mouseReleased) {
-      executeDefault = this.customActions.mouseReleased(e);
+    if (this._customActions.mouseReleased) {
+      executeDefault = this._customActions.mouseReleased(e);
       if (executeDefault === false) {
         e.preventDefault();
       }
@@ -1658,8 +1658,8 @@ function pointer(p5, fn, lifecycles){
    * </div>
    */
   fn._onclick = function(e) {
-    if (this.customActions.mouseClicked) {
-      const executeDefault = this.customActions.mouseClicked(e);
+    if (this._customActions.mouseClicked) {
+      const executeDefault = this._customActions.mouseClicked(e);
       if (executeDefault === false) {
         e.preventDefault();
       }
@@ -1788,8 +1788,8 @@ function pointer(p5, fn, lifecycles){
    */
 
   fn._ondblclick = function(e) {
-    if (this.customActions.doubleClicked) {
-      const executeDefault = this.customActions.doubleClicked(e);
+    if (this._customActions.doubleClicked) {
+      const executeDefault = this._customActions.doubleClicked(e);
       if (executeDefault === false) {
         e.preventDefault();
       }
@@ -1936,9 +1936,9 @@ function pointer(p5, fn, lifecycles){
    */
   fn._onwheel = function(e) {
     this._mouseWheelDeltaY = e.deltaY;
-    if (this.customActions.mouseWheel) {
+    if (this._customActions.mouseWheel) {
       e.delta = e.deltaY;
-      const executeDefault = this.customActions.mouseWheel(e);
+      const executeDefault = this._customActions.mouseWheel(e);
       if (executeDefault === false) {
         e.preventDefault();
       }