Quadtree with Noise Mask

2024-05-13 16:37 UTC gpt-4 Open in ChatGPT ↗

I’m using this glsl shader in touchdesigner to create a quadtree effect. I’d now like to define where the subdivions are happening based on a black and white noise mask, here’s the code:

// Probabilistic quadtree filter

// Reference: // https://ciphrd.com/2020/04/02/building-a-quadtree-filter-in-glsl-using-a-probabilistic-approach/

// the number of divisions at the start //#define MIN_DIVISIONS 4.7 uniform float MIN_DIVISIONS;

// the numer of possible quad divisions //#define MAX_ITERATIONS 6 uniform int MAX_ITERATIONS;

// the number of samples picked fter each quad division #define SAMPLES_PER_ITERATION 30 #define F_SAMPLES_PER_ITERATION 30.

// useless, kept it for reference for a personal usage #define MAX_SAMPLES 200

// threshold min, max given the variance threshold (not mouse.x) #define THRESHOLD_MIN 0.0001 #define THRESHOLD_MAX 0.01

// uniform float exampleUniform;

uniform vec2 iResolution; uniform float varianceThreshold;

out vec4 fragColor;

// taken from http://glslsandbox.com/e#41197.0 vec2 hash22(vec2 p) { float n = sin(dot(p, vec2(41, 289))); return fract(vec2(262144, 32768)*n);
}

// Computes the color variation on a quad division of the space // Basically, this method takes n random samples in a given quad, compute the average // of each color component of the samples. // Then, it computes the variance of the samples // This is the way I thought for computing the color variation, there might be others, // and there must be better ones vec4 quadColorVariation (in vec2 center, in float size) { // this array will store the grayscale of the samples vec3 samplesBuffer[SAMPLES_PER_ITERATION];

// the average of the color components
vec3 avg = vec3(0);

// we sample the current space by picking pseudo random samples in it
for (int i = 0; i < SAMPLES_PER_ITERATION; i++) {
    float fi = float(i);
    // pick a random 2d point using the center of the active quad as input
    // this ensures that for every point belonging to the active quad, we pick the same samples
    vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
    vec3 sp = texture(sTD2DInputs[0], center + r * size).rgb;
    avg+= sp;
    samplesBuffer[i] = sp;
}

avg/= F_SAMPLES_PER_ITERATION;

// estimate the color variation on the active quad by computing the variance
vec3 var = vec3(0);
for (int i = 0; i < SAMPLES_PER_ITERATION; i++) {
  var+= pow(samplesBuffer[i], vec3(2.0));
}
var/= F_SAMPLES_PER_ITERATION;
var-= pow(avg, vec3(2.0));

return vec4(avg, (var.x+var.y+var.z)/3.0);

}

void main() { vec2 uv = vUV.st;

// Normalized pixel coordinates (from 0 to 1)
float threshold = mix(THRESHOLD_MIN, THRESHOLD_MAX, varianceThreshold / iResolution.x);

// number of space divisions
float divs = MIN_DIVISIONS;

// the center of the active quad
vec2 quadCenter = (floor(uv * divs) + 0.5) / divs;
float quadSize = 1. / divs; // the size of each quad

// we store average and variance here
vec4 quadInfos = vec4(0);

for (int i = 0; i < MAX_ITERATIONS; i++) {
    quadInfos = quadColorVariation(quadCenter, quadSize);

    // if the variance is lower than the threshold, use the average color
    if (quadInfos.w < threshold) break;

    // otherwise, divide the space again
    divs *= 2.0;
    quadCenter = (floor(uv * divs) + 0.5) / divs;
    quadSize /= 2.0;
}

// Use the average color calculated from quadColorVariation
vec4 color = quadInfos;

// Output to screen
fragColor = TDOutputSwizzle(color);

}

To modify your GLSL shader in TouchDesigner to use a black and white noise mask to define where subdivisions occur, you can incorporate a texture uniform that represents the mask. This mask will be used to influence the decision-making in your quadtree subdivision process.

First, you need to declare a new uniform that will be used to sample the black and white noise texture. Let’s call this uniform uNoiseMask. You will use this texture to determine whether to subdivide further based on the brightness value of the mask at the current location.

Here are the steps and code modifications:

