Class WebGLFilterBackend

constructor

• new WebGLFilterBackend(__namedParameters?): WebGLFilterBackend

• Parameters

  • __namedParameters: {
        tileSize: undefined | number;
    } = {}

    • tileSize: undefined | number

  Returns WebGLFilterBackend

aPosition

canvas

gl

gpuInfo

Optional imageBuffer

programCache

resources

textureCache

tileSize

applyFilters

• applyFilters(filters, source, width, height, targetCanvas, cacheKey?): undefined | TWebGLPipelineState

• Attempts to apply the requested filters to the source provided, drawing the filtered output to the provided target canvas.

  Parameters

  • filters: BaseFilter[]

    The filters to apply.

  • source: TexImageSource

    The source to be filtered.

  • width: number

    The width of the source input.

  • height: number

    The height of the source input.

  • targetCanvas: HTMLCanvasElement

    The destination for filtered output to be drawn.

  • Optional cacheKey: string

    A key used to cache resources related to the source. If omitted, caching will be skipped.

  Returns undefined | TWebGLPipelineState

captureGPUInfo

• captureGPUInfo(): any

• Attempt to extract GPU information strings from a WebGL context.

  Useful information when debugging or blacklisting specific GPUs.

  Returns any

  A GPU info object with renderer and vendor strings.

chooseFastestCopyGLTo2DMethod

• chooseFastestCopyGLTo2DMethod(width, height): void

• Pick a method to copy data from GL context to 2d canvas. In some browsers using drawImage should be faster, but is also bugged for a small combination of old hardware and drivers. putImageData is faster than drawImage for that specific operation.

  Parameters

  • width: number

  • height: number

  Returns void

clearWebGLCaches

• clearWebGLCaches(): void

• Wipe out WebGL-related caches.

  Returns void

copyGLTo2D

• copyGLTo2D(gl, pipelineState): void

• Copy an input WebGL canvas on to an output 2D canvas.

  The WebGL canvas is assumed to be upside down, with the top-left pixel of the desired output image appearing in the bottom-left corner of the WebGL canvas.

  Parameters

  • gl: WebGLRenderingContext

  • pipelineState: TWebGLPipelineState

    The 2D target canvas to copy on to.

  Returns void

createTexture

• createTexture(gl, width, height, textureImageSource?, filter?): null | WebGLTexture

• Create a WebGL texture object.

  Accepts specific dimensions to initialize the texture to or a source image.

  Parameters

  • gl: WebGLRenderingContext

    The GL context to use for creating the texture.

  • width: number

    The width to initialize the texture at.

  • height: number

    The height to initialize the texture.

  • Optional textureImageSource: TexImageSource

    A source for the texture data.

  • Optional filter: number

    gl.NEAREST default or gl.LINEAR filters for the texture. This filter is very useful for LUTs filters. If you need interpolation use gl.LINEAR

  Returns null | WebGLTexture

createWebGLCanvas

• createWebGLCanvas(width, height): void

• Create a canvas element and associated WebGL context and attaches them as class properties to the GLFilterBackend class.

  Parameters

  • width: number

  • height: number

  Returns void

dispose

• dispose(): void

• Detach event listeners, remove references, and clean up caches.

  Returns void

evictCachesForKey

• evictCachesForKey(cacheKey): void

• Clear out cached resources related to a source image that has been filtered previously.

  Parameters

  • cacheKey: string

    The cache key provided when the source image was filtered.

  Returns void

getCachedTexture

• getCachedTexture(uniqueId, textureImageSource, filter?): null | WebGLTexture

• Can be optionally used to get a texture from the cache array

  If an existing texture is not found, a new texture is created and cached.

  Parameters

  • uniqueId: string

    A cache key to use to find an existing texture.

  • textureImageSource: TexImageSource

    A source to use to create the texture cache entry if one does not already exist.

  • Optional filter: number

  Returns null | WebGLTexture

setupGLContext

• setupGLContext(width, height): void

• Setup a WebGL context suitable for filtering, and bind any needed event handlers.

  Parameters

  • width: number

  • height: number

  Returns void