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').
This commit is contained in:
Dariusz L
2025-06-28 19:48:57 +02:00
parent 8ead4176b5
commit 4376a21147
4 changed files with 42 additions and 25 deletions

View File

@@ -527,6 +527,8 @@ async function createCanvasWidget(node, widget, app) {
textContent: "Add Image",
title: "Add image from file",
onclick: () => {
const fitOnAddWidget = node.widgets.find(w => w.name === "fit_on_add");
const addMode = fitOnAddWidget && fitOnAddWidget.value ? 'fit' : 'center';
const input = document.createElement('input');
input.type = 'file';
input.accept = 'image/*';
@@ -537,7 +539,7 @@ async function createCanvasWidget(node, widget, app) {
reader.onload = (event) => {
const img = new Image();
img.onload = () => {
canvas.addLayer(img);
canvas.addLayer(img, addMode);
};
img.src = event.target.result;
};
@@ -555,7 +557,11 @@ async function createCanvasWidget(node, widget, app) {
$el("button.painter-button.primary", {
textContent: "Paste Image",
title: "Paste image from clipboard",
onclick: () => canvas.handlePaste('center')
onclick: () => {
const fitOnAddWidget = node.widgets.find(w => w.name === "fit_on_add");
const addMode = fitOnAddWidget && fitOnAddWidget.value ? 'fit' : 'center';
canvas.handlePaste(addMode);
}
}),
]),