Declare the Noise Mask Uniform: Add a uniform to pass the noise mask texture.
```
uniform sampler2D uNoiseMask;  // Add this near your other uniforms
```
Sample the Noise Mask: In your main shader loop, you’ll need to sample the noise mask texture at the current quad center. This value will influence whether to subdivide the quad.
```
// Sample the noise mask at the quad center
float noiseValue = texture(uNoiseCheck, quadCenter).r;
```
Adjust the Variance Threshold Based on the Mask: You can modify the threshold for subdivision based on the sampled noise value. For instance, you might only allow subdivision if the noise value is above a certain level.
```
// Modify the threshold based on the noise value
threshold *= mix(0.5, 1.5, noiseValue);  // This scales the threshold based on noise
```
Incorporate These Changes into Your Shader Loop: Integrate the sampling and adjustment into your shader’s main loop.

Here’s how you could modify your existing shader code to incorporate these changes:

void main() {
    vec2 uv = vUV.st;

    // Normalized pixel coordinates (from 0 to 1)
    float threshold = mix(THRESHOLD_MIN, THRESHOLD_MAX, varianceThreshold / iResolution.x);

    // number of space divisions
    float divs = MIN_DIVISIONS;

    // the center of the active quad
    vec2 quadCenter = (floor(uv * divs) + 0.5) / divs;
    float quadSize = 1. / divs; // the size of each quad

    // we store average and variance here
    vec4 quadInfos = vec4(0);

    for (int i = 0; i < MAX_ITERATIONS; i++) {
        // Sample the noise mask at the current quad center
        float noiseValue = texture(uNoiseMask, quadCenter).r;

        // Adjust the subdivision threshold based on the noise mask value
        float adjustedThreshold = threshold * mix(0.5, 1.5, noiseValue);

        quadInfos = quadColorVariation(quadCenter, quadSize);

        // Check against the adjusted threshold
        if (quadInfos.w < adjustedThreshold) break;

        // otherwise, divide the space again
        divs *= 2.0;
        quadCenter = (floor(uv * divs) + 0.5) / divs;
        quadSize /= 2.0;
    }

    // Use the average color calculated from quadColorVariation
    vec4 color = quadInfos;

    // Output to screen
    fragC...

This integration allows the shader to adaptively subdivide based on both the variance of the color information and the intensity of a noise mask. This approach should give you a dynamic, non-uniform quadtree effect influenced by your noise mask. Adjust the mix function parameters to tune how much influence the noise mask has on the threshold for subdivision.

Sure, here is the full GLSL shader code with the modifications to use a black and white noise mask to define where subdivisions occur:

// Probabilistic quadtree filter

// Reference:
// https://ciphrd.com/2020/04/02/building-a-quadtree-filter-in-glsl-using-a-probabilistic-approach/

// the number of divisions at the start
//#define MIN_DIVISIONS 4.7
uniform float MIN_DIVISIONS;

// the number of possible quad divisions
//#define MAX_ITERATIONS 6
uniform int MAX_ITERATIONS;

// the number of samples picked after each quad division
#define SAMPLES_PER_ITERATION 30
#define F_SAMPLES_PER_ITERATION 30.

// useless, kept it for reference for a personal usage
#define MAX_SAMPLES 200

// threshold min, max given the variance threshold (not mouse.x)
#define THRESHOLD_MIN 0.0001
#define THRESHOLD_MAX 0.01

// uniform float exampleUniform;

uniform vec2 iResolution;
uniform float varianceThreshold;
uniform sampler2D uNoiseMask;  // Add this for the noise mask texture

out vec4 fragColor;

// taken from http://glslsandbox.com/e#41197.0
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768)*n);
}

// Computes the color variation on a quad division of the space
// Basically, this method takes n random samples in a given quad, compute the average
// of each color component of the samples.
// Then, it computes the variance of the samples
// This is the way I thought for computing the color variation, there might be others,
// and there must be better ones
vec4 quadColorVariation(in vec2 center, in float size) {
    // this array will store the grayscale of the samples
    vec3 samplesBuffer[SAMPLES_PER_ITERATION];

    // the average of the color components
    vec3 avg = vec3(0);

    // we sample the current space by picking pseudo random samples in it
    for (int i = 0; i < SAMPLES_PER_ITERATION; i++) {
        float fi = float(i);
        // pick a random 2d point using the center of the active quad as input
        // this ensures that for every point belonging to the active quad, we pick the same samples
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec3 sp = texture(sTD2DInputs[0], center + r * size).rgb;
        avg += sp;
        samplesBuffer[i] = sp;
    }

    avg /= F_SAMPLES_PER_ITERATION;

    // estimate the color variation on the active quad by computing the variance
    vec3 var = vec3(0);
    for (int i = 0; i < SAMPLES_PER_ITERATION; i++) {
        var += pow(samplesBuffer[i], vec3(2.0));
    }
    var /= F_SAMPLES_PER_ITERATION;
    var -= pow(avg, vec3(2.0));

    return vec4(avg, (var.x + var.y + var.z) / 3.0);
}

