p5 2.2.1-rc.0 → 2.2.1

package/dist/events/acceleration.js

@@ -40,8 +40,6 @@ function acceleration(p5, fn, lifecycles){
    * @property {Number} accelerationX
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * // Move a touchscreen device to register
    * // acceleration changes.
    * function draw() {
@@ -50,8 +48,6 @@ function acceleration(p5, fn, lifecycles){
    *   ellipse(width / 2, height / 2, accelerationX);
    *   describe('Magnitude of device acceleration is displayed as ellipse size.');
    * }
-   * </code>
-   * </div>
    */
   fn.accelerationX = 0;
 
@@ -62,8 +58,6 @@ function acceleration(p5, fn, lifecycles){
    * @property {Number} accelerationY
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * // Move a touchscreen device to register
    * // acceleration changes.
    * function draw() {
@@ -72,8 +66,6 @@ function acceleration(p5, fn, lifecycles){
    *   ellipse(width / 2, height / 2, accelerationY);
    *   describe('Magnitude of device acceleration is displayed as ellipse size');
    * }
-   * </code>
-   * </div>
    */
   fn.accelerationY = 0;
 
@@ -85,8 +77,6 @@ function acceleration(p5, fn, lifecycles){
    * @readOnly
    *
    * @example
-   * <div>
-   * <code>
    * // Move a touchscreen device to register
    * // acceleration changes.
    * function draw() {
@@ -95,8 +85,6 @@ function acceleration(p5, fn, lifecycles){
    *   ellipse(width / 2, height / 2, accelerationZ);
    *   describe('Magnitude of device acceleration is displayed as ellipse size');
    * }
-   * </code>
-   * </div>
    */
   fn.accelerationZ = 0;
 
@@ -154,8 +142,6 @@ function acceleration(p5, fn, lifecycles){
    * @property {Number} rotationX
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * let rotationX = 0;            // Angle in degrees
    *
    * function setup() {
@@ -169,8 +155,6 @@ function acceleration(p5, fn, lifecycles){
    *   box(60);                         // Draw 3D cube (60 units wide)
    *   rotationX = (rotationX + 2) % 360; // Increment rotation (2° per frame)
    * }
-   * </code>
-   * </div>
    */
   fn.rotationX = 0;
 
@@ -187,8 +171,6 @@ function acceleration(p5, fn, lifecycles){
    * @property {Number} rotationY
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * let rotationY = 0;            // Angle in degrees
    *
    * function setup() {
@@ -202,8 +184,6 @@ function acceleration(p5, fn, lifecycles){
    *   box(60);                         // Draw 3D cube (60 units wide)
    *   rotationY = (rotationY + 2) % 360; // Increment rotation (2° per frame)
    * }
-   * </code>
-   * </div>
    */
   fn.rotationY = 0;
 
@@ -221,8 +201,6 @@ function acceleration(p5, fn, lifecycles){
    * unexpected behaviour.
    *
    * @example
-   * <div>
-   * <code>
    * let rotationZ = 0;          // Angle in degrees
    *
    * function setup() {
@@ -236,8 +214,6 @@ function acceleration(p5, fn, lifecycles){
    *   box(60);                         // Draw 3D cube
    *   rotationZ = (rotationZ + 2) % 360; // Increment rotation angle
    * }
-   * </code>
-   * </div>
    *
    * @property {Number} rotationZ
    * @readOnly
@@ -254,8 +230,7 @@ function acceleration(p5, fn, lifecycles){
    * pRotationX can also be used with rotationX to determine the rotate
    * direction of the device along the X-axis.
    * @example
-   * <div class='norender'>
-   * <code>
+   * // META:norender
    * // A simple if statement looking at whether
    * // rotationX - pRotationX < 0 is true or not will be
    * // sufficient for determining the rotate direction
@@ -280,8 +255,6 @@ function acceleration(p5, fn, lifecycles){
    *
    * print(rotateDirection);
    * describe('no image to display.');
-   * </code>
-   * </div>
    *
    * @property {Number} pRotationX
    * @readOnly
@@ -298,8 +271,7 @@ function acceleration(p5, fn, lifecycles){
    * pRotationY can also be used with rotationY to determine the rotate
    * direction of the device along the Y-axis.
    * @example
-   * <div class='norender'>
-   * <code>
+   * // META:norender
    * // A simple if statement looking at whether
    * // rotationY - pRotationY < 0 is true or not will be
    * // sufficient for determining the rotate direction
@@ -323,8 +295,6 @@ function acceleration(p5, fn, lifecycles){
    * }
    * print(rotateDirection);
    * describe('no image to display.');
-   * </code>
-   * </div>
    *
    * @property {Number} pRotationY
    * @readOnly
@@ -341,8 +311,7 @@ function acceleration(p5, fn, lifecycles){
    * pRotationZ can also be used with rotationZ to determine the rotate
    * direction of the device along the Z-axis.
    * @example
-   * <div class='norender'>
-   * <code>
+   * // META:norender
    * // A simple if statement looking at whether
    * // rotationZ - pRotationZ < 0 is true or not will be
    * // sufficient for determining the rotate direction
@@ -362,8 +331,6 @@ function acceleration(p5, fn, lifecycles){
    * }
    * print(rotateDirection);
    * describe('no image to display.');
-   * </code>
-   * </div>
    *
    * @property {Number} pRotationZ
    * @readOnly
@@ -395,8 +362,6 @@ function acceleration(p5, fn, lifecycles){
    * @property {String} turnAxis
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * // Run this example on a mobile device
    * // Rotate the device by 90 degrees in the
    * // X-axis to change the value.
@@ -419,8 +384,6 @@ function acceleration(p5, fn, lifecycles){
    *     }
    *   }
    * }
-   * </code>
-   * </div>
    */
   fn.turnAxis = undefined;
 
@@ -434,8 +397,7 @@ function acceleration(p5, fn, lifecycles){
    * @method setMoveThreshold
    * @param {Number} value The threshold value
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * // Run this example on a mobile device
    * // You will need to move the device incrementally further
    * // the closer the square's color gets to white in order to change the value.
@@ -460,8 +422,6 @@ function acceleration(p5, fn, lifecycles){
    *   }
    *   setMoveThreshold(threshold);
    * }
-   * </code>
-   * </div>
    */
   fn.setMoveThreshold = function (val) {
     move_threshold = val;
@@ -474,8 +434,7 @@ function acceleration(p5, fn, lifecycles){
    * @method setShakeThreshold
    * @param {Number} value The threshold value
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * // Run this example on a mobile device
    * // You will need to shake the device more firmly
    * // the closer the box's fill gets to white in order to change the value.
@@ -500,8 +459,6 @@ function acceleration(p5, fn, lifecycles){
    *   }
    *   setShakeThreshold(threshold);
    * }
-   * </code>
-   * </div>
    */
   fn.setShakeThreshold = function (val) {
     shake_threshold = val;
@@ -514,8 +471,7 @@ function acceleration(p5, fn, lifecycles){
    *
    * @method deviceMoved
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * // Run this example on a mobile device
    * // Move the device around
    * // to change the value.
@@ -533,8 +489,6 @@ function acceleration(p5, fn, lifecycles){
    *     value = 0;
    *   }
    * }
-   * </code>
-   * </div>
    */
 
   /**
@@ -547,8 +501,7 @@ function acceleration(p5, fn, lifecycles){
    *
    * @method deviceTurned
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * // Run this example on a mobile device
    * // Rotate the device by 90 degrees
    * // to change the value.
@@ -567,10 +520,8 @@ function acceleration(p5, fn, lifecycles){
    *     value = 0;
    *   }
    * }
-   * </code>
-   * </div>
-   * <div>
-   * <code>
+   *
+   * @example
    * // Run this example on a mobile device
    * // Rotate the device by 90 degrees in the
    * // X-axis to change the value.
@@ -591,8 +542,6 @@ function acceleration(p5, fn, lifecycles){
    *     }
    *   }
    * }
-   * </code>
-   * </div>
    */
 
   /**
@@ -603,8 +552,7 @@ function acceleration(p5, fn, lifecycles){
    *
    * @method deviceShaken
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * // Run this example on a mobile device
    * // Shake the device to change the value.
    *
@@ -615,14 +563,13 @@ function acceleration(p5, fn, lifecycles){
    *   describe(`50-by-50 black rect in center of canvas.
    *     turns white on mobile when device shakes`);
    * }
+   *
    * function deviceShaken() {
    *   value = value + 5;
    *   if (value > 255) {
    *     value = 0;
    *   }
    * }
-   * </code>
-   * </div>
    */
   fn._ondeviceorientation = function (e) {
     this._updatePRotations();

package/dist/events/keyboard.js

@@ -45,8 +45,6 @@ function keyboard(p5, fn, lifecycles){
    * @readOnly
    *
    * @example
-   * <div>
-   * <code>
    * // Click on the canvas to begin detecting key presses.
    *
    * function setup() {
@@ -70,11 +68,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Draw the square.
    *   square(25, 25, 50);
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * function setup() {
@@ -98,11 +93,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Draw the square.
    *   square(25, 25, 50);
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * function setup() {
@@ -123,8 +115,6 @@ function keyboard(p5, fn, lifecycles){
    *   // Display the value of keyIsPressed.
    *   text(keyIsPressed, 50, 50);
    * }
-   * </code>
-   * </div>
    */
   fn.keyIsPressed = false;
 
@@ -143,8 +133,6 @@ function keyboard(p5, fn, lifecycles){
    * @readOnly
    *
    * @example
-   * <div>
-   * <code>
    * // Click on the canvas to begin detecting key presses.
    *
    * function setup() {
@@ -165,11 +153,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Display the last key pressed.
    *   text(key, 50, 50);
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let x = 50;
@@ -205,8 +190,6 @@ function keyboard(p5, fn, lifecycles){
    *   // Draw the circle at (x, y).
    *   circle(x, y, 5);
    * }
-   * </code>
-   * </div>
    */
   fn.key = '';
 
@@ -295,8 +278,6 @@ function keyboard(p5, fn, lifecycles){
    * @readOnly
    *
    * @example
-   * <div>
-   * <code>
    * // Click on the canvas to begin detecting key presses.
    *
    * function setup() {
@@ -317,11 +298,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Display the last key pressed.
    *   text(code, 50, 50);
    * }
-   * </code>
-   * </div>
-   * <div>
-   * <code>
    *
+   * @example
    * function setup() {
    *   createCanvas(100, 100);
    * }
@@ -344,10 +322,8 @@ function keyboard(p5, fn, lifecycles){
    *   text(keyCode, 7, 25);
    *   text(code || " ", 30, 50);
    * }
-   * </div>
-   * </code>
-   * <div>
-   * <code>
+   *
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let x = 50;
@@ -389,9 +365,6 @@ function keyboard(p5, fn, lifecycles){
    *   // Draw the circle.
    *   circle(x, y, 5);
    * }
-   *
-   * </code>
-   * </div>
    */
   fn.code = '';
 
@@ -432,8 +405,6 @@ function keyboard(p5, fn, lifecycles){
    * @readOnly
    *
    * @example
-   * <div>
-   * <code>
    * // Click on the canvas to begin detecting key presses.
    *
    * function setup() {
@@ -454,11 +425,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Display the last key pressed and its code.
    *   text(`${key} : ${keyCode}`, 50, 50);
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let x = 50;
@@ -494,8 +462,6 @@ function keyboard(p5, fn, lifecycles){
    *   // Draw the circle at (x, y).
    *   circle(x, y, 5);
    * }
-   * </code>
-   * </div>
    */
   fn.keyCode = 0;
 
@@ -547,8 +513,6 @@ function keyboard(p5, fn, lifecycles){
    * @param  {KeyboardEvent} [event] optional `KeyboardEvent` callback argument.
    *
    * @example
-   * <div>
-   * <code>
    * // Click on the canvas to begin detecting key presses.
    *
    * let value = 0;
@@ -581,11 +545,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Uncomment to prevent any default behavior.
    *   // return false;
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let value = 0;
@@ -618,11 +579,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Uncomment to prevent any default behavior.
    *   // return false;
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let value = 0;
@@ -655,8 +613,6 @@ function keyboard(p5, fn, lifecycles){
    *   // Uncomment to prevent any default behavior.
    *   // return false;
    * }
-   * </code>
-   * </div>
    */
   fn._onkeydown = function(e) {
     if (this._downKeys[e.code]) {
@@ -725,8 +681,6 @@ function keyboard(p5, fn, lifecycles){
    * @param  {KeyboardEvent} [event] optional `KeyboardEvent` callback argument.
    *
    * @example
-   * <div>
-   * <code>
    * // Click on the canvas to begin detecting key presses.
    *
    * let value = 0;
@@ -759,11 +713,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Uncomment to prevent any default behavior.
    *   // return false;
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let value = 0;
@@ -794,11 +745,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Uncomment to prevent any default behavior.
    *   // return false;
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let value = 0;
@@ -831,8 +779,6 @@ function keyboard(p5, fn, lifecycles){
    *   // Uncomment to prevent any default behavior.
    *   // return false;
    * }
-   * </code>
-   * </div>
    */
   fn._onkeyup = function(e) {
     if (typeof this._customActions.keyReleased === 'function') {
@@ -915,8 +861,6 @@ function keyboard(p5, fn, lifecycles){
    * @param  {KeyboardEvent} [event] optional `KeyboardEvent` callback argument.
    *
    * @example
-   * <div>
-   * <code>
    * // Click on the canvas to begin detecting key presses.
    * // Note: Pressing special keys such as SPACE have no effect.
    *
@@ -950,11 +894,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Uncomment to prevent any default behavior.
    *   // return false;
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let value = 0;
@@ -987,8 +928,6 @@ function keyboard(p5, fn, lifecycles){
    *   // Uncomment to prevent any default behavior.
    *   // return false;
    * }
-   * </code>
-   * </div>
    */
   fn._onkeypress = function(e) {
     if (e.which === this._lastKeyCodeTyped && e.repeat) {
@@ -1045,8 +984,6 @@ function keyboard(p5, fn, lifecycles){
    * @return {Boolean}        whether the key is down or not.
    *
    * @example
-   * <div>
-   * <code>
    * // Click on the canvas to begin detecting key presses.
    *
    * let x = 50;
@@ -1086,11 +1023,8 @@ function keyboard(p5, fn, lifecycles){
    *   // Draw the circle.
    *   circle(x, y, 5);
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * // Click on the canvas to begin detecting key presses.
    *
    * let x = 50;
@@ -1130,8 +1064,6 @@ function keyboard(p5, fn, lifecycles){
    *   // Draw the circle.
    *   circle(x, y, 5);
    * }
-   * </code>
-   * </div>
    */
   fn.keyIsDown = function(input) {
     if (isCode(input)) {