1.6.0 Release

[Qianqianye]

Topic

Hi all, we’d like to release p5.js 1.6.0 in February. Are there any specific issues we should resolve or any pull requests need to get merged before then?

Below are some issues we can focus our efforts on before the 1.6.0 release:

• Issues labeled 1.6.0 Milestone mostly focused on FES an accessibility (labeled a while ago, can be updated)
• Version 1.4.1 adds reserved function “size” #5753
• Clean-up logging in build scripts #5114
• accidental call to print() with no arguments crashes browser #2765

With a lot help from @davepagurek, we recently organized most of the WebGL issues to this p5.js WebGL Project page, so we can better track the issues. Please let us know if we should resolve certain WebGL issues for the upcoming release. Thank you!

@limzykenneth @davepagurek @stalgiag @aferriss @almchung @outofambit

[inaridarkfox4231]

Excuse me. It's going to be a personal matter, but I have an issue that I would like you to take up, so I would like to explain it.
Check out the sketch below.
minimum_bug_demo

// version p5.js/1.5.0
function setup() {
  createCanvas(400, 400, WEBGL);
  const geom = new p5.Geometry();
  geom.vertices.push(
    createVector(-100,-100), createVector(100,-100),
    createVector(100,100), createVector(-100,100)
  );
  geom.faces.push([0,1,2],[0,2,3]);
  geom.computeNormals();
  this._renderer.createBuffers("myPlane", geom);
  
  const gr = createGraphics(100,100);
  gr.background(255);

  background(0);
  texture(gr);
  triangle(-200,-200,0,-200,0,0);

  directionalLight(255,255,255,0,0,-1);
  ambientLight(64);
  ambientMaterial(255);
  fill(0,0,255);
  this._renderer.drawBuffers("myPlane");
}

This program draws texture-colored triangles, then p5.Geometry squares with lighting enabled. The result should look something like this:

But on my smartphone (Android 12) the square disappears like this:

Also, I believe this update will implement per-vertex coloring, but if it does, my Android smartphone probably won't show the central red sphere in the next sketch.
minimun_colorVertex_bug

// version p5.js/1.6.0(?)
function setup() {
  createCanvas(400, 400, WEBGL);
  
  const gr = createGraphics(400, 400);
  gr.background(255);
  
  image(gr, -200, -200);
  fill(255, 0, 0);
  directionalLight(255,255,255,0,0,-1);
  ambientLight(64);
  ambientMaterial(255);
  sphere(80);
}

I think this is because the registers reserved for attributes not used by the shader are not disabled.
I'm thinking of filing an issue about this. And I would like to solve it if possible.

[davepagurek]

Just tried to verify those issues, thanks @inaridarkfox4231 for reporting them!

The first bug seems to occur on both desktop and mobile for me, although it also occurs even when I rewind the p5 version back to 1.0.0. So it's not a regression, if that helps with finding the cause / deciding how to prioritize the fix.

When using a build off of main, the second example works for me: https://editor.p5js.org/davepagurek/sketches/zxsziaJsf

[inaridarkfox4231]

thank you for your reply! I just tried it on my Android, no good, the fill instruction didn't work.

That's why I raised an issue earlier, but when I tried the implementation proposed in it, this sketch was properly red even on Android:
colorVertexBug_resolve

[davepagurek]

ah seems like it's Firefox on android that was working for me, switching mobile browsers to Chrome shows me the same result as you (even on desktop!) agreed, we should fix #5968 before releasing, as this second case is a regression from before.

[ffd8]

It would be amazing if #4564 could be resolved and implemented for the next version!

Over the summer I developed a workflow for using p5.js within AR posters using MindAR which is based on A-Frame + three.js. For the workflow, it requires having an existing canvas element that can be used within A-Frame as a textured plane. p5.js createGraphics() function currently creates its own canvas and doesn't allow one to tell it where to draw the contents it has in buffer (same issue for createCanvas() can tell it a div, but not existing canvas?). The proposed PR mentioned here solved this problem very easily. For the project, I tweaked my offline copy of 1.4.1, adding that 4th optional parameter suggested by @valentinptc .

I've been meaning to make some sort of 'walk through' post about how to use p5.js as a generative AR framework since finishing the project, but laaacked the time. In a week we'll give a workshop at our institute on this workflow and I'll have prepared a handful of open-source tutorials for the participants to use. At the moment we'll use a patched copy of p5.js (will do it again for 1.5), but it would be amazing if this could find it's way into 1.6! It doesn't have any conflicts, as it's a minor tweak.

How would it add to accessibility? I could imagine there's quite a few instances where one may want to put a p5.js createGraphics() layer/buffer into a separate pre-defined canvas, be it for subtitles or synchronous graphics across a website, etc. It would allow one to create an array of canvases with p5.js content, all running from a single sketch.

Thanks for considering!

PS, you can test out the AR here:
https://6beine.umweltausstellungen.ch/

And have it look at this image:

[Ucodia]

Added potential solutions and ways forward concerning print() issue #2765

[limzykenneth]

@Qianqianye As 1.6.0 has just been released, should we close this and open a new one for 1.6.1 or keep this for 1.6.1?

[Qianqianye]

Thanks @limzykenneth for the reminder. I have added issue #4564 and #2765 in milestone 1.6.1 . @ffd8 and @Ucodia, we will aim to resolve the issues before the next release. Thank you!