A class to describe a camera for viewing a 3D sketch.
\nEach p5.Camera object represents a camera that views a section of 3D\nspace. It stores information about the camera’s position, orientation, and\nprojection.
In WebGL mode, the default camera is a p5.Camera object that can be\ncontrolled with the camera(),\nperspective(),\northo(), and\nfrustum() functions. Additional cameras can be\ncreated with createCamera() and activated\nwith setCamera().
Note: p5.Camera’s methods operate in two coordinate systems:
myCamera.setPosition() places the camera in 3D space using\n\"world\" coordinates.myCamera.move() moves the camera along its own axes.Blends multiple colors to find a color between them.
\nThe amt parameter specifies the amount to interpolate between the color\nstops which are colors at each amt value \"location\" with amt values\nthat are between 2 color stops interpolating between them based on its relative\ndistance to both.
The way that colors are interpolated depends on the current\ncolorMode().
\n", - "itemtype": "method", - "name": "paletteLerp", - "params": [ - { - "name": "colors_stops", - "description": "color stops to interpolate from
\n", - "type": "[p5.Color, Number][]" - }, - { - "name": "amt", - "description": "number to use to interpolate relative to color stops
\n", - "type": "Number" - } - ], - "return": { - "description": "interpolated color.", - "type": "p5.Color" - }, - "example": [ - "\n\nfunction setup() {\n createCanvas(400, 400);\n}\n\nfunction draw() {\n // The background goes from white to red to green to blue fill\n background(paletteLerp([\n ['white', 0],\n ['red', 0.05],\n ['green', 0.25],\n ['blue', 1]\n ], millis() / 10000 % 1));\n}\n\nGets the lightness value of a color.
\nlightness() extracts the HSL lightness value from a\np5.Color object, an array of color components, or\na CSS color string.
By default, lightness() returns a color's HSL lightness in the range 0\nto 100. If the colorMode() is set to HSL, it\nreturns the lightness value in the given range.
Gets the red value of a color.
\nred() extracts the red value from a\np5.Color object, an array of color components, or\na CSS color string.
By default, red() returns a color's red value in the range 0\nto 255. If the colorMode() is set to RGB, it\nreturns the red value in the given range.
Gets the saturation value of a color.
\nsaturation() extracts the saturation value from a\np5.Color object, an array of color components, or\na CSS color string.
Saturation is scaled differently in HSB and HSL. By default, saturation()\nreturns a color's HSL saturation in the range 0 to 100. If the\ncolorMode() is set to HSB or HSL, it returns the\nsaturation value in the given mode.
Sets the style for rendering the ends of lines.
\nThe caps for line endings are either rounded (ROUND), squared\n(SQUARE), or extended (PROJECT). The default cap is ROUND.
The argument passed to strokeCap() must be written in ALL CAPS because\nthe constants ROUND, SQUARE, and PROJECT are defined this way.\nJavaScript is a case-sensitive language.
Sets the style of the joints that connect line segments.
\nJoints are either mitered (MITER), beveled (BEVEL), or rounded\n(ROUND). The default joint is MITER in 2D mode and ROUND in WebGL\nmode.
The argument passed to strokeJoin() must be written in ALL CAPS because\nthe constants MITER, BEVEL, and ROUND are defined this way.\nJavaScript is a case-sensitive language.
Sets the width of the stroke used for points, lines, and the outlines of\nshapes.
\nNote: strokeWeight() is affected by transformations, especially calls to\nscale().
Adds a spline curve segment to a custom shape.
\ncurveVertex() adds a curved segment to custom shapes. The spline curves\nit creates are defined like those made by the\ncurve() function. curveVertex() must be called\nbetween the beginShape() and\nendShape() functions.
Spline curves can form shapes and curves that slope gently. They’re like\ncables that are attached to a set of points. Splines are defined by two\nanchor points and two control points. curveVertex() must be called at\nleast four times between\nbeginShape() and\nendShape() in order to draw a curve:
beginShape();\n\n// Add the first control point.\ncurveVertex(84, 91);\n\n// Add the anchor points to draw between.\ncurveVertex(68, 19);\ncurveVertex(21, 17);\n\n// Add the second control point.\ncurveVertex(32, 91);\n\nendShape();\nThe code snippet above would only draw the curve between the anchor points,\nsimilar to the curve() function. The segments\nbetween the control and anchor points can be drawn by calling\ncurveVertex() with the coordinates of the control points:
beginShape();\n\n// Add the first control point and draw a segment to it.\ncurveVertex(84, 91);\ncurveVertex(84, 91);\n\n// Add the anchor points to draw between.\ncurveVertex(68, 19);\ncurveVertex(21, 17);\n\n// Add the second control point.\ncurveVertex(32, 91);\n\n// Uncomment the next line to draw the segment to the second control point.\n// curveVertex(32, 91);\n\nendShape();\nThe first two parameters, x and y, set the vertex’s location. For\nexample, calling curveVertex(10, 10) adds a point to the curve at\n(10, 10).
Spline curves can also be drawn in 3D using WebGL mode. The 3D version of\ncurveVertex() has three arguments because each point has x-, y-, and\nz-coordinates. By default, the vertex’s z-coordinate is set to 0.
Note: curveVertex() won’t work when an argument is passed to\nbeginShape().
Adds a spline curve segment to a custom shape.
\ncurveVertex() adds a curved segment to custom shapes. The spline curves\nit creates are defined like those made by the\ncurve() function. curveVertex() must be called\nbetween the beginShape() and\nendShape() functions.
Spline curves can form shapes and curves that slope gently. They’re like\ncables that are attached to a set of points. Splines are defined by two\nanchor points and two control points. curveVertex() must be called at\nleast four times between\nbeginShape() and\nendShape() in order to draw a curve:
\nbeginShape();\n\n// Add the first control point.\ncurveVertex(84, 91);
\n// Add the anchor points to draw between.\ncurveVertex(68, 19);\ncurveVertex(21, 17);
\n// Add the second control point.\ncurveVertex(32, 91);
\nendShape();\n
\nThe code snippet above would only draw the curve between the anchor points,\nsimilar to the curve() function. The segments\nbetween the control and anchor points can be drawn by calling\ncurveVertex() with the coordinates of the control points:
\nbeginShape();\n\n// Add the first control point and draw a segment to it.\ncurveVertex(84, 91);\ncurveVertex(84, 91);
\n// Add the anchor points to draw between.\ncurveVertex(68, 19);\ncurveVertex(21, 17);
\n// Add the second control point.\ncurveVertex(32, 91);
\n// Uncomment the next line to draw the segment to the second control point.\n// curveVertex(32, 91);
\nendShape();\n
\nThe first two parameters, x and y, set the vertex’s location. For\nexample, calling curveVertex(10, 10) adds a point to the curve at\n(10, 10).
Spline curves can also be drawn in 3D using WebGL mode. The 3D version of\ncurveVertex() has three arguments because each point has x-, y-, and\nz-coordinates. By default, the vertex’s z-coordinate is set to 0.
Note: curveVertex() won’t work when an argument is passed to\nbeginShape().
Sets the normal vector for vertices in a custom 3D shape.
\n3D shapes created with beginShape() and\nendShape() are made by connecting sets of\npoints called vertices. Each vertex added with\nvertex() has a normal vector that points away\nfrom it. The normal vector controls how light reflects off the shape.
\nnormal() can be called two ways with different parameters to define the\nnormal vector's components.
The first way to call normal() has three parameters, x, y, and z.\nIf Numbers are passed, as in normal(1, 2, 3), they set the x-, y-, and\nz-components of the normal vector.
The second way to call normal() has one parameter, vector. If a\np5.Vector object is passed, as in\nnormal(myVector), its components will be used to set the normal vector.
normal() changes the normal vector of vertices added to a custom shape\nwith vertex(). normal() must be called between\nthe beginShape() and\nendShape() functions, just like\nvertex(). The normal vector set by calling\nnormal() will affect all following vertices until normal() is called\nagain:
beginShape();\n\n// Set the vertex normal.\nnormal(-0.4, -0.4, 0.8);\n\n// Add a vertex.\nvertex(-30, -30, 0);\n\n// Set the vertex normal.\nnormal(0, 0, 1);\n\n// Add vertices.\nvertex(30, -30, 0);\nvertex(30, 30, 0);\n\n// Set the vertex normal.\nnormal(0.4, -0.4, 0.8);\n\n// Add a vertex.\nvertex(-30, 30, 0);\n\nendShape();\nSets the normal vector for vertices in a custom 3D shape.
\n3D shapes created with beginShape() and\nendShape() are made by connecting sets of\npoints called vertices. Each vertex added with\nvertex() has a normal vector that points away\nfrom it. The normal vector controls how light reflects off the shape.
\nnormal() can be called two ways with different parameters to define the\nnormal vector's components.
The first way to call normal() has three parameters, x, y, and z.\nIf Numbers are passed, as in normal(1, 2, 3), they set the x-, y-, and\nz-components of the normal vector.
The second way to call normal() has one parameter, vector. If a\np5.Vector object is passed, as in\nnormal(myVector), its components will be used to set the normal vector.
normal() changes the normal vector of vertices added to a custom shape\nwith vertex(). normal() must be called between\nthe beginShape() and\nendShape() functions, just like\nvertex(). The normal vector set by calling\nnormal() will affect all following vertices until normal() is called\nagain:
\nbeginShape();\n\n// Set the vertex normal.\nnormal(-0.4, -0.4, 0.8);
\n// Add a vertex.\nvertex(-30, -30, 0);
\n// Set the vertex normal.\nnormal(0, 0, 1);
\n// Add vertices.\nvertex(30, -30, 0);\nvertex(30, 30, 0);
\n// Set the vertex normal.\nnormal(0.4, -0.4, 0.8);
\n// Add a vertex.\nvertex(-30, 30, 0);
\nendShape();\n
\n",
"itemtype": "method",
"name": "normal",
"chainable": 1,
@@ -28693,7 +28663,7 @@
},
{
"file": "src/scripts/parsers/in/p5.js/src/webgl/p5.Camera.js",
- "line": 851,
+ "line": 850,
"description": "The camera’s y-coordinate.
\nBy default, the camera’s y-coordinate is set to 0 in \"world\" space.
\n", "itemtype": "property", "name": "eyeX", @@ -28708,7 +28678,7 @@ }, { "file": "src/scripts/parsers/in/p5.js/src/webgl/p5.Camera.js", - "line": 963, + "line": 962, "description": "The camera’s y-coordinate.
\nBy default, the camera’s y-coordinate is set to 0 in \"world\" space.
\n", "itemtype": "property", "name": "eyeY", @@ -28723,7 +28693,7 @@ }, { "file": "src/scripts/parsers/in/p5.js/src/webgl/p5.Camera.js", - "line": 1075, + "line": 1074, "description": "The camera’s z-coordinate.
\nBy default, the camera’s z-coordinate is set to 800 in \"world\" space.
\n", "itemtype": "property", "name": "eyeZ", @@ -28738,7 +28708,7 @@ }, { "file": "src/scripts/parsers/in/p5.js/src/webgl/p5.Camera.js", - "line": 1187, + "line": 1186, "description": "The x-coordinate of the place where the camera looks.
\nBy default, the camera looks at the origin (0, 0, 0) in \"world\" space, so\nmyCamera.centerX is 0.
The y-coordinate of the place where the camera looks.
\nBy default, the camera looks at the origin (0, 0, 0) in \"world\" space, so\nmyCamera.centerY is 0.
The y-coordinate of the place where the camera looks.
\nBy default, the camera looks at the origin (0, 0, 0) in \"world\" space, so\nmyCamera.centerZ is 0.
The x-component of the camera's \"up\" vector.
\nThe camera's \"up\" vector orients its y-axis. By default, the \"up\" vector is\n(0, 1, 0), so its x-component is 0 in \"local\" space.
The y-component of the camera's \"up\" vector.
\nThe camera's \"up\" vector orients its y-axis. By default, the \"up\" vector is\n(0, 1, 0), so its y-component is 1 in \"local\" space.
The z-component of the camera's \"up\" vector.
\nThe camera's \"up\" vector orients its y-axis. By default, the \"up\" vector is\n(0, 1, 0), so its z-component is 0 in \"local\" space.
Sets a perspective projection for the camera.
\nIn a perspective projection, shapes that are further from the camera appear\nsmaller than shapes that are near the camera. This technique, called\nforeshortening, creates realistic 3D scenes. It’s applied by default in new\np5.Camera objects.
myCamera.perspective() changes the camera’s perspective by changing its\nviewing frustum. The frustum is the volume of space that’s visible to the\ncamera. The frustum’s shape is a pyramid with its top cut off. The camera\nis placed where the top of the pyramid should be and points towards the\nbase of the pyramid. It views everything within the frustum.
The first parameter, fovy, is the camera’s vertical field of view. It’s\nan angle that describes how tall or narrow a view the camera has. For\nexample, calling myCamera.perspective(0.5) sets the camera’s vertical\nfield of view to 0.5 radians. By default, fovy is calculated based on the\nsketch’s height and the camera’s default z-coordinate, which is 800. The\nformula for the default fovy is 2 * atan(height / 2 / 800).
The second parameter, aspect, is the camera’s aspect ratio. It’s a number\nthat describes the ratio of the top plane’s width to its height. For\nexample, calling myCamera.perspective(0.5, 1.5) sets the camera’s field\nof view to 0.5 radians and aspect ratio to 1.5, which would make shapes\nappear thinner on a square canvas. By default, aspect is set to\nwidth / height.
The third parameter, near, is the distance from the camera to the near\nplane. For example, calling myCamera.perspective(0.5, 1.5, 100) sets the\ncamera’s field of view to 0.5 radians, its aspect ratio to 1.5, and places\nthe near plane 100 pixels from the camera. Any shapes drawn less than 100\npixels from the camera won’t be visible. By default, near is set to\n0.1 * 800, which is 1/10th the default distance between the camera and\nthe origin.
The fourth parameter, far, is the distance from the camera to the far\nplane. For example, calling myCamera.perspective(0.5, 1.5, 100, 10000)\nsets the camera’s field of view to 0.5 radians, its aspect ratio to 1.5,\nplaces the near plane 100 pixels from the camera, and places the far plane\n10,000 pixels from the camera. Any shapes drawn more than 10,000 pixels\nfrom the camera won’t be visible. By default, far is set to 10 * 800,\nwhich is 10 times the default distance between the camera and the origin.
Sets an orthographic projection for the camera.
\nIn an orthographic projection, shapes with the same size always appear the\nsame size, regardless of whether they are near or far from the camera.
\nmyCamera.ortho() changes the camera’s perspective by changing its viewing\nfrustum from a truncated pyramid to a rectangular prism. The frustum is the\nvolume of space that’s visible to the camera. The camera is placed in front\nof the frustum and views everything within the frustum. myCamera.ortho()\nhas six optional parameters to define the viewing frustum.
The first four parameters, left, right, bottom, and top, set the\ncoordinates of the frustum’s sides, bottom, and top. For example, calling\nmyCamera.ortho(-100, 100, 200, -200) creates a frustum that’s 200 pixels\nwide and 400 pixels tall. By default, these dimensions are set based on\nthe sketch’s width and height, as in\nmyCamera.ortho(-width / 2, width / 2, -height / 2, height / 2).
The last two parameters, near and far, set the distance of the\nfrustum’s near and far plane from the camera. For example, calling\nmyCamera.ortho(-100, 100, 200, -200, 50, 1000) creates a frustum that’s\n200 pixels wide, 400 pixels tall, starts 50 pixels from the camera, and\nends 1,000 pixels from the camera. By default, near and far are set to\n0 and max(width, height) + 800, respectively.
Sets the camera's frustum.
\nIn a frustum projection, shapes that are further from the camera appear\nsmaller than shapes that are near the camera. This technique, called\nforeshortening, creates realistic 3D scenes.
\nmyCamera.frustum() changes the camera’s perspective by changing its\nviewing frustum. The frustum is the volume of space that’s visible to the\ncamera. The frustum’s shape is a pyramid with its top cut off. The camera\nis placed where the top of the pyramid should be and points towards the\nbase of the pyramid. It views everything within the frustum.
The first four parameters, left, right, bottom, and top, set the\ncoordinates of the frustum’s sides, bottom, and top. For example, calling\nmyCamera.frustum(-100, 100, 200, -200) creates a frustum that’s 200\npixels wide and 400 pixels tall. By default, these coordinates are set\nbased on the sketch’s width and height, as in\nmyCamera.frustum(-width / 20, width / 20, height / 20, -height / 20).
The last two parameters, near and far, set the distance of the\nfrustum’s near and far plane from the camera. For example, calling\nmyCamera.frustum(-100, 100, 200, -200, 50, 1000) creates a frustum that’s\n200 pixels wide, 400 pixels tall, starts 50 pixels from the camera, and ends\n1,000 pixels from the camera. By default, near is set to 0.1 * 800, which\nis 1/10th the default distance between the camera and the origin. far is\nset to 10 * 800, which is 10 times the default distance between the\ncamera and the origin.
Rotates the camera in a clockwise/counter-clockwise direction.
\nRolling rotates the camera without changing its orientation. The rotation\nhappens in the camera’s \"local\" space.
\nThe parameter, angle, is the angle the camera should rotate. Passing a\npositive angle, as in myCamera.roll(0.001), rotates the camera in counter-clockwise direction.\nPassing a negative angle, as in myCamera.roll(-0.001), rotates the\ncamera in clockwise direction.
Note: Angles are interpreted based on the current\nangleMode().
\n", "itemtype": "method", "name": "roll", @@ -28990,7 +28960,7 @@ }, { "file": "src/scripts/parsers/in/p5.js/src/webgl/p5.Camera.js", - "line": 2542, + "line": 2541, "description": "Rotates the camera left and right.
\nPanning rotates the camera without changing its position. The rotation\nhappens in the camera’s \"local\" space.
\nThe parameter, angle, is the angle the camera should rotate. Passing a\npositive angle, as in myCamera.pan(0.001), rotates the camera to the\nright. Passing a negative angle, as in myCamera.pan(-0.001), rotates the\ncamera to the left.
Note: Angles are interpreted based on the current\nangleMode().
\n", "itemtype": "method", "name": "pan", @@ -29010,7 +28980,7 @@ }, { "file": "src/scripts/parsers/in/p5.js/src/webgl/p5.Camera.js", - "line": 2605, + "line": 2604, "description": "Rotates the camera up and down.
\nTilting rotates the camera without changing its position. The rotation\nhappens in the camera’s \"local\" space.
\nThe parameter, angle, is the angle the camera should rotate. Passing a\npositive angle, as in myCamera.tilt(0.001), rotates the camera down.\nPassing a negative angle, as in myCamera.tilt(-0.001), rotates the camera\nup.
Note: Angles are interpreted based on the current\nangleMode().
\n", "itemtype": "method", "name": "tilt", @@ -29030,7 +29000,7 @@ }, { "file": "src/scripts/parsers/in/p5.js/src/webgl/p5.Camera.js", - "line": 2668, + "line": 2667, "description": "Points the camera at a location.
\nmyCamera.lookAt() changes the camera’s orientation without changing its\nposition.
The parameters, x, y, and z, are the coordinates in \"world\" space\nwhere the camera should point. For example, calling\nmyCamera.lookAt(10, 20, 30) points the camera at the coordinates\n(10, 20, 30).
Sets the position and orientation of the camera.
\nmyCamera.camera() allows objects to be viewed from different angles. It\nhas nine parameters that are all optional.
The first three parameters, x, y, and z, are the coordinates of the\ncamera’s position in \"world\" space. For example, calling\nmyCamera.camera(0, 0, 0) places the camera at the origin (0, 0, 0). By\ndefault, the camera is placed at (0, 0, 800).
The next three parameters, centerX, centerY, and centerZ are the\ncoordinates of the point where the camera faces in \"world\" space. For\nexample, calling myCamera.camera(0, 0, 0, 10, 20, 30) places the camera\nat the origin (0, 0, 0) and points it at (10, 20, 30). By default, the\ncamera points at the origin (0, 0, 0).
The last three parameters, upX, upY, and upZ are the components of\nthe \"up\" vector in \"local\" space. The \"up\" vector orients the camera’s\ny-axis. For example, calling\nmyCamera.camera(0, 0, 0, 10, 20, 30, 0, -1, 0) places the camera at the\norigin (0, 0, 0), points it at (10, 20, 30), and sets the \"up\" vector\nto (0, -1, 0) which is like holding it upside-down. By default, the \"up\"\nvector is (0, 1, 0).
Moves the camera along its \"local\" axes without changing its orientation.
\nThe parameters, x, y, and z, are the distances the camera should\nmove. For example, calling myCamera.move(10, 20, 30) moves the camera 10\npixels to the right, 20 pixels down, and 30 pixels backward in its \"local\"\nspace.
Sets the camera’s position in \"world\" space without changing its\norientation.
\nThe parameters, x, y, and z, are the coordinates where the camera\nshould be placed. For example, calling myCamera.setPosition(10, 20, 30)\nplaces the camera at coordinates (10, 20, 30) in \"world\" space.
Sets the camera’s position, orientation, and projection by copying another\ncamera.
\nThe parameter, cam, is the p5.Camera object to copy. For example, calling\ncam2.set(cam1) will set cam2 using cam1’s configuration.
Sets the camera’s position and orientation to values that are in-between\nthose of two other cameras.
\nmyCamera.slerp() uses spherical linear interpolation to calculate a\nposition and orientation that’s in-between two other cameras. Doing so is\nhelpful for transitioning smoothly between two perspectives.
The first two parameters, cam0 and cam1, are the p5.Camera objects\nthat should be used to set the current camera.
The third parameter, amt, is the amount to interpolate between cam0 and\ncam1. 0.0 keeps the camera’s position and orientation equal to cam0’s,\n0.5 sets them halfway between cam0’s and cam1’s , and 1.0 sets the\nposition and orientation equal to cam1’s.
For example, calling myCamera.slerp(cam0, cam1, 0.1) sets cam’s position\nand orientation very close to cam0’s. Calling\nmyCamera.slerp(cam0, cam1, 0.9) sets cam’s position and orientation very\nclose to cam1’s.
Note: All of the cameras must use the same projection.
\n", "itemtype": "method", "name": "slerp", @@ -29239,7 +29209,7 @@ }, { "file": "src/scripts/parsers/in/p5.js/src/webgl/p5.Camera.js", - "line": 3888, + "line": 3887, "description": "Sets the current (active) camera of a 3D sketch.
\nsetCamera() allows for switching between multiple cameras created with\ncreateCamera().
Note: setCamera() can only be used in WebGL mode.
From the - MDN entry: - - The JSON.stringify() method converts a JavaScript object or value to a JSON string.
-line: 490 -isConstructor: false -itemtype: method -alt: This example does not render anything -example: - - |- - -
- let myObject = { x: 5, y: 6 };
- let myObjectAsString = JSON.stringify(myObject);
- console.log(myObjectAsString); // prints "{"x":5,"y":6}" to the console
- console.log(typeof myObjectAsString); // prints 'string' to the console
-
- :Javascript object that you would like to convert to JSON
- type: Object -chainable: false ---- - - -# stringify diff --git a/src/content/reference/en/console/log.mdx b/src/content/reference/en/console/log.mdx deleted file mode 100644 index d22f5fb441..0000000000 --- a/src/content/reference/en/console/log.mdx +++ /dev/null @@ -1,64 +0,0 @@ ---- -title: log -module: Foundation -submodule: Foundation -file: src/core/reference.js -description: > -Prints a message to your browser's web console. When using p5, you can use - print - - and console.log interchangeably.
- -The console is opened differently depending on which browser you are using. - - Here are links on how to open the console in Firefox - - , Chrome, - Edge, - - and Safari. - - With the online p5 editor the console - - is embedded directly in the page underneath the code editor.
- -From the MDN - entry: - - The Console method log() outputs a message to the web console. The message may - - be a single string (with optional - substitution values), - - or it may be any one or more JavaScript objects.
-line: 512 -isConstructor: false -itemtype: method -alt: This example does not render anything -example: - - |- - -
- let myNum = 5;
- console.log(myNum); // prints 5 to the console
- console.log(myNum + 12); // prints 17 to the console
-
- :Message that you would like to print to the console
- type: String|Expression|Object -chainable: false ---- - - -# log diff --git a/src/content/reference/en/p5.AudioIn/getSources.mdx b/src/content/reference/en/p5.AudioIn/getSources.mdx index 112f34fdf8..df9ab93f1b 100644 --- a/src/content/reference/en/p5.AudioIn/getSources.mdx +++ b/src/content/reference/en/p5.AudioIn/getSources.mdx @@ -6,7 +6,7 @@ file: lib/addons/p5.sound.js description: |Returns a list of available input sources. This is a wrapper for + en-US/docs/Web/API/MediaDevices/enumerateDevices/" target="_blank"> MediaDevices.enumerateDevices() - Web APIs | MDN and it returns a Promise.
line: 6280 diff --git a/src/content/reference/en/p5.AudioIn/setSource.mdx b/src/content/reference/en/p5.AudioIn/setSource.mdx index 556d825a01..bfd12b7f3a 100644 --- a/src/content/reference/en/p5.AudioIn/setSource.mdx +++ b/src/content/reference/en/p5.AudioIn/setSource.mdx @@ -8,7 +8,7 @@ description: | position in the array returned by getSources(). This is only available in browsers that support + en-US/docs/Web/API/MediaDevices/enumerateDevices/" target="_blank"> navigator.mediaDevices.enumerateDevices() line: 6340 isConstructor: false diff --git a/src/content/reference/en/p5.Camera/camera.mdx b/src/content/reference/en/p5.Camera/camera.mdx index 67f87ab509..5a1ce096dc 100644 --- a/src/content/reference/en/p5.Camera/camera.mdx +++ b/src/content/reference/en/p5.Camera/camera.mdx @@ -51,7 +51,7 @@ description: > the "up" vector is(0, 1, 0).
-line: 2765
+line: 2764
isConstructor: false
itemtype: method
example:
diff --git a/src/content/reference/en/p5.Camera/centerX.mdx b/src/content/reference/en/p5.Camera/centerX.mdx
index 9f519b15dc..a2fc569cf3 100644
--- a/src/content/reference/en/p5.Camera/centerX.mdx
+++ b/src/content/reference/en/p5.Camera/centerX.mdx
@@ -10,7 +10,7 @@ description: >
"world" space, so
myCamera.centerX is 0.
-line: 1187
+line: 1186
isConstructor: false
itemtype: property
example:
diff --git a/src/content/reference/en/p5.Camera/centerY.mdx b/src/content/reference/en/p5.Camera/centerY.mdx
index 3dbe3aec5f..afc22f85d9 100644
--- a/src/content/reference/en/p5.Camera/centerY.mdx
+++ b/src/content/reference/en/p5.Camera/centerY.mdx
@@ -10,7 +10,7 @@ description: >
"world" space, so
myCamera.centerY is 0.
-line: 1300
+line: 1299
isConstructor: false
itemtype: property
example:
diff --git a/src/content/reference/en/p5.Camera/centerZ.mdx b/src/content/reference/en/p5.Camera/centerZ.mdx
index 4695abd3c9..ac8c5ca3f5 100644
--- a/src/content/reference/en/p5.Camera/centerZ.mdx
+++ b/src/content/reference/en/p5.Camera/centerZ.mdx
@@ -10,7 +10,7 @@ description: >
"world" space, so
myCamera.centerZ is 0.
-line: 1413
+line: 1412
isConstructor: false
itemtype: property
example:
diff --git a/src/content/reference/en/p5.Camera/eyeX.mdx b/src/content/reference/en/p5.Camera/eyeX.mdx
index 65cef92a93..260b0d6e9e 100644
--- a/src/content/reference/en/p5.Camera/eyeX.mdx
+++ b/src/content/reference/en/p5.Camera/eyeX.mdx
@@ -6,7 +6,7 @@ file: src/webgl/p5.Camera.js
description: |
The camera’s y-coordinate.
By default, the camera’s y-coordinate is set to 0 in "world" space.
-line: 851 +line: 850 isConstructor: false itemtype: property example: diff --git a/src/content/reference/en/p5.Camera/eyeY.mdx b/src/content/reference/en/p5.Camera/eyeY.mdx index d00f4dff88..8e36ec5ad8 100644 --- a/src/content/reference/en/p5.Camera/eyeY.mdx +++ b/src/content/reference/en/p5.Camera/eyeY.mdx @@ -6,7 +6,7 @@ file: src/webgl/p5.Camera.js description: |The camera’s y-coordinate.
By default, the camera’s y-coordinate is set to 0 in "world" space.
-line: 963 +line: 962 isConstructor: false itemtype: property example: diff --git a/src/content/reference/en/p5.Camera/eyeZ.mdx b/src/content/reference/en/p5.Camera/eyeZ.mdx index 1a18868aed..1797733dd2 100644 --- a/src/content/reference/en/p5.Camera/eyeZ.mdx +++ b/src/content/reference/en/p5.Camera/eyeZ.mdx @@ -6,7 +6,7 @@ file: src/webgl/p5.Camera.js description: |The camera’s z-coordinate.
By default, the camera’s z-coordinate is set to 800 in "world" space.
-line: 1075 +line: 1074 isConstructor: false itemtype: property example: diff --git a/src/content/reference/en/p5.Camera/frustum.mdx b/src/content/reference/en/p5.Camera/frustum.mdx index 928f3791f6..8e33161ec0 100644 --- a/src/content/reference/en/p5.Camera/frustum.mdx +++ b/src/content/reference/en/p5.Camera/frustum.mdx @@ -58,7 +58,7 @@ description: > the camera and the origin. -line: 2274 +line: 2273 isConstructor: false itemtype: method example: diff --git a/src/content/reference/en/p5.Camera/lookAt.mdx b/src/content/reference/en/p5.Camera/lookAt.mdx index 2186bcd3cc..a2ca88436d 100644 --- a/src/content/reference/en/p5.Camera/lookAt.mdx +++ b/src/content/reference/en/p5.Camera/lookAt.mdx @@ -19,7 +19,7 @@ description: >myCamera.lookAt(10, 20, 30) points the camera at the coordinates
(10, 20, 30).
-line: 2668
+line: 2667
isConstructor: false
itemtype: method
example:
diff --git a/src/content/reference/en/p5.Camera/move.mdx b/src/content/reference/en/p5.Camera/move.mdx
index aea1542603..efb34c03af 100644
--- a/src/content/reference/en/p5.Camera/move.mdx
+++ b/src/content/reference/en/p5.Camera/move.mdx
@@ -16,7 +16,7 @@ description: >
pixels to the right, 20 pixels down, and 30 pixels backward in its "local"
space.
-line: 2993
+line: 2992
isConstructor: false
itemtype: method
example:
diff --git a/src/content/reference/en/p5.Camera/ortho.mdx b/src/content/reference/en/p5.Camera/ortho.mdx
index 18c4a7f902..b10c859399 100644
--- a/src/content/reference/en/p5.Camera/ortho.mdx
+++ b/src/content/reference/en/p5.Camera/ortho.mdx
@@ -51,7 +51,7 @@ description: >
far are set to
0 and max(width, height) + 800, respectively.
-line: 2086
+line: 2085
isConstructor: false
itemtype: method
example:
diff --git a/src/content/reference/en/p5.Camera/pan.mdx b/src/content/reference/en/p5.Camera/pan.mdx
index 7d64f06b88..0e54088957 100644
--- a/src/content/reference/en/p5.Camera/pan.mdx
+++ b/src/content/reference/en/p5.Camera/pan.mdx
@@ -23,8 +23,8 @@ description: >
Note: Angles are interpreted based on the current - angleMode().
-line: 2542 + angleMode(). +line: 2541 isConstructor: false itemtype: method example: diff --git a/src/content/reference/en/p5.Camera/perspective.mdx b/src/content/reference/en/p5.Camera/perspective.mdx index 68023446a3..544e5232fe 100644 --- a/src/content/reference/en/p5.Camera/perspective.mdx +++ b/src/content/reference/en/p5.Camera/perspective.mdx @@ -89,7 +89,7 @@ description: >10 * 800,
which is 10 times the default distance between the camera and the origin.
-line: 1863
+line: 1862
isConstructor: false
itemtype: method
example:
diff --git a/src/content/reference/en/p5.Camera/roll.mdx b/src/content/reference/en/p5.Camera/roll.mdx
index 596149c588..9951ec1a7c 100644
--- a/src/content/reference/en/p5.Camera/roll.mdx
+++ b/src/content/reference/en/p5.Camera/roll.mdx
@@ -23,8 +23,8 @@ description: >
Note: Angles are interpreted based on the current - angleMode().
-line: 2464 + angleMode(). +line: 2463 isConstructor: false itemtype: method alt: >- diff --git a/src/content/reference/en/p5.Camera/set.mdx b/src/content/reference/en/p5.Camera/set.mdx index 78394446d7..4d5d2c3286 100644 --- a/src/content/reference/en/p5.Camera/set.mdx +++ b/src/content/reference/en/p5.Camera/set.mdx @@ -13,7 +13,7 @@ description: >cam2.set(cam1) will set cam2 using
cam1’s configuration.
-line: 3244
+line: 3243
isConstructor: false
itemtype: method
example:
diff --git a/src/content/reference/en/p5.Camera/setPosition.mdx b/src/content/reference/en/p5.Camera/setPosition.mdx
index 0cf4125e43..09696ad229 100644
--- a/src/content/reference/en/p5.Camera/setPosition.mdx
+++ b/src/content/reference/en/p5.Camera/setPosition.mdx
@@ -16,7 +16,7 @@ description: >
places the camera at coordinates (10, 20, 30) in "world"
space.
-line: 3090
+line: 3089
isConstructor: false
itemtype: method
example:
diff --git a/src/content/reference/en/p5.Camera/slerp.mdx b/src/content/reference/en/p5.Camera/slerp.mdx
index 5e0c314e02..a16681a11c 100644
--- a/src/content/reference/en/p5.Camera/slerp.mdx
+++ b/src/content/reference/en/p5.Camera/slerp.mdx
@@ -42,7 +42,7 @@ description: >
close to cam1’s.
Note: All of the cameras must use the same projection.
-line: 3321 +line: 3320 isConstructor: false itemtype: method example: diff --git a/src/content/reference/en/p5.Camera/tilt.mdx b/src/content/reference/en/p5.Camera/tilt.mdx index 57799e0913..10d4500071 100644 --- a/src/content/reference/en/p5.Camera/tilt.mdx +++ b/src/content/reference/en/p5.Camera/tilt.mdx @@ -23,8 +23,8 @@ description: >Note: Angles are interpreted based on the current - angleMode().
-line: 2605 + angleMode(). +line: 2604 isConstructor: false itemtype: method example: diff --git a/src/content/reference/en/p5.Camera/upX.mdx b/src/content/reference/en/p5.Camera/upX.mdx index a1832a4b12..cc9a7af311 100644 --- a/src/content/reference/en/p5.Camera/upX.mdx +++ b/src/content/reference/en/p5.Camera/upX.mdx @@ -7,7 +7,7 @@ description: |The x-component of the camera's "up" vector.
The camera's "up" vector orients its y-axis. By default, the "up" vector is
(0, 1, 0), so its x-component is 0 in "local" space.
The y-component of the camera's "up" vector.
The camera's "up" vector orients its y-axis. By default, the "up" vector is
(0, 1, 0), so its y-component is 1 in "local" space.
The z-component of the camera's "up" vector.
The camera's "up" vector orients its y-axis. By default, the "up" vector is
(0, 1, 0), so its z-component is 0 in "local" space.
The range depends on the - colorMode(). In the default RGB mode + colorMode(). In the default RGB mode it's between 0 and 255.
diff --git a/src/content/reference/en/p5.Color/setBlue.mdx b/src/content/reference/en/p5.Color/setBlue.mdx index d73f646104..64ad3804aa 100644 --- a/src/content/reference/en/p5.Color/setBlue.mdx +++ b/src/content/reference/en/p5.Color/setBlue.mdx @@ -6,8 +6,8 @@ file: src/color/p5.Color.js description: >Sets the blue component of a color.
-The range depends on the colorMode(). - In the +
The range depends on the colorMode(). In the default RGB mode it's between 0 and 255.
line: 655 diff --git a/src/content/reference/en/p5.Color/setGreen.mdx b/src/content/reference/en/p5.Color/setGreen.mdx index 97b172f99c..7f837f98e2 100644 --- a/src/content/reference/en/p5.Color/setGreen.mdx +++ b/src/content/reference/en/p5.Color/setGreen.mdx @@ -6,8 +6,8 @@ file: src/color/p5.Color.js description: >Sets the green component of a color.
-The range depends on the colorMode(). - In the +
The range depends on the colorMode(). In the default RGB mode it's between 0 and 255.
line: 613 diff --git a/src/content/reference/en/p5.Color/setRed.mdx b/src/content/reference/en/p5.Color/setRed.mdx index 4932bd6fae..3f02eebfde 100644 --- a/src/content/reference/en/p5.Color/setRed.mdx +++ b/src/content/reference/en/p5.Color/setRed.mdx @@ -6,8 +6,8 @@ file: src/color/p5.Color.js description: >Sets the red component of a color.
-The range depends on the colorMode(). - In the +
The range depends on the colorMode(). In the default RGB mode it's between 0 and 255.
line: 571 diff --git a/src/content/reference/en/p5.Element/class.mdx b/src/content/reference/en/p5.Element/class.mdx index 24e3e40406..9a8bd087bb 100644 --- a/src/content/reference/en/p5.Element/class.mdx +++ b/src/content/reference/en/p5.Element/class.mdx @@ -7,7 +7,7 @@ description: >Adds a class attribute to the element using a given string.
diff --git a/src/content/reference/en/p5.Element/drop.mdx b/src/content/reference/en/p5.Element/drop.mdx index a1690228b2..bf57c1f60e 100644 --- a/src/content/reference/en/p5.Element/drop.mdx +++ b/src/content/reference/en/p5.Element/drop.mdx @@ -24,7 +24,7 @@ description: > parameter,event, that's a
DragEvent.
+ href="https://developer.mozilla.org/en-US/docs/Web/API/DragEvent/">DragEvent.
line: 3772
isConstructor: false
itemtype: method
diff --git a/src/content/reference/en/p5.Element/elt.mdx b/src/content/reference/en/p5.Element/elt.mdx
index 6249c1d5ec..e7f3aa9ed2 100644
--- a/src/content/reference/en/p5.Element/elt.mdx
+++ b/src/content/reference/en/p5.Element/elt.mdx
@@ -8,7 +8,7 @@ description: >
The - HTMLElement object's properties and methods can be used directly.
diff --git a/src/content/reference/en/p5.Element/position.mdx b/src/content/reference/en/p5.Element/position.mdx index c1d7b987c7..b6d5b98f59 100644 --- a/src/content/reference/en/p5.Element/position.mdx +++ b/src/content/reference/en/p5.Element/position.mdx @@ -15,7 +15,7 @@ description: > element's positioning + href="https://developer.mozilla.org/en-US/docs/Web/CSS/position/">positioning scheme.positionType is a string that can be either
diff --git a/src/content/reference/en/p5.Element/style.mdx b/src/content/reference/en/p5.Element/style.mdx
index c84e49738a..d785ba59ca 100644
--- a/src/content/reference/en/p5.Element/style.mdx
+++ b/src/content/reference/en/p5.Element/style.mdx
@@ -6,7 +6,7 @@ file: src/dom/dom.js
description: >
Applies a style to the element by adding a - CSS declaration.
The first parameter, property, is a string. If the name of a
diff --git a/src/content/reference/en/p5.Envelope/play.mdx b/src/content/reference/en/p5.Envelope/play.mdx
index 4574e3e9b5..2508ca3595 100644
--- a/src/content/reference/en/p5.Envelope/play.mdx
+++ b/src/content/reference/en/p5.Envelope/play.mdx
@@ -8,7 +8,7 @@ description: |-
If the input is a p5.sound object (i.e. AudioIn, Oscillator,
SoundFile), then Envelope will control its output volume.
Envelopes can also be used to control any
+ http://docs.webplatform.org/wiki/apis/webaudio/AudioParam/">
Web Audio Audio Param.
Exponentially ramp to a value using the first two
- values from setADSR(attackTime,
+ values from setADSR(attackTime,
decayTime)
- as
+ as
time constants for simple exponential ramps.
diff --git a/src/content/reference/en/p5.Envelope/triggerAttack.mdx b/src/content/reference/en/p5.Envelope/triggerAttack.mdx
index c815929dd8..e57eeaef9a 100644
--- a/src/content/reference/en/p5.Envelope/triggerAttack.mdx
+++ b/src/content/reference/en/p5.Envelope/triggerAttack.mdx
@@ -8,7 +8,7 @@ description: |
Similar to holding down a key on a piano, but it will
hold the sustain level until you let go. Input can be
any p5.sound object, or a
+ http://docs.webplatform.org/wiki/apis/webaudio/AudioParam/">
Web Audio Param.
Returns the
-
+
spectral centroid of the input signal.
NOTE: analyze() must be called prior to getCentroid(). Analyze()
tells the FFT to analyze frequency data, and getCentroid() uses
diff --git a/src/content/reference/en/p5.FFT/getEnergy.mdx b/src/content/reference/en/p5.FFT/getEnergy.mdx
index fa6458db75..b168d17f54 100644
--- a/src/content/reference/en/p5.FFT/getEnergy.mdx
+++ b/src/content/reference/en/p5.FFT/getEnergy.mdx
@@ -5,7 +5,7 @@ submodule: p5.sound
file: lib/addons/p5.sound.js
description: |
Returns the amount of energy (volume) at a specific
-
+
frequency, or the average amount of energy between two
frequencies. Accepts Number(s) corresponding
to frequency (in Hz), or a "string" corresponding to predefined
diff --git a/src/content/reference/en/p5.FFT/getOctaveBands.mdx b/src/content/reference/en/p5.FFT/getOctaveBands.mdx
index 317602c3a1..7da5d09924 100644
--- a/src/content/reference/en/p5.FFT/getOctaveBands.mdx
+++ b/src/content/reference/en/p5.FFT/getOctaveBands.mdx
@@ -6,7 +6,7 @@ file: lib/addons/p5.sound.js
description: >
Calculates and Returns the 1/N
- Octave
+ Octave
Bands
N defaults to 3 and minimum central frequency to 15.625Hz.
diff --git a/src/content/reference/en/p5.FFT/logAverages.mdx b/src/content/reference/en/p5.FFT/logAverages.mdx
index cb001d2b00..3e3a5afc17 100644
--- a/src/content/reference/en/p5.FFT/logAverages.mdx
+++ b/src/content/reference/en/p5.FFT/logAverages.mdx
@@ -5,7 +5,7 @@ submodule: p5.sound
file: lib/addons/p5.sound.js
description: |
Returns an array of average amplitude values of the spectrum, for a given
- set of
+ set of
Octave Bands
NOTE: analyze() must be called prior to logAverages(). Analyze()
tells the FFT to analyze frequency data, and logAverages() uses
diff --git a/src/content/reference/en/p5.File/file.mdx b/src/content/reference/en/p5.File/file.mdx
index 02708e7b49..752d21f078 100644
--- a/src/content/reference/en/p5.File/file.mdx
+++ b/src/content/reference/en/p5.File/file.mdx
@@ -6,7 +6,7 @@ file: src/dom/dom.js
description: >
Underlying
- File
object. All For example, a file with an The file
MIME type
as a string. The fourth parameter, File properties and methods are accessible.'image'
MIME type
may have a subtype such as png or jpeg.fontSize, is optional. It sets the font
@@ -37,7 +37,7 @@ description: >
determine the bounding box. By default, font.textBounds() will
use the
- current textSize().
The fourth parameter, fontSize, is optional. It sets the
@@ -30,7 +30,7 @@ description: >
size. By default, font.textToPoints() will use the current
- textSize().
The fifth parameter, options, is also optional.
font.textToPoints()
diff --git a/src/content/reference/en/p5.Framebuffer/begin.mdx b/src/content/reference/en/p5.Framebuffer/begin.mdx
index 6432063314..5bc5e971ac 100644
--- a/src/content/reference/en/p5.Framebuffer/begin.mdx
+++ b/src/content/reference/en/p5.Framebuffer/begin.mdx
@@ -7,14 +7,14 @@ description: >
Begins drawing shapes to the framebuffer.
myBuffer.begin() and myBuffer.end()
+ href="/reference/p5.Framebuffer/end/">myBuffer.end()
allow shapes to be drawn to the framebuffer. myBuffer.begin()
begins
drawing to the framebuffer and
- myBuffer.end() stops drawing to
+ myBuffer.end() stops drawing to
the
framebuffer. Changes won't be visible until the framebuffer is displayed
diff --git a/src/content/reference/en/p5.Framebuffer/color.mdx b/src/content/reference/en/p5.Framebuffer/color.mdx
index 93cffeeb06..0665c78b4b 100644
--- a/src/content/reference/en/p5.Framebuffer/color.mdx
+++ b/src/content/reference/en/p5.Framebuffer/color.mdx
@@ -8,7 +8,7 @@ description: >
Each framebuffer uses a
- WebGLTexture
object internally to store its color data. The myBuffer.color
diff --git a/src/content/reference/en/p5.Framebuffer/createCamera.mdx b/src/content/reference/en/p5.Framebuffer/createCamera.mdx
index a15e1b865f..2b88fc7a22 100644
--- a/src/content/reference/en/p5.Framebuffer/createCamera.mdx
+++ b/src/content/reference/en/p5.Framebuffer/createCamera.mdx
@@ -19,9 +19,9 @@ description: >
Framebuffer cameras should be created between calls to - myBuffer.begin() and + myBuffer.begin() and - myBuffer.end() like so:
+ myBuffer.end() like so:let myCamera;
@@ -38,11 +38,11 @@ description: >
Calling setCamera() updates the +
Calling setCamera() updates the framebuffer's projection using the camera. - resetMatrix() must also be called for + resetMatrix() must also be called for the view to change properly:
diff --git a/src/content/reference/en/p5.Framebuffer/depth.mdx b/src/content/reference/en/p5.Framebuffer/depth.mdx index 5cbf105865..c62a7f7c0d 100644 --- a/src/content/reference/en/p5.Framebuffer/depth.mdx +++ b/src/content/reference/en/p5.Framebuffer/depth.mdx @@ -8,7 +8,7 @@ description: >Each framebuffer uses a
- WebGLTexture
object internally to store its depth data. The myBuffer.depth
diff --git a/src/content/reference/en/p5.Framebuffer/end.mdx b/src/content/reference/en/p5.Framebuffer/end.mdx
index 446726b935..d1d41ed2ab 100644
--- a/src/content/reference/en/p5.Framebuffer/end.mdx
+++ b/src/content/reference/en/p5.Framebuffer/end.mdx
@@ -6,12 +6,12 @@ file: src/webgl/p5.Framebuffer.js
description: >
Stops drawing shapes to the framebuffer.
-myBuffer.begin() and +
myBuffer.begin() and
myBuffer.end()
allow shapes to be drawn to the framebuffer.
- myBuffer.begin() begins drawing
+ myBuffer.begin() begins drawing
to
the framebuffer and myBuffer.end() stops drawing to the
diff --git a/src/content/reference/en/p5.Framebuffer/get.mdx b/src/content/reference/en/p5.Framebuffer/get.mdx
index c3f99a93dc..be11d278b1 100644
--- a/src/content/reference/en/p5.Framebuffer/get.mdx
+++ b/src/content/reference/en/p5.Framebuffer/get.mdx
@@ -8,9 +8,9 @@ description: >
myBuffer.get() is easy to use but it's not as fast as
- myBuffer.pixels. Use
+ myBuffer.pixels. Use
- myBuffer.pixels to read many
+ myBuffer.pixels to read many
pixel
values.
Loads the current value of each pixel in the framebuffer into its - pixels array.
+ pixels array.myBuffer.loadPixels() must be called before reading from or
writing to
- myBuffer.pixels.
An array containing the color of each pixel in the framebuffer.
-myBuffer.loadPixels()
must be
called before accessing the myBuffer.pixels array.
- myBuffer.updatePixels()
+ myBuffer.updatePixels()
must be called after any changes are made.
Updates the framebuffer with the RGBA values in the - pixels array.
+ pixels array.myBuffer.updatePixels() only needs to be called after changing
values
- in the myBuffer.pixels array.
+ in the myBuffer.pixels array.
Such
changes can be made directly after calling
- myBuffer.loadPixels().
Averages the vertex normals. Used in curved - surfaces
-line: 643 -isConstructor: false -itemtype: method -class: p5.Geometry -chainable: true ---- - - -# averageNormals diff --git a/src/content/reference/en/p5.Geometry/averagePoleNormals.mdx b/src/content/reference/en/p5.Geometry/averagePoleNormals.mdx deleted file mode 100644 index c33b699bd4..0000000000 --- a/src/content/reference/en/p5.Geometry/averagePoleNormals.mdx +++ /dev/null @@ -1,16 +0,0 @@ ---- -title: averagePoleNormals -module: Shape -submodule: 3D Primitives -file: src/webgl/p5.Geometry.js -description: | -Averages pole normals. Used in spherical primitives
-line: 664 -isConstructor: false -itemtype: method -class: p5.Geometry -chainable: true ---- - - -# averagePoleNormals diff --git a/src/content/reference/en/p5.Geometry/clearColors.mdx b/src/content/reference/en/p5.Geometry/clearColors.mdx index bf9f1d1643..90c7837d35 100644 --- a/src/content/reference/en/p5.Geometry/clearColors.mdx +++ b/src/content/reference/en/p5.Geometry/clearColors.mdx @@ -11,11 +11,11 @@ description: > vertices or the entire shape. When a geometry has internal colors, - fill() has no effect. Calling + fill() has no effect. CallingmyGeometry.clearColors() allows the
- fill() function to apply color to the
+ fill() function to apply color to the
geometry.
line: 863
isConstructor: false
diff --git a/src/content/reference/en/p5.Geometry/computeFaces.mdx b/src/content/reference/en/p5.Geometry/computeFaces.mdx
index d6a8a45515..57902687f5 100644
--- a/src/content/reference/en/p5.Geometry/computeFaces.mdx
+++ b/src/content/reference/en/p5.Geometry/computeFaces.mdx
@@ -22,7 +22,7 @@ description: >
href="/reference/p5/p5.Vector">p5.Vector
objects in the myGeometry.vertices
+ href="/reference/p5.Geometry/vertices/">myGeometry.vertices
array. The geometry's first vertex is the
@@ -35,15 +35,15 @@ description: >
Calling myGeometry.computeFaces() fills the
- myGeometry.faces array with
+ myGeometry.faces array with
three-element
arrays that list the vertices that form each face. For example, a geometry
made from a rectangle has two faces because a rectangle is made by joining
- two triangles. myGeometry.faces for
- a
+ two triangles. myGeometry.faces
+ for a
rectangle would be the two-dimensional array
diff --git a/src/content/reference/en/p5.Geometry/computeNormals.mdx b/src/content/reference/en/p5.Geometry/computeNormals.mdx
index e6f0e8b538..3ef02ce1a2 100644
--- a/src/content/reference/en/p5.Geometry/computeNormals.mdx
+++ b/src/content/reference/en/p5.Geometry/computeNormals.mdx
@@ -34,7 +34,7 @@ description: >
are stored as p5.Vector objects in the
- myGeometry.vertexNormals
+ myGeometry.vertexNormals
array.
The first parameter, shadingType, is optional. Passing the
diff --git a/src/content/reference/en/p5.Geometry/faces.mdx b/src/content/reference/en/p5.Geometry/faces.mdx
index ac951c2647..0a4884e60c 100644
--- a/src/content/reference/en/p5.Geometry/faces.mdx
+++ b/src/content/reference/en/p5.Geometry/faces.mdx
@@ -21,7 +21,7 @@ description: >
p5.Vector objects in the
- myGeometry.vertices array. The
+ myGeometry.vertices array. The
geometry's first vertex is the p5.Vector
diff --git a/src/content/reference/en/p5.Geometry/flipU.mdx b/src/content/reference/en/p5.Geometry/flipU.mdx
index 15c63adc03..6e50573681 100644
--- a/src/content/reference/en/p5.Geometry/flipU.mdx
+++ b/src/content/reference/en/p5.Geometry/flipU.mdx
@@ -6,7 +6,7 @@ file: src/webgl/p5.Geometry.js
description: >
Flips the geometry’s texture u-coordinates.
-In order for texture() to work, the +
In order for texture() to work, the
geometry
needs a way to map the points on its surface to the pixels in a rectangular
@@ -16,7 +16,7 @@ description: >
(x, y, z) maps to the texture image's pixel at coordinates
(u, v).
The myGeometry.uvs array stores +
The myGeometry.uvs array stores
the
(u, v) coordinates for each vertex in the order it was added to
diff --git a/src/content/reference/en/p5.Geometry/flipV.mdx b/src/content/reference/en/p5.Geometry/flipV.mdx
index 57d77d3748..76c3011709 100644
--- a/src/content/reference/en/p5.Geometry/flipV.mdx
+++ b/src/content/reference/en/p5.Geometry/flipV.mdx
@@ -6,7 +6,7 @@ file: src/webgl/p5.Geometry.js
description: >
Flips the geometry’s texture v-coordinates.
-In order for texture() to work, the +
In order for texture() to work, the
geometry
needs a way to map the points on its surface to the pixels in a rectangular
@@ -16,7 +16,7 @@ description: >
(x, y, z) maps to the texture image's pixel at coordinates
(u, v).
The myGeometry.uvs array stores +
The myGeometry.uvs array stores
the
(u, v) coordinates for each vertex in the order it was added to
diff --git a/src/content/reference/en/p5.Geometry/normalize.mdx b/src/content/reference/en/p5.Geometry/normalize.mdx
index 1e2eed4732..8de6d32811 100644
--- a/src/content/reference/en/p5.Geometry/normalize.mdx
+++ b/src/content/reference/en/p5.Geometry/normalize.mdx
@@ -20,7 +20,7 @@ description: >
Note: myGeometry.normalize() only works when called in the
- setup() function.
In order for texture() to work, the +
In order for texture() to work, the
geometry
needs a way to map the points on its surface to the pixels in a
diff --git a/src/content/reference/en/p5.Graphics/createFramebuffer.mdx b/src/content/reference/en/p5.Graphics/createFramebuffer.mdx
index 8832f9f69f..f28565f0bc 100644
--- a/src/content/reference/en/p5.Graphics/createFramebuffer.mdx
+++ b/src/content/reference/en/p5.Graphics/createFramebuffer.mdx
@@ -57,7 +57,7 @@ description: >
true, as in { antialias: true }, 2 samples will be
used by default. The number of samples can also be set, as in {
antialias: 4 }. Default is to match setAttributes() which is
+ href="/reference/p5/setAttributes/">setAttributes() which is
false (true in Safari).
width: width of the
By default, the main canvas resets certain transformation and lighting
- values each time draw() executes.
+ values each time draw() executes.
p5.Graphics
objects must reset these values manually by calling
diff --git a/src/content/reference/en/p5.Image/get.mdx b/src/content/reference/en/p5.Image/get.mdx
index ef4ac86d53..837e683815 100644
--- a/src/content/reference/en/p5.Image/get.mdx
+++ b/src/content/reference/en/p5.Image/get.mdx
@@ -8,9 +8,9 @@ description: >
img.get() is easy to use but it's not as fast as
- img.pixels. Use
+ img.pixels. Use
- img.pixels to read many pixel
+ img.pixels to read many pixel
values.
The version of img.get() with no parameters returns the entire
@@ -35,8 +35,8 @@ description: >
canvas in a new p5.Image object.
Use img.get() instead of get()
- to work directly
+
Use img.get() instead of get() to work directly
with images.
Pauses an animated GIF.
The GIF can be resumed by calling - img.play().
+ img.play(). line: 1903 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5.Image/pixels.mdx b/src/content/reference/en/p5.Image/pixels.mdx index 5bf16766e7..beb0679217 100644 --- a/src/content/reference/en/p5.Image/pixels.mdx +++ b/src/content/reference/en/p5.Image/pixels.mdx @@ -37,11 +37,11 @@ description: > math as shown in the examples below. The - img.loadPixels() + img.loadPixels() method must be called before accessing theimg.pixels array. The
- img.updatePixels() method must
+ img.updatePixels() method must
be
called after any changes are made.
diff --git a/src/content/reference/en/p5.Image/play.mdx b/src/content/reference/en/p5.Image/play.mdx
index c83baf234b..21bdf48c36 100644
--- a/src/content/reference/en/p5.Image/play.mdx
+++ b/src/content/reference/en/p5.Image/play.mdx
@@ -5,7 +5,7 @@ submodule: Image
file: src/image/p5.Image.js
description: |
Plays an animated GIF that was paused with - img.pause().
+ img.pause(). line: 1858 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5.Image/save.mdx b/src/content/reference/en/p5.Image/save.mdx index ebdc970c7c..a1ffce0d38 100644 --- a/src/content/reference/en/p5.Image/save.mdx +++ b/src/content/reference/en/p5.Image/save.mdx @@ -33,7 +33,7 @@ description: >The image will only be downloaded as an animated GIF if it was loaded - from a GIF file. See saveGif() to create + from a GIF file. See saveGif() to create new GIFs.
diff --git a/src/content/reference/en/p5.Image/set.mdx b/src/content/reference/en/p5.Image/set.mdx index 053b1d8d71..c32b5eb305 100644 --- a/src/content/reference/en/p5.Image/set.mdx +++ b/src/content/reference/en/p5.Image/set.mdx @@ -8,9 +8,9 @@ description: >img.set() is easy to use but it's not as fast as
- img.pixels. Use
+ img.pixels. Use
- img.pixels to set many pixel
+ img.pixels to set many pixel
values.
img.set() interprets the first two parameters as x- and
@@ -23,7 +23,7 @@ description: >
p5.Image object.
img.updatePixels() must be +
img.updatePixels() must be
called
after using img.set() for changes to appear.
Updates the canvas with the RGBA values in the - img.pixels array.
+ img.pixels array.img.updatePixels() only needs to be called after changing
values in
- the img.pixels array. Such changes
+ the img.pixels array. Such changes
can be
made directly after calling
- img.loadPixels() or by calling
+ img.loadPixels() or by calling
- img.set().
The optional parameters x, y, width,
and height define a
diff --git a/src/content/reference/en/p5.MediaElement/hideControls.mdx b/src/content/reference/en/p5.MediaElement/hideControls.mdx
index 8ff5913ebc..fd7656eb13 100644
--- a/src/content/reference/en/p5.MediaElement/hideControls.mdx
+++ b/src/content/reference/en/p5.MediaElement/hideControls.mdx
@@ -6,7 +6,7 @@ file: src/dom/dom.js
description: >
Hide the default - HTMLMediaElement controls.
diff --git a/src/content/reference/en/p5.MediaElement/showControls.mdx b/src/content/reference/en/p5.MediaElement/showControls.mdx index 0952197a30..eb0140e05e 100644 --- a/src/content/reference/en/p5.MediaElement/showControls.mdx +++ b/src/content/reference/en/p5.MediaElement/showControls.mdx @@ -6,7 +6,7 @@ file: src/dom/dom.js description: >Show the default - HTMLMediaElement controls.
diff --git a/src/content/reference/en/p5.Panner3D/panner.mdx b/src/content/reference/en/p5.Panner3D/panner.mdx index ed1f4698dd..dffe350c61 100644 --- a/src/content/reference/en/p5.Panner3D/panner.mdx +++ b/src/content/reference/en/p5.Panner3D/panner.mdx @@ -5,7 +5,7 @@ submodule: p5.sound file: lib/addons/p5.sound.js description: >+ href="https://developer.mozilla.org/en-US/docs/Web/API/PannerNode/"> Web Audio Spatial Panner Node
diff --git a/src/content/reference/en/p5.Shader/copyToContext.mdx b/src/content/reference/en/p5.Shader/copyToContext.mdx index db9c91d77f..ab901a96b7 100644 --- a/src/content/reference/en/p5.Shader/copyToContext.mdx +++ b/src/content/reference/en/p5.Shader/copyToContext.mdx @@ -8,7 +8,7 @@ description: >Each p5.Shader object must be compiled by calling
- shader() before it can run. Compilation
+ shader() before it can run. Compilation
happens
in a drawing context which is usually the main canvas or an instance of
@@ -40,18 +40,18 @@ description: >
Note: A p5.Shader object created with - createShader(), + createShader(), - createFilterShader(), or + createFilterShader(), or - loadShader() + loadShader() can be used directly with a p5.Framebuffer object created with - createFramebuffer(). Both + createFramebuffer(). Both objects have the same context as the main canvas.
diff --git a/src/content/reference/en/p5.SoundFile/getBlob.mdx b/src/content/reference/en/p5.SoundFile/getBlob.mdx index eb2ba6a9ae..9a083f578a 100644 --- a/src/content/reference/en/p5.SoundFile/getBlob.mdx +++ b/src/content/reference/en/p5.SoundFile/getBlob.mdx @@ -6,9 +6,9 @@ file: lib/addons/p5.sound.js description: |This method is useful for sending a SoundFile to a server. It returns the
.wav-encoded audio data as a "Blob".
+ MDN" href="https://developer.mozilla.org/en-US/docs/Web/API/Blob/">Blob".
A Blob is a file-like data object that can be uploaded to a server
- with an http request. We'll
+ with an http request. We'll
use the httpDo options object to send a POST request with some
specific options: we encode the request as multipart/form-data,
and attach the blob as one of the form values using FormData.
Save a p5.SoundFile as a .wav file. The browser will prompt the user to download the file to their device. To upload a file to a server, see - getBlob
+ getBlob line: 2850 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5.SoundLoop/musicalTimeMode.mdx b/src/content/reference/en/p5.SoundLoop/musicalTimeMode.mdx index b534358bca..7ba91c2a01 100644 --- a/src/content/reference/en/p5.SoundLoop/musicalTimeMode.mdx +++ b/src/content/reference/en/p5.SoundLoop/musicalTimeMode.mdx @@ -5,7 +5,7 @@ submodule: p5.sound file: lib/addons/p5.sound.js description: >musicalTimeMode uses Tone.Time convention + href="https://github.com/Tonejs/Tone.js/wiki/Time/">Tone.Time convention true if string, false if number
line: 9800 diff --git a/src/content/reference/en/p5.Table/addColumn.mdx b/src/content/reference/en/p5.Table/addColumn.mdx index 4720d38e0c..b296ccb6af 100644 --- a/src/content/reference/en/p5.Table/addColumn.mdx +++ b/src/content/reference/en/p5.Table/addColumn.mdx @@ -4,7 +4,7 @@ module: IO submodule: Table file: src/io/p5.Table.js description: > -Use addColumn() to add a new column +
Use addColumn() to add a new column to a Table object. Typically, you will want to specify a title, so the column diff --git a/src/content/reference/en/p5.Table/addRow.mdx b/src/content/reference/en/p5.Table/addRow.mdx index 4cdf60f78f..b04b28dd5a 100644 --- a/src/content/reference/en/p5.Table/addRow.mdx +++ b/src/content/reference/en/p5.Table/addRow.mdx @@ -4,15 +4,15 @@ module: IO submodule: Table file: src/io/p5.Table.js description: > -
Use addRow() to add a new row of data to - a p5.Table object. By default, +
Use addRow() to add a new row of data + to a p5.Table object. By default, an empty row is created. Typically, you would store a reference to the new row in a TableRow object (see newRow in the example above), and then set individual values using set().
+ href="/reference/p5/set/">set().If a p5.TableRow object is included as a parameter, then that row is diff --git a/src/content/reference/en/p5.Table/removeColumn.mdx b/src/content/reference/en/p5.Table/removeColumn.mdx index 28552a01fc..591a6f546a 100644 --- a/src/content/reference/en/p5.Table/removeColumn.mdx +++ b/src/content/reference/en/p5.Table/removeColumn.mdx @@ -4,7 +4,7 @@ module: IO submodule: Table file: src/io/p5.Table.js description: > -
Use removeColumn() to remove an +
Use removeColumn() to remove an existing column from a Table object. The column to be removed may be identified by either diff --git a/src/content/reference/en/p5.Table/rows.mdx b/src/content/reference/en/p5.Table/rows.mdx index dfaa58cc23..127ed88cfa 100644 --- a/src/content/reference/en/p5.Table/rows.mdx +++ b/src/content/reference/en/p5.Table/rows.mdx @@ -8,7 +8,7 @@ description: > objects that make up the rows of the table. The same result as calling getRows()
+ href="/reference/p5/getRows/">getRows() line: 80 isConstructor: false itemtype: property diff --git a/src/content/reference/en/p5.Vector/angleBetween.mdx b/src/content/reference/en/p5.Vector/angleBetween.mdx index 1c8b0c20f2..2daaebe1f4 100644 --- a/src/content/reference/en/p5.Vector/angleBetween.mdx +++ b/src/content/reference/en/p5.Vector/angleBetween.mdx @@ -12,12 +12,12 @@ description: >If the vector was created with
- createVector(),
+ createVector(),
angleBetween() returns
angles in the units of the current
- angleMode().
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON
+ href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON/">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON line: 3892 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5.Vector/dist.mdx b/src/content/reference/en/p5.Vector/dist.mdx index bfcba32376..41ef578930 100644 --- a/src/content/reference/en/p5.Vector/dist.mdx +++ b/src/content/reference/en/p5.Vector/dist.mdx @@ -15,7 +15,7 @@ description: > as callingv1.dist(v2).
- Use dist() to calculate the distance +
Use dist() to calculate the distance
between points
using coordinates as in dist(x1, y1, x2, y2).
If the vector was created with
- createVector(),
+ createVector(),
heading() returns angles
in the units of the current angleMode().
The static version of heading(), as in
p5.Vector.heading(v), works the
diff --git a/src/content/reference/en/p5.Vector/mag.mdx b/src/content/reference/en/p5.Vector/mag.mdx
index 059165d293..49723af2a9 100644
--- a/src/content/reference/en/p5.Vector/mag.mdx
+++ b/src/content/reference/en/p5.Vector/mag.mdx
@@ -6,7 +6,7 @@ file: src/math/p5.Vector.js
description: >
Calculates the magnitude (length) of the vector.
-Use mag() to calculate the magnitude of a +
Use mag() to calculate the magnitude of a
2D vector
using components as in mag(x, y).
If the vector was created with
- createVector(), rotate()
- uses
+ createVector(),
+ rotate() uses
the units of the current angleMode().
The static version of rotate(), as in
p5.Vector.rotate(v, PI),
diff --git a/src/content/reference/en/p5.Vector/setHeading.mdx b/src/content/reference/en/p5.Vector/setHeading.mdx
index c33ee87729..15ee51d50e 100644
--- a/src/content/reference/en/p5.Vector/setHeading.mdx
+++ b/src/content/reference/en/p5.Vector/setHeading.mdx
@@ -12,11 +12,11 @@ description: >
If the vector was created with
- createVector(),
+ createVector(),
setHeading() uses
the units of the current angleMode().
slerp() differs from lerp() because
+ href="/reference/p5.Vector/lerp/">lerp() because
it interpolates magnitude. Calling v0.slerp(v1, 0.5) sets
v0's
diff --git a/src/content/reference/en/p5.XML/getNum.mdx b/src/content/reference/en/p5.XML/getNum.mdx
index 8105675f9c..8e34279764 100644
--- a/src/content/reference/en/p5.XML/getNum.mdx
+++ b/src/content/reference/en/p5.XML/getNum.mdx
@@ -24,10 +24,10 @@ description: >
Note: Use - myXML.getString() or + myXML.getString() or - myXML.getNum() to return an attribute's - value.
+ myXML.getNum() to return an + attribute's value. line: 884 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5.XML/getString.mdx b/src/content/reference/en/p5.XML/getString.mdx index 244d378e3c..7cd2251f7a 100644 --- a/src/content/reference/en/p5.XML/getString.mdx +++ b/src/content/reference/en/p5.XML/getString.mdx @@ -24,10 +24,10 @@ description: >Note: Use - myXML.getString() or + myXML.getString() or - myXML.getNum() to return an attribute's - value.
+ myXML.getNum() to return an + attribute's value. line: 989 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5.XML/hasAttribute.mdx b/src/content/reference/en/p5.XML/hasAttribute.mdx index 273809dd07..ba5fe63d5d 100644 --- a/src/content/reference/en/p5.XML/hasAttribute.mdx +++ b/src/content/reference/en/p5.XML/hasAttribute.mdx @@ -14,10 +14,10 @@ description: >Note: Use - myXML.getString() or + myXML.getString() or - myXML.getNum() to return an attribute's - value.
+ myXML.getNum() to return an + attribute's value. line: 821 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5.XML/listAttributes.mdx b/src/content/reference/en/p5.XML/listAttributes.mdx index 0a2bb4259b..095d0e8363 100644 --- a/src/content/reference/en/p5.XML/listAttributes.mdx +++ b/src/content/reference/en/p5.XML/listAttributes.mdx @@ -9,10 +9,10 @@ description: >Note: Use - myXML.getString() or + myXML.getString() or - myXML.getNum() to return an attribute's - value.
+ myXML.getNum() to return an + attribute's value. line: 767 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5.sound/p5.AudioIn.mdx b/src/content/reference/en/p5.sound/p5.AudioIn.mdx index 92746309cd..2b3f2a87b2 100644 --- a/src/content/reference/en/p5.sound/p5.AudioIn.mdx +++ b/src/content/reference/en/p5.sound/p5.AudioIn.mdx @@ -21,7 +21,7 @@ description: >- feedback. -Note: This uses the getUserMedia/
+ Note: This uses the getUserMedia/
Stream API, which is not supported by certain browsers. Access in Chrome
browser
@@ -107,7 +107,7 @@ methods:
description: |
Returns a list of available input sources. This is a wrapper
for
+ en-US/docs/Web/API/MediaDevices/enumerateDevices/" target="_blank">
MediaDevices.enumerateDevices() - Web APIs | MDN
and it returns a Promise. This class extends p5.Effect.
- Methods amp(), chain(),
+ Methods amp(), chain(),
- drywet(), connect(), and
+ drywet(), connect(), and
- disconnect() are available.
This class extends p5.Effect. - Methods amp(), chain(), + Methods amp(), chain(), - drywet(), connect(), and + drywet(), connect(), and - disconnect() are available.
+ disconnect() are + available. line: 7926 isConstructor: true example: diff --git a/src/content/reference/en/p5.sound/p5.Distortion.mdx b/src/content/reference/en/p5.sound/p5.Distortion.mdx index 92b9a5ba9c..c6c96b9368 100644 --- a/src/content/reference/en/p5.sound/p5.Distortion.mdx +++ b/src/content/reference/en/p5.sound/p5.Distortion.mdx @@ -9,18 +9,19 @@ description: > with an approach adapted from Kevin + href="http://stackoverflow.com/questions/22312841/waveshaper-node-in-webaudio-how-to-emulate-distortion/">Kevin EnnisThis class extends p5.Effect. - Methods amp(), chain(), + Methods amp(), chain(), - drywet(), connect(), and + drywet(), connect(), and - disconnect() are available.
+ disconnect() are + available. line: 10816 isConstructor: true params: diff --git a/src/content/reference/en/p5.sound/p5.EQ.mdx b/src/content/reference/en/p5.sound/p5.EQ.mdx index 056ebbd573..54573d2c4b 100644 --- a/src/content/reference/en/p5.sound/p5.EQ.mdx +++ b/src/content/reference/en/p5.sound/p5.EQ.mdx @@ -24,13 +24,14 @@ description: >This class extends p5.Effect. - Methods amp(), chain(), + Methods amp(), chain(), - drywet(), connect(), and + drywet(), connect(), and - disconnect() are available.
+ disconnect() are + available. line: 7105 isConstructor: true params: diff --git a/src/content/reference/en/p5.sound/p5.Envelope.mdx b/src/content/reference/en/p5.sound/p5.Envelope.mdx index 5ffabb05b6..12146b9ead 100644 --- a/src/content/reference/en/p5.sound/p5.Envelope.mdx +++ b/src/content/reference/en/p5.sound/p5.Envelope.mdx @@ -20,23 +20,23 @@ description: >- control an Oscillator's frequency like this:osc.freq(env).
- Use setRange to
+
Use setRange to
change the attack/release level.
- Use setADSR to
+ Use setADSR to
change attackTime, decayTime, sustainPercent and releaseTime.
Use the play method
+
Use the play method
to play the entire envelope,
- the ramp method for a
+ the ramp method for a
pingable trigger,
or triggerAttack/
+ href="/reference/p5.Envelope/triggerAttack/">triggerAttack/
triggerRelease to
+ href="/reference/p5.Envelope/triggerRelease/">triggerRelease to
trigger noteOn/noteOff.
Exponentially ramp to a value using the first two
values from setADSR(attackTime,
+ href="/reference/p5.Envelope/setADSR/">setADSR(attackTime,
decayTime)
- as
+ as
time constants for simple exponential ramps.
diff --git a/src/content/reference/en/p5.sound/p5.FFT.mdx b/src/content/reference/en/p5.sound/p5.FFT.mdx
index b59ea6929e..900c8d7022 100644
--- a/src/content/reference/en/p5.sound/p5.FFT.mdx
+++ b/src/content/reference/en/p5.sound/p5.FFT.mdx
@@ -6,7 +6,7 @@ file: lib/addons/p5.sound.js
description: |-
FFT (Fast Fourier Transform) is an analysis algorithm that isolates individual - + audio frequencies within a waveform.
Once instantiated, a p5.FFT object can return an array based on @@ -125,7 +125,7 @@ methods: getEnergy: description: |
Returns the amount of energy (volume) at a specific - + frequency, or the average amount of energy between two frequencies. Accepts Number(s) corresponding to frequency (in Hz), or a "string" corresponding to predefined @@ -140,7 +140,7 @@ methods: getCentroid: description: |
Returns the
-
+
spectral centroid of the input signal.
NOTE: analyze() must be called prior to getCentroid(). Analyze()
tells the FFT to analyze frequency data, and getCentroid() uses
@@ -163,7 +163,7 @@ methods:
Returns an array of average amplitude values of the spectrum, for a
given
- set of
Octave Bands
@@ -178,8 +178,8 @@ methods:
description: >
Calculates and Returns the 1/N
- Octave
- Bands
+ Octave Bands
N defaults to 3 and minimum central frequency to 15.625Hz.
diff --git a/src/content/reference/en/p5.sound/p5.Filter.mdx b/src/content/reference/en/p5.sound/p5.Filter.mdx
index d34c8a1a99..90439817ad 100644
--- a/src/content/reference/en/p5.sound/p5.Filter.mdx
+++ b/src/content/reference/en/p5.sound/p5.Filter.mdx
@@ -33,13 +33,14 @@ description: >
This class extends p5.Effect.
- Methods amp(), chain(),
+ Methods amp(), chain(),
- drywet(), connect(), and
+ drywet(), connect(), and
- disconnect() are available.
Panner3D is based on the + href="https://developer.mozilla.org/en-US/docs/Web/API/PannerNode/"> Web Audio Spatial Panner Node. @@ -14,7 +14,7 @@ description: > and oriented in 3D space.
The position is relative to an + href="https://developer.mozilla.org/en-US/docs/Web/API/AudioListener/"> Audio Context Listener, which can be accessed @@ -75,7 +75,7 @@ properties: panner: description: >
+ href="https://developer.mozilla.org/en-US/docs/Web/API/PannerNode/"> Web Audio Spatial Panner Node
diff --git a/src/content/reference/en/p5.sound/p5.Reverb.mdx b/src/content/reference/en/p5.sound/p5.Reverb.mdx index c933e41811..4d0e249011 100644 --- a/src/content/reference/en/p5.sound/p5.Reverb.mdx +++ b/src/content/reference/en/p5.sound/p5.Reverb.mdx @@ -20,13 +20,14 @@ description: >This class extends p5.Effect. - Methods amp(), chain(), + Methods amp(), chain(), - drywet(), connect(), and + drywet(), connect(), and - disconnect() are available.
+ disconnect() are + available. line: 8308 isConstructor: true example: diff --git a/src/content/reference/en/p5.sound/p5.SoundFile.mdx b/src/content/reference/en/p5.sound/p5.SoundFile.mdx index 22356c6756..a5bb335e51 100644 --- a/src/content/reference/en/p5.sound/p5.SoundFile.mdx +++ b/src/content/reference/en/p5.sound/p5.SoundFile.mdx @@ -267,7 +267,7 @@ methods: description: |Save a p5.SoundFile as a .wav file. The browser will prompt the user to download the file to their device. To upload a file to a server, see - getBlob
+ getBlob path: p5.SoundFile/save getBlob: description: > @@ -277,11 +277,11 @@ methods: .wav-encoded audio data as a "Blob". + href="https://developer.mozilla.org/en-US/docs/Web/API/Blob/">Blob". A Blob is a file-like data object that can be uploaded to a server - with an http request. We'll + with an http request. We'll use thehttpDo options object to send a POST request with
some
diff --git a/src/content/reference/en/p5.sound/p5.SoundLoop.mdx b/src/content/reference/en/p5.sound/p5.SoundLoop.mdx
index e33dd6ed8a..e0a5dc9076 100644
--- a/src/content/reference/en/p5.sound/p5.SoundLoop.mdx
+++ b/src/content/reference/en/p5.sound/p5.SoundLoop.mdx
@@ -111,7 +111,7 @@ properties:
musicalTimeMode:
description: >
musicalTimeMode uses Tone.Time + href="https://github.com/Tonejs/Tone.js/wiki/Time/">Tone.Time convention true if string, false if number
diff --git a/src/content/reference/en/p5/===.mdx b/src/content/reference/en/p5/===.mdx deleted file mode 100644 index b788f71181..0000000000 --- a/src/content/reference/en/p5/===.mdx +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: '===' -module: Foundation -submodule: Foundation -file: src/core/reference.js -description: > -The strict equality operator === - - checks to see if two values are equal and of the same type.
- -A comparison expression always evaluates to a boolean.
- -From the - MDN entry: - - The non-identity operator returns true if the operands are not equal and/or - not of the same type.
- -Note: In some examples around the web you may see a double-equals-sign - - ==, - - used for comparison instead. This is the non-strict equality operator in - Javascript. - - This will convert the two values being compared to the same type before - comparing them.
-line: 87 -isConstructor: false -itemtype: property -alt: This example does not render anything -example: - - |- - -
- console.log(1 === 1); // prints true to the console
- console.log(1 === '1'); // prints false to the console
-
- myArray refers
to an
- array with three String elements,
+ array with three String elements,
'deeppink',
'darkorchid', and 'magenta'. Arrays are
@@ -47,7 +47,7 @@ description: >
Elements can be added to the end of an array by calling the push() method as follows:
@@ -60,7 +60,7 @@ description: >See MDN for more information about arrays.
diff --git a/src/content/reference/en/p5/types/String.mdx b/src/content/reference/en/p5/String.mdx similarity index 100% rename from src/content/reference/en/p5/types/String.mdx rename to src/content/reference/en/p5/String.mdx diff --git a/src/content/reference/en/p5/acos.mdx b/src/content/reference/en/p5/acos.mdx index f13c8a09b2..fdf96c404c 100644 --- a/src/content/reference/en/p5/acos.mdx +++ b/src/content/reference/en/p5/acos.mdx @@ -7,14 +7,14 @@ description: >Calculates the arc cosine of a number.
acos() is the inverse of cos(). It expects
+ href="/reference/p5/cos/">cos(). It expects
arguments in the range -1 to 1. By default, acos() returns values
in the
range 0 to π (about 3.14). If the
- angleMode() is DEGREES,
+ angleMode() is DEGREES,
then values are
returned in the range 0 to 180.
ambientLight(255, 0, 0, 30). Color values will be interpreted
using
- the current colorMode().
+ the current colorMode().
line: 10
isConstructor: false
itemtype: method
diff --git a/src/content/reference/en/p5/ambientMaterial.mdx b/src/content/reference/en/p5/ambientMaterial.mdx
index 503d4df976..f14668b932 100644
--- a/src/content/reference/en/p5/ambientMaterial.mdx
+++ b/src/content/reference/en/p5/ambientMaterial.mdx
@@ -8,7 +8,8 @@ description: >
The ambientMaterial() color sets the components of the
- ambientLight() color that shapes will
+ ambientLight() color that shapes
+ will
reflect. For example, calling ambientMaterial(255, 255, 0) would
cause a
@@ -49,7 +50,7 @@ description: >
be passed to set the material’s colors. Color values will be interpreted
- using the current colorMode().
Note: ambientMaterial() can only be used in WebGL mode.
Functions such as rotate() and +
Functions such as rotate() and
- sin() expect angles measured radians by
+ sin() expect angles measured radians by
default.
Calling angleMode(DEGREES) switches to degrees. Calling
diff --git a/src/content/reference/en/p5/applyMatrix.mdx b/src/content/reference/en/p5/applyMatrix.mdx
index 36fa617712..5a43b9f169 100644
--- a/src/content/reference/en/p5/applyMatrix.mdx
+++ b/src/content/reference/en/p5/applyMatrix.mdx
@@ -8,11 +8,11 @@ description: >
Transformations such as - translate(), + translate(), - rotate(), and + rotate(), and - scale() + scale() use matrix-vector multiplication behind the scenes. A table of numbers, @@ -23,11 +23,11 @@ description: >
applyMatrix() allows for many transformations to be applied at
once. See
- Wikipedia
and MDN
for more details about transformations.
By default, transformations accumulate. The - push() and pop() functions + push() and pop() functions can be used to isolate transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
- applyMatrix() inside the draw()
+ applyMatrix() inside the draw()
function won't
cause shapes to transform continuously.
h set the arc's width and height. See
- ellipse() and
+ ellipse() and
- ellipseMode() for more details.
+ ellipseMode() for more details.
The fifth and sixth parameters, start and stop,
set the angles
diff --git a/src/content/reference/en/p5/arrayCopy.mdx b/src/content/reference/en/p5/arrayCopy.mdx
index cd1a72ea39..0a74f8beea 100644
--- a/src/content/reference/en/p5/arrayCopy.mdx
+++ b/src/content/reference/en/p5/arrayCopy.mdx
@@ -15,7 +15,7 @@ description: >
overwrites existing values in the destination array. To append values
instead of overwriting them, use concat().
The simplified version with only two arguments, arrayCopy(src, dst), diff --git a/src/content/reference/en/p5/asin.mdx b/src/content/reference/en/p5/asin.mdx index a74ab5c0e8..3a9a2e3e31 100644 --- a/src/content/reference/en/p5/asin.mdx +++ b/src/content/reference/en/p5/asin.mdx @@ -7,14 +7,14 @@ description: >
Calculates the arc sine of a number.
asin() is the inverse of sin(). It expects input
+ href="/reference/p5/sin/">sin(). It expects input
values in the range of -1 to 1. By default, asin() returns values
in the
range -π ÷ 2 (about -1.57) to π ÷ 2 (about 1.57). If
- the angleMode() is DEGREES
+ the angleMode() is DEGREES
then values are
returned in the range -90 to 90.
Calculates the arc tangent of a number.
atan() is the inverse of tan(). It expects input
+ href="/reference/p5/tan/">tan(). It expects input
values in the range of -Infinity to Infinity. By default, atan()
returns
values in the range -π ÷ 2 (about -1.57) to π ÷ 2
- (about 1.57). If the angleMode() is
+ (about 1.57). If the angleMode() is
DEGREES
then values are returned in the range -90 to 90.
DEGREES,
+ angleMode() is DEGREES,
then values are
returned in the range -180 to 180.
diff --git a/src/content/reference/en/p5/background.mdx b/src/content/reference/en/p5/background.mdx
index 06cd4091cb..e2d306d595 100644
--- a/src/content/reference/en/p5/background.mdx
+++ b/src/content/reference/en/p5/background.mdx
@@ -9,12 +9,12 @@ description: >
By default, the background is transparent. background() is
typically used
- within draw() to clear the display window at
+ within draw() to clear the display window at
the
beginning of each frame. It can also be used inside
- setup() to set the background on the first
+ setup() to set the background on the first
frame
of animation.
background(255, 204, 0) sets the
diff --git a/src/content/reference/en/p5/beginClip.mdx b/src/content/reference/en/p5/beginClip.mdx
index 9dfef2f1f4..101fa6f8f2 100644
--- a/src/content/reference/en/p5/beginClip.mdx
+++ b/src/content/reference/en/p5/beginClip.mdx
@@ -8,11 +8,11 @@ description: >
Any shapes drawn between beginClip() and
- endClip() will add to the mask shape. The
+ endClip() will add to the mask shape. The
mask
will apply to anything drawn after endClip().
The parameter, options, is optional. If an object with an
invert
@@ -28,14 +28,14 @@ description: >
Masks can be contained between the - push() and pop() functions. + push() and pop() functions. Doing so allows unmasked shapes to be drawn after masked shapes.
Masks can also be defined in a callback function that's passed to - clip().
+ clip(). line: 13 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/beginContour.mdx b/src/content/reference/en/p5/beginContour.mdx index eb87cce2a8..9803da0cd7 100644 --- a/src/content/reference/en/p5/beginContour.mdx +++ b/src/content/reference/en/p5/beginContour.mdx @@ -7,38 +7,38 @@ description: >Begins creating a hole within a flat shape.
The beginContour() and endContour()
+ href="/reference/p5/endContour/">endContour()
functions allow for creating negative space within custom shapes that are
flat. beginContour() begins adding vertices to a negative space
and
- endContour() stops adding them.
+ endContour() stops adding them.
beginContour() and endContour() must be
+ href="/reference/p5/endContour/">endContour() must be
- called between beginShape() and
+ called between beginShape() and
- endShape().
Transformations such as translate(), +
Transformations such as translate(),
- rotate(), and scale()
+ rotate(), and scale()
don't work between beginContour() and
- endContour(). It's also not possible to
- use
+ endContour(). It's also not possible
+ to use
- other shapes, such as ellipse() or
+ other shapes, such as ellipse() or
- rect(), between beginContour()
+ rect(), between beginContour()
and
- endContour().
Note: The vertices that define a negative space must "wind" in the opposite diff --git a/src/content/reference/en/p5/beginGeometry.mdx b/src/content/reference/en/p5/beginGeometry.mdx index 307b61f878..43d9036d5b 100644 --- a/src/content/reference/en/p5/beginGeometry.mdx +++ b/src/content/reference/en/p5/beginGeometry.mdx @@ -9,33 +9,33 @@ description: > p5.Geometry object.
The beginGeometry() and endGeometry()
+ href="/reference/p5/endGeometry/">endGeometry()
functions help with creating complex 3D shapes from simpler ones such as
- sphere(). beginGeometry()
+ sphere(). beginGeometry()
begins adding shapes
to a custom p5.Geometry object and
- endGeometry() stops adding them.
beginGeometry() and endGeometry() can help
+ href="/reference/p5/endGeometry/">endGeometry() can help
to make sketches more performant. For example, if a complex 3D shape
doesn’t change while a sketch runs, then it can be created with
beginGeometry() and endGeometry().
+ href="/reference/p5/endGeometry/">endGeometry().
Creating a p5.Geometry object once and
then
drawing it will run faster than repeatedly drawing the individual pieces.
See buildGeometry() for another +
See buildGeometry() for another way to build 3D shapes.
diff --git a/src/content/reference/en/p5/beginShape.mdx b/src/content/reference/en/p5/beginShape.mdx index eeacf76439..f8a3ac24a2 100644 --- a/src/content/reference/en/p5/beginShape.mdx +++ b/src/content/reference/en/p5/beginShape.mdx @@ -7,13 +7,13 @@ description: >Begins adding vertices to a custom shape.
The beginShape() and endShape() functions
+ href="/reference/p5/endShape/">endShape() functions
allow for creating custom shapes in 2D or 3D. beginShape() begins
adding
- vertices to a custom shape and endShape()
- stops
+ vertices to a custom shape and endShape() stops
adding them.
After calling beginShape(), shapes can be built by calling
- vertex(),
+ vertex(),
- bezierVertex(),
+ bezierVertex(),
- quadraticVertex(), and/or
+ quadraticVertex(), and/or
- curveVertex(). Calling
+ curveVertex(). Calling
- endShape() will stop adding vertices to
+ endShape() will stop adding vertices to
the
shape. Each shape will be outlined with the current stroke color and filled
with the current fill color.
Transformations such as translate(), +
Transformations such as translate(),
- rotate(), and
+ rotate(), and
- scale() don't work between
+ scale() don't work between
beginShape() and
- endShape(). It's also not possible to use
+ endShape(). It's also not possible to
+ use
- other shapes, such as ellipse() or
+ other shapes, such as ellipse() or
- rect(), between beginShape() and
+ rect(), between beginShape()
+ and
- endShape().
The first two parameters, x1 and y1, set the
first anchor point. The
diff --git a/src/content/reference/en/p5/bezierDetail.mdx b/src/content/reference/en/p5/bezierDetail.mdx
index 8f7dfc7e9a..285674a1c9 100644
--- a/src/content/reference/en/p5/bezierDetail.mdx
+++ b/src/content/reference/en/p5/bezierDetail.mdx
@@ -16,7 +16,7 @@ description: >
Bézier curve. For example, calling bezierDetail(5) will use 5
segments to
- draw curves with the bezier() function. By
+ draw curves with the bezier() function. By
default,detail is 20.
bezierPoint() works one axis
at a time. Passing the anchor and control points' x-coordinates will
diff --git a/src/content/reference/en/p5/bezierTangent.mdx b/src/content/reference/en/p5/bezierTangent.mdx
index c54ac17dfe..d9c761e443 100644
--- a/src/content/reference/en/p5/bezierTangent.mdx
+++ b/src/content/reference/en/p5/bezierTangent.mdx
@@ -15,7 +15,7 @@ description: >
Bézier curve's anchor and control points. It expects points in the same
- order as the bezier() function.
+ order as the bezier() function.
bezierTangent()
works one axis at a time. Passing the anchor and control points'
diff --git a/src/content/reference/en/p5/bezierVertex.mdx b/src/content/reference/en/p5/bezierVertex.mdx
index cc15c37805..bcdfde55c9 100644
--- a/src/content/reference/en/p5/bezierVertex.mdx
+++ b/src/content/reference/en/p5/bezierVertex.mdx
@@ -11,19 +11,19 @@ description: >
it creates are defined like those made by the
- bezier() function.
+ bezier() function.
bezierVertex() must be
called between the
- beginShape() and
+ beginShape() and
- endShape() functions. The curved segment
+ endShape() functions. The curved segment
uses
the previous vertex as the first anchor point, so there must be at least
- one call to vertex() before
+ one call to vertex() before
bezierVertex() can
be used.
@@ -47,7 +47,7 @@ description: >
Note: bezierVertex() won’t work when an argument is passed to
- beginShape().
By default, blue() returns a color's blue value in the range 0
- to 255. If the colorMode() is set to RGB,
+ to 255. If the colorMode() is set to RGB,
it
returns the blue value in the given range.
By default, brightness() returns a color's HSB brightness in
the range 0
- to 100. If the colorMode() is set to HSB,
+ to 100. If the colorMode() is set to HSB,
it
returns the brightness value in the given range.
buildGeometry() helps with creating complex 3D shapes from
simpler ones
- such as sphere(). It can help to make
+ such as sphere(). It can help to make
sketches
more performant. For example, if a complex 3D shape doesn’t change while a
@@ -33,10 +33,10 @@ description: >
once to create the new 3D shape.
See beginGeometry() and +
See beginGeometry() and - endGeometry() for another way to build - 3D + endGeometry() for another way to + build 3D shapes.
diff --git a/src/content/reference/en/p5/char.mdx b/src/content/reference/en/p5/char.mdx index 691e3613c0..df3990f230 100644 --- a/src/content/reference/en/p5/char.mdx +++ b/src/content/reference/en/p5/char.mdx @@ -26,7 +26,7 @@ description: > single-character strings is returned.See MDN for more information about conversions.
diff --git a/src/content/reference/en/p5/circle.mdx b/src/content/reference/en/p5/circle.mdx index 30b08e7942..736658b062 100644 --- a/src/content/reference/en/p5/circle.mdx +++ b/src/content/reference/en/p5/circle.mdx @@ -17,7 +17,7 @@ description: >0.5 * d (half the diameter) is the circle's radius.
- See ellipseMode() for other ways to
+ See ellipseMode() for other ways to
set its position.
line: 490
isConstructor: false
diff --git a/src/content/reference/en/p5/clear.mdx b/src/content/reference/en/p5/clear.mdx
index 5764e79196..ce6b900922 100644
--- a/src/content/reference/en/p5/clear.mdx
+++ b/src/content/reference/en/p5/clear.mdx
@@ -11,11 +11,11 @@ description: >
clear objects created by createX() functions such as
- createGraphics(),
+ createGraphics(),
- createVideo(), and
+ createVideo(), and
- createImg(). These objects will remain
+ createImg(). These objects will remain
unchanged after calling clear() and can be redrawn.
diff --git a/src/content/reference/en/p5/clearStorage.mdx b/src/content/reference/en/p5/clearStorage.mdx
index 3b3c6d20f1..5698e16eee 100644
--- a/src/content/reference/en/p5/clearStorage.mdx
+++ b/src/content/reference/en/p5/clearStorage.mdx
@@ -8,7 +8,8 @@ description: >
Web browsers can save small amounts of data using the built-in
- localStorage object.
Data stored in localStorage can be retrieved at any point, even
diff --git a/src/content/reference/en/p5/clip.mdx b/src/content/reference/en/p5/clip.mdx
index c7ae93e33f..2f85b585af 100644
--- a/src/content/reference/en/p5/clip.mdx
+++ b/src/content/reference/en/p5/clip.mdx
@@ -28,15 +28,15 @@ description: >
Masks can be contained between the - push() and pop() functions. + push() and pop() functions. Doing so allows unmasked shapes to be drawn after masked shapes.
Masks can also be defined with beginClip() + href="/reference/p5/beginClip/">beginClip() - and endClip().
+ and endClip(). line: 222 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/color.mdx b/src/content/reference/en/p5/color.mdx index 31cc33d679..35b4b0a5f5 100644 --- a/src/content/reference/en/p5/color.mdx +++ b/src/content/reference/en/p5/color.mdx @@ -13,7 +13,7 @@ description: > parameters are interpreted may be changed with the - colorMode() function. + colorMode() function.The version of color() with one parameter interprets the value
one of two
diff --git a/src/content/reference/en/p5/colorMode.mdx b/src/content/reference/en/p5/colorMode.mdx
index efda80c775..769f0c379a 100644
--- a/src/content/reference/en/p5/colorMode.mdx
+++ b/src/content/reference/en/p5/colorMode.mdx
@@ -7,13 +7,13 @@ description: >
Changes the way color values are interpreted.
By default, the Number parameters for fill(),
+ href="/reference/p5/fill/">fill(),
- stroke(),
+ stroke(),
- background(), and
+ background(), and
- color() are defined by values between 0 and
+ color() are defined by values between 0 and
255
using the RGB color model. This is equivalent to calling
diff --git a/src/content/reference/en/p5/console.mdx b/src/content/reference/en/p5/console.mdx
index bac1e0811d..9a4c1e86b4 100644
--- a/src/content/reference/en/p5/console.mdx
+++ b/src/content/reference/en/p5/console.mdx
@@ -6,7 +6,7 @@ file: src/core/reference.js
description: >
Prints a message to the web browser's console.
-The The console object is helpful for printing messages while debugging. For example, it's diff --git a/src/content/reference/en/p5/const.mdx b/src/content/reference/en/p5/const.mdx deleted file mode 100644 index 2d23b85320..0000000000 --- a/src/content/reference/en/p5/const.mdx +++ /dev/null @@ -1,84 +0,0 @@ ---- -title: const -module: Foundation -submodule: Foundation -file: src/core/reference.js -description: > -
Creates and names a new constant. Like a variable created with let,
-
- a constant that is created with const is a
- container for a value,
-
- however constants cannot be reassigned once they are declared. Although it is
-
- noteworthy that for non-primitive data types like objects & arrays, their
-
- elements can still be changeable. So if a variable is assigned an array, you
-
- can still add or remove elements from the array but cannot reassign another
-
- array to it. Also unlike let, you cannot declare variables
- without value
-
- using const.
Constants have block-scope. This means that the constant only exists within - - the - - block that it is created within. A constant cannot be redeclared within a - scope in which it - - already exists.
- -From the - MDN entry: - - Declares a read-only named constant. - - Constants are block-scoped, much like variables defined using the 'let' - statement. - - The value of a constant can't be changed through reassignment, and it can't be - redeclared.
-line: 34 -isConstructor: false -itemtype: property -alt: These examples do not render anything -example: - - |- - -
- // define myFavNumber as a constant and give it the value 7
- const myFavNumber = 7;
- console.log('my favorite number is: ' + myFavNumber);
-
-
- const bigCats = ['lion', 'tiger', 'panther'];
- bigCats.push('leopard');
- console.log(bigCats);
- // bigCats = ['cat']; // throws error as re-assigning not allowed for const
-
-
- const wordFrequency = {};
- wordFrequency['hello'] = 2;
- wordFrequency['bye'] = 1;
- console.log(wordFrequency);
- // wordFrequency = { 'a': 2, 'b': 3}; // throws error here
-
- A String constant that's used to set the
- angleMode().
By default, functions such as rotate() +
By default, functions such as rotate()
and
- sin() expect angles measured in units of
+ sin() expect angles measured in units of
radians.
Calling angleMode(DEGREES) ensures that angles are measured in
diff --git a/src/content/reference/en/p5/constants/RADIANS.mdx b/src/content/reference/en/p5/constants/RADIANS.mdx
index c47f53d5db..8599799a08 100644
--- a/src/content/reference/en/p5/constants/RADIANS.mdx
+++ b/src/content/reference/en/p5/constants/RADIANS.mdx
@@ -6,12 +6,12 @@ file: src/core/constants.js
description: >
A String constant that's used to set the
- angleMode().
By default, functions such as rotate() +
By default, functions such as rotate()
and
- sin() expect angles measured in units of
+ sin() expect angles measured in units of
radians.
Calling angleMode(RADIANS) ensures that angles are measured in
@@ -19,9 +19,9 @@ description: >
radians. Doing so can be useful if the
- angleMode() has been set to
+ angleMode() has been set to
- DEGREES.
Note: TWO_PI radians equals 360˚.
WEBGL differs from the default P2D renderer in the following
+ href="/reference//p5/P2D/">P2D renderer in the following
ways:
WEBGL mode can be used to draw
- 3-dimensional shapes like box(), sphere(), cone(), and more. See box(), sphere(), cone(), and more. See the
learn page about custom geometry to make more complex objects.WEBGL offers
different types of lights like ambientLight() to place around a scene.
- Materials like specularMaterial() reflect the
+ href="/reference//p5/ambientLight/">ambientLight() to place around a
+ scene. Materials like specularMaterial() reflect the
lighting to convey shape and depth. See the
learn page for styling and appearance to experiment with different
@@ -56,7 +56,7 @@ description: >
controls.WEBGL requires opentype/truetype font
- files to be preloaded using loadFont().
+ files to be preloaded using loadFont().
See the
wiki section about text for details, along with a workaround.To learn more about WEBGL mode, check out all the + href="https://p5js.org/learn/#:~:text=Getting%20Started%20in%20WebGL/">all the interactive WEBGL tutorials in the "Learn" section of this website, or read the wiki article "Getting + href="https://github.com/processing/p5.js/wiki/Getting-started-with-WebGL-in-p5/">"Getting started with WebGL in p5".
line: 24 isConstructor: false diff --git a/src/content/reference/en/p5/cos.mdx b/src/content/reference/en/p5/cos.mdx index 3fcadcdb5e..c785135788 100644 --- a/src/content/reference/en/p5/cos.mdx +++ b/src/content/reference/en/p5/cos.mdx @@ -13,7 +13,7 @@ description: >cos()
takes into account the current angleMode().
+ href="/reference/p5/angleMode/">angleMode().
line: 281
isConstructor: false
itemtype: method
diff --git a/src/content/reference/en/p5/createAudio.mdx b/src/content/reference/en/p5/createAudio.mdx
index 929f362f03..820689d289 100644
--- a/src/content/reference/en/p5/createAudio.mdx
+++ b/src/content/reference/en/p5/createAudio.mdx
@@ -27,7 +27,7 @@ description: >
browsers with different capabilities. See
MDN
for more information about supported formats.
diff --git a/src/content/reference/en/p5/createCamera.mdx b/src/content/reference/en/p5/createCamera.mdx
index e86be16561..8822942b7b 100644
--- a/src/content/reference/en/p5/createCamera.mdx
+++ b/src/content/reference/en/p5/createCamera.mdx
@@ -22,13 +22,13 @@ description: >
This camera can be controlled with the functions
- camera(),
+ camera(),
- perspective(),
+ perspective(),
- ortho(), and
+ ortho(), and
- frustum() if it's the only camera in the
+ frustum() if it's the only camera in the
scene.
Note: createCamera() can only be used in WebGL mode.
createCanvas() more than once causes unpredictable
behavior.
@@ -20,8 +20,8 @@ description: >
dimensions of the canvas and the values of the
- width and height system
+ width and height system
variables. For example, calling createCanvas(900, 500) creates a
canvas
@@ -37,7 +37,7 @@ description: >
the sketch's rendering mode. If an existing
- HTMLCanvasElement
is passed, as in createCanvas(900, 500, myCanvas), then it will
@@ -47,7 +47,7 @@ description: >
The fourth parameter is also optional. If an existing
- HTMLCanvasElement
is passed, as in createCanvas(900, 500, WEBGL, myCanvas), then it
@@ -58,7 +58,7 @@ description: >
Note: In WebGL mode, the canvas will use a WebGL2 context if it's supported
by the browser. Check the webglVersion
+ href="/reference/p5/webglVersion/">webglVersion
system variable to check what version is being used, or call
diff --git a/src/content/reference/en/p5/createCapture.mdx b/src/content/reference/en/p5/createCapture.mdx
index f9b6706cb0..7968a97605 100644
--- a/src/content/reference/en/p5/createCapture.mdx
+++ b/src/content/reference/en/p5/createCapture.mdx
@@ -17,7 +17,7 @@ description: >
default. They can be hidden by calling capture.hide() and drawn
to the
- canvas using image().
The first parameter, type, is optional. It sets the type of
capture to
@@ -58,18 +58,18 @@ description: >
parameter, stream, that's a
- MediaStream object.
Note: createCapture() only works when running a sketch locally
or using HTTPS. Learn more
here
and here.
Creates a p5.Shader object to be used with the - filter() function.
+ filter() function.createFilterShader() works like
- createShader() but has a default
+ createShader() but has a default
vertex
shader included. createFilterShader() is intended to be used
along with
- filter() for filtering the contents of a
+ filter() for filtering the contents of a
canvas.
A filter shader will be applied to the whole canvas instead of just
@@ -30,7 +30,7 @@ description: >
contains the fragment shader program written in
GLSL.
The p5.Shader object that's created @@ -62,7 +62,7 @@ description: > drawn.
For more info about filters and shaders, see Adam Ferriss' repo of shader
+ href="https://github.com/aferriss/p5jsShaderExamples/">repo of shader
examples
or the
true, as in { antialias: true }, 2 samples will be
used by default. The number of samples can also be set, as in {
antialias: 4 }. Default is to match setAttributes() which is
+ href="/reference/p5/setAttributes/">setAttributes() which is
false (true in Safari).
width: width of the
existing
- HTMLCanvasElement
is passed, as in createGraphics(900, 500, myCanvas), then it will
@@ -48,7 +48,7 @@ description: >
The fourth parameter is also optional. If an existing
- HTMLCanvasElement
is passed, as in createGraphics(900, 500, WEBGL, myCanvas), then
@@ -61,8 +61,8 @@ description: >
will use a WebGL2 context if it's supported by the browser. Check the
- webglVersion system variable to check
- what
+ webglVersion system variable to
+ check what
version is being used, or call setAttributes({ version: 1 }) to
create a
diff --git a/src/content/reference/en/p5/createImage.mdx b/src/content/reference/en/p5/createImage.mdx
index 0fd31ad802..405935d864 100644
--- a/src/content/reference/en/p5/createImage.mdx
+++ b/src/content/reference/en/p5/createImage.mdx
@@ -14,18 +14,18 @@ description: >
p5.Image can be modified by updating its
- pixels array or by calling its
+ pixels array or by calling its
- get() and
+ get() and
- set() methods. The
+ set() methods. The
- loadPixels() method must be
+ loadPixels() method must be
called
before reading or modifying pixel values. The
- updatePixels() method must be
+ updatePixels() method must be
called
for updates to take effect.
'anonymous' or 'use-credentials'
diff --git a/src/content/reference/en/p5/createInput.mdx b/src/content/reference/en/p5/createInput.mdx
index 3d43905c30..33652621dd 100644
--- a/src/content/reference/en/p5/createInput.mdx
+++ b/src/content/reference/en/p5/createInput.mdx
@@ -18,7 +18,7 @@ description: >
specifies the type of text being input. See MDN for a full
- list of options.
The default is 'text'.
diff --git a/src/content/reference/en/p5/createRadio.mdx b/src/content/reference/en/p5/createRadio.mdx
index 80ea08be69..12baaaf83b 100644
--- a/src/content/reference/en/p5/createRadio.mdx
+++ b/src/content/reference/en/p5/createRadio.mdx
@@ -42,7 +42,7 @@ description: >
myRadio.selected(value) selects the given option and returns
it as an HTMLInputElement.myRadio.disable(shouldDisable) enables the entire radio
diff --git a/src/content/reference/en/p5/createShader.mdx b/src/content/reference/en/p5/createShader.mdx
index eeb87a291c..be6a0913fe 100644
--- a/src/content/reference/en/p5/createShader.mdx
+++ b/src/content/reference/en/p5/createShader.mdx
@@ -13,7 +13,7 @@ description: >
graphics tasks. They’re written in a language called
GLSL
and run along with the rest of the code in a sketch.
@@ -21,7 +21,7 @@ description: >
Once the p5.Shader object is created,
it can be
- used with the shader() function, as in
+ used with the shader() function, as in
shader(myShader). A shader program consists of two parts, a
vertex shader
diff --git a/src/content/reference/en/p5/createVideo.mdx b/src/content/reference/en/p5/createVideo.mdx
index 9a62e95fd9..18b93c6009 100644
--- a/src/content/reference/en/p5/createVideo.mdx
+++ b/src/content/reference/en/p5/createVideo.mdx
@@ -14,7 +14,7 @@ description: >
default. They can be hidden by calling video.hide() and drawn to
the
- canvas using image().
The first parameter, src, is the path the video. If a single
string is
@@ -33,7 +33,7 @@ description: >
different capabilities. See
MDN
+ href="https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats/">MDN
for more information about supported formats.
curveDetail(5) will use 5
segments to
- draw curves with the curve() function. By
+ draw curves with the curve() function. By
default,detail is 20.
diff --git a/src/content/reference/en/p5/curvePoint.mdx b/src/content/reference/en/p5/curvePoint.mdx
index 100900b84f..4b41583941 100644
--- a/src/content/reference/en/p5/curvePoint.mdx
+++ b/src/content/reference/en/p5/curvePoint.mdx
@@ -11,7 +11,7 @@ description: >
anchor and control points. It expects points in the same order as the
- curve() function. curvePoint()
+ curve() function. curvePoint()
works one axis
at a time. Passing the anchor and control points' x-coordinates will
diff --git a/src/content/reference/en/p5/curveTangent.mdx b/src/content/reference/en/p5/curveTangent.mdx
index 84a96cb5e6..39bb44e7ef 100644
--- a/src/content/reference/en/p5/curveTangent.mdx
+++ b/src/content/reference/en/p5/curveTangent.mdx
@@ -15,7 +15,7 @@ description: >
spline curve's anchor and control points. It expects points in the same
- order as the curve() function.
+ order as the curve() function.
curveTangent()
works one axis at a time. Passing the anchor and control points'
diff --git a/src/content/reference/en/p5/curveTightness.mdx b/src/content/reference/en/p5/curveTightness.mdx
index 5c6fa63a9d..bcdbd3fa20 100644
--- a/src/content/reference/en/p5/curveTightness.mdx
+++ b/src/content/reference/en/p5/curveTightness.mdx
@@ -4,9 +4,9 @@ module: Shape
submodule: Curves
file: src/core/shape/curves.js
description: >
- Adjusts the way curve() and +
Adjusts the way curve() and - curveVertex() draw.
+ curveVertex() draw.Spline curves are like cables that are attached to a set of points.
diff --git a/src/content/reference/en/p5/curveVertex.mdx b/src/content/reference/en/p5/curveVertex.mdx
index 18f70e633e..16ceb6bd69 100644
--- a/src/content/reference/en/p5/curveVertex.mdx
+++ b/src/content/reference/en/p5/curveVertex.mdx
@@ -11,12 +11,12 @@ description: >
it creates are defined like those made by the
- curve() function. curveVertex()
- must be called
+ curve() function.
+ curveVertex() must be called
- between the beginShape() and
+ between the beginShape() and
- endShape() functions.
Spline curves can form shapes and curves that slope gently. They’re like @@ -27,71 +27,70 @@ description: > least four times between - beginShape() and + beginShape() and - endShape() in order to draw a curve:
+ endShape() in order to draw a curve: -beginShape();
+
+ beginShape();
- // Add the first control point.
- curveVertex(84, 91);
+ // Add the first control point.
+ curveVertex(84, 91);
- // Add the anchor points to draw between.
+ // Add the anchor points to draw between.
curveVertex(68, 19);
- curveVertex(21, 17);
+ curveVertex(21, 17);
-
- // Add the second control point.
+ // Add the second control point.
- curveVertex(32, 91);
+ curveVertex(32, 91);
+ endShape();
- endShape();
-
The code snippet above would only draw the curve between the anchor points,
- similar to the curve() function. The
+ similar to the curve() function. The
segments
between the control and anchor points can be drawn by calling
curveVertex() with the coordinates of the control points:
beginShape();
+
+ beginShape();
- // Add the first control point and draw a segment to it.
- curveVertex(84, 91);
+ // Add the first control point and draw a segment to it.
curveVertex(84, 91);
+ curveVertex(84, 91);
- // Add the anchor points to draw between.
+ // Add the anchor points to draw between.
curveVertex(68, 19);
- curveVertex(21, 17);
+ curveVertex(21, 17);
+ // Add the second control point.
- // Add the second control point.
-
- curveVertex(32, 91);
+ curveVertex(32, 91);
+ // Uncomment the next line to draw the segment to the second control point.
- // Uncomment the next line to draw the segment to the second control point.
+ // curveVertex(32, 91);
- // curveVertex(32, 91);
+ endShape();
-
- endShape();
-
The first two parameters, x and y, set the
vertex’s location. For
@@ -109,7 +108,7 @@ description: >
Note: curveVertex() won’t work when an argument is passed to
- beginShape().
deltaTime contains the amount of time it took
- draw() to execute during the previous frame.
+ draw() to execute during the previous frame.
It's
useful for simulating physics.
The deviceMoved() function is +
The deviceMoved() function is called when the device is moved by more than the threshold value along X, Y or Z axis. The default threshold is set to 0.5. The threshold value can be changed using setMoveThreshold().
+ href="https://p5js.org/reference/#/p5/setMoveThreshold/">setMoveThreshold(). line: 501 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/deviceShaken.mdx b/src/content/reference/en/p5/deviceShaken.mdx index 7bcad1071c..fabd103048 100644 --- a/src/content/reference/en/p5/deviceShaken.mdx +++ b/src/content/reference/en/p5/deviceShaken.mdx @@ -4,7 +4,7 @@ module: Events submodule: Acceleration file: src/events/acceleration.js description: > -The deviceShaken() function is +
The deviceShaken() function is called when the device total acceleration changes of accelerationX and accelerationY values is more than @@ -12,7 +12,7 @@ description: > the threshold value. The default threshold is set to 30. The threshold value can be changed using setShakeThreshold().
+ href="https://p5js.org/reference/#/p5/setShakeThreshold/">setShakeThreshold(). line: 589 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/deviceTurned.mdx b/src/content/reference/en/p5/deviceTurned.mdx index 16dff66a80..356bf740a5 100644 --- a/src/content/reference/en/p5/deviceTurned.mdx +++ b/src/content/reference/en/p5/deviceTurned.mdx @@ -4,16 +4,16 @@ module: Events submodule: Acceleration file: src/events/acceleration.js description: > -The deviceTurned() function is +
The deviceTurned() function is called when the device rotates by more than 90 degrees continuously.
The axis that triggers the deviceTurned() method is stored in the + href="/reference/p5/deviceTurned/">deviceTurned() method is stored in the turnAxis - variable. The deviceTurned() method + variable. The deviceTurned() method can be locked to trigger on any axis: X, Y or Z by comparing the turnAxis variable to 'X', 'Y' or 'Z'.
diff --git a/src/content/reference/en/p5/directionalLight.mdx b/src/content/reference/en/p5/directionalLight.mdx index 1c6502a2eb..24301029a9 100644 --- a/src/content/reference/en/p5/directionalLight.mdx +++ b/src/content/reference/en/p5/directionalLight.mdx @@ -29,7 +29,7 @@ description: > three parameters,v1, v2, and v3, set
the light’s color using the
- current colorMode(). The last three
+ current colorMode(). The last three
parameters, x, y, and z, set the
light’s direction. For example,
@@ -45,7 +45,8 @@ description: >
three parameters, v1, v2, and v3, set
the light’s color using the
- current colorMode(). The last parameter,
+ current colorMode(). The last
+ parameter,
direction sets the light’s direction using a
diff --git a/src/content/reference/en/p5/displayHeight.mdx b/src/content/reference/en/p5/displayHeight.mdx
index 094082b4aa..2f353f6763 100644
--- a/src/content/reference/en/p5/displayHeight.mdx
+++ b/src/content/reference/en/p5/displayHeight.mdx
@@ -11,7 +11,7 @@ description: >
value
depends on the current pixelDensity().
+ href="/reference/p5/pixelDensity/">pixelDensity().
Note: The actual screen height can be computed as diff --git a/src/content/reference/en/p5/displayWidth.mdx b/src/content/reference/en/p5/displayWidth.mdx index 3cf4b56fa2..bcb4bb81dc 100644 --- a/src/content/reference/en/p5/displayWidth.mdx +++ b/src/content/reference/en/p5/displayWidth.mdx @@ -11,7 +11,7 @@ description: > value depends on the current pixelDensity().
+ href="/reference/p5/pixelDensity/">pixelDensity().Note: The actual screen width can be computed as diff --git a/src/content/reference/en/p5/dist.mdx b/src/content/reference/en/p5/dist.mdx index 7a80b8a55d..b30c37a6eb 100644 --- a/src/content/reference/en/p5/dist.mdx +++ b/src/content/reference/en/p5/dist.mdx @@ -16,7 +16,7 @@ description: > dimensions.
-Use p5.Vector.dist() to calculate +
Use p5.Vector.dist() to calculate the distance between two p5.Vector diff --git a/src/content/reference/en/p5/doubleClicked.mdx b/src/content/reference/en/p5/doubleClicked.mdx index b3b50c250d..868e18c69d 100644 --- a/src/content/reference/en/p5/doubleClicked.mdx +++ b/src/content/reference/en/p5/doubleClicked.mdx @@ -21,9 +21,9 @@ description: >
The mouse system variables, such as mouseX and
+ href="/reference/p5/mouseX/">mouseX and
- mouseY, will be updated with their most
+ mouseY, will be updated with their most
recent
value when doubleClicked() is called by p5.js:
The parameter, event, is optional.
doubleClicked() is always passed a
- MouseEvent
object with properties that describe the double-click event:
draw()
has run is stored in the system variable
- frameCount().
+ frameCount().
Code placed within draw() begins looping after
- setup() runs. draw() will run
+ setup() runs. draw() will run
until the user
closes the sketch. draw() can be stopped by calling the
- noLoop() function. draw() can
+ noLoop() function. draw() can
be resumed by
- calling the loop() function.
h set its width and height. See
- ellipseMode() for other ways to set
+ ellipseMode() for other ways to set
its position.
diff --git a/src/content/reference/en/p5/ellipseMode.mdx b/src/content/reference/en/p5/ellipseMode.mdx
index 4b5073deb5..2b08a1fdb7 100644
--- a/src/content/reference/en/p5/ellipseMode.mdx
+++ b/src/content/reference/en/p5/ellipseMode.mdx
@@ -8,10 +8,10 @@ description: >
By default, the first two parameters of - ellipse(), circle(), + ellipse(), circle(), - and arc() + and arc() are the x- and y-coordinates of the shape's center. The next parameters set diff --git a/src/content/reference/en/p5/ellipsoid.mdx b/src/content/reference/en/p5/ellipsoid.mdx index 6c80335e22..1d59230c71 100644 --- a/src/content/reference/en/p5/ellipsoid.mdx +++ b/src/content/reference/en/p5/ellipsoid.mdx @@ -15,7 +15,7 @@ description: > defines a shape by its radii. This is different from - ellipse() which uses diameters + ellipse() which uses diameters (width and height).
diff --git a/src/content/reference/en/p5/emissiveMaterial.mdx b/src/content/reference/en/p5/emissiveMaterial.mdx index 36487b2eae..105c308a0c 100644 --- a/src/content/reference/en/p5/emissiveMaterial.mdx +++ b/src/content/reference/en/p5/emissiveMaterial.mdx @@ -53,7 +53,7 @@ description: >emissiveMaterial(255, 0, 0, 30). Color values will be interpreted
using
- the current colorMode().
+ the current colorMode().
Note: emissiveMaterial() can only be used in WebGL mode.
Ends defining a mask that was started with - beginClip().
+ beginClip(). line: 190 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/endContour.mdx b/src/content/reference/en/p5/endContour.mdx index 9179efe519..cc90bfb85d 100644 --- a/src/content/reference/en/p5/endContour.mdx +++ b/src/content/reference/en/p5/endContour.mdx @@ -6,36 +6,37 @@ file: src/core/shape/vertex.js description: >Stops creating a hole within a flat shape.
-The beginContour() and +
The beginContour() and
endContour()
functions allow for creating negative space within custom shapes that are
- flat. beginContour() begins adding
+ flat. beginContour() begins adding
vertices
to a negative space and endContour() stops adding them.
- beginContour() and
+ beginContour() and
endContour() must be
- called between beginShape() and
+ called between beginShape() and
- endShape().
Transformations such as translate(), +
Transformations such as translate(),
- rotate(), and scale()
+ rotate(), and scale()
- don't work between beginContour() and
+ don't work between beginContour()
+ and
endContour(). It's also not possible to use other shapes, such as
- ellipse() or rect(),
+ ellipse() or rect(),
- between beginContour() and
+ between beginContour() and
endContour().
Note: The vertices that define a negative space must "wind" in the opposite diff --git a/src/content/reference/en/p5/endGeometry.mdx b/src/content/reference/en/p5/endGeometry.mdx index 3bc5979755..ce060d9e23 100644 --- a/src/content/reference/en/p5/endGeometry.mdx +++ b/src/content/reference/en/p5/endGeometry.mdx @@ -10,33 +10,33 @@ description: > object.
The beginGeometry() and endGeometry()
+ href="/reference/p5/endGeometry/">endGeometry()
functions help with creating complex 3D shapes from simpler ones such as
- sphere(). beginGeometry()
+ sphere(). beginGeometry()
begins adding shapes
to a custom p5.Geometry object and
- endGeometry() stops adding them.
beginGeometry() and endGeometry() can help
+ href="/reference/p5/endGeometry/">endGeometry() can help
to make sketches more performant. For example, if a complex 3D shape
doesn’t change while a sketch runs, then it can be created with
beginGeometry() and endGeometry().
+ href="/reference/p5/endGeometry/">endGeometry().
Creating a p5.Geometry object once and
then
drawing it will run faster than repeatedly drawing the individual pieces.
See buildGeometry() for another +
See buildGeometry() for another way to build 3D shapes.
diff --git a/src/content/reference/en/p5/endShape.mdx b/src/content/reference/en/p5/endShape.mdx index 6a54dcf176..4cf50da317 100644 --- a/src/content/reference/en/p5/endShape.mdx +++ b/src/content/reference/en/p5/endShape.mdx @@ -6,12 +6,12 @@ file: src/core/shape/vertex.js description: >Begins adding vertices to a custom shape.
-The beginShape() and +
The beginShape() and
endShape() functions
allow for creating custom shapes in 2D or 3D.
- beginShape() begins adding vertices to
+ beginShape() begins adding vertices to
a
custom shape and endShape() stops adding them.
After calling beginShape(), shapes +
After calling beginShape(), shapes
can be
- built by calling vertex(),
+ built by calling vertex(),
- bezierVertex(),
+ bezierVertex(),
- quadraticVertex(), and/or
+ quadraticVertex(), and/or
- curveVertex(). Calling
+ curveVertex(). Calling
endShape() will stop adding vertices to the
@@ -61,21 +61,21 @@ description: >
with the current fill color.
Transformations such as translate(), +
Transformations such as translate(),
- rotate(), and
+ rotate(), and
- scale() don't work between
+ scale() don't work between
- beginShape() and
+ beginShape() and
endShape(). It's also not
possible to use other shapes, such as ellipse() or
+ href="/reference/p5/ellipse/">ellipse() or
- rect(), between
+ rect(), between
- beginShape() and
+ beginShape() and
endShape().
erase() is
called.
@@ -41,15 +41,15 @@ description: >
255 (full strength).
To cancel the erasing effect, use the noErase() + href="/reference/p5/noErase/">noErase() function.
erase() has no effect on drawing done with the
- image() and
+ image() and
- background() functions.
Exits a pointer lock started with - requestPointerLock.
+ requestPointerLock.Calling requestPointerLock() locks the values of
- mouseX, mouseY,
+ mouseX, mouseY,
- pmouseX, and pmouseY.
+ pmouseX, and pmouseY.
Calling exitPointerLock() resumes updating the mouse system
variables.
requestPointerLock() in
an event function such as doubleClicked().
+ href="/reference/p5/doubleClicked/">doubleClicked().
line: 1932
isConstructor: false
itemtype: method
diff --git a/src/content/reference/en/p5/fill.mdx b/src/content/reference/en/p5/fill.mdx
index 673999b979..342af6a7bb 100644
--- a/src/content/reference/en/p5/fill.mdx
+++ b/src/content/reference/en/p5/fill.mdx
@@ -30,7 +30,7 @@ description: >
or HSL colors, depending on the current
- colorMode(). The default color space is
+ colorMode(). The default color space is
RGB,
with each value in the range from 0 to 255.
diff --git a/src/content/reference/en/p5/filter.mdx b/src/content/reference/en/p5/filter.mdx
index b16fbcbec4..9a58dabb73 100644
--- a/src/content/reference/en/p5/filter.mdx
+++ b/src/content/reference/en/p5/filter.mdx
@@ -67,7 +67,7 @@ description: >
In WebgL mode, filter() can also use custom shaders. See
- createFilterShader() for more
+ createFilterShader() for more
information.
frameCount's value is 0 inside setup(). It
+ href="/reference/p5/setup/">setup(). It
- increments by 1 each time the code in draw()
+ increments by 1 each time the code in draw()
finishes executing.
freeGeometry() works with p5.Geometry objects
- created with beginGeometry() and
+ created with beginGeometry() and
- endGeometry(),
+ endGeometry(),
- buildGeometry(), and
+ buildGeometry(), and
- loadModel().
+ loadModel().
The parameter, geometry, is the p5.Geometry
diff --git a/src/content/reference/en/p5/function.mdx b/src/content/reference/en/p5/function.mdx
index 1580bb2a9f..76f6a9d676 100644
--- a/src/content/reference/en/p5/function.mdx
+++ b/src/content/reference/en/p5/function.mdx
@@ -3,7 +3,7 @@ title: function
module: Foundation
submodule: Foundation
file: src/core/reference.js
-description: "
A named group of statements.
\nFunctions\nhelp with organizing and reusing code. For example, functions make it easy\nto express the idea \"Draw a flower.\":
\nfunction drawFlower() {\n // Style the text.\n textAlign(CENTER, CENTER);\n textSize(20);\n\n // Draw a flower emoji.\n text('\U0001F338', 50, 50);\n}\nThe function header begins with the keyword function. The function's\nname, drawFlower, is followed by parentheses () and curly braces {}.\nThe code between the curly braces is called the function's body. The\nfunction's body runs when the function is called like so:
drawFlower();\nFunctions can accept inputs by adding parameters to their headers.\nParameters are placeholders for values that will be provided when the\nfunction is called. For example, the drawFlower() function could include\na parameter for the flower's size:
function drawFlower(size) {\n // Style the text.\n textAlign(CENTER, CENTER);\n\n // Use the size parameter.\n textSize(size);\n\n // Draw a flower emoji.\n text('\U0001F338', 50, 50);\n}\nParameters are part of the function's declaration. Arguments are provided\nby the code that calls a function. When a function is called, arguments are\nassigned to parameters:
\n// The argument 20 is assigned to the parameter size.\ndrawFlower(20);\nFunctions can have multiple parameters separated by commas. Parameters\ncan have any type. For example, the drawFlower() function could accept\nNumber parameters for the flower's x- and y-coordinates along with its\nsize:
function drawFlower(x, y, size) {\n // Style the text.\n textAlign(CENTER, CENTER);\n\n // Use the size parameter.\n textSize(size);\n\n // Draw a flower emoji.\n // Use the x and y parameters.\n text('\U0001F338', x, y);\n}\nFunctions can also produce outputs by adding a return statement:
function double(x) {\n let answer = 2 * x;\n return answer;\n}\nThe expression following return can produce an output that's used\nelsewhere. For example, the output of the double() function can be\nassigned to a variable:
let six = double(3);\ntext(`3 x 2 = ${six}`, 50, 50);\nA named group of statements.
\nFunctions\nhelp with organizing and reusing code. For example, functions make it easy\nto express the idea \"Draw a flower.\":
\nfunction drawFlower() {\n // Style the text.\n textAlign(CENTER, CENTER);\n textSize(20);\n\n // Draw a flower emoji.\n text('\U0001F338', 50, 50);\n}\nThe function header begins with the keyword function. The function's\nname, drawFlower, is followed by parentheses () and curly braces {}.\nThe code between the curly braces is called the function's body. The\nfunction's body runs when the function is called like so:
drawFlower();\nFunctions can accept inputs by adding parameters to their headers.\nParameters are placeholders for values that will be provided when the\nfunction is called. For example, the drawFlower() function could include\na parameter for the flower's size:
function drawFlower(size) {\n // Style the text.\n textAlign(CENTER, CENTER);\n\n // Use the size parameter.\n textSize(size);\n\n // Draw a flower emoji.\n text('\U0001F338', 50, 50);\n}\nParameters are part of the function's declaration. Arguments are provided\nby the code that calls a function. When a function is called, arguments are\nassigned to parameters:
\n// The argument 20 is assigned to the parameter size.\ndrawFlower(20);\nFunctions can have multiple parameters separated by commas. Parameters\ncan have any type. For example, the drawFlower() function could accept\nNumber parameters for the flower's x- and y-coordinates along with its\nsize:
function drawFlower(x, y, size) {\n // Style the text.\n textAlign(CENTER, CENTER);\n\n // Use the size parameter.\n textSize(size);\n\n // Draw a flower emoji.\n // Use the x and y parameters.\n text('\U0001F338', x, y);\n}\nFunctions can also produce outputs by adding a return statement:
function double(x) {\n let answer = 2 * x;\n return answer;\n}\nThe expression following return can produce an output that's used\nelsewhere. For example, the output of the double() function can be\nassigned to a variable:
let six = double(3);\ntext(`3 x 2 = ${six}`, 50, 50);\nget() is easy to use but it's not as fast as
- pixels. Use pixels
+ pixels. Use pixels
to read many pixel values.
Use p5.Image.get() to work directly +
Use p5.Image.get() to work directly with p5.Image objects.
diff --git a/src/content/reference/en/p5/getItem.mdx b/src/content/reference/en/p5/getItem.mdx index 01c4232aa4..aecd5fee77 100644 --- a/src/content/reference/en/p5/getItem.mdx +++ b/src/content/reference/en/p5/getItem.mdx @@ -8,7 +8,8 @@ description: >Web browsers can save small amounts of data using the built-in
- localStorage object.
Data stored in localStorage can be retrieved at any point, even
@@ -18,7 +19,7 @@ description: >
pairs.
storeItem() makes it easy to store +
storeItem() makes it easy to store
values in
localStorage and getItem() makes it easy to retrieve
diff --git a/src/content/reference/en/p5/getTargetFrameRate.mdx b/src/content/reference/en/p5/getTargetFrameRate.mdx
index fb59260bf7..9333dec8b0 100644
--- a/src/content/reference/en/p5/getTargetFrameRate.mdx
+++ b/src/content/reference/en/p5/getTargetFrameRate.mdx
@@ -6,7 +6,7 @@ file: src/core/environment.js
description: |
Returns the target frame rate.
The value is either the system frame rate or the last value passed to - frameRate().
+ frameRate(). line: 447 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/getURL.mdx b/src/content/reference/en/p5/getURL.mdx index 8871420a4d..53dc4618e8 100644 --- a/src/content/reference/en/p5/getURL.mdx +++ b/src/content/reference/en/p5/getURL.mdx @@ -7,7 +7,7 @@ description: >Returns the sketch's current
URL
as a String.
By default, green() returns a color's green value in the range
0
- to 255. If the colorMode() is set to RGB,
+ to 255. If the colorMode() is set to RGB,
it
returns the green value in the given range.
A list of shapes follows the table. The list describes the color, type, diff --git a/src/content/reference/en/p5/gt.mdx b/src/content/reference/en/p5/gt.mdx deleted file mode 100644 index bf6dc80816..0000000000 --- a/src/content/reference/en/p5/gt.mdx +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: '>' -module: Foundation -submodule: Foundation -file: src/core/reference.js -description: >- -
The greater than operator > - - evaluates to true if the left value is greater than - - the right value.
- - - - There is more info on comparison operators on MDN. -line: 115 -isConstructor: false -itemtype: property -alt: This example does not render anything -example: - - |- - -
- console.log(100 > 1); // prints true to the console
- console.log(1 > 100); // prints false to the console
-
- The greater than or equal to operator >= - - evaluates to true if the left value is greater than or equal to - - the right value.
- -There - is more info on comparison operators on MDN.
-line: 137 -isConstructor: false -itemtype: property -alt: This example does not render anything -example: - - |- - -
- console.log(100 >= 100); // prints true to the console
- console.log(101 >= 100); // prints true to the console
-
- height's default value is 100. Calling
- createCanvas() or
+ createCanvas() or
- resizeCanvas() changes the value of
+ resizeCanvas() changes the value of
- height. Calling noCanvas()
+ height. Calling noCanvas()
sets its value to
0.
The if-else statement helps control the - flow of your code.
- -A condition is placed between the parenthesis following 'if', - - when that condition evalues to truthy, - - the code between the following curly braces is run. - - Alternatively, when the condition evaluates to falsy, - - the code between the curly braces of 'else' block is run instead. Writing an - - else block is optional.
- -From the - MDN entry: - - The 'if' statement executes a statement if a specified condition is truthy. - - If the condition is falsy, another statement can be executed
-line: 200 -isConstructor: false -itemtype: property -alt: This example does not render anything -example: - - |- - -
- let a = 4;
- if (a > 0) {
- console.log('positive');
- } else {
- console.log('negative');
- }
-
- Boolean expression is
true.
- The mouseIsPressed system +
The mouseIsPressed system
variable is
always true or false, so the code snippet above
@@ -153,8 +153,8 @@ description: >
-
See Boolean and Number to learn more about these data types and the operations they support.
line: 110 diff --git a/src/content/reference/en/p5/image.mdx b/src/content/reference/en/p5/image.mdx index 73f1332544..193bc3d4c2 100644 --- a/src/content/reference/en/p5/image.mdx +++ b/src/content/reference/en/p5/image.mdx @@ -31,7 +31,7 @@ description: > destination image's top left corner. See - imageMode() for other ways to position + imageMode() for other ways to position images.Here's a diagram that explains how optional parameters work in diff --git a/src/content/reference/en/p5/imageLight.mdx b/src/content/reference/en/p5/imageLight.mdx index 6c6cc18516..fdefd0569b 100644 --- a/src/content/reference/en/p5/imageLight.mdx +++ b/src/content/reference/en/p5/imageLight.mdx @@ -13,12 +13,12 @@ description: > as its texture. The image's diffuse light will be affected by - fill() and the specular reflections will be + fill() and the specular reflections will be - affected by specularMaterial() + affected by specularMaterial() and - shininess().
+ shininess().The parameter, img, is the p5.Image object to
diff --git a/src/content/reference/en/p5/imageMode.mdx b/src/content/reference/en/p5/imageMode.mdx
index a4e44c8c3f..f8242c93de 100644
--- a/src/content/reference/en/p5/imageMode.mdx
+++ b/src/content/reference/en/p5/imageMode.mdx
@@ -6,11 +6,11 @@ file: src/image/loading_displaying.js
description: >
Changes the location from which images are drawn when - image() is called.
+ image() is called.By default, the first - two parameters of image() are the x- and + two parameters of image() are the x- and y-coordinates of the image's upper-left corner. The next parameters are @@ -19,7 +19,7 @@ description: >
imageMode(CORNERS) also uses the first two parameters of
- image() as the x- and y-coordinates of the
+ image() as the x- and y-coordinates of the
image's
top-left corner. The third and fourth parameters are the coordinates of its
@@ -28,7 +28,7 @@ description: >
imageMode(CENTER) uses the first two parameters of
- image() as the x- and y-coordinates of the
+ image() as the x- and y-coordinates of the
image's
center. The next parameters are its width and height.
Returns true if the draw loop is running and
false if not.
By default, draw() tries to run 60 times +
By default, draw() tries to run 60 times per - second. Calling noLoop() stops + second. Calling noLoop() stops - draw() from repeating. The draw loop can be + draw() from repeating. The draw loop can be - restarted by calling loop().
+ restarted by calling loop().The isLooping() function can be used to check whether a sketch
is
diff --git a/src/content/reference/en/p5/key.mdx b/src/content/reference/en/p5/key.mdx
index eff7120d6a..505310313d 100644
--- a/src/content/reference/en/p5/key.mdx
+++ b/src/content/reference/en/p5/key.mdx
@@ -21,7 +21,7 @@ description: >
for special keys such as LEFT_ARROW and ENTER. Use
keyCode instead for
- special keys. The keyIsDown() function
+ special keys. The keyIsDown() function
should
be used to check for multiple different key presses at the same time.
keyIsDown() can check for key presses using
- keyCode values, as in
+ keyCode values, as in
keyIsDown(37) or
keyIsDown(LEFT_ARROW). Key codes can be found on websites such as
diff --git a/src/content/reference/en/p5/keyPressed.mdx b/src/content/reference/en/p5/keyPressed.mdx
index 74ac842662..3f70d8f1fd 100644
--- a/src/content/reference/en/p5/keyPressed.mdx
+++ b/src/content/reference/en/p5/keyPressed.mdx
@@ -17,8 +17,8 @@ description: >
-
The key and keyCode variables will be updated with the most recently typed value when @@ -39,7 +39,7 @@ description: >
The parameter, event, is optional. keyPressed()
is always passed a
- KeyboardEvent
object with properties that describe the key press event:
The key and keyCode variables will be updated with the most recently released value when @@ -39,7 +39,7 @@ description: >
The parameter, event, is optional. keyReleased()
is always passed a
- KeyboardEvent
object with properties that describe the key press event:
The key and keyCode variables will be updated with the most recently released value when @@ -47,7 +47,7 @@ description: >
The parameter, event, is optional. keyTyped() is
always passed a
- KeyboardEvent
object with properties that describe the key press event:
Note: Use the keyPressed() function +
Note: Use the keyPressed() function
and
- keyCode system variable to respond to
+ keyCode system variable to respond to
modifier
keys such as ALT.
The way that colors are interpolated depends on the current - colorMode().
+ colorMode(). line: 949 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/lightFalloff.mdx b/src/content/reference/en/p5/lightFalloff.mdx index c27b735d2e..2005477d10 100644 --- a/src/content/reference/en/p5/lightFalloff.mdx +++ b/src/content/reference/en/p5/lightFalloff.mdx @@ -5,9 +5,9 @@ submodule: Lights file: src/webgl/light.js description: >Sets the falloff rate for pointLight() + href="/reference/p5/pointLight/">pointLight() - and spotLight().
+ and spotLight().A light’s falloff describes the intensity of its beam at a distance. For diff --git a/src/content/reference/en/p5/lightness.mdx b/src/content/reference/en/p5/lightness.mdx index 3bf73fcd07..d043b31a07 100644 --- a/src/content/reference/en/p5/lightness.mdx +++ b/src/content/reference/en/p5/lightness.mdx @@ -16,7 +16,7 @@ description: >
By default, lightness() returns a color's HSL lightness in the
range 0
- to 100. If the colorMode() is set to HSL,
+ to 100. If the colorMode() is set to HSL,
it
returns the lightness value in the given range.
WEBGL argument to
- createCanvas().
+ createCanvas().
line: 573
isConstructor: false
itemtype: method
diff --git a/src/content/reference/en/p5/loadFont.mdx b/src/content/reference/en/p5/loadFont.mdx
index 755e5370b8..70bb37ce71 100644
--- a/src/content/reference/en/p5/loadFont.mdx
+++ b/src/content/reference/en/p5/loadFont.mdx
@@ -21,7 +21,7 @@ description: >
examples can be downloaded for free
- here.
Paths to remote files should be URLs. For example,
@@ -46,19 +46,19 @@ description: >
may use the error
- Event
object if needed.
Fonts can take time to load. Calling loadFont() in
- preload() ensures fonts load before
+ preload() ensures fonts load before
they're
- used in setup() or
+ used in setup() or
- draw().
Images can take time to load. Calling loadImage() in
- preload() ensures images load before
+ preload() ensures images load before
they're
- used in setup() or draw().
JavaScript Object Notation - (JSON) is a standard format for sending data between applications. The format is @@ -56,11 +56,11 @@ description: >
Note: Data can take time to load. Calling loadJSON() within
- preload() ensures data loads before it's
+ preload() ensures data loads before it's
used in
- setup() or draw().
model(shape).
There are three ways to call loadModel() with optional
@@ -117,11 +117,11 @@ description: >
Models can take time to load. Calling loadModel() in
- preload() ensures models load before
+ preload() ensures models load before
they're
- used in setup() or draw().
Note: There’s no support for colored STL files. STL files with color will diff --git a/src/content/reference/en/p5/loadPixels.mdx b/src/content/reference/en/p5/loadPixels.mdx index f59a02c91b..896e9e0b05 100644 --- a/src/content/reference/en/p5/loadPixels.mdx +++ b/src/content/reference/en/p5/loadPixels.mdx @@ -5,9 +5,9 @@ submodule: Pixels file: src/image/pixels.js description: |
Loads the current value of each pixel on the canvas into the - pixels array.
+ pixels array.loadPixels() must be called before reading from or writing to
- pixels.
Once the p5.Shader object is created,
it can be
- used with the shader() function, as in
+ used with the shader() function, as in
shader(myShader). A shader program consists of two files, a
vertex shader
@@ -61,11 +61,11 @@ description: >
Shaders can take time to load. Calling loadShader() in
- preload() ensures shaders load before
+ preload() ensures shaders load before
they're
- used in setup() or draw().
Note: Shaders can only be used in WebGL mode.
line: 12 diff --git a/src/content/reference/en/p5/loadSound.mdx b/src/content/reference/en/p5/loadSound.mdx index 1443d7710b..65c460de2f 100644 --- a/src/content/reference/en/p5/loadSound.mdx +++ b/src/content/reference/en/p5/loadSound.mdx @@ -9,7 +9,7 @@ description: | to play in time for setup() and draw(). If called outside of preload, the p5.SoundFile will not be ready immediately, so loadSound accepts a callback as the second parameter. Using a - + local server is recommended when loading external files. line: 2946 isConstructor: false diff --git a/src/content/reference/en/p5/loadStrings.mdx b/src/content/reference/en/p5/loadStrings.mdx index c2ebf4c99a..8bca43268b 100644 --- a/src/content/reference/en/p5/loadStrings.mdx +++ b/src/content/reference/en/p5/loadStrings.mdx @@ -46,11 +46,11 @@ description: >Note: Data can take time to load. Calling loadStrings() within
- preload() ensures data loads before it's
+ preload() ensures data loads before it's
used in
- setup() or draw().
This method is asynchronous, meaning it may not finish before the next line in your sketch is executed. Calling loadTable() inside preload() + href="/reference/p5/loadTable/">loadTable() inside preload() guarantees to complete the operation before setup() and draw() are called. + href="/reference/p5/setup/">setup() and draw() are called. - Outside of preload(), you may supply a + Outside of preload(), you may supply a callback function to handle the object:
diff --git a/src/content/reference/en/p5/loadXML.mdx b/src/content/reference/en/p5/loadXML.mdx index 9beadd4fba..a7de68ede9 100644 --- a/src/content/reference/en/p5/loadXML.mdx +++ b/src/content/reference/en/p5/loadXML.mdx @@ -9,7 +9,7 @@ description: >Extensible Markup Language - (XML) is a standard format for sending data between applications. Like HTML, the @@ -56,11 +56,11 @@ description: >
Note: Data can take time to load. Calling loadXML() within
- preload() ensures data loads before it's
+ preload() ensures data loads before it's
used in
- setup() or draw().
Resumes the draw loop after noLoop() has - been +
Resumes the draw loop after noLoop() + has been called.
-By default, draw() tries to run 60 times +
By default, draw() tries to run 60 times
per
- second. Calling noLoop() stops
+ second. Calling noLoop() stops
- draw() from repeating. The draw loop can be
+ draw() from repeating. The draw loop can be
restarted by calling loop().
The isLooping() function can be used +
The isLooping() function can be used
to check
whether a sketch is looping, as in isLooping() === true.
The less than operator << a=""> - - evaluates to true if the left value is less than - - the right value.
- -There - is more info on comparison operators on MDN.
-line: 158 -isConstructor: false -itemtype: property -alt: This example does not render anything -example: - - |- - -
- console.log(1 < 100); // prints true to the console
- console.log(100 < 99); // prints false to the console
-
- The less than or equal to operator <=< a=""> - - evaluates to true if the left value is less than or equal to - - the right value.
- -There - is more info on comparison operators on MDN.
-line: 179 -isConstructor: false -itemtype: property -alt: This example does not render anything -example: - - |- - -
- console.log(100 <= 100); // prints true to the console
- console.log(99 <= 100); // prints true to the console
-
- Use p5.Vector.mag() to calculate the +
Use p5.Vector.mag() to calculate + the magnitude of a p5.Vector object.
line: 481 diff --git a/src/content/reference/en/p5/matchAll.mdx b/src/content/reference/en/p5/matchAll.mdx index 67c307508d..a2428327e7 100644 --- a/src/content/reference/en/p5/matchAll.mdx +++ b/src/content/reference/en/p5/matchAll.mdx @@ -21,7 +21,7 @@ description: > for more information about regexes.matchAll() is different from
- match() because it returns every match, not
+ match() because it returns every match, not
just
the first.
diff --git a/src/content/reference/en/p5/metalness.mdx b/src/content/reference/en/p5/metalness.mdx
index d0b4bf6588..22cb01eca8 100644
--- a/src/content/reference/en/p5/metalness.mdx
+++ b/src/content/reference/en/p5/metalness.mdx
@@ -6,7 +6,7 @@ file: src/webgl/material.js
description: >
Sets the amount of "metalness" of a - specularMaterial().
+ specularMaterial().metalness() can make materials appear more metallic. It
affects the way
@@ -15,13 +15,13 @@ description: >
affects the way materials reflect light sources including
- directionalLight(),
+ directionalLight(),
- pointLight(),
+ pointLight(),
- spotLight(), and
+ spotLight(), and
- imageLight().
The parameter, metallic, is a number that sets the amount of
metalness.
diff --git a/src/content/reference/en/p5/millis.mdx b/src/content/reference/en/p5/millis.mdx
index 4e3f0516fc..f8f547ec50 100644
--- a/src/content/reference/en/p5/millis.mdx
+++ b/src/content/reference/en/p5/millis.mdx
@@ -14,16 +14,17 @@ description: >
If a sketch has a
- setup() function, then millis()
- begins tracking
+ setup() function, then
+ millis() begins tracking
- time before the code in setup() runs. If a
+ time before the code in setup() runs. If a
- sketch includes a preload() function, then
+ sketch includes a preload() function,
+ then
millis() begins tracking time as soon as the code in
- preload() starts running.
Note: model() can only be used in WebGL mode.
Note: Different browsers may track mouseButton differently.
See
- MDN
for more information.
The mouse system variables, such as mouseX and
+ href="/reference/p5/mouseX/">mouseX and
- mouseY, will be updated with their most
+ mouseY, will be updated with their most
recent
value when mouseClicked() is called by p5.js:
The parameter, event, is optional. mouseClicked()
is always passed a
- MouseEvent
object with properties that describe the mouse click event:
On touchscreen devices, mouseClicked() will run when a user’s
touch
- ends if touchEnded() isn’t declared. If
+ ends if touchEnded() isn’t declared.
+ If
- touchEnded() is declared, then
+ touchEnded() is declared, then
- touchEnded() will run when a user’s
+ touchEnded() will run when a user’s
touch
ends and mouseClicked() won’t.
return false; to the end of the function.
- Note: mousePressed(), +
Note: mousePressed(),
- mouseReleased(),
+ mouseReleased(),
and mouseClicked() are all related.
- mousePressed() runs as soon as the
+ mousePressed() runs as soon as the
user
- clicks the mouse. mouseReleased()
+ clicks the mouse. mouseReleased()
runs as
soon as the user releases the mouse click. mouseClicked() runs
immediately after mouseReleased().
The mouse system variables, such as mouseX and
+ href="/reference/p5/mouseX/">mouseX and
- mouseY, will be updated with their most
+ mouseY, will be updated with their most
recent
value when mouseDragged() is called by p5.js:
The parameter, event, is optional. mouseDragged()
is always passed a
- MouseEvent
object with properties that describe the mouse drag event:
On touchscreen devices, mouseDragged() will run when a user
moves a touch
- point if touchMoved() isn’t declared.
+ point if touchMoved() isn’t declared.
If
- touchMoved() is declared, then
+ touchMoved() is declared, then
- touchMoved() will run when a user moves
- a
+ touchMoved() will run when a user
+ moves a
touch point and mouseDragged() won’t.
The mouse system variables, such as mouseX and
+ href="/reference/p5/mouseX/">mouseX and
- mouseY, will be updated with their most
+ mouseY, will be updated with their most
recent
value when mouseMoved() is called by p5.js:
The parameter, event, is optional. mouseMoved()
is always passed a
- MouseEvent
object with properties that describe the mouse move event:
The mouse system variables, such as mouseX and
+ href="/reference/p5/mouseX/">mouseX and
- mouseY, will be updated with their most
+ mouseY, will be updated with their most
recent
value when mousePressed() is called by p5.js:
The parameter, event, is optional. mousePressed()
is always passed a
- MouseEvent
object with properties that describe the mouse press event:
On touchscreen devices, mousePressed() will run when a user’s
touch
- begins if touchStarted() isn’t
+ begins if touchStarted() isn’t
declared. If
- touchStarted() is declared, then
+ touchStarted() is declared, then
- touchStarted() will run when a user’s
- touch
+ touchStarted() will run when a
+ user’s touch
begins and mousePressed() won’t.
return false; to the end of the function.
Note: mousePressed(), mouseReleased(),
+ href="/reference/p5/mouseReleased/">mouseReleased(),
- and mouseClicked() are all related.
+ and mouseClicked() are all related.
mousePressed() runs as soon as the user clicks the mouse.
- mouseReleased() runs as soon as the
+ mouseReleased() runs as soon as the
user
releases the mouse click. mouseClicked()
+ href="/reference/p5/mouseClicked/">mouseClicked()
runs immediately after mouseReleased().
The mouse system variables, such as mouseX and
+ href="/reference/p5/mouseX/">mouseX and
- mouseY, will be updated with their most
+ mouseY, will be updated with their most
recent
value when mouseReleased() is called by p5.js:
The parameter, event, is optional.
mouseReleased() is always passed a
- MouseEvent
object with properties that describe the mouse release event:
On touchscreen devices, mouseReleased() will run when a user’s
touch
- ends if touchEnded() isn’t declared. If
+ ends if touchEnded() isn’t declared.
+ If
- touchEnded() is declared, then
+ touchEnded() is declared, then
- touchEnded() will run when a user’s
+ touchEnded() will run when a user’s
touch
ends and mouseReleased() won’t.
return false; to the end of the function.
- Note: mousePressed(), +
Note: mousePressed(),
mouseReleased(),
- and mouseClicked() are all related.
+ and mouseClicked() are all related.
- mousePressed() runs as soon as the
+ mousePressed() runs as soon as the
user
clicks the mouse. mouseReleased() runs as soon as the user
releases the
- mouse click. mouseClicked() runs
+ mouse click. mouseClicked() runs
immediately after mouseReleased().
The mouse system variables, such as mouseX and
+ href="/reference/p5/mouseX/">mouseX and
- mouseY, will be updated with their most
+ mouseY, will be updated with their most
recent
value when mouseWheel() is called by p5.js:
The parameter, event, is optional. mouseWheel()
is always passed a
- MouseEvent
object with properties that describe the mouse scroll event:
Note: movedX continues updating even when
- requestPointerLock() is
+ requestPointerLock() is
active.
Note: movedY continues updating even when
- requestPointerLock() is
+ requestPointerLock() is
active.
By default, a 100×100 pixels canvas is created without needing to call
- createCanvas().
+ createCanvas().
noCanvas() removes the
default canvas for sketches that don't need it.
Turns off debugMode() in a 3D +
Turns off debugMode() in a 3D sketch.
line: 725 isConstructor: false diff --git a/src/content/reference/en/p5/noErase.mdx b/src/content/reference/en/p5/noErase.mdx index cf1c3a8f21..6971b2da66 100644 --- a/src/content/reference/en/p5/noErase.mdx +++ b/src/content/reference/en/p5/noErase.mdx @@ -5,15 +5,15 @@ submodule: Setting file: src/color/setting.js description: >Ends erasing that was started with erase().
+ href="/reference/p5/erase/">erase(). -The fill(), stroke(), and - blendMode() settings will return to what - they + blendMode() settings will return to + what they - were prior to calling erase().
+ were prior to calling erase(). line: 1678 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/noFill.mdx b/src/content/reference/en/p5/noFill.mdx index 6602fa6436..ee74aeb3d0 100644 --- a/src/content/reference/en/p5/noFill.mdx +++ b/src/content/reference/en/p5/noFill.mdx @@ -10,7 +10,7 @@ description: > transparent, as infill(0, 0). If both noStroke() and
+ href="/reference/p5/noStroke/">noStroke() and
noFill() are called, nothing will be drawn to the screen.
line: 1219
diff --git a/src/content/reference/en/p5/noLights.mdx b/src/content/reference/en/p5/noLights.mdx
index c7329977e3..b095515753 100644
--- a/src/content/reference/en/p5/noLights.mdx
+++ b/src/content/reference/en/p5/noLights.mdx
@@ -8,15 +8,15 @@ description: >
Calling noLights() removes any lights created with
- lights(),
+ lights(),
- ambientLight(),
+ ambientLight(),
- directionalLight(),
+ directionalLight(),
- pointLight(), or
+ pointLight(), or
- spotLight(). These functions may be
+ spotLight(). These functions may be
called
after noLights() to create a new lighting scheme.
Stops the code in draw() from running +
Stops the code in draw() from running repeatedly.
-By default, draw() tries to run 60 times +
By default, draw() tries to run 60 times
per
second. Calling noLoop() stops draw() from
+ href="/reference/p5/draw/">draw() from
repeating. The draw loop can be restarted by calling
- loop(). draw() can be run
+ loop(). draw() can be run
- once by calling redraw().
The isLooping() function can be used +
The isLooping() function can be used
to check
whether a sketch is looping, as in isLooping() === true.
Draws certain features with jagged (aliased) edges.
-smooth() is active by default. In 2D +
smooth() is active by default. In 2D
mode,
noSmooth() is helpful for scaling up images without blurring. The
diff --git a/src/content/reference/en/p5/noStroke.mdx b/src/content/reference/en/p5/noStroke.mdx
index 01a45cd7ed..535e1c93e2 100644
--- a/src/content/reference/en/p5/noStroke.mdx
+++ b/src/content/reference/en/p5/noStroke.mdx
@@ -11,7 +11,7 @@ description: >
as in stroke(0, 0). If both noStroke() and
- noFill() are called, nothing will be drawn
+ noFill() are called, nothing will be drawn
to the
screen.
Removes the current tint set by tint().
+ href="/reference/p5/tint/">tint().noTint() restores images to their original colors.
Returns random numbers that can be tuned to feel organic.
-Values returned by random() and +
Values returned by random() and - randomGaussian() can change by + randomGaussian() can change by large amounts between function calls. By contrast, values returned by @@ -33,7 +33,7 @@ description: > results each time a sketch runs. The - noiseSeed() function can be used to + noiseSeed() function can be used to generate the same sequence of Perlin noise values each time a sketch runs.
@@ -45,7 +45,8 @@ description: > of noise values will be smoother when the input coordinates are closer. The - second way is to use the noiseDetail() + second way is to use the noiseDetail() function. diff --git a/src/content/reference/en/p5/noiseDetail.mdx b/src/content/reference/en/p5/noiseDetail.mdx index 68989ad080..8401965553 100644 --- a/src/content/reference/en/p5/noiseDetail.mdx +++ b/src/content/reference/en/p5/noiseDetail.mdx @@ -6,7 +6,7 @@ file: src/math/noise.js description: >Adjusts the character of the noise produced by the - noise() function.
+ noise() function.Perlin noise values are created by adding layers of noise together. The
@@ -25,7 +25,7 @@ description: >
example, calling noiseDetail(6, 0.25) ensures that
- noise() will use six octaves. Each higher
+ noise() will use six octaves. Each higher
octave
will contribute 25% as much (75% less) compared to its predecessor. Falloff
diff --git a/src/content/reference/en/p5/noiseSeed.mdx b/src/content/reference/en/p5/noiseSeed.mdx
index 278213c374..88e7f3429e 100644
--- a/src/content/reference/en/p5/noiseSeed.mdx
+++ b/src/content/reference/en/p5/noiseSeed.mdx
@@ -4,17 +4,17 @@ module: Math
submodule: Noise
file: src/math/noise.js
description: >
-
Sets the seed value for the noise() +
Sets the seed value for the noise() function.
-By default, noise() produces different +
By default, noise() produces different
results
each time a sketch is run. Calling noiseSeed() with a constant
argument,
such as noiseSeed(99), makes noise() produce the
+ href="/reference/p5/noise/">noise() produce the
same results each time a sketch is run.
Sets the normal vector for vertices in a custom 3D shape.
-3D shapes created with beginShape() +
3D shapes created with beginShape() and - endShape() are made by connecting sets of + endShape() are made by connecting sets + of points called vertices. Each vertex added with - vertex() has a normal vector that points + vertex() has a normal vector that points away from it. The normal vector controls how light reflects off the shape.
@@ -42,51 +43,54 @@ description: >normal() changes the normal vector of vertices added to a
custom shape
- with vertex(). normal() must
+ with vertex(). normal() must
be called between
- the beginShape() and
+ the beginShape() and
- endShape() functions, just like
+ endShape() functions, just like
- vertex(). The normal vector set by calling
+ vertex(). The normal vector set by calling
normal() will affect all following vertices until
normal() is called
again:
beginShape();
+
- // Set the vertex normal.
+ beginShape();
- normal(-0.4, -0.4, 0.8);
- // Add a vertex.
+ // Set the vertex normal.
- vertex(-30, -30, 0);
+ normal(-0.4, -0.4, 0.8);
- // Set the vertex normal.
+ // Add a vertex.
- normal(0, 0, 1);
+ vertex(-30, -30, 0);
- // Add vertices.
+ // Set the vertex normal.
+
+ normal(0, 0, 1);
+
+ // Add vertices.
vertex(30, -30, 0);
- vertex(30, 30, 0);
+ vertex(30, 30, 0);
- // Set the vertex normal.
+ // Set the vertex normal.
- normal(0.4, -0.4, 0.8);
+ normal(0.4, -0.4, 0.8);
- // Add a vertex.
+ // Add a vertex.
- vertex(-30, 30, 0);
+ vertex(-30, 30, 0);
- endShape();
- endShape(); +
line: 2066 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/number.mdx b/src/content/reference/en/p5/number.mdx index c74c2a98b3..182d86b505 100644 --- a/src/content/reference/en/p5/number.mdx +++ b/src/content/reference/en/p5/number.mdx @@ -99,7 +99,7 @@ description: >>, << code="">, >=, <=< code="">,
===, and !==. For example, a sketch's
- frameCount can be used as a
+ frameCount can be used as a
timer:
if (frameCount > 1000) {
@@ -124,7 +124,7 @@ description: >
2 <= 2="" true="" !="=" false="" <="" code=""/>See Boolean for more information about +
See Boolean for more information about comparisons and conditions.
Note: There are also == and != operators with one
@@ -143,7 +143,7 @@ description: >
The value NaN stands for
Not-A-Number.
NaN appears when calculations or conversions don't work.
diff --git a/src/content/reference/en/p5/orbitControl.mdx b/src/content/reference/en/p5/orbitControl.mdx
index 12c865e3f6..7493a568c4 100644
--- a/src/content/reference/en/p5/orbitControl.mdx
+++ b/src/content/reference/en/p5/orbitControl.mdx
@@ -10,8 +10,8 @@ description: >
3D sketches are viewed through an imaginary camera. Calling
- orbitControl() within the draw()
- function allows
+ orbitControl() within the draw() function allows
the user to change the camera’s position:
In WebGL mode, the default camera is a p5.Camera object that
can be
- controlled with the camera(),
+ controlled with the camera(),
- perspective(),
+ perspective(),
- ortho(), and
+ ortho(), and
- frustum() functions. Additional cameras
+ frustum() functions. Additional cameras
can be
- created with createCamera() and
+ created with createCamera() and
activated
- with setCamera().
Note: p5.Camera’s methods operate in two coordinate
systems:
instance of WebGL renderer
- type: RendererGL -example: - - |- - -
- let cam;
- let delta = 0.001;
-
- function setup() {
- createCanvas(100, 100, WEBGL);
-
- // Create a p5.Camera object.
- cam = createCamera();
-
- // Place the camera at the top-center.
- cam.setPosition(0, -400, 800);
-
- // Point the camera at the origin.
- cam.lookAt(0, 0, 0);
-
- describe(
- 'A white cube on a gray background. The cube goes in and out of view as the camera pans left and right.'
- );
- }
-
- function draw() {
- background(200);
-
- // Turn the camera left and right, called "panning".
- cam.pan(delta);
-
- // Switch directions every 120 frames.
- if (frameCount % 120 === 0) {
- delta *= -1;
- }
-
- // Draw the box.
- box();
- }
-
-
- // Double-click to toggle between cameras.
-
- let cam1;
- let cam2;
- let isDefaultCamera = true;
-
- function setup() {
- createCanvas(100, 100, WEBGL);
-
- // Create the first camera.
- // Keep its default settings.
- cam1 = createCamera();
-
- // Create the second camera.
- // Place it at the top-left.
- // Point it at the origin.
- cam2 = createCamera();
- cam2.setPosition(400, -400, 800);
- cam2.lookAt(0, 0, 0);
-
- // Set the current camera to cam1.
- setCamera(cam1);
-
- describe(
- 'A white cube on a gray background. The camera toggles between frontal and aerial views when the user double-clicks.'
- );
- }
-
- function draw() {
- background(200);
-
- // Draw the box.
- box();
- }
-
- // Toggle the current camera when the user double-clicks.
- function doubleClicked() {
- if (isDefaultCamera === true) {
- setCamera(cam2);
- isDefaultCamera = false;
- } else {
- setCamera(cam1);
- isDefaultCamera = true;
- }
- }
-
- Sets a perspective projection for the camera.
- -In a perspective projection, shapes that are further from the camera
- appear
-
- smaller than shapes that are near the camera. This technique, called
-
- foreshortening, creates realistic 3D scenes. It’s applied by default in
- new
-
- p5.Camera objects.
myCamera.perspective() changes the camera’s perspective by
- changing its
-
- viewing frustum. The frustum is the volume of space that’s visible to the
-
- camera. The frustum’s shape is a pyramid with its top cut off. The camera
-
- is placed where the top of the pyramid should be and points towards the
-
- base of the pyramid. It views everything within the frustum.
The first parameter, fovy, is the camera’s vertical field
- of view. It’s
-
- an angle that describes how tall or narrow a view the camera has. For
-
- example, calling myCamera.perspective(0.5) sets the camera’s
- vertical
-
- field of view to 0.5 radians. By default, fovy is calculated
- based on the
-
- sketch’s height and the camera’s default z-coordinate, which is 800. The
-
- formula for the default fovy is 2 * atan(height / 2 /
- 800).
The second parameter, aspect, is the camera’s aspect
- ratio. It’s a number
-
- that describes the ratio of the top plane’s width to its height. For
-
- example, calling myCamera.perspective(0.5, 1.5) sets the
- camera’s field
-
- of view to 0.5 radians and aspect ratio to 1.5, which would make shapes
-
- appear thinner on a square canvas. By default, aspect is set
- to
-
- width / height.
The third parameter, near, is the distance from the camera
- to the near
-
- plane. For example, calling myCamera.perspective(0.5, 1.5,
- 100) sets the
-
- camera’s field of view to 0.5 radians, its aspect ratio to 1.5, and places
-
- the near plane 100 pixels from the camera. Any shapes drawn less than 100
-
- pixels from the camera won’t be visible. By default, near is
- set to
-
- 0.1 * 800, which is 1/10th the default distance between the
- camera and
-
- the origin.
The fourth parameter, far, is the distance from the camera
- to the far
-
- plane. For example, calling myCamera.perspective(0.5, 1.5, 100,
- 10000)
-
- sets the camera’s field of view to 0.5 radians, its aspect ratio to 1.5,
-
- places the near plane 100 pixels from the camera, and places the far plane
-
- 10,000 pixels from the camera. Any shapes drawn more than 10,000 pixels
-
- from the camera won’t be visible. By default, far is set to
- 10 * 800,
-
- which is 10 times the default distance between the camera and the
- origin.
Sets an orthographic projection for the camera.
- -In an orthographic projection, shapes with the same size always appear - the - - same size, regardless of whether they are near or far from the camera.
- -myCamera.ortho() changes the camera’s perspective by
- changing its viewing
-
- frustum from a truncated pyramid to a rectangular prism. The frustum is
- the
-
- volume of space that’s visible to the camera. The camera is placed in
- front
-
- of the frustum and views everything within the frustum.
- myCamera.ortho()
-
- has six optional parameters to define the viewing frustum.
The first four parameters, left, right,
- bottom, and top, set the
-
- coordinates of the frustum’s sides, bottom, and top. For example, calling
-
- myCamera.ortho(-100, 100, 200, -200) creates a frustum that’s
- 200 pixels
-
- wide and 400 pixels tall. By default, these dimensions are set based on
-
- the sketch’s width and height, as in
-
- myCamera.ortho(-width / 2, width / 2, -height / 2, height /
- 2).
The last two parameters, near and far, set
- the distance of the
-
- frustum’s near and far plane from the camera. For example, calling
-
- myCamera.ortho(-100, 100, 200, -200, 50, 1000) creates a
- frustum that’s
-
- 200 pixels wide, 400 pixels tall, starts 50 pixels from the camera, and
-
- ends 1,000 pixels from the camera. By default, near and
- far are set to
-
- 0 and max(width, height) + 800, respectively.
Sets the camera's frustum.
- -In a frustum projection, shapes that are further from the camera appear - - smaller than shapes that are near the camera. This technique, called - - foreshortening, creates realistic 3D scenes.
- -myCamera.frustum() changes the camera’s perspective by
- changing its
-
- viewing frustum. The frustum is the volume of space that’s visible to the
-
- camera. The frustum’s shape is a pyramid with its top cut off. The camera
-
- is placed where the top of the pyramid should be and points towards the
-
- base of the pyramid. It views everything within the frustum.
The first four parameters, left, right,
- bottom, and top, set the
-
- coordinates of the frustum’s sides, bottom, and top. For example, calling
-
- myCamera.frustum(-100, 100, 200, -200) creates a frustum
- that’s 200
-
- pixels wide and 400 pixels tall. By default, these coordinates are set
-
- based on the sketch’s width and height, as in
-
- myCamera.frustum(-width / 20, width / 20, height / 20, -height /
- 20).
The last two parameters, near and far, set
- the distance of the
-
- frustum’s near and far plane from the camera. For example, calling
-
- myCamera.frustum(-100, 100, 200, -200, 50, 1000) creates a
- frustum that’s
-
- 200 pixels wide, 400 pixels tall, starts 50 pixels from the camera, and
- ends
-
- 1,000 pixels from the camera. By default, near is set to 0.1 *
- 800, which
-
- is 1/10th the default distance between the camera and the origin.
- far is
-
- set to 10 * 800, which is 10 times the default distance
- between the
-
- camera and the origin.
Rotates the camera in a clockwise/counter-clockwise direction.
- -Rolling rotates the camera without changing its orientation. The - rotation - - happens in the camera’s "local" space.
- -The parameter, angle, is the angle the camera should
- rotate. Passing a
-
- positive angle, as in myCamera.roll(0.001), rotates the
- camera in counter-clockwise direction.
-
- Passing a negative angle, as in myCamera.roll(-0.001),
- rotates the
-
- camera in clockwise direction.
Note: Angles are interpreted based on the current - - angleMode().
- path: p5.Camera/roll - pan: - description: > -Rotates the camera left and right.
- -Panning rotates the camera without changing its position. The rotation - - happens in the camera’s "local" space.
- -The parameter, angle, is the angle the camera should
- rotate. Passing a
-
- positive angle, as in myCamera.pan(0.001), rotates the camera
- to the
-
- right. Passing a negative angle, as in myCamera.pan(-0.001),
- rotates the
-
- camera to the left.
Note: Angles are interpreted based on the current - - angleMode().
- path: p5.Camera/pan - tilt: - description: > -Rotates the camera up and down.
- -Tilting rotates the camera without changing its position. The rotation - - happens in the camera’s "local" space.
- -The parameter, angle, is the angle the camera should
- rotate. Passing a
-
- positive angle, as in myCamera.tilt(0.001), rotates the
- camera down.
-
- Passing a negative angle, as in myCamera.tilt(-0.001),
- rotates the camera
-
- up.
Note: Angles are interpreted based on the current - - angleMode().
- path: p5.Camera/tilt - lookAt: - description: > -Points the camera at a location.
- -myCamera.lookAt() changes the camera’s orientation without
- changing its
-
- position.
The parameters, x, y, and z, are
- the coordinates in "world" space
-
- where the camera should point. For example, calling
-
- myCamera.lookAt(10, 20, 30) points the camera at the
- coordinates
-
- (10, 20, 30).
Sets the position and orientation of the camera.
- -myCamera.camera() allows objects to be viewed from
- different angles. It
-
- has nine parameters that are all optional.
The first three parameters, x, y, and
- z, are the coordinates of the
-
- camera’s position in "world" space. For example, calling
-
- myCamera.camera(0, 0, 0) places the camera at the origin
- (0, 0, 0). By
-
- default, the camera is placed at (0, 0, 800).
The next three parameters, centerX, centerY,
- and centerZ are the
-
- coordinates of the point where the camera faces in "world" space. For
-
- example, calling myCamera.camera(0, 0, 0, 10, 20, 30) places
- the camera
-
- at the origin (0, 0, 0) and points it at (10, 20,
- 30). By default, the
-
- camera points at the origin (0, 0, 0).
The last three parameters, upX, upY, and
- upZ are the components of
-
- the "up" vector in "local" space. The "up" vector orients the camera’s
-
- y-axis. For example, calling
-
- myCamera.camera(0, 0, 0, 10, 20, 30, 0, -1, 0) places the
- camera at the
-
- origin (0, 0, 0), points it at (10, 20, 30), and
- sets the "up" vector
-
- to (0, -1, 0) which is like holding it upside-down. By
- default, the "up"
-
- vector is (0, 1, 0).
Moves the camera along its "local" axes without changing its - orientation.
- -The parameters, x, y, and z, are
- the distances the camera should
-
- move. For example, calling myCamera.move(10, 20, 30) moves
- the camera 10
-
- pixels to the right, 20 pixels down, and 30 pixels backward in its "local"
-
- space.
Sets the camera’s position in "world" space without changing its - - orientation.
- -The parameters, x, y, and z, are
- the coordinates where the camera
-
- should be placed. For example, calling myCamera.setPosition(10, 20,
- 30)
-
- places the camera at coordinates (10, 20, 30) in "world"
- space.
Sets the camera’s position, orientation, and projection by copying - another - - camera.
- -The parameter, cam, is the p5.Camera object
- to copy. For example, calling
-
- cam2.set(cam1) will set cam2 using
- cam1’s configuration.
Sets the camera’s position and orientation to values that are - in-between - - those of two other cameras.
- -myCamera.slerp() uses spherical linear interpolation to
- calculate a
-
- position and orientation that’s in-between two other cameras. Doing so is
-
- helpful for transitioning smoothly between two perspectives.
The first two parameters, cam0 and cam1, are
- the p5.Camera objects
-
- that should be used to set the current camera.
The third parameter, amt, is the amount to interpolate
- between cam0 and
-
- cam1. 0.0 keeps the camera’s position and orientation equal
- to cam0’s,
-
- 0.5 sets them halfway between cam0’s and cam1’s
- , and 1.0 sets the
-
- position and orientation equal to cam1’s.
For example, calling myCamera.slerp(cam0, cam1, 0.1) sets
- cam’s position
-
- and orientation very close to cam0’s. Calling
-
- myCamera.slerp(cam0, cam1, 0.9) sets cam’s position and
- orientation very
-
- close to cam1’s.
Note: All of the cameras must use the same projection.
- path: p5.Camera/slerp -properties: - eyeX: - description: | -The camera’s y-coordinate.
-By default, the camera’s y-coordinate is set to 0 in "world" space.
- path: p5.Camera/eyeX - eyeY: - description: | -The camera’s y-coordinate.
-By default, the camera’s y-coordinate is set to 0 in "world" space.
- path: p5.Camera/eyeY - eyeZ: - description: > -The camera’s z-coordinate.
- -By default, the camera’s z-coordinate is set to 800 in "world" - space.
- path: p5.Camera/eyeZ - centerX: - description: > -The x-coordinate of the place where the camera looks.
- -By default, the camera looks at the origin (0, 0, 0) in
- "world" space, so
-
- myCamera.centerX is 0.
The y-coordinate of the place where the camera looks.
- -By default, the camera looks at the origin (0, 0, 0) in
- "world" space, so
-
- myCamera.centerY is 0.
The y-coordinate of the place where the camera looks.
- -By default, the camera looks at the origin (0, 0, 0) in
- "world" space, so
-
- myCamera.centerZ is 0.
The x-component of the camera's "up" vector.
- -The camera's "up" vector orients its y-axis. By default, the "up"
- vector is
-
- (0, 1, 0), so its x-component is 0 in "local" space.
The y-component of the camera's "up" vector.
- -The camera's "up" vector orients its y-axis. By default, the "up"
- vector is
-
- (0, 1, 0), so its y-component is 1 in "local" space.
The z-component of the camera's "up" vector.
- -The camera's "up" vector orients its y-axis. By default, the "up"
- vector is
-
- (0, 1, 0), so its z-component is 0 in "local" space.
Color is stored internally as an array of ideal RGBA values in floating @@ -28,7 +28,7 @@ description: > for performance. These values are normalized, floating-point numbers.
-Note: color() is the recommended way to +
Note: color() is the recommended way to create an instance of this class.
@@ -73,7 +73,7 @@ methods:Sets the red component of a color.
The range depends on the colorMode(). In the + href="/reference/p5/colorMode/">colorMode(). In the default RGB mode it's between 0 and 255.
path: p5.Color/setRed @@ -82,7 +82,7 @@ methods:Sets the green component of a color.
The range depends on the colorMode(). In the + href="/reference/p5/colorMode/">colorMode(). In the default RGB mode it's between 0 and 255.
path: p5.Color/setGreen @@ -91,7 +91,7 @@ methods:Sets the blue component of a color.
The range depends on the colorMode(). In the + href="/reference/p5/colorMode/">colorMode(). In the default RGB mode it's between 0 and 255.
path: p5.Color/setBlue @@ -101,8 +101,8 @@ methods:The range depends on the - colorMode(). In the default RGB mode - it's + colorMode(). In the default RGB + mode it's between 0 and 255.
path: p5.Color/setAlpha diff --git a/src/content/reference/en/p5/p5.Element.mdx b/src/content/reference/en/p5/p5.Element.mdx index 4acfd979f6..cf6506500d 100644 --- a/src/content/reference/en/p5/p5.Element.mdx +++ b/src/content/reference/en/p5/p5.Element.mdx @@ -7,7 +7,7 @@ description: >A class to describe an HTML element.
Sketches can use many elements. Common elements include the drawing canvas, @@ -17,10 +17,10 @@ description: >
All elements share the methods of the p5.Element class.
They're created
- with functions such as createCanvas()
- and
+ with functions such as createCanvas() and
- createButton().
Adds a class attribute to the element using a given string.
@@ -313,7 +313,7 @@ methods: the element's positioning + href="https://developer.mozilla.org/en-US/docs/Web/CSS/position/">positioning scheme.positionType is a string that can be either
@@ -332,7 +332,7 @@ methods:
description: >
Applies a style to the element by adding a - CSS declaration.
The first parameter, property, is a string. If the name of
@@ -502,7 +502,7 @@ methods:
parameter, event, that's a
DragEvent.
The - HTMLElement object's properties and methods can be used directly.
diff --git a/src/content/reference/en/p5/p5.File.mdx b/src/content/reference/en/p5/p5.File.mdx index 0631ce3d5c..a646dea98c 100644 --- a/src/content/reference/en/p5/p5.File.mdx +++ b/src/content/reference/en/p5/p5.File.mdx @@ -6,9 +6,9 @@ file: src/dom/dom.js description: |A class to describe a file.
p5.File objects are used by
- myElement.drop() and
+ myElement.drop() and
created by
- createFileInput.
Underlying
- File
object. All File properties and methods are accessible.
The file MIME type as a string.
@@ -124,7 +124,7 @@ properties:For example, a file with an 'image'
MIME type
may have a subtype such as png or jpeg.
The fourth parameter, fontSize, is optional. It sets the
@@ -78,7 +78,7 @@ methods:
determine the bounding box. By default, font.textBounds()
will use the
- current textSize().
The fourth parameter, fontSize, is optional. It sets the
@@ -108,7 +108,7 @@ methods:
size. By default, font.textToPoints() will use the current
- textSize().
The fifth parameter, options, is also optional.
font.textToPoints()
diff --git a/src/content/reference/en/p5/p5.Framebuffer.mdx b/src/content/reference/en/p5/p5.Framebuffer.mdx
index 04f32f7910..c453b206c5 100644
--- a/src/content/reference/en/p5/p5.Framebuffer.mdx
+++ b/src/content/reference/en/p5/p5.Framebuffer.mdx
@@ -24,23 +24,23 @@ description: >
between calls to
- myBuffer.begin() and
+ myBuffer.begin() and
- myBuffer.end(). The resulting
+ myBuffer.end(). The resulting
image
can be applied as a texture by passing the p5.Framebuffer object
to the
- texture() function, as in
+ texture() function, as in
texture(myBuffer).
It can also be displayed on the main canvas by passing it to the
- image() function, as in
+ image() function, as in
image(myBuffer, 0, 0).
Note: createFramebuffer() is +
Note: createFramebuffer() is the recommended way to create an instance of this class.
@@ -139,9 +139,9 @@ methods:Framebuffer cameras should be created between calls to - myBuffer.begin() and + myBuffer.begin() and - myBuffer.end() like so:
+ myBuffer.end() like so:let myCamera;
@@ -158,11 +158,11 @@ methods:
Calling setCamera() updates the +
Calling setCamera() updates the framebuffer's projection using the camera. - resetMatrix() must also be called + resetMatrix() must also be called for the view to change properly:
@@ -223,14 +223,14 @@ methods:Begins drawing shapes to the framebuffer.
myBuffer.begin() and myBuffer.end()
+ href="/reference/p5.Framebuffer/end/">myBuffer.end()
allow shapes to be drawn to the framebuffer. myBuffer.begin()
begins
drawing to the framebuffer and
- myBuffer.end() stops drawing
+ myBuffer.end() stops drawing
to the
framebuffer. Changes won't be visible until the framebuffer is displayed
@@ -241,12 +241,12 @@ methods:
description: >
Stops drawing shapes to the framebuffer.
-myBuffer.begin() and +
myBuffer.begin() and
myBuffer.end()
allow shapes to be drawn to the framebuffer.
- myBuffer.begin() begins
+ myBuffer.begin() begins
drawing to
the framebuffer and myBuffer.end() stops drawing to the
@@ -285,12 +285,12 @@ methods:
description: >
Loads the current value of each pixel in the framebuffer into its - pixels array.
+ pixels array.myBuffer.loadPixels() must be called before reading from
or writing to
- myBuffer.pixels.
myBuffer.get() is easy to use but it's not as fast as
- myBuffer.pixels. Use
+ myBuffer.pixels. Use
- myBuffer.pixels to read
+ myBuffer.pixels to read
many pixel
values.
Updates the framebuffer with the RGBA values in the - pixels array.
+ pixels array.myBuffer.updatePixels() only needs to be called after
changing values
- in the myBuffer.pixels
+ in the myBuffer.pixels
array. Such
changes can be made directly after calling
myBuffer.loadPixels().
An array containing the color of each pixel in the framebuffer.
myBuffer.loadPixels() must
- be
+ href="/reference/p5.Framebuffer/loadPixels/">myBuffer.loadPixels()
+ must be
called before accessing the myBuffer.pixels array.
myBuffer.updatePixels()
+ href="/reference/p5.Framebuffer/updatePixels/">myBuffer.updatePixels()
must be called after any changes are made.
Each framebuffer uses a
- WebGLTexture
object internally to store its color data. The myBuffer.color
@@ -409,7 +409,7 @@ properties:
Each framebuffer uses a
- WebGLTexture
object internally to store its depth data. The myBuffer.depth
diff --git a/src/content/reference/en/p5/p5.Geometry.mdx b/src/content/reference/en/p5/p5.Geometry.mdx
index 4bdee373a3..59c0c10a73 100644
--- a/src/content/reference/en/p5/p5.Geometry.mdx
+++ b/src/content/reference/en/p5/p5.Geometry.mdx
@@ -337,11 +337,11 @@ methods:
vertices or the entire shape. When a geometry has internal colors,
- fill() has no effect. Calling
+ fill() has no effect. Calling
myGeometry.clearColors() allows the
- fill() function to apply color to the
+ fill() function to apply color to the
geometry.
Flips the geometry’s texture u-coordinates.
-In order for texture() to work, the - geometry +
In order for texture() to work,
+ the geometry
needs a way to map the points on its surface to the pixels in a
rectangular
@@ -395,7 +395,7 @@ methods:
(x, y, z) maps to the texture image's pixel at coordinates
(u, v).
The myGeometry.uvs array +
The myGeometry.uvs array
stores the
(u, v) coordinates for each vertex in the order it was added
@@ -445,8 +445,8 @@ methods:
description: >
Flips the geometry’s texture v-coordinates.
-In order for texture() to work, the - geometry +
In order for texture() to work,
+ the geometry
needs a way to map the points on its surface to the pixels in a
rectangular
@@ -456,7 +456,7 @@ methods:
(x, y, z) maps to the texture image's pixel at coordinates
(u, v).
The myGeometry.uvs array +
The myGeometry.uvs array
stores the
(u, v) coordinates for each vertex in the order it was added
@@ -522,7 +522,7 @@ methods:
href="/reference/p5/p5.Vector">p5.Vector
objects in the myGeometry.vertices
+ href="/reference/p5.Geometry/vertices/">myGeometry.vertices
array. The geometry's first vertex is the
@@ -536,15 +536,15 @@ methods:
Calling myGeometry.computeFaces() fills the
- myGeometry.faces array with
+ myGeometry.faces array with
three-element
arrays that list the vertices that form each face. For example, a geometry
made from a rectangle has two faces because a rectangle is made by joining
- two triangles. myGeometry.faces
- for a
+ two triangles. myGeometry.faces for a
rectangle would be the two-dimensional array
@@ -603,7 +603,7 @@ methods:
the
myGeometry.vertexNormals
+ href="/reference/p5.Geometry/vertexNormals/">myGeometry.vertexNormals
array.
The first parameter, shadingType, is optional. Passing the
@@ -654,7 +654,7 @@ methods:
Note: myGeometry.normalize() only works when called in the
- setup() function.
In order for texture() to work, the - geometry +
In order for texture() to work,
+ the geometry
needs a way to map the points on its surface to the pixels in a
diff --git a/src/content/reference/en/p5/p5.Graphics.mdx b/src/content/reference/en/p5/p5.Graphics.mdx
index 3ee5acc8b9..611b26bec4 100644
--- a/src/content/reference/en/p5/p5.Graphics.mdx
+++ b/src/content/reference/en/p5/p5.Graphics.mdx
@@ -27,10 +27,10 @@ description: >
main canvas by passing the p5.Graphics object to the
- image() function, as in
+ image() function, as in
image(myGraphics, 0, 0).
Note: createGraphics() is the +
Note: createGraphics() is the recommended way to create an instance of this class.
@@ -127,7 +127,7 @@ methods:By default, the main canvas resets certain transformation and lighting
- values each time draw() executes.
+ values each time draw() executes.
p5.Graphics
objects must reset these values manually by calling
@@ -221,7 +221,7 @@ methods:
true, as in { antialias: true }, 2 samples will
be used by default. The number of samples can also be set, as in {
antialias: 4 }. Default is to match setAttributes() which is
+ href="/reference/p5/setAttributes/">setAttributes()
false (true in Safari).width: width of the
Existing images can be loaded by calling
- loadImage(). Blank images can be created
- by
+ loadImage(). Blank images can be
+ created by
- calling createImage().
+ calling createImage().
p5.Image objects
have methods for common tasks such as applying filters and modifying
@@ -130,20 +130,20 @@ methods:
description: >
Updates the canvas with the RGBA values in the - img.pixels array.
+ img.pixels array.img.updatePixels() only needs to be called after changing
values in
- the img.pixels array. Such
+ the img.pixels array. Such
changes can be
made directly after calling
- img.loadPixels() or by
+ img.loadPixels() or by
calling
- img.set().
The optional parameters x, y,
width, and height define a
@@ -163,9 +163,9 @@ methods:
img.get() is easy to use but it's not as fast as
- img.pixels. Use
+ img.pixels. Use
- img.pixels to read many pixel
+ img.pixels to read many pixel
values.
The version of img.get() with no parameters returns the
@@ -191,7 +191,7 @@ methods:
canvas in a new p5.Image object.
Use img.get() instead of get() to work directly
+ href="/reference/p5/get/">get() to work directly
with images.
img.set() is easy to use but it's not as fast as
- img.pixels. Use
+ img.pixels. Use
- img.pixels to set many pixel
+ img.pixels to set many pixel
values.
img.set() interprets the first two parameters as x- and
@@ -216,7 +216,7 @@ methods:
p5.Image object.
img.updatePixels() must +
img.updatePixels() must
be called
after using img.set() for changes to appear.
The image will only be downloaded as an animated GIF if it was loaded - from a GIF file. See saveGif() to + from a GIF file. See saveGif() to create new GIFs.
@@ -432,13 +432,13 @@ methods: play: description: |Plays an animated GIF that was paused with - img.pause().
+ img.pause(). path: p5.Image/play pause: description: |Pauses an animated GIF.
The GIF can be resumed by calling - img.play().
+ img.play(). path: p5.Image/pause delay: description: > @@ -499,12 +499,12 @@ properties: math as shown in the examples below. The - img.loadPixels() + img.loadPixels() method must be called before accessing theimg.pixels array.
The
- img.updatePixels() method
+ img.updatePixels() method
must be
called after any changes are made.
diff --git a/src/content/reference/en/p5/p5.MediaElement.mdx b/src/content/reference/en/p5/p5.MediaElement.mdx
index 9197fc4100..24bff012c3 100644
--- a/src/content/reference/en/p5/p5.MediaElement.mdx
+++ b/src/content/reference/en/p5/p5.MediaElement.mdx
@@ -12,11 +12,11 @@ description: >
methods to handle audio and video. p5.MediaElement objects are
created by
- calling createVideo,
+ calling createVideo,
- createAudio, and
+ createAudio, and
- createCapture.
+ createCapture.
line: 4081
isConstructor: true
params:
@@ -190,7 +190,7 @@ methods:
Show the default HTMLMediaElement controls.
@@ -202,7 +202,7 @@ methods:Hide the default HTMLMediaElement controls.
diff --git a/src/content/reference/en/p5/p5.PrintWriter.mdx b/src/content/reference/en/p5/p5.PrintWriter.mdx index 0352970df9..8f9a959340 100644 --- a/src/content/reference/en/p5/p5.PrintWriter.mdx +++ b/src/content/reference/en/p5/p5.PrintWriter.mdx @@ -14,14 +14,14 @@ description: > object that enables precise control of text output. Functions such as - saveStrings() and + saveStrings() and - saveJSON() are easier to use for simple + saveJSON() are easier to use for simple file saving. -Note: createWriter() is the +
Note: createWriter() is the recommended way to make an instance of this class.
diff --git a/src/content/reference/en/p5/p5.Shader.mdx b/src/content/reference/en/p5/p5.Shader.mdx index 4cbd531e02..f9e44e6f3f 100644 --- a/src/content/reference/en/p5/p5.Shader.mdx +++ b/src/content/reference/en/p5/p5.Shader.mdx @@ -16,7 +16,7 @@ description: > language called GLSL and run along with the rest of the code in a sketch. @@ -28,15 +28,15 @@ description: > and the fragment shader affects color. Once thep5.Shader object
is
- created, it can be used with the shader()
+ created, it can be used with the shader()
function, as in shader(myShader).
- Note: createShader(), +
Note: createShader(), - createFilterShader(), and + createFilterShader(), and - loadShader() are the recommended ways + loadShader() are the recommended ways to create an instance of this class.
@@ -150,8 +150,8 @@ methods:Each p5.Shader object must be compiled by calling
- shader() before it can run. Compilation
- happens
+ shader() before it can run.
+ Compilation happens
in a drawing context which is usually the main canvas or an instance of
@@ -184,18 +184,18 @@ methods:
Note: A p5.Shader object created with - createShader(), + createShader(), - createFilterShader(), or + createFilterShader(), or - loadShader() + loadShader() can be used directly with a p5.Framebuffer object created with - createFramebuffer(). Both + createFramebuffer(). Both objects have the same context as the main canvas.
diff --git a/src/content/reference/en/p5/p5.Table.mdx b/src/content/reference/en/p5/p5.Table.mdx index ef98e1fbcb..de3249441e 100644 --- a/src/content/reference/en/p5/p5.Table.mdx +++ b/src/content/reference/en/p5/p5.Table.mdx @@ -21,7 +21,7 @@ params: methods: addRow: description: > -Use addRow() to add a new row of +
Use addRow() to add a new row of data to a p5.Table object. By default, @@ -30,7 +30,7 @@ methods: the new row in a TableRow object (see newRow in the example above), and then set individual values using set().
+ href="/reference/p5/set/">set().If a p5.TableRow object is included as a parameter, then that row is @@ -96,7 +96,7 @@ methods: path: p5.Table/clearRows addColumn: description: > -
Use addColumn() to add a new +
Use addColumn() to add a new column to a Table object. Typically, you will want to specify a title, so the column @@ -129,7 +129,7 @@ methods: path: p5.Table/trim removeColumn: description: > -
Use removeColumn() to remove +
Use removeColumn() to remove an existing column from a Table object. The column to be removed may be identified by either @@ -201,7 +201,7 @@ properties: href="/reference/p5/p5.Table">p5.TableRow objects that make up the rows of the table. The same result as calling getRows()
+ href="/reference/p5/getRows/">getRows() path: p5.Table/rows chainable: false --- diff --git a/src/content/reference/en/p5/p5.Vector.mdx b/src/content/reference/en/p5/p5.Vector.mdx index bb27e58736..ab30bf9453 100644 --- a/src/content/reference/en/p5/p5.Vector.mdx +++ b/src/content/reference/en/p5/p5.Vector.mdx @@ -30,7 +30,7 @@ description: > methods inside thep5.Vector class.
- Note: createVector() is the +
Note: createVector() is the recommended way to make an instance of this class.
@@ -314,8 +314,8 @@ methods: description: >Calculates the magnitude (length) of the vector.
-Use mag() to calculate the magnitude of - a 2D vector +
Use mag() to calculate the magnitude
+ of a 2D vector
using components as in mag(x, y).
v1.dist(v2).
- Use dist() to calculate the distance +
Use dist() to calculate the distance
between points
using coordinates as in dist(x1, y1, x2, y2).
If the vector was created with
- createVector(),
+ createVector(),
heading() returns angles
in the units of the current angleMode().
The static version of heading(), as in
p5.Vector.heading(v), works the
@@ -462,11 +462,11 @@ methods:
If the vector was created with
- createVector(),
+ createVector(),
setHeading() uses
the units of the current angleMode().
If the vector was created with
- createVector(),
+ createVector(),
rotate() uses
the units of the current angleMode().
The static version of rotate(), as in
p5.Vector.rotate(v, PI),
@@ -503,12 +503,12 @@ methods:
If the vector was created with
- createVector(),
+ createVector(),
angleBetween() returns
angles in the units of the current
- angleMode().
slerp() differs from lerp() because
+ href="/reference/p5.Vector/lerp/">lerp() because
it interpolates magnitude. Calling v0.slerp(v1, 0.5) sets
v0's
@@ -648,7 +648,7 @@ methods:
easier
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON
+ href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON/">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON path: p5.Vector/clampToZero properties: x: diff --git a/src/content/reference/en/p5/p5.XML.mdx b/src/content/reference/en/p5/p5.XML.mdx index efcb3b0196..bfa3c0c7e7 100644 --- a/src/content/reference/en/p5/p5.XML.mdx +++ b/src/content/reference/en/p5/p5.XML.mdx @@ -11,7 +11,7 @@ description: > Extensible Markup Language - (XML) is a standard format for sending data between applications. Like HTML, the @@ -20,7 +20,7 @@ description: >Note: Use loadXML() to load external +
Note: Use loadXML() to load external XML files.
line: 9 isConstructor: true @@ -184,9 +184,9 @@ methods:Note: Use - myXML.getString() or + myXML.getString() or - myXML.getNum() to return an + myXML.getNum() to return an attribute's value.
path: p5.XML/listAttributes hasAttribute: @@ -201,9 +201,9 @@ methods:Note: Use - myXML.getString() or + myXML.getString() or - myXML.getNum() to return an + myXML.getNum() to return an attribute's value.
path: p5.XML/hasAttribute getNum: @@ -228,9 +228,9 @@ methods:Note: Use - myXML.getString() or + myXML.getString() or - myXML.getNum() to return an + myXML.getNum() to return an attribute's value.
path: p5.XML/getNum getString: @@ -255,9 +255,9 @@ methods:Note: Use - myXML.getString() or + myXML.getString() or - myXML.getNum() to return an + myXML.getNum() to return an attribute's value.
path: p5.XML/getString setAttribute: diff --git a/src/content/reference/en/p5/p5.mdx b/src/content/reference/en/p5/p5.mdx index d68fad32f7..5dc691ba37 100644 --- a/src/content/reference/en/p5/p5.mdx +++ b/src/content/reference/en/p5/p5.mdx @@ -15,11 +15,11 @@ description: > to a node. The sketch closure takes the newly created p5 instance as its sole argument and may optionally set preload(), + href="/reference/p5/preload/">preload(), - setup(), and/or + setup(), and/or - draw() properties on it for running a + draw() properties on it for running a sketch.A p5 sketch can run in "global" or "instance" mode: diff --git a/src/content/reference/en/p5/pRotationX.mdx b/src/content/reference/en/p5/pRotationX.mdx index cc54916e44..3d73a4d59b 100644 --- a/src/content/reference/en/p5/pRotationX.mdx +++ b/src/content/reference/en/p5/pRotationX.mdx @@ -8,7 +8,7 @@ description: > device along the x axis in the frame previous to the current frame. - If the sketch angleMode() is set to + If the sketch angleMode() is set to DEGREES, the value will be -180 to 180. If it is set to RADIANS, the value will diff --git a/src/content/reference/en/p5/pRotationY.mdx b/src/content/reference/en/p5/pRotationY.mdx index d06deeb095..a8a67df6c7 100644 --- a/src/content/reference/en/p5/pRotationY.mdx +++ b/src/content/reference/en/p5/pRotationY.mdx @@ -8,7 +8,7 @@ description: > device along the y axis in the frame previous to the current frame. - If the sketch angleMode() is set to + If the sketch angleMode() is set to DEGREES, the value will be -90 to 90. If it is set to RADIANS, the value will diff --git a/src/content/reference/en/p5/pRotationZ.mdx b/src/content/reference/en/p5/pRotationZ.mdx index 390ffc5a80..6751e5b90e 100644 --- a/src/content/reference/en/p5/pRotationZ.mdx +++ b/src/content/reference/en/p5/pRotationZ.mdx @@ -8,7 +8,7 @@ description: > device along the z axis in the frame previous to the current frame. - If the sketch angleMode() is set to + If the sketch angleMode() is set to DEGREES, the value will be 0 to 360. If it is set to RADIANS, the value will diff --git a/src/content/reference/en/p5/panorama.mdx b/src/content/reference/en/p5/panorama.mdx index d0af848555..d7aaf2d9d7 100644 --- a/src/content/reference/en/p5/panorama.mdx +++ b/src/content/reference/en/p5/panorama.mdx @@ -13,9 +13,9 @@ description: > space requires changing the camera's perspective with functions such as - orbitControl() or + orbitControl() or - camera().
+ camera(). line: 1020 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/pixels.mdx b/src/content/reference/en/p5/pixels.mdx index 24fb573138..e10644dcc1 100644 --- a/src/content/reference/en/p5/pixels.mdx +++ b/src/content/reference/en/p5/pixels.mdx @@ -29,12 +29,12 @@ description: >Some displays use several smaller pixels to set the color at a single
- point. The pixelDensity() function
+ point. The pixelDensity() function
returns
the pixel density of the canvas. High density displays often have a
- pixelDensity() of 2. On such a
+ pixelDensity() of 2. On such a
display, the
pixels array for a 100×100 canvas has 200 × 200 × 4 =
@@ -43,12 +43,12 @@ description: >
Accessing the RGBA values for a point on the canvas requires a little math
- as shown below. The loadPixels()
+ as shown below. The loadPixels()
function
must be called before accessing the pixels array. The
- updatePixels() function must be
+ updatePixels() function must be
called
after any changes are made.
Note: pmouseX is reset to the current mouseX
+ href="/reference/p5/mouseX/">mouseX
value at the start of each touch event.
Note: pmouseY is reset to the current mouseY
+ href="/reference/p5/mouseY/">mouseY
value at the start of each touch event.
A point's default width is one pixel. To color a point, use the - stroke() function. To change its width, use - the + stroke() function. To change its width, + use the - strokeWeight() function. A point + strokeWeight() function. A point - can't be filled, so the fill() function won't + can't be filled, so the fill() function + won't affect the point's color.
@@ -30,7 +31,7 @@ description: > Doing so requires adding theWEBGL argument to
- createCanvas().
+ createCanvas().
The version of point() with one parameter allows the point's
location to
diff --git a/src/content/reference/en/p5/pointLight.mdx b/src/content/reference/en/p5/pointLight.mdx
index 6b5d6faba2..d78ce3abd4 100644
--- a/src/content/reference/en/p5/pointLight.mdx
+++ b/src/content/reference/en/p5/pointLight.mdx
@@ -23,7 +23,7 @@ description: >
parameters, v1, v2, and v3, set the
light’s color using the current
- colorMode(). The last three parameters,
+ colorMode(). The last three parameters,
x,
y, and z, set the light’s position. For example,
@@ -39,7 +39,7 @@ description: >
parameters, v1, v2, and v3, set the
light’s color using the current
- colorMode(). The last parameter,
+ colorMode(). The last parameter,
position sets
the light’s position using a p5.Vector
diff --git a/src/content/reference/en/p5/pop.mdx b/src/content/reference/en/p5/pop.mdx
index 754af1c37a..367998f3b6 100644
--- a/src/content/reference/en/p5/pop.mdx
+++ b/src/content/reference/en/p5/pop.mdx
@@ -3,7 +3,7 @@ title: pop
module: Structure
submodule: Structure
file: src/core/structure.js
-description: "
Ends a drawing group that contains its own styles and transformations.
\nBy default, styles such as fill() and\ntransformations such as rotate() are applied to\nall drawing that follows. The push() and pop()\nfunctions can limit the effect of styles and transformations to a specific\ngroup of shapes, images, and text. For example, a group of shapes could be\ntranslated to follow the mouse without affecting the rest of the sketch:
// Begin the drawing group.\npush();\n\n// Translate the origin to the mouse's position.\ntranslate(mouseX, mouseY);\n\n// Style the face.\nnoStroke();\nfill('green');\n\n// Draw the face.\ncircle(0, 0, 60);\n\n// Style the eyes.\nfill('white');\n\n// Draw the left eye.\nellipse(-20, -20, 30, 20);\n\n// Draw the right eye.\nellipse(20, -20, 30, 20);\n\n// End the drawing group.\npop();\n\n// Draw a bug.\nlet x = random(0, 100);\nlet y = random(0, 100);\ntext('\U0001F99F', x, y);\nIn the code snippet above, the bug's position isn't affected by\ntranslate(mouseX, mouseY) because that transformation is contained\nbetween push() and pop(). The bug moves around\nthe entire canvas as expected.
Note: push() and pop() are always called as a\npair. Both functions are required to begin and end a drawing group.
push() and pop() can also be nested to create\nsubgroups. For example, the code snippet above could be changed to give\nmore detail to the frog’s eyes:
// Begin the drawing group.\npush();\n\n// Translate the origin to the mouse's position.\ntranslate(mouseX, mouseY);\n\n// Style the face.\nnoStroke();\nfill('green');\n\n// Draw a face.\ncircle(0, 0, 60);\n\n// Style the eyes.\nfill('white');\n\n// Draw the left eye.\npush();\ntranslate(-20, -20);\nellipse(0, 0, 30, 20);\nfill('black');\ncircle(0, 0, 8);\npop();\n\n// Draw the right eye.\npush();\ntranslate(20, -20);\nellipse(0, 0, 30, 20);\nfill('black');\ncircle(0, 0, 8);\npop();\n\n// End the drawing group.\npop();\n\n// Draw a bug.\nlet x = random(0, 100);\nlet y = random(0, 100);\ntext('\U0001F99F', x, y);\nIn this version, the code to draw each eye is contained between its own\npush() and pop() functions. Doing so makes it\neasier to add details in the correct part of a drawing.
push() and pop() contain the effects of the\nfollowing functions:
In WebGL mode, push() and pop() contain the\neffects of a few additional styles:
Ends a drawing group that contains its own styles and transformations.
\nBy default, styles such as fill() and\ntransformations such as rotate() are applied to\nall drawing that follows. The push() and pop()\nfunctions can limit the effect of styles and transformations to a specific\ngroup of shapes, images, and text. For example, a group of shapes could be\ntranslated to follow the mouse without affecting the rest of the sketch:
// Begin the drawing group.\npush();\n\n// Translate the origin to the mouse's position.\ntranslate(mouseX, mouseY);\n\n// Style the face.\nnoStroke();\nfill('green');\n\n// Draw the face.\ncircle(0, 0, 60);\n\n// Style the eyes.\nfill('white');\n\n// Draw the left eye.\nellipse(-20, -20, 30, 20);\n\n// Draw the right eye.\nellipse(20, -20, 30, 20);\n\n// End the drawing group.\npop();\n\n// Draw a bug.\nlet x = random(0, 100);\nlet y = random(0, 100);\ntext('\U0001F99F', x, y);\nIn the code snippet above, the bug's position isn't affected by\ntranslate(mouseX, mouseY) because that transformation is contained\nbetween push() and pop(). The bug moves around\nthe entire canvas as expected.
Note: push() and pop() are always called as a\npair. Both functions are required to begin and end a drawing group.
push() and pop() can also be nested to create\nsubgroups. For example, the code snippet above could be changed to give\nmore detail to the frog’s eyes:
// Begin the drawing group.\npush();\n\n// Translate the origin to the mouse's position.\ntranslate(mouseX, mouseY);\n\n// Style the face.\nnoStroke();\nfill('green');\n\n// Draw a face.\ncircle(0, 0, 60);\n\n// Style the eyes.\nfill('white');\n\n// Draw the left eye.\npush();\ntranslate(-20, -20);\nellipse(0, 0, 30, 20);\nfill('black');\ncircle(0, 0, 8);\npop();\n\n// Draw the right eye.\npush();\ntranslate(20, -20);\nellipse(0, 0, 30, 20);\nfill('black');\ncircle(0, 0, 8);\npop();\n\n// End the drawing group.\npop();\n\n// Draw a bug.\nlet x = random(0, 100);\nlet y = random(0, 100);\ntext('\U0001F99F', x, y);\nIn this version, the code to draw each eye is contained between its own\npush() and pop() functions. Doing so makes it\neasier to add details in the correct part of a drawing.
push() and pop() contain the effects of the\nfollowing functions:
In WebGL mode, push() and pop() contain the\neffects of a few additional styles:
Declaring the function preload() sets a code block to run once
- automatically before setup() or
+ automatically before setup() or
- draw(). It's used to load assets including
+ draw(). It's used to load assets including
multimedia files, fonts, data, and 3D models:
Functions such as loadImage(), +
Functions such as loadImage(),
- loadFont(),
+ loadFont(),
- loadJSON(), and
+ loadJSON(), and
- loadModel() are guaranteed to either
+ loadModel() are guaranteed to either
finish loading or raise an error if they're called within
preload().
diff --git a/src/content/reference/en/p5/push.mdx b/src/content/reference/en/p5/push.mdx
index ee68a2c784..cfaf3defa7 100644
--- a/src/content/reference/en/p5/push.mdx
+++ b/src/content/reference/en/p5/push.mdx
@@ -3,7 +3,7 @@ title: push
module: Structure
submodule: Structure
file: src/core/structure.js
-description: "
Begins a drawing group that contains its own styles and transformations.
\nBy default, styles such as fill() and\ntransformations such as rotate() are applied to\nall drawing that follows. The push() and pop()\nfunctions can limit the effect of styles and transformations to a specific\ngroup of shapes, images, and text. For example, a group of shapes could be\ntranslated to follow the mouse without affecting the rest of the sketch:
// Begin the drawing group.\npush();\n\n// Translate the origin to the mouse's position.\ntranslate(mouseX, mouseY);\n\n// Style the face.\nnoStroke();\nfill('green');\n\n// Draw the face.\ncircle(0, 0, 60);\n\n// Style the eyes.\nfill('white');\n\n// Draw the left eye.\nellipse(-20, -20, 30, 20);\n\n// Draw the right eye.\nellipse(20, -20, 30, 20);\n\n// End the drawing group.\npop();\n\n// Draw a bug.\nlet x = random(0, 100);\nlet y = random(0, 100);\ntext('\U0001F99F', x, y);\nIn the code snippet above, the bug's position isn't affected by\ntranslate(mouseX, mouseY) because that transformation is contained\nbetween push() and pop(). The bug moves around\nthe entire canvas as expected.
Note: push() and pop() are always called as a\npair. Both functions are required to begin and end a drawing group.
push() and pop() can also be nested to create\nsubgroups. For example, the code snippet above could be changed to give\nmore detail to the frog’s eyes:
// Begin the drawing group.\npush();\n\n// Translate the origin to the mouse's position.\ntranslate(mouseX, mouseY);\n\n// Style the face.\nnoStroke();\nfill('green');\n\n// Draw a face.\ncircle(0, 0, 60);\n\n// Style the eyes.\nfill('white');\n\n// Draw the left eye.\npush();\ntranslate(-20, -20);\nellipse(0, 0, 30, 20);\nfill('black');\ncircle(0, 0, 8);\npop();\n\n// Draw the right eye.\npush();\ntranslate(20, -20);\nellipse(0, 0, 30, 20);\nfill('black');\ncircle(0, 0, 8);\npop();\n\n// End the drawing group.\npop();\n\n// Draw a bug.\nlet x = random(0, 100);\nlet y = random(0, 100);\ntext('\U0001F99F', x, y);\nIn this version, the code to draw each eye is contained between its own\npush() and pop() functions. Doing so makes it\neasier to add details in the correct part of a drawing.
push() and pop() contain the effects of the\nfollowing functions:
In WebGL mode, push() and pop() contain the\neffects of a few additional styles:
Begins a drawing group that contains its own styles and transformations.
\nBy default, styles such as fill() and\ntransformations such as rotate() are applied to\nall drawing that follows. The push() and pop()\nfunctions can limit the effect of styles and transformations to a specific\ngroup of shapes, images, and text. For example, a group of shapes could be\ntranslated to follow the mouse without affecting the rest of the sketch:
// Begin the drawing group.\npush();\n\n// Translate the origin to the mouse's position.\ntranslate(mouseX, mouseY);\n\n// Style the face.\nnoStroke();\nfill('green');\n\n// Draw the face.\ncircle(0, 0, 60);\n\n// Style the eyes.\nfill('white');\n\n// Draw the left eye.\nellipse(-20, -20, 30, 20);\n\n// Draw the right eye.\nellipse(20, -20, 30, 20);\n\n// End the drawing group.\npop();\n\n// Draw a bug.\nlet x = random(0, 100);\nlet y = random(0, 100);\ntext('\U0001F99F', x, y);\nIn the code snippet above, the bug's position isn't affected by\ntranslate(mouseX, mouseY) because that transformation is contained\nbetween push() and pop(). The bug moves around\nthe entire canvas as expected.
Note: push() and pop() are always called as a\npair. Both functions are required to begin and end a drawing group.
push() and pop() can also be nested to create\nsubgroups. For example, the code snippet above could be changed to give\nmore detail to the frog’s eyes:
// Begin the drawing group.\npush();\n\n// Translate the origin to the mouse's position.\ntranslate(mouseX, mouseY);\n\n// Style the face.\nnoStroke();\nfill('green');\n\n// Draw a face.\ncircle(0, 0, 60);\n\n// Style the eyes.\nfill('white');\n\n// Draw the left eye.\npush();\ntranslate(-20, -20);\nellipse(0, 0, 30, 20);\nfill('black');\ncircle(0, 0, 8);\npop();\n\n// Draw the right eye.\npush();\ntranslate(20, -20);\nellipse(0, 0, 30, 20);\nfill('black');\ncircle(0, 0, 8);\npop();\n\n// End the drawing group.\npop();\n\n// Draw a bug.\nlet x = random(0, 100);\nlet y = random(0, 100);\ntext('\U0001F99F', x, y);\nIn this version, the code to draw each eye is contained between its own\npush() and pop() functions. Doing so makes it\neasier to add details in the correct part of a drawing.
push() and pop() contain the effects of the\nfollowing functions:
In WebGL mode, push() and pop() contain the\neffects of a few additional styles:
pwinMouseX is reset to the current
- winMouseX value at the start of each
+ winMouseX value at the start of each
touch
event.
- Note: Use pmouseX to track the mouse’s +
Note: Use pmouseX to track the mouse’s previous x-coordinate within the canvas.
diff --git a/src/content/reference/en/p5/pwinMouseY.mdx b/src/content/reference/en/p5/pwinMouseY.mdx index b21d4b06a6..9c85afbda1 100644 --- a/src/content/reference/en/p5/pwinMouseY.mdx +++ b/src/content/reference/en/p5/pwinMouseY.mdx @@ -14,7 +14,7 @@ description: > corner of the browser window. Its value is - winMouseY from the previous frame. For + winMouseY from the previous frame. For example, if the mouse was 50 pixels from @@ -28,12 +28,12 @@ description: > recent touch point.pwinMouseY is reset to the current
- winMouseY value at the start of each
+ winMouseY value at the start of each
touch
event.
- Note: Use pmouseY to track the mouse’s +
Note: Use pmouseY to track the mouse’s previous y-coordinate within the canvas.
diff --git a/src/content/reference/en/p5/quad.mdx b/src/content/reference/en/p5/quad.mdx index e5c37f3a52..7b592725e1 100644 --- a/src/content/reference/en/p5/quad.mdx +++ b/src/content/reference/en/p5/quad.mdx @@ -23,7 +23,7 @@ description: > in 3D space. Doing so requires adding theWEBGL argument to
- createCanvas().
+ createCanvas().
The thirteenth and fourteenth parameters are optional. In WebGL mode, they
diff --git a/src/content/reference/en/p5/quadraticVertex.mdx b/src/content/reference/en/p5/quadraticVertex.mdx
index b243603c5f..2823a5da26 100644
--- a/src/content/reference/en/p5/quadraticVertex.mdx
+++ b/src/content/reference/en/p5/quadraticVertex.mdx
@@ -11,18 +11,18 @@ description: >
curve segments it creates are similar to those made by the
- bezierVertex() function.
+ bezierVertex() function.
quadraticVertex() must be called between the
- beginShape() and
+ beginShape() and
- endShape() functions. The curved segment
+ endShape() functions. The curved segment
uses
the previous vertex as the first anchor point, so there must be at least
- one call to vertex() before
+ one call to vertex() before
quadraticVertex() can
be used.
Note: quadraticVertex() won’t work when an argument is passed
to
- beginShape().
Returns a random number or a random element from an array.
\nrandom() follows uniform distribution, which means that all outcomes are\nequally likely. When random() is used to generate numbers, all\nnumbers in the output range are equally likely to be returned. When\nrandom() is used to select elements from an array, all elements are\nequally likely to be chosen.
By default, random() produces different results each time a sketch runs.\nThe randomSeed() function can be used to\ngenerate the same sequence of numbers or choices each time a sketch runs.
The version of random() with no parameters returns a random number from 0\nup to but not including 1.
The version of random() with one parameter works one of two ways. If the\nargument passed is a number, random() returns a random number from 0 up\nto but not including the number. For example, calling random(5) returns\nvalues between 0 and 5. If the argument passed is an array, random()\nreturns a random element from that array. For example, calling\nrandom(['\U0001F981', '\U0001F42F', '\U0001F43B']) returns either a lion, tiger, or bear emoji.
The version of random() with two parameters returns a random number from\na given range. The arguments passed set the range's lower and upper bounds.\nFor example, calling random(-5, 10.2) returns values from -5 up to but\nnot including 10.2.
Returns a random number or a random element from an array.
\nrandom() follows uniform distribution, which means that all outcomes are\nequally likely. When random() is used to generate numbers, all\nnumbers in the output range are equally likely to be returned. When\nrandom() is used to select elements from an array, all elements are\nequally likely to be chosen.
By default, random() produces different results each time a sketch runs.\nThe randomSeed() function can be used to\ngenerate the same sequence of numbers or choices each time a sketch runs.
The version of random() with no parameters returns a random number from 0\nup to but not including 1.
The version of random() with one parameter works one of two ways. If the\nargument passed is a number, random() returns a random number from 0 up\nto but not including the number. For example, calling random(5) returns\nvalues between 0 and 5. If the argument passed is an array, random()\nreturns a random element from that array. For example, calling\nrandom(['\U0001F981', '\U0001F42F', '\U0001F43B']) returns either a lion, tiger, or bear emoji.
The version of random() with two parameters returns a random number from\na given range. The arguments passed set the range's lower and upper bounds.\nFor example, calling random(-5, 10.2) returns values from -5 up to but\nnot including 10.2.
By default, randomGaussian() produces different results each
time a
- sketch runs. The randomSeed() function
+ sketch runs. The randomSeed() function
can be
used to generate the same sequence of numbers each time a sketch runs.
Sets the seed value for the random() and +
Sets the seed value for the random() + and - randomGaussian() functions.
+ randomGaussian() functions. -By default, random() and +
By default, random() and
- randomGaussian() produce different
+ randomGaussian() produce different
results each time a sketch is run. Calling randomSeed() with a
constant
diff --git a/src/content/reference/en/p5/rect.mdx b/src/content/reference/en/p5/rect.mdx
index 8d65181bea..ee6b498bea 100644
--- a/src/content/reference/en/p5/rect.mdx
+++ b/src/content/reference/en/p5/rect.mdx
@@ -15,7 +15,7 @@ description: >
its width and h sets its height. Every angle in the rectangle
measures
- 90˚. See rectMode() for other ways to
+ 90˚. See rectMode() for other ways to
define
rectangles.
By default, the first two parameters of - rect() and square(), + rect() and square(), are the x- and y-coordinates of the shape's upper left corner. The next parameters set @@ -23,7 +23,7 @@ description: > one of the corners. The next parameters are the location of the opposite - corner. This mode only works for rect().
+ corner. This mode only works for rect().rectMode(CENTER) uses the first two parameters as the x- and
diff --git a/src/content/reference/en/p5/red.mdx b/src/content/reference/en/p5/red.mdx
index 19271c03f9..32308ab3f9 100644
--- a/src/content/reference/en/p5/red.mdx
+++ b/src/content/reference/en/p5/red.mdx
@@ -15,7 +15,7 @@ description: >
By default, red() returns a color's red value in the range 0
- to 255. If the colorMode() is set to RGB,
+ to 255. If the colorMode() is set to RGB,
it
returns the red value in the given range.
Runs the code in draw() once.
+Runs the code in draw() once.
-By default, draw() tries to run 60 times +
By default, draw() tries to run 60 times
per
- second. Calling noLoop() stops
+ second. Calling noLoop() stops
- draw() from repeating. Calling
+ draw() from repeating. Calling
redraw() will
- execute the code in the draw() function a set
+ execute the code in the draw() function a
+ set
number of times.
new p5().
line: 560
diff --git a/src/content/reference/en/p5/removeElements.mdx b/src/content/reference/en/p5/removeElements.mdx
index bf545e3d2c..1256f7e67b 100644
--- a/src/content/reference/en/p5/removeElements.mdx
+++ b/src/content/reference/en/p5/removeElements.mdx
@@ -9,11 +9,11 @@ description: >
There are two exceptions: canvas elements created by createCanvas() + href="/reference/p5/createCanvas/">createCanvas() and p5.Render objects created by - createGraphics().
+ createGraphics(). line: 256 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/removeItem.mdx b/src/content/reference/en/p5/removeItem.mdx index 2c681ed8cc..ac354f2224 100644 --- a/src/content/reference/en/p5/removeItem.mdx +++ b/src/content/reference/en/p5/removeItem.mdx @@ -8,7 +8,8 @@ description: >Web browsers can save small amounts of data using the built-in
- localStorage object.
Data stored in localStorage can be retrieved at any point, even
@@ -18,7 +19,7 @@ description: >
pairs.
storeItem() makes it easy to store +
storeItem() makes it easy to store
values in
localStorage and removeItem() makes it easy to
diff --git a/src/content/reference/en/p5/requestPointerLock.mdx b/src/content/reference/en/p5/requestPointerLock.mdx
index cfd78bb1c3..18873e819e 100644
--- a/src/content/reference/en/p5/requestPointerLock.mdx
+++ b/src/content/reference/en/p5/requestPointerLock.mdx
@@ -11,21 +11,21 @@ description: >
screen. Calling requestPointerLock() locks the values of
- mouseX, mouseY,
+ mouseX, mouseY,
- pmouseX, and pmouseY.
+ pmouseX, and pmouseY.
- movedX and movedY
+ movedX and movedY
continue updating and can be used to get the distance the mouse moved since
the last frame was drawn. Calling
- exitPointerLock() resumes updating
- the
+ exitPointerLock() resumes
+ updating the
mouse system variables.
requestPointerLock() in
an event function such as doubleClicked().
+ href="/reference/p5/doubleClicked/">doubleClicked().
line: 1866
isConstructor: false
itemtype: method
diff --git a/src/content/reference/en/p5/resetShader.mdx b/src/content/reference/en/p5/resetShader.mdx
index e5d2218ba2..b527e8a8e2 100644
--- a/src/content/reference/en/p5/resetShader.mdx
+++ b/src/content/reference/en/p5/resetShader.mdx
@@ -6,7 +6,7 @@ file: src/webgl/material.js
description: |
Restores the default shaders.
resetShader() deactivates any shaders previously applied by
- shader().
Note: Shaders can only be used in WebGL mode.
line: 773 isConstructor: false diff --git a/src/content/reference/en/p5/resizeCanvas.mdx b/src/content/reference/en/p5/resizeCanvas.mdx index d4c365930f..b629fa1b82 100644 --- a/src/content/reference/en/p5/resizeCanvas.mdx +++ b/src/content/reference/en/p5/resizeCanvas.mdx @@ -8,10 +8,10 @@ description: >resizeCanvas() immediately clears the canvas and calls
- redraw(). It's common to call
+ redraw(). It's common to call
resizeCanvas()
- within the body of windowResized()
+ within the body of windowResized()
like
so:
The first two parameters, width and height, set
the dimensions of the
- canvas. They also the values of the width
+ canvas. They also the values of the width
and
- height system variables. For example,
+ height system variables. For example,
calling
resizeCanvas(300, 500) resizes the canvas to 300×500 pixels, then
sets
- width to 300 and
+ width to 300 and
- height 500.
The third parameter, noRedraw, is optional. If
true is passed, as in
@@ -44,10 +44,11 @@ description: >
resizeCanvas(300, 500, true), then the canvas will be canvas to
300×500
- pixels but the redraw() function won't be
+ pixels but the redraw() function won't be
called
- immediately. By default, redraw() is called
+ immediately. By default, redraw() is
+ called
immediately when resizeCanvas() finishes executing.
Specifies the value to be returned by a function. - - For more info checkout - - the MDN entry for return.
-line: 267 -isConstructor: false -itemtype: property -alt: This example does not render anything -example: - - |- - -
- function calculateSquare(x) {
- return x * x;
- }
- const result = calculateSquare(4); // returns 16
- console.log(result); // prints '16' to the console
-
- rotate() interprets angle values using the current
- angleMode().
+ angleMode().
The second parameter, axis, is optional. It's used to orient
3D rotations
@@ -49,14 +49,14 @@ description: >
twice has the same effect as calling rotate(2) once. The
- push() and pop() functions
+ push() and pop() functions
can be used to isolate transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
- rotate(1) inside the draw()
+ rotate(1) inside the draw()
function won't cause
shapes to spin.
rotateX() interprets angle values using the current
- angleMode().
+ angleMode().
By default, transformations accumulate. For example, calling
rotateX(1)
twice has the same effect as calling rotateX(2) once. The
- push() and pop() functions
+ push() and pop() functions
can be used to isolate transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
- rotateX(1) inside the draw()
+ rotateX(1) inside the draw()
function won't cause
shapes to spin.
rotateY() interprets angle values using the current
- angleMode().
+ angleMode().
By default, transformations accumulate. For example, calling
rotateY(1)
twice has the same effect as calling rotateY(2) once. The
- push() and pop() functions
+ push() and pop() functions
can be used to isolate transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
- rotateY(1) inside the draw()
+ rotateY(1) inside the draw()
function won't cause
shapes to spin.
rotateZ() interprets angle values using the current
- angleMode().
+ angleMode().
By default, transformations accumulate. For example, calling
rotateZ(1)
twice has the same effect as calling rotateZ(2) once. The
- push() and pop() functions
+ push() and pop() functions
can be used to isolate transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
- rotateZ(1) inside the draw()
+ rotateZ(1) inside the draw()
function won't cause
shapes to spin.
The system variable rotationX always contains the rotation of the - device along the x axis. If the sketch + device along the x axis. If the sketch angleMode() is set to DEGREES, the value will be -180 to 180. If it is set to RADIANS, the value will be -PI to PI.
Note: The order the rotations are called is important, ie. if used diff --git a/src/content/reference/en/p5/rotationY.mdx b/src/content/reference/en/p5/rotationY.mdx index e8223ce151..5787d7c2e7 100644 --- a/src/content/reference/en/p5/rotationY.mdx +++ b/src/content/reference/en/p5/rotationY.mdx @@ -5,7 +5,7 @@ submodule: Acceleration file: src/events/acceleration.js description: |
The system variable rotationY always contains the rotation of the - device along the y axis. If the sketch + device along the y axis. If the sketch angleMode() is set to DEGREES, the value will be -90 to 90. If it is set to RADIANS, the value will be -PI/2 to PI/2.
Note: The order the rotations are called is important, ie. if used diff --git a/src/content/reference/en/p5/rotationZ.mdx b/src/content/reference/en/p5/rotationZ.mdx index 23f85480dd..f2d302282f 100644 --- a/src/content/reference/en/p5/rotationZ.mdx +++ b/src/content/reference/en/p5/rotationZ.mdx @@ -5,7 +5,7 @@ submodule: Acceleration file: src/events/acceleration.js description: |
The system variable rotationZ always contains the rotation of the - device along the z axis. If the sketch + device along the z axis. If the sketch angleMode() is set to DEGREES, the value will be 0 to 360. If it is set to RADIANS, the value will be 0 to 2*PI.
Unlike rotationX and rotationY, this variable is available for devices diff --git a/src/content/reference/en/p5/saturation.mdx b/src/content/reference/en/p5/saturation.mdx index 66080eb831..9ae97ad09f 100644 --- a/src/content/reference/en/p5/saturation.mdx +++ b/src/content/reference/en/p5/saturation.mdx @@ -18,7 +18,7 @@ description: > returns a color's HSL saturation in the range 0 to 100. If the - colorMode() is set to HSB or HSL, it + colorMode() is set to HSB or HSL, it returns the saturation value in the given mode.
diff --git a/src/content/reference/en/p5/saveGif.mdx b/src/content/reference/en/p5/saveGif.mdx index d95d94c77e..af4205d9bf 100644 --- a/src/content/reference/en/p5/saveGif.mdx +++ b/src/content/reference/en/p5/saveGif.mdx @@ -7,7 +7,7 @@ description: >Generates a gif from a sketch and saves it to a file.
saveGif() may be called in setup() or at any
+ href="/reference/p5/setup/">setup() or at any
point while a sketch is running.
JavaScript Object Notation
- (JSON)
is a standard format for sending data between applications. The format is
diff --git a/src/content/reference/en/p5/saveSound.mdx b/src/content/reference/en/p5/saveSound.mdx
index e6ff0e26a8..0676ce11fe 100644
--- a/src/content/reference/en/p5/saveSound.mdx
+++ b/src/content/reference/en/p5/saveSound.mdx
@@ -11,7 +11,7 @@ description: >
For uploading audio to a server, use
p5.SoundFile.saveBlob.
p5.SoundFile.saveBlob.
line: 1145
isConstructor: false
itemtype: method
diff --git a/src/content/reference/en/p5/scale.mdx b/src/content/reference/en/p5/scale.mdx
index 99334e948f..c3eab0e1b2 100644
--- a/src/content/reference/en/p5/scale.mdx
+++ b/src/content/reference/en/p5/scale.mdx
@@ -55,14 +55,14 @@ description: >
twice has the same effect as calling scale(2) once. The
- push() and pop() functions
+ push() and pop() functions
can be used to isolate transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
- scale(2) inside the draw()
+ scale(2) inside the draw()
function won't cause
shapes to grow continuously.
set() is easy to use but it's not as fast as
- pixels. Use pixels
+ pixels. Use pixels
to set many pixel values.
updatePixels() must be called +
updatePixels() must be called
after using
set() for changes to appear.
setCamera() allows for switching between multiple cameras
created with
- createCamera().
Note: setCamera() can only be used in WebGL mode.
The setMoveThreshold() +
The setMoveThreshold() function is used to set the movement threshold for - the deviceMoved() function. The + the deviceMoved() function. The default threshold is set to 0.5.
line: 417 isConstructor: false diff --git a/src/content/reference/en/p5/setShakeThreshold.mdx b/src/content/reference/en/p5/setShakeThreshold.mdx index 1a8f84e363..188422faf2 100644 --- a/src/content/reference/en/p5/setShakeThreshold.mdx +++ b/src/content/reference/en/p5/setShakeThreshold.mdx @@ -4,10 +4,10 @@ module: Events submodule: Acceleration file: src/events/acceleration.js description: > -The setShakeThreshold() +
The setShakeThreshold() function is used to set the movement threshold for - the deviceShaken() function. The + the deviceShaken() function. The default threshold is set to 30.
line: 459 isConstructor: false diff --git a/src/content/reference/en/p5/setup.mdx b/src/content/reference/en/p5/setup.mdx index 4f07709c76..e300ec51a1 100644 --- a/src/content/reference/en/p5/setup.mdx +++ b/src/content/reference/en/p5/setup.mdx @@ -20,12 +20,12 @@ description: >Code placed in setup() will run once before code placed in
- draw() begins looping. If the
+ draw() begins looping. If the
- preload() is declared, then
+ preload() is declared, then
setup() will
- run immediately after preload() finishes
+ run immediately after preload() finishes
loading assets.
The parameter, s, is the p5.Shader object to
@@ -62,12 +62,12 @@ description: >
shader(). See
MDN
for more information about compiling shaders.
Calling resetShader() restores a +
Calling resetShader() restores a sketch’s default shaders.
diff --git a/src/content/reference/en/p5/shearX.mdx b/src/content/reference/en/p5/shearX.mdx index 04c403e974..695c0ebbcf 100644 --- a/src/content/reference/en/p5/shearX.mdx +++ b/src/content/reference/en/p5/shearX.mdx @@ -21,22 +21,22 @@ description: >x = x + y * tan(angle). shearX() interprets angle
values using the
- current angleMode().
+ current angleMode().
By default, transformations accumulate. For example, calling
shearX(1) twice has the same effect as calling
shearX(2) once. The
- push() and
+ push() and
- pop() functions can be used to isolate
+ pop() functions can be used to isolate
transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
- shearX(1) inside the draw()
+ shearX(1) inside the draw()
function won't
cause shapes to shear continuously.
y = y + x * tan(angle). shearY() interprets angle
values using the
- current angleMode().
+ current angleMode().
By default, transformations accumulate. For example, calling
shearY(1) twice has the same effect as calling
shearY(2) once. The
- push() and
+ push() and
- pop() functions can be used to isolate
+ pop() functions can be used to isolate
transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
- shearY(1) inside the draw()
+ shearY(1) inside the draw()
function won't
cause shapes to shear continuously.
Sets the amount of gloss ("shininess") of a - specularMaterial().
+ specularMaterial().Shiny materials focus reflected light more than dull materials.
shininess() affects the way materials reflect light sources
including
- directionalLight(),
+ directionalLight(),
- pointLight(),
+ pointLight(),
- and spotLight().
The parameter, shine, is a number that sets the amount of
shininess.
diff --git a/src/content/reference/en/p5/sin.mdx b/src/content/reference/en/p5/sin.mdx
index 0044091d91..439945e25b 100644
--- a/src/content/reference/en/p5/sin.mdx
+++ b/src/content/reference/en/p5/sin.mdx
@@ -13,7 +13,7 @@ description: >
sin()
takes into account the current angleMode().
smooth() is active by default. In 2D mode,
- noSmooth() is helpful for scaling up
+ noSmooth() is helpful for scaling up
images
without blurring. The functions don't affect shapes or fonts.
In WebGL mode, noSmooth() causes all +
In WebGL mode, noSmooth() causes all
shapes to
be drawn with jagged (aliased) edges. The functions don't affect images or
diff --git a/src/content/reference/en/p5/specularColor.mdx b/src/content/reference/en/p5/specularColor.mdx
index a7e296bde3..3b7be5aaf1 100644
--- a/src/content/reference/en/p5/specularColor.mdx
+++ b/src/content/reference/en/p5/specularColor.mdx
@@ -11,31 +11,31 @@ description: >
direction. These lights include
- directionalLight(),
+ directionalLight(),
- pointLight(), and
+ pointLight(), and
- spotLight(). The function helps to
+ spotLight(). The function helps to
create
highlights on p5.Geometry objects that
are
- styled with specularMaterial().
+ styled with specularMaterial().
If a
geometry does not use
- specularMaterial(), then
+ specularMaterial(), then
specularColor() will have no effect.
Note: specularColor() doesn’t affect lights that bounce in all
- directions, including ambientLight()
+ directions, including ambientLight()
and
- imageLight().
There are three ways to call specularColor() with optional
parameters to
@@ -73,7 +73,7 @@ description: >
color. Color values will be interpreted using the current
- colorMode().
Unlike ambientMaterial(), +
Unlike ambientMaterial(),
specularMaterial() will reflect the full color of light sources
including
- directionalLight(),
+ directionalLight(),
- pointLight(),
+ pointLight(),
- and spotLight(). This is what gives it
+ and spotLight(). This is what gives it
shapes
their "shiny" appearance. The material’s shininess can be controlled by the
- shininess() function.
specularMaterial() can be called three ways with different
parameters to
@@ -70,7 +70,7 @@ description: >
specularMaterial(255, 0, 0, 30). Color values will be interpreted
using
- the current colorMode().
splitTokens() is an enhanced version of
- split(). It can split a string when any
+ split(). It can split a string when any
characters
from a list are detected.
Web browsers can save small amounts of data using the built-in
- localStorage object.
Data stored in localStorage can be retrieved at any point, even
@@ -21,7 +22,7 @@ description: >
storeItem() makes it easy to store values in
localStorage and
- getItem() makes it easy to retrieve
+ getItem() makes it easy to retrieve
them.
The first parameter, key, is the name of the value to be
diff --git a/src/content/reference/en/p5/str.mdx b/src/content/reference/en/p5/str.mdx
index 928e1fc470..4a3da99706 100644
--- a/src/content/reference/en/p5/str.mdx
+++ b/src/content/reference/en/p5/str.mdx
@@ -9,7 +9,8 @@ description: >
str() converts values to strings. See the
- String reference page for guidance on using
+ String reference page for guidance on
+ using
template literals instead.
The version of stroke() with one parameter interprets the
value one of
diff --git a/src/content/reference/en/p5/strokeWeight.mdx b/src/content/reference/en/p5/strokeWeight.mdx
index bc5342e52a..5243521585 100644
--- a/src/content/reference/en/p5/strokeWeight.mdx
+++ b/src/content/reference/en/p5/strokeWeight.mdx
@@ -11,7 +11,7 @@ description: >
Note: strokeWeight() is affected by transformations,
especially calls to
- scale().
tan() takes into account the current
- angleMode().
+ angleMode().
line: 441
isConstructor: false
itemtype: method
diff --git a/src/content/reference/en/p5/text.mdx b/src/content/reference/en/p5/text.mdx
index 886a4604b9..baf19d1b3a 100644
--- a/src/content/reference/en/p5/text.mdx
+++ b/src/content/reference/en/p5/text.mdx
@@ -12,7 +12,7 @@ description: >
parameters, x and y, set the coordinates of the
text's bottom-left
- corner. See textAlign() for other ways
+ corner. See textAlign() for other ways
to
align text.
@@ -24,34 +24,34 @@ description: >
default, they set its maximum width and height. See
- rectMode() for other ways to define the
+ rectMode() for other ways to define the
rectangular text box. Text will wrap to fit within the text box. Text
outside of the box won't be drawn.
Text can be styled a few ways. Call the fill() + href="/reference/p5/fill/">fill() function to set the text's fill color. Call - stroke() and + stroke() and - strokeWeight() to set the text's + strokeWeight() to set the text's outline. - Call textSize() and + Call textSize() and - textFont() to set the text's size and + textFont() to set the text's size and font, respectively.
Note: WEBGL mode only supports fonts loaded with
- loadFont(). Calling
+ loadFont(). Calling
- stroke() has no effect in
+ stroke() has no effect in
WEBGL mode.
Sets the way text is aligned when text() +
Sets the way text is aligned when text() is called.
By default, calling text('hi', 10, 20) places the bottom-left
@@ -14,7 +14,7 @@ description: >
The first parameter, horizAlign, changes the way
- text() interprets x-coordinates. By default,
+ text() interprets x-coordinates. By default,
the
x-coordinate sets the left edge of the bounding box. textAlign()
@@ -26,7 +26,7 @@ description: >
The second parameter, vertAlign, is optional. It changes the
way
- text() interprets y-coordinates. By default,
+ text() interprets y-coordinates. By default,
the
y-coordinate sets the bottom edge of the bounding box.
diff --git a/src/content/reference/en/p5/textFont.mdx b/src/content/reference/en/p5/textFont.mdx
index dab88839ed..f16eeb0913 100644
--- a/src/content/reference/en/p5/textFont.mdx
+++ b/src/content/reference/en/p5/textFont.mdx
@@ -4,7 +4,7 @@ module: Typography
submodule: Loading & Displaying
file: src/typography/loading_displaying.js
description: >
-
Sets the font used by the text() +
Sets the font used by the text() function.
The first parameter, font, sets the font.
@@ -19,11 +19,11 @@ description: >
in pixels.
This has the same effect as calling textSize().
Note: WEBGL mode only supports fonts loaded with
- loadFont().
Sets the spacing between lines of text when - text() is called.
+ text() is called.Note: Spacing is measured in pixels.
diff --git a/src/content/reference/en/p5/textOutput.mdx b/src/content/reference/en/p5/textOutput.mdx index f9dcab4cd5..af67a520bd 100644 --- a/src/content/reference/en/p5/textOutput.mdx +++ b/src/content/reference/en/p5/textOutput.mdx @@ -31,8 +31,8 @@ description: >red circle location = middle area = 3%. This is different from
- gridOutput(), which uses its table as a
- grid.
+ gridOutput(), which uses its table as
+ a grid.
The display parameter is optional. It determines how the
description is
diff --git a/src/content/reference/en/p5/textSize.mdx b/src/content/reference/en/p5/textSize.mdx
index df500158dc..94d96f1883 100644
--- a/src/content/reference/en/p5/textSize.mdx
+++ b/src/content/reference/en/p5/textSize.mdx
@@ -6,7 +6,7 @@ file: src/typography/attributes.js
description: >
Sets the font size when - text() is called.
+ text() is called.Note: Font size is measured in pixels.
diff --git a/src/content/reference/en/p5/textStyle.mdx b/src/content/reference/en/p5/textStyle.mdx index c062953335..7110406ac6 100644 --- a/src/content/reference/en/p5/textStyle.mdx +++ b/src/content/reference/en/p5/textStyle.mdx @@ -6,7 +6,7 @@ file: src/typography/attributes.js description: >Sets the style for system fonts when - text() is called.
+ text() is called.The parameter, style, can be either NORMAL,
ITALIC, BOLD, or
@@ -16,7 +16,7 @@ description: >
textStyle() may be overridden by CSS styling. This function
doesn't
- affect fonts loaded with loadFont().
Calculates the maximum width of a string of text drawn when - text() is called.
+ text() is called. line: 253 isConstructor: false itemtype: method diff --git a/src/content/reference/en/p5/textWrap.mdx b/src/content/reference/en/p5/textWrap.mdx index ad7c34b215..75b274d384 100644 --- a/src/content/reference/en/p5/textWrap.mdx +++ b/src/content/reference/en/p5/textWrap.mdx @@ -6,7 +6,7 @@ file: src/typography/attributes.js description: >Sets the style for wrapping text when - text() is called.
+ text() is called.The parameter, style, can be one of the following values:
A texture is like a skin that wraps around a shape. texture()
works with
- built-in shapes, such as square() and
+ built-in shapes, such as square() and
- sphere(), and custom shapes created with
+ sphere(), and custom shapes created with
- functions such as buildGeometry().
+ functions such as buildGeometry().
To
texture a geometry created with beginShape(),
+ href="/reference/p5/beginShape/">beginShape(),
uv coordinates must be passed to each
- vertex() call.
The parameter, tex, is the texture to apply.
texture() can use a range
@@ -33,10 +33,10 @@ description: >
p5.Framebuffer objects.
To texture a geometry created with beginShape(), + href="/reference/p5/beginShape/">beginShape(), you will need to specify uv coordinates in vertex().
+ href="/reference/p5/vertex/">vertex().Note: texture() can only be used in WebGL mode.
In order for texture() to work, a shape - needs a +
In order for texture() to work, a + shape needs a way to map the points on its surface to the pixels in an image. Built-in - shapes such as rect() and + shapes such as rect() and - box() already have these texture mappings + box() already have these texture mappings based on their vertices. Custom shapes created with - vertex() require texture mappings to be + vertex() require texture mappings to be passed as uv coordinates.
-Each call to vertex() must include 5 +
Each call to vertex() must include 5
arguments,
as in vertex(x, y, z, u, v), to map the vertex at coordinates
diff --git a/src/content/reference/en/p5/textureWrap.mdx b/src/content/reference/en/p5/textureWrap.mdx
index 954012aeca..e09050f21c 100644
--- a/src/content/reference/en/p5/textureWrap.mdx
+++ b/src/content/reference/en/p5/textureWrap.mdx
@@ -8,24 +8,24 @@ description: >
texture.
In order for texture() to work, a shape - needs a +
In order for texture() to work, a + shape needs a way to map the points on its surface to the pixels in an image. Built-in - shapes such as rect() and + shapes such as rect() and - box() already have these texture mappings + box() already have these texture mappings based on their vertices. Custom shapes created with - vertex() require texture mappings to be + vertex() require texture mappings to be passed as uv coordinates.
-Each call to vertex() must include 5 +
Each call to vertex() must include 5
arguments,
as in vertex(x, y, z, u, v), to map the vertex at coordinates
diff --git a/src/content/reference/en/p5/tint.mdx b/src/content/reference/en/p5/tint.mdx
index daf2027b80..76942642b1 100644
--- a/src/content/reference/en/p5/tint.mdx
+++ b/src/content/reference/en/p5/tint.mdx
@@ -30,7 +30,7 @@ description: >
HSB values, depending on the current
- colorMode(). The optional fourth
+ colorMode(). The optional fourth
parameter
sets the alpha value. For example, tint(255, 0, 0, 100) will give
diff --git a/src/content/reference/en/p5/touchEnded.mdx b/src/content/reference/en/p5/touchEnded.mdx
index bb4a881c8d..5b234401e2 100644
--- a/src/content/reference/en/p5/touchEnded.mdx
+++ b/src/content/reference/en/p5/touchEnded.mdx
@@ -16,7 +16,7 @@ description: >
-
The touches array will be updated with +
The touches array will be updated with
the most
recent touch points when touchEnded() is called by p5.js:
The parameter, event, is optional. touchEnded() will be passed
a
- TouchEvent
object with properties that describe the touch event:
On touchscreen devices, mouseReleased() will
+ href="/reference/p5/mouseReleased/">mouseReleased() will
run when the user’s touch ends if touchEnded() isn’t declared. If
touchEnded() is declared, then touchEnded() will run
when a user’s
- touch ends and mouseReleased()
+ touch ends and mouseReleased()
won’t.
Note: touchStarted(), +
Note: touchStarted(),
touchEnded(), and touchMoved() are all
+ href="/reference/p5/touchMoved/">touchMoved() are all
- related. touchStarted() runs as soon
+ related. touchStarted() runs as soon
as the
user touches a touchscreen device. touchEnded() runs as soon as
the user
- ends a touch. touchMoved() runs
+ ends a touch. touchMoved() runs
repeatedly as
the user moves any touch points.
The touches array will be updated with +
The touches array will be updated with
the most
recent touch points when touchMoved() is called by p5.js:
The parameter, event, is optional. touchMoved() will be passed
a
- TouchEvent
object with properties that describe the touch event:
On touchscreen devices, mouseDragged() will
+ href="/reference/p5/mouseDragged/">mouseDragged() will
run when the user’s touch points move if touchMoved() isn’t
declared. If
@@ -57,20 +57,20 @@ description: >
touchMoved() is declared, then touchMoved() will run
when a user’s
- touch points move and mouseDragged()
+ touch points move and mouseDragged()
won’t.
Note: touchStarted(), +
Note: touchStarted(),
- touchEnded(), and
+ touchEnded(), and
touchMoved() are all related.
- touchStarted() runs as soon as the
+ touchStarted() runs as soon as the
user
touches a touchscreen device. touchEnded()
+ href="/reference/p5/touchEnded/">touchEnded()
runs as soon as the user ends a touch. touchMoved() runs
repeatedly as
diff --git a/src/content/reference/en/p5/touchStarted.mdx b/src/content/reference/en/p5/touchStarted.mdx
index b5ea009ad4..bf71a782b4 100644
--- a/src/content/reference/en/p5/touchStarted.mdx
+++ b/src/content/reference/en/p5/touchStarted.mdx
@@ -17,7 +17,7 @@ description: >
-
The touches array will be updated with +
The touches array will be updated with
the most
recent touch points when touchStarted() is called by p5.js:
The parameter, event, is optional. touchStarted() will be
passed a
- TouchEvent
object with properties that describe the touch event:
On touchscreen devices, mousePressed() will
+ href="/reference/p5/mousePressed/">mousePressed() will
run when a user’s touch starts if touchStarted() isn’t declared.
If
@@ -58,21 +58,21 @@ description: >
touchStarted() is declared, then touchStarted() will
run when a user’s
- touch starts and mousePressed()
+ touch starts and mousePressed()
won’t.
Note: touchStarted(), touchEnded(), and
+ href="/reference/p5/touchEnded/">touchEnded(), and
- touchMoved() are all related.
+ touchMoved() are all related.
touchStarted() runs as soon as the user touches a touchscreen
device.
- touchEnded() runs as soon as the user
+ touchEnded() runs as soon as the user
ends a
- touch. touchMoved() runs repeatedly as
+ touch. touchMoved() runs repeatedly as
the
user moves any touch points.
translate(10, 0) twice has the same effect as calling
translate(20, 0) once. The push() and
+ href="/reference/p5/push/">push() and
- pop() functions can be used to isolate
+ pop() functions can be used to isolate
transformations within distinct drawing groups.
Note: Transformations are reset at the beginning of the draw loop. Calling
translate(10, 0) inside the draw() function won't
+ href="/reference/p5/draw/">draw() function won't
cause shapes to move continuously.
trim() trims
- whitespace characters
such as spaces, carriage returns, tabs, Unicode "nbsp" character.
When a device is rotated, the axis that triggers the deviceTurned() + href="/reference/p5/deviceTurned/">deviceTurned() method is stored in the turnAxis variable. The turnAxis variable is only defined within diff --git a/src/content/reference/en/p5/types/Boolean.mdx b/src/content/reference/en/p5/types/Boolean.mdx deleted file mode 100644 index 3d6d29e474..0000000000 --- a/src/content/reference/en/p5/types/Boolean.mdx +++ /dev/null @@ -1,270 +0,0 @@ ---- -title: Boolean -module: Foundation -submodule: Foundation -file: src/core/reference.js -description: > -
A value that's either true or false.
Boolean values help to make decisions in code. They appear any
- time a
-
- logical condition is checked. For example, the condition
-
- "Is a mouse button being pressed?" must be either true or
-
- false:
// If the user presses the mouse, draw a circle
- at
-
- // the mouse's location.
-
- if (mouseIsPressed === true) {
- circle(mouseX, mouseY, 20);
- }
-
- The if statement checks whether
-
- mouseIsPressed is true
- and draws a
-
- circle if it is. Boolean expressions such as mouseIsPressed
- === true
-
- evaluate to one of the two possible Boolean values:
- true or false.
The === operator (EQUAL) checks whether two values are equal.
- If they
-
- are, the expression evaluates to true. Otherwise, it evaluates to
-
- false.
Note: There's also a == operator with two =
- instead of three. Don't use
-
- it.
The mouseIsPressed system
- variable is
-
- always true or false, so the code snippet above
- could also be written
-
- as follows:
if (mouseIsPressed) {
- circle(mouseX, mouseY, 20);
- }
-
- The !== operator (NOT EQUAL) checks whether two values are not
- equal, as
-
- in the following example:
if (2 + 2 !== 4) {
- text('War is peace.', 50, 50);
- }
-
- Starting from the left, the arithmetic expression 2 + 2
- produces the
-
- value 4. The Boolean expression 4 !== 4
- evaluates to false because
-
- 4 is equal to itself. As a result, the if
- statement's body is skipped.
Note: There's also a != operator with one =
- instead of two. Don't use
-
- it.
The Boolean operator && (AND) checks whether two
- expressions are both
-
- true:
if (keyIsPressed === true && key === 'p') {
- text('You pressed the "p" key!', 50, 50);
- }
-
- If the user is pressing a key AND that key is 'p', then a
- message will
-
- display.
The Boolean operator || (OR) checks whether at
- least one of two
-
- expressions is true:
if (keyIsPressed === true || mouseIsPressed ===
- true) {
- text('You did something!', 50, 50);
- }
-
- If the user presses a key, or presses a mouse button, or both, then a - - message will display.
- -The following truth table summarizes a few common scenarios with
- && and
-
- ||:
true && true // true
-
- true && false // false
-
- false && false // false
-
- true || true // true
-
- true || false // true
-
- false || false // false
-
- The relational operators >, << code="">,
- >=, and <=< code=""> also produce Boolean
-
- values:
2 > 1 // true
-
- 2 < 1 // false
-
- 2 >= 2 // true
-
- 2 <= 2="" true="" <="" code=""/>See if for more information about
- if statements and
-
- Number for more information about
- Numbers.
- function setup() {
- createCanvas(100, 100);
-
- describe('A gray square. When the user presses the mouse, a circle appears at that location.');
- }
-
- function draw() {
- background(200);
-
- // If the user presses the mouse, draw a circle at that location.
- if (mouseIsPressed) {
- circle(mouseX, mouseY, 20);
- }
- }
-
-
- function setup() {
- createCanvas(100, 100);
-
- describe('A gray square. When the user presses the mouse, a circle appears at that location.');
- }
-
- function draw() {
- background(200);
-
- // If the user presses the mouse, draw a circle at that location.
- if (mouseIsPressed === true) {
- circle(mouseX, mouseY, 20);
- }
- }
-
-
- // Click on the canvas to begin detecting key presses.
-
- function setup() {
- createCanvas(100, 100);
-
- describe('A gray square that turns pink when the user presses the mouse or a key.');
- }
-
- function draw() {
- background(200);
-
- // If the user presses the mouse, change the background color.
- if (mouseIsPressed === true || keyIsPressed === true) {
- background('deeppink');
- }
- }
-
-
- // Click the canvas to begin detecting key presses.
-
- // Create a Boolean variable.
- let isPlaying = false;
-
- function setup() {
- createCanvas(100, 100);
-
- describe(
- 'The message "Begin?\nY or N" written in green on a black background. The message "Good luck!" appears when they press the "y" key.'
- );
- }
-
- function draw() {
- background(0);
-
- // Style the text.
- textAlign(CENTER, CENTER);
- textFont('Courier New');
- textSize(16);
- fill(0, 255, 0);
-
- // Display a different message when the user begins playing.
- if (isPlaying === false) {
- text('Begin?', 50, 40);
- text('Y or N', 50, 60);
- } else {
- text('Good luck!', 50, 50);
- }
- }
-
- // Start playing when the user presses the 'y' key.
- function keyPressed() {
- if (key === 'y') {
- isPlaying = true;
- }
- }
-
- A number that can be positive, negative, or zero.
- -The Number data type is useful for describing values such as
- position,
-
- size, and color. A number can be an integer such as 20 or a decimal number
-
- such as 12.34. For example, a circle's position and size can be described
-
- by three numbers:
circle(50, 50, 20);
-
- circle(50, 50, 12.34);
-
- Numbers support basic arithmetic and follow the standard order of - - operations: Parentheses, Exponents, Multiplication, Division, Addition, - - and Subtraction (PEMDAS). For example, it's common to use arithmetic - - operators with p5.js' system variables that are numbers:
- -// Draw a circle at the center.
-
- circle(width / 2, height / 2, 20);
-
- // Draw a circle that moves from left to right.
-
- circle(frameCount * 0.01, 50, 20);
-
- Here's a quick overview of the arithmetic operators:
- -1 + 2 // Add
-
- 1 - 2 // Subtract
-
- 1 * 2 // Multiply
-
- 1 / 2 // Divide
-
- 1 % 2 // Remainder
-
- 1 ** 2 // Exponentiate
-
- It's common to update a number variable using arithmetic. For example, an - - object's location can be updated like so:
- -x = x + 1;
-
- The statement above adds 1 to a variable x using the
- + operator. The
-
- addition assignment operator += expresses the same idea:
x += 1;
-
- Here's a quick overview of the assignment operators:
- -x += 2 // Addition assignment
-
- x -= 2 // Subtraction assignment
-
- x *= 2 // Multiplication assignment
-
- x /= 2 // Division assignment
-
- x %= 2 // Remainder assignment
-
- Numbers can be compared using the
-
- relational operators
-
- >, << code="">, >=, <=< code="">,
- ===, and !==. For example, a sketch's
-
- frameCount can be used as a
- timer:
if (frameCount > 1000) {
- text('Game over!', 50, 50);
- }
-
- An expression such as frameCount > 1000 evaluates to a
- Boolean value
-
- that's either true or false. The relational
- operators all produce
-
- Boolean values:
2 > 1 // true
-
- 2 < 1 // false
-
- 2 >= 2 // true
-
- 2 <= 2="" true="" !="=" false="" <="" code=""/>See Boolean for more information about - comparisons and conditions.
- -Note: There are also == and != operators with one
- fewer =. Don't use them.
Expressions with numbers can also produce special values when something - - goes wrong:
- -sqrt(-1) // NaN
-
- 1 / 0 // Infinity
-
- The value NaN stands for
-
- Not-A-Number.
-
- NaN appears when calculations or conversions don't work.
- Infinity is a
-
- value that's larger than any number. It appears during certain
-
- calculations.
- function setup() {
- createCanvas(100, 100);
-
- background(200);
-
- // Draw a circle at the center.
- circle(50, 50, 70);
-
- // Draw a smaller circle at the center.
- circle(width / 2, height / 2, 30);
-
- describe('Two concentric, white circles drawn on a gray background.');
- }
-
-
- function setup() {
- createCanvas(100, 100);
-
- describe('A white circle travels from left to right on a gray background.');
- }
-
- function draw() {
- background(200);
-
- circle(frameCount * 0.05, 50, 20);
- }
-
- A container for data that's stored as key-value pairs.
\nObjects help to organize related data of any type, including other objects.\nA value stored in an object can be accessed by name, called its key. Each\nkey-value pair is called a \"property.\" Objects are similar to dictionaries\nin Python and maps in Java and Ruby.
\nFor example, an object could contain the location, size, and appearance of\na dog:
\n// Declare the dog variable and assign it an object.\nlet dog = { x: 50, y: 50, size: 20, emoji: '\U0001F436' };\n\n// Style the text.\ntextAlign(CENTER, CENTER);\ntextSize(dog.size);\n\n// Draw the dog.\ntext(dog.emoji, dog.x, dog.y);\nThe variable dog is assigned an object with four properties. Objects\nare declared with curly braces {}. Values can be accessed using the dot\noperator, as in dog.size. In the example above, the key size\ncorresponds to the value 20. Objects can also be empty to start:
// Declare a cat variable and assign it an empty object.\nlet cat = {};\n\n// Add properties to the object.\ncat.x = 50;\ncat.y = 50;\ncat.size = 20;\ncat.emoji = '\U0001F431';\n\n// Style the text.\ntextAlign(CENTER, CENTER);\ntextSize(cat.size);\n\n// Draw the cat.\ntext(cat.emoji, cat.x, cat.y);\nAn object's data can be updated while a sketch runs. For example, the cat\ncould run away from the dog by updating its location:
// Run to the right.\ncat.x += 5;\nIf needed, an object's values can be accessed using square brackets []\nand strings instead of dot notation:
// Run to the right.\ncat[\"x\"] += 5;\nThis syntax can be helpful when the key's name has spaces, as in\ncat['height (m)'].
- // Declare the variable data and assign it an object with three properties.
- let data = { x: 50, y: 50, d: 20 };
-
- function setup() {
- createCanvas(100, 100);
-
- describe('A white circle on a gray background.');
- }
-
- function draw() {
- background(200);
-
- // Access the object's values using the . operator.
- circle(data.x, data.y, data.d);
- }
-
-
- // Declare the variable data and assign it an object with three properties.
- let data = { x: 50, y: 50, d: 20 };
-
- // Add another property for color.
- data.color = 'deeppink';
-
- function setup() {
- createCanvas(100, 100);
-
- describe('A pink circle on a gray background.');
- }
-
- function draw() {
- background(200);
-
- // Access the object's values using the . operator.
- fill(data.color);
- circle(data.x, data.y, data.d);
- }
-
-
- // Declare the variable data and assign it an object with three properties.
- let data = { x: 50, y: 50, d: 20 };
-
- // Add another property for color.
- data.color = 'deeppink';
-
- function setup() {
- createCanvas(100, 100);
-
- describe('A white circle on a gray background.');
- }
-
- function draw() {
- background(200);
-
- // Access the object's values using the . operator.
- fill(data.color);
- circle(data.x, data.y, data.d);
-
- // Update the object's x and y properties.
- data.x += random(-1, 1);
- data.y += random(-1, 1);
- }
-
- Updates the canvas with the RGBA values in the - pixels array.
+ pixels array.updatePixels() only needs to be called after changing values
in the
- pixels array. Such changes can be made
+ pixels array. Such changes can be made
directly
- after calling loadPixels() or by
+ after calling loadPixels() or by
calling
- set().
vertex() sets the coordinates of vertices drawn between the
- beginShape() and
+ beginShape() and
- endShape() functions.
The first two parameters, x and y, set the x- and
y-coordinates of the
@@ -27,7 +27,7 @@ description: >
the u- and v-coordinates for the vertex’s texture when used with
- endShape(). By default, u
+ endShape(). By default, u
and v are both 0.
See setAttributes() for ways to +
See setAttributes() for ways to set the WebGL version.
diff --git a/src/content/reference/en/p5/width.mdx b/src/content/reference/en/p5/width.mdx index bb2562afaf..3d8272c816 100644 --- a/src/content/reference/en/p5/width.mdx +++ b/src/content/reference/en/p5/width.mdx @@ -9,11 +9,11 @@ description: >width's default value is 100. Calling
- createCanvas() or
+ createCanvas() or
- resizeCanvas() changes the value of
+ resizeCanvas() changes the value of
- width. Calling noCanvas()
+ width. Calling noCanvas()
sets its value to
0.
Note: Use mouseX to track the mouse’s +
Note: Use mouseX to track the mouse’s x-coordinate within the canvas.
line: 469 diff --git a/src/content/reference/en/p5/winMouseY.mdx b/src/content/reference/en/p5/winMouseY.mdx index adf128aa5b..2edb4c5926 100644 --- a/src/content/reference/en/p5/winMouseY.mdx +++ b/src/content/reference/en/p5/winMouseY.mdx @@ -21,7 +21,7 @@ description: > recent touch point. -Note: Use mouseY to track the mouse’s +
Note: Use mouseY to track the mouse’s y-coordinate within the canvas.
line: 510 diff --git a/src/content/reference/en/p5/windowHeight.mdx b/src/content/reference/en/p5/windowHeight.mdx index 0241e9a60d..7abd1919d0 100644 --- a/src/content/reference/en/p5/windowHeight.mdx +++ b/src/content/reference/en/p5/windowHeight.mdx @@ -8,7 +8,7 @@ description: > viewport.The layout viewport is the area within the browser that's available for drawing.
diff --git a/src/content/reference/en/p5/windowResized.mdx b/src/content/reference/en/p5/windowResized.mdx index 7f139afd50..4b384cf0aa 100644 --- a/src/content/reference/en/p5/windowResized.mdx +++ b/src/content/reference/en/p5/windowResized.mdx @@ -10,7 +10,7 @@ description: > browser window's size changes. It's a good place to call - resizeCanvas() or make other + resizeCanvas() or make other adjustments to accommodate the new window size. diff --git a/src/content/reference/en/p5/windowWidth.mdx b/src/content/reference/en/p5/windowWidth.mdx index 01100eb646..90ebb636aa 100644 --- a/src/content/reference/en/p5/windowWidth.mdx +++ b/src/content/reference/en/p5/windowWidth.mdx @@ -8,7 +8,7 @@ description: > viewport.The layout viewport is the area within the browser that's available for drawing.
diff --git a/src/content/tutorials/en/conditionals-and-interactivity.mdx b/src/content/tutorials/en/conditionals-and-interactivity.mdx index f2e930a068..b85c975f0d 100644 --- a/src/content/tutorials/en/conditionals-and-interactivity.mdx +++ b/src/content/tutorials/en/conditionals-and-interactivity.mdx @@ -10,8 +10,7 @@ relatedContent: examples: - en/11_3d/06_framebuffer_blur/description references: - - en/p5/if-else - - en/p5/boolean + - en/p5/if - en/p5/mouseispressed - en/p5/keycode - en/p5/circle diff --git a/src/content/tutorials/en/data-structure-garden.mdx b/src/content/tutorials/en/data-structure-garden.mdx index aed390faf9..9cc69a0ba5 100644 --- a/src/content/tutorials/en/data-structure-garden.mdx +++ b/src/content/tutorials/en/data-structure-garden.mdx @@ -12,9 +12,7 @@ relatedContent: - en/13_classes_and_objects/01_shake_ball_bounce/description - en/13_classes_and_objects/02_connected_particles/description references: - - en/console/log - en/p5/object - - en/p5/return - en/p5/random authors: - Portia Morrell diff --git a/src/content/tutorials/en/field-guide-to-debugging.mdx b/src/content/tutorials/en/field-guide-to-debugging.mdx index e2bf960732..9bcf3f8172 100644 --- a/src/content/tutorials/en/field-guide-to-debugging.mdx +++ b/src/content/tutorials/en/field-guide-to-debugging.mdx @@ -6,9 +6,6 @@ category: advanced categoryIndex: 0 featuredImage: ../images/featured/FieldGuide.png featuredImageAlt: "The title is “A Field Guide to Debugging!” and it features a black-and-white cartoon illustrations of insects, a mouse and a computer laptop in deep thought." -relatedContent: - references: - - en/console/log authors: - Nick McIntyre - Jason Alderman diff --git a/src/content/tutorials/en/how-to-optimize-your-sketches.mdx b/src/content/tutorials/en/how-to-optimize-your-sketches.mdx index 15363a47fc..02451e9ece 100644 --- a/src/content/tutorials/en/how-to-optimize-your-sketches.mdx +++ b/src/content/tutorials/en/how-to-optimize-your-sketches.mdx @@ -8,7 +8,6 @@ featuredImage: ../images/featured/OptimizeA.png featuredImageAlt: The bouncing particles animation used in this tutorial displays orange circles bouncing around a dark canvas. relatedContent: references: - - en/console/log - en/p5/framerate - en/p5/millis - en/p5/min diff --git a/src/content/tutorials/en/organizing-code-with-functions.mdx b/src/content/tutorials/en/organizing-code-with-functions.mdx index 2470107d38..846c8c4451 100644 --- a/src/content/tutorials/en/organizing-code-with-functions.mdx +++ b/src/content/tutorials/en/organizing-code-with-functions.mdx @@ -9,7 +9,6 @@ featuredImageAlt: A canvas displaying a snapshot of the sunrise animation from t relatedContent: references: - en/p5/function - - en/p5/return - en/p5/keypressed - en/p5/mousepressed authors: diff --git a/src/content/tutorials/en/variables-and-change.mdx b/src/content/tutorials/en/variables-and-change.mdx index e0c8661af3..d82c171efa 100644 --- a/src/content/tutorials/en/variables-and-change.mdx +++ b/src/content/tutorials/en/variables-and-change.mdx @@ -12,7 +12,6 @@ relatedContent: references: - en/p5/mousex - en/p5/mousey - - en/p5/types/string - en/p5/number - en/p5/let - en/p5/random diff --git a/src/scripts/builders/reference.ts b/src/scripts/builders/reference.ts index dd234d54d0..9661593086 100644 --- a/src/scripts/builders/reference.ts +++ b/src/scripts/builders/reference.ts @@ -43,6 +43,16 @@ export const buildReference = async () => { ...(await convertDocsToMDX(Object.values(parsedOutput.classitems))), ...(await convertDocsToMDX(Object.values(parsedOutput.classes))), ]; + + // Remove the old .mdx files so that reference items that no longer + // exist don't linger + const existing = await fs.readdir(prefix) + for (const f of existing) { + if ((await fs.lstat(path.join(prefix, f))).isDirectory()) { + await fs.rm(path.join(prefix, f), { recursive: true }); + } + } + // Save the MDX files to the file system await saveMDX(mdxDocs); console.log("Done building reference docs!"); diff --git a/src/scripts/utils.ts b/src/scripts/utils.ts index 17a8aa9939..93b7965931 100644 --- a/src/scripts/utils.ts +++ b/src/scripts/utils.ts @@ -5,6 +5,10 @@ import type { CopyOptions, Dirent } from "fs"; import { fileURLToPath } from "url"; import { rewriteRelativeLink } from "../pages/_utils-node"; +// This should correspond to the latest release tag name from +// https://github.com/processing/p5.js/releases. +export const latestRelease = "v1.10.0"; + /* Absolute path to the root of this project repo */ export const repoRootPath = path.join( path.dirname(fileURLToPath(import.meta.url)), @@ -42,6 +46,8 @@ export const cloneLibraryRepo = async ( "--depth", "1", "--filter=blob:none", + "--branch", + latestRelease ]); console.log("Repository cloned successfully."); await fixAbsolutePathInPreprocessor(localSavePath);