Merge branch 'main' into imageLight

Author: AryanKoundal

package-lock.json

@@ -174,7 +174,7 @@ p5.prototype.buildGeometry = function(callback) {
  * from <a href="#/p5/loadModel">loadModel()</a>.
  *
  * @method freeGeometry
- * @param {p5.Geometry} The geometry whose resources should be freed
+ * @param {p5.Geometry} geometry The geometry whose resources should be freed
  */
 p5.prototype.freeGeometry = function(geometry) {
   this._renderer._freeBuffers(geometry.gid);

src/webgl/3d_primitives.js

@@ -126,21 +126,6 @@ class GeometryBuilder {
    */
   finish() {
     this.renderer._pInst.pop();
-
-    // If all vertices are the same color (no per-vertex colors were
-    // supplied), remove the vertex color data so that one may override the
-    // fill when drawing the geometry with `model()`
-    let allVertexColorsSame = true;
-    for (let i = 4; i < this.geometry.vertexColors.length; i++) {
-      if (this.geometry.vertexColors[i] !== this.geometry.vertexColors[i % 4]) {
-        allVertexColorsSame = false;
-        break;
-      }
-    }
-    if (allVertexColorsSame) {
-      this.geometry.vertexColors = [];
-    }
-
     return this.geometry;
   }
 }

src/webgl/GeometryBuilder.js

@@ -1946,12 +1946,12 @@ p5.Camera = class Camera {
   // @TODO: combine this function with _setDefaultCamera to compute these values
   // as-needed
   _computeCameraDefaultSettings() {
-    this.defaultCameraFOV = 60 / 180 * Math.PI;
     this.defaultAspectRatio = this._renderer.width / this._renderer.height;
     this.defaultEyeX = 0;
     this.defaultEyeY = 0;
-    this.defaultEyeZ =
-      this._renderer.height / 2.0 / Math.tan(this.defaultCameraFOV / 2.0);
+    this.defaultEyeZ = 800;
+    this.defaultCameraFOV =
+      2 * Math.atan(this._renderer.height / 2 / this.defaultEyeZ);
     this.defaultCenterX = 0;
     this.defaultCenterY = 0;
     this.defaultCenterZ = 0;
@@ -1986,12 +1986,9 @@ p5.Camera = class Camera {
     // If we're using the default camera, update the aspect ratio
     if (this.cameraType === 'default') {
       this._computeCameraDefaultSettings();
-      this._setDefaultCamera();
-    } else {
-      this.perspective(
-        this.cameraFOV,
-        this._renderer.width / this._renderer.height
-      );
+      this.cameraFOV = this.defaultCameraFOV;
+      this.aspectRatio = this.defaultAspectRatio;
+      this.perspective();
     }
   }
 

src/webgl/p5.Camera.js

@@ -33,30 +33,8 @@ class FramebufferCamera extends p5.Camera {
   _computeCameraDefaultSettings() {
     super._computeCameraDefaultSettings();
     this.defaultAspectRatio = this.fbo.width / this.fbo.height;
-    this.defaultEyeZ =
-      this.fbo.height / 2.0 / Math.tan(this.defaultCameraFOV / 2.0);
-    this.defaultCameraNear = this.defaultEyeZ * 0.1;
-    this.defaultCameraFar = this.defaultEyeZ * 10;
-  }
-
-  /**
-   * Resets the camera to a default perspective camera sized to match
-   * the p5.Framebuffer it is attached to.
-   *
-   * @method resize
-   * @private
-   */
-  _resize() {
-    // If we're using the default camera, update the aspect ratio
-    if (this.cameraType === 'default') {
-      this._computeCameraDefaultSettings();
-      this._setDefaultCamera();
-    } else {
-      this.perspective(
-        this.cameraFOV,
-        this.fbo.width / this.fbo.height
-      );
-    }
+    this.defaultCameraFOV =
+      2 * Math.atan(this.fbo.height / 2 / this.defaultEyeZ);
   }
 }
 

src/webgl/p5.Framebuffer.js

@@ -18,9 +18,9 @@ import p5 from '../core/main';
  * @param {function} [callback] function to call upon object instantiation.
  */
 p5.Geometry = class Geometry {
-  constructor(detailX, detailY, callback){
-  //an array containing every vertex
-  //@type [p5.Vector]
+  constructor(detailX, detailY, callback) {
+    //an array containing every vertex
+    //@type [p5.Vector]
     this.vertices = [];
 
     //an array containing every vertex for stroke drawing
@@ -87,7 +87,60 @@ p5.Geometry = class Geometry {
 
     this.dirtyFlags = {};
   }
-
+  /**
+   * Removes the internal colors of p5.Geometry.
+   * Using `clearColors()`, you can use `fill()` to supply new colors before drawing each shape.
+   * If `clearColors()` is not used, the shapes will use their internal colors by ignoring `fill()`.
+   *
+   * @method clearColors
+   *
+   * @example
+   * <div>
+   * <code>
+   * let shape01;
+   * let shape02;
+   * let points = [];
+   *
+   * function setup() {
+   *   createCanvas(600, 600, WEBGL);
+   *   points.push(new p5.Vector(-1, -1, 0), new p5.Vector(-1, 1, 0),
+   *     new p5.Vector(1, -1, 0), new p5.Vector(-1, -1, 0));
+   *   buildShape01();
+   *   buildShape02();
+   * }
+   * function draw() {
+   *   background(0);
+   *   fill('pink'); // shape01 retains its internal blue color, so it won't turn pink.
+   *   model(shape01);
+   *   fill('yellow'); // Now, shape02 is yellow.
+   *   model(shape02);
+   * }
+   *
+   * function buildShape01() {
+   *   beginGeometry();
+   *   fill('blue'); // shape01's color is blue because its internal colors remain.
+   *   beginShape();
+   *   for (let vec of points) vertex(vec.x * 100, vec.y * 100, vec.z * 100);
+   *   endShape(CLOSE);
+   *   shape01 = endGeometry();
+   * }
+   *
+   * function buildShape02() {
+   *   beginGeometry();
+   *   fill('red');  // shape02.clearColors() removes its internal colors. Now, shape02 is red.
+   *   beginShape();
+   *   for (let vec of points) vertex(vec.x * 200, vec.y * 200, vec.z * 200);
+   *   endShape(CLOSE);
+   *   shape02 = endGeometry();
+   *   shape02.clearColors(); // Resets shape02's colors.
+   * }
+   * </code>
+   * </div>
+   */
+  clearColors() {
+    this.vertexColors = [];
+    return this;
+  }
   /**
  * computes faces for geometry objects based on the vertices.
  * @method computeFaces
@@ -111,7 +164,7 @@ p5.Geometry = class Geometry {
   }
 
   _getFaceNormal(faceId) {
-  //This assumes that vA->vB->vC is a counter-clockwise ordering
+    //This assumes that vA->vB->vC is a counter-clockwise ordering
     const face = this.faces[faceId];
     const vA = this.vertices[face[0]];
     const vB = this.vertices[face[1]];
@@ -196,7 +249,7 @@ p5.Geometry = class Geometry {
  * @chainable
  */
   averagePoleNormals() {
-  //average the north pole
+    //average the north pole
     let sum = new p5.Vector(0, 0, 0);
     for (let i = 0; i < this.detailX; i++) {
       sum.add(this.vertexNormals[i]);
@@ -507,7 +560,7 @@ p5.Geometry = class Geometry {
  */
   normalize() {
     if (this.vertices.length > 0) {
-    // Find the corners of our bounding box
+      // Find the corners of our bounding box
       const maxPosition = this.vertices[0].copy();
       const minPosition = this.vertices[0].copy();
 

src/webgl/p5.Geometry.js

@@ -169,9 +169,9 @@ void main() {
         // find where the lines intersect to find the elbow of the join
         vec2 c = (posp.xy/posp.w + vec2(1.,1.)) * 0.5 * uViewport.zw;
         vec2 intersection = lineIntersection(
-          c + (side * normalIn * uStrokeWeight / 2.) * curPerspScale,
+          c + (side * normalIn * uStrokeWeight / 2.),
           tangentIn,
-          c + (side * normalOut * uStrokeWeight / 2.) * curPerspScale,
+          c + (side * normalOut * uStrokeWeight / 2.),
           tangentOut
         );
         offset = (intersection - c);
@@ -186,9 +186,9 @@ void main() {
           offset *= maxMag / mag;
         }
       } else if (sideEnum == 1.) {
-        offset = side * normalIn * curPerspScale * uStrokeWeight / 2.;
+        offset = side * normalIn * uStrokeWeight / 2.;
       } else if (sideEnum == 3.) {
-        offset = side * normalOut * curPerspScale * uStrokeWeight / 2.;
+        offset = side * normalOut * uStrokeWeight / 2.;
       }
     }
     if (uStrokeJoin == STROKE_JOIN_BEVEL) {
@@ -207,12 +207,12 @@ void main() {
     // extends out from the line
     float tangentOffset = abs(aSide) - 1.;
     offset = (normal * normalOffset + tangent * tangentOffset) *
-      uStrokeWeight * 0.5 * curPerspScale;
+      uStrokeWeight * 0.5;
     vMaxDist = uStrokeWeight / 2.;
   }
-  vPosition = vCenter + offset / curPerspScale;
+  vPosition = vCenter + offset;
 
-  gl_Position.xy = p.xy + offset.xy;
+  gl_Position.xy = p.xy + offset.xy * curPerspScale;
   gl_Position.zw = p.zw;
 
   vColor = (uUseLineColor ? aVertexColor : uMaterialColor);