alphard/Comfyui-LayerForge
1
0
Fork 0
mirror of https://github.com/Azornes/Comfyui-LayerForge.git synced 2026-03-24 05:52:12 -03:00
Code Issues Packages Projects Releases Wiki Activity

project migration to typescript

Browse Source 
Project migration to typescript
This commit is contained in:
Dariusz L
2025-07-04 04:22:51 +02:00
parent 3e4cdf10bc
commit 5adc77471f
60 changed files with 12565 additions and 3021 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
js/utils/mask_utils.js
View File

@@ -1,39 +1,36 @@
import {createModuleLogger} from "./LoggerUtils.js";
import { createModuleLogger } from "./LoggerUtils.js";
const log = createModuleLogger('MaskUtils');
export function new_editor(app) {
if (!app) return false;
return app.ui.settings.getSettingValue('Comfy.MaskEditor.UseNewEditor')
if (!app)
return false;
return !!app.ui.settings.getSettingValue('Comfy.MaskEditor.UseNewEditor');
}
function get_mask_editor_element(app) {
return new_editor(app) ? document.getElementById('maskEditor') : document.getElementById('maskCanvas')?.parentElement
return new_editor(app) ? document.getElementById('maskEditor') : document.getElementById('maskCanvas')?.parentElement ?? null;
}
export function mask_editor_showing(app) {
const editor = get_mask_editor_element(app);
return editor && editor.style.display !== "none";
return !!editor && editor.style.display !== "none";
}
export function hide_mask_editor() {
if (mask_editor_showing()) document.getElementById('maskEditor').style.display = 'none'
export function hide_mask_editor(app) {
if (mask_editor_showing(app)) {
const editor = document.getElementById('maskEditor');
if (editor) {
editor.style.display = 'none';
}
}
}
function get_mask_editor_cancel_button(app) {
const cancelButton = document.getElementById("maskEditor_topBarCancelButton");
if (cancelButton) {
log.debug("Found cancel button by ID: maskEditor_topBarCancelButton");
return cancelButton;
}
const cancelSelectors = [
'button[onclick*="cancel"]',
'button[onclick*="Cancel"]',
'input[value="Cancel"]'
];
for (const selector of cancelSelectors) {
try {
const button = document.querySelector(selector);
@@ -41,11 +38,11 @@ function get_mask_editor_cancel_button(app) {
log.debug("Found cancel button with selector:", selector);
return button;
}
} catch (e) {
}
catch (e) {
log.warn("Invalid selector:", selector, e);
}
}
const allButtons = document.querySelectorAll('button, input[type="button"]');
for (const button of allButtons) {
const text = button.textContent || button.value || '';
@@ -54,72 +51,78 @@ function get_mask_editor_cancel_button(app) {
return button;
}
}
const editorElement = get_mask_editor_element(app);
if (editorElement) {
return editorElement?.parentElement?.lastChild?.childNodes[2];
const childNodes = editorElement?.parentElement?.lastChild?.childNodes;
if (childNodes && childNodes.length > 2 && childNodes[2] instanceof HTMLElement) {
return childNodes[2];
}
}
return null;
}
function get_mask_editor_save_button(app) {
if (document.getElementById("maskEditor_topBarSaveButton")) return document.getElementById("maskEditor_topBarSaveButton")
return get_mask_editor_element(app)?.parentElement?.lastChild?.childNodes[2]
const saveButton = document.getElementById("maskEditor_topBarSaveButton");
if (saveButton) {
return saveButton;
}
const editorElement = get_mask_editor_element(app);
if (editorElement) {
const childNodes = editorElement?.parentElement?.lastChild?.childNodes;
if (childNodes && childNodes.length > 2 && childNodes[2] instanceof HTMLElement) {
return childNodes[2];
}
}
return null;
}
export function mask_editor_listen_for_cancel(app, callback) {
let attempts = 0;
const maxAttempts = 50; // 5 sekund
const findAndAttachListener = () => {
attempts++;
const cancel_button = get_mask_editor_cancel_button(app);
if (cancel_button && !cancel_button.filter_listener_added) {
if (cancel_button instanceof HTMLElement && !cancel_button.filter_listener_added) {
log.info("Cancel button found, attaching listener");
cancel_button.addEventListener('click', callback);
cancel_button.filter_listener_added = true;
return true; // Znaleziono i podłączono
} else if (attempts < maxAttempts) {
}
else if (attempts < maxAttempts) {
setTimeout(findAndAttachListener, 100);
} else {
}
else {
log.warn("Could not find cancel button after", maxAttempts, "attempts");
const globalClickHandler = (event) => {
const target = event.target;
const text = target.textContent || target.value || '';
if (text.toLowerCase().includes('cancel') ||
if (target && (text.toLowerCase().includes('cancel') ||
target.id.toLowerCase().includes('cancel') ||
target.className.toLowerCase().includes('cancel')) {
target.className.toLowerCase().includes('cancel'))) {
log.info("Cancel detected via global click handler");
callback();
document.removeEventListener('click', globalClickHandler);
}
};
document.addEventListener('click', globalClickHandler);
log.debug("Added global click handler for cancel detection");
}
};
findAndAttachListener();
}
export function press_maskeditor_save(app) {
get_mask_editor_save_button(app)?.click()
const button = get_mask_editor_save_button(app);
if (button instanceof HTMLElement) {
button.click();
}
}
export function press_maskeditor_cancel(app) {
get_mask_editor_cancel_button(app)?.click()
const button = get_mask_editor_cancel_button(app);
if (button instanceof HTMLElement) {
button.click();
}
}
/**
* Uruchamia mask editor z predefiniowaną maską
* @param {Object} canvasInstance - Instancja Canvas
* @param {Image|HTMLCanvasElement} maskImage - Obraz maski do nałożenia
* @param {Canvas} canvasInstance - Instancja Canvas
* @param {HTMLImageElement | HTMLCanvasElement} maskImage - Obraz maski do nałożenia
* @param {boolean} sendCleanImage - Czy wysłać czysty obraz (bez istniejącej maski)
*/
export function start_mask_editor_with_predefined_mask(canvasInstance, maskImage, sendCleanImage = true) {
@@ -127,48 +130,42 @@ export function start_mask_editor_with_predefined_mask(canvasInstance, maskImage
log.error('Canvas instance and mask image are required');
return;
}
canvasInstance.startMaskEditor(maskImage, sendCleanImage);
}
/**
* Uruchamia mask editor z automatycznym zachowaniem (czysty obraz + istniejąca maska)
* @param {Object} canvasInstance - Instancja Canvas
* @param {Canvas} canvasInstance - Instancja Canvas
*/
export function start_mask_editor_auto(canvasInstance) {
if (!canvasInstance) {
log.error('Canvas instance is required');
return;
}
canvasInstance.startMaskEditor();
canvasInstance.startMaskEditor(null, true);
}
/**
* Tworzy maskę z obrazu dla użycia w mask editorze
* @param {string} imageSrc - Źródło obrazu (URL lub data URL)
* @returns {Promise<Image>} Promise zwracający obiekt Image
* @returns {Promise<HTMLImageElement>} Promise zwracający obiekt Image
*/
export function create_mask_from_image_src(imageSrc) {
return new Promise((resolve, reject) => {
const img = new Image();
img.onload = () => resolve(img);
img.onerror = reject;
img.onerror = (err) => reject(err);
img.src = imageSrc;
});
}
/**
* Konwertuje canvas do Image dla użycia jako maska
* @param {HTMLCanvasElement} canvas - Canvas do konwersji
* @returns {Promise<Image>} Promise zwracający obiekt Image
* @returns {Promise<HTMLImageElement>} Promise zwracający obiekt Image
*/
export function canvas_to_mask_image(canvas) {
return new Promise((resolve, reject) => {
const img = new Image();
img.onload = () => resolve(img);
img.onerror = reject;
img.onerror = (err) => reject(err);
img.src = canvas.toDataURL();
});
}