@lightningtv/renderer 2.16.1 → 3.2.3

package/package.json

@@ -1,18 +1,19 @@
 {
   "name": "@lightningtv/renderer",
-  "version": "2.16.1",
-  "description": "Lightning 3 Renderer",
+  "version": "3.2.3",
+  "description": "SolidTV Renderer",
   "type": "module",
   "main": "./dist/exports/index.js",
   "exports": {
     ".": "./dist/exports/index.js",
     "./utils": "./dist/exports/utils.js",
     "./canvas": "./dist/exports/canvas.js",
+    "./canvas/shaders": "./dist/exports/canvas-shaders.js",
     "./webgl": "./dist/exports/webgl.js",
+    "./webgl/shaders": "./dist/exports/webgl-shaders.js",
     "./inspector": "./dist/exports/inspector.js"
   },
   "scripts": {
-    "preinstall": "node scripts/please-use-pnpm.js",
     "start": "cd examples && pnpm start",
     "start:prod": "cd examples && pnpm start:prod",
     "build": "tsc --build",
@@ -30,7 +31,8 @@
     "typedoc": "typedoc",
     "prepare": "husky install",
     "prepack": "pnpm run build",
-    "node-version": "node --version"
+    "node-version": "node --version",
+    "release": "release-it"
   },
   "repository": {
     "type": "git",
@@ -44,26 +46,27 @@
     "JS",
     "WPE"
   ],
-  "author": "Comcast Cable Communications Management, LLC",
+  "author": "Chris Lorenzo",
   "license": "Apache-2.0",
   "bugs": {
     "url": "https://github.com/lightning-tv/renderer/issues"
   },
   "homepage": "https://github.com/lightning-tv/renderer#readme",
   "devDependencies": {
-    "@types/node": "^20.0.0",
-    "@typescript-eslint/eslint-plugin": "^8.16.0",
-    "@typescript-eslint/parser": "^8.16.0",
-    "@vitest/coverage-v8": "^2.1.5",
-    "concurrently": "^8.0.1",
-    "eslint": "^9.15.0",
-    "eslint-config-prettier": "^8.7.0",
+    "@types/node": "^20.19.17",
+    "@typescript-eslint/eslint-plugin": "^8.44.0",
+    "@typescript-eslint/parser": "^8.44.0",
+    "@vitest/coverage-v8": "^2.1.9",
+    "concurrently": "^8.2.2",
+    "eslint": "^9.36.0",
+    "eslint-config-prettier": "^8.10.2",
     "husky": "^8.0.3",
-    "lint-staged": "^13.2.0",
-    "prettier": "^2.8.4",
-    "typedoc": "^0.26.11",
-    "typescript": "~5.6.3",
-    "vitest": "^2.0.0",
+    "lint-staged": "^13.3.0",
+    "prettier": "^2.8.8",
+    "release-it": "^17.10.0",
+    "typedoc": "^0.28.13",
+    "typescript": "~5.9.2",
+    "vitest": "^2.1.9",
     "vitest-mock-extended": "^2.0.2"
   },
   "lint-staged": {
@@ -82,10 +85,10 @@
     "README.md",
     "scripts"
   ],
-  "packageManager": "pnpm@8.9.2",
+  "packageManager": "pnpm@10.17.0",
   "engines": {
     "npm": ">= 10.0.0",
-    "pnpm": ">= 8.9.2",
-    "node": ">= 20.9.0"
+    "pnpm": ">= 10.17.0",
+    "node": ">= 18.0.0"
   }
 }

package/src/common/CommonTypes.ts

@@ -1,23 +1,5 @@
-/*
- * 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.
- */
-
 import type { CoreNodeRenderState } from '../core/CoreNode.js';
