refresh shaders, trying to make it refresh in processing

207 views Asked by At

I am looking for a sobel shader which will allow me to change the multiplier.

i found the following https://forum.processing.org/two/discussion/21746/multipass-shader-example https://github.com/cansik/processing-postfx

and have used the following shader provided however the shader doesn't refresh. Now the default edge detection in processing examples does allow refresh but, it produces worse quality edge detection.

code I would like to adapt

// Adapted from:
// <a href="http://callumhay.blogspot.com/2010/09/gaussian-blur-shader-glsl.html" target="_blank" rel="nofollow">http://callumhay.blogspot.com/2010/09/gaussian-blur-shader-glsl.html</a>
 
#ifdef GL_ES
precision mediump float;
precision mediump int;
#endif
 
#define PROCESSING_TEXTURE_SHADER
 
uniform sampler2D texture;
uniform float mult;
 
varying vec4 vertColor;
varying vec4 vertTexCoord;

uniform vec2 resolution;

void main(void) {
  float x = 1.0 / resolution.x;
  float y = 1.0 / resolution.y;
  
  
  vec4 horizEdge = vec4( 0.0 );
  horizEdge -= texture2D( texture, vec2( vertTexCoord.x - x, vertTexCoord.y - y ) ) * 1.0;
  horizEdge -= texture2D( texture, vec2( vertTexCoord.x - x, vertTexCoord.y     ) ) * 2.0;
  horizEdge -= texture2D( texture, vec2( vertTexCoord.x - x, vertTexCoord.y + y ) ) * 1.0;
  horizEdge += texture2D( texture, vec2( vertTexCoord.x + x, vertTexCoord.y - y ) ) * 1.0;
  horizEdge += texture2D( texture, vec2( vertTexCoord.x + x, vertTexCoord.y     ) ) * 2.0;
  horizEdge += texture2D( texture, vec2( vertTexCoord.x + x, vertTexCoord.y + y ) ) * 1.0;
  
  vec4 vertEdge = vec4( 0.0 );
  vertEdge -= texture2D( texture, vec2( vertTexCoord.x - x, vertTexCoord.y - y ) ) * 1.0;
  vertEdge -= texture2D( texture, vec2( vertTexCoord.x    , vertTexCoord.y - y ) ) * 2.0;
  vertEdge -= texture2D( texture, vec2( vertTexCoord.x + x, vertTexCoord.y - y ) ) * 1.0;
  vertEdge += texture2D( texture, vec2( vertTexCoord.x - x, vertTexCoord.y + y ) ) * 1.0;
  vertEdge += texture2D( texture, vec2( vertTexCoord.x    , vertTexCoord.y + y ) ) * 2.0;
  vertEdge += texture2D( texture, vec2( vertTexCoord.x + x, vertTexCoord.y + y ) ) * 1.0;
  
  vec3 edge = sqrt((horizEdge.rgb * horizEdge.rgb) + (vertEdge.rgb * vertEdge.rgb));
  
  float col = (edge.x+edge.y+edge.z)/3;
  
  gl_FragColor = vec4(1.0,1.0,1.0,col)*mult;
}

example code in processing

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

#define PROCESSING_TEXTURE_SHADER

uniform sampler2D texture;
uniform vec2 texOffset;

varying vec4 vertColor;
varying vec4 vertTexCoord;

void main(void) {
  // Grouping texcoord variables in order to make it work in the GMA 950. See post #13
  // in this thread:
  // http://www.idevgames.com/forums/thread-3467.html
  vec2 tc0 = vertTexCoord.st + vec2(-texOffset.s, -texOffset.t);
  vec2 tc1 = vertTexCoord.st + vec2(         0.0, -texOffset.t);
  vec2 tc2 = vertTexCoord.st + vec2(+texOffset.s, -texOffset.t);
  vec2 tc3 = vertTexCoord.st + vec2(-texOffset.s,          0.0);
  vec2 tc4 = vertTexCoord.st + vec2(         0.0,          0.0);
  vec2 tc5 = vertTexCoord.st + vec2(+texOffset.s,          0.0);
  vec2 tc6 = vertTexCoord.st + vec2(-texOffset.s, +texOffset.t);
  vec2 tc7 = vertTexCoord.st + vec2(         0.0, +texOffset.t);
  vec2 tc8 = vertTexCoord.st + vec2(+texOffset.s, +texOffset.t);
  
  vec4 col0 = texture2D(texture, tc0);
  vec4 col1 = texture2D(texture, tc1);
  vec4 col2 = texture2D(texture, tc2);
  vec4 col3 = texture2D(texture, tc3);
  vec4 col4 = texture2D(texture, tc4);
  vec4 col5 = texture2D(texture, tc5);
  vec4 col6 = texture2D(texture, tc6);
  vec4 col7 = texture2D(texture, tc7);
  vec4 col8 = texture2D(texture, tc8);

  vec4 sum = 8.0 * col4 - (col0 + col1 + col2 + col3 + col5 + col6 + col7 + col8); 
  gl_FragColor = vec4(sum.rgb, 1.0) * vertColor;
}

where I would like to add

uniform float mult;

float col = (sum.r+sum.g+sum.b)/3;

and where gl_FragColor.

gl_FragColor = vec4(1.0,1.0,1.0,col) * mult;

I have also taken a look at shader toy, but do not yet understand how to use the shaders provided as they always produce a bunch of errors.

I've also tried to make my own but couldn't get it to function.

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

#define PROCESSING_TEXTURE_SHADER

uniform sampler2D texture;
uniform vec2 texOffset;
uniform float mult;
uniform float range;

varying vec4 vertColor;
varying vec4 vertTexCoord;

const mat3 sobelH = mat3(-1, -2, -1,
                          0, 0, 0,
                          1, 2, 1);
const mat3 sobelV = mat3(-1, 0, 1,
                         -2, 0, 2,
                         -1, 0, 1);


void main(void) {
  
    float x = gl_FragCoord.x;
    float y = gl_FragCoord.y;
    
    float sh = 0.0;
    float sv = 0.0;

    vec2 tc;
    vec4 myPixel = texture2D(texture,vertTexCoord.st);
    float myCol = (myPixel.x+myPixel.y+myPixel.z+myPixel.a)/4.0;
    float count = 0.0;
  
    for (float i = x -  range; i <= x +range; i+=1.0) { 
        for (float j = y -  range; j <= y +range; j+=1.0) { 
        
        tc = vec2(i,j);

        vec4 col = texture2D(texture, tc);
        float b = (col.a + col.r + col.g + col.b)/4.0;

        float x1 = 0 + i - x + 1;
        float y1 = 0 + j - y + 1;
        
        float h = sobelH[x1][y1] * b;
        float v = sobelV[x1][y1] * b;
        
        float sv+= v;
        float sh+= h;
        
    }}
    
    float vx = 8 * myCol - sh;
    float vy = 8 * myCol - sv;
    float val = sqrt(vx,*vx+vy*vy);
    gl_FragColor = vec4((val),(val),(val),(1.0));
};

for reference this is what the top shader currently does when I move the mouse enter image description here enter image description here

1

There are 1 answers

0
Paul Goux On

gl_FragColor = vec4(1.0,1.0,1.0,1.0) * 1/((col*mult));