void main() {
    vec2 uv = vUV.st;

    // Normalized pixel coordinates (from 0 to 1)
    float threshold = mix(THRESHOLD_MIN, THRESHOLD_MAX, varianceThreshold / iResolution.x);

    // number of space divisions
    float divs = MIN_DIVISIONS;

    // the center of the active quad
    vec2 quadCenter = (floor(uv * divs) + 0.5) / divs;
    float quadSize = 1.0 / divs; // the size of each quad

    // we store average and variance here
    vec4 quadInfos = vec4(0);

    for (int i = 0; i < MAX_ITERATIONS; i++) {
        // Sample the noise mask at the current quad center
        float noiseValue = texture(uNoiseMask, quadCenter).r;

        // Adjust the subdivision threshold based on the noise mask value
        float adjustedThreshold = threshold * mix(0.5, 1.5, noiseValue);

        quadInfos = quadColorVariation(quadCenter, quadSize);

        // Check against the adjusted threshold
        if (quadInfos.w < adjustedThreshold) break;

        // otherwise, divide the space again
        divs *= 2.0;
        quadCenter = (floor(uv * divs) + 0.5) / divs;
        quadSize /= 2.0;
    }

    // Use the average color calculated from quadColorVariation
    vec4 color = quadInfos;

    // Output to screen
    fragColor = TDOutputSwizzle(color);
}

In this code, the uNoiseMask uniform is used to sample the noise texture, and the threshold for subdividing quads is adjusted based on the brightness value of the noise texture at the quad center. This allows the subdivision process to be influenced by the noise mask, resulting in a dynamic quadtree effect based on the noise pattern.

Absolutely! To use the noise texture from a specific input slot in TouchDesigner, such as ‘input 1 Source 2’ in the GLSL TOP node, you’ll need to adjust how the texture is sampled in your GLSL shader code. In TouchDesigner, each input is accessible via sTD2DInputs[], where the index corresponds to the input order starting from zero.

If ‘input 1 Source 2’ is the second input to the GLSL TOP node, you should refer to it as sTD2DInputs[1] in your shader. Here’s how you can adjust your code to implement this:

Modify the Texture Sampling: Instead of using a new uniform for the noise mask, directly use the second input of your GLSL TOP node.
Adjust the Shader Code: Change the sampling line where you were previously using the uNoiseMask uniform.

Here’s the modified version of your shader that uses the second input of the GLSL TOP for the noise mask:

// Probabilistic quadtree filter

// Reference:
// https://ciphrd.com/2020/04/02/building-a-quadtree-filter-in-glsl-using-a-probabilistic-approach/

// the number of divisions at the start
uniform float MIN_DIVISIONS;

// the number of possible quad divisions
uniform int MAX_ITERATIONS;

// the number of samples picked after each quad division
#define SAMPLES_PER_ITERATION 30
#define F_SAMPLES_PER_ITERATION 30.

// threshold min, max given the variance threshold (not mouse.x)
#define THRESHOLD_MIN 0.0001
#define THRESHOLD_MAX 0.01

uniform vec2 iResolution;
uniform float varianceThreshold;

out vec4 fragColor;

// taken from http://glslsandbox.com/e#41197.0
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768)*n);
}

// Computes the color variation on a quad division of the space
vec4 quadColorVariation(in vec2 center, in float size) {
    vec3 samplesBuffer[SAMPLES_PER_ITERATION];
    vec3 avg = vec3(0);

    for (int i = 0; i < SAMPLES_PER_ITERATION; i++) {
        float fi = float(i);
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec3 sp = texture(sTD2DInputs[0], center + r * size).rgb;
        avg += sp;
        samplesBuffer[i] = sp;
    }

    avg /= F_SAMPLES_PER_ITERATION;

    vec3 var = vec3(0);
    for (int i = 0; i < SAMPLES_PER_ITERATION; i++) {
        var += pow(samplesBuffer[i], vec3(2.0));
    }
    var /= F_SAMPLES_PER_ITERATION;
    var -= pow(avg, vec3(2.0));

    return vec4(avg, (var.x + var.y + var.z) / 3.0);
}

