ShaderPlugin
Generic shader plugin
ShaderPlugin is a specialization of a Plugin for ShaderRenderer. They apply complex computationally demanding post-processing effects to the input stream. For example, simple mono-chrome or sepia effects, or more complex face beatification and dynamic geometry filters. ShaderPlugin shares webgl context with the main renderer. Basic implementation uses ShaderProgram created for shaders provided to plugin’s constructor. Plugins are organized in chain within ShaderRenderer, input of the next shader is output of the previous and initial input is original video image, output of the last plugin is rendered.
Extends
Plugin
<ResultT
>
Extended by
Type Parameters
• ResultT extends object
= object
Type of processing results
Constructors
new ShaderPlugin()
new ShaderPlugin<
ResultT
>(inputs
?,uniforms
?,fragSrc
?,vertSrc
?):ShaderPlugin
<ResultT
>
Constructor
Parameters
• inputs?: string
[]
Shader texture inputs (names of sampler uniforms)
• uniforms?
Shader uniforms as name-type map object
• fragSrc?: string
Code of fragment shader (copy shader by default)
• vertSrc?: string
Vertex shader source (copy shader by default)
Returns
ShaderPlugin
<ResultT
>
Overrides
Properties
fragSrc?
protected
optional
fragSrc:string
Code of fragment shader (copy shader by default)
inputs?
protected
optional
inputs:string
[]
Shader texture inputs (names of sampler uniforms)
loaded
loaded:
boolean
=false
Loaded state
Inherited from
ordinal
ordinal:
number
=PluginOrdinal.Render
Ordinal number
Inherited from
renderer?
protected
optional
renderer:Renderer
<ResultT
>
Renderer loaded the plugin
Inherited from
shader?
protected
optional
shader:ShaderProgram
Rendering shader
shaderCtx?
protected
optional
shaderCtx:WebGL2RenderingContext
Rendering context
size
protected
size:Size
Image size
uniforms?
protected
optional
uniforms:object
Shader uniforms as name-type map object
Index Signature
[key
: string
]: UniformType
vertSrc?
protected
optional
vertSrc:string
Vertex shader source (copy shader by default)
Methods
dispose()
dispose():
void
Dispose video plugin
Returns
void
Inherited from
load()
load(
renderer
):Promise
<void
>
Initialize plugin
Initializes resources required for shader effect. Acquires webgl context of the main webgl renderer. Basic implementation creates and compiles rendering program for shaders provided to plugin’s constructor. Overridden by derived classes for particular effect.
Parameters
• renderer: Renderer
<ResultT
>
Renderer this plugin is attached to
Returns
Promise
<void
>
Promise resolving when initialization is finished
Overrides
process()
process(
result
,input
):Promise
<boolean
>
Process the image
Main method implementing webgl shader effect or filter. It’s called by update() and should be overridden to add custom logic. process() should return true if effect is successfully applied and false if it is skipped, for example, if effect applies only when result is not empty.
Parameters
• result: ResultT
Results of video processing
• input: WebGLTexture
Current image texture
Returns
Promise
<boolean
>
True on success, false otherwise
setupCamera()
setupCamera(
ratio
,angle
):void
Set camera parameters
Could be overridden to adjust plugin’s pipeline.
Parameters
• ratio: number
Aspect ration of input video
• angle: number
Vertical field of view in radians
Returns
void
Inherited from
setupVideo()
setupVideo(
size
):void
Set video size
Adjusts shader and texture to a new size.
Parameters
• size: Size
Resolution of input video
Returns
void
Overrides
unload()
unload():
void
Reset plugin
Releases all resources and instances created in load(). Overridden by derived classes for particular effect.
Returns
void
Overrides
update()
update(
result
,stream
):Promise
<void
>
Sealed
Update the image
Main method implementing webgl shader effect or filter. ShaderRenderer keeps track of the current iamge texture that will be be rendered. ShaderPlugin uses the current texture as input and writes results to ShaderPlugin#output. ShaderPlugin#output becomes new current texture of ShaderRenderer. This way all ShaderPlugins attached to renderer organize a chain of effects applied on top of each other. Method process() implements shader effect itself, it’s intended to be overridden by effect authors.
Parameters
• result: ResultT
Results of video processing
• stream: HTMLCanvasElement
Captured video frame
Returns
Promise
<void
>
Promise resolving when update is finished