Shader don't work in HTML5

Hello! I use shader throw render target and it doesn’t work:

varying mediump vec4 position;
varying mediump vec2 var_texcoord0;

uniform lowp sampler2D original;

const float u_sample_step = 1.0;
const int u_nsample = 0;
const vec2 u_center = vec2(0.5,0.5); // center in origional image, normalized to [0, 1]

uniform lowp vec4 prop;
uniform lowp vec4 res;
void main()
{  
  vec2 resolution=vec2(res.x,res.y);

  vec2 coord = gl_FragCoord.xy / resolution.xy;

  vec2 cstep = u_sample_step/resolution.xy * normalize(u_center - coord);

  vec4 color = vec4(0.0);
  for(int i=0; i<u_nsample+prop.x; ++i) {
    color += texture2D(original, coord);
    coord += cstep;
  }
  gl_FragColor = color/float(u_nsample+prop.x);
}

I see black screen when run it on HTML5

Hi! Can you share the project or any logs from the console?

2 Likes

as minimum this is strange construction, when const int adding to float.

// grade.fp
varying mediump vec4 position;
varying mediump vec2 var_texcoord0;

uniform lowp sampler2D original;

const float u_sample_step = 1.0;
const float u_nsample = 0.0;
const vec2 u_center = vec2(0.5, 0.5); // center in origional image, normalized to [0, 1]

uniform lowp vec4 prop;

void main()
{	
	vec2 resolution=vec2(800, 600);
	
	vec2 coord = gl_FragCoord.xy / resolution.xy;

	vec2 cstep = u_sample_step / resolution.xy * normalize(u_center - coord);

	vec4 color = vec4(0.0);
	for(int i = 0; i < int(u_nsample + prop.x); ++i) {
		color += texture2D(original, coord);
		coord += cstep;
	}
	gl_FragColor = color / float(u_nsample + prop.x);
}

This shader is workable on html5.
an issue was:
2021-04-21_12-32-23

4 Likes

Thanks!