WIP really remedial attempts at getting user-savable scripts happening
computer crashing sigh
This commit is contained in:
tim h
parent
769182508f
commit
0e54435f4c
4 changed files with 114 additions and 41 deletions
15
index.html
15
index.html
|
|
@ -371,9 +371,16 @@
|
|||
<div class="menu-container" style="min-width: 200px">
|
||||
<div id="script-select" class="script-select">
|
||||
<select id="script-selector" onchange="changeScript(event)">
|
||||
<option id="no_selected_script" value="">Select a script...</option>
|
||||
<option id="custom" value="custom">Other</option>
|
||||
<!-- <option id="no_selected_script" value="">Select a script...</option>
|
||||
<option id="custom" value="custom">Custom</option> -->
|
||||
</select>
|
||||
<button
|
||||
id="save-custom-script"
|
||||
disabled="disabled"
|
||||
title="Save custom script"
|
||||
onclick="saveCustomScript()">
|
||||
<image src="./res/icons/save.svg" width="60%"></image>
|
||||
</button>
|
||||
</div>
|
||||
<div id="script-name" class="script-name">
|
||||
<label for="script-name-input">Script Name:</label>
|
||||
|
|
@ -451,7 +458,7 @@
|
|||
|
||||
<!-- Content -->
|
||||
<script src="js/prompt.js?v=7a1c68c" type="text/javascript"></script>
|
||||
<script src="js/index.js?v=c9b95ae" type="text/javascript"></script>
|
||||
<script src="js/index.js?v=ef5a869" type="text/javascript"></script>
|
||||
|
||||
<script
|
||||
src="js/ui/floating/history.js?v=4f29db4"
|
||||
|
|
@ -465,7 +472,7 @@
|
|||
src="js/ui/tool/generic.js?v=3e678e0"
|
||||
type="text/javascript"></script>
|
||||
|
||||
<script src="js/ui/tool/dream.js?v=00fdfe4" type="text/javascript"></script>
|
||||
<script src="js/ui/tool/dream.js?v=5330f89" type="text/javascript"></script>
|
||||
<script
|
||||
src="js/ui/tool/maskbrush.js?v=e9bd0eb"
|
||||
type="text/javascript"></script>
|
||||
|
|
|
|||
72
js/index.js
72
js/index.js
|
|
@ -145,6 +145,7 @@ var url = "/sdapi/v1/";
|
|||
const basePixelCount = 64; //64 px - ALWAYS 64 PX
|
||||
var focused = true;
|
||||
let defaultScripts = {};
|
||||
let userScripts = {};
|
||||
|
||||
function startup() {
|
||||
testHostConfiguration();
|
||||
|
|
@ -171,7 +172,7 @@ function startup() {
|
|||
changeRestoreFaces();
|
||||
changeSyncCursorSize();
|
||||
checkFocus();
|
||||
loadDefaultScripts();
|
||||
refreshScripts();
|
||||
}
|
||||
|
||||
function setFixedHost(h, changePromptMessage) {
|
||||
|
|
@ -1400,6 +1401,28 @@ function checkFocus() {
|
|||
}
|
||||
}
|
||||
|
||||
function refreshScripts() {
|
||||
selector = document.getElementById("script-selector");
|
||||
selector.innerHTML = "";
|
||||
createBaseScriptOptions();
|
||||
loadDefaultScripts();
|
||||
loadUserScripts();
|
||||
}
|
||||
|
||||
function createBaseScriptOptions() {
|
||||
selector = document.getElementById("script-selector");
|
||||
var noScript = document.createElement("option");
|
||||
noScript.id = "no_selected_script";
|
||||
noScript.value = "";
|
||||
noScript.innerHTML = "Select a script...";
|
||||
selector.appendChild(noScript);
|
||||
var customScript = document.createElement("option");
|
||||
customScript.id = "custom";
|
||||
customScript.value = "custom";
|
||||
customScript.innerHTML = "Custom";
|
||||
selector.appendChild(customScript);
|
||||
}
|
||||
|
||||
async function loadDefaultScripts() {
|
||||
selector = document.getElementById("script-selector");
|
||||
const response = await fetch("./defaultscripts.json");
|
||||
|
|
@ -1413,17 +1436,33 @@ async function loadDefaultScripts() {
|
|||
//return json;
|
||||
}
|
||||
|
||||
function changeScript(evt) {
|
||||
async function loadUserScripts() {
|
||||
selector = document.getElementById("script-selector");
|
||||
const response = await fetch("./userdefinedscripts.json");
|
||||
const json = await response.json();
|
||||
for (const key in json.userScripts) {
|
||||
var opt = document.createElement("option");
|
||||
opt.value = opt.innerHTML = key;
|
||||
selector.appendChild(opt);
|
||||
}
|
||||
userScripts = json;
|
||||
}
|
||||
|
||||
function changeScript(event) {
|
||||
let enable = () => {
|
||||
scriptName.disabled = false;
|
||||
saveScriptButton.disabled = false;
|
||||
};
|
||||
let disable = () => {
|
||||
scriptName.disabled = true;
|
||||
saveScriptButton.disabled = true;
|
||||
};
|
||||
let selected = evt.target.value;
|
||||
let selected = event.target.value;
|
||||
let scriptName = document.getElementById("script-name-input");
|
||||
let scriptArgs = document.getElementById("script-args-input");
|
||||
let saveScriptButton = document.getElementById("save-custom-script");
|
||||
scriptName.value = selected;
|
||||
scriptArgs.title = "";
|
||||
disable();
|
||||
switch (selected) {
|
||||
case "custom": {
|
||||
|
|
@ -1436,21 +1475,38 @@ function changeScript(evt) {
|
|||
case "": {
|
||||
// specifically no selected script
|
||||
scriptArgs.value = "";
|
||||
scriptArgs.title = "";
|
||||
break;
|
||||
}
|
||||
default: {
|
||||
// check defaultScripts objects for selected script
|
||||
scriptName.value = selected;
|
||||
scriptArgs.value = defaultScripts.defaultScripts[selected].scriptValues;
|
||||
scriptArgs.title = defaultScripts.defaultScripts[selected].titleText;
|
||||
// check default scripts for selected script
|
||||
if (selected in defaultScripts.defaultScripts) {
|
||||
scriptArgs.value = defaultScripts.defaultScripts[selected].scriptValues;
|
||||
scriptArgs.title = defaultScripts.defaultScripts[selected].titleText;
|
||||
}
|
||||
// if not found, check user scripts
|
||||
|
||||
// TODO yknow what check userscripts first; if customizations have been made load those instead of defaults, i'm too stupid to do that right now
|
||||
else if (selected in userScripts.userScripts) {
|
||||
scriptArgs.value = userScripts.userScripts[selected].scriptValues;
|
||||
enable();
|
||||
}
|
||||
// if not found, wtf
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async function saveCustomScript() {
|
||||
let selector = document.getElementById("script-name-input");
|
||||
let selected = selector.value;
|
||||
let args = document.getElementById("script-args-input").value;
|
||||
if (selected.trim() != "") {
|
||||
if (selected in userScripts.userScripts) {
|
||||
userScripts.userScripts[selected].scriptValues = args;
|
||||
} else {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function togglePix2PixImgCfg(value) {
|
||||
// super hacky
|
||||
// actually doesn't work at all yet so i'm leaving it here to taunt and remind me of my failures
|
||||
|
|
|
|||
|
|
@ -1449,6 +1449,8 @@ const dreamTool = () =>
|
|||
state.overMaskPx = 20;
|
||||
state.preserveMasks = false;
|
||||
state.eagerGenerateCount = 0;
|
||||
state.carve_blur = 0;
|
||||
state.carve_threshold = 10;
|
||||
|
||||
state.carve_blur = 0;
|
||||
state.carve_threshold = 10;
|
||||
|
|
@ -1700,7 +1702,7 @@ const dreamTool = () =>
|
|||
}
|
||||
).checkbox;
|
||||
|
||||
// Keep Masked Content Checkbox
|
||||
// Keep Unmasked Content Checkbox
|
||||
state.ctxmenu.keepUnmaskedLabel = _toolbar_input.checkbox(
|
||||
state,
|
||||
"openoutpaint/dream-keepunmasked",
|
||||
|
|
@ -1724,7 +1726,7 @@ const dreamTool = () =>
|
|||
}
|
||||
).checkbox;
|
||||
|
||||
// Keep Masked Content Blur Slider
|
||||
// Keep Unmasked Content Blur Slider
|
||||
state.ctxmenu.keepUnmaskedBlurSlider = _toolbar_input.slider(
|
||||
state,
|
||||
"openoutpaint/dream-keepunmaskedblur",
|
||||
|
|
@ -1780,11 +1782,13 @@ const dreamTool = () =>
|
|||
"icon-slice",
|
||||
() => {
|
||||
if (state.removeBackground) {
|
||||
state.ctxmenu.carveBlurLabel.classList.remove("invisible");
|
||||
state.ctxmenu.carveThresholdLabel.classList.remove("invisible");
|
||||
state.ctxmenu.carveBlurSlider.classList.remove("invisible");
|
||||
state.ctxmenu.carveThresholdSlider.classList.remove(
|
||||
"invisible"
|
||||
);
|
||||
} else {
|
||||
state.ctxmenu.carveBlurLabel.classList.add("invisible");
|
||||
state.ctxmenu.carveThresholdLabel.classList.add("invisible");
|
||||
state.ctxmenu.carveBlurSlider.classList.add("invisible");
|
||||
state.ctxmenu.carveThresholdSlider.classList.add("invisible");
|
||||
}
|
||||
}
|
||||
).checkbox;
|
||||
|
|
@ -1817,7 +1821,7 @@ const dreamTool = () =>
|
|||
}
|
||||
).slider;
|
||||
// bg carve blur
|
||||
state.ctxmenu.carveBlurLabel = _toolbar_input.slider(
|
||||
state.ctxmenu.carveBlurSlider = _toolbar_input.slider(
|
||||
state,
|
||||
"openoutpaint/dream-carveblur",
|
||||
"carve_blur",
|
||||
|
|
@ -1829,9 +1833,9 @@ const dreamTool = () =>
|
|||
textStep: 1,
|
||||
}
|
||||
).slider;
|
||||
state.ctxmenu.carveBlurLabel.classList.add("invisible");
|
||||
state.ctxmenu.carveBlurSlider.classList.add("invisible");
|
||||
// bg carve threshold
|
||||
state.ctxmenu.carveThresholdLabel = _toolbar_input.slider(
|
||||
state.ctxmenu.carveThresholdSlider = _toolbar_input.slider(
|
||||
state,
|
||||
"openoutpaint/dream-carvethreshold",
|
||||
"carve_threshold",
|
||||
|
|
@ -1843,7 +1847,7 @@ const dreamTool = () =>
|
|||
textStep: 1,
|
||||
}
|
||||
).slider;
|
||||
state.ctxmenu.carveThresholdLabel.classList.add("invisible");
|
||||
state.ctxmenu.carveThresholdSlider.classList.add("invisible");
|
||||
}
|
||||
|
||||
menu.appendChild(state.ctxmenu.cursorSizeSlider);
|
||||
|
|
@ -1854,12 +1858,12 @@ const dreamTool = () =>
|
|||
array.appendChild(state.ctxmenu.invertMaskLabel);
|
||||
array.appendChild(state.ctxmenu.preserveMasksLabel);
|
||||
//menu.appendChild(document.createElement("br"));
|
||||
array.appendChild(state.ctxmenu.removeBackgroundLabel);
|
||||
array.appendChild(state.ctxmenu.keepUnmaskedLabel);
|
||||
array.appendChild(state.ctxmenu.removeBackgroundLabel);
|
||||
menu.appendChild(array);
|
||||
menu.appendChild(state.ctxmenu.carveBlurLabel);
|
||||
menu.appendChild(state.ctxmenu.carveThresholdLabel);
|
||||
menu.appendChild(state.ctxmenu.keepUnmaskedBlurSlider);
|
||||
menu.appendChild(state.ctxmenu.carveBlurSlider);
|
||||
menu.appendChild(state.ctxmenu.carveThresholdSlider);
|
||||
// menu.appendChild(state.ctxmenu.keepUnmaskedBlurSliderLinebreak);
|
||||
// menu.appendChild(state.ctxmenu.preserveMasksLabel);
|
||||
// menu.appendChild(document.createElement("br"));
|
||||
|
|
@ -1951,6 +1955,8 @@ const img2imgTool = () =>
|
|||
state.fullResolution = false;
|
||||
state.preserveMasks = false;
|
||||
state.eagerGenerateCount = 0;
|
||||
state.carve_blur = 0;
|
||||
state.carve_threshold = 10;
|
||||
|
||||
state.denoisingStrength = 0.7;
|
||||
|
||||
|
|
@ -2306,7 +2312,7 @@ const img2imgTool = () =>
|
|||
}
|
||||
).checkbox;
|
||||
|
||||
// Keep Masked Content Checkbox
|
||||
// Keep Unmasked Content Checkbox
|
||||
state.ctxmenu.keepUnmaskedLabel = _toolbar_input.checkbox(
|
||||
state,
|
||||
"openoutpaint/img2img-keepunmasked",
|
||||
|
|
@ -2330,7 +2336,7 @@ const img2imgTool = () =>
|
|||
}
|
||||
).checkbox;
|
||||
|
||||
// Keep Masked Content Blur Slider
|
||||
// Keep Unmasked Content Blur Slider
|
||||
state.ctxmenu.keepUnmaskedBlurSlider = _toolbar_input.slider(
|
||||
state,
|
||||
"openoutpaint/img2img-unmaskedblur",
|
||||
|
|
@ -2400,11 +2406,13 @@ const img2imgTool = () =>
|
|||
"icon-slice",
|
||||
() => {
|
||||
if (state.removeBackground) {
|
||||
state.ctxmenu.carveBlurLabel.classList.remove("invisible");
|
||||
state.ctxmenu.carveThresholdLabel.classList.remove("invisible");
|
||||
state.ctxmenu.carveBlurSlider.classList.remove("invisible");
|
||||
state.ctxmenu.carveThresholdSlider.classList.remove(
|
||||
"invisible"
|
||||
);
|
||||
} else {
|
||||
state.ctxmenu.carveBlurLabel.classList.add("invisible");
|
||||
state.ctxmenu.carveThresholdLabel.classList.add("invisible");
|
||||
state.ctxmenu.carveBlurSlider.classList.add("invisible");
|
||||
state.ctxmenu.carveThresholdSlider.classList.add("invisible");
|
||||
}
|
||||
}
|
||||
).checkbox;
|
||||
|
|
@ -2473,7 +2481,7 @@ const img2imgTool = () =>
|
|||
);
|
||||
|
||||
// bg carve blur
|
||||
state.ctxmenu.carveBlurLabel = _toolbar_input.slider(
|
||||
state.ctxmenu.carveBlurSlider = _toolbar_input.slider(
|
||||
state,
|
||||
"openoutpaint/img2img-carveblur",
|
||||
"carve_blur",
|
||||
|
|
@ -2485,10 +2493,10 @@ const img2imgTool = () =>
|
|||
textStep: 1,
|
||||
}
|
||||
).slider;
|
||||
state.ctxmenu.carveBlurLabel.classList.add("invisible");
|
||||
state.ctxmenu.carveBlurSlider.classList.add("invisible");
|
||||
|
||||
// bg carve threshold
|
||||
state.ctxmenu.carveThresholdLabel = _toolbar_input.slider(
|
||||
state.ctxmenu.carveThresholdSlider = _toolbar_input.slider(
|
||||
state,
|
||||
"openoutpaint/img2img-carvethreshold",
|
||||
"carve_threshold",
|
||||
|
|
@ -2500,7 +2508,7 @@ const img2imgTool = () =>
|
|||
textStep: 1,
|
||||
}
|
||||
).slider;
|
||||
state.ctxmenu.carveThresholdLabel.classList.add("invisible");
|
||||
state.ctxmenu.carveThresholdSlider.classList.add("invisible");
|
||||
}
|
||||
|
||||
menu.appendChild(state.ctxmenu.cursorSizeSlider);
|
||||
|
|
@ -2509,12 +2517,12 @@ const img2imgTool = () =>
|
|||
array.appendChild(state.ctxmenu.snapToGridLabel);
|
||||
array.appendChild(state.ctxmenu.invertMaskLabel);
|
||||
array.appendChild(state.ctxmenu.preserveMasksLabel);
|
||||
array.appendChild(state.ctxmenu.removeBackgroundLabel);
|
||||
array.appendChild(state.ctxmenu.keepUnmaskedLabel);
|
||||
array.appendChild(state.ctxmenu.removeBackgroundLabel);
|
||||
menu.appendChild(array);
|
||||
menu.appendChild(state.ctxmenu.carveBlurLabel);
|
||||
menu.appendChild(state.ctxmenu.carveThresholdLabel);
|
||||
menu.appendChild(state.ctxmenu.keepUnmaskedBlurSlider);
|
||||
menu.appendChild(state.ctxmenu.carveBlurSlider);
|
||||
menu.appendChild(state.ctxmenu.carveThresholdSlider);
|
||||
// menu.appendChild(state.ctxmenu.keepUnmaskedBlurSliderLinebreak);
|
||||
menu.appendChild(state.ctxmenu.inpaintTypeSelect);
|
||||
menu.appendChild(state.ctxmenu.denoisingStrengthSlider);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
{
|
||||
"userScript1": {
|
||||
"title": "template",
|
||||
"scriptValues": "[1, 0.999, true, \"4-10 [3]\", \"test text\"]"
|
||||
"userScripts": {
|
||||
"testScript1": {
|
||||
"title": "template",
|
||||
"scriptValues": "[1, 0.999, true, \"4-10 [3]\", \"test text\"]"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue