@lightningtv/solid 3.1.18 → 3.2.0

package/src/primitives/FPSCounter.tsx

@@ -3,7 +3,7 @@ import { createSignal } from 'solid-js';
 
 const fpsStyle = {
   color: 0x000000ff,
-  height: 192,
+  height: 216,
   width: 330,
   x: 1900,
   y: 6,
@@ -34,6 +34,12 @@ const [renderableMemUsedSignal, setRenderableMemUsedSignal] = createSignal('');
 const [memUsedSignal, setMemUsedSignal] = createSignal('');
 const [renderableTexturesLoadedSignal, setRenderableTexturesLoadedSignal] = createSignal(0);
 const [loadedTexturesSignal, setLoadedTexturesSignal] = createSignal(0);
+const [renderOps, setRenderOps] = createSignal(0);
+
+interface RenderUpdatePayload {
+  quads: number;
+  renderOps: number;
+}
 
 let count = 0;
 let totalFps = 0;
@@ -88,8 +94,9 @@ export function setupFPS(root: any) {
     }
   });
 
-  root.renderer.on('quadsUpdate', (target: RendererMain, quadsData: any) => {
+  root.renderer.on('renderUpdate', (target: RendererMain, quadsData: RenderUpdatePayload) => {
     setQuads(quadsData.quads);
+    setRenderOps(quadsData.renderOps);
   });
 }
 
@@ -163,30 +170,39 @@ export const FPSCounter = (props: NodeProps) => {
 
         <view height={infoFontSize}>
           <text fontSize={infoFontSize} style={fpsLabel}>
-            renderableTexturesLoaded:
+            Textures In Memory:
           </text>
           <text fontSize={infoFontSize} style={fpsLabel} x={230}>
-            {renderableTexturesLoadedSignal().toString()}
+            {loadedTexturesSignal().toString()}
           </text>
         </view>
 
         <view height={infoFontSize}>
           <text fontSize={infoFontSize} style={fpsLabel}>
-            loadedTextures:
+            Textures On Screen:
           </text>
           <text fontSize={infoFontSize} style={fpsLabel} x={230}>
-            {loadedTexturesSignal().toString()}
+            {renderableTexturesLoadedSignal().toString()}
           </text>
         </view>
 
         <view height={infoFontSize}>
           <text fontSize={infoFontSize} style={fpsLabel}>
-            quads:
+            Quads:
           </text>
           <text fontSize={infoFontSize} style={fpsLabel} x={230}>
             {quads().toString()}
           </text>
         </view>
+
+        <view height={infoFontSize}>
+          <text fontSize={infoFontSize} style={fpsLabel}>
+            Draws:
+          </text>
+          <text fontSize={infoFontSize} style={fpsLabel} x={230}>
+            {renderOps().toString()}
+          </text>
+        </view>
       </view>
     </view>
   );

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

@@ -1,35 +0,0 @@
-import { type ElementNode, LightningRendererNumberProps } from './elementNode.js';
-import { TimingFunction } from '@lightningjs/renderer';
-import { IRendererStage } from './dom-renderer/domRendererTypes.js';
-/**
- * Simplified Animation Settings
- */
-export interface SimpleAnimationSettings {
-    duration?: number;
-    delay?: number;
-    easing?: string | TimingFunction;
-}
-/**
- * Properties of a Node used by the SimpleAnimation
- * (Excludes shaderProps)
- */
-export type SimpleAnimationProps = (typeof LightningRendererNumberProps)[number];
-export declare class SimpleAnimation {
-    private nodeConfigs;
-    private isRegistered;
-    private stage;
-    register(stage: IRendererStage): void;
-    /**
-     * Adds a node and its animation properties to this animation instance.
-     * The animation's start values for the specified properties are captured
-     * from the node's current state when this method is called.
-     *
-     * @param node - The CoreNode to animate.
-     * @param props - The properties to animate and their target values. Only number properties are supported.
-     * @param settings - Animation settings for this specific node animation.
-     */
-    add(node: ElementNode, key: SimpleAnimationProps, value: number, settings: SimpleAnimationSettings): void;
-    update(dt: number): void;
-}
-export declare const simpleAnimation: SimpleAnimation;
-export default simpleAnimation;

package/dist/src/core/animation.js

@@ -1,119 +0,0 @@
-import { getTimingFunction, mergeColorProgress, } from '@lightningjs/renderer/utils';
-import { isFunc } from './utils.js';
-export class SimpleAnimation {
-    nodeConfigs = [];
-    isRegistered = false;
-    stage;
-    register(stage) {
-        if (this.isRegistered) {
-            return;
-        }
-        this.isRegistered = true;
-        this.stage = stage;
-        stage.animationManager.registerAnimation(this);
-    }
-    /**
-     * Adds a node and its animation properties to this animation instance.
-     * The animation's start values for the specified properties are captured
-     * from the node's current state when this method is called.
-     *
-     * @param node - The CoreNode to animate.
-     * @param props - The properties to animate and their target values. Only number properties are supported.
-     * @param settings - Animation settings for this specific node animation.
-     */
-    add(node, key, value, settings) {
-        const existingConfig = this.nodeConfigs.find((config) => config.node === node && config.propName === key);
-        const duration = settings.duration ?? 0;
-        const delay = settings.delay ?? 0;
-        const easing = settings.easing || 'linear';
-        const timingFunction = isFunc(easing) ? easing : getTimingFunction(easing);
-        const targetValue = value;
-        const startValue = node[key];
-        if (existingConfig) {
-            existingConfig.duration = duration;
-            existingConfig.delay = delay;
-            existingConfig.easing = easing;
-            existingConfig.timingFunction = timingFunction;
-            existingConfig.targetValue = targetValue;
-            existingConfig.startValue = startValue;
-            existingConfig.progress = 0;
-            existingConfig.delayFor = delay;
-        }
-        else {
-            this.nodeConfigs.push({
-                node,
-                duration,
-                delay,
-                easing,
-                progress: 0,
-                delayFor: delay,
-                timingFunction,
-                propName: key,
-                startValue,
-                targetValue,
-            });
-        }
-    }
-    update(dt) {
-        // Iterate backward to safely remove finished animations
-        for (let i = this.nodeConfigs.length - 1; i >= 0; i--) {
-            const nodeConfig = this.nodeConfigs[i];
-            const { node, duration, timingFunction, propName, startValue, targetValue, } = nodeConfig;
-            let remainingDt = dt;
-            // 1. Handle Delay
-            if (nodeConfig.delayFor > 0) {
-                nodeConfig.delayFor -= remainingDt;
-                if (nodeConfig.delayFor >= 0) {
-                    // Still in delay phase for this node, skip applying values this frame
-                    continue;
-                }
-                else {
-                    // Delay finished this frame, use the remaining time for animation
-                    remainingDt = -nodeConfig.delayFor;
-                    nodeConfig.delayFor = 0;
-                }
-            }
-            // 2. Update Progress (directly on nodeConfig.progress)
-            if (duration > 0) {
-                nodeConfig.progress += remainingDt / duration;
-                // Clamp progress between 0 and 1
-                nodeConfig.progress = Math.max(0, Math.min(1, nodeConfig.progress));
-            }
-            else if (duration === 0 && nodeConfig.delayFor <= 0) {
-                // Duration is 0 and delay is finished or was 0. Animation completes instantly.
-                nodeConfig.progress = 1;
-            }
-            // 3. Calculate Eased Progress
-            const easedProgress = timingFunction(nodeConfig.progress) || nodeConfig.progress;
-            // 4. Apply Animated Values to the Node
-            let interpolatedValue;
-            if (nodeConfig.progress === 1) {
-                interpolatedValue = targetValue;
-            }
-            else {
-                if (propName.includes('color')) {
-                    // Handle color interpolation
-                    interpolatedValue = mergeColorProgress(startValue, targetValue, easedProgress);
-                }
-                else {
-                    // Handle linear interpolation for other number properties
-                    interpolatedValue =
-                        startValue + (targetValue - startValue) * easedProgress;
-                }
-            }
-            // @typescript-eslint/no-explicit-any
-            node.lng[propName] = interpolatedValue; // Cast to any because the properties on CoreNode might have broader types.
-            // 5. Remove Node if Progress is 1
-            if (nodeConfig.progress === 1) {
-                this.nodeConfigs.splice(i, 1);
-            }
-            if (this.nodeConfigs.length === 0) {
-                this.stage?.animationManager.unregisterAnimation(this);
-                this.isRegistered = false;
-            }
-        }
-    }
-}
-export const simpleAnimation = new SimpleAnimation();
-export default simpleAnimation;
-//# sourceMappingURL=animation.js.map

package/dist/src/core/animation.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"animation.js","sourceRoot":"","sources":["../../../src/core/animation.ts"],"names":[],"mappings":"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"}

