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

Merge branch 'main' into testing

Browse source 
# Conflicts:
#	index.html
This commit is contained in:
tim h 2024-02-20 07:14:36 -06:00
commit 6017b60e9c
7 changed files with 139 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
css/ui/generic.css
View file

@ -449,3 +449,8 @@ select > option:checked::after {
-webkit-mask-image: url("../../res/icons/download.svg");
mask-image: url("../../res/icons/download.svg");
}
.list .actions > .upscale-btn > *:first-child {
-webkit-mask-image: url("../../res/icons/scaling.svg");
mask-image: url("../../res/icons/scaling.svg");
}

20
index.html
View file

@ -10,7 +10,7 @@
<link href="css/index.css?v=cf6b502" rel="stylesheet" />
<link href="css/layers.css?v=92c0352" rel="stylesheet" />
<link href="css/ui/generic.css?v=30837f8" rel="stylesheet" />
<link href="css/ui/generic.css?v=ed024fe" rel="stylesheet" />
<link href="css/ui/notifications.css?v=7b152de" rel="stylesheet" />
<link href="css/ui/workspace.css?v=2a9fdf7" rel="stylesheet" />
@ -294,8 +294,11 @@
<label>Choose upscaler</label>
<div id="upscaler-ac-select"></div>
<div id="upscaleX"></div>
<button onclick="upscaleAndDownload()">
Upscale (might take a sec)
<button onclick="upscaleAndDownload(true,false)">
Upscale (and download)
</button>
<button onclick="upscaleAndDownload(false,true)">
Upscale (to resource)
</button>
<br />
@ -334,8 +337,7 @@
<br />
<span id="version">
<a href="https://github.com/zero01101/openOutpaint" target="_blank">
<s>Alpha release v0.0.16.6</s>
v2023xxxx.001 //TODO update
v20240127.001
</a>
<br />
<a
@ -558,7 +560,7 @@
<!-- Content -->
<script src="js/prompt.js?v=7a1c68c" type="text/javascript"></script>
<script src="js/index.js?v=425e27d" type="text/javascript"></script>
<script src="js/index.js?v=70af18f" type="text/javascript"></script>
<script
src="js/ui/floating/history.js?v=4f29db4"
@ -572,7 +574,7 @@
src="js/ui/tool/generic.js?v=3e678e0"
type="text/javascript"></script>
<script src="js/ui/tool/dream.js?v=aa8c906" type="text/javascript"></script>
<script src="js/ui/tool/dream.js?v=be5099a" type="text/javascript"></script>
<script
src="js/ui/tool/maskbrush.js?v=e9bd0eb"
type="text/javascript"></script>
@ -580,9 +582,9 @@
src="js/ui/tool/colorbrush.js?v=84ff9fa"
type="text/javascript"></script>
<script
src="js/ui/tool/select.js?v=dfacef5"
src="js/ui/tool/select.js?v=76df58e"
type="text/javascript"></script>
<script src="js/ui/tool/stamp.js?v=4494df6" type="text/javascript"></script>
<script src="js/ui/tool/stamp.js?v=fdca5bc" type="text/javascript"></script>
<script
src="js/ui/tool/interrogate.js?v=dd45b4a"
type="text/javascript"></script>

56
js/index.js
View file