void main() {
    vec2 uv = vUV.st;
    float threshold = mix(THRESHOLD_MIN, THRESHOLD_MAX, varianceThreshold / iResolution.x);
    float divs = MIN_DIVISIONS;
    vec2 quadCenter = (floor(uv * divs) + 0.5) / divs;
    float quadSize = 1.0 / divs;
    vec4 quadInfos = vec4(0);

    for (int i = 0; i < MAX_ITERATIONS; i++) {
        float noiseValue = texture(sTD2DInputs[1], quadCenter).r;  // Using the second input for the noise mask
        float adjustedThreshold = threshold * mix(0.5, 1.5, noiseValue);

        quadInfos = quadColorVariation(quadCenter, quadSize);

        if (quadInfos.w < adjustedThreshold) break;

        divs *= 2.0;
        quadCenter = (floor(uv * divs) + 0.5) / divs;
        quadSize /= 2.0;
    }

    fragColor = TDOutputSwizzle(quadInfos);
}

Now, this shader will automatically use whatever texture is fed into the second input slot of the GLSL TOP node as the noise mask. Make sure that the noise texture is connected to the correct input slot in your TouchDesigner project setup.

To adjust your GLSL shader so that fewer subdivisions occur in areas where the noise texture is black, you need to modify the logic that determines the threshold for subdivision based on the brightness value sampled from the noise texture. Since black corresponds to a lower value (closer to 0.0), you can set up the threshold adjustment such that a lower noise texture value results in a higher threshold, making subdivisions less likely.

Here’s how you can adjust your code:

Adjust the Threshold Based on Noise Value: Increase the threshold in areas where the noise texture is darker. You can invert the influence of the noise value by subtracting it from 1 (since a darker area will have a lower value, 1 - noiseValue becomes larger).
Modify the Shader Logic: Implement these changes in the loop where subdivisions are decided.

Here’s how the modified portion of your shader code would look:

void main() {
    vec2 uv = vUV.st;
    float threshold = mix(THRESHOLD_MIN, THRESHOLD_MAX, varianceThreshold / iResolution.x);
    float divs = MIN_DIVISIONS;
    vec2 quadCenter = (floor(uv * divs) + 0.5) / divs;
    float quadSize = 1.0 / divs;
    vec4 quadInfos = vec4(0);

    for (int i = 0; i < MAX_ITERATIONS; i++) {
        float noiseValue = texture(sTD2DInputs[1], quadCenter).r;  // Sample noise mask value
        // Adjust threshold based on noise value (invert effect: darker means higher threshold)
        float adjustedThreshold = threshold * mix(1.5, 0.5, noiseValue);

        quadInfos = quadColorVari

Sure, here is the complete GLSL shader code with the modification to make fewer subdivisions where the noise texture is black:

// Probabilistic quadtree filter

// Reference:
// https://ciphrd.com/2020/04/02/building-a-quadtree-filter-in-glsl-using-a-probabilistic-approach/

// the number of divisions at the start
uniform float MIN_DIVISIONS;

// the number of possible quad divisions
uniform int MAX_ITERATIONS;

// the number of samples picked after each quad division
#define SAMPLES_PER_ITERATION 30
#define F_SAMPLES_PER_ITERATION 30.

// threshold min, max given the variance threshold (not mouse.x)
#define THRESHOLD_MIN 0.0001
#define THRESHOLD_MAX 0.01

uniform vec2 iResolution;
uniform float varianceThreshold;

out vec4 fragColor;

// taken from http://glslsandbox.com/e#41197.0
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768) * n);
}

// Computes the color variation on a quad division of the space
vec4 quadColorVariation(in vec2 center, in float size) {
    vec3 samplesBuffer[SAMPLES_PER_ITERATION];
    vec3 avg = vec3(0);

    for (int i = 0; i < SAMPLES_PER_ITERATION; i++) {
        float fi = float(i);
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec3 sp = texture(sTD2DInputs[0], center + r * size).rgb;
        avg += sp;
        samplesBuffer[i] = sp;
    }

    avg /= F_SAMPLES_PER_ITERATION;

    vec3 var = vec3(0);
    for (int i = 0; i < SAMPLES_PER_ITERATION; i++) {
        var += pow(samplesBuffer[i], vec3(2.0));
    }
    var /= F_SAMPLES_PER_ITERATION;
    var -= pow(avg, vec3(2.0));

    return vec4(avg, (var.x + var.y + var.z) / 3.0);
}

