Merge branch 'main' into testing
# Conflicts: # index.html
This commit is contained in:
commit
6017b60e9c
7 changed files with 139 additions and 40 deletions
|
@ -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
20
index.html
|
@ -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>
|
||||
|
|
40
js/index.js
40
js/index.js
|
@ -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,7 +1446,13 @@ async function upscaleAndDownload() {
|
|||
? localStorage.getItem("openoutpaint/upscale_x")
|
||||
: 2;
|
||||
var upscaler = upscalerAutoComplete.value;
|
||||
var croppedCanvas = cropCanvas(
|
||||
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,
|
||||
|
@ -1446,10 +1460,16 @@ async function upscaleAndDownload() {
|
|||
h: imageCollection.size.h,
|
||||
})
|
||||
);
|
||||
if (croppedCanvas != null) {
|
||||
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"];
|
||||
|
||||
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();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -62,9 +62,12 @@ const _monitorProgress = (bb, oncheck = null) => {
|
|||
}
|
||||
|
||||
const timeSpent = performance.now() - init;
|
||||
setTimeout(() => {
|
||||
setTimeout(
|
||||
() => {
|
||||
if (running) _checkProgress();
|
||||
}, Math.max(0, minDelay - timeSpent));
|
||||
},
|
||||
Math.max(0, minDelay - timeSpent)
|
||||
);
|
||||
};
|
||||
|
||||
_checkProgress();
|
||||
|
@ -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",
|
||||
}
|
||||
|
@ -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",
|
||||
}
|
||||
|
|
|
@ -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};
|
||||
|
|
|
@ -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};
|
||||
|
|
|
@ -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" />
|
||||
|
@ -259,6 +259,7 @@
|
|||
: localStorage.getItem(
|
||||
"openoutpaint/settings.update-prompt-on-more-button"
|
||||
) === "true";
|
||||
updatePromptOnMoreButton.checked = _enable_update_prompt_on_more_button;
|
||||
|
||||
let _enable_jump_to_1st_new_on_more_button =
|
||||
localStorage.getItem(
|
||||
|
@ -268,6 +269,7 @@
|
|||
: localStorage.getItem(
|
||||
"openoutpaint/settings.jump-to-1st-new-on-more-button"
|
||||
) === "true";
|
||||
jumpTo1stNewOnMoreButton.checked = _enable_jump_to_1st_new_on_more_button;
|
||||
|
||||
writeToLocalStorage();
|
||||
|
||||
|
|
Loading…
Reference in a new issue