no recreating div

Signed-off-by: Victor Seiji Hariki <victorseijih@gmail.com>
This commit is contained in:
Victor Seiji Hariki 2023-01-14 20:08:02 -03:00
parent 52c6f0608a
commit 28988f84bb
3 changed files with 32 additions and 53 deletions

View file

@ -83,7 +83,7 @@
Stable Diffusion settings Stable Diffusion settings
</button> </button>
<div class="content"> <div class="content">
<button id="refreshModelsBtn" onclick="refreshModels()">🔄</button> <button id="refreshModelsBtn" onclick="getModels(true)">🔄</button>
<label>Model:</label> <label>Model:</label>
<div id="models-ac-select"></div> <div id="models-ac-select"></div>
<label>Sampler:</label> <label>Sampler:</label>
@ -349,7 +349,7 @@
<script src="js/lib/commands.js?v=bf23c83" type="text/javascript"></script> <script src="js/lib/commands.js?v=bf23c83" type="text/javascript"></script>
<script src="js/lib/toolbar.js?v=306d637" type="text/javascript"></script> <script src="js/lib/toolbar.js?v=306d637" type="text/javascript"></script>
<script src="js/lib/ui.js?v=76ede2b" type="text/javascript"></script> <script src="js/lib/ui.js?v=5e14f7e" type="text/javascript"></script>
<script <script
src="js/initalize/layers.populate.js?v=39785ac" src="js/initalize/layers.populate.js?v=39785ac"
@ -360,7 +360,7 @@
<!-- Content --> <!-- Content -->
<script src="js/prompt.js?v=7a1c68c" type="text/javascript"></script> <script src="js/prompt.js?v=7a1c68c" type="text/javascript"></script>
<script src="js/index.js?v=531781d" type="text/javascript"></script> <script src="js/index.js?v=77f3c91" type="text/javascript"></script>
<script <script
src="js/ui/floating/history.js?v=fc92d14" src="js/ui/floating/history.js?v=fc92d14"

View file

@ -956,29 +956,7 @@ async function getUpscalers() {
*/ */
} }
async function refreshModels() { async function getModels(refresh = false) {
var original = document.getElementById("models-ac-select");
var newdiv = document.createElement("div");
newdiv.id = "models-ac-select";
original.replaceWith(newdiv);
modelAutoComplete = createAutoComplete(
"Model",
document.getElementById("models-ac-select")
);
modelAutoComplete.onchange.on(({value}) => {
if (value.toLowerCase().includes("inpainting"))
document.querySelector(
"#models-ac-select input.autocomplete-text"
).style.backgroundColor = "#cfc";
else
document.querySelector(
"#models-ac-select input.autocomplete-text"
).style.backgroundColor = "#fcc";
});
getModels();
}
async function getModels() {
const url = document.getElementById("host").value + "/sdapi/v1/sd-models"; const url = document.getElementById("host").value + "/sdapi/v1/sd-models";
let opt = null; let opt = null;
@ -1005,7 +983,7 @@ async function getModels() {
const model = optData.sd_model_checkpoint; const model = optData.sd_model_checkpoint;
console.log("Current model: " + model); console.log("Current model: " + model);
modelAutoComplete.value = model; if (modelAutoComplete.value !== model) modelAutoComplete.value = model;
} catch (e) { } catch (e) {
console.warn("[index] Failed to fetch current model:"); console.warn("[index] Failed to fetch current model:");
console.warn(e); console.warn(e);
@ -1015,31 +993,32 @@ async function getModels() {
console.warn(e); console.warn(e);
} }
modelAutoComplete.onchange.on(async ({value}) => { if (!refresh)
console.log(`[index] Changing model to [${value}]`); modelAutoComplete.onchange.on(async ({value}) => {
const payload = { console.log(`[index] Changing model to [${value}]`);
sd_model_checkpoint: value, const payload = {
}; sd_model_checkpoint: value,
const url = document.getElementById("host").value + "/sdapi/v1/options/"; };
try { const url = document.getElementById("host").value + "/sdapi/v1/options/";
await fetch(url, { try {
method: "POST", await fetch(url, {
headers: { method: "POST",
"Content-Type": "application/json", headers: {
}, "Content-Type": "application/json",
body: JSON.stringify(payload), },
}); body: JSON.stringify(payload),
});
alert(`Model changed to [${value}]`); alert(`Model changed to [${value}]`);
} catch (e) { } catch (e) {
console.warn("[index] Error changing model"); console.warn("[index] Error changing model");
console.warn(e); console.warn(e);
alert( alert(
"Error changing model, please check console for additional information" "Error changing model, please check console for additional information"
); );
} }
}); });
// If first time running, ask if user wants to switch to an inpainting model // If first time running, ask if user wants to switch to an inpainting model
if (global.firstRun && !modelAutoComplete.value.includes("inpainting")) { if (global.firstRun && !modelAutoComplete.value.includes("inpainting")) {

View file

@ -304,7 +304,7 @@ function createAutoComplete(name, wrapper, options = {}) {
autocompleteEl.appendChild(optionEl); autocompleteEl.appendChild(optionEl);
}); });
updateOptions(); updateOptions("");
}, },
}; };
@ -317,8 +317,8 @@ function createAutoComplete(name, wrapper, options = {}) {
.join(", "); .join(", ");
} }
function updateOptions() { function updateOptions(value = null) {
const text = inputEl.value.toLowerCase().trim(); text = value ?? inputEl.value.toLowerCase().trim();
acobj._options.forEach((opt) => { acobj._options.forEach((opt) => {
const textLocation = opt.name.toLowerCase().indexOf(text); const textLocation = opt.name.toLowerCase().indexOf(text);