void main() {
    vec2 uv = vUV.st;
    float threshold = mix(THRESHOLD_MIN, THRESHOLD_MAX, varianceThreshold / iResolution.x);
    float divs = MIN_DIVISIONS;
    vec2 quadCenter = (floor(uv * divs) + 0.5) / divs;
    float quadSize = 1.0 / divs;
    vec4 quadInfos = vec4(0);

    for (int i = 0; i < MAX_ITERATIONS; i++) {
        float noiseValue = texture(sTD2DInputs[1], quadCenter).r;  // Sample noise mask value
        // Adjust threshold based on noise value (invert effect: darker means higher threshold)
        float adjustedThreshold = threshold * mix(1.5, 0.5, noiseValue);

        quadInfos = quadColorVariation(quadCenter, quadSize);

        if (quadInfos.w < adjustedThreshold) break;

        divs *= 2.0;
        quadCenter = (floor(uv * divs) + 0.5) / divs;
        quadSize /= 2.0;
    }

    fragColor = TDOutputSwizzle(quadInfos);
}

In this code, the adjustedThreshold is calculated by modifying the original threshold based on the noise value sampled from the second input (sTD2DInputs[1]). The mix function is used to invert the effect of the noise: darker values in the noise texture (closer to 0) result in a higher threshold (making subdivisions less likely), and brighter values (closer to 1) result in a lower threshold (making subdivisions more likely).

This should give you the desired effect of fewer subdivisions in areas where the noise texture is black. Make sure that the noise texture is correctly connected to the second input slot of the GLSL TOP node in TouchDesigner.

If you wish to base the subdivision solely on the black and white values of the noise texture without relying on parameters like iResolution, varianceThreshold, MIN_DIVISIONS, and MAX_ITERATIONS, you can simplify the shader significantly. Here, the decision to subdivide further or not will be made directly based on the brightness of the noise texture at a specific point.

Here’s an approach to revise the shader code:

Remove Unnecessary Uniforms: As you no longer need iResolution, varianceThreshold, MIN_DIVISIONS, and MAX_ITERATIONS, you can eliminate these from your shader.
Simplify the Logic for Subdivision: Use a simple cutoff value to determine whether to subdivide based on the noise texture’s value. For example, if the brightness is greater than 0.5, subdivide; otherwise, do not.
Iterative Approach: You can still have a loop to decide the level of detail dynamically, but the number of iterations will be fixed or defined based on a new logic.

Here is the revised shader:

// Probabilistic quadtree filter based only on noise texture values

out vec4 fragColor;

// Noise texture input
uniform sampler2D uNoiseMask;

// Function to hash point for random sampling
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768)*n);
}

// Computes the average color in a given space
vec4 computeAverageColor(in vec2 center, in float size) {
    vec3 colorSum = vec3(0);
    int samples = 30; // Fixed number of samples
    for (int i = 0; i < samples; i++) {
        float fi = float(i);
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec3 color = texture(sTD2DInputs[0], center + r * size).rgb;
        colorSum += color;
    }
    return vec4(colorSum / float(samples), 1.0);
}

void main() {
    vec2 uv = gl_FragCoord.xy / vec2(textureSize(sTD2DInputs[0], 0));
    float divisions = 2.0; // Start with the lowest level of detail
    vec2 quadCenter = uv;
    float quadSize = 1.0;

    for (int i = 0; i < 8; i++) { // You can adjust the '8' to increase or decrease maximum detail levels
        float noiseValue = texture(uNoiseMask, quadCenter).r;
        if (noiseTime < 0.5) break; // Break if noise suggests no further subdivision

        divisions *= 2.0;
        quadCenter = (floor(uv * divisions) + 0.5) / divisions;
        quadSize = 1.0 / divisions;
    }

    vec4 color = computeAverageColor(quadCenter, quadSize);
    fragColor = color;
}

Key Changes:

computeAverageColor function: Computes the average color over a specific region. It samples 30 points within each quad to get a good representation of the color.
Loop Control Based on Noise: The loop now iterates up to 8 times (adjustable), checking the noise value at the current quad center. If the noise value is less than 0.5, it stops subdividing further.
Texture Sampling Coordinates: Uses normalized coordinates based on the texture size to ensure correct mapping.

Usage:

Ensure that the noise texture (black and white) is connected to the uNoiseMask input of your GLSL TOP node. This shader will dynamically adjust subdivisions based purely on the noise texture without external parameters influencing the decision.

This setup provides a more direct and visually consistent method of determining detail levels based on the noise texture, which should meet your requirement for a purely noise-driven subdivision system.

It seems like there was a typo in the shader code, specifically the variable name noiseTime should actually be noiseValue. Let’s correct that and also ensure there are no other typographical or logical errors in the shader code. Here’s the corrected and refined version of the GLSL shader:

// Probabilistic quadtree filter based only on noise texture values

