[p5.strands] Support p5 global properties in p5.strands

[davepagurek]

Increasing access

Currently, to use something like width or mouseX in a p5.strands shader, users will need to manually create a uniform and use that, e.g.:

const myMouseX = uniformFloat(() => mouseX)

This is different for how you'd use those properties in the rest of p5 and introduces a number of new concepts to do so, so it would smooth usage out a lot of we could remove that need.

Most appropriate sub-area of p5.js?

• Accessibility
• Color
• Core/Environment/Rendering
• Data
• DOM
• Events
• Image
• IO
• Math
• Typography
• Utilities
• WebGL
• Build process
• Unit testing
• Internationalization
• Friendly errors
• Other (specify if possible)

Feature enhancement details

Similar to how, while p5.strands is active, we replace the implementation of functions like noise to use a p5.strands version, while p5.strands is active, we could also replace the usage of properties like width and mouseX to be special strands nodes instead of just values. For each of these, when we detect it's being used, we can add it to a list of uniforms and give it a callback returning the global value, and return a strands node referencing that uniform. Then, users could just use those values directly in their shaders without needing to create uniforms themselves.

[avinxshKD]

@davepagurek I would like to work on this. Please assign it to me. Thanks

[davepagurek]

Thanks @avinxshKD!