refiner UI

//TODO wire it up and make it work, simple 2 extra keys in API call
This commit is contained in:
tim h 2023-08-25 14:44:12 -05:00
parent 4fa410e206
commit 45a3ce1de6
2 changed files with 57 additions and 2 deletions

View file

@ -1,4 +1,4 @@
<!doctype html>
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8" />
@ -149,6 +149,25 @@
<br />
<label>Lora:</label>
<div id="lora-ac-select"></div>
<input
type="checkbox"
id="cbxRefiner"
onchange="changeRefinerEnabled()" />
<label for="cbxRefiner">Enable Refiner</label>
<br />
<label id="refinerModelLabel" class="refiner">Refiner Model</label>
<div id="refiner-ac-select" class="refiner"></div>
<!-- <button
id="refreshRefinersBtn"
class="refiner"
onclick="getModels(true)">
<img
class="refreshbutton"
src="./res/icons/refresh-cw.svg?v=f627140"
alt="refresh refiner models"
title="refresh refiner models" />
</button> -->
<div id="refinerChangeAt" class="refiner"></div>
<input type="checkbox" id="cbxHRFix" onchange="changeHiResFix()" />
<label for="cbxHRFix">Apply Txt2Img HRfix</label>
<br />

View file

@ -167,6 +167,7 @@ function startup() {
changeMaskBlur();
changeSmoothRendering();
changeSeed();
changeRefinerEnabled();
changeHiResFix();
changeHiResSquare();
changeRestoreFaces();
@ -654,6 +655,11 @@ modelAutoComplete.onchange.on(({value}) => {
).style.backgroundColor = "#fcc";
});
let refinerAutoComplete = createAutoComplete(
"Refiner",
document.getElementById("refiner-ac-select")
);
let loraAutoComplete = createAutoComplete(
"LoRa",
document.getElementById("lora-ac-select")
@ -736,6 +742,17 @@ const resSlider = makeSlider(
}
);
const refinerSlider = makeSlider(
"Refiner Change At",
document.getElementById("refinerChangeAt"),
"refiner_change_at",
0.0,
1.0,
0.1,
0.8,
0.01
);
const refSlider = makeSlider(
"Reference Fidelity",
document.getElementById("controlNetReferenceFidelity"),
@ -906,6 +923,25 @@ function changeControlNetReference() {
}
}
function changeRefinerEnabled() {
stableDiffusionData.enable_refiner = Boolean(
document.getElementById("cbxRefiner").checked
);
localStorage.setItem(
"openoutpaint/enable_refiner",
stableDiffusionData.enable_refiner
);
if (stableDiffusionData.enable_refiner) {
document
.querySelectorAll(".refiner")
.forEach((el) => el.classList.remove("invisible"));
} else {
document
.querySelectorAll(".refiner")
.forEach((el) => el.classList.add("invisible"));
}
}
function changeHiResFix() {
stableDiffusionData.enable_hr = Boolean(
document.getElementById("cbxHRFix").checked
@ -1164,7 +1200,7 @@ async function getModels(refresh = false) {
},
}));
modelAutoComplete.options = opt;
refinerAutoComplete.options = modelAutoComplete.options = opt;
try {
const optResponse = await fetch(