mirror of
https://github.com/Azornes/Comfyui-LayerForge.git
synced 2026-03-25 22:35:43 -03:00
Refactor code style and remove mask editor examples
This commit applies consistent code style changes (mainly spacing and formatting) across multiple JS files for improved readability and maintainability. Additionally, it removes the unused 'js/examples/mask_editor_examples.js' file.
This commit is contained in:
10
js/Canvas.js
10
js/Canvas.js
@@ -173,8 +173,6 @@ export class Canvas {
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Ładuje stan canvas z bazy danych
|
||||
*/
|
||||
@@ -292,8 +290,6 @@ export class Canvas {
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Uruchamia edytor masek
|
||||
* @param {Image|HTMLCanvasElement|null} predefinedMask - Opcjonalna maska do nałożenia po otwarciu editora
|
||||
@@ -374,8 +370,6 @@ export class Canvas {
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Inicjalizuje podstawowe właściwości canvas
|
||||
*/
|
||||
@@ -488,8 +482,6 @@ export class Canvas {
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Czeka na otwarcie mask editora i automatycznie nakłada predefiniowaną maskę
|
||||
*/
|
||||
@@ -826,8 +818,6 @@ export class Canvas {
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Zapisuje obecny stan maski przed otwarciem editora
|
||||
* @returns {Object} Zapisany stan maski
|
||||
|
||||
@@ -1124,7 +1124,6 @@ async function createCanvasWidget(node, widget, app) {
|
||||
}
|
||||
|
||||
|
||||
|
||||
return {
|
||||
canvas: canvas,
|
||||
panel: controlPanel
|
||||
|
||||
@@ -283,7 +283,6 @@ export class MaskTool {
|
||||
setMask(image) {
|
||||
|
||||
|
||||
|
||||
const destX = -this.x;
|
||||
const destY = -this.y;
|
||||
|
||||
|
||||
@@ -1,141 +0,0 @@
|
||||
/**
|
||||
* Przykłady użycia automatycznego nakładania masek w mask editorze
|
||||
*
|
||||
* Te przykłady pokazują jak używać nowej funkcjonalności do automatycznego
|
||||
* nakładania predefiniowanych masek po otwarciu mask editora ComfyUI.
|
||||
*/
|
||||
|
||||
import {
|
||||
start_mask_editor_with_predefined_mask,
|
||||
create_mask_from_image_src,
|
||||
canvas_to_mask_image
|
||||
} from '../utils/mask_utils.js';
|
||||
|
||||
/**
|
||||
* Przykład 1: Podstawowe użycie z obrazem maski
|
||||
*/
|
||||
async function example1_basic_usage(canvasInstance) {
|
||||
|
||||
const maskImage = await create_mask_from_image_src('/path/to/mask.png');
|
||||
|
||||
|
||||
start_mask_editor_with_predefined_mask(canvasInstance, maskImage, true);
|
||||
}
|
||||
|
||||
/**
|
||||
* Przykład 2: Użycie z canvas jako maska
|
||||
*/
|
||||
async function example2_canvas_mask(canvasInstance) {
|
||||
|
||||
const maskCanvas = document.createElement('canvas');
|
||||
maskCanvas.width = 512;
|
||||
maskCanvas.height = 512;
|
||||
const ctx = maskCanvas.getContext('2d');
|
||||
|
||||
ctx.fillStyle = 'black';
|
||||
ctx.fillRect(0, 0, 512, 512);
|
||||
ctx.fillStyle = 'white';
|
||||
ctx.beginPath();
|
||||
ctx.arc(256, 256, 100, 0, 2 * Math.PI);
|
||||
ctx.fill();
|
||||
|
||||
const maskImage = await canvas_to_mask_image(maskCanvas);
|
||||
|
||||
start_mask_editor_with_predefined_mask(canvasInstance, maskImage, true);
|
||||
}
|
||||
|
||||
/**
|
||||
* Przykład 3: Bezpośrednie użycie metody Canvas
|
||||
*/
|
||||
async function example3_direct_canvas_method(canvasInstance) {
|
||||
|
||||
const maskImage = await create_mask_from_image_src('/path/to/mask.png');
|
||||
|
||||
|
||||
|
||||
await canvasInstance.startMaskEditor(maskImage, true);
|
||||
}
|
||||
|
||||
/**
|
||||
* Przykład 4: Tworzenie maski z danych binarnych
|
||||
*/
|
||||
async function example4_binary_data_mask(canvasInstance, binaryData) {
|
||||
|
||||
const blob = new Blob([binaryData], { type: 'image/png' });
|
||||
const dataUrl = URL.createObjectURL(blob);
|
||||
|
||||
const maskImage = await create_mask_from_image_src(dataUrl);
|
||||
|
||||
start_mask_editor_with_predefined_mask(canvasInstance, maskImage, true);
|
||||
|
||||
URL.revokeObjectURL(dataUrl);
|
||||
}
|
||||
|
||||
/**
|
||||
* Przykład 5: Maska z gradientem
|
||||
*/
|
||||
async function example5_gradient_mask(canvasInstance) {
|
||||
const maskCanvas = document.createElement('canvas');
|
||||
maskCanvas.width = 512;
|
||||
maskCanvas.height = 512;
|
||||
const ctx = maskCanvas.getContext('2d');
|
||||
|
||||
const gradient = ctx.createLinearGradient(0, 0, 512, 0);
|
||||
gradient.addColorStop(0, 'rgba(0, 0, 0, 0)'); // Przezroczysty
|
||||
gradient.addColorStop(1, 'rgba(255, 255, 255, 1)'); // Biały
|
||||
|
||||
ctx.fillStyle = gradient;
|
||||
ctx.fillRect(0, 0, 512, 512);
|
||||
|
||||
const maskImage = await canvas_to_mask_image(maskCanvas);
|
||||
start_mask_editor_with_predefined_mask(canvasInstance, maskImage, true);
|
||||
}
|
||||
|
||||
/**
|
||||
* Przykład 6: Obsługa błędów
|
||||
*/
|
||||
async function example6_error_handling(canvasInstance) {
|
||||
try {
|
||||
const maskImage = await create_mask_from_image_src('/path/to/nonexistent.png');
|
||||
start_mask_editor_with_predefined_mask(canvasInstance, maskImage, true);
|
||||
} catch (error) {
|
||||
console.error('Błąd podczas ładowania maski:', error);
|
||||
|
||||
await canvasInstance.startMaskEditor();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Przykład 7: Maska z istniejącego elementu canvas na stronie
|
||||
*/
|
||||
async function example7_existing_canvas_element(canvasInstance, canvasElementId) {
|
||||
const existingCanvas = document.getElementById(canvasElementId);
|
||||
if (!existingCanvas) {
|
||||
console.error('Canvas element not found:', canvasElementId);
|
||||
return;
|
||||
}
|
||||
|
||||
const maskImage = await canvas_to_mask_image(existingCanvas);
|
||||
start_mask_editor_with_predefined_mask(canvasInstance, maskImage, true);
|
||||
}
|
||||
|
||||
/**
|
||||
* Przykład 8: Kombinowanie z istniejącą maską
|
||||
*/
|
||||
async function example8_combine_with_existing_mask(canvasInstance) {
|
||||
const maskImage = await create_mask_from_image_src('/path/to/mask.png');
|
||||
|
||||
|
||||
start_mask_editor_with_predefined_mask(canvasInstance, maskImage, false);
|
||||
}
|
||||
|
||||
export {
|
||||
example1_basic_usage,
|
||||
example2_canvas_mask,
|
||||
example3_direct_canvas_method,
|
||||
example4_binary_data_mask,
|
||||
example5_gradient_mask,
|
||||
example6_error_handling,
|
||||
example7_existing_canvas_element,
|
||||
example8_combine_with_existing_mask
|
||||
};
|
||||
@@ -1,5 +1,6 @@
|
||||
import {createModuleLogger} from "./LoggerUtils.js";
|
||||
import {withErrorHandling, createValidationError} from "../ErrorHandler.js";
|
||||
|
||||
const log = createModuleLogger('ImageUtils');
|
||||
|
||||
export function validateImageData(data) {
|
||||
|
||||
@@ -130,7 +130,6 @@ class WebSocketManager {
|
||||
log.warn("WebSocket not open. Queuing message.");
|
||||
|
||||
|
||||
|
||||
this.messageQueue.push(message);
|
||||
if (!this.isConnecting) {
|
||||
this.connect();
|
||||
@@ -147,7 +146,6 @@ class WebSocketManager {
|
||||
log.debug(`Flushing ${this.messageQueue.length} queued messages.`);
|
||||
|
||||
|
||||
|
||||
while (this.messageQueue.length > 0) {
|
||||
const message = this.messageQueue.shift();
|
||||
this.socket.send(message);
|
||||
|
||||
@@ -142,7 +142,6 @@ export function start_mask_editor_auto(canvasInstance) {
|
||||
}
|
||||
|
||||
|
||||
|
||||
canvasInstance.startMaskEditor();
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user