Optimize mask handling and shape mask UX for output area

Replaces full-canvas mask operations with getMaskForOutputArea() for significant performance improvements when processing masks for the output area. Refines shape mask removal and application logic to ensure correct mask state when changing expansion values or custom shapes, including auto-removal and re-application of masks. Adds throttling to shape preview rendering for better UI responsiveness. Improves mask removal to eliminate antialiasing artifacts and updates SAM mask integration to use correct output area positioning.
This commit is contained in:
Dariusz L
2025-07-27 17:23:08 +02:00
parent 6491d80225
commit 0d6bfb01d6
12 changed files with 448 additions and 302 deletions

View File

@@ -118,6 +118,11 @@ export class CanvasInteractions {
if (e.shiftKey) {
// Clear custom shape when starting canvas resize
if (this.canvas.outputAreaShape) {
// If auto-apply shape mask is enabled, remove the mask before clearing the shape
if (this.canvas.autoApplyShapeMask) {
log.info("Removing shape mask before clearing custom shape for canvas resize");
this.canvas.maskTool.removeShapeMask();
}
this.canvas.outputAreaShape = null;
this.canvas.render();
}
@@ -822,6 +827,11 @@ export class CanvasInteractions {
const boundingBox = this.canvas.shapeTool.getBoundingBox();
if (boundingBox && boundingBox.width > 1 && boundingBox.height > 1) {
this.canvas.saveState();
// If there's an existing custom shape and auto-apply shape mask is enabled, remove the previous mask
if (this.canvas.outputAreaShape && this.canvas.autoApplyShapeMask) {
log.info("Removing previous shape mask before defining new custom shape");
this.canvas.maskTool.removeShapeMask();
}
this.canvas.outputAreaShape = {
...shape,
points: shape.points.map((p) => ({
@@ -866,6 +876,11 @@ export class CanvasInteractions {
}
// Update mask canvas to ensure it covers the new output area position
this.canvas.maskTool.updateMaskCanvasForOutputArea();
// If auto-apply shape mask is enabled, automatically apply the mask with current settings
if (this.canvas.autoApplyShapeMask) {
log.info("Auto-applying shape mask to new custom shape with current settings");
this.canvas.maskTool.applyShapeMask();
}
this.canvas.saveState();
this.canvas.render();
}