mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-10 01:50:08 +00:00
5a35562d3d
* move ref initialization to the component * remove redundant init * [refactor] Move minimap to domain-driven renderer structure - Create new src/renderer/extensions/minimap/ structure following domain-driven design - Add composables: useMinimapGraph, useMinimapViewport, useMinimapRenderer, useMinimapInteraction, useMinimapSettings - Add minimapCanvasRenderer with efficient batched rendering - Add comprehensive type definitions in types.ts - Remove old src/composables/useMinimap.ts composable - Implement proper separation of concerns with dedicated composables for each domain The new structure provides cleaner APIs, better performance through batched rendering, and improved maintainability through domain separation. * [test] Fix minimap tests for new renderer structure - Update all test imports to use new renderer paths - Fix mock implementations to match new composable APIs - Add proper RAF mocking for throttled functions - Fix type assertions to handle strict TypeScript checks - Update test expectations for new implementation behavior - Fix viewport transform calculations in tests - Handle async/throttled behavior correctly in tests All 28 minimap tests now passing with new architecture. * [fix] Remove unused init import in MiniMap component * [refactor] Move useWorkflowThumbnail to renderer/thumbnail structure - Moved useWorkflowThumbnail from src/composables to src/renderer/thumbnail/composables - Updated all imports in components, stores and services - Moved test file to match new structure - This ensures all rendering-related composables live in the renderer directory * [test] Fix minimap canvas renderer test for connections - Fixed mock setup for graph links to match LiteGraph's hybrid Map/Object structure - LiteGraph expects links to be accessible both as a Map and as an object - Test now properly verifies connection rendering functionality
65 lines
1.6 KiB
TypeScript
65 lines
1.6 KiB
TypeScript
import type { LGraph } from '@/lib/litegraph/src/litegraph'
|
|
import {
|
|
calculateMinimapScale,
|
|
calculateNodeBounds
|
|
} from '@/renderer/core/spatial/boundsCalculator'
|
|
import { useCanvasStore } from '@/stores/graphStore'
|
|
import { useWorkflowStore } from '@/stores/workflowStore'
|
|
|
|
import { renderMinimapToCanvas } from '../extensions/minimap/minimapCanvasRenderer'
|
|
|
|
/**
|
|
* Create a thumbnail of the current canvas's active graph.
|
|
* Used by workflow thumbnail generation.
|
|
*/
|
|
export function createGraphThumbnail(): string | null {
|
|
const canvasStore = useCanvasStore()
|
|
const workflowStore = useWorkflowStore()
|
|
|
|
const graph = workflowStore.activeSubgraph || canvasStore.canvas?.graph
|
|
if (!graph || !graph._nodes || graph._nodes.length === 0) {
|
|
return null
|
|
}
|
|
|
|
const width = 250
|
|
const height = 200
|
|
|
|
// Calculate bounds using spatial calculator
|
|
const bounds = calculateNodeBounds(graph._nodes)
|
|
if (!bounds) {
|
|
return null
|
|
}
|
|
|
|
const scale = calculateMinimapScale(bounds, width, height)
|
|
|
|
// Create detached canvas
|
|
const canvas = document.createElement('canvas')
|
|
canvas.width = width
|
|
canvas.height = height
|
|
|
|
// Render the minimap
|
|
renderMinimapToCanvas(canvas, graph as LGraph, {
|
|
bounds,
|
|
scale,
|
|
settings: {
|
|
nodeColors: true,
|
|
showLinks: false,
|
|
showGroups: true,
|
|
renderBypass: false,
|
|
renderError: false
|
|
},
|
|
width,
|
|
height
|
|
})
|
|
|
|
const dataUrl = canvas.toDataURL()
|
|
|
|
// Explicit cleanup (optional but good practice)
|
|
const ctx = canvas.getContext('2d')
|
|
if (ctx) {
|
|
ctx.clearRect(0, 0, width, height)
|
|
}
|
|
|
|
return dataUrl
|
|
}
|