out vec4 fragColor;

// Noise texture input
uniform sampler2D uNoiseMask;

// Function to hash point for random sampling
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768) * n);
}

// Computes the average color in a given space
vec4 computeAverageColor(in vec2 center, in float size) {
    vec3 colorSum = vec3(0);
    int samples = 30; // Fixed number of samples
    for (int i = 0; i < samples; i++) {
        float fi = float(i);
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec3 color = texture(sTD2DInputs[0], center + r * size).rgb;
        colorSum += color;
    }
    return vec4(colorSum / float(samples), 1.0);
}

void main() {
    vec2 uv = gl_FragCoord.xy / vec2(textureSize(sTD2DInputs[0], 0));
    float divisions = 2.0; // Start with the lowest level of detail
    vec2 quadCenter = uv;
    float quadSize = 1.0 / divisions;

    for (int i = 0; i < 8; i++) { // You can adjust the '8' to increase or decrease maximum detail levels
        float noiseValue = texture(uNoiseMask, quadCenter).r;
        if (noiseValue < 0.5) break; // Break if noise suggests no further subdivision

        divisions *= 2.0;
        quadCenter = (floor(uv * divisions) + 0.5) / divisions;
        quadSize = 1.0 / divisions;
    }

    vec4 color = computeAverageColor(quadCenter, quadSize);
    fragColor = color;
}

Explanation of the changes and additional checks:

Corrected Typo: Replaced noiseTime with noiseValue, which is the correct variable used to fetch the grayscale value from the noise texture.
Normalization of UV Coordinates: The line vec2 uv = gl_FragCoord.xy / vec2(textureSize(sTD2DInputs[0], 0)); ensures that UV coordinates are normalized properly. This is important for proper sampling across different resolutions.
Control Structure: The loop now correctly interprets the noise texture’s value to decide whether to continue subdividing or not.

This shader code now should compile without errors in your environment, and it uses the noise texture to control subdivision dynamically. Make sure the noise texture is correctly connected and contains appropriate black and white values to test this behavior effectively.

Thank you for the clarification. Let’s update the shader to use the noise texture from sTD2DInputs[1], which corresponds to “input 1 Source 2” in TouchDesigner.

Here’s the revised GLSL shader code:

// Probabilistic quadtree filter based only on noise texture values

out vec4 fragColor;

// Function to hash point for random sampling
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768) * n);
}

// Computes the average color in a given space
vec4 computeAverageColor(in vec2 center, in float size) {
    vec3 colorSum = vec3(0);
    int samples = 30; // Fixed number of samples
    for (int i = 0; i < samples; i++) {
        float fi = float(i);
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec3 color = texture(sTD2DInputs[0], center + r * size).rgb;
        colorSum += color;
    }
    return vec4(colorSum / float(samples), 1.0);
}

void main() {
    vec2 uv = gl_FragCoord.xy / vec2(textureSize(sTD2DInputs[0], 0));
    float divisions = 2.0; // Start with the lowest level of detail
    vec2 quadCenter = uv;
    float quadSize = 1.0 / divisions;

    for (int i = 0; i < 8; i++) { // You can adjust the '8' to increase or decrease maximum detail levels
        float noiseValue = texture(sTD2DInputs[1], quadCenter).r; // Sample noise mask value from input 1 Source 2
        if (noiseValue < 0.5) break; // Break if noise suggests no further subdivision

        divisions *= 2.0;
        quadCenter = (floor(uv * divisions) + 0.5) / divisions;
        quadSize = 1.0 / divisions;
    }

    vec4 color = computeAverageColor(quadCenter, quadSize);
    fragColor = color;
}

Explanation of the changes:

Sampling Noise Texture from Input 1 Source 2: The line float noiseValue = texture(sTD2DInputs[1], quadCenter).r; samples the noise texture from the second input of the GLSL TOP node.
Subdivision Logic Based on Noise: The subdivision logic now purely relies on the sampled noise value, where a noise value less than 0.5 will stop further subdivisions.

Make sure your TouchDesigner setup has the following connections:

Input 0: The primary texture that you want to apply the quadtree effect to.
Input 1: The noise texture used to control subdivisions.

This shader will now dynamically adjust subdivisions based on the brightness of the noise texture, resulting in fewer subdivisions in darker areas and more subdivisions in brighter areas.

To add the capability to dynamically control the minimum and maximum number of divisions based on the brightness of the noise texture, we’ll introduce two new uniform parameters: minDivisions and maxDivisions. The actual number of divisions for each quad will then be interpolated based on the grayscale value of the noise texture, where white corresponds to the maximum number of divisions and black corresponds to the minimum.