@ -1186,7 +1186,11 @@ async function getUpscalers() {
return {name: u, value: u};
});
upscalerAutoComplete.value = upscalers[0];
upscalerAutoComplete.value =
localStorage.getItem("openoutpaint/upscaler") === null
? upscalers[0]
: localStorage.getItem("openoutpaint/upscaler");
hrFixUpscalerAutoComplete.value =
localStorage.getItem("openoutpaint/hr_upscaler") === null
? "None"
@ -1430,7 +1434,11 @@ async function getSamplers() {
}
}
async function upscaleAndDownload() {
async function upscaleAndDownload(
download = false,
add_resource = false,
aCanvas = null
) {
// Future improvements: some upscalers take a while to upscale, so we should show a loading bar or something, also a slider for the upscale amount
// get cropped canvas, send it to upscaler, download result
@ -1438,18 +1446,30 @@ async function upscaleAndDownload() {
? localStorage.getItem("openoutpaint/upscale_x")
: 2;
var upscaler = upscalerAutoComplete.value;
var croppedCanvas = cropCanvas(
uil.getVisible({
x: 0,
y: 0,
w: imageCollection.size.w,
h: imageCollection.size.h,
})
);
if (croppedCanvas != null) {
var croppedCanvas = null;
var imgdata = null;
localStorage.setItem("openoutpaint/upscaler", upscaler);
if (aCanvas == null) {
console.log("Upscaling main canvas.");
croppedCanvas = cropCanvas(
uil.getVisible({
x: 0,
y: 0,
w: imageCollection.size.w,
h: imageCollection.size.h,
})
);
imgdata = croppedCanvas.canvas.toDataURL("image/png");
} else {
console.log("Upscaling resource canvas.");
imgdata = aCanvas.toDataURL("image/png");
}
if (imgdata != null) {
var url =
document.getElementById("host").value + "/sdapi/v1/extra-single-image/";
var imgdata = croppedCanvas.canvas.toDataURL("image/png");
var data = {
"resize-mode": 0, // 0 = just resize, 1 = crop and resize, 2 = resize and fill i assume based on theimg2img tabs options
upscaling_resize: upscale_factor,
@ -1481,7 +1501,17 @@ async function upscaleAndDownload() {
upscale_factor +
".png";
link.href = "data:image/png;base64," + data["image"];
link.click();
if (add_resource == true) {
console.log("Add upscaled to resource");
const img = new Image();
img.src = link.href;
tools.stamp.state.addResource(guid() + " (upscaled)", img);
}
if (download == true) {
console.log("Download upscaled");
link.click();
}
});
}
}

59
js/ui/tool/dream.js
View file

@ -62,9 +62,12 @@ const _monitorProgress = (bb, oncheck = null) => {
}
const timeSpent = performance.now() - init;
setTimeout(() => {
if (running) _checkProgress();
}, Math.max(0, minDelay - timeSpent));
setTimeout(
() => {
if (running) _checkProgress();
},
Math.max(0, minDelay - timeSpent)
);
};
_checkProgress();
@ -1838,8 +1841,8 @@ const dreamTool = () =>
state.cursorSize > stableDiffusionData.width
? "#FBB5"
: state.cursorSize < stableDiffusionData.width
? "#BFB5"
: "#FFF5";
? "#BFB5"
: "#FFF5";
state.erasePrevReticle = _tool._reticle_draw(
bb,
@ -1866,8 +1869,8 @@ const dreamTool = () =>
state.cursorSize > stableDiffusionData.width
? "#FBB5"
: state.cursorSize < stableDiffusionData.width
? "#BFB5"
: "#FFF5";
? "#BFB5"
: "#FFF5";
state.erasePrevReticle = _tool._reticle_draw(
getBoundingBox(
evn.x,
@ -2012,12 +2015,12 @@ const dreamTool = () =>
state.ctxmenu.keepUnmaskedBlurSlider.classList.remove(
"invisible"
);
state.ctxmenu.keepUnmaskedBlurSliderLinebreak.classList.add(
state.ctxmenu.keepUnmaskedBlurSliderLinebreak.classList.remove(
"invisible"
);
} else {
state.ctxmenu.keepUnmaskedBlurSlider.classList.add("invisible");
state.ctxmenu.keepUnmaskedBlurSliderLinebreak.classList.remove(
state.ctxmenu.keepUnmaskedBlurSliderLinebreak.classList.add(
"invisible"
);
}
@ -2181,6 +2184,20 @@ const dreamTool = () =>
menu.appendChild(state.ctxmenu.outpaintTypeSelect);
menu.appendChild(state.ctxmenu.overMaskPxLabel);
menu.appendChild(state.ctxmenu.eagerGenerateCountLabel);
if (localStorage.getItem("openoutpaint/dream-keepunmasked") == "true") {
state.ctxmenu.keepUnmaskedBlurSlider.classList.remove("invisible");
} else {
state.ctxmenu.keepUnmaskedBlurSlider.classList.add("invisible");
}
if (localStorage.getItem("openoutpaint/dream-removebg") == "true") {
state.ctxmenu.carveBlurSlider.classList.remove("invisible");
state.ctxmenu.carveThresholdSlider.classList.remove("invisible");
} else {
state.ctxmenu.carveBlurSlider.classList.add("invisible");
state.ctxmenu.carveThresholdSlider.classList.add("invisible");
}
},
shortcut: "D",
}
@ -2368,8 +2385,8 @@ const img2imgTool = () =>
state.cursorSize > stableDiffusionData.width
? "#FBB5"
: state.cursorSize < stableDiffusionData.width
? "#BFB5"
: "#FFF5";
? "#BFB5"
: "#FFF5";
state.erasePrevReticle = _tool._reticle_draw(
bb,
"Img2Img",
@ -2406,8 +2423,8 @@ const img2imgTool = () =>
state.cursorSize > stableDiffusionData.width
? "#FBB5"
: state.cursorSize < stableDiffusionData.width
? "#BFB5"
: "#FFF5";
? "#BFB5"
: "#FFF5";
state.erasePrevReticle = _tool._reticle_draw(
bb,
"Img2Img",
@ -2845,6 +2862,22 @@ const img2imgTool = () =>
menu.appendChild(btnArray2);
menu.appendChild(state.ctxmenu.borderMaskSlider);
menu.appendChild(state.ctxmenu.eagerGenerateCountLabel);
if (
localStorage.getItem("openoutpaint/img2img-keepunmasked") == "true"
) {
state.ctxmenu.keepUnmaskedBlurSlider.classList.remove("invisible");
} else {
state.ctxmenu.keepUnmaskedBlurSlider.classList.add("invisible");
}
if (localStorage.getItem("openoutpaint/img2img-removebg") == "true") {
state.ctxmenu.carveBlurSlider.classList.remove("invisible");
state.ctxmenu.carveThresholdSlider.classList.remove("invisible");
} else {
state.ctxmenu.carveBlurSlider.classList.add("invisible");
state.ctxmenu.carveThresholdSlider.classList.add("invisible");
}
},
shortcut: "I",
}

4
js/ui/tool/select.js
View file

@ -420,7 +420,7 @@ const selectTransformTool = () =>
const lscursor = m.transformPoint({x: sx, y: sy});
const xs = lscursor.x / scaling.handle.x;
const xy = lscursor.y / scaling.handle.y;
const ys = lscursor.y / scaling.handle.y;
let xscale = 1;
let yscale = 1;
@ -429,7 +429,7 @@ const selectTransformTool = () =>
xscale = xs;
yscale = ys;
} else {
xscale = yscale = Math.max(xs, xy);
xscale = yscale = Math.max(xs, ys);
}
state.selected.scale = {x: xscale, y: yscale};

27
js/ui/tool/stamp.js
View file

@ -284,6 +284,32 @@ const stampTool = () =>
saveButton.appendChild(document.createElement("div"));
saveButton.classList.add("download-btn");
const upscaleButton = document.createElement("button");
upscaleButton.addEventListener(
"click",
(evn) => {
evn.stopPropagation();
const canvas = document.createElement("canvas");
canvas.width = resource.image.width;
canvas.height = resource.image.height;
canvas.getContext("2d").drawImage(resource.image, 0, 0);
console.log("[Stamp]", canvas);
upscaleAndDownload(false, true, canvas);
/*
downloadCanvas({
canvas,
filename: `openOutpaint - resource '${resource.name}'.png`,
});
*/
},
{passive: false}
);
upscaleButton.title = "Upscale Resource";
upscaleButton.appendChild(document.createElement("div"));
upscaleButton.classList.add("upscale-btn");
const trashButton = document.createElement("button");
trashButton.addEventListener(
"click",
@ -300,6 +326,7 @@ const stampTool = () =>
actionArray.appendChild(saveButton);
actionArray.appendChild(trashButton);
actionArray.appendChild(upscaleButton);
resourceWrapper.appendChild(actionArray);
state.ctxmenu.resourceList.appendChild(resourceWrapper);
resource.dom = {wrapper: resourceWrapper};

8
pages/configuration.html
View file

@ -10,7 +10,7 @@
<link href="../css/index.css?v=cf6b502" rel="stylesheet" />
<link href="../css/layers.css?v=92c0352" rel="stylesheet" />
<link href="../css/ui/generic.css?v=30837f8" rel="stylesheet" />
<link href="../css/ui/generic.css?v=ed024fe" rel="stylesheet" />
<link href="../css/ui/history.css?v=0b03861" rel="stylesheet" />
<link href="../css/ui/layers.css?v=1d66c2b" rel="stylesheet" />
@ -258,7 +258,8 @@
? true
: localStorage.getItem(
"openoutpaint/settings.update-prompt-on-more-button"
) === "true";
) === "true";
updatePromptOnMoreButton.checked = _enable_update_prompt_on_more_button;
let _enable_jump_to_1st_new_on_more_button =
localStorage.getItem(
@ -267,7 +268,8 @@
? true
: localStorage.getItem(
"openoutpaint/settings.jump-to-1st-new-on-more-button"
) === "true";
) === "true";
jumpTo1stNewOnMoreButton.checked = _enable_jump_to_1st_new_on_more_button;
writeToLocalStorage();