package/src/core/animation.ts

@@ -1,188 +0,0 @@
-import {
-  getTimingFunction,
-  mergeColorProgress,
-} from '@lightningjs/renderer/utils';
-import {
-  type ElementNode,
-  LightningRendererNumberProps,
-} from './elementNode.js';
-import { TimingFunction } from '@lightningjs/renderer';
-import { isFunc } from './utils.js';
-import { IRendererStage } from './dom-renderer/domRendererTypes.js';
-import { CoreAnimation } from './intrinsicTypes.js';
-
-/**
- * Simplified Animation Settings
- */
-export interface SimpleAnimationSettings {
-  duration?: number;
-  delay?: number;
-  easing?: string | TimingFunction;
-}
-
-/**
- * Properties of a Node used by the SimpleAnimation
- * (Excludes shaderProps)
- */
-export type SimpleAnimationProps =
-  (typeof LightningRendererNumberProps)[number];
-
-/**
- * Configuration for a single node within a SimpleAnimation
- */
-interface SimpleAnimationNodeConfig {
-  node: ElementNode;
-  duration: number;
-  delay: number;
-  easing: string | TimingFunction;
-  progress: number;
-  delayFor: number;
-  timingFunction: (t: number) => number | undefined;
-  propName: SimpleAnimationProps;
-  startValue: number;
-  targetValue: number;
-}
-
-export class SimpleAnimation {
-  private nodeConfigs: SimpleAnimationNodeConfig[] = [];
-  private isRegistered = false;
-  private stage: IRendererStage | undefined;
-
-  register(stage: IRendererStage) {
-    if (this.isRegistered) {
-      return;
-    }
-    this.isRegistered = true;
-    this.stage = stage;
-    stage.animationManager.registerAnimation(this as unknown as CoreAnimation);
-  }
-
-  /**
-   * Adds a node and its animation properties to this animation instance.
-   * The animation's start values for the specified properties are captured
-   * from the node's current state when this method is called.
-   *
-   * @param node - The CoreNode to animate.
-   * @param props - The properties to animate and their target values. Only number properties are supported.
-   * @param settings - Animation settings for this specific node animation.
-   */
-  add(
-    node: ElementNode,
-    key: SimpleAnimationProps,
-    value: number,
-    settings: SimpleAnimationSettings,
-  ): void {
-    const existingConfig = this.nodeConfigs.find(
-      (config) => config.node === node && config.propName === key,
-    );
-
-    const duration = settings.duration ?? 0;
-    const delay = settings.delay ?? 0;
-    const easing = settings.easing || 'linear';
-    const timingFunction = isFunc(easing) ? easing : getTimingFunction(easing);
-    const targetValue = value;
-    const startValue = node[key] as number;
-
-    if (existingConfig) {
-      existingConfig.duration = duration;
-      existingConfig.delay = delay;
-      existingConfig.easing = easing;
-      existingConfig.timingFunction = timingFunction;
-      existingConfig.targetValue = targetValue;
-      existingConfig.startValue = startValue;
-      existingConfig.progress = 0;
-      existingConfig.delayFor = delay;
-    } else {
-      this.nodeConfigs.push({
-        node,
-        duration,
-        delay,
-        easing,
-        progress: 0,
-        delayFor: delay,
-        timingFunction,
-        propName: key,
-        startValue,
-        targetValue,
-      });
-    }
-  }
-
-  update(dt: number) {
-    // Iterate backward to safely remove finished animations
-    for (let i = this.nodeConfigs.length - 1; i >= 0; i--) {
-      const nodeConfig = this.nodeConfigs[i] as SimpleAnimationNodeConfig;
-      const {
-        node,
-        duration,
-        timingFunction,
-        propName,
-        startValue,
-        targetValue,
-      } = nodeConfig;
-      let remainingDt = dt;
-
-      // 1. Handle Delay
-      if (nodeConfig.delayFor > 0) {
-        nodeConfig.delayFor -= remainingDt;
-        if (nodeConfig.delayFor >= 0) {
-          // Still in delay phase for this node, skip applying values this frame
-          continue;
-        } else {
-          // Delay finished this frame, use the remaining time for animation
-          remainingDt = -nodeConfig.delayFor;
-          nodeConfig.delayFor = 0;
-        }
-      }
-
-      // 2. Update Progress (directly on nodeConfig.progress)
-      if (duration > 0) {
-        nodeConfig.progress += remainingDt / duration;
-        // Clamp progress between 0 and 1
-        nodeConfig.progress = Math.max(0, Math.min(1, nodeConfig.progress));
-      } else if (duration === 0 && nodeConfig.delayFor <= 0) {
-        // Duration is 0 and delay is finished or was 0. Animation completes instantly.
-        nodeConfig.progress = 1;
-      }
-
-      // 3. Calculate Eased Progress
-      const easedProgress =
-        timingFunction(nodeConfig.progress) || nodeConfig.progress;
-
-      // 4. Apply Animated Values to the Node
-      let interpolatedValue: number;
-      if (nodeConfig.progress === 1) {
-        interpolatedValue = targetValue;
-      } else {
-        if (propName.includes('color')) {
-          // Handle color interpolation
-          interpolatedValue = mergeColorProgress(
-            startValue,
-            targetValue,
-            easedProgress,
-          );
-        } else {
-          // Handle linear interpolation for other number properties
-          interpolatedValue =
-            startValue + (targetValue - startValue) * easedProgress;
-        }
-      }
-      // @typescript-eslint/no-explicit-any
-      (node.lng as any)[propName] = interpolatedValue; // Cast to any because the properties on CoreNode might have broader types.
-
-      // 5. Remove Node if Progress is 1
-      if (nodeConfig.progress === 1) {
-        this.nodeConfigs.splice(i, 1);
-      }
-      if (this.nodeConfigs.length === 0) {
-        this.stage?.animationManager.unregisterAnimation(
-          this as unknown as CoreAnimation,
-        );
-        this.isRegistered = false;
-      }
-    }
-  }
-}
-
-export const simpleAnimation = new SimpleAnimation();
-export default simpleAnimation;