From 796a65d2514c317c4b5a176facc5b8da0d9637ae Mon Sep 17 00:00:00 2001 From: Dariusz L Date: Sat, 26 Jul 2025 23:39:29 +0200 Subject: [PATCH] Remove unused and redundant methods from canvas modules Cleaned up the codebase by removing unused or redundant methods from Canvas, CanvasIO, CanvasLayers, CanvasLayersPanel, CanvasRenderer, and MaskTool. This reduces code complexity and improves maintainability without affecting core functionality. --- js/Canvas.js | 6 -- js/CanvasIO.js | 104 ---------------------------------- js/CanvasLayers.js | 15 ----- js/MaskTool.js | 43 -------------- src/Canvas.ts | 13 ----- src/CanvasIO.ts | 119 --------------------------------------- src/CanvasLayers.ts | 18 ------ src/CanvasLayersPanel.ts | 3 - src/CanvasRenderer.ts | 1 - src/MaskTool.ts | 47 ---------------- 10 files changed, 369 deletions(-) diff --git a/js/Canvas.js b/js/Canvas.js index cb40937..ff46808 100644 --- a/js/Canvas.js +++ b/js/Canvas.js @@ -298,12 +298,6 @@ export class Canvas { removeSelectedLayers() { return this.canvasSelection.removeSelectedLayers(); } - /** - * Duplikuje zaznaczone warstwy (w pamięci, bez zapisu stanu) - */ - duplicateSelectedLayers() { - return this.canvasSelection.duplicateSelectedLayers(); - } /** * Aktualizuje zaznaczenie warstw i powiadamia wszystkie komponenty. * To jest "jedyne źródło prawdy" o zmianie zaznaczenia. diff --git a/js/CanvasIO.js b/js/CanvasIO.js index 7f212d3..7c3c704 100644 --- a/js/CanvasIO.js +++ b/js/CanvasIO.js @@ -481,21 +481,6 @@ export class CanvasIO { img.src = canvas.toDataURL(); }); } - async retryDataLoad(maxRetries = 3, delay = 1000) { - for (let i = 0; i < maxRetries; i++) { - try { - await this.initNodeData(); - return; - } - catch (error) { - log.warn(`Retry ${i + 1}/${maxRetries} failed:`, error); - if (i < maxRetries - 1) { - await new Promise(resolve => setTimeout(resolve, delay)); - } - } - } - log.error("Failed to load data after", maxRetries, "retries"); - } async processMaskData(maskData) { try { if (!maskData) @@ -518,73 +503,6 @@ export class CanvasIO { log.error("Error processing mask data:", error); } } - async loadImageFromCache(base64Data) { - return new Promise((resolve, reject) => { - const img = new Image(); - img.onload = () => resolve(img); - img.onerror = reject; - img.src = base64Data; - }); - } - async importImage(cacheData) { - try { - log.info("Starting image import with cache data"); - const img = await this.loadImageFromCache(cacheData.image); - const mask = cacheData.mask ? await this.loadImageFromCache(cacheData.mask) : null; - const scale = Math.min(this.canvas.width / img.width * 0.8, this.canvas.height / img.height * 0.8); - const tempCanvas = document.createElement('canvas'); - tempCanvas.width = img.width; - tempCanvas.height = img.height; - const tempCtx = tempCanvas.getContext('2d', { willReadFrequently: true }); - if (!tempCtx) - throw new Error("Could not create temp context"); - tempCtx.drawImage(img, 0, 0); - if (mask) { - const imageData = tempCtx.getImageData(0, 0, img.width, img.height); - const maskCanvas = document.createElement('canvas'); - maskCanvas.width = img.width; - maskCanvas.height = img.height; - const maskCtx = maskCanvas.getContext('2d', { willReadFrequently: true }); - if (!maskCtx) - throw new Error("Could not create mask context"); - maskCtx.drawImage(mask, 0, 0); - const maskData = maskCtx.getImageData(0, 0, img.width, img.height); - for (let i = 0; i < imageData.data.length; i += 4) { - imageData.data[i + 3] = maskData.data[i]; - } - tempCtx.putImageData(imageData, 0, 0); - } - const finalImage = new Image(); - await new Promise((resolve) => { - finalImage.onload = resolve; - finalImage.src = tempCanvas.toDataURL(); - }); - const layer = { - id: '', // This will be set in addLayerWithImage - imageId: '', // This will be set in addLayerWithImage - name: 'Layer', - image: finalImage, - x: (this.canvas.width - img.width * scale) / 2, - y: (this.canvas.height - img.height * scale) / 2, - width: img.width * scale, - height: img.height * scale, - originalWidth: img.width, - originalHeight: img.height, - rotation: 0, - zIndex: this.canvas.layers.length, - blendMode: 'normal', - opacity: 1, - visible: true, - }; - this.canvas.layers.push(layer); - this.canvas.updateSelection([layer]); - this.canvas.render(); - this.canvas.saveState(); - } - catch (error) { - log.error('Error importing image:', error); - } - } async importLatestImage() { try { log.info("Fetching latest image from server..."); @@ -682,26 +600,4 @@ export class CanvasIO { clippedImage.src = canvas.toDataURL(); }); } - createMaskFromShape(shape, width, height) { - const { canvas, ctx } = createCanvas(width, height); - if (!ctx) { - throw new Error("Could not create canvas context for mask"); - } - ctx.fillStyle = 'black'; - ctx.fillRect(0, 0, width, height); - ctx.fillStyle = 'white'; - ctx.beginPath(); - ctx.moveTo(shape.points[0].x, shape.points[0].y); - for (let i = 1; i < shape.points.length; i++) { - ctx.lineTo(shape.points[i].x, shape.points[i].y); - } - ctx.closePath(); - ctx.fill(); - const imageData = ctx.getImageData(0, 0, width, height); - const maskData = new Float32Array(width * height); - for (let i = 0; i < imageData.data.length; i += 4) { - maskData[i / 4] = imageData.data[i] / 255; - } - return maskData; - } } diff --git a/js/CanvasLayers.js b/js/CanvasLayers.js index 7a602a1..a0bceef 100644 --- a/js/CanvasLayers.js +++ b/js/CanvasLayers.js @@ -764,21 +764,6 @@ export class CanvasLayers { menu.parentNode.removeChild(menu); } } - showOpacitySlider(mode) { - const slider = document.createElement('input'); - slider.type = 'range'; - slider.min = '0'; - slider.max = '100'; - slider.value = String(this.blendOpacity); - slider.className = 'blend-opacity-slider'; - slider.addEventListener('input', (e) => { - this.blendOpacity = parseInt(e.target.value, 10); - }); - const modeElement = document.querySelector(`[data-blend-mode="${mode}"]`); - if (modeElement) { - modeElement.appendChild(slider); - } - } /** * Zunifikowana funkcja do generowania blob z canvas * @param options Opcje renderowania diff --git a/js/MaskTool.js b/js/MaskTool.js index 9b2fcdf..325909c 100644 --- a/js/MaskTool.js +++ b/js/MaskTool.js @@ -778,29 +778,6 @@ export class MaskTool { this.updateActiveMaskCanvas(); return this.activeMaskCanvas; } - getMaskImageWithAlpha() { - const tempCanvas = document.createElement('canvas'); - tempCanvas.width = this.maskCanvas.width; - tempCanvas.height = this.maskCanvas.height; - const tempCtx = tempCanvas.getContext('2d', { willReadFrequently: true }); - if (!tempCtx) { - throw new Error("Failed to get 2D context for temporary canvas"); - } - tempCtx.drawImage(this.maskCanvas, 0, 0); - const imageData = tempCtx.getImageData(0, 0, tempCanvas.width, tempCanvas.height); - const data = imageData.data; - for (let i = 0; i < data.length; i += 4) { - const alpha = data[i]; - data[i] = 255; - data[i + 1] = 255; - data[i + 2] = 255; - data[i + 3] = alpha; - } - tempCtx.putImageData(imageData, 0, 0); - const maskImage = new Image(); - maskImage.src = tempCanvas.toDataURL(); - return maskImage; - } resize(width, height) { this.initPreviewCanvas(); const oldMask = this.maskCanvas; @@ -830,11 +807,6 @@ export class MaskTool { log.info(`Mask canvas resized to ${this.activeMaskCanvas.width}x${this.activeMaskCanvas.height}, position (${this.x}, ${this.y})`); log.info(`Canvas size change: width ${isIncreasingWidth ? 'increased' : 'decreased'}, height ${isIncreasingHeight ? 'increased' : 'decreased'}`); } - updatePosition(dx, dy) { - this.x += dx; - this.y += dy; - log.info(`Mask position updated to (${this.x}, ${this.y})`); - } /** * Updates mask canvas to ensure it covers the current output area * This should be called when output area position or size changes @@ -1405,21 +1377,6 @@ export class MaskTool { } return distances; } - /** - * Creates an expanded mask using distance transform - much better for complex shapes - * than the centroid-based approach. This version only does expansion without transparency calculations. - */ - _calculateExpandedPoints(points, expansionValue) { - if (points.length < 3 || expansionValue === 0) - return points; - // For expansion, we need to create a temporary canvas to use the distance transform approach - // This will give us much better results for complex shapes than the centroid method - const tempCanvas = this._createExpandedMaskCanvas(points, expansionValue, this.maskCanvas.width, this.maskCanvas.height); - // Extract the expanded shape outline from the canvas - // For now, return the original points as a fallback - the real expansion happens in the canvas - // The calling code will use the canvas directly instead of these points - return points; - } /** * Creates an expanded/contracted mask canvas using simple morphological operations * This gives SHARP edges without smoothing, unlike distance transform diff --git a/src/Canvas.ts b/src/Canvas.ts index 066f51f..39efca1 100644 --- a/src/Canvas.ts +++ b/src/Canvas.ts @@ -174,7 +174,6 @@ export class Canvas { this.previewVisible = false; } - async waitForWidget(name: any, node: any, interval = 100, timeout = 20000) { const startTime = Date.now(); @@ -194,7 +193,6 @@ export class Canvas { }); } - /** * Kontroluje widoczność podglądu canvas * @param {boolean} visible - Czy podgląd ma być widoczny @@ -271,7 +269,6 @@ export class Canvas { })); } - /** * Ładuje stan canvas z bazy danych */ @@ -323,7 +320,6 @@ export class Canvas { log.debug('Undo completed, layers count:', this.layers.length); } - /** * Ponów cofniętą operację */ @@ -396,13 +392,6 @@ export class Canvas { return this.canvasSelection.removeSelectedLayers(); } - /** - * Duplikuje zaznaczone warstwy (w pamięci, bez zapisu stanu) - */ - duplicateSelectedLayers() { - return this.canvasSelection.duplicateSelectedLayers(); - } - /** * Aktualizuje zaznaczenie warstw i powiadamia wszystkie komponenty. * To jest "jedyne źródło prawdy" o zmianie zaznaczenia. @@ -535,7 +524,6 @@ export class Canvas { log.debug('Auto-refresh handlers setup complete, reading from node widget: auto_refresh_after_generation'); } - /** * Uruchamia edytor masek * @param {Image|HTMLCanvasElement|null} predefinedMask - Opcjonalna maska do nałożenia po otwarciu editora @@ -545,7 +533,6 @@ export class Canvas { return this.canvasMask.startMaskEditor(predefinedMask as any, sendCleanImage); } - /** * Inicjalizuje podstawowe właściwości canvas */ diff --git a/src/CanvasIO.ts b/src/CanvasIO.ts index f5b8f73..126d502 100644 --- a/src/CanvasIO.ts +++ b/src/CanvasIO.ts @@ -574,21 +574,6 @@ export class CanvasIO { }); } - async retryDataLoad(maxRetries = 3, delay = 1000): Promise { - for (let i = 0; i < maxRetries; i++) { - try { - await this.initNodeData(); - return; - } catch (error) { - log.warn(`Retry ${i + 1}/${maxRetries} failed:`, error); - if (i < maxRetries - 1) { - await new Promise(resolve => setTimeout(resolve, delay)); - } - } - } - log.error("Failed to load data after", maxRetries, "retries"); - } - async processMaskData(maskData: any): Promise { try { if (!maskData) return; @@ -614,84 +599,6 @@ export class CanvasIO { } } - async loadImageFromCache(base64Data: string): Promise { - return new Promise((resolve, reject) => { - const img = new Image(); - img.onload = () => resolve(img); - img.onerror = reject; - img.src = base64Data; - }); - } - - async importImage(cacheData: { image: string, mask?: string }): Promise { - try { - log.info("Starting image import with cache data"); - const img = await this.loadImageFromCache(cacheData.image); - const mask = cacheData.mask ? await this.loadImageFromCache(cacheData.mask) : null; - - const scale = Math.min( - this.canvas.width / img.width * 0.8, - this.canvas.height / img.height * 0.8 - ); - - const tempCanvas = document.createElement('canvas'); - tempCanvas.width = img.width; - tempCanvas.height = img.height; - const tempCtx = tempCanvas.getContext('2d', { willReadFrequently: true }); - if (!tempCtx) throw new Error("Could not create temp context"); - - tempCtx.drawImage(img, 0, 0); - - if (mask) { - const imageData = tempCtx.getImageData(0, 0, img.width, img.height); - const maskCanvas = document.createElement('canvas'); - maskCanvas.width = img.width; - maskCanvas.height = img.height; - const maskCtx = maskCanvas.getContext('2d', { willReadFrequently: true }); - if (!maskCtx) throw new Error("Could not create mask context"); - maskCtx.drawImage(mask, 0, 0); - const maskData = maskCtx.getImageData(0, 0, img.width, img.height); - - for (let i = 0; i < imageData.data.length; i += 4) { - imageData.data[i + 3] = maskData.data[i]; - } - - tempCtx.putImageData(imageData, 0, 0); - } - - const finalImage = new Image(); - await new Promise((resolve) => { - finalImage.onload = resolve; - finalImage.src = tempCanvas.toDataURL(); - }); - - const layer: Layer = { - id: '', // This will be set in addLayerWithImage - imageId: '', // This will be set in addLayerWithImage - name: 'Layer', - image: finalImage, - x: (this.canvas.width - img.width * scale) / 2, - y: (this.canvas.height - img.height * scale) / 2, - width: img.width * scale, - height: img.height * scale, - originalWidth: img.width, - originalHeight: img.height, - rotation: 0, - zIndex: this.canvas.layers.length, - blendMode: 'normal', - opacity: 1, - visible: true, - }; - - this.canvas.layers.push(layer); - this.canvas.updateSelection([layer]); - this.canvas.render(); - this.canvas.saveState(); - } catch (error) { - log.error('Error importing image:', error); - } - } - async importLatestImage(): Promise { try { log.info("Fetching latest image from server..."); @@ -798,30 +705,4 @@ export class CanvasIO { clippedImage.src = canvas.toDataURL(); }); } - - createMaskFromShape(shape: Shape, width: number, height: number): Float32Array { - const { canvas, ctx } = createCanvas(width, height); - if (!ctx) { - throw new Error("Could not create canvas context for mask"); - } - - ctx.fillStyle = 'black'; - ctx.fillRect(0, 0, width, height); - - ctx.fillStyle = 'white'; - ctx.beginPath(); - ctx.moveTo(shape.points[0].x, shape.points[0].y); - for (let i = 1; i < shape.points.length; i++) { - ctx.lineTo(shape.points[i].x, shape.points[i].y); - } - ctx.closePath(); - ctx.fill(); - - const imageData = ctx.getImageData(0, 0, width, height); - const maskData = new Float32Array(width * height); - for (let i = 0; i < imageData.data.length; i += 4) { - maskData[i / 4] = imageData.data[i] / 255; - } - return maskData; - } } diff --git a/src/CanvasLayers.ts b/src/CanvasLayers.ts index 0e92c89..b8c5c8b 100644 --- a/src/CanvasLayers.ts +++ b/src/CanvasLayers.ts @@ -879,24 +879,6 @@ export class CanvasLayers { } } - showOpacitySlider(mode: string): void { - const slider = document.createElement('input'); - slider.type = 'range'; - slider.min = '0'; - slider.max = '100'; - slider.value = String(this.blendOpacity); - slider.className = 'blend-opacity-slider'; - - slider.addEventListener('input', (e) => { - this.blendOpacity = parseInt((e.target as HTMLInputElement).value, 10); - }); - - const modeElement = document.querySelector(`[data-blend-mode="${mode}"]`); - if (modeElement) { - modeElement.appendChild(slider); - } - } - /** * Zunifikowana funkcja do generowania blob z canvas * @param options Opcje renderowania diff --git a/src/CanvasLayersPanel.ts b/src/CanvasLayersPanel.ts index d52a18c..f4f594c 100644 --- a/src/CanvasLayersPanel.ts +++ b/src/CanvasLayersPanel.ts @@ -534,7 +534,6 @@ export class CanvasLayersPanel { log.debug(`Layer clicked: ${layer.name}, selection count: ${this.canvas.canvasSelection.selectedLayers.length}`); } - startEditingLayerName(nameElement: HTMLElement, layer: Layer): void { const currentName = layer.name; nameElement.classList.add('editing'); @@ -572,7 +571,6 @@ export class CanvasLayersPanel { }); } - ensureUniqueName(proposedName: string, currentLayer: Layer): string { const existingNames = this.canvas.layers .filter((layer: Layer) => layer !== currentLayer) @@ -731,7 +729,6 @@ export class CanvasLayersPanel { this.draggedElements = []; } - onLayersChanged(): void { this.renderLayers(); } diff --git a/src/CanvasRenderer.ts b/src/CanvasRenderer.ts index 0501c13..24a6a84 100644 --- a/src/CanvasRenderer.ts +++ b/src/CanvasRenderer.ts @@ -275,7 +275,6 @@ export class CanvasRenderer { } } - drawGrid(ctx: any) { const gridSize = 64; const lineWidth = 0.5 / this.canvas.viewport.zoom; diff --git a/src/MaskTool.ts b/src/MaskTool.ts index e6eb84e..8dcc729 100644 --- a/src/MaskTool.ts +++ b/src/MaskTool.ts @@ -946,30 +946,6 @@ export class MaskTool { return this.activeMaskCanvas; } - getMaskImageWithAlpha(): HTMLImageElement { - const tempCanvas = document.createElement('canvas'); - tempCanvas.width = this.maskCanvas.width; - tempCanvas.height = this.maskCanvas.height; - const tempCtx = tempCanvas.getContext('2d', { willReadFrequently: true }); - if (!tempCtx) { - throw new Error("Failed to get 2D context for temporary canvas"); - } - tempCtx.drawImage(this.maskCanvas, 0, 0); - const imageData = tempCtx.getImageData(0, 0, tempCanvas.width, tempCanvas.height); - const data = imageData.data; - for (let i = 0; i < data.length; i += 4) { - const alpha = data[i]; - data[i] = 255; - data[i + 1] = 255; - data[i + 2] = 255; - data[i + 3] = alpha; - } - tempCtx.putImageData(imageData, 0, 0); - const maskImage = new Image(); - maskImage.src = tempCanvas.toDataURL(); - return maskImage; - } - resize(width: number, height: number): void { this.initPreviewCanvas(); const oldMask = this.maskCanvas; @@ -1009,12 +985,6 @@ export class MaskTool { log.info(`Canvas size change: width ${isIncreasingWidth ? 'increased' : 'decreased'}, height ${isIncreasingHeight ? 'increased' : 'decreased'}`); } - updatePosition(dx: number, dy: number): void { - this.x += dx; - this.y += dy; - log.info(`Mask position updated to (${this.x}, ${this.y})`); - } - /** * Updates mask canvas to ensure it covers the current output area * This should be called when output area position or size changes @@ -1706,23 +1676,6 @@ export class MaskTool { return distances; } - /** - * Creates an expanded mask using distance transform - much better for complex shapes - * than the centroid-based approach. This version only does expansion without transparency calculations. - */ - private _calculateExpandedPoints(points: Point[], expansionValue: number): Point[] { - if (points.length < 3 || expansionValue === 0) return points; - - // For expansion, we need to create a temporary canvas to use the distance transform approach - // This will give us much better results for complex shapes than the centroid method - const tempCanvas = this._createExpandedMaskCanvas(points, expansionValue, this.maskCanvas.width, this.maskCanvas.height); - - // Extract the expanded shape outline from the canvas - // For now, return the original points as a fallback - the real expansion happens in the canvas - // The calling code will use the canvas directly instead of these points - return points; - } - /** * Creates an expanded/contracted mask canvas using simple morphological operations * This gives SHARP edges without smoothing, unlike distance transform