Skip to main content
Using Deno in production at your company? Earn free Deno merch.
Give us feedback
Module

x/shader_canvas/core/shader_canvas/shader_canvas_container.ts>ShaderCanvasContainer

A rendering engine where you can write WebGL 2.0 shaders using custom tags.
HugoDaniel/shader_canvas
Latest
class ShaderCanvasContainer
extends CanMerge
import { ShaderCanvasContainer } from "https://deno.land/x/shader_canvas@v1.1.1/core/shader_canvas/shader_canvas_container.ts";

This class is meant to be used as an extension.

It represents a container of custom tags. Each child name will be used to register a custom element of type T.

This means that a container can have infinite children, provided that each child has a unique name.

A container is a creator of tags. Each child will be a new tag. This anti-pattern has a set of cool properties, the most used in shader canvas is that it allows the contents of each child to be referenced by the tag name it has.

Example:

Then the contents can be referenced by its child name. This makes it clearer to read and maintain in big HTML trees (the tag collapses). It is also easy to process through the provided DOM access methods.

This class implements the "CanMerge" class, which is an instance of HTMLElement and allows modules to be used in it (their payloads can be merged here).

Properties

content: Map<string, T>

This Map associates each new tag child name with its T class instance.

This is helpful when accessing or referencing within a container function.

It avoids querying the DOM.

createContentComponentsWith: (parent: CustomElementConstructor) => unknown

Read all children and create custom elements with their name.

For each child, creates the element with the name it has, as an anonymous class of the CustomElementConstructor provided as argument.

This function is intended to be called by the container initialize() function.