Let’s adjust the GLSL shader to include these parameters and the interpolation logic:

// Probabilistic quadtree filter based on noise texture values

out vec4 fragColor;

// Noise texture input
uniform sampler2D uNoiseMask;

// Division control parameters
uniform float minDivisions;
uniform float maxDivisions;

// Function to hash point for random sampling
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768) * n);
}

// Computes the average color in a given space
vec4 computeAverageColor(in vec2 center, in float size) {
    vec3 colorSum = vec3(0);
    int samples = 30; // Fixed number of samples
    for (int i = 0; i < samples; i++) {
        float fi = float(i);
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec3 color = texture(sTD2DInputs[0], center + r * size).rgb;
        colorSum += color;
    }
    return vec4(colorSum / float(samples), 1.0);
}

void main() {
    vec2 uv = gl_FragCoord.xy / vec2(textureSize(sTD2DInputs[0], 0));
    vec2 quadCenter = uv;
    float quadSize = 1.0;

    // Sample the noise mask to determine the number of divisions
    float noiseValue = texture(sTD2DInputs[1], quadCenter).r;
    float divisions = mix(minDivisions, maxDivisions, noiseValue); // Interpolate divisions based on noise value

    // Calculate the division steps based on the interpolated divisions value
    divisions = pow(2.0, floor(divisions)); // Ensure divisions are powers of two for consistency

    quadSize = 1.0 / divisions;
    quadCenter = (floor(uv * divisions) + 0.5) / divisions;

    vec4 color = computeAverageColor(quadCenter, quadSize);
    fragColor = color;
}

Key Elements of the Code:

Uniforms for Division Control: minDivisions and maxDivisions are used to specify the range of subdivision levels, controllable via the GLSL TOP interface in TouchDesigner.
Noise-Driven Division Calculation: The number of divisions is determined by interpolating between minDivisions and maxDivisions based on the grayscale value of the noise texture. A noise value of 0 (black) will yield the minimum number of divisions, and a value of 1 (white) will give the maximum.
Division Calculation: The line divisions = pow(2.0, floor(divisions)); ensures that the number of divisions is a power of two, which is common in quadtree implementations to ensure uniform subdivision.

How to Use in TouchDesigner:

Set up the GLSL TOP: Add the shader code to a GLSL TOP in TouchDesigner.
Configure Inputs: Ensure you have your primary texture connected to Input 0 and the noise texture to Input 1.
Add Parameters: Create parameters for minDivisions and maxDivisions in the GLSL TOP’s parameter interface to control these values dynamically.

This setup allows for a very flexible control over the subdivision process, enabling interactive adjustments based on both texture input and parameter manipulation.

To address the issue of visible edges from the noise mask and ensure you only see the results of the subdivided textures, the following adjustments are needed:

Seamless Texture Sampling: Make sure the noise texture and any input textures you’re using are seamlessly tileable. This can help prevent visible edges due to abrupt changes in texture data at the borders.
Adjusting Sampling Logic: If the edges are a result of how you’re sampling the noise texture in relation to the UV coordinates, ensure that the UVs wrap correctly and that texture sampling does not exceed the texture’s boundaries. Using GLSL’s texture wrapping modes might help here.
Visual Appearance in Quad Division: If the subdivision itself is creating visible edges due to discontinuities between subdivided areas, consider how the texture is sampled and averaged in each division.

Here’s a refined shader that focuses on ensuring the subdivisions blend seamlessly by adjusting how the texture coordinates are computed and ensuring that any computational boundaries are handled gracefully:

// Probabilistic quadtree filter based on noise texture values

out vec4 fragColor;

// Noise texture input
uniform sampler2D uNoiseMask;

// Division control parameters
uniform float minDivisions;
uniform float maxDivisions;

// Function to hash point for random sampling
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768) * n);
}

// Computes the average color in a given space
vec4 computeAverageColor(in vec2 center, in float size, in vec2 resolution) {
    vec3 colorSum = vec3(0);
    int samples = 30; // Fixed number of samples
    for (int i = 0; i < samples; i++) {
        float fi = float(i);
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec2 samplePoint = mod(center + r * size, resolution); // Ensure wrapping at edges
        vec3 color = texture(sTD2DInputs[0], samplePoint / resolution).rgb;
        colorSum += color;
    }
    return vec4(colorSum / float(samples), 1.0);
}

