Commit Graph

137 Commits

Author SHA1 Message Date
Dariusz L
20d52b632a Refactor layer rendering into reusable methods
Moved layer drawing logic into CanvasLayers._drawLayer and _drawLayers methods, replacing repeated rendering code in CanvasIO and CanvasLayers. This improves maintainability and ensures consistent handling of layer properties such as blend mode, opacity, rotation, and flipping. Also, fixed layer serialization to only generate imageId when missing, and ensured new layers have flipH/flipV set when created from matted images.
2025-07-21 23:03:52 +02:00
Dariusz L
57bd1e1499 Add layer flipH/flipV properties and rendering support
Refactors horizontal and vertical mirroring to toggle flipH/flipV properties on layers instead of modifying image data. Updates rendering logic in CanvasLayers and CanvasRenderer to apply horizontal/vertical flipping via canvas transforms. Adds flipH and flipV to Layer type and includes them in state signature calculation.
2025-07-21 22:35:18 +02:00
Dariusz L
98d4769ba1 Fix preview visibility initialization in Canvas
Replaces setPreviewVisibility(false) with direct assignment to previewVisible in Canvas and Canvas.ts. Adds initialization of preview state based on widget value in CanvasView and CanvasView.ts to ensure correct preview visibility on widget creation.
2025-07-21 20:45:13 +02:00
Dariusz L
5419acad27 Refactor auto-refresh toggle to node widget property
Replaces the local auto-refresh toggle with a node widget property 'auto_refresh_after_generation' in both JS and TS Canvas classes. Updates Python CanvasNode to include this property in the required config and removes 'hidden' from 'trigger' and 'node_id'. This change centralizes auto-refresh state in the node widget for better consistency and UI integration.
2025-07-21 20:31:46 +02:00
Dariusz L
4e55bb25bc Improve matting error handling and user feedback
Adds specific handling for JSONDecodeError during model loading in Python, returning a clear error message if the model config is corrupted. Updates the JS/TS frontends to show a custom error dialog with details and copy-to-clipboard functionality instead of a simple alert, and ensures spinner removal is safe. This improves user experience and troubleshooting for matting model errors.
2025-07-04 07:31:33 +02:00
Dariusz L
5adc77471f project migration to typescript
Project migration to typescript
2025-07-04 04:22:51 +02:00
Dariusz L
3e4cdf10bc Refactor CanvasView: externalize styles and tooltips
Moved inline CSS from CanvasView.js to a dedicated canvas_view.css file and added dynamic stylesheet loading. Extracted tooltip and shortcut HTML into separate template files and implemented a ResourceManager utility for loading stylesheets and templates. Updated CanvasInteractions.js and CanvasView.js to use the new resource management and template loading approach, improving maintainability and modularity.
2025-07-03 17:27:00 +02:00
Dariusz L
bd8007d8aa Remove 'v' key paste shortcut from canvas interactions
The 'v' key no longer triggers the paste action in CanvasInteractions. This change may be to prevent conflicts or to streamline keyboard shortcuts.
2025-07-03 16:15:42 +02:00
Dariusz L
af5e81c56b Initial commit
Add initial project files and setup.
2025-07-03 15:59:11 +02:00
Dariusz L
aa31a347d1 Add configurable log level for Python and JS modules
Introduced LOG_LEVEL configuration in both Python and JavaScript to control logging verbosity. Updated logger initialization in canvas_node.py and LoggerUtils.js to use the new LOG_LEVEL from config files.
2025-07-03 13:15:33 +02:00
Dariusz L
d40f68b8c6 Preserve batch generation area during canvas changes
Introduces a 'generationArea' context for batch image generation, ensuring that batch preview outlines and image placement remain accurate when the canvas is moved or resized. Updates related logic in Canvas, CanvasInteractions, CanvasLayers, and CanvasRenderer to track and render the correct area, and synchronizes context updates across user interactions.
2025-07-03 11:52:16 +02:00
Dariusz L
e5060fd8c3 Support multiple batch preview menus on canvas
Refactored batch preview management to allow multiple BatchPreviewManager instances per canvas. Updated positioning logic to use an initial spawn position, adjusted UI updates, and ensured batch preview menus move correctly with canvas panning. Removed single-instance references and updated related event handling.
2025-07-03 03:55:04 +02:00
Dariusz L
f8eb91c4ad Make batch preview menu draggable and position-aware
Added draggable functionality to the batch preview menu, allowing users to reposition it within the canvas using world coordinates. The menu's position now updates with viewport changes, and its initial placement is centered below the output area. Also refactored logic to show the menu with new layers instead of adding to an existing batch.
2025-07-03 03:40:43 +02:00
Dariusz L
c4af745b2a Add addLayers method to BatchPreviewManager
Introduces an addLayers method to BatchPreviewManager for adding new layers to an active batch preview or showing the UI if inactive. Updates Canvas to use addLayers instead of show, and fixes a bug where new layers were only added if more than one was present.
2025-07-03 02:44:07 +02:00
Dariusz L
c9c0babf3c Add mask drawing mode to canvas interactions
Introduces support for a 'drawingMask' interaction mode in CanvasInteractions. Mouse events are now delegated to the maskTool when in this mode, and the canvas is re-rendered after each relevant event.
2025-07-03 02:40:07 +02:00
Dariusz L
152a3f7dff Auto-hide and restore mask overlay in batch preview
BatchPreviewManager now automatically hides the mask overlay when batch preview starts and restores its previous state when preview ends. The mask toggle button's state and label are updated accordingly. Also, mask toggle button IDs are now unique per canvas node.
2025-07-03 02:26:44 +02:00
Dariusz L
9f9a733731 Add batch preview manager and mask overlay toggle
Introduces BatchPreviewManager for reviewing and confirming multiple imported layers after auto-refresh. Adds a toggle button for mask overlay visibility in the UI and updates mask rendering logic to respect overlay visibility. Also refactors image import to return new layers and adds a utility for removing layers by ID.
2025-07-03 02:22:51 +02:00
Dariusz L
3419061b6c Add support for importing multiple latest images
Introduces a new backend route and method to fetch all images created since a given timestamp, and updates the frontend to import all new images as layers on auto-refresh. This improves workflow by allowing multiple images generated in a single execution to be imported at once, rather than only the most recent image.
2025-07-03 01:54:50 +02:00
Dariusz L
9e4da30b59 Add auto-refresh toggle after image generation
Introduces an 'Auto-refresh after generation' toggle to the Canvas. When enabled, the latest image is automatically imported after a successful execution event. Also ensures event listeners are properly cleaned up when the node is removed.
2025-07-03 01:02:35 +02:00
Dariusz L
2f730c87fa Change default log level and bump version
Set the default log level to NONE in createModuleLogger to reduce logging output. Incremented the project version to 1.3.3.1 in pyproject.toml.
2025-07-02 11:18:47 +02:00
Dariusz L
195e25437a Improve matting error handling and user feedback
Adds checks for missing 'transformers' dependency and network errors in the matting endpoint, returning clear error messages for common failure cases. Updates the frontend to display more informative alerts to users when matting fails, including details from server responses.
2025-07-02 10:36:22 +02:00
Dariusz L
d1004d5864 Notify layers panel on layer changes
Added calls to canvasLayersPanel.onLayersChanged() after pasting, adding, and fusing layers to ensure the layers panel updates its view in response to these actions.
2025-07-02 10:16:59 +02:00
Dariusz L
d2ccfc4e20 Update undo/redo button handlers in CanvasView
Changed the undo and redo button onclick handlers to call canvas.undo() and canvas.redo() instead of canvas.canvasState.undo() and canvas.canvasState.redo(). This aligns the button actions with the updated canvas API.
2025-07-02 10:08:32 +02:00
Dariusz L
2c313f43e8 Enable keyboard delete in layers panel
Added keyboard event listener to allow deleting selected layers using the Delete or Backspace keys when the layers panel is focused. This improves accessibility and user experience.
2025-07-02 10:05:54 +02:00
Dariusz L
2636521026 Remove keyboard event handling from layers panel
Eliminated tabindex and keydown event listener from the CanvasLayersPanel container. Keyboard interactions are no longer handled directly in this panel.
2025-07-02 10:00:30 +02:00
Dariusz L
e0a4549321 Refactor tooltip positioning logic in CanvasView
Extracted tooltip positioning code into reusable showTooltip and hideTooltip helper functions. Updated event handlers to use these helpers, reducing code duplication and improving maintainability.
2025-07-02 09:53:35 +02:00
Dariusz L
29ab916759 Refactor layers panel UI and improve resize handling
Changed UI text in CanvasLayersPanel from Polish to English and removed the add layer button and its logic. Moved and improved the ResizeObserver logic in CanvasView.js to update both the canvas and layers panel positions dynamically based on the controls' height.
2025-07-02 09:40:21 +02:00
Dariusz L
ac21aa9579 Enable keyboard interaction in layers panel
Added tabIndex to the panel container to allow keyboard focus and attached a keydown event listener to forward keyboard events to the main interaction handler. This improves accessibility and enables keyboard-based layer deletion from the panel.
2025-07-02 09:33:13 +02:00
Dariusz L
cae24310db Adjust canvas and panel layout widths
Reduced the right margin of the canvas from 320px to 270px and the panel width from 300px to 250px to optimize space allocation in the UI.
2025-07-02 09:25:33 +02:00
Dariusz L
7d8fd30bbf Add snap-to-5° rotation with Shift+Ctrl+Mouse Wheel
Introduces a new shortcut (Shift + Ctrl + Mouse Wheel) to snap layer rotation to the nearest 5° increment. Updates the CanvasView help table to document this new functionality and clarifies the description for existing rotation shortcuts.
2025-07-02 09:21:47 +02:00
Dariusz L
244d48728c Refactor canvas interactions and update keyboard shortcuts
Reorganizes mouse and keyboard event handling in CanvasInteractions for clearer priority and improved usability. Adds global keyboard shortcuts for undo, redo, copy, and paste. Updates context-sensitive shortcuts to support both Delete and Backspace for layer removal. Refactors CanvasLayers to use delayed state saving via requestSaveState. Updates CanvasView shortcut documentation to reflect these changes and clarify mouse/keyboard actions.
2025-07-02 09:16:16 +02:00
Dariusz L
ef01be3323 Add canvas move and resize interactions
Implemented new interaction modes for moving and resizing the canvas using shift and alt modifiers. Added corresponding handlers for mouse events to support these actions.
2025-07-02 08:48:41 +02:00
Dariusz L
b3d1206f3f Refactor layer selection and movement logic
Centralizes layer movement logic in CanvasLayers with a new moveLayers function, supporting both up/down and drag-and-drop reordering. Updates selection logic in Canvas to only trigger updates when selection changes, and improves event handling in CanvasLayersPanel for more responsive selection and drag operations. Removes redundant moveLayersToPosition method in favor of the new unified approach.
2025-07-02 08:41:18 +02:00
Dariusz L
a73a3dcf96 Add layers panel UI and improve layer management
Introduces a new CanvasLayersPanel component for managing layers visually, including selection, renaming, reordering via drag-and-drop, and deletion. Integrates the panel into the main Canvas and CanvasView, synchronizes selection and state changes, and adds logic for duplicating layers and debounced state saving. Moves IndexedDB state saving to a Web Worker for better performance. Also sets default logger level to DEBUG for improved diagnostics.
2025-07-02 08:09:49 +02:00
Dariusz L
53aa35491e Add layer fusion (flatten/merge) feature
Introduces a new 'Fuse' button to the canvas UI, allowing users to flatten and merge multiple selected layers into a single layer. The implementation handles bounding box calculation, z-index ordering, and updates the canvas state and selection accordingly. The fuse button is enabled only when at least two layers are selected.
2025-07-02 00:42:38 +02:00
Dariusz L
826f448af9 Add documentation for core modules and update Canvas.js
Added documentation files for ComfyApi, ComfyApp, LitegraphService, and MaskEditor, summarizing their main functions and usage. Refactored js/Canvas.js to improve mask processing logic, using viewport pan for cropping and applying mask color only to non-transparent pixels. Also made minor formatting and logging consistency improvements throughout Canvas.js.
2025-07-02 00:21:53 +02:00
Dariusz L
562b0db042 Initial commit
Project scaffolding and initial file setup.
2025-07-01 17:02:15 +02:00
Dariusz L
3544576605 Revert "Add mask editor integration to canvas workflow"
This reverts commit 7a7c8f2295.
2025-06-29 04:49:56 +02:00
Dariusz L
3b16c00b66 Revert "Refactor Canvas class as facade and clean up CanvasLayers"
This reverts commit 9dcf38b36d.
2025-06-29 04:49:49 +02:00
Dariusz L
9dcf38b36d Refactor Canvas class as facade and clean up CanvasLayers
Refactored the Canvas class to act as a facade, providing a simplified high-level interface and delegating detailed operations to internal modules. Added Polish documentation, grouped and clarified main operations, and moved legacy/delegation methods to the end for backward compatibility. Removed unused or redundant methods from CanvasLayers.js, such as removeLayer, moveLayer, addMattedLayer, isRotationHandle, getResizeHandle, handleBlendModeSelection, and getFlattenedCanvasAsDataURL, to streamline the codebase.
2025-06-29 04:41:48 +02:00
Dariusz L
7a7c8f2295 Add mask editor integration to canvas workflow
Introduces the ability to open the current canvas in a mask editor, upload and retrieve mask edits, and apply them to the mask layer. Adds utility functions for mask editor state detection and control, a new 'Edit Mask' button in the UI, and methods for handling mask updates and preview refresh. Also adds a setMask method to MaskTool for precise mask placement.
2025-06-29 04:15:45 +02:00
Dariusz L
f6a491e83b Adjust text background height and padding in CanvasRenderer
Refines the calculation of text background height and vertical padding for multi-line text rendering, ensuring more consistent spacing and alignment.
2025-06-28 19:56:13 +02:00
Dariusz L
7a52be5a79 Show original image size in layer info overlay
Added originalWidth and originalHeight properties to layers in CanvasLayers.js. Updated CanvasRenderer.js to display the original image dimensions in the layer info overlay if available, and improved overlay rendering to support multiline text.
2025-06-28 19:54:34 +02:00
Dariusz L
4376a21147 Add 'fit on add' option for image placement
Introduces a 'fit_on_add' boolean option to control whether images are fit to the canvas when added or pasted. Updates image addition and paste logic in Canvas, CanvasLayers, and CanvasView to support new placement modes ('fit', 'center', 'mouse', 'default').
2025-06-28 19:48:57 +02:00
Dariusz L
8ead4176b5 Add paste mode to handlePaste for image positioning
The handlePaste method now accepts a pasteMode parameter to control image placement, allowing images to be pasted either at the mouse position or centered on the canvas. This improves user control when pasting images via keyboard shortcuts or UI buttons.
2025-06-28 19:30:24 +02:00
Dariusz L
81b2a9cc4e Remove redundant white background fill in CanvasIO
Eliminated unnecessary code that filled temporary canvases with a white background in two methods. This streamlines canvas creation and avoids redundant operations.
2025-06-28 09:44:43 +02:00
Dariusz L
2033ab168a Set default log level to NONE and remove logger docs
Changed the default log level for both Python and JavaScript module loggers from DEBUG to NONE to disable logging by default. Removed the README_LOGGER.md documentation file, and updated README.md to remove a reference to seamless integration.
2025-06-28 08:38:08 +02:00
Dariusz L
7c3a6f72c7 Defer canvas rendering with setTimeout for UI updates
Replaces direct calls to canvas.render() and node.onResize() with setTimeout to defer execution, ensuring UI updates occur after DOM changes. This helps prevent rendering issues and improves responsiveness when toggling mask controls and editor view.
2025-06-28 08:07:10 +02:00
Dariusz L
51eaac362a Rename brush softness to hardness in mask tool
Replaces all references to 'softness' with 'hardness' for brush controls in both CanvasView.js and MaskTool.js. Updates UI labels, slider IDs, and internal logic to use 'hardness' terminology, clarifying that a higher value means a harder brush edge.
2025-06-28 07:59:32 +02:00
Dariusz L
a1e00ca06a Add brush preview overlay to MaskTool
Introduces a brush preview overlay using a separate preview canvas in MaskTool. Mouse event handlers in CanvasInteractions and MaskTool are updated to support passing both world and view coordinates, enabling accurate brush preview rendering. The preview is shown or hidden appropriately on mouse enter/leave and while drawing.
2025-06-28 07:37:53 +02:00