+import type { TextureError } from '../core/TextureError.js';
 
 /**
  * Types shared between Main Space and Core Space
@@ -31,8 +13,8 @@ import type { CoreNodeRenderState } from '../core/CoreNode.js';
  * Represents a width and height.
  */
 export interface Dimensions {
-  width: number;
-  height: number;
+  w: number;
+  h: number;
 }
 
 /**
@@ -71,7 +53,7 @@ export type NodeTextFailedPayload = {
  */
 export type NodeTextureFailedPayload = {
   type: 'texture';
-  error: Error;
+  error: TextureError;
 };
 
 /**
@@ -81,6 +63,14 @@ export type NodeTextureFreedPayload = {
   type: 'texture';
 };
 
+/**
+ * Payload for when node renderable status changes
+ */
+export type NodeRenderablePayload = {
+  type: 'renderable';
+  isRenderable: boolean;
+};
+
 /**
  * Combined type for all failed payloads
  */
@@ -104,6 +94,14 @@ export type NodeFailedEventHandler = (
   payload: NodeFailedPayload,
 ) => void;
 
+/**
+ * Event handler for when the renderable status of a node changes
+ */
+export type NodeRenderableEventHandler = (
+  target: any,
+  payload: NodeRenderablePayload,
+) => void;
+
 export type NodeRenderStatePayload = {
   type: 'renderState';
   payload: CoreNodeRenderState;

package/src/common/EventEmitter.ts

@@ -1,22 +1,3 @@
-/*
- * 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.
- */
-
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
 /* eslint-disable @typescript-eslint/no-unsafe-assignment */
 /* eslint-disable @typescript-eslint/no-unsafe-call */

package/src/common/IAnimationController.ts

@@ -1,21 +1,3 @@
-/*
- * 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.
- */
 import type { IEventEmitter } from './IEventEmitter.js';
 
 export type AnimationControllerState =

package/src/common/IEventEmitter.ts

@@ -1,20 +1,3 @@
-/*
- * 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 interface IEventEmitter<
   T extends object = { [s: string]: (target: any, data: any) => void },
 > {

package/src/core/Autosizer.ts

@@ -0,0 +1,205 @@
+import { UpdateType, type CoreNode } from './CoreNode.js';
+import type { Coord } from './lib/utils.js';
+
+export enum AutosizeMode {
+  Children = 0,
+  Texture = 1,
+}
+
+export enum AutosizeUpdateType {
+  None = 0,
+  Filtered = 1,
+  All = 2,
+}
+
+const applyDimensions = (node: CoreNode, w: number, h: number) => {
+  node.props.w = w;
+  node.props.h = h;
+  node.setUpdateType(UpdateType.Local);
+};
+
+const getFilteredChildren = (
+  children: number[],
+  childMap: Map<number, CoreNode>,
+) => {
+  const filtered: CoreNode[] = [];
+  while (children.length > 0) {
+    const id = children.pop()!;
+    const child = childMap.get(id)!;
+    filtered.push(child);
+  }
+  return filtered;
+};
+
+let autosizerId = 0;
+
+export class Autosizer {
+  public id = autosizerId++;
+  mode: AutosizeMode = AutosizeMode.Children;
+  updateType: AutosizeUpdateType = AutosizeUpdateType.All;
+  lastWidth: number = 0;
+  lastHeight: number = 0;
+  lastHasChanged: boolean = false;
+
+  flaggedChildren: number[] = [];
+  childMap: Map<number, CoreNode> = new Map();
+
+  minX = Infinity;
+  minY = Infinity;
+  maxX = -Infinity;
+  maxY = -Infinity;
+
+  corners: [Coord, Coord, Coord, Coord] = [
+    { x: 0, y: 0 },
+    { x: 0, y: 0 },
+    { x: 0, y: 0 },
+    { x: 0, y: 0 },
+  ];
+
+  constructor(public node: CoreNode) {
+    if (node.texture !== null) {
+      this.mode = AutosizeMode.Texture;
+    }
+  }
+
+  attach(node: CoreNode) {
+    this.childMap.set(node.id, node);
+    node.parentAutosizer = this;
+
+    //bubble down to attach to grandchildren
+    if (node.children.length > 0 && node.autosizer === null) {
+      const children = node.children;
+      for (let i = 0; i < children.length; i++) {
+        this.attach(children[i]!);
+      }
+    }
+  }
+
+  detach(node: CoreNode) {
+    if (this.childMap.delete(node.id) === true) {
+      node.parentAutosizer = null;
+      if (node.children.length > 0 && node.autosizer === null) {
+        const children = node.children;
+        for (let i = 0; i < children.length; i++) {
+          this.detach(children[i]!);
+        }
+      }
+      //detached a child, need full update
+      this.setUpdateType(AutosizeUpdateType.All);
+    }
+  }
+
+  patch(id: number) {
+    const entry = this.childMap.get(id);
+    if (entry === undefined) {
+      return;
+    }
+    this.flaggedChildren.push(id);
+    this.setUpdateType(AutosizeUpdateType.Filtered);
+  }
+
+  setUpdateType(updateType: AutosizeUpdateType) {
+    this.updateType |= updateType;
+    this.node.setUpdateType(UpdateType.Autosize);
+  }
+
+  setMode(mode: AutosizeMode) {
+    this.mode = mode;
+    this.setUpdateType(AutosizeUpdateType.All);
+  }
+
+  update() {
+    const node = this.node;
+
+    if (
+      this.mode === AutosizeMode.Texture &&
+      node.texture !== null &&
+      node.texture.dimensions !== null
+    ) {
+      const { w, h } = node.texture.dimensions;
+      if (w !== node.w || h !== node.h) {
+        applyDimensions(node, w, h);
+      }
+      this.lastWidth = w;
+      this.lastHeight = h;
+      this.updateType = AutosizeUpdateType.None;
+      return;
+    }
+
+    let filtered: CoreNode[] =
+      this.updateType === AutosizeUpdateType.Filtered
+        ? getFilteredChildren(this.flaggedChildren, this.childMap)
+        : Array.from(this.childMap.values());
+
+    if (filtered.length === 0) {
+      return;
+    }
+
+    const corners = this.corners;
+    let minX = this.minX;
+    let minY = this.minY;
+    let maxX = this.maxX;
+    let maxY = this.maxY;
+
+    for (let i = 0; i < filtered.length; i++) {
+      const child = filtered[i]!;
+      if (child.isRenderable === false || child.localTransform === undefined) {
+        continue;
+      }
+
+      const { tx, ty, ta, tb, tc, td } = child.localTransform;
+      const w = child.props.w;
+      const h = child.props.h;
+
+      const childMinX = tx;
+      const childMaxX = tx + w * ta;
+      const childMinY = ty;
+      const childMaxY = ty + h * td;
+
+      corners[0].x = childMinX;
+      corners[0].y = childMinY;
+      corners[1].x = childMaxX;
+
+      //no rotation/scale
+      if (tb === 0 && tc === 0) {
+        corners[1].y = childMinY;
+        corners[2].x = childMaxX;
+        corners[2].y = childMaxY;
+        corners[3].x = childMinX;
+        corners[3].y = childMaxY;
+      } else {
+        corners[1].y = tx + w * tc;
+        corners[2].x = tx + w * ta + h * tb;
+        corners[2].y = ty + w * tc + h * td;
+        corners[3].x = tx + h * tb;
+        corners[3].y = ty + h * td;
+      }
+
+      for (let j = 0; j < 4; j++) {
+        const corner = corners[j]!;
+        if (corner.x < minX) minX = corner.x;
+        if (corner.y < minY) minY = corner.y;
+        if (corner.x > maxX) maxX = corner.x;
+        if (corner.y > maxY) maxY = corner.y;
+      }
+    }
+    this.updateType = AutosizeUpdateType.None;
+
+    const newWidth = maxX > 0 ? maxX : 0;
+    const newHeight = maxY > 0 ? maxY : 0;
+
+    applyDimensions(node, newWidth, newHeight);
+    this.lastWidth = newWidth;
+    this.lastHeight = newHeight;
+  }
+
+  destroy() {
+    if (this.childMap.size > 0) {
+      for (const child of this.childMap.values()) {
+        child.parentAutosizer = null;
+      }
+    }
+    this.childMap.clear();
+    this.flaggedChildren.length = 0;
+  }
+}