mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-05-05 21:54:50 +00:00
[refactor] remove node as dependency in 3d node (#6707)
## Summary This PR refactors the Load3d 3D rendering system to remove its direct dependency on LGraphNode, making it a more decoupled and reusable component. The core rendering engine is now framework-agnostic and can be used in any context, not just within LiteGraph nodes. ## Changes 1. Decoupled Load3d from LGraphNode - Before: Load3d directly accessed node.widgets and node.properties - After: Load3d accepts optional parameters and callbacks, delegating node integration to the calling code 2. Event-Driven State Management - Removed internal storage from Load3d core components - Camera, controls, and view helper managers now emit cameraChanged events instead of directly storing state - External code (e.g., useLoad3d) listens to events and handles persistence to node.properties 3. Reactive Dimension Updates - Introduced getDimensions callback to support reactive dimension updates - Fixes the issue where dimension changes in vueNodes mode required a refresh - The callback is invoked on every render to get fresh width/height values 4. Improved Configuration System - Load3DConfiguration now accepts properties: Dictionary<NodeProperty | undefined> instead of custom storage interface - Uses official LiteGraph type definitions (Dictionary, NodeProperty) - More semantic parameter naming: storage → properties ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6707-refactor-remove-node-as-dependency-in-3d-node-2ab6d73d365081ffac1cdce354781ce8) by [Unito](https://www.unito.io)
This commit is contained in:
@@ -3,7 +3,7 @@ import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'
|
||||
import { ViewHelper } from 'three/examples/jsm/helpers/ViewHelper'
|
||||
|
||||
import {
|
||||
type NodeStorageInterface,
|
||||
type EventManagerInterface,
|
||||
type ViewHelperManagerInterface
|
||||
} from './interfaces'
|
||||
|
||||
@@ -13,7 +13,7 @@ export class ViewHelperManager implements ViewHelperManagerInterface {
|
||||
|
||||
private getActiveCamera: () => THREE.Camera
|
||||
private getControls: () => OrbitControls
|
||||
private nodeStorage: NodeStorageInterface
|
||||
private eventManager: EventManagerInterface
|
||||
// @ts-expect-error unused variable
|
||||
private renderer: THREE.WebGLRenderer
|
||||
|
||||
@@ -21,12 +21,12 @@ export class ViewHelperManager implements ViewHelperManagerInterface {
|
||||
renderer: THREE.WebGLRenderer,
|
||||
getActiveCamera: () => THREE.Camera,
|
||||
getControls: () => OrbitControls,
|
||||
nodeStorage: NodeStorageInterface
|
||||
eventManager: EventManagerInterface
|
||||
) {
|
||||
this.renderer = renderer
|
||||
this.getActiveCamera = getActiveCamera
|
||||
this.getControls = getControls
|
||||
this.nodeStorage = nodeStorage
|
||||
this.eventManager = eventManager
|
||||
}
|
||||
|
||||
init(): void {}
|
||||
@@ -87,18 +87,7 @@ export class ViewHelperManager implements ViewHelperManagerInterface {
|
||||
: 'orthographic'
|
||||
}
|
||||
|
||||
const cameraConfig = this.nodeStorage.loadNodeProperty(
|
||||
'Camera Config',
|
||||
{
|
||||
cameraType: cameraState.cameraType,
|
||||
fov:
|
||||
this.getActiveCamera() instanceof THREE.PerspectiveCamera
|
||||
? (this.getActiveCamera() as THREE.PerspectiveCamera).fov
|
||||
: 75
|
||||
}
|
||||
)
|
||||
cameraConfig.state = cameraState
|
||||
this.nodeStorage.storeNodeProperty('Camera Config', cameraConfig)
|
||||
this.eventManager.emitEvent('cameraChanged', cameraState)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user