sneedgroup-holder/openOutpaint
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

right-click erase is now an option

Browse source
This commit is contained in:
tim h 2022-11-19 21:32:35 -06:00 committed by Victor Seiji Hariki
parent fe508f8b21
commit 3062766c13
2 changed files with 13 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
index.html
View file

@ -65,6 +65,8 @@
<input type="range" id="scaleFactor" name="scaleFactor" min="1" max="16" /><br />
<label for="cbxSnap">Snap to grid?</label>
<input type="checkbox" id="cbxSnap" onchange="changeSnapMode()" checked="checked"><br />
<label for="cbxEnableErasing">Right-click erase?</label>
<input type="checkbox" id="cbxEnableErasing" onchange="changeEnableErasing()"><br />
<label for="cbxPaint">Mask mode?</label>
<input type="checkbox" id="cbxPaint" onchange="changePaintMode()"><br />
<label for="cbxErase"><s>Erase mask?</s></label>

12
js/index.js
View file

@ -117,6 +117,7 @@ var arbitraryImageData;
var arbitraryImageBitmap;
var arbitraryImageBase64; // seriously js cmon work with me here
var placingArbitraryImage = false; // for when the user has loaded an existing image from their computer
var enableErasing = false; // accidental right-click erase if the user isn't trying to erase is a bad thing
// info div, sometimes hidden
let mouseXInfo = document.getElementById("mouseX");
@ -464,7 +465,7 @@ function mouseDown(evt) {
nextBox.h = basePixelCount * scaleFactor;
drawTargets.push(nextBox);
}
} else if (evt.button == 2 && !paintMode) { // right click, also gotta make sure mask blob isn't being used as it's visually inconsistent with behavior of erased region
} else if (evt.button == 2 && enableErasing && !paintMode) { // right click, also gotta make sure mask blob isn't being used as it's visually inconsistent with behavior of erased region
// erase the canvas underneath the cursor,
ctx = imgCanvas.getContext('2d');
if (snapToGrid) {
@ -753,11 +754,18 @@ function changePaintMode() {
}
function changeEraseMode() {
//TODO rename/refactor to make it more obvious this is just for painted masks
eraseMode = document.getElementById("cbxErase").checked;
clearTargetMask();
ovCtx.clearRect(0, 0, ovCanvas.width, ovCanvas.height);
}
function changeEnableErasing() {
// yeah because this is for the image layer
enableErasing = document.getElementById("cbxEnableErasing").checked;
localStorage.setItem("enable_erase", enableErasing);
}
function changeSampler() {
stableDiffusionData.sampler_index = document.getElementById("samplerSelect").value;
localStorage.setItem("sampler", stableDiffusionData.sampler_index);
@ -916,10 +924,12 @@ function loadSettings() {
var _mask_blur = localStorage.getItem("mask_blur") == null ? 0 : localStorage.getItem("mask_blur");
var _seed = localStorage.getItem("seed") == null ? -1 : localStorage.getItem("seed");
var _enable_hr = Boolean(localStorage.getItem("enable_hr") == (null || "false") ? false : localStorage.getItem("enable_hr"));
var _enable_erase = Boolean(localStorage.getItem("enable_erase") == (null || "false") ? false : localStorage.getItem("enable_erase"));
// set the values into the UI
document.getElementById("samplerSelect").value = String(_sampler);
document.getElementById("maskBlur").value = Number(_mask_blur);
document.getElementById("seed").value = Number(_seed);
document.getElementById("cbxHRFix").checked = Boolean(_enable_hr);
document.getElementById("cbxEnableErasing").checked = Boolean(_enable_erase);
}