how to use custom shaders?

[anekix]

hi how can i use cutom fragment shaders? as far as i can see i can only pass a custom colorMatrix toaddFilter. suppose i want to achieve bloom effect how can i go about it?

[phoboslab]

Currently, there's no built in API to define custom shaders from the outside. However, you can easily add a new filter in the source. I.e.:

	filter.bloom = function( bloomSize ) {

		var program = _compileShader(_filter.bloom.SHADER);
		gl.uniform2f(program.uniform.bloomSize, 0, bloomSize);
		_draw();
	};

	_filter.bloom.SHADER = [
		'precision highp float;',
		'uniform float bloomSize',
		...
	];

I'll happily accept pull requests for a bloom shader!

[anekix]

@phoboslab thankyou, I will work on it and give a PR.

[mreinstein]

being able to declare custom shaders from the outside could introduce another benefit:

we could move the filter implementations out of the main library, and that would mean not needing to pull in every filter when using this library somewhere (i.e., I only use 2 filters in my site/app, I wouldn't need to pull in 250 lines of code that are baked into WebGLImageFilter and never used.)