void main() {
    vec2 uv = gl_FragCoord.xy / vec2(textureSize(sTD2DInputs[0], 0));
    vec2 resolution = vec2(textureSize(sTD2DInputs[0], 0)); // Texture resolution for wrapping

    // Sample the noise mask to determine the number of divisions
    float noiseValue = texture(uNoiseMask, uv).r; // Sampling noise mask at UV
    float divisions = mix(minDivisions, maxDivisions, noiseValue); // Interpolate divisions based on noise value

    // Calculate the division steps based on the interpolated divisions value
    divisions = pow(2.0, floor(divisions)); // Ensure divisions are powers of two for consistency
    float quadSize = 1.0 / divisions;
    vec2 quadCenter = (floor(uv * divisions) + 0.5) / divisions;

    vec4 color = computeAverageColor(quadCenter, quadSize, resolution);
    fragColor = color;
}

Additional Changes:

Modulo Operation for Wrapping: The mod(center + r * size, resolution) ensures that the sampling wraps around the texture, preventing edge artifacts.
Sampling and Resolution: Adjusted how textures are sampled and introduced seamless wrapping for both the input and noise textures.

This shader now better handles edge conditions by ensuring that sampling does not introduce discontinuities and by making use of texture wrapping functions in GLSL. Make sure your textures are set to repeat in TouchDesigner, and check that they tile seamlessly to fully benefit from these changes.

To resolve the warning about using a custom uniform for the noise mask, you should utilize the built-in image samplers provided by TouchDesigner. In TouchDesigner’s GLSL TOP, each input is accessible as sTD2DInputs[<index>], where <index> is zero-based depending on how you’ve wired your inputs. Let’s adjust the shader to properly use the second input (i.e., “input 1 Source 2”) for sampling the noise mask without explicitly declaring it as a uniform.

Here’s how you can adjust the shader to utilize the built-in samplers correctly:

// Probabilistic quadtree filter based on noise texture values

out vec4 fragColor;

// Division control parameters
uniform float minDivisions;
uniform float maxDivisions;

// Function to hash point for random sampling
vec2 hash22(vec2 p) {
    float n = sin(dot(p, vec2(41, 289)));
    return fract(vec2(262144, 32768) * n);
}

// Computes the average color in a given space
vec4 computeAverageColor(in vec2 center, in float size, in vec2 resolution) {
    vec3 colorSum = vec3(0);
    int samples = 30; // Fixed number of samples
    for (int i = 0; i < samples; i++) {
        float fi = float(i);
        vec2 r = hash22(center.xy + vec2(fi, 0.0)) - 0.5;
        vec2 samplePoint = mod(center + r * size, resolution); // Ensure wrapping at edges
        vec3 color = texture(sTD2DInputs[0], samplePoint / resolution).rgb;
        colorSum += color;
    }
    return vec4(colorSum / float(samples), 1.0);
}

void main() {
    vec2 uv = gl_FragCoord.xy / vec2(textureSize(sTD2DInputs[0], 0));
    vec2 resolution = vec2(textureSize(sTD2DInputs[0], 0)); // Texture resolution for wrapping

    // Sample the noise mask to determine the number of divisions
    float noiseValue = texture(sTD2DInputs[1], uv).r; // Sampling noise mask directly from input 1 Source 2
    float divisions = mix(minDivisions, maxDivisions, noiseValue); // Interpolate divisions based on noise value

    // Calculate the division steps based on the interpolated divisions value
    divisions = pow(2.0, floor(divisions)); // Ensure divisions are powers of two for consistency
    float quadSize = 1.0 / divisions;
    vec2 quadCenter = (floor(uv * divisions) + 0.5) / divisions;

    vec4 color = computeAverageColor(quadCenter, quadSize, resolution);
    fragColor = color;
}

Key Adjustments:

Use of Built-in Samplers: The shader now uses sTD2DInputs[1] for sampling the noise texture, complying with TouchDesigner’s requirements for using built-in samplers. This avoids the need for custom uniform declarations for textures.
Direct Access to Texture Inputs: The noise texture, which controls the subdivision, is accessed directly using the built-in sampler sTD2DInputs[1].

How to Set Up in TouchDesigner:

Connect the Input Textures: Ensure your main content texture is connected to Input 0 and the noise texture to Input 1 of the GLSL TOP.
Configure Parameters: Add user parameters for minDivisions and maxDivisions if they are not already set up, so you can control these dynamically from the TouchDesigner interface.

This shader should now work without any warnings and properly use the noise texture to control the subdivisions dynamically. Make sure the inputs are correctly mapped, and adjust the parameters to see how the effect changes with different noise patterns and division settings.