Merge branch 'dev-2.0' into fix-buildGeometry-docs-links

Author: davepagurek

src/core/p5.Renderer3D.js

@@ -160,6 +160,7 @@ export class Renderer3D extends Renderer {
 
     // clipping
     this._clipDepths = [];
+    this._textContextSavedStack = [];
     this._isClipApplied = false;
     this._stencilTestOn = false;
 
@@ -221,6 +222,8 @@ export class Renderer3D extends Renderer {
     // Used by beginShape/endShape functions to construct a p5.Geometry
     this.shapeBuilder = new ShapeBuilder(this);
 
+    this._largeTessellationAcknowledged = false;
+
     this.geometryBufferCache = new GeometryBufferCache(this);
 
     this.curStrokeCap = constants.ROUND;
@@ -1323,13 +1326,25 @@ export class Renderer3D extends Renderer {
     return this;
   }
 
+  push() {
+    super.push()
+    const saved = !!(this.states.textFont?.font);
+    if (saved) {
+      this.textDrawingContext().save()
+    }
+    this._textContextSavedStack.push(saved);
+  }
+
   pop(...args) {
     if (
       this._clipDepths.length > 0 &&
       this._pushPopDepth === this._clipDepths[this._clipDepths.length - 1]
     ) {
       this._clearClip();
     }
+    if (this._textContextSavedStack.pop()) {
+      this.textDrawingContext().restore()
+    }
     super.pop(...args);
     this._applyStencilTestIfClipping();
   }
@@ -1991,6 +2006,10 @@ const webGPUAddonMessage = 'Add the WebGPU add-on to your project and pass WEBGP
 function renderer3D(p5, fn) {
   p5.Renderer3D = Renderer3D;
 
+  ShapeBuilder.prototype.friendlyErrorsDisabled = function() {
+    return Boolean(p5.disableFriendlyErrors);
+  };
+
   /**
    * Creates a <a href="#/p5/p5.StorageBuffer">`p5.StorageBuffer`</a>, which is
    * a block of data that shaders can read from, and compute shaders

src/strands/strands_transpiler.js

@@ -235,6 +235,35 @@ function replaceReferences(node, tempVarMap) {
   internalReplaceReferences(node);
 }
 
+// Shared handler for both BinaryExpression and LogicalExpression —
+// both follow the same operator-to-method-call transformation pattern.
+function transformBinaryOrLogical(node, state, ancestors) {
+  if (ancestors.some(a => nodeIsUniform(a) || nodeIsUniformCallbackFn(a, state.uniformCallbackNames))) {
+    return;
+  }
+  const unsafeTypes = ['Literal', 'ArrayExpression', 'Identifier'];
+  if (unsafeTypes.includes(node.left.type)) {
+    node.left = {
+      type: 'CallExpression',
+      callee: {
+        type: 'Identifier',
+        name: '__p5.strandsNode',
+      },
+      arguments: [node.left]
+    };
+  }
+  node.type = 'CallExpression';
+  node.callee = {
+    type: 'MemberExpression',
+    object: node.left,
+    property: {
+      type: 'Identifier',
+      name: replaceBinaryOperator(node.operator),
+    },
+  };
+  node.arguments = [node.right];
+}
+
 const ASTCallbacks = {
   UnaryExpression(node, state, ancestors) {
     if (ancestors.some(a => nodeIsUniform(a) || nodeIsUniformCallbackFn(a, state.uniformCallbackNames))) {
@@ -509,72 +538,10 @@ const ASTCallbacks = {
       }
     }
   },
-  BinaryExpression(node, state, ancestors) {
-    // Don't convert uniform default values to node methods, as
-    // they should be evaluated at runtime, not compiled.
-    if (ancestors.some(a => nodeIsUniform(a) || nodeIsUniformCallbackFn(a, state.uniformCallbackNames))) {
-      return;
-    }
-    // If the left hand side of an expression is one of these types,
-    // we should construct a node from it.
-    const unsafeTypes = ['Literal', 'ArrayExpression', 'Identifier'];
-    if (unsafeTypes.includes(node.left.type)) {
-      const leftReplacementNode = {
-        type: 'CallExpression',
-        callee: {
-          type: 'Identifier',
-          name: '__p5.strandsNode',
-        },
-        arguments: [node.left]
-      }
-      node.left = leftReplacementNode;
-    }
-    // Replace the binary operator with a call expression
-    // in other words a call to BaseNode.mult(), .div() etc.
-    node.type = 'CallExpression';
-    node.callee = {
-      type: 'MemberExpression',
-      object: node.left,
-      property: {
-        type: 'Identifier',
-        name: replaceBinaryOperator(node.operator),
-      },
-    };
-    node.arguments = [node.right];
-  },
-  LogicalExpression(node, state, ancestors) {
-    // Don't convert uniform default values to node methods, as
-    // they should be evaluated at runtime, not compiled.
-    if (ancestors.some(a => nodeIsUniform(a) || nodeIsUniformCallbackFn(a, state.uniformCallbackNames))) {
-      return;
-    }
-    // If the left hand side of an expression is one of these types,
-    // we should construct a node from it.
-    const unsafeTypes = ['Literal', 'ArrayExpression', 'Identifier'];
-    if (unsafeTypes.includes(node.left.type)) {
-      const leftReplacementNode = {
-        type: 'CallExpression',
-        callee: {
-          type: 'Identifier',
-          name: '__p5.strandsNode',
-        },
-        arguments: [node.left]
-      }
-      node.left = leftReplacementNode;
-    }
-    // Replace the logical operator with a call expression
-    // in other words a call to BaseNode.or(), .and() etc.
-    node.type = 'CallExpression';
-    node.callee = {
-      type: 'MemberExpression',
-      object: node.left,
-      property: {
-        type: 'Identifier',
-        name: replaceBinaryOperator(node.operator),
-      },
-    };
-    node.arguments = [node.right];
-  },
+  BinaryExpression: transformBinaryOrLogical,
+  LogicalExpression: transformBinaryOrLogical,
+
+
   ConditionalExpression(node, state, ancestors) {
     if (ancestors.some(a => nodeIsUniform(a) || nodeIsUniformCallbackFn(a, state.uniformCallbackNames))) {
       return;

src/type/textCore.js

@@ -1587,13 +1587,6 @@ function textCore(p5, fn) {
     if (typeof weight === 'number') {
       this.states.setValue('fontWeight', weight);
       this._applyTextProperties();
-
-      // Safari works without weight set in the canvas style attribute, and actually
-      // has buggy behavior if it is present, using the wrong weight when drawing
-      // multiple times with different weights
-      if (!p5.prototype._isSafari()) {
-        this._setCanvasStyleProperty('font-variation-settings', `"wght" ${weight}`);
-      }
       return;
     }
     // the getter

src/webgl/3d_primitives.js

@@ -1792,33 +1792,38 @@ function primitives3D(p5, fn){
       const prevMode = this.states.textureMode;
       this.states.setValue('textureMode', constants.NORMAL);
       const prevOrder = this.bezierOrder();
-      this.bezierOrder(2);
+      this.bezierOrder(3);
       this.beginShape();
       const addUVs = (x, y) => [x, y, 0, (x - x1)/width, (y - y1)/height];
+      const rr = 0.5523; // kappa: 4*(sqrt(2)-1)/3, handle ratio for cubic bezier circle approximation
       if (tr !== 0) {
         this.vertex(...addUVs(x2 - tr, y1));
-        this.bezierVertex(...addUVs(x2, y1));
+        this.bezierVertex(...addUVs(x2 - tr + tr * rr, y1));
+        this.bezierVertex(...addUVs(x2, y1 + tr - tr * rr));
         this.bezierVertex(...addUVs(x2, y1 + tr));
       } else {
         this.vertex(...addUVs(x2, y1));
       }
       if (br !== 0) {
         this.vertex(...addUVs(x2, y2 - br));
-        this.bezierVertex(...addUVs(x2, y2));
+        this.bezierVertex(...addUVs(x2, y2 - br + br * rr));
+        this.bezierVertex(...addUVs(x2 - br + rr * br, y2));
         this.bezierVertex(...addUVs(x2 - br, y2));
       } else {
         this.vertex(...addUVs(x2, y2));
       }
       if (bl !== 0) {
         this.vertex(...addUVs(x1 + bl, y2));
-        this.bezierVertex(...addUVs(x1, y2));
+        this.bezierVertex(...addUVs(x1 + bl - bl * rr, y2));
+        this.bezierVertex(...addUVs(x1, y2 - bl + bl * rr));
         this.bezierVertex(...addUVs(x1, y2 - bl));
       } else {
         this.vertex(...addUVs(x1, y2));
       }
       if (tl !== 0) {
         this.vertex(...addUVs(x1, y1 + tl));
-        this.bezierVertex(...addUVs(x1, y1));
+        this.bezierVertex(...addUVs(x1, y1 + tl - tl * rr));
+        this.bezierVertex(...addUVs(x1 + tl - tl * rr, y1));
         this.bezierVertex(...addUVs(x1 + tl, y1));
       } else {
         this.vertex(...addUVs(x1, y1));

src/webgl/ShapeBuilder.js

@@ -45,6 +45,10 @@ export class ShapeBuilder {
     this.bufferStrides = { ...INITIAL_BUFFER_STRIDES };
   }
 
+  friendlyErrorsDisabled() {
+    return false;
+  }
+
   constructFromContours(shape, contours) {
     if (this._useUserVertexProperties){
       this._resetUserVertexProperties();
@@ -148,6 +152,27 @@ export class ShapeBuilder {
     }
 
     if (this.shapeMode === constants.PATH) {
+      const vertexCount = this.geometry.vertices.length;
+      const MAX_SAFE_TESSELLATION_VERTICES = 50000;
+
+      if (
+        vertexCount > MAX_SAFE_TESSELLATION_VERTICES &&
+        !this.friendlyErrorsDisabled() &&
+        !this.renderer._largeTessellationAcknowledged
+      ) {
+        const proceed = window.confirm(
+          '🌸 p5.js says:\n\n' +
+          `This shape has ${vertexCount} vertices. Tessellating shapes with this ` +
+          'many vertices can be very slow and may cause your browser to become ' +
+          'unresponsive.\n\n' +
+          'Do you want to continue tessellating this shape?'
+        );
+        if (!proceed) {
+          return;
+        }
+        this.renderer._largeTessellationAcknowledged = true;
+      }
+
       this.isProcessingVertices = true;
       this._tesselateShape();
       this.isProcessingVertices = false;