Commit Graph

112 Commits

Author SHA1 Message Date
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
Dariusz L
940f027b40 Increase logging level to DEBUG and enhance MaskTool callbacks
Set logging level to DEBUG in both Python and JavaScript loggers for improved debugging. Updated MaskTool to accept an onStateChange callback and trigger it after mask state changes, allowing Canvas to respond to mask updates.
2025-06-28 07:28:58 +02:00
Dariusz L
0078faf1fd Set default log level to NONE and improve logger checks
Changed the default log level to LogLevel.NONE in both Python and JavaScript logger utilities. Updated LayerForgeLogger to fully disable logging when the effective level is NONE, ensuring no logs are emitted for disabled modules.
2025-06-28 06:11:12 +02:00
Dariusz L
d783709287 Improve tooltip styling and positioning in CanvasView
Refactors the .painter-tooltip CSS for better appearance, responsiveness, and usability, including new scaling classes, table-based layout, and improved scrollbar styling. Updates shortcut help content to use tables instead of lists for clarity. Enhances tooltip positioning logic to prevent overflow outside the viewport and ensures proper display near screen edges.
2025-06-28 04:01:04 +02:00
Dariusz L
16730cf9a1 Refactor canvas help tooltip for mask mode support
Split help tooltip content into standard and mask mode shortcuts. Tooltip now dynamically displays relevant shortcuts based on whether the mask tool is active, improving user guidance during mask editing.
2025-06-28 03:37:23 +02:00
Dariusz L
092748ef85 Add descriptive titles to canvas control buttons
Added 'title' attributes to various canvas control buttons to provide tooltips with descriptive information about each button's function. This improves accessibility and user experience by clarifying the purpose of each control.
2025-06-28 02:37:58 +02:00
Dariusz L
319cbc1dcb Refactor blend mode menu handling in CanvasLayers
Replaces direct DOM removal with a dedicated closeBlendModeMenu method for consistency. Increases menu z-index for better stacking, and appends the menu to the canvas container if available instead of always using document.body.
2025-06-28 02:33:25 +02:00
Dariusz L
3957aa0f61 Refactor canvas state change handling and layer removal
Replaces the onInteractionEnd callback with onStateChange for more consistent state change notifications. Adds a removeSelectedLayers method to Canvas for cleaner layer removal logic. Updates UI event handlers to use the new methods and callbacks, and ensures state is saved after relevant operations. Cleans up redundant updateOutput calls and streamlines output update logic.
2025-06-28 02:26:06 +02:00
Dariusz L
f76f047fa6 Add onInteractionEnd callback to Canvas
Introduces an optional onInteractionEnd callback to the Canvas class, which is triggered at the end of user interactions. CanvasView now uses this callback to update output after interactions, improving responsiveness to user actions.
2025-06-28 01:35:18 +02:00
Dariusz L
375ed6a2b8 Refactor codebase for consistent formatting and style
This commit applies consistent code formatting across multiple files, including spacing, indentation, and object destructuring. No functional changes were made; the update improves code readability and maintainability.
2025-06-27 07:13:20 +02:00
Dariusz L
b40d645a79 Refactor canvas and mask handling for clarity and maintainability
Removed redundant comments and streamlined logic across canvas-related modules, including mask positioning, garbage collection, and WebSocket communication. Improved code readability and maintainability by eliminating unnecessary explanations and clarifying intent in both Python and JavaScript files. No functional changes were made; this is a cleanup and refactor for better developer experience.
2025-06-27 06:17:24 +02:00
Dariusz L
711722eb9f Revert "Refactor logging and formatting"
This reverts commit 83ce890ef4.
2025-06-27 05:50:47 +02:00
Dariusz L
83ce890ef4 Refactor logging and formatting
Improved code readability
2025-06-27 05:32:11 +02:00
Dariusz L
be4fae2964 Add WebSocket-based RAM output for CanvasNode
Introduces a WebSocket-based mechanism for CanvasNode to send and receive canvas image and mask data in RAM, enabling fast, diskless data transfer between frontend and backend. Adds a new WebSocketManager utility, updates CanvasIO to support RAM output mode, and modifies CanvasView to send canvas data via WebSocket before prompt execution. The backend (canvas_node.py) is updated to handle WebSocket data storage and retrieval, with improved locking and cleanup logic. This change improves workflow speed and reliability by avoiding unnecessary disk I/O and ensuring up-to-date canvas data is available during node execution.
2025-06-27 05:28:13 +02:00
Dariusz L
daf3abeea7 Add world-space positioning and resizing for mask tool
Introduces x/y coordinates to MaskTool for world-space positioning, allowing the mask to extend beyond the output area. Updates mask drawing, export, and rendering logic to account for mask position. Ensures mask position is updated when moving or resizing the canvas, and preserves mask content during canvas resizing. Improves mask extraction and rendering accuracy.
2025-06-26 22:09:28 +02:00
Dariusz L
f2998f0f08 Bump database version to 3
Incremented the DB_VERSION constant from 2 to 3 in preparation for database schema changes or upgrades.
2025-06-26 20:59:08 +02:00
Dariusz L
3ca0a32a14 Add operation-based auto garbage collection for images
Introduces an operation counter and threshold in ImageReferenceManager to trigger automatic garbage collection after a set number of canvas operations. Canvas now increments the operation count on save, undo, and redo, and exposes methods to set the operation threshold and retrieve stats including operation count. CanvasView displays the operation count and threshold after manual garbage collection.
2025-06-26 19:18:05 +02:00
Dariusz L
48005247fb Update Canvas.js 2025-06-26 18:42:55 +02:00
Dariusz L
a5a3280535 Fix mask canvas sizing to use canvasInstance dimensions
Updated initMaskCanvas to set maskCanvas width and height based on canvasInstance instead of mainCanvas, ensuring correct sizing.
2025-06-26 18:38:24 +02:00
Dariusz L
7d7076cc45 Add image garbage collection to canvas
Introduced ImageReferenceManager to track and clean up unused images from the database and cache. Added manual garbage collection controls to the UI and exposed related stats and cleanup methods in Canvas. Updated db.js with a method to retrieve all image IDs for cleanup purposes.
2025-06-26 18:28:50 +02:00
Dariusz L
dd6a9dfc85 Rename canvas size methods and labels to output area
Refactored method and variable names from 'canvas size' to 'output area size' across multiple files for clarity. Updated UI labels and related function calls to reflect this terminology change.
2025-06-26 18:06:40 +02:00
Dariusz L
8b9edddc6a Remove unused blend mode methods and imports
Eliminated the applyBlendMode method from Canvas and CanvasLayers, along with related unused imports in CanvasIO and CanvasLayers. This streamlines the code by removing dead code and unnecessary dependencies.
2025-06-26 05:17:21 +02:00
Dariusz L
7c23373e8c Refactor file names and clean up imports
Renamed Mask_tool.js to MaskTool.js and Canvas_view.js to CanvasView.js for consistency. Removed unused imports and redundant properties/methods from Canvas.js and CanvasState.js to streamline the codebase.
2025-06-26 05:09:21 +02:00
Dariusz L
93c4bfd90d Remove Polish comments and clean up codebase
Removed Polish-language and redundant comments from multiple modules, including Canvas, CanvasInteractions, CanvasLayers, CanvasRenderer, CanvasState, Canvas_view, Mask_tool, and CommonUtils. This improves code readability and maintainability by reducing clutter and focusing on self-explanatory code.
2025-06-26 05:05:42 +02:00
Dariusz L
98d5b18422 Remove redundant comments and clean up logging code
This commit removes unnecessary and redundant comments from multiple JavaScript modules, streamlining the code and improving readability. No functional changes were made; only comment cleanup and minor formatting adjustments.
2025-06-26 05:03:17 +02:00
Dariusz L
c149976610 Update Canvas.js 2025-06-26 03:44:35 +02:00