Support noiseDetail in p5.strands

[davepagurek]

Increasing access

In p5.js, the fractal application of noise() is controlled by noiseDetail(). Inside of p5.strands, we now also support noise(), but confusingly to newcomers, noiseDetail() will not affect it. To make this aspect of p5.strands shaders as approachable as possible, we should make the noise behaviour of regular p5 also work in p5.strands.

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

In p5, parameters of noise are currently set via noiseDetail.. There is some discussion in #7430 about possible changes to that behaviour in the future, but whatever the current state of noiseDetail is, we should match that behaviour in p5.strands.

noiseDetail sets a falloff multiplier and number of octaves. In p5.strands, these values are currently hardcoded in our GLSL implementation:

p5.js/src/webgl/shaders/functions/noise3DGLSL.glsl

Lines 97 to 105 in 6c6ac6c

	float result = 0.0;
	float amplitude = 1.0;
	float frequency = 1.0;
	for (int i = 0; i < 4; i++) {
	result += amplitude * baseNoise(st * frequency);
	frequency *= 2.0;
	amplitude *= 0.5;
	}

To make this work correctly, we'll need to dynamically pass in those values from p5 as an argument. Currently, we translate users' arguments into a single vec3 input. Maybe what we need to do it, at the time we do this, grab the current noise falloff and octaves, and pass those in as additional parameters?

[hxrshxz]

Hey @davepagurek I would love to work on this issue , Can you assign me this, thanks

[davepagurek]

Thanks @hxrshxz!