@fairyhunter13/opentui-core 0.1.90 → 0.1.92

package/src/3d/ThreeRenderable.ts

@@ -1,197 +0,0 @@
-import { OrthographicCamera, PerspectiveCamera, Scene } from "three"
-
-import { OptimizedBuffer } from "../buffer.js"
-import { RGBA } from "../lib/RGBA.js"
-import { Renderable, type RenderableOptions } from "../Renderable.js"
-import type { CliRenderer } from "../renderer.js"
-import type { RenderContext } from "../types.js"
-import { ThreeCliRenderer, type ThreeCliRendererOptions } from "./WGPURenderer.js"
-
-export interface ThreeRenderableOptions extends RenderableOptions<ThreeRenderable> {
-  scene?: Scene | null
-  camera?: PerspectiveCamera | OrthographicCamera
-  renderer?: Omit<ThreeCliRendererOptions, "width" | "height" | "autoResize">
-  autoAspect?: boolean
-}
-
-export class ThreeRenderable extends Renderable {
-  private engine: ThreeCliRenderer
-  private scene: Scene | null
-  private autoAspect: boolean
-  private initPromise: Promise<boolean> | null = null
-  private initFailed: boolean = false
-  private drawInFlight: boolean = false
-  private frameCallback: ((deltaTime: number) => Promise<void>) | null = null
-  private frameCallbackRegistered: boolean = false
-  private cliRenderer: CliRenderer
-  private clearColor: RGBA
-
-  constructor(ctx: RenderContext, options: ThreeRenderableOptions) {
-    const { scene = null, camera, renderer, autoAspect = true, ...renderableOptions } = options
-    super(ctx, { ...renderableOptions, buffered: true, live: options.live ?? true })
-
-    const cliRenderer = ctx as CliRenderer
-    if (typeof cliRenderer.setFrameCallback !== "function" || typeof cliRenderer.removeFrameCallback !== "function") {
-      throw new Error("ThreeRenderable requires a CliRenderer context")
-    }
-
-    this.cliRenderer = cliRenderer
-    this.scene = scene
-    this.autoAspect = autoAspect
-    this.clearColor = renderer?.backgroundColor ?? RGBA.fromValues(0, 0, 0, 1)
-
-    const { width, height } = this.getRenderSize()
-    this.engine = new ThreeCliRenderer(cliRenderer, {
-      width,
-      height,
-      autoResize: false,
-      ...renderer,
-    })
-
-    if (camera) {
-      this.engine.setActiveCamera(camera)
-    }
-    this.updateCameraAspect(width, height)
-
-    this.registerFrameCallback()
-  }
-
-  public get aspectRatio(): number {
-    return this.getAspectRatio(this.width, this.height)
-  }
-
-  public get renderer(): ThreeCliRenderer {
-    return this.engine
-  }
-
-  public getScene(): Scene | null {
-    return this.scene
-  }
-
-  public setScene(scene: Scene | null): void {
-    this.scene = scene
-    this.requestRender()
-  }
-
-  public getActiveCamera(): PerspectiveCamera | OrthographicCamera {
-    return this.engine.getActiveCamera()
-  }
-
-  public setActiveCamera(camera: PerspectiveCamera | OrthographicCamera): void {
-    this.engine.setActiveCamera(camera)
-    this.updateCameraAspect(this.width, this.height)
-    this.requestRender()
-  }
-
-  public setAutoAspect(autoAspect: boolean): void {
-    if (this.autoAspect === autoAspect) return
-    this.autoAspect = autoAspect
-    if (autoAspect) {
-      this.updateCameraAspect(this.width, this.height)
-    }
-  }
-
-  protected onResize(width: number, height: number): void {
-    if (width > 0 && height > 0) {
-      this.engine.setSize(width, height, true)
-      this.updateCameraAspect(width, height)
-    }
-    super.onResize(width, height)
-  }
-
-  protected renderSelf(buffer: OptimizedBuffer, deltaTime: number): void {
-    if (!this.visible || this.isDestroyed) return
-    if (this.frameCallbackRegistered) return
-    if (this.buffered && !this.frameBuffer) return
-    void this.renderToBuffer(buffer, deltaTime / 1000)
-  }
-
-  protected destroySelf(): void {
-    if (this.frameCallback && this.frameCallbackRegistered) {
-      this.cliRenderer.removeFrameCallback(this.frameCallback)
-      this.frameCallbackRegistered = false
-      this.frameCallback = null
-    }
-
-    this.engine.destroy()
-    super.destroySelf()
-  }
-
-  private registerFrameCallback(): void {
-    if (this.frameCallbackRegistered) return
-
-    this.frameCallback = async (deltaTime: number) => {
-      if (this.isDestroyed || !this.visible || !this.parent) return
-      if (!this.scene || !this.frameBuffer) return
-      await this.renderToBuffer(this.frameBuffer, deltaTime / 1000)
-    }
-
-    this.cliRenderer.setFrameCallback(this.frameCallback)
-    this.frameCallbackRegistered = true
-  }
-
-  private async renderToBuffer(buffer: OptimizedBuffer, deltaTime: number): Promise<void> {
-    if (!this.scene || this.isDestroyed || this.drawInFlight) return
-
-    this.drawInFlight = true
-    try {
-      const initialized = await this.ensureInitialized()
-      if (!initialized || !this.scene) return
-
-      if (buffer === this.frameBuffer) {
-        buffer.clear(this.clearColor)
-      }
-
-      await this.engine.drawScene(this.scene, buffer, deltaTime)
-    } finally {
-      this.drawInFlight = false
-    }
-  }
-
-  private async ensureInitialized(): Promise<boolean> {
-    if (this.initFailed) return false
-    if (!this.initPromise) {
-      this.initPromise = this.engine
-        .init()
-        .then(() => true)
-        .catch((error) => {
-          this.initFailed = true
-          console.error("ThreeRenderable init failed:", error)
-          return false
-        })
-    }
-    return this.initPromise
-  }
-
-  private updateCameraAspect(width: number, height: number): void {
-    if (!this.autoAspect || width <= 0 || height <= 0) return
-
-    const camera = this.engine.getActiveCamera()
-    if (camera instanceof PerspectiveCamera) {
-      camera.aspect = this.getAspectRatio(width, height)
-      camera.updateProjectionMatrix()
-    }
-  }
-
-  private getAspectRatio(width: number, height: number): number {
-    if (width <= 0 || height <= 0) return 1
-
-    const resolution = this.cliRenderer.resolution
-    if (resolution && this.cliRenderer.terminalWidth > 0 && this.cliRenderer.terminalHeight > 0) {
-      const cellWidth = resolution.width / this.cliRenderer.terminalWidth
-      const cellHeight = resolution.height / this.cliRenderer.terminalHeight
-      if (cellHeight > 0) {
-        return (width * cellWidth) / (height * cellHeight)
-      }
-    }
-
-    return width / (height * 2)
-  }
-
-  private getRenderSize(): { width: number; height: number } {
-    return {
-      width: Math.max(1, this.width),
-      height: Math.max(1, this.height),
-    }
-  }
-}

