Merge branch 'dev-2.0' into fix/strands-branching

Author: davepagurek

src/type/textCore.js

@@ -24,6 +24,7 @@ function textCore(p5, fn) {
   const LinebreakRe = /\r?\n/g;
   const CommaDelimRe = /,\s+/;
   const QuotedRe = /^".*"$/;
+  const SpecialCharRe = /[^\x00-\x7F]/; // Non-ascii
   const TabsRe = /\t/g;
 
   const FontVariationSettings = 'fontVariationSettings';
@@ -2425,7 +2426,7 @@ function textCore(p5, fn) {
     let parts = familyStr.split(CommaDelimRe);
     let family = parts.map(part => {
       part = part.trim();
-      if (part.indexOf(' ') > -1 && !QuotedRe.test(part)) {
+      if ((part.indexOf(' ') > -1 || SpecialCharRe.test(part)) && !QuotedRe.test(part)) {
         part = `"${part}"`; // quote font names with spaces
       }
       return part;

src/webgl/p5.RendererGL.js

@@ -257,6 +257,7 @@ class RendererGL extends Renderer3D {
        }
     } else if (this._curShader.shaderType === 'text') {
       // Text rendering uses a fixed quad geometry with 6 indices
+      this._bindBuffer(glBuffers.indexBuffer, gl.ELEMENT_ARRAY_BUFFER);
       gl.drawElements(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0);
     } else if (glBuffers.indexBuffer) {
       this._bindBuffer(glBuffers.indexBuffer, gl.ELEMENT_ARRAY_BUFFER);
@@ -1049,7 +1050,8 @@ class RendererGL extends Renderer3D {
     const gl = this.GL;
 
     if (indices) {
-      const buffer = gl.createBuffer();
+      let buffer = buffers.indexBuffer;
+      if (!buffer) buffer = gl.createBuffer();
       this._bindBuffer(buffer, gl.ELEMENT_ARRAY_BUFFER, indices, indexType);
 
       buffers.indexBuffer = buffer;

src/webgl/text.js

@@ -766,6 +766,7 @@ function text(p5, fn) {
 
     // this will have to do for now...
     sh.setUniform('uMaterialColor', curFillColor);
+    this._disableRemainingAttributes(sh);
     this._beforeDrawText();
     this.glyphDataCache = this.glyphDataCache || new Set();
 

test/unit/visual/cases/typography.js

@@ -43,6 +43,22 @@ visualSuite('Typography', function () {
       screenshot();
     });
 
+    visualTest('with a font file and special chars', async function (p5, screenshot) {
+      p5.createCanvas(100, 100, p5.WEBGL);
+      const font = await p5.loadFont(
+        '/unit/assets/Inconsolata-Bold.ttf',
+        'Incönsolata'
+      );
+      p5.textFont(font);
+      p5.textAlign(p5.CENTER, p5.CENTER);
+      p5.textSize(35);
+      p5.text('p5*js', 0, 0);
+      p5.noFill();
+      p5.rectMode(p5.CENTER);
+      p5.rect(0, 0, p5.fontWidth('p5*js'), p5.textLeading());
+      screenshot();
+    });
+
     visualTest('with a woff font file', async function (p5, screenshot) {
       p5.createCanvas(100, 100);
       const font = await p5.loadFont(

test/unit/visual/cases/webgl.js

@@ -790,6 +790,33 @@ visualSuite('WebGL', function() {
 
       screenshot();
     });
+
+    visualTest('text renders correctly after geometry with many indices', async (p5, screenshot) => {
+      p5.createCanvas(100, 100, p5.WEBGL);
+      const font = await p5.loadFont(
+        '/unit/assets/Inconsolata-Bold.ttf'
+      );
+
+      p5.background(255);
+      p5.noStroke();
+
+      p5.textFont(font);
+      p5.textSize(20);
+      p5.textAlign(p5.CENTER, p5.CENTER);
+      p5.text('Test 1', 0, -20);
+
+      // Draw a sphere which has many more indices than text
+      p5.fill(200, 200, 255);
+      p5.sphere(30);
+
+      p5.clearDepth();
+
+      // Draw text - should bind its own index buffer
+      p5.fill(0);
+      p5.text('Test 2', 0, 20);
+
+      screenshot();
+    });
   });
 
   visualSuite('texture()', () => {

test/unit/visual/screenshots/Typography/textFont/with a font file and special chars/000.png

@@ -0,0 +1,3 @@
+{
+  "numScreenshots": 1
+}

test/unit/visual/screenshots/Typography/textFont/with a font file and special chars/metadata.json

@@ -0,0 +1,3 @@
+{
+  "numScreenshots": 1
+}