grayscale-shader.htm

<!-- https://gist.github.com/Volcanoscar/4a9500d240497d3c0228f663593d167a -->
  <script id="drawImage-fragment-shader" type="x-shader/x-fragment">
  precision mediump float;
   
  varying vec2 v_texcoord;
   
  uniform sampler2D u_texture;
  uniform float u_colorFactor;
   
  void main() {
    vec4 sample =  texture2D(u_texture, v_texcoord);
    float grey = 0.21 * sample.r + 0.71 * sample.g + 0.07 * sample.b;
    gl_FragColor = vec4(sample.r * u_colorFactor + grey * (1.0 - u_colorFactor), sample.g * u_colorFactor + grey * (1.0 - u_colorFactor), sample.b * u_colorFactor + grey * (1.0 - u_colorFactor), 1.0);
  }
  </script>