Fix clashing constuctor and function

Author: davepagurek

src/strands/ir_types.js

@@ -63,7 +63,7 @@ export const DataType = {
   mat3: { fnName: "mat3x3", baseType: BaseType.MAT, dimension:3, priority: 0,  },
   mat4: { fnName: "mat4x4", baseType: BaseType.MAT, dimension:4, priority: 0,  },
   defer: { fnName:  null, baseType: BaseType.DEFER, dimension: null, priority: -1 },
-  sampler2D: { fnName: "texture", baseType: BaseType.SAMPLER2D, dimension: 1, priority: -10 },
+  sampler2D: { fnName: "sampler2D", baseType: BaseType.SAMPLER2D, dimension: 1, priority: -10 },
 }
 export const structType = function (hookType) {
   let T = hookType.type === undefined ? hookType : hookType.type;
@@ -85,7 +85,32 @@ export function isStructType(typeName) {
   return !isNativeType(typeName);
 }
 export function isNativeType(typeName) {
-  return Object.keys(DataType).includes(typeName);
+  // Check if it's in DataType keys (internal names like 'float4')
+  if (Object.keys(DataType).includes(typeName)) {
+    return true;
+  }
+
+  // Check if it's a GLSL type name (like 'vec4', 'float', etc.)
+  const glslNativeTypes = {
+    'float': true,
+    'vec2': true,
+    'vec3': true,
+    'vec4': true,
+    'int': true,
+    'ivec2': true,
+    'ivec3': true,
+    'ivec4': true,
+    'bool': true,
+    'bvec2': true,
+    'bvec3': true,
+    'bvec4': true,
+    'mat2': true,
+    'mat3': true,
+    'mat4': true,
+    'sampler2D': true
+  };
+
+  return !!glslNativeTypes[typeName];
 }
 export const GenType = {
   FLOAT: { baseType: BaseType.FLOAT, dimension: null, priority: 3 },
@@ -98,7 +123,7 @@ export function typeEquals(nodeA, nodeB) {
 export const TypeInfoFromGLSLName = Object.fromEntries(
   Object.values(DataType)
     .filter(info => info.fnName !== null)
-    .map(info => [info.fnName === 'texture' ? 'sampler2D' : info.fnName, info])
+    .map(info => [info.fnName, info])
 );
 export const OpCode = {
   Binary: {

test/unit/webgl/p5.Shader.js

@@ -1066,5 +1066,79 @@ suite('p5.Shader', function() {
         assert.approximately(pixelColor[0], 127, 5); // 0.5 * 255 ≈ 127
       });
     });
+
+    suite('filter shader hooks', () => {
+      test('handle getColor hook with non-struct return type', () => {
+        myp5.createCanvas(50, 50, myp5.WEBGL);
+
+        const testShader = myp5.baseFilterShader().modify(() => {
+          myp5.getColor((inputs, canvasContent) => {
+            // Simple test - just return a constant color
+            return [1.0, 0.5, 0.0, 1.0]; // Orange color
+          });
+        }, { myp5 });
+
+        // Create a simple scene to filter
+        myp5.background(0, 0, 255); // Blue background
+
+        // Apply the filter
+        myp5.filter(testShader);
+
+        // Check that the filter was applied (should be orange)
+        const pixelColor = myp5.get(25, 25);
+        assert.approximately(pixelColor[0], 255, 5); // Red channel should be 255
+        assert.approximately(pixelColor[1], 127, 5); // Green channel should be ~127
+        assert.approximately(pixelColor[2], 0, 5);   // Blue channel should be 0
+      });
+
+      test('simple vector multiplication in filter shader', () => {
+        myp5.createCanvas(50, 50, myp5.WEBGL);
+
+        const testShader = myp5.baseFilterShader().modify(() => {
+          myp5.getColor((inputs, canvasContent) => {
+            // Test simple scalar * vector operation
+            const scalar = 0.5;
+            const vector = [1, 2];
+            const result = scalar * vector;
+            return [result.x, result.y, 0, 1];
+          });
+        }, { myp5 });
+      });
+
+      test('handle complex filter shader with for loop and vector operations', () => {
+        myp5.createCanvas(50, 50, myp5.WEBGL);
+
+        const testShader = myp5.baseFilterShader().modify(() => {
+          const r = myp5.uniformFloat(() => 3); // Small value for testing
+          myp5.getColor((inputs, canvasContent) => {
+            let sum = [0, 0, 0, 0];
+            let samples = 1;
+
+            for (let i = 0; i < r; i++) {
+              samples++;
+              sum += myp5.texture(canvasContent, inputs.texCoord + (i / r) * [
+                myp5.sin(4 * myp5.PI * i / r),
+                myp5.cos(4 * myp5.PI * i / r)
+              ]);
+            }
+
+            return sum / samples;
+          });
+        }, { myp5 });
+
+        // Create a simple scene to filter
+        myp5.background(255, 0, 0); // Red background
+
+        // Apply the filter
+        myp5.filter(testShader);
+
+        // The result should be some variation of the red background
+        const pixelColor = myp5.get(25, 25);
+        // Just verify it ran without crashing - exact color will depend on sampling
+        assert.isNumber(pixelColor[0]);
+        assert.isNumber(pixelColor[1]);
+        assert.isNumber(pixelColor[2]);
+      });
+    });
   });
 });