1580158
/
stable-diffusion-webui-state
mirror of https://github.com/ilian6806/stable-diffusion-webui-state.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

New selects and multiple selects handled

pull/15/head
ilian.iliev 2023-04-01 19:31:02 +03:00
parent 8b36981a64
commit ade184a6c7
3 changed files with 84 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
javascript/state.core.js
View File

@ -215,86 +215,13 @@ state.core = (function () {
}
function handleSavedSelects(id) {
const select = gradioApp().getElementById(`${id}`);
try {
let value = store.get(id);
if (value) {
let input = select.querySelector('input');
state.utils.triggerMouseEvent(input, 'focus');
setTimeout(() => {
let items = Array.from(select.querySelectorAll('ul li'));
items.forEach(li => {
console.log(li.lastChild.wholeText.trim())
if (li.lastChild.wholeText.trim() === value) {
state.utils.triggerMouseEvent(li, 'mousedown');
return false;
}
});
state.utils.triggerMouseEvent(input, 'blur');
}, 100);
}
state.utils.onContentChange(select, function (el) {
const selected = el.querySelector('span.single-select');
if (selected) {
store.set(id, selected.textContent);
}
});
} catch (error) {
console.error('[state]: Error:', error);
}
state.utils.handleSelect(select, id, store);
}
function handleSavedMultiSelects(id) {
const select = gradioApp().getElementById(`${id}`);
try {
let value = store.get(id);
if (value) {
value = value.split(',');
if (value.length) {
let input = select.querySelector('input');
let selectOption = function () {
if (! value.length) {
state.utils.triggerMouseEvent(input, 'blur');
return;
}
let option = value.pop();
state.utils.triggerMouseEvent(input, 'focus');
setTimeout(() => {
let items = Array.from(select.querySelectorAll('ul li'));
items.forEach(li => {
if (li.lastChild.wholeText.trim() === option) {
state.utils.triggerMouseEvent(li, 'mousedown');
return false;
}
});
setTimeout(selectOption, 100);
}, 100);
}
selectOption();
}
}
state.utils.onContentChange(select, function (el) {
const selected = Array.from(el.querySelectorAll('.token > span')).map(item => item.textContent);
store.set(id, selected);
});
} catch (error) {
console.error('[state]: Error:', error);
}
state.utils.handleMultipleSelect(select, id, store);
}
function handleExtensions(config) {

15
javascript/state.ext.control-net.js
View File

@ -69,18 +69,11 @@ state.extensions['control-net'] = (function () {
function handleSelects() {
cnTabs.forEach(({ container, store }) => {
let selects = container.querySelectorAll('select');
selects.forEach(function (select) {
let label = select.previousElementSibling;
let id = state.utils.txtToId(label.textContent);
container.querySelectorAll('.gradio-dropdown').forEach(select => {
let id = state.utils.txtToId(select.querySelector('label').firstChild.textContent);
let value = store.get(id);
if (value) {
state.utils.setValue(select, value, 'change');
}
select.addEventListener('change', function () {
store.set(id, this.value);
});
if (id === 'preprocessor' && value && value !== 'none') {
state.utils.handleSelect(select, id, store);
if (id === 'preprocessor' && value && value.toLowerCase() !== 'none') {
state.utils.onNextUiUpdates(handleSliders); // update new sliders if needed
}
});

79
javascript/state.utils.js
View File

@ -54,6 +54,83 @@ state.utils = {
subtree: true
});
},
handleSelect: function handleSelect(select, id, store) {
try {
let value = store.get(id);
if (value) {
let input = select.querySelector('input');
state.utils.triggerMouseEvent(input, 'focus');
setTimeout(() => {
let items = Array.from(select.querySelectorAll('ul li'));
items.forEach(li => {
if (li.lastChild.wholeText.trim() === value) {
state.utils.triggerMouseEvent(li, 'mousedown');
return false;
}
});
state.utils.triggerMouseEvent(input, 'blur');
}, 100);
}
setTimeout(() => {
state.utils.onContentChange(select, function (el) {
const selected = el.querySelector('span.single-select');
if (selected) {
store.set(id, selected.textContent);
}
});
}, 150);
} catch (error) {
console.error('[state]: Error:', error);
}
},
handleMultipleSelect: function handleMultipleSelect(select, id, store) {
try {
let value = store.get(id);
if (value) {
value = value.split(',').reverse();
if (value.length) {
let input = select.querySelector('input');
let selectOption = function () {
if (! value.length) {
state.utils.triggerMouseEvent(input, 'blur');
return;
}
let option = value.pop();
state.utils.triggerMouseEvent(input, 'focus');
setTimeout(() => {
let items = Array.from(select.querySelectorAll('ul li'));
items.forEach(li => {
if (li.lastChild.wholeText.trim() === option) {
state.utils.triggerMouseEvent(li, 'mousedown');
return false;
}
});
setTimeout(selectOption, 100);
}, 100);
}
selectOption();
}
}
state.utils.onContentChange(select, function (el) {
const selected = Array.from(el.querySelectorAll('.token > span')).map(item => item.textContent);
store.set(id, selected);
});
} catch (error) {
console.error('[state]: Error:', error);
}
},
txtToId: function txtToId(txt) {
return txt.split(' ').join('-').toLowerCase();
},
@ -78,7 +155,7 @@ state.utils = {
},
onNextUiUpdates: function (func) {
// brute force this to to ensure that the method is called after next few updates
onUiUpdate(this.callXTimes(function () { setTimeout(func, 10); }, 50));
onUiUpdate(this.callXTimes(function () { setTimeout(func, 5); }, 150));
}
};