@lightningjs/renderer 1.0.1 → 2.1.0

package/README.md

@@ -103,10 +103,18 @@ import {
   SdfTrFontFace,
 } from '@lightningjs/renderer';
 
+import {
+  WebGlCoreRenderer,
+  SdfTextRenderer,
+} from '@lightningjs/renderer/webgl';
+import { CanvasTextRenderer } from '@lightningjs/renderer/canvas';
+
 const renderer = new RendererMain(
   {
     appWidth: 1920,
     appHeight: 1080,
+    renderEngine: WebGlCoreRenderer,
+    fontEngines: [SdfTextRenderer, CanvasTextRenderer],
     // ...Other Renderer Config
   },
   'app', // id of div to insert Canvas.
@@ -128,3 +136,12 @@ renderer.stage.fontManager.addFontFace(
   ),
 );
 ```
+
+Please note that the WebGL renderer supports both SDF Fonts and Web Fonts, however the
+Canvas renderer only supports Web Fonts:
+
+| Font Type Renderer | SDF Font | Web Font |
+| ------------------ | -------- | -------- |
+| WebGL              | Y        | Y        |
+| Canvas             | N        | Y        |
+|                    |          |          |

package/dist/exports/canvas.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Canvas Text Renderer
+ *
+ * @remarks
+ * This module exports the Canvas Text Renderer for the Lightning 3 Renderer.
+ * The Canvas Text Renderer is used to render text using the Canvas API,
+ * this is slightly less performant than the SDF Text Renderer. However
+ * the Canvas Text Renderer is more widely supported on older devices.
+ *
+ * You can import the exports from this module like so:
+ * ```ts
+ * import { CanvasTextRenderer } from '@lightning/renderer';
+ * ```
+ *
+ * @module Canvas
+ *
+ * @packageDocumentation
+ */
+export { CanvasTextRenderer } from '../src/core/text-rendering/renderers/CanvasTextRenderer.js';
+export { CanvasCoreRenderer } from '../src/core/renderers/canvas/CanvasCoreRenderer.js';

package/dist/exports/canvas.js

@@ -0,0 +1,39 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Canvas Text Renderer
+ *
+ * @remarks
+ * This module exports the Canvas Text Renderer for the Lightning 3 Renderer.
+ * The Canvas Text Renderer is used to render text using the Canvas API,
+ * this is slightly less performant than the SDF Text Renderer. However
+ * the Canvas Text Renderer is more widely supported on older devices.
+ *
+ * You can import the exports from this module like so:
+ * ```ts
+ * import { CanvasTextRenderer } from '@lightning/renderer';
+ * ```
+ *
+ * @module Canvas
+ *
+ * @packageDocumentation
+ */
+export { CanvasTextRenderer } from '../src/core/text-rendering/renderers/CanvasTextRenderer.js';
+export { CanvasCoreRenderer } from '../src/core/renderers/canvas/CanvasCoreRenderer.js';
+//# sourceMappingURL=canvas.js.map

package/dist/exports/canvas.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas.js","sourceRoot":"","sources":["../../exports/canvas.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAAE,kBAAkB,EAAE,MAAM,4DAA4D,CAAC;AAChG,OAAO,EAAE,kBAAkB,EAAE,MAAM,oDAAoD,CAAC"}

package/dist/exports/index.d.ts

@@ -15,7 +15,7 @@
  * capabilities of the Renderer. The Main API code always runs from the main
  * thread.
  *
- * @module
+ * @module Renderer
  */
 export * from '../src/main-api/INode.js';
 export * from '../src/main-api/Renderer.js';
@@ -29,16 +29,14 @@ export type { ShaderMap, EffectMap } from '../src/core/CoreShaderManager.js';
 export type { TextRendererMap } from '../src/core/text-rendering/renderers/TextRenderer.js';
 export type { TrFontFaceMap } from '../src/core/text-rendering/font-face-types/TrFontFace.js';
 export type { AnimationSettings } from '../src/core/animations/CoreAnimation.js';
-export type { EffectProps, FadeOutEffectProps, LinearGradientEffectProps, RadialGradientEffectProps, GrayscaleEffectProps, GlitchEffectProps, RadialProgressEffectProps, } from '../src/core/CoreShaderManager.js';
+export type { EffectProps, FadeOutEffectProps, LinearGradientEffectProps, RadialGradientEffectProps, GrayscaleEffectProps, GlitchEffectProps, RadialProgressEffectProps, HolePunchEffectProps, } from '../src/core/CoreShaderManager.js';
 export type { WebGlCoreRenderer } from '../src/core/renderers/webgl/WebGlCoreRenderer.js';
 export type { WebGlCoreCtxTexture } from '../src/core/renderers/webgl/WebGlCoreCtxTexture.js';
+export type { Inspector } from '../src/main-api/Inspector.js';
 export * from '../src/core/renderers/webgl/WebGlCoreShader.js';
 export * from '../src/core/renderers/webgl/shaders/effects/ShaderEffect.js';
 export type { ShaderProgramSources } from '../src/core/renderers/webgl/internal/ShaderUtils.js';
 export * from '../src/core/textures/Texture.js';
-export * from '../src/core/text-rendering/renderers/TextRenderer.js';
-export * from '../src/core/text-rendering/renderers/CanvasTextRenderer.js';
-export * from '../src/core/text-rendering/renderers/SdfTextRenderer/SdfTextRenderer.js';
 export * from '../src/core/text-rendering/font-face-types/TrFontFace.js';
 export * from '../src/core/text-rendering/font-face-types/WebTrFontFace.js';
 export * from '../src/core/text-rendering/font-face-types/SdfTrFontFace/SdfTrFontFace.js';

package/dist/exports/index.js

@@ -33,7 +33,7 @@
  * capabilities of the Renderer. The Main API code always runs from the main
  * thread.
  *
- * @module
+ * @module Renderer
  */
 export * from '../src/main-api/INode.js';
 export * from '../src/main-api/Renderer.js';
@@ -50,9 +50,7 @@ export * from '../src/core/renderers/webgl/shaders/effects/ShaderEffect.js';
 // Textures
 export * from '../src/core/textures/Texture.js';
 // Text Rendering & Fonts
-export * from '../src/core/text-rendering/renderers/TextRenderer.js';
-export * from '../src/core/text-rendering/renderers/CanvasTextRenderer.js';
-export * from '../src/core/text-rendering/renderers/SdfTextRenderer/SdfTextRenderer.js';
+// export * from '../src/core/text-rendering/renderers/TextRenderer.js';
 export * from '../src/core/text-rendering/font-face-types/TrFontFace.js';
 export * from '../src/core/text-rendering/font-face-types/WebTrFontFace.js';
 export * from '../src/core/text-rendering/font-face-types/SdfTrFontFace/SdfTrFontFace.js';

package/dist/exports/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../exports/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH;;;;;;;;;;;;;;;;;;GAkBG;AAEH,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qCAAqC,CAAC;AACpD,cAAc,4CAA4C,CAAC;AAC3D,cAAc,uCAAuC,CAAC;AACtD,cAAc,8BAA8B,CAAC;AAE7C,yEAAyE;AACzE,2BAA2B;AAC3B,OAAO,EACL,kBAAkB,GAEnB,MAAM,mCAAmC,CAAC;AAkB3C,UAAU;AACV,cAAc,gDAAgD,CAAC;AAC/D,cAAc,6DAA6D,CAAC;AAG5E,WAAW;AACX,cAAc,iCAAiC,CAAC;AAEhD,yBAAyB;AACzB,cAAc,sDAAsD,CAAC;AACrE,cAAc,4DAA4D,CAAC;AAC3E,cAAc,yEAAyE,CAAC;AACxF,cAAc,0DAA0D,CAAC;AACzE,cAAc,6DAA6D,CAAC;AAC5E,cAAc,2EAA2E,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../exports/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH;;;;;;;;;;;;;;;;;;GAkBG;AAEH,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qCAAqC,CAAC;AACpD,cAAc,4CAA4C,CAAC;AAC3D,cAAc,uCAAuC,CAAC;AACtD,cAAc,8BAA8B,CAAC;AAE7C,yEAAyE;AACzE,2BAA2B;AAC3B,OAAO,EACL,kBAAkB,GAEnB,MAAM,mCAAmC,CAAC;AAoB3C,UAAU;AACV,cAAc,gDAAgD,CAAC;AAC/D,cAAc,6DAA6D,CAAC;AAG5E,WAAW;AACX,cAAc,iCAAiC,CAAC;AAEhD,yBAAyB;AACzB,wEAAwE;AACxE,cAAc,0DAA0D,CAAC;AACzE,cAAc,6DAA6D,CAAC;AAC5E,cAAc,2EAA2E,CAAC"}

package/dist/exports/inspector.d.ts

@@ -0,0 +1,4 @@
+/**
+ * @module Inspector
+ */
+export { Inspector } from '../src/main-api/Inspector.js';

package/dist/exports/inspector.js

@@ -0,0 +1,23 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * @module Inspector
+ */
+export { Inspector } from '../src/main-api/Inspector.js';
+//# sourceMappingURL=inspector.js.map

package/dist/exports/inspector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inspector.js","sourceRoot":"","sources":["../../exports/inspector.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH;;GAEG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/exports/utils.d.ts

@@ -18,6 +18,8 @@
  * Lightning Renderer, and not specific to any particular platform.
  *
  * @packageDocumentation
+ *
+ * @module Utils
  */
 export { assertTruthy, mergeColorAlpha, deg2Rad } from '../src/utils.js';
 export { getNormalizedRgbaComponents } from '../src/core/lib/utils.js';

package/dist/exports/utils.js

@@ -36,6 +36,8 @@
  * Lightning Renderer, and not specific to any particular platform.
  *
  * @packageDocumentation
+ *
+ * @module Utils
  */
 export { assertTruthy, mergeColorAlpha, deg2Rad } from '../src/utils.js';
 export { getNormalizedRgbaComponents } from '../src/core/lib/utils.js';

package/dist/exports/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../exports/utils.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../exports/utils.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/exports/webgl.d.ts

@@ -0,0 +1,19 @@
+/**
+ * SDF Font renderer
+ *
+ * @remarks
+ * This module exports the SDF Font renderer for the Lightning 3 Renderer.
+ * The SDF Font renderer is used to render text using Single-Channel Signed
+ * Distance Field (SSDF) fonts or Multi-Channel Signed Distance Field (MSDF)
+ * fonts. The SDF font renderer is used to render text in a way that is
+ * optimized for GPU rendering.
+ *
+ * You can import the exports from this module like so:
+ * ```ts
+ * import { SdfTextRenderer } from '@lightning/renderer';
+ * ```
+ *
+ * @packageDocumentation
+ */
+export { SdfTextRenderer } from '../src/core/text-rendering/renderers/SdfTextRenderer/SdfTextRenderer.js';
+export { WebGlCoreRenderer } from '../src/core/renderers/webgl/WebGlCoreRenderer.js';

package/dist/exports/webgl.js

@@ -0,0 +1,38 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * SDF Font renderer
+ *
+ * @remarks
+ * This module exports the SDF Font renderer for the Lightning 3 Renderer.
+ * The SDF Font renderer is used to render text using Single-Channel Signed
+ * Distance Field (SSDF) fonts or Multi-Channel Signed Distance Field (MSDF)
+ * fonts. The SDF font renderer is used to render text in a way that is
+ * optimized for GPU rendering.
+ *
+ * You can import the exports from this module like so:
+ * ```ts
+ * import { SdfTextRenderer } from '@lightning/renderer';
+ * ```
+ *
+ * @packageDocumentation
+ */
+export { SdfTextRenderer } from '../src/core/text-rendering/renderers/SdfTextRenderer/SdfTextRenderer.js';
+export { WebGlCoreRenderer } from '../src/core/renderers/webgl/WebGlCoreRenderer.js';
+//# sourceMappingURL=webgl.js.map

package/dist/exports/webgl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webgl.js","sourceRoot":"","sources":["../../exports/webgl.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAE,eAAe,EAAE,MAAM,yEAAyE,CAAC;AAC1G,OAAO,EAAE,iBAAiB,EAAE,MAAM,kDAAkD,CAAC"}

package/dist/src/common/EventEmitter.d.ts

@@ -1,4 +1,4 @@
-import type { IEventEmitter } from '@lightningjs/threadx';
+import type { IEventEmitter } from './IEventEmitter.js';
 /**
  * EventEmitter base class
  */

package/dist/src/common/IAnimationController.d.ts

@@ -1,4 +1,4 @@
-import type { IEventEmitter } from '@lightningjs/threadx';
+import type { IEventEmitter } from './IEventEmitter.js';
 export type AnimationControllerState = 'running' | 'paused' | 'stopped';
 /**
  * Animation Controller interface

package/dist/src/common/IEventEmitter.d.ts

@@ -0,0 +1,8 @@
+export interface IEventEmitter<T extends object = {
+    [s: string]: (target: any, data: any) => void;
+}> {
+    on<K extends keyof T>(event: Extract<K, string>, listener: T[K]): void;
+    once<K extends keyof T>(event: Extract<K, string>, listener: T[K]): void;
+    off<K extends keyof T>(event: Extract<K, string>, listener: T[K]): void;
+    emit<K extends keyof T>(event: Extract<K, string>, data: Parameters<any>[1]): void;
+}

package/dist/src/common/IEventEmitter.js

@@ -0,0 +1,18 @@
+/*
+ * Copyright 2023 Comcast Cable Communications Management, LLC
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ */
+export {};
+//# sourceMappingURL=IEventEmitter.js.map

package/dist/src/common/IEventEmitter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IEventEmitter.js","sourceRoot":"","sources":["../../../src/common/IEventEmitter.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG"}

package/dist/src/core/CoreNode.d.ts

@@ -114,6 +114,10 @@ export declare enum UpdateType {
      * Track if parent has render texture
      */
     ParentRenderTexture = 4096,
+    /**
+     * Render Bounds update
+     */
+    RenderBounds = 8192,
     /**
      * None
      */
@@ -337,6 +341,11 @@ export interface CoreNodeProps {
      * {@link TextRenderer} and should not be set explicitly.
      */
     texture: Texture | null;
+    /**
+     * Whether to prevent the node from being cleaned up
+     * @default false
+     */
+    preventCleanup: boolean;
     /**
      * Options to associate with the Node's Texture
      */
@@ -542,6 +551,45 @@ export interface CoreNodeProps {
      * @default `undefined`
      */
     data?: CustomDataMap;
+    /**
+     * Image Type to explicitly set the image type that is being loaded
+     *
+     * @remarks
+     * This property must be used with a `src` that points at an image. In some cases
+     * the extension doesn't provide a reliable representation of the image type. In such
+     * cases set the ImageType explicitly.
+     *
+     * `regular` is used for normal images such as png, jpg, etc
+     * `compressed` is used for ETC1/ETC2 compressed images with a PVR or KTX container
+     * `svg` is used for scalable vector graphics
+     *
+     * @default `undefined`
+     */
+    imageType?: 'regular' | 'compressed' | 'svg' | null;
+    /**
+     * She width of the rectangle from which the Image Texture will be extracted.
+     * This value can be negative. If not provided, the image's source natural
+     * width will be used.
+     */
+    srcWidth?: number;
+    /**
+     * The height of the rectangle from which the Image Texture will be extracted.
+     * This value can be negative. If not provided, the image's source natural
+     * height will be used.
+     */
+    srcHeight?: number;
+    /**
+     * The x coordinate of the reference point of the rectangle from which the Texture
+     * will be extracted.  `width` and `height` are provided. And only works when
+     * createImageBitmap is available. Only works when createImageBitmap is supported on the browser.
+     */
+    srcX?: number;
+    /**
+     * The y coordinate of the reference point of the rectangle from which the Texture
+     * will be extracted. Only used when source `srcWidth` width and `srcHeight` height
+     * are provided. Only works when createImageBitmap is supported on the browser.
+     */
+    srcY?: number;
 }
 /**
  * Grab all the number properties of type T
@@ -615,8 +663,10 @@ export declare class CoreNode extends EventEmitter {
      */
     update(delta: number, parentClippingRect: RectWithValid): void;
     checkRenderProps(): boolean;
-    checkRenderBounds(parentClippingRect: RectWithValid): CoreNodeRenderState;
-    updateRenderState(parentClippingRect: RectWithValid): void;
+    checkRenderBounds(): CoreNodeRenderState;
+    createPreloadBounds(strictBound: Bound): Bound;
+    createRenderBounds(): void;
+    updateRenderState(): void;
     /**
      * This function updates the `isRenderable` property based on certain conditions.
      *
@@ -642,6 +692,8 @@ export declare class CoreNode extends EventEmitter {
     destroy(): void;
     renderQuads(renderer: CoreRenderer): void;
     get id(): number;
+    get data(): CustomDataMap | undefined;
+    set data(d: CustomDataMap | undefined);
     get x(): number;
     set x(value: number);
     get absX(): number;
@@ -702,12 +754,24 @@ export declare class CoreNode extends EventEmitter {
     set zIndex(value: number);
     get parent(): CoreNode | null;
     set parent(newParent: CoreNode | null);
+    get preventCleanup(): boolean;
+    set preventCleanup(value: boolean);
     get rtt(): boolean;
     set rtt(value: boolean);
     get shader(): BaseShaderController;
     set shader(value: BaseShaderController);
     get src(): string | null;
     set src(imageUrl: string | null);
+    set imageType(type: 'regular' | 'compressed' | 'svg' | null);
+    get imageType(): 'regular' | 'compressed' | 'svg' | null;
+    get srcHeight(): number | undefined;
+    set srcHeight(value: number);
+    get srcWidth(): number | undefined;
+    set srcWidth(value: number);
+    get srcX(): number | undefined;
+    set srcX(value: number);
+    get srcY(): number | undefined;
+    set srcY(value: number);
     /**
      * Returns the framebuffer dimensions of the node.
      * If the node has a render texture, the dimensions are the same as the node's dimensions.