package/src/3d/WGPURenderer.ts

@@ -1,294 +0,0 @@
-import { PerspectiveCamera, OrthographicCamera, Color, NoToneMapping, LinearSRGBColorSpace, Scene } from "three"
-import { WebGPURenderer } from "three/webgpu"
-import type { OptimizedBuffer } from "../buffer.js"
-import { RGBA } from "../lib/RGBA.js"
-import { createWebGPUDevice, setupGlobals } from "bun-webgpu"
-import { CLICanvas, SuperSampleAlgorithm } from "./canvas.js"
-import { CliRenderEvents, type CliRenderer } from "../renderer.js"
-
-export enum SuperSampleType {
-  NONE = "none",
-  GPU = "gpu",
-  CPU = "cpu",
-}
-
-export interface ThreeCliRendererOptions {
-  width: number
-  height: number
-  focalLength?: number
-  backgroundColor?: RGBA
-  superSample?: SuperSampleType
-  alpha?: boolean
-  autoResize?: boolean
-  libPath?: string
-}
-
-export class ThreeCliRenderer {
-  private outputWidth: number
-  private outputHeight: number
-  private renderWidth: number
-  private renderHeight: number
-  private superSample: SuperSampleType
-  private backgroundColor: RGBA = RGBA.fromValues(0, 0, 0, 1)
-  private alpha: boolean = false
-  private threeRenderer?: WebGPURenderer
-  private canvas?: CLICanvas
-  private device: GPUDevice | null = null
-
-  private activeCamera: PerspectiveCamera | OrthographicCamera
-  private _aspectRatio: number | null = null
-  private doRenderStats: boolean = false
-
-  private resizeHandler: (width: number, height: number) => void
-  private debugToggleHandler: (enabled: boolean) => void
-  private destroyHandler: () => void
-
-  // Stats tracking
-  private renderTimeMs: number = 0
-  private readbackTimeMs: number = 0
-  private totalDrawTimeMs: number = 0
-
-  private renderMethod: (
-    root: Scene,
-    camera: PerspectiveCamera | OrthographicCamera,
-    buffer: OptimizedBuffer,
-    deltaTime: number,
-  ) => Promise<void> = () => Promise.resolve()
-
-  public get aspectRatio(): number {
-    if (this._aspectRatio) return this._aspectRatio
-    if (this.cliRenderer.resolution) {
-      const pixelAspectRatio = this.cliRenderer.resolution.width / this.cliRenderer.resolution.height
-      return pixelAspectRatio
-    }
-    const terminalWidth = process.stdout.columns
-    const terminalHeight = process.stdout.rows
-    return terminalWidth / (terminalHeight * 2)
-  }
-
-  constructor(
-    private readonly cliRenderer: CliRenderer,
-    options: ThreeCliRendererOptions,
-  ) {
-    this.outputWidth = options.width
-    this.outputHeight = options.height
-    this.superSample = options.superSample ?? SuperSampleType.GPU
-
-    this.renderWidth = this.outputWidth * (this.superSample !== SuperSampleType.NONE ? 2 : 1)
-    this.renderHeight = this.outputHeight * (this.superSample !== SuperSampleType.NONE ? 2 : 1)
-
-    this.backgroundColor = options.backgroundColor ?? RGBA.fromValues(0, 0, 0, 1)
-    this.alpha = options.alpha ?? false
-
-    if (process.env.CELL_ASPECT_RATIO) {
-      this._aspectRatio = parseFloat(process.env.CELL_ASPECT_RATIO)
-    }
-
-    // Create a default active camera
-    const fov = options.focalLength ? 2 * Math.atan(this.outputHeight / (2 * options.focalLength)) * (180 / Math.PI) : 1 // Default FOV if focal length not provided
-    this.activeCamera = new PerspectiveCamera(
-      fov,
-      this.aspectRatio,
-      0.1, // near plane
-      1000, // far plane
-    )
-    this.activeCamera.position.set(0, 0, 3)
-    this.activeCamera.up.set(0, 1, 0)
-    this.activeCamera.lookAt(0, 0, 0)
-    this.activeCamera.updateMatrixWorld()
-
-    this.resizeHandler = (width: number, height: number) => {
-      this.setSize(width, height, true)
-    }
-
-    this.debugToggleHandler = (enabled: boolean) => {
-      this.doRenderStats = enabled
-    }
-
-    this.destroyHandler = () => {
-      this.destroy()
-    }
-
-    if (options.autoResize !== false) {
-      this.cliRenderer.on("resize", this.resizeHandler)
-    }
-
-    this.cliRenderer.on(CliRenderEvents.DEBUG_OVERLAY_TOGGLE, this.debugToggleHandler)
-    this.cliRenderer.on(CliRenderEvents.DESTROY, this.destroyHandler)
-
-    setupGlobals({ libPath: options.libPath })
-  }
-
-  public toggleDebugStats(): void {
-    this.doRenderStats = !this.doRenderStats
-  }
-
-  async init(): Promise<void> {
-    this.device = await createWebGPUDevice()
-    this.canvas = new CLICanvas(this.device, this.renderWidth, this.renderHeight, this.superSample)
-
-    try {
-      this.threeRenderer = new WebGPURenderer({
-        canvas: this.canvas as unknown as HTMLCanvasElement,
-        device: this.device,
-        alpha: this.alpha,
-      })
-
-      this.setBackgroundColor(this.backgroundColor)
-
-      this.threeRenderer.toneMapping = NoToneMapping
-      this.threeRenderer.outputColorSpace = LinearSRGBColorSpace
-
-      this.threeRenderer.setSize(this.renderWidth, this.renderHeight, false)
-    } catch (error) {
-      console.error("Error creating THREE.WebGPURenderer:", error)
-      throw error
-    }
-
-    await this.threeRenderer.init().then(() => {
-      this.renderMethod = this.doDrawScene.bind(this)
-    })
-  }
-
-  public getSuperSampleAlgorithm(): SuperSampleAlgorithm {
-    return this.canvas!.getSuperSampleAlgorithm()
-  }
-
-  public setSuperSampleAlgorithm(superSampleAlgorithm: SuperSampleAlgorithm): void {
-    this.canvas!.setSuperSampleAlgorithm(superSampleAlgorithm)
-  }
-
-  public saveToFile(filePath: string): Promise<void> {
-    return this.canvas!.saveToFile(filePath)
-  }
-
-  setActiveCamera(camera: PerspectiveCamera | OrthographicCamera): void {
-    this.activeCamera = camera
-  }
-
-  getActiveCamera(): PerspectiveCamera | OrthographicCamera {
-    return this.activeCamera
-  }
-
-  public setBackgroundColor(color: RGBA): void {
-    this.backgroundColor = color
-    const clearColor = new Color(this.backgroundColor.r, this.backgroundColor.g, this.backgroundColor.b)
-    const clearAlpha = this.alpha ? this.backgroundColor.a : 1.0
-    this.threeRenderer!.setClearColor(clearColor, clearAlpha)
-  }
-
-  setSize(width: number, height: number, forceUpdate: boolean = false): void {
-    // Check against OUTPUT dimensions
-    if (!forceUpdate && this.outputWidth === width && this.outputHeight === height) return
-
-    this.outputWidth = width
-    this.outputHeight = height
-
-    this.renderWidth = this.outputWidth * (this.superSample !== SuperSampleType.NONE ? 2 : 1)
-    this.renderHeight = this.outputHeight * (this.superSample !== SuperSampleType.NONE ? 2 : 1)
-
-    this.canvas?.setSize(this.renderWidth, this.renderHeight)
-
-    this.threeRenderer?.setSize(this.renderWidth, this.renderHeight, false)
-    this.threeRenderer?.setViewport(0, 0, this.renderWidth, this.renderHeight)
-
-    if (this.activeCamera instanceof PerspectiveCamera) {
-      this.activeCamera.aspect = this.aspectRatio
-    }
-    this.activeCamera.updateProjectionMatrix()
-  }
-
-  public async drawScene(root: Scene, buffer: OptimizedBuffer, deltaTime: number): Promise<void> {
-    await this.renderMethod(root, this.activeCamera, buffer, deltaTime)
-
-    if (this.doRenderStats) {
-      this.renderStats(buffer)
-    }
-  }
-
-  private rendering: boolean = false
-  private destroyed: boolean = false
-  async doDrawScene(
-    root: Scene,
-    camera: PerspectiveCamera | OrthographicCamera,
-    buffer: OptimizedBuffer,
-    deltaTime: number,
-  ): Promise<void> {
-    if (this.rendering) {
-      console.warn("ThreeCliRenderer.drawScene was called concurrently, which is not supported.")
-      return
-    }
-    if (this.destroyed) {
-      return
-    }
-    try {
-      this.rendering = true
-
-      const totalStart = performance.now()
-      const renderStart = performance.now()
-      await this.threeRenderer!.render(root, camera)
-      this.renderTimeMs = performance.now() - renderStart
-
-      const readbackStart = performance.now()
-      await this.canvas!.readPixelsIntoBuffer(buffer)
-      this.readbackTimeMs = performance.now() - readbackStart
-
-      this.totalDrawTimeMs = performance.now() - totalStart
-    } finally {
-      this.rendering = false
-    }
-  }
-
-  public toggleSuperSampling(): void {
-    if (this.superSample === SuperSampleType.NONE) {
-      this.superSample = SuperSampleType.CPU
-    } else if (this.superSample === SuperSampleType.CPU) {
-      this.superSample = SuperSampleType.GPU
-    } else {
-      this.superSample = SuperSampleType.NONE
-    }
-    this.canvas!.setSuperSample(this.superSample)
-    this.setSize(this.outputWidth, this.outputHeight, true)
-  }
-
-  public renderStats(buffer: OptimizedBuffer): void {
-    const stats = [
-      `WebGPU Renderer Stats:`,
-      ` Render: ${this.renderTimeMs.toFixed(2)}ms`,
-      ` Readback: ${this.readbackTimeMs.toFixed(2)}ms`,
-      `  ├ MapAsync: ${this.canvas!.mapAsyncTimeMs.toFixed(2)}ms`,
-      `  └ SS Draw: ${this.canvas!.superSampleDrawTimeMs.toFixed(2)}ms`,
-      ` Total Draw: ${this.totalDrawTimeMs.toFixed(2)}ms`,
-      ` SuperSample: ${this.superSample}`,
-      ` SuperSample Algorithm: ${this.getSuperSampleAlgorithm()}`,
-    ]
-    const startY = 4
-    const startX = 2
-    const fg = RGBA.fromValues(0.9, 0.9, 0.9, 1.0)
-    const bg = RGBA.fromValues(0.1, 0.1, 0.1, 1.0)
-
-    stats.forEach((line, index) => {
-      buffer.drawText(line, startX + 1, startY + index, fg, bg)
-    })
-  }
-
-  public destroy(): void {
-    this.destroyed = true
-
-    this.cliRenderer.off("resize", this.resizeHandler)
-    this.cliRenderer.off(CliRenderEvents.DEBUG_OVERLAY_TOGGLE, this.debugToggleHandler)
-
-    if (this.canvas) {
-      this.canvas.destroy()
-    }
-
-    if (this.threeRenderer) {
-      this.threeRenderer.dispose()
-      this.threeRenderer = undefined
-    }
-
-    this.canvas = undefined
-    this.device = null
-    this.renderMethod = () => Promise.resolve()
-  }
-}