Basic shader help

Processing Coding Questions
1

Im currently trying to get my head around shaders. Have tried adapting the the “VideoMappingWithShader” fragment shader from gohai’s GL video Pi library to add a gradient to the video.

i get a “OpenGL error 1282 at top endDraw(): invalid operation” error and strangly the checkerboard shows but when switching to the video i just get a white square.

Processing code hasnt changed except for a shader.set(“u_resolution”, width, height); at the end of setup.

Any advice please?

vertext shader (unchanged)

uniform mat4 transform;
uniform mat4 texMatrix;

attribute vec4 position;
attribute vec4 color;
attribute vec2 texCoord;
attribute float texCoordQ;

varying vec4 vertColor;
varying vec3 vertTexCoord;

void main() {
  gl_Position = transform * position;

  vertColor = color;
  vertTexCoord = vec3(texCoord * texCoordQ, texCoordQ);
}

fragment shader

#ifdef GL_ES
precision mediump float;
precision mediump int;
#endif

uniform sampler2D texture;

varying vec3 vertColor;
varying vec3 vertTexCoord;

void main() {
	vec2 st = gl_FragCoord.xy/u_resolution;
    float blend = st.x;
    
    gl_FragColor = texture2D(texture, vertTexCoord.st / vertTexCoord.p) * blend;
}
1 Like
2

You don’t seem to be defining the u_resolution uniform in the fragment shader?!

You need

uniform sampler2D texture;
uniform vec2 u_resolution;

Mind you, you’ll need to make sure you’re passing width and height as floats i think.

IIRC PShader will automatically set a vec2 uniform called resolution, so you may not need to set this yourself, just add that?

The various uniforms that will get set automatically if they exist in your shaders are at https://github.com/processing/processing/blob/master/core/src/processing/opengl/PShader.java#L1146

1 Like
3

Thanks Neil, that was it.

As this affects the whole output, do you have any advice on putting the blend inside the processed fragment shader area? Ie so the blend directly affects the keystoned area and not over the whole output?

vec4 texture2D(sampler2D s, vec2 coord [, float bias])

Trying gl_FragColor = texture2D(texture, vertTexCoord.st / vertTexCoord.p, blend); didnt seem to effect it EDIT: scrap that, i see thats the Coordinate bias

1 Like
4

Yes, just use the texture coordinates for that too (if I’m understanding what you’re after correctly)

5

Im not sure i understand. Do you mean use the vertTexCoord passed on from the vertex shader instead of my gl_FragCoord?

6

Yes, exactly. Those coordinates should already be relative to the transformed quad, whereas the fragment coordinates are relative to the screen.

1 Like
7

Thanks neil.

Last question. i have implemented vec2 st = vertTexCoord.st+1./resolution; although im not sure why i need the +1. (or any value for that matter) as vec2 st = vertTexCoord.st./resolution gives a black canvas. do i need to offset vertTexCoord.st for some reason? ie are we going from -.5,+.5 to 0,1?

8

It’s from 0 to 1. But not sure why you’re using vec2 st at all. Surely -

float blend = vertTexCoord.x;

???