diff --git a/src/events/keyboard.js b/src/events/keyboard.js
index d5261db2b0..9e336022a9 100644
--- a/src/events/keyboard.js
+++ b/src/events/keyboard.js
@@ -189,20 +189,20 @@ p5.prototype.key = '';
* been typed. For example, the following conditional checks whether the enter
* key has been typed:
*
- *
+ * ```js
* if (keyCode === 13) {
* // Code to run if the enter key was pressed.
* }
- *
+ * ```
*
* The same code can be written more clearly using the system variable `ENTER`
* which has a value of 13:
*
- *
+ * ```js
* if (keyCode === ENTER) {
* // Code to run if the enter key was pressed.
* }
- *
+ * ```
*
* The system variables `BACKSPACE`, `DELETE`, `ENTER`, `RETURN`, `TAB`,
* `ESCAPE`, `SHIFT`, `CONTROL`, `OPTION`, `ALT`, `UP_ARROW`, `DOWN_ARROW`,
@@ -287,17 +287,17 @@ p5.prototype.keyCode = 0;
* Declaring the function `keyPressed()` sets a code block to run once
* automatically when the user presses any key:
*
- *
+ * ```js
* function keyPressed() {
* // Code to run.
* }
- *
+ * ```
*
* The key and keyCode
* variables will be updated with the most recently typed value when
* `keyPressed()` is called by p5.js:
*
- *
+ * ```js
* function keyPressed() {
* if (key === 'c') {
* // Code to run.
@@ -307,18 +307,18 @@ p5.prototype.keyCode = 0;
* // Code to run.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `keyPressed()` is always passed a
* KeyboardEvent
* object with properties that describe the key press event:
*
- *
+ * ```js
* function keyPressed(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* Browsers may have default behaviors attached to various key events. For
* example, some browsers may jump to the bottom of a web page when the
@@ -464,17 +464,17 @@ p5.prototype._onkeydown = function(e) {
* Declaring the function `keyReleased()` sets a code block to run once
* automatically when the user releases any key:
*
- *
+ * ```js
* function keyReleased() {
* // Code to run.
* }
- *
+ * ```
*
* The key and keyCode
* variables will be updated with the most recently released value when
* `keyReleased()` is called by p5.js:
*
- *
+ * ```js
* function keyReleased() {
* if (key === 'c') {
* // Code to run.
@@ -484,18 +484,18 @@ p5.prototype._onkeydown = function(e) {
* // Code to run.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `keyReleased()` is always passed a
* KeyboardEvent
* object with properties that describe the key press event:
*
- *
+ * ```js
* function keyReleased(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* Browsers may have default behaviors attached to various key events. To
* prevent any default behavior for this event, add `return false;` to the end
@@ -644,17 +644,17 @@ p5.prototype._onkeyup = function(e) {
* as `a` or 1. Modifier keys such as `SHIFT`, `CONTROL`, and the arrow keys
* will be ignored:
*
- *
+ * ```js
* function keyTyped() {
* // Code to run.
* }
- *
+ * ```
*
* The key and keyCode
* variables will be updated with the most recently released value when
* `keyTyped()` is called by p5.js:
*
- *
+ * ```js
* function keyTyped() {
* // Check for the "c" character using key.
* if (key === 'c') {
@@ -666,18 +666,18 @@ p5.prototype._onkeyup = function(e) {
* // Code to run.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `keyTyped()` is always passed a
* KeyboardEvent
* object with properties that describe the key press event:
*
- *
+ * ```js
* function keyReleased(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* Note: Use the keyPressed() function and
* keyCode system variable to respond to modifier
@@ -799,11 +799,11 @@ p5.prototype._onblur = function(e) {
* For example, `keyIsDown()` can be used to check if both `LEFT_ARROW` and
* `UP_ARROW` are pressed:
*
- *
+ * ```js
* if (keyIsDown(LEFT_ARROW) && keyIsDown(UP_ARROW)) {
* // Move diagonally.
* }
- *
+ * ```
*
* `keyIsDown()` can check for key presses using
* keyCode values, as in `keyIsDown(37)` or
diff --git a/src/events/mouse.js b/src/events/mouse.js
index 79485afb5c..a8b0746819 100644
--- a/src/events/mouse.js
+++ b/src/events/mouse.js
@@ -886,17 +886,17 @@ p5.prototype._setMouseButton = function(e) {
* automatically when the user moves the mouse without clicking any mouse
* buttons:
*
- *
+ * ```js
* function mouseMoved() {
* // Code to run.
* }
- *
+ * ```
*
* The mouse system variables, such as mouseX and
* mouseY, will be updated with their most recent
* value when `mouseMoved()` is called by p5.js:
*
- *
+ * ```js
* function mouseMoved() {
* if (mouseX < 50) {
* // Code to run if the mouse is on the left.
@@ -906,18 +906,18 @@ p5.prototype._setMouseButton = function(e) {
* // Code to run if the mouse is near the bottom.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `mouseMoved()` is always passed a
* MouseEvent
* object with properties that describe the mouse move event:
*
- *
+ * ```js
* function mouseMoved(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* Browsers may have default behaviors attached to various mouse events. For
* example, some browsers highlight text when the user moves the mouse while
@@ -971,17 +971,17 @@ p5.prototype._setMouseButton = function(e) {
* Declaring the function `mouseDragged()` sets a code block to run
* automatically when the user clicks and drags the mouse:
*
- *
+ * ```js
* function mouseDragged() {
* // Code to run.
* }
- *
+ * ```
*
* The mouse system variables, such as mouseX and
* mouseY, will be updated with their most recent
* value when `mouseDragged()` is called by p5.js:
*
- *
+ * ```js
* function mouseDragged() {
* if (mouseX < 50) {
* // Code to run if the mouse is on the left.
@@ -991,18 +991,18 @@ p5.prototype._setMouseButton = function(e) {
* // Code to run if the mouse is near the bottom.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `mouseDragged()` is always passed a
* MouseEvent
* object with properties that describe the mouse drag event:
*
- *
+ * ```js
* function mouseDragged(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* On touchscreen devices, `mouseDragged()` will run when a user moves a touch
* point if touchMoved() isn’t declared. If
@@ -1087,17 +1087,17 @@ p5.prototype._onmousemove = function(e) {
* Declaring the function `mousePressed()` sets a code block to run
* automatically when the user presses a mouse button:
*
- *
+ * ```js
* function mousePressed() {
* // Code to run.
* }
- *
+ * ```
*
* The mouse system variables, such as mouseX and
* mouseY, will be updated with their most recent
* value when `mousePressed()` is called by p5.js:
*
- *
+ * ```js
* function mousePressed() {
* if (mouseX < 50) {
* // Code to run if the mouse is on the left.
@@ -1107,18 +1107,18 @@ p5.prototype._onmousemove = function(e) {
* // Code to run if the mouse is near the bottom.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `mousePressed()` is always passed a
* MouseEvent
* object with properties that describe the mouse press event:
*
- *
+ * ```js
* function mousePressed(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* On touchscreen devices, `mousePressed()` will run when a user’s touch
* begins if touchStarted() isn’t declared. If
@@ -1260,17 +1260,17 @@ p5.prototype._onmousedown = function(e) {
* automatically when the user releases a mouse button after having pressed
* it:
*
- *
+ * ```js
* function mouseReleased() {
* // Code to run.
* }
- *
+ * ```
*
* The mouse system variables, such as mouseX and
* mouseY, will be updated with their most recent
* value when `mouseReleased()` is called by p5.js:
*
- *
+ * ```js
* function mouseReleased() {
* if (mouseX < 50) {
* // Code to run if the mouse is on the left.
@@ -1280,18 +1280,18 @@ p5.prototype._onmousedown = function(e) {
* // Code to run if the mouse is near the bottom.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `mouseReleased()` is always passed a
* MouseEvent
* object with properties that describe the mouse release event:
*
- *
+ * ```js
* function mouseReleased(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* On touchscreen devices, `mouseReleased()` will run when a user’s touch
* ends if touchEnded() isn’t declared. If
@@ -1433,17 +1433,17 @@ p5.prototype._ondragover = p5.prototype._onmousemove;
* automatically when the user releases a mouse button after having pressed
* it:
*
- *
+ * ```js
* function mouseClicked() {
* // Code to run.
* }
- *
+ * ```
*
* The mouse system variables, such as mouseX and
* mouseY, will be updated with their most recent
* value when `mouseClicked()` is called by p5.js:
*
- *
+ * ```js
* function mouseClicked() {
* if (mouseX < 50) {
* // Code to run if the mouse is on the left.
@@ -1453,18 +1453,18 @@ p5.prototype._ondragover = p5.prototype._onmousemove;
* // Code to run if the mouse is near the bottom.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `mouseClicked()` is always passed a
* MouseEvent
* object with properties that describe the mouse click event:
*
- *
+ * ```js
* function mouseClicked(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* On touchscreen devices, `mouseClicked()` will run when a user’s touch
* ends if touchEnded() isn’t declared. If
@@ -1589,17 +1589,17 @@ p5.prototype._onclick = function(e) {
* automatically when the user presses and releases the mouse button twice
* quickly:
*
- *
+ * ```js
* function doubleClicked() {
* // Code to run.
* }
- *
+ * ```
*
* The mouse system variables, such as mouseX and
* mouseY, will be updated with their most recent
* value when `doubleClicked()` is called by p5.js:
*
- *
+ * ```js
* function doubleClicked() {
* if (mouseX < 50) {
* // Code to run if the mouse is on the left.
@@ -1609,18 +1609,18 @@ p5.prototype._onclick = function(e) {
* // Code to run if the mouse is near the bottom.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `doubleClicked()` is always passed a
* MouseEvent
* object with properties that describe the double-click event:
*
- *
+ * ```js
* function doubleClicked(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* On touchscreen devices, code placed in `doubleClicked()` will run after two
* touches that occur within a short time.
@@ -1735,17 +1735,17 @@ p5.prototype._pmouseWheelDeltaY = 0;
* Declaring the function `mouseWheel()` sets a code block to run
* automatically when the user scrolls with the mouse wheel:
*
- *
+ * ```js
* function mouseWheel() {
* // Code to run.
* }
- *
+ * ```
*
* The mouse system variables, such as mouseX and
* mouseY, will be updated with their most recent
* value when `mouseWheel()` is called by p5.js:
*
- *
+ * ```js
* function mouseWheel() {
* if (mouseX < 50) {
* // Code to run if the mouse is on the left.
@@ -1755,18 +1755,18 @@ p5.prototype._pmouseWheelDeltaY = 0;
* // Code to run if the mouse is near the bottom.
* }
* }
- *
+ * ```
*
* The parameter, `event`, is optional. `mouseWheel()` is always passed a
* MouseEvent
* object with properties that describe the mouse scroll event:
*
- *
+ * ```js
* function mouseWheel(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* The `event` object has many properties including `delta`, a `Number`
* containing the distance that the user scrolled. For example, `event.delta`
diff --git a/src/events/touch.js b/src/events/touch.js
index 36efa73661..ff2587f1bc 100644
--- a/src/events/touch.js
+++ b/src/events/touch.js
@@ -14,7 +14,7 @@ import p5 from '../core/main';
* screen, a new touch point is tracked and added to the array. Touch points
* are `Objects` with the following properties:
*
- *
+ * ```js
* // Iterate over the touches array.
* for (let touch of touches) {
* // x-coordinate relative to the top-left
@@ -36,7 +36,7 @@ import p5 from '../core/main';
* // ID number
* console.log(touch.id);
* }
- *
+ * ```
*
* @property {Object[]} touches
* @readOnly
@@ -128,16 +128,16 @@ function getTouchInfo(canvas, w, h, e, i = 0) {
* Declaring a function called `touchStarted()` sets a code block to run
* automatically each time the user begins touching a touchscreen device:
*
- *
+ * ```js
* function touchStarted() {
* // Code to run.
* }
- *
+ * ```
*
* The touches array will be updated with the most
* recent touch points when `touchStarted()` is called by p5.js:
*
- *
+ * ```js
* function touchStarted() {
* // Paint over the background.
* background(200);
@@ -147,18 +147,18 @@ function getTouchInfo(canvas, w, h, e, i = 0) {
* circle(touch.x, touch.y, 40);
* }
* }
- *
+ * ```
*
* The parameter, event, is optional. `touchStarted()` will be passed a
* TouchEvent
* object with properties that describe the touch event:
*
- *
+ * ```js
* function touchStarted(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* On touchscreen devices, mousePressed() will
* run when a user’s touch starts if `touchStarted()` isn’t declared. If
@@ -298,16 +298,16 @@ p5.prototype._ontouchstart = function(e) {
* Declaring the function `touchMoved()` sets a code block to run
* automatically when the user touches a touchscreen device and moves:
*
- *
+ * ```js
* function touchMoved() {
* // Code to run.
* }
- *
+ * ```
*
* The touches array will be updated with the most
* recent touch points when `touchMoved()` is called by p5.js:
*
- *
+ * ```js
* function touchMoved() {
* // Paint over the background.
* background(200);
@@ -317,18 +317,18 @@ p5.prototype._ontouchstart = function(e) {
* circle(touch.x, touch.y, 40);
* }
* }
- *
+ * ```
*
* The parameter, event, is optional. `touchMoved()` will be passed a
* TouchEvent
* object with properties that describe the touch event:
*
- *
+ * ```js
* function touchMoved(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* On touchscreen devices, mouseDragged() will
* run when the user’s touch points move if `touchMoved()` isn’t declared. If
@@ -471,16 +471,16 @@ p5.prototype._ontouchmove = function(e) {
* Declaring the function `touchEnded()` sets a code block to run
* automatically when the user stops touching a touchscreen device:
*
- *
+ * ```js
* function touchEnded() {
* // Code to run.
* }
- *
+ * ```
*
* The touches array will be updated with the most
* recent touch points when `touchEnded()` is called by p5.js:
*
- *
+ * ```js
* function touchEnded() {
* // Paint over the background.
* background(200);
@@ -491,18 +491,18 @@ p5.prototype._ontouchmove = function(e) {
* circle(touch.x, touch.y, 40);
* }
* }
- *
+ * ```
*
* The parameter, event, is optional. `touchEnded()` will be passed a
* TouchEvent
* object with properties that describe the touch event:
*
- *
+ * ```js
* function touchEnded(event) {
* // Code to run that uses the event.
* console.log(event);
* }
- *
+ * ```
*
* On touchscreen devices, mouseReleased() will
* run when the user’s touch ends if `touchEnded()` isn’t declared. If
diff --git a/src/webgl/loading.js b/src/webgl/loading.js
index bc1808f913..f5e43baf26 100755
--- a/src/webgl/loading.js
+++ b/src/webgl/loading.js
@@ -49,7 +49,7 @@ import './p5.Geometry';
* as in `loadModel('assets/model.obj', options)`. The `options` object can
* have the following properties:
*
- *
+ * ```js
* let options = {
* // Enables standardized size scaling during loading if set to true.
* normalize: true,
@@ -72,7 +72,7 @@ import './p5.Geometry';
*
* // Pass the options object to loadModel().
* loadModel('assets/model.obj', options);
- *
+ * ```
*
* Models can take time to load. Calling `loadModel()` in
* preload() ensures models load before they're
diff --git a/src/webgl/material.js b/src/webgl/material.js
index 300ce20e5f..a503548227 100644
--- a/src/webgl/material.js
+++ b/src/webgl/material.js
@@ -1241,18 +1241,18 @@ p5.prototype.textureMode = function (mode) {
* to the pixel at coordinates `(u, v)` within an image. For example, the
* corners of a rectangular image are mapped to the corners of a rectangle by default:
*
- *
+ * ```js
* // Apply the image as a texture.
* texture(img);
*
* // Draw the rectangle.
* rect(0, 0, 30, 50);
- *
+ * ```
*
* If the image in the code snippet above has dimensions of 300 x 500 pixels,
* the same result could be achieved as follows:
*
- *
+ * ```js
* // Apply the image as a texture.
* texture(img);
*
@@ -1276,14 +1276,14 @@ p5.prototype.textureMode = function (mode) {
* vertex(0, 50, 0, 0, 500);
*
* endShape();
- *
+ * ```
*
* `textureWrap()` controls how textures behave when their uv's go beyond the
* texture. Doing so can produce interesting visual effects such as tiling.
* For example, the custom shape above could have u-coordinates are greater
* than the image’s width:
*
- *
+ * ```js
* // Apply the image as a texture.
* texture(img);
*
@@ -1301,7 +1301,7 @@ p5.prototype.textureMode = function (mode) {
*
* vertex(0, 50, 0, 0, 500);
* endShape();
- *
+ * ```
*
* The u-coordinates of 600 are greater than the texture image’s width of 300.
* This creates interesting possibilities.