Merge pull request #8086 from Nitin2332/reference-fix-2.0

reference-fix-2.0

Author: perminder-17

src/color/setting.js

@@ -439,6 +439,11 @@ function setting(p5, fn){
    * in RGB values. Calling `background(255, 204, 0)` sets the background a bright
    * yellow color.
    *
+   * The version of `background()` with four parameters interprets them as RGBA,
+   * HSBA, or HSLA colors, depending on the current
+   * <a href="#/p5/colorMode">colorMode()</a>. The last parameter sets the alpha
+   * (transparency) value.
+   *
    * @method background
    * @param {p5.Color} color  any value created by the <a href="#/p5/color">color()</a> function
    * @chainable
@@ -487,6 +492,19 @@ function setting(p5, fn){
    * function setup() {
    *   createCanvas(100, 100);
    *
+   * // R, G, B, and Alpha values.
+   *   background(255, 0, 0, 128);
+   *
+   *   describe('A canvas with a semi-transparent red background.');
+   * }
+   * </code>
+   * </div>
+   *
+   * <div>
+   * <code>
+   * function setup() {
+   *   createCanvas(100, 100);
+   *
    *   // Use HSB color.
    *   colorMode(HSB);
    *
@@ -1213,6 +1231,10 @@ function setting(p5, fn){
    * <a href="#/p5/colorMode">colorMode()</a>. The default color space is RGB,
    * with each value in the range from 0 to 255.
    *
+   * The version of `fill()` with four parameters interprets them as `RGBA`, `HSBA`,
+   * or `HSLA` colors, depending on the current <a href="#/p5/colorMode">colorMode()</a>. The last parameter
+   * sets the alpha (transparency) value.
+   *
    * @method fill
    * @param  {Number}        v1      red value if color mode is RGB or hue value if color mode is HSB.
    * @param  {Number}        v2      green value if color mode is RGB or saturation value if color mode is HSB.
@@ -1257,6 +1279,22 @@ function setting(p5, fn){
    * function setup() {
    *   createCanvas(100, 100);
    *
+   *   background(200);
+   *
+   *   // R, G, B, and Alpha values.
+   *   fill(255, 0, 0, 128);
+   *   square(20, 20, 60);
+   *
+   *   describe('A semi-transparent red square with a black outline.');
+   * }
+   * </code>
+   * </div>
+   *
+   * <div>
+   * <code>
+   * function setup() {
+   *   createCanvas(100, 100);
+   *
    *   background(100);
    *
    *   // Use HSB color.
@@ -1551,7 +1589,7 @@ function setting(p5, fn){
    * Sets the color used to draw points, lines, and the outlines of shapes.
    *
    * Calling `stroke(255, 165, 0)` or `stroke('orange')` means all shapes drawn
-   * after calling `stroke()` will be filled with the color orange. The way
+   * after calling `stroke()` will be outlined with the color orange. The way
    * these parameters are interpreted may be changed with the
    * <a href="#/p5/colorMode">colorMode()</a> function.
    *

src/core/transform.js

@@ -1180,7 +1180,7 @@ function transform(p5, fn){
    * function draw() {
    *   background(200);
    *
-   *   // Shear the coordinate system along the x-axis.
+   *   // Shear the coordinate system along the y-axis.
    *   shearY(QUARTER_PI);
    *
    *   // Draw the square.
@@ -1203,7 +1203,7 @@ function transform(p5, fn){
    * function draw() {
    *   background(200);
    *
-   *   // Shear the coordinate system along the x-axis.
+   *   // Shear the coordinate system along the y-axis.
    *   shearY(45);
    *
    *   // Draw the square.

src/shape/vertex.js

@@ -763,6 +763,37 @@ function vertex(p5, fn){
    * <div>
    * <code>
    * function setup() {
+   *   createCanvas(200, 100);
+   *
+   *   background(240);
+   *
+   *   noFill();
+   *   stroke(0);
+   *
+   *   // Open shape (left)
+   *   beginShape();
+   *   vertex(20, 20);
+   *   vertex(80, 20);
+   *   vertex(80, 80);
+   *   endShape();  // Not closed
+   *
+   *   // Closed shape (right)
+   *   beginShape();
+   *   vertex(120, 20);
+   *   vertex(180, 20);
+   *   vertex(180, 80);
+   *   endShape(CLOSE);  // Closed
+   *
+   *   describe(
+   *     'Two right-angled shapes on a light gray background. The left shape is open with three lines. The right shape is closed, forming a triangle.'
+   *   );
+   * }
+   * </code>
+   * </div>
+   *
+   * <div>
+   * <code>
+   * function setup() {
    *   createCanvas(100, 100);
    *   background(200);
    *