StableDiffusion/WebUI
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Run eslint --fix (and normalize tabs to spaces)

Browse Source
This commit is contained in:
Aarni Koskela 2023-05-17 15:46:58 +03:00
parent 4f11f285f9
commit 9c54b78d9d
21 changed files with 1549 additions and 1507 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
extensions-builtin/prompt-bracket-checker/javascript/prompt-bracket-checker.js
View File

@ -27,7 +27,7 @@ function checkBrackets(textArea, counterElt) {
function setupBracketChecking(id_prompt, id_counter) {
var textarea = gradioApp().querySelector("#" + id_prompt + " > label > textarea");
var counter = gradioApp().getElementById(id_counter)
var counter = gradioApp().getElementById(id_counter);
if (textarea && counter) {
textarea.addEventListener("input", () => checkBrackets(textarea, counter));

54
javascript/aspectRatioOverlay.js
View File

@ -6,10 +6,10 @@ let arFrameTimeout = setTimeout(function(){},0);
function dimensionChange(e, is_width, is_height) {
if (is_width) {
currentWidth = e.target.value*1.0
currentWidth = e.target.value * 1.0;
}
if (is_height) {
currentHeight = e.target.value*1.0
currentHeight = e.target.value * 1.0;
}
var inImg2img = gradioApp().querySelector("#tab_img2img").style.display == "block";
@ -20,7 +20,7 @@ function dimensionChange(e, is_width, is_height){
var targetElement = null;
var tabIndex = get_tab_index('mode_img2img')
var tabIndex = get_tab_index('mode_img2img');
if (tabIndex == 0) { // img2img
targetElement = gradioApp().querySelector('#img2img_image div[data-testid=image] img');
} else if (tabIndex == 1) { //Sketch
@ -36,33 +36,33 @@ function dimensionChange(e, is_width, is_height){
var arPreviewRect = gradioApp().querySelector('#imageARPreview');
if (!arPreviewRect) {
arPreviewRect = document.createElement('div')
arPreviewRect = document.createElement('div');
arPreviewRect.id = "imageARPreview";
gradioApp().appendChild(arPreviewRect)
gradioApp().appendChild(arPreviewRect);
}
var viewportOffset = targetElement.getBoundingClientRect();
var viewportscale = Math.min( targetElement.clientWidth/targetElement.naturalWidth, targetElement.clientHeight/targetElement.naturalHeight )
var viewportscale = Math.min(targetElement.clientWidth / targetElement.naturalWidth, targetElement.clientHeight / targetElement.naturalHeight);
var scaledx = targetElement.naturalWidth*viewportscale
var scaledy = targetElement.naturalHeight*viewportscale
var scaledx = targetElement.naturalWidth * viewportscale;
var scaledy = targetElement.naturalHeight * viewportscale;
var cleintRectTop = (viewportOffset.top+window.scrollY)
var cleintRectLeft = (viewportOffset.left+window.scrollX)
var cleintRectCentreY = cleintRectTop + (targetElement.clientHeight/2)
var cleintRectCentreX = cleintRectLeft + (targetElement.clientWidth/2)
var cleintRectTop = (viewportOffset.top + window.scrollY);
var cleintRectLeft = (viewportOffset.left + window.scrollX);
var cleintRectCentreY = cleintRectTop + (targetElement.clientHeight / 2);
var cleintRectCentreX = cleintRectLeft + (targetElement.clientWidth / 2);
var arscale = Math.min( scaledx/currentWidth, scaledy/currentHeight )
var arscaledx = currentWidth*arscale
var arscaledy = currentHeight*arscale
var arscale = Math.min(scaledx / currentWidth, scaledy / currentHeight);
var arscaledx = currentWidth * arscale;
var arscaledy = currentHeight * arscale;
var arRectTop = cleintRectCentreY-(arscaledy/2)
var arRectLeft = cleintRectCentreX-(arscaledx/2)
var arRectWidth = arscaledx
var arRectHeight = arscaledy
var arRectTop = cleintRectCentreY - (arscaledy / 2);
var arRectLeft = cleintRectCentreX - (arscaledx / 2);
var arRectWidth = arscaledx;
var arRectHeight = arscaledy;
arPreviewRect.style.top = arRectTop + 'px';
arPreviewRect.style.left = arRectLeft + 'px';
@ -92,20 +92,22 @@ onUiUpdate(function(){
if (inImg2img) {
let inputs = gradioApp().querySelectorAll('input');
inputs.forEach(function(e) {
var is_width = e.parentElement.id == "img2img_width"
var is_height = e.parentElement.id == "img2img_height"
var is_width = e.parentElement.id == "img2img_width";
var is_height = e.parentElement.id == "img2img_height";
if ((is_width || is_height) && !e.classList.contains('scrollwatch')) {
e.addEventListener('input', function(e){dimensionChange(e, is_width, is_height)} )
e.classList.add('scrollwatch')
e.addEventListener('input', function(e) {
dimensionChange(e, is_width, is_height);
});
e.classList.add('scrollwatch');
}
if (is_width) {
currentWidth = e.value*1.0
currentWidth = e.value * 1.0;
}
if (is_height) {
currentHeight = e.value*1.0
currentHeight = e.value * 1.0;
}
})
});
}
}
});

108
javascript/contextMenus.js
View File

@ -5,44 +5,44 @@ contextMenuInit = function(){
const uid = function() {
return Date.now().toString(36) + Math.random().toString(36).substring(2);
}
};
function showContextMenu(event, element, menuEntries) {
let posx = event.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
let posy = event.clientY + document.body.scrollTop + document.documentElement.scrollTop;
let oldMenu = gradioApp().querySelector('#context-menu')
let oldMenu = gradioApp().querySelector('#context-menu');
if (oldMenu) {
oldMenu.remove()
oldMenu.remove();
}
let baseStyle = window.getComputedStyle(uiCurrentTab)
let baseStyle = window.getComputedStyle(uiCurrentTab);
const contextMenu = document.createElement('nav')
contextMenu.id = "context-menu"
contextMenu.style.background = baseStyle.background
contextMenu.style.color = baseStyle.color
contextMenu.style.fontFamily = baseStyle.fontFamily
contextMenu.style.top = posy+'px'
contextMenu.style.left = posx+'px'
const contextMenu = document.createElement('nav');
contextMenu.id = "context-menu";
contextMenu.style.background = baseStyle.background;
contextMenu.style.color = baseStyle.color;
contextMenu.style.fontFamily = baseStyle.fontFamily;
contextMenu.style.top = posy + 'px';
contextMenu.style.left = posx + 'px';
const contextMenuList = document.createElement('ul')
const contextMenuList = document.createElement('ul');
contextMenuList.className = 'context-menu-items';
contextMenu.append(contextMenuList);
menuEntries.forEach(function(entry) {
let contextMenuEntry = document.createElement('a')
contextMenuEntry.innerHTML = entry['name']
let contextMenuEntry = document.createElement('a');
contextMenuEntry.innerHTML = entry['name'];
contextMenuEntry.addEventListener("click", function() {
entry['func']();
})
});
contextMenuList.append(contextMenuEntry);
})
});
gradioApp().appendChild(contextMenu)
gradioApp().appendChild(contextMenu);
let menuWidth = contextMenu.offsetWidth + 4;
let menuHeight = contextMenu.offsetHeight + 4;
@ -62,29 +62,35 @@ contextMenuInit = function(){
function appendContextMenuOption(targetElementSelector, entryName, entryFunction) {
var currentItems = menuSpecs.get(targetElementSelector)
var currentItems = menuSpecs.get(targetElementSelector);
if (!currentItems) {
currentItems = []
currentItems = [];
menuSpecs.set(targetElementSelector, currentItems);
}
let newItem = {'id':targetElementSelector+'_'+uid(),
'name':entryName,
'func':entryFunction,
'isNew':true}
let newItem = {
id: targetElementSelector + '_' + uid(),
name: entryName,
func: entryFunction,
isNew: true
};
currentItems.push(newItem)
return newItem['id']
currentItems.push(newItem);
return newItem['id'];
}
function removeContextMenuOption(uid) {
menuSpecs.forEach(function(v) {
let index = -1
v.forEach(function(e,ei){if(e['id']==uid){index=ei}})
let index = -1;
v.forEach(function(e, ei) {
if (e['id'] == uid) {
index = ei;
}
});
if (index >= 0) {
v.splice(index, 1);
}
})
});
}
function addContextMenuEventListener() {
@ -93,32 +99,32 @@ contextMenuInit = function(){
}
gradioApp().addEventListener("click", function(e) {
if (!e.isTrusted) {
return
return;
}
let oldMenu = gradioApp().querySelector('#context-menu')
let oldMenu = gradioApp().querySelector('#context-menu');
if (oldMenu) {
oldMenu.remove()
oldMenu.remove();
}
});
gradioApp().addEventListener("contextmenu", function(e) {
let oldMenu = gradioApp().querySelector('#context-menu')
let oldMenu = gradioApp().querySelector('#context-menu');
if (oldMenu) {
oldMenu.remove()
oldMenu.remove();
}
menuSpecs.forEach(function(v, k) {
if (e.composedPath()[0].matches(k)) {
showContextMenu(e,e.composedPath()[0],v)
e.preventDefault()
showContextMenu(e, e.composedPath()[0], v);
e.preventDefault();
}
})
});
eventListenerApplied=true
});
eventListenerApplied = true;
}
return [appendContextMenuOption, removeContextMenuOption, addContextMenuEventListener]
}
return [appendContextMenuOption, removeContextMenuOption, addContextMenuEventListener];
};
initResponse = contextMenuInit();
appendContextMenuOption = initResponse[0];
@ -133,34 +139,34 @@ addContextMenuEventListener = initResponse[2];
if (!interruptbutton.offsetParent) {
genbutton.click();
}
clearInterval(window.generateOnRepeatInterval)
clearInterval(window.generateOnRepeatInterval);
window.generateOnRepeatInterval = setInterval(function() {
if (!interruptbutton.offsetParent) {
genbutton.click();
}
},
500)
}
500);
};
appendContextMenuOption('#txt2img_generate', 'Generate forever', function() {
generateOnRepeat('#txt2img_generate', '#txt2img_interrupt');
})
});
appendContextMenuOption('#img2img_generate', 'Generate forever', function() {
generateOnRepeat('#img2img_generate', '#img2img_interrupt');
})
});
let cancelGenerateForever = function() {
clearInterval(window.generateOnRepeatInterval)
}
clearInterval(window.generateOnRepeatInterval);
};
appendContextMenuOption('#txt2img_interrupt','Cancel generate forever',cancelGenerateForever)
appendContextMenuOption('#txt2img_generate', 'Cancel generate forever',cancelGenerateForever)
appendContextMenuOption('#img2img_interrupt','Cancel generate forever',cancelGenerateForever)
appendContextMenuOption('#img2img_generate', 'Cancel generate forever',cancelGenerateForever)
appendContextMenuOption('#txt2img_interrupt', 'Cancel generate forever', cancelGenerateForever);
appendContextMenuOption('#txt2img_generate', 'Cancel generate forever', cancelGenerateForever);
appendContextMenuOption('#img2img_interrupt', 'Cancel generate forever', cancelGenerateForever);
appendContextMenuOption('#img2img_generate', 'Cancel generate forever', cancelGenerateForever);
})();
//End example Context Menu Items
onUiUpdate(function() {
addContextMenuEventListener()
addContextMenuEventListener();
});

5
javascript/dragdrop.js vendored
View File

@ -39,7 +39,7 @@ function dropReplaceImage( imgWrap, files ) {
status: response.status,
statusText: response.statusText,
headers: response.headers
})
});
}
return response;
};
@ -93,5 +93,6 @@ window.addEventListener('paste', e => {
firstFreeImageField ?
firstFreeImageField :
visibleImageFields[visibleImageFields.length - 1]
, files );
, files
);
});

18
javascript/edit-attention.js
View File

@ -3,8 +3,8 @@ function keyupEditAttention(event){
if (!target.matches("[id*='_toprow'] [id*='_prompt'] textarea")) return;
if (!(event.metaKey || event.ctrlKey)) return;
let isPlus = event.key == "ArrowUp"
let isMinus = event.key == "ArrowDown"
let isPlus = event.key == "ArrowUp";
let isMinus = event.key == "ArrowDown";
if (!isPlus && !isMinus) return;
let selectionStart = target.selectionStart;
@ -69,12 +69,12 @@ function keyupEditAttention(event){
event.preventDefault();
var closeCharacter = ')'
var delta = opts.keyedit_precision_attention
var closeCharacter = ')';
var delta = opts.keyedit_precision_attention;
if (selectionStart > 0 && text[selectionStart - 1] == '<') {
closeCharacter = '>'
delta = opts.keyedit_precision_extra
closeCharacter = '>';
delta = opts.keyedit_precision_extra;
} else if (selectionStart == 0 || text[selectionStart - 1] != "(") {
// do not include spaces at the end
@ -82,7 +82,7 @@ function keyupEditAttention(event){
selectionEnd -= 1;
}
if (selectionStart == selectionEnd) {
return
return;
}
text = text.slice(0, selectionStart) + "(" + text.slice(selectionStart, selectionEnd) + ":1.0)" + text.slice(selectionEnd);
@ -97,7 +97,7 @@ function keyupEditAttention(event){
weight += isPlus ? delta : -delta;
weight = parseFloat(weight.toPrecision(12));
if(String(weight).length == 1) weight += ".0"
if (String(weight).length == 1) weight += ".0";
if (closeCharacter == ')' && weight == 1) {
text = text.slice(0, selectionStart - 1) + text.slice(selectionStart, selectionEnd) + text.slice(selectionEnd + 5);
@ -112,7 +112,7 @@ function keyupEditAttention(event){
target.selectionStart = selectionStart;
target.selectionEnd = selectionEnd;
updateInput(target)
updateInput(target);
}
addEventListener('keydown', (event) => {

55
javascript/extensions.js
View File

@ -1,51 +1,54 @@
function extensions_apply(_disabled_list, _update_list, disable_all) {
var disable = []
var update = []
var disable = [];
var update = [];
gradioApp().querySelectorAll('#extensions input[type="checkbox"]').forEach(function(x) {
if(x.name.startsWith("enable_") && ! x.checked)
disable.push(x.name.substring(7))
if (x.name.startsWith("enable_") && !x.checked) {
disable.push(x.name.substring(7));
}
if(x.name.startsWith("update_") && x.checked)
update.push(x.name.substring(7))
})
if (x.name.startsWith("update_") && x.checked) {
update.push(x.name.substring(7));
}
});
restart_reload()
restart_reload();
return [JSON.stringify(disable), JSON.stringify(update), disable_all]
return [JSON.stringify(disable), JSON.stringify(update), disable_all];
}
function extensions_check() {
var disable = []
var disable = [];
gradioApp().querySelectorAll('#extensions input[type="checkbox"]').forEach(function(x) {
if(x.name.startsWith("enable_") && ! x.checked)
disable.push(x.name.substring(7))
})
if (x.name.startsWith("enable_") && !x.checked) {
disable.push(x.name.substring(7));
}
});
gradioApp().querySelectorAll('#extensions .extension_status').forEach(function(x) {
x.innerHTML = "Loading..."
})
x.innerHTML = "Loading...";
});
var id = randomId()
var id = randomId();
requestProgress(id, gradioApp().getElementById('extensions_installed_top'), null, function() {
})
});
return [id, JSON.stringify(disable)]
return [id, JSON.stringify(disable)];
}
function install_extension_from_index(button, url) {
button.disabled = "disabled"
button.value = "Installing..."
button.disabled = "disabled";
button.value = "Installing...";
var textarea = gradioApp().querySelector('#extension_to_install textarea')
textarea.value = url
updateInput(textarea)
var textarea = gradioApp().querySelector('#extension_to_install textarea');
textarea.value = url;
updateInput(textarea);
gradioApp().querySelector('#install_extension_button').click()
gradioApp().querySelector('#install_extension_button').click();
}
function config_state_confirm_restore(_, config_state_name, config_restore_type) {
@ -64,8 +67,8 @@ function config_state_confirm_restore(_, config_state_name, config_restore_type)
if (confirmed) {
restart_reload();
gradioApp().querySelectorAll('#extensions .extension_status').forEach(function(x) {
x.innerHTML = "Loading..."
})
x.innerHTML = "Loading...";
});
}
return [confirmed, config_state_name, config_restore_type];
}

146
javascript/extraNetworks.js
View File

@ -1,30 +1,30 @@
function setupExtraNetworksForTab(tabname) {
gradioApp().querySelector('#'+tabname+'_extra_tabs').classList.add('extra-networks')
gradioApp().querySelector('#' + tabname + '_extra_tabs').classList.add('extra-networks');
var tabs = gradioApp().querySelector('#'+tabname+'_extra_tabs > div')
var search = gradioApp().querySelector('#'+tabname+'_extra_search textarea')
var refresh = gradioApp().getElementById(tabname+'_extra_refresh')
var tabs = gradioApp().querySelector('#' + tabname + '_extra_tabs > div');
var search = gradioApp().querySelector('#' + tabname + '_extra_search textarea');
var refresh = gradioApp().getElementById(tabname + '_extra_refresh');
search.classList.add('search')
tabs.appendChild(search)
tabs.appendChild(refresh)
search.classList.add('search');
tabs.appendChild(search);
tabs.appendChild(refresh);
var applyFilter = function() {
var searchTerm = search.value.toLowerCase()
var searchTerm = search.value.toLowerCase();
gradioApp().querySelectorAll('#' + tabname + '_extra_tabs div.card').forEach(function(elem) {
var searchOnly = elem.querySelector('.search_only')
var text = elem.querySelector('.name').textContent.toLowerCase() + " " + elem.querySelector('.search_term').textContent.toLowerCase()
var searchOnly = elem.querySelector('.search_only');
var text = elem.querySelector('.name').textContent.toLowerCase() + " " + elem.querySelector('.search_term').textContent.toLowerCase();
var visible = text.indexOf(searchTerm) != -1
var visible = text.indexOf(searchTerm) != -1;
if (searchOnly && searchTerm.length < 4) {
visible = false
visible = false;
}
elem.style.display = visible ? "" : "none"
})
}
elem.style.display = visible ? "" : "none";
});
};
search.addEventListener("input", applyFilter);
applyFilter();
@ -36,18 +36,18 @@ function applyExtraNetworkFilter(tabname){
setTimeout(extraNetworksApplyFilter[tabname], 1);
}
var extraNetworksApplyFilter = {}
var extraNetworksApplyFilter = {};
var activePromptTextarea = {};
function setupExtraNetworks() {
setupExtraNetworksForTab('txt2img')
setupExtraNetworksForTab('img2img')
setupExtraNetworksForTab('txt2img');
setupExtraNetworksForTab('img2img');
function registerPrompt(tabname, id) {
var textarea = gradioApp().querySelector("#" + id + " > label > textarea");
if (!activePromptTextarea[tabname]) {
activePromptTextarea[tabname] = textarea
activePromptTextarea[tabname] = textarea;
}
textarea.addEventListener("focus", function() {
@ -55,99 +55,105 @@ function setupExtraNetworks(){
});
}
registerPrompt('txt2img', 'txt2img_prompt')
registerPrompt('txt2img', 'txt2img_neg_prompt')
registerPrompt('img2img', 'img2img_prompt')
registerPrompt('img2img', 'img2img_neg_prompt')
registerPrompt('txt2img', 'txt2img_prompt');
registerPrompt('txt2img', 'txt2img_neg_prompt');
registerPrompt('img2img', 'img2img_prompt');
registerPrompt('img2img', 'img2img_neg_prompt');
}
onUiLoaded(setupExtraNetworks)
onUiLoaded(setupExtraNetworks);
var re_extranet = /<([^:]+:[^:]+):[\d\.]+>/;
var re_extranet_g = /\s+<([^:]+:[^:]+):[\d\.]+>/g;
function tryToRemoveExtraNetworkFromPrompt(textarea, text) {
var m = text.match(re_extranet)
var replaced = false
var newTextareaText
var m = text.match(re_extranet);
var replaced = false;
var newTextareaText;
if (m) {
var partToSearch = m[1]
var partToSearch = m[1];
newTextareaText = textarea.value.replaceAll(re_extranet_g, function(found) {
m = found.match(re_extranet);
if (m[1] == partToSearch) {
replaced = true;
return ""
return "";
}
return found;
})
});
} else {
newTextareaText = textarea.value.replaceAll(new RegExp(text, "g"), function(found) {
if (found == text) {
replaced = true;
return ""
return "";
}
return found;
})
});
}
if (replaced) {
textarea.value = newTextareaText
textarea.value = newTextareaText;
return true;
}
return false
return false;
}
function cardClicked(tabname, textToAdd, allowNegativePrompt) {
var textarea = allowNegativePrompt ? activePromptTextarea[tabname] : gradioApp().querySelector("#" + tabname + "_prompt > label > textarea")
var textarea = allowNegativePrompt ? activePromptTextarea[tabname] : gradioApp().querySelector("#" + tabname + "_prompt > label > textarea");
if (!tryToRemoveExtraNetworkFromPrompt(textarea, textToAdd)) {
textarea.value = textarea.value + opts.extra_networks_add_text_separator + textToAdd
textarea.value = textarea.value + opts.extra_networks_add_text_separator + textToAdd;
}
updateInput(textarea)
updateInput(textarea);
}
function saveCardPreview(event, tabname, filename) {
var textarea = gradioApp().querySelector("#" + tabname + '_preview_filename > label > textarea')
var button = gradioApp().getElementById(tabname + '_save_preview')
var textarea = gradioApp().querySelector("#" + tabname + '_preview_filename > label > textarea');
var button = gradioApp().getElementById(tabname + '_save_preview');
textarea.value = filename
updateInput(textarea)
textarea.value = filename;
updateInput(textarea);
button.click()
button.click();
event.stopPropagation()
event.preventDefault()
event.stopPropagation();
event.preventDefault();
}
function extraNetworksSearchButton(tabs_id, event) {
var searchTextarea = gradioApp().querySelector("#" + tabs_id + ' > div > textarea')
var button = event.target
var text = button.classList.contains("search-all") ? "" : button.textContent.trim()
var searchTextarea = gradioApp().querySelector("#" + tabs_id + ' > div > textarea');
var button = event.target;
var text = button.classList.contains("search-all") ? "" : button.textContent.trim();
searchTextarea.value = text
updateInput(searchTextarea)
searchTextarea.value = text;
updateInput(searchTextarea);
}
var globalPopup = null;
var globalPopupInner = null;
function popup(contents) {
if (!globalPopup) {
globalPopup = document.createElement('div')
globalPopup.onclick = function(){ globalPopup.style.display = "none"; };
globalPopup = document.createElement('div');
globalPopup.onclick = function() {
globalPopup.style.display = "none";
};
globalPopup.classList.add('global-popup');
var close = document.createElement('div')
var close = document.createElement('div');
close.classList.add('global-popup-close');
close.onclick = function(){ globalPopup.style.display = "none"; };
close.onclick = function() {
globalPopup.style.display = "none";
};
close.title = "Close";
globalPopup.appendChild(close)
globalPopup.appendChild(close);
globalPopupInner = document.createElement('div')
globalPopupInner.onclick = function(event){ event.stopPropagation(); return false; };
globalPopupInner = document.createElement('div');
globalPopupInner.onclick = function(event) {
event.stopPropagation(); return false;
};
globalPopupInner.classList.add('global-popup-inner');
globalPopup.appendChild(globalPopupInner)
globalPopup.appendChild(globalPopupInner);
gradioApp().appendChild(globalPopup);
}
@ -159,7 +165,7 @@ function popup(contents){
}
function extraNetworksShowMetadata(text) {
var elem = document.createElement('pre')
var elem = document.createElement('pre');
elem.classList.add('popup-metadata');
elem.textContent = text;
@ -168,7 +174,9 @@ function extraNetworksShowMetadata(text){
function requestGet(url, data, handler, errorHandler) {
var xhr = new XMLHttpRequest();
var args = Object.keys(data).map(function(k){ return encodeURIComponent(k) + '=' + encodeURIComponent(data[k]) }).join('&')
var args = Object.keys(data).map(function(k) {
return encodeURIComponent(k) + '=' + encodeURIComponent(data[k]);
}).join('&');
xhr.open("GET", url + "?" + args, true);
xhr.onreadystatechange = function() {
@ -176,13 +184,13 @@ function requestGet(url, data, handler, errorHandler){
if (xhr.status === 200) {
try {
var js = JSON.parse(xhr.responseText);
handler(js)
handler(js);
} catch (error) {
console.error(error);
errorHandler()
errorHandler();
}
} else {
errorHandler()
errorHandler();
}
}
};
@ -191,15 +199,17 @@ function requestGet(url, data, handler, errorHandler){
}
function extraNetworksRequestMetadata(event, extraPage, cardName) {
var showError = function(){ extraNetworksShowMetadata("there was an error getting metadata"); }
var showError = function() {
extraNetworksShowMetadata("there was an error getting metadata");
};
requestGet("./sd_extra_networks/metadata", {"page": extraPage, "item": cardName}, function(data){
requestGet("./sd_extra_networks/metadata", {page: extraPage, item: cardName}, function(data) {
if (data && data.metadata) {
extraNetworksShowMetadata(data.metadata)
extraNetworksShowMetadata(data.metadata);
} else {
showError()
showError();
}
}, showError)
}, showError);
event.stopPropagation()
event.stopPropagation();
}

20
javascript/generationParams.js
View File

@ -3,31 +3,33 @@
let txt2img_gallery, img2img_gallery, modal = undefined;
onUiUpdate(function() {
if (!txt2img_gallery) {
txt2img_gallery = attachGalleryListeners("txt2img")
txt2img_gallery = attachGalleryListeners("txt2img");
}
if (!img2img_gallery) {
img2img_gallery = attachGalleryListeners("img2img")
img2img_gallery = attachGalleryListeners("img2img");
}
if (!modal) {
modal = gradioApp().getElementById('lightboxModal')
modal = gradioApp().getElementById('lightboxModal');
modalObserver.observe(modal, { attributes: true, attributeFilter: ['style'] });
}
});
let modalObserver = new MutationObserver(function(mutations) {
mutations.forEach(function(mutationRecord) {
let selectedTab = gradioApp().querySelector('#tabs div button.selected')?.innerText
if (mutationRecord.target.style.display === 'none' && (selectedTab === 'txt2img' || selectedTab === 'img2img'))
gradioApp().getElementById(selectedTab+"_generation_info_button")?.click()
let selectedTab = gradioApp().querySelector('#tabs div button.selected')?.innerText;
if (mutationRecord.target.style.display === 'none' && (selectedTab === 'txt2img' || selectedTab === 'img2img')) {
gradioApp().getElementById(selectedTab + "_generation_info_button")?.click();
}
});
});
function attachGalleryListeners(tab_name) {
var gallery = gradioApp().querySelector('#'+tab_name+'_gallery')
var gallery = gradioApp().querySelector('#' + tab_name + '_gallery');
gallery?.addEventListener('click', () => gradioApp().getElementById(tab_name + "_generation_info_button").click());
gallery?.addEventListener('keydown', (e) => {
if (e.keyCode == 37 || e.keyCode == 39) // left or right arrow
gradioApp().getElementById(tab_name+"_generation_info_button").click()
if (e.keyCode == 37 || e.keyCode == 39) { // left or right arrow
gradioApp().getElementById(tab_name + "_generation_info_button").click();
}
});
return gallery;
}

10
javascript/hints.js
View File

@ -113,7 +113,7 @@ titles = {
"Discard weights with matching name": "Regular expression; if weights's name matches it, the weights is not written to the resulting checkpoint. Use ^model_ema to discard EMA weights.",
"Extra networks tab order": "Comma-separated list of tab names; tabs listed here will appear in the extra networks UI first and in order lsited.",
"Negative Guidance minimum sigma": "Skip negative prompt for steps where image is already mostly denoised; the higher this value, the more skips there will be; provides increased performance in exchange for minor quality reduction."
}
};
onUiUpdate(function() {
@ -138,13 +138,13 @@ onUiUpdate(function(){
if (tooltip) {
span.title = tooltip;
}
})
});
gradioApp().querySelectorAll('select').forEach(function(select) {
if (select.onchange != null) return;
select.onchange = function() {
select.title = localization[titles[select.value]] || titles[select.value] || "";
}
})
})
};
});
});

18
javascript/hires_fix.js
View File

@ -1,18 +1,18 @@
function onCalcResolutionHires(enable, width, height, hr_scale, hr_resize_x, hr_resize_y) {
function setInactive(elem, inactive) {
elem.classList.toggle('inactive', !!inactive)
elem.classList.toggle('inactive', !!inactive);
}
var hrUpscaleBy = gradioApp().getElementById('txt2img_hr_scale')
var hrResizeX = gradioApp().getElementById('txt2img_hr_resize_x')
var hrResizeY = gradioApp().getElementById('txt2img_hr_resize_y')
var hrUpscaleBy = gradioApp().getElementById('txt2img_hr_scale');
var hrResizeX = gradioApp().getElementById('txt2img_hr_resize_x');
var hrResizeY = gradioApp().getElementById('txt2img_hr_resize_y');
gradioApp().getElementById('txt2img_hires_fix_row2').style.display = opts.use_old_hires_fix_width_height ? "none" : ""
gradioApp().getElementById('txt2img_hires_fix_row2').style.display = opts.use_old_hires_fix_width_height ? "none" : "";
setInactive(hrUpscaleBy, opts.use_old_hires_fix_width_height || hr_resize_x > 0 || hr_resize_y > 0)
setInactive(hrResizeX, opts.use_old_hires_fix_width_height || hr_resize_x == 0)
setInactive(hrResizeY, opts.use_old_hires_fix_width_height || hr_resize_y == 0)
setInactive(hrUpscaleBy, opts.use_old_hires_fix_width_height || hr_resize_x > 0 || hr_resize_y > 0);
setInactive(hrResizeX, opts.use_old_hires_fix_width_height || hr_resize_x == 0);
setInactive(hrResizeY, opts.use_old_hires_fix_width_height || hr_resize_y == 0);
return [enable, width, height, hr_scale, hr_resize_x, hr_resize_y]
return [enable, width, height, hr_scale, hr_resize_x, hr_resize_y];
}

173
javascript/imageviewer.js
View File

@ -5,24 +5,24 @@ function closeModal() {
function showModal(event) {
const source = event.target || event.srcElement;
const modalImage = gradioApp().getElementById("modalImage")
const lb = gradioApp().getElementById("lightboxModal")
modalImage.src = source.src
const modalImage = gradioApp().getElementById("modalImage");
const lb = gradioApp().getElementById("lightboxModal");
modalImage.src = source.src;
if (modalImage.style.display === 'none') {
lb.style.setProperty('background-image', 'url(' + source.src + ')');
}
lb.style.display = "flex";
lb.focus()
lb.focus();
const tabTxt2Img = gradioApp().getElementById("tab_txt2img")
const tabImg2Img = gradioApp().getElementById("tab_img2img")
const tabTxt2Img = gradioApp().getElementById("tab_txt2img");
const tabImg2Img = gradioApp().getElementById("tab_img2img");
// show the save button in modal only on txt2img or img2img tabs
if (tabTxt2Img.style.display != "none" || tabImg2Img.style.display != "none") {
gradioApp().getElementById("modal_save").style.display = "inline"
gradioApp().getElementById("modal_save").style.display = "inline";
} else {
gradioApp().getElementById("modal_save").style.display = "none"
gradioApp().getElementById("modal_save").style.display = "none";
}
event.stopPropagation()
event.stopPropagation();
}
function negmod(n, m) {
@ -30,14 +30,14 @@ function negmod(n, m) {
}
function updateOnBackgroundChange() {
const modalImage = gradioApp().getElementById("modalImage")
const modalImage = gradioApp().getElementById("modalImage");
if (modalImage && modalImage.offsetParent) {
let currentButton = selected_gallery_button();
if (currentButton?.children?.length > 0 && modalImage.src != currentButton.children[0].src) {
modalImage.src = currentButton.children[0].src;
if (modalImage.style.display === 'none') {
modal.style.setProperty('background-image', `url(${modalImage.src})`)
modal.style.setProperty('background-image', `url(${modalImage.src})`);
}
}
}
@ -49,68 +49,68 @@ function modalImageSwitch(offset) {
if (galleryButtons.length > 1) {
var currentButton = selected_gallery_button();
var result = -1
var result = -1;
galleryButtons.forEach(function(v, i) {
if (v == currentButton) {
result = i
result = i;
}
})
});
if (result != -1) {
var nextButton = galleryButtons[negmod((result + offset), galleryButtons.length)]
nextButton.click()
var nextButton = galleryButtons[negmod((result + offset), galleryButtons.length)];
nextButton.click();
const modalImage = gradioApp().getElementById("modalImage");
const modal = gradioApp().getElementById("lightboxModal");
modalImage.src = nextButton.children[0].src;
if (modalImage.style.display === 'none') {
modal.style.setProperty('background-image', `url(${modalImage.src})`)
modal.style.setProperty('background-image', `url(${modalImage.src})`);
}
setTimeout(function() {
modal.focus()
}, 10)
modal.focus();
}, 10);
}
}
}
function saveImage() {
const tabTxt2Img = gradioApp().getElementById("tab_txt2img")
const tabImg2Img = gradioApp().getElementById("tab_img2img")
const saveTxt2Img = "save_txt2img"
const saveImg2Img = "save_img2img"
const tabTxt2Img = gradioApp().getElementById("tab_txt2img");
const tabImg2Img = gradioApp().getElementById("tab_img2img");
const saveTxt2Img = "save_txt2img";
const saveImg2Img = "save_img2img";
if (tabTxt2Img.style.display != "none") {
gradioApp().getElementById(saveTxt2Img).click()
gradioApp().getElementById(saveTxt2Img).click();
} else if (tabImg2Img.style.display != "none") {
gradioApp().getElementById(saveImg2Img).click()
gradioApp().getElementById(saveImg2Img).click();
} else {
console.error("missing implementation for saving modal of this type")
console.error("missing implementation for saving modal of this type");
}
}
function modalSaveImage(event) {
saveImage()
event.stopPropagation()
saveImage();
event.stopPropagation();
}
function modalNextImage(event) {
modalImageSwitch(1)
event.stopPropagation()
modalImageSwitch(1);
event.stopPropagation();
}
function modalPrevImage(event) {
modalImageSwitch(-1)
event.stopPropagation()
modalImageSwitch(-1);
event.stopPropagation();
}
function modalKeyHandler(event) {
switch (event.key) {
case "s":
saveImage()
saveImage();
break;
case "ArrowLeft":
modalPrevImage(event)
modalPrevImage(event);
break;
case "ArrowRight":
modalNextImage(event)
modalNextImage(event);
break;
case "Escape":
closeModal();
@ -119,26 +119,27 @@ function modalKeyHandler(event) {
}
function setupImageForLightbox(e) {
if (e.dataset.modded)
if (e.dataset.modded) {
return;
}
e.dataset.modded = true;
e.style.cursor='pointer'
e.style.userSelect='none'
e.style.cursor = 'pointer';
e.style.userSelect = 'none';
var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1
var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
// For Firefox, listening on click first switched to next image then shows the lightbox.
// If you know how to fix this without switching to mousedown event, please.
// For other browsers the event is click to make it possiblr to drag picture.
var event = isFirefox ? 'mousedown' : 'click'
var event = isFirefox ? 'mousedown' : 'click';
e.addEventListener(event, function(evt) {
if (!opts.js_modal_lightbox || evt.button != 0) return;
modalZoomSet(gradioApp().getElementById('modalImage'), opts.js_modal_lightbox_initially_zoomed)
evt.preventDefault()
showModal(evt)
modalZoomSet(gradioApp().getElementById('modalImage'), opts.js_modal_lightbox_initially_zoomed);
evt.preventDefault();
showModal(evt);
}, true);
}
@ -149,8 +150,8 @@ function modalZoomSet(modalImage, enable) {
function modalZoomToggle(event) {
var modalImage = gradioApp().getElementById("modalImage");
modalZoomSet(modalImage, !modalImage.classList.contains('modalImageFullscreen'))
event.stopPropagation()
modalZoomSet(modalImage, !modalImage.classList.contains('modalImageFullscreen'));
event.stopPropagation();
}
function modalTileImageToggle(event) {
@ -159,13 +160,13 @@ function modalTileImageToggle(event) {
const isTiling = modalImage.style.display === 'none';
if (isTiling) {
modalImage.style.display = 'block';
modal.style.setProperty('background-image', 'none')
modal.style.setProperty('background-image', 'none');
} else {
modalImage.style.display = 'none';
modal.style.setProperty('background-image', `url(${modalImage.src})`)
modal.style.setProperty('background-image', `url(${modalImage.src})`);
}
event.stopPropagation()
event.stopPropagation();
}
function galleryImageHandler(e) {
@ -175,77 +176,77 @@ function galleryImageHandler(e) {
}
onUiUpdate(function() {
var fullImg_preview = gradioApp().querySelectorAll('.gradio-gallery > div > img')
var fullImg_preview = gradioApp().querySelectorAll('.gradio-gallery > div > img');
if (fullImg_preview != null) {
fullImg_preview.forEach(setupImageForLightbox);
}
updateOnBackgroundChange();
})
});
document.addEventListener("DOMContentLoaded", function() {
//const modalFragment = document.createDocumentFragment();
const modal = document.createElement('div')
const modal = document.createElement('div');
modal.onclick = closeModal;
modal.id = "lightboxModal";
modal.tabIndex = 0
modal.addEventListener('keydown', modalKeyHandler, true)
modal.tabIndex = 0;
modal.addEventListener('keydown', modalKeyHandler, true);
const modalControls = document.createElement('div')
const modalControls = document.createElement('div');
modalControls.className = 'modalControls gradio-container';
modal.append(modalControls);
const modalZoom = document.createElement('span')
const modalZoom = document.createElement('span');
modalZoom.className = 'modalZoom cursor';
modalZoom.innerHTML = '&#10529;'
modalZoom.addEventListener('click', modalZoomToggle, true)
modalZoom.innerHTML = '&#10529;';
modalZoom.addEventListener('click', modalZoomToggle, true);
modalZoom.title = "Toggle zoomed view";
modalControls.appendChild(modalZoom)
modalControls.appendChild(modalZoom);
const modalTileImage = document.createElement('span')
const modalTileImage = document.createElement('span');
modalTileImage.className = 'modalTileImage cursor';
modalTileImage.innerHTML = '&#8862;'
modalTileImage.addEventListener('click', modalTileImageToggle, true)
modalTileImage.innerHTML = '&#8862;';
modalTileImage.addEventListener('click', modalTileImageToggle, true);
modalTileImage.title = "Preview tiling";
modalControls.appendChild(modalTileImage)
modalControls.appendChild(modalTileImage);
const modalSave = document.createElement("span")
modalSave.className = "modalSave cursor"
modalSave.id = "modal_save"
modalSave.innerHTML = "&#x1F5AB;"
modalSave.addEventListener("click", modalSaveImage, true)
modalSave.title = "Save Image(s)"
modalControls.appendChild(modalSave)
const modalSave = document.createElement("span");
modalSave.className = "modalSave cursor";
modalSave.id = "modal_save";
modalSave.innerHTML = "&#x1F5AB;";
modalSave.addEventListener("click", modalSaveImage, true);
modalSave.title = "Save Image(s)";
modalControls.appendChild(modalSave);
const modalClose = document.createElement('span')
const modalClose = document.createElement('span');
modalClose.className = 'modalClose cursor';
modalClose.innerHTML = '&times;'
modalClose.innerHTML = '&times;';
modalClose.onclick = closeModal;
modalClose.title = "Close image viewer";
modalControls.appendChild(modalClose)
modalControls.appendChild(modalClose);
const modalImage = document.createElement('img')
const modalImage = document.createElement('img');
modalImage.id = 'modalImage';
modalImage.onclick = closeModal;
modalImage.tabIndex = 0
modalImage.addEventListener('keydown', modalKeyHandler, true)
modal.appendChild(modalImage)
modalImage.tabIndex = 0;
modalImage.addEventListener('keydown', modalKeyHandler, true);
modal.appendChild(modalImage);
const modalPrev = document.createElement('a')
const modalPrev = document.createElement('a');
modalPrev.className = 'modalPrev';
modalPrev.innerHTML = '&#10094;'
modalPrev.tabIndex = 0
modalPrev.innerHTML = '&#10094;';
modalPrev.tabIndex = 0;
modalPrev.addEventListener('click', modalPrevImage, true);
modalPrev.addEventListener('keydown', modalKeyHandler, true)
modal.appendChild(modalPrev)
modalPrev.addEventListener('keydown', modalKeyHandler, true);
modal.appendChild(modalPrev);
const modalNext = document.createElement('a')
const modalNext = document.createElement('a');
modalNext.className = 'modalNext';
modalNext.innerHTML = '&#10095;'
modalNext.tabIndex = 0
modalNext.innerHTML = '&#10095;';
modalNext.tabIndex = 0;
modalNext.addEventListener('click', modalNextImage, true);
modalNext.addEventListener('keydown', modalKeyHandler, true)
modalNext.addEventListener('keydown', modalKeyHandler, true);
modal.appendChild(modalNext)
modal.appendChild(modalNext);
try {
gradioApp().appendChild(modal);

2
javascript/imageviewerGamepad.js
View File

@ -14,7 +14,7 @@ window.addEventListener('gamepadconnected', (e) => {
}
if (isWaiting) {
await sleepUntil(() => {
const xValue = navigator.getGamepads()[index].axes[0]
const xValue = navigator.getGamepads()[index].axes[0];
if (xValue < 0.3 && xValue > -0.3) {
return true;
}

68
javascript/localization.js
View File

@ -17,13 +17,13 @@ ignore_ids_for_localization={
setting_realesrgan_enabled_models: 'SPAN',
extras_upscaler_1: 'SPAN',
extras_upscaler_2: 'SPAN',
}
};
re_num = /^[\.\d]+$/
re_emoji = /[\p{Extended_Pictographic}\u{1F3FB}-\u{1F3FF}\u{1F9B0}-\u{1F9B3}]/u
re_num = /^[\.\d]+$/;
re_emoji = /[\p{Extended_Pictographic}\u{1F3FB}-\u{1F3FF}\u{1F9B0}-\u{1F9B3}]/u;
original_lines = {}
translated_lines = {}
original_lines = {};
translated_lines = {};
function hasLocalization() {
return window.localization && Object.keys(window.localization).length > 0;
@ -39,13 +39,13 @@ function canBeTranslated(node, text){
if (!text) return false;
if (!node.parentElement) return false;
var parentType = node.parentElement.nodeName
var parentType = node.parentElement.nodeName;
if (parentType == 'SCRIPT' || parentType == 'STYLE' || parentType == 'TEXTAREA') return false;
if (parentType == 'OPTION' || parentType == 'SPAN') {
var pnode = node
var pnode = node;
for (var level = 0; level < 4; level++) {
pnode = pnode.parentElement
pnode = pnode.parentElement;
if (!pnode) break;
if (ignore_ids_for_localization[pnode.id] == parentType) return false;
@ -54,58 +54,58 @@ function canBeTranslated(node, text){
if (re_num.test(text)) return false;
if (re_emoji.test(text)) return false;
return true
return true;
}
function getTranslation(text) {
if(! text) return undefined
if (!text) return undefined;
if (translated_lines[text] === undefined) {
original_lines[text] = 1
original_lines[text] = 1;
}
tl = localization[text]
tl = localization[text];
if (tl !== undefined) {
translated_lines[tl] = 1
translated_lines[tl] = 1;
}
return tl
return tl;
}
function processTextNode(node) {
var text = node.textContent.trim()
var text = node.textContent.trim();
if(! canBeTranslated(node, text)) return
if (!canBeTranslated(node, text)) return;
tl = getTranslation(text)
tl = getTranslation(text);
if (tl !== undefined) {
node.textContent = tl
node.textContent = tl;
}
}
function processNode(node) {
if (node.nodeType == 3) {
processTextNode(node)
return
processTextNode(node);
return;
}
if (node.title) {
tl = getTranslation(node.title)
tl = getTranslation(node.title);
if (tl !== undefined) {
node.title = tl
node.title = tl;
}
}
if (node.placeholder) {
tl = getTranslation(node.placeholder)
tl = getTranslation(node.placeholder);
if (tl !== undefined) {
node.placeholder = tl
node.placeholder = tl;
}
}
textNodesUnder(node).forEach(function(node) {
processTextNode(node)
})
processTextNode(node);
});
}
function dumpTranslations() {
@ -115,7 +115,7 @@ function dumpTranslations(){
// original_lines, so do that now.
processNode(gradioApp());
}
var dumped = {}
var dumped = {};
if (localization.rtl) {
dumped.rtl = true;
}
@ -129,7 +129,7 @@ function dumpTranslations(){
}
function download_localization() {
var text = JSON.stringify(dumpTranslations(), null, 4)
var text = JSON.stringify(dumpTranslations(), null, 4);
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
@ -150,12 +150,12 @@ document.addEventListener("DOMContentLoaded", function () {
onUiUpdate(function(m) {
m.forEach(function(mutation) {
mutation.addedNodes.forEach(function(node) {
processNode(node)
})
processNode(node);
});
});
});
})
processNode(gradioApp())
processNode(gradioApp());
if (localization.rtl) { // if the language is from right to left,
(new MutationObserver((mutations, observer) => { // wait for the style to load
@ -170,8 +170,8 @@ document.addEventListener("DOMContentLoaded", function () {
}
}
}
})
});
});
})).observe(gradioApp(), { childList: true });
}
})
});

2
javascript/notification.js
View File

@ -6,7 +6,7 @@ let notificationButton = null;
onUiUpdate(function() {
if (notificationButton == null) {
notificationButton = gradioApp().getElementById('request_notifications')
notificationButton = gradioApp().getElementById('request_notifications');
if (notificationButton != null) {
notificationButton.addEventListener('click', () => {

114
javascript/progressbar.js
View File

@ -17,13 +17,13 @@ function request(url, data, handler, errorHandler){
if (xhr.status === 200) {
try {
var js = JSON.parse(xhr.responseText);
handler(js)
handler(js);
} catch (error) {
console.error(error);
errorHandler()
errorHandler();
}
} else {
errorHandler()
errorHandler();
}
}
};
@ -32,21 +32,21 @@ function request(url, data, handler, errorHandler){
}
function pad2(x) {
return x<10 ? '0'+x : x
return x < 10 ? '0' + x : x;
}
function formatTime(secs) {
if (secs > 3600) {
return pad2(Math.floor(secs/60/60)) + ":" + pad2(Math.floor(secs/60)%60) + ":" + pad2(Math.floor(secs)%60)
return pad2(Math.floor(secs / 60 / 60)) + ":" + pad2(Math.floor(secs / 60) % 60) + ":" + pad2(Math.floor(secs) % 60);
} else if (secs > 60) {
return pad2(Math.floor(secs/60)) + ":" + pad2(Math.floor(secs)%60)
return pad2(Math.floor(secs / 60)) + ":" + pad2(Math.floor(secs) % 60);
} else {
return Math.floor(secs) + "s"
return Math.floor(secs) + "s";
}
}
function setTitle(progress) {
var title = 'Stable Diffusion'
var title = 'Stable Diffusion';
if (opts.show_progress_in_title && progress) {
title = '[' + progress.trim() + '] ' + title;
@ -59,119 +59,119 @@ function setTitle(progress){
function randomId() {
return "task(" + Math.random().toString(36).slice(2, 7) + Math.random().toString(36).slice(2, 7) + Math.random().toString(36).slice(2, 7)+")"
return "task(" + Math.random().toString(36).slice(2, 7) + Math.random().toString(36).slice(2, 7) + Math.random().toString(36).slice(2, 7) + ")";
}
// starts sending progress requests to "/internal/progress" uri, creating progressbar above progressbarContainer element and
// preview inside gallery element. Cleans up all created stuff when the task is over and calls atEnd.
// calls onProgress every time there is a progress update
function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgress, inactivityTimeout = 40) {
var dateStart = new Date()
var wasEverActive = false
var parentProgressbar = progressbarContainer.parentNode
var parentGallery = gallery ? gallery.parentNode : null
var dateStart = new Date();
var wasEverActive = false;
var parentProgressbar = progressbarContainer.parentNode;
var parentGallery = gallery ? gallery.parentNode : null;
var divProgress = document.createElement('div')
divProgress.className='progressDiv'
divProgress.style.display = opts.show_progressbar ? "block" : "none"
var divInner = document.createElement('div')
divInner.className='progress'
var divProgress = document.createElement('div');
divProgress.className = 'progressDiv';
divProgress.style.display = opts.show_progressbar ? "block" : "none";
var divInner = document.createElement('div');
divInner.className = 'progress';
divProgress.appendChild(divInner)
parentProgressbar.insertBefore(divProgress, progressbarContainer)
divProgress.appendChild(divInner);
parentProgressbar.insertBefore(divProgress, progressbarContainer);
if (parentGallery) {
var livePreview = document.createElement('div')
livePreview.className='livePreview'
parentGallery.insertBefore(livePreview, gallery)
var livePreview = document.createElement('div');
livePreview.className = 'livePreview';
parentGallery.insertBefore(livePreview, gallery);
}
var removeProgressBar = function() {
setTitle("")
parentProgressbar.removeChild(divProgress)
if(parentGallery) parentGallery.removeChild(livePreview)
atEnd()
}
setTitle("");
parentProgressbar.removeChild(divProgress);
if (parentGallery) parentGallery.removeChild(livePreview);
atEnd();
};
var fun = function(id_task, id_live_preview) {
request("./internal/progress", {"id_task": id_task, "id_live_preview": id_live_preview}, function(res){
request("./internal/progress", {id_task: id_task, id_live_preview: id_live_preview}, function(res) {
if (res.completed) {
removeProgressBar()
return
removeProgressBar();
return;
}
var rect = progressbarContainer.getBoundingClientRect()
var rect = progressbarContainer.getBoundingClientRect();
if (rect.width) {
divProgress.style.width = rect.width + "px";
}
let progressText = ""
let progressText = "";
divInner.style.width = ((res.progress || 0) * 100.0) + '%'
divInner.style.background = res.progress ? "" : "transparent"
divInner.style.width = ((res.progress || 0) * 100.0) + '%';
divInner.style.background = res.progress ? "" : "transparent";
if (res.progress > 0) {
progressText = ((res.progress || 0) * 100.0).toFixed(0) + '%'
progressText = ((res.progress || 0) * 100.0).toFixed(0) + '%';
}
if (res.eta) {
progressText += " ETA: " + formatTime(res.eta)
progressText += " ETA: " + formatTime(res.eta);
}
setTitle(progressText)
setTitle(progressText);
if (res.textinfo && res.textinfo.indexOf("\n") == -1) {
progressText = res.textinfo + " " + progressText
progressText = res.textinfo + " " + progressText;
}
divInner.textContent = progressText
divInner.textContent = progressText;
var elapsedFromStart = (new Date() - dateStart) / 1000
var elapsedFromStart = (new Date() - dateStart) / 1000;
if (res.active) wasEverActive = true;
if (!res.active && wasEverActive) {
removeProgressBar()
return
removeProgressBar();
return;
}
if (elapsedFromStart > inactivityTimeout && !res.queued && !res.active) {
removeProgressBar()
return
removeProgressBar();
return;
}
if (res.live_preview && gallery) {
var rect = gallery.getBoundingClientRect()
var rect = gallery.getBoundingClientRect();
if (rect.width) {
livePreview.style.width = rect.width + "px"
livePreview.style.height = rect.height + "px"
livePreview.style.width = rect.width + "px";
livePreview.style.height = rect.height + "px";
}
var img = new Image();
img.onload = function() {
livePreview.appendChild(img)
livePreview.appendChild(img);
if (livePreview.childElementCount > 2) {
livePreview.removeChild(livePreview.firstElementChild)
}
livePreview.removeChild(livePreview.firstElementChild);
}
};
img.src = res.live_preview;
}
if (onProgress) {
onProgress(res)
onProgress(res);
}
setTimeout(() => {
fun(id_task, res.id_live_preview);
}, opts.live_preview_refresh_period || 500)
}, opts.live_preview_refresh_period || 500);
}, function() {
removeProgressBar()
})
}
removeProgressBar();
});
};
fun(id_task, 0)
fun(id_task, 0);
}

14
javascript/textualInversion.js
View File

@ -2,16 +2,16 @@
function start_training_textual_inversion() {
gradioApp().querySelector('#ti_error').innerHTML=''
gradioApp().querySelector('#ti_error').innerHTML = '';
var id = randomId()
var id = randomId();
requestProgress(id, gradioApp().getElementById('ti_output'), gradioApp().getElementById('ti_gallery'), function() {}, function(progress) {
gradioApp().getElementById('ti_progress').innerHTML = progress.textinfo
})
gradioApp().getElementById('ti_progress').innerHTML = progress.textinfo;
});
var res = args_to_array(arguments)
var res = args_to_array(arguments);
res[0] = id
res[0] = id;
return res
return res;
}

273
javascript/ui.js
View File

@ -1,7 +1,7 @@
// various functions for interaction with ui.py not large enough to warrant putting them in separate files
function set_theme(theme) {
var gradioURL = window.location.href
var gradioURL = window.location.href;
if (!gradioURL.includes('?__theme=')) {
window.location.replace(gradioURL + '?__theme=' + theme);
}
@ -14,7 +14,7 @@ function all_gallery_buttons() {
if (elem.parentElement.offsetParent) {
visibleGalleryButtons.push(elem);
}
})
});
return visibleGalleryButtons;
}
@ -25,7 +25,7 @@ function selected_gallery_button() {
if (elem.parentElement.offsetParent) {
visibleCurrentButton = elem;
}
})
});
return visibleCurrentButton;
}
@ -33,10 +33,14 @@ function selected_gallery_index(){
var buttons = all_gallery_buttons();
var button = selected_gallery_button();
var result = -1
buttons.forEach(function(v, i){ if(v==button) { result = i } })
var result = -1;
buttons.forEach(function(v, i) {
if (v == button) {
result = i;
}
});
return result
return result;
}
function extract_image_from_gallery(gallery) {
@ -47,7 +51,7 @@ function extract_image_from_gallery(gallery){
return [gallery[0]];
}
var index = selected_gallery_index()
var index = selected_gallery_index();
if (index < 0 || index >= gallery.length) {
// Use the first image in the gallery as the default
@ -58,11 +62,11 @@ function extract_image_from_gallery(gallery){
}
function args_to_array(args) {
var res = []
var res = [];
for (var i = 0; i < args.length; i++) {
res.push(args[i])
res.push(args[i]);
}
return res
return res;
}
function switch_to_txt2img() {
@ -109,38 +113,39 @@ function switch_to_extras(){
}
function get_tab_index(tabId) {
var res = 0
var res = 0;
gradioApp().getElementById(tabId).querySelector('div').querySelectorAll('button').forEach(function(button, i) {
if(button.className.indexOf('selected') != -1)
res = i
})
if (button.className.indexOf('selected') != -1) {
res = i;
}
});
return res
return res;
}
function create_tab_index_args(tabId, args) {
var res = []
var res = [];
for (var i = 0; i < args.length; i++) {
res.push(args[i])
res.push(args[i]);
}
res[0] = get_tab_index(tabId)
res[0] = get_tab_index(tabId);
return res
return res;
}
function get_img2img_tab_index() {
let res = args_to_array(arguments)
res.splice(-2)
res[0] = get_tab_index('mode_img2img')
return res
let res = args_to_array(arguments);
res.splice(-2);
res[0] = get_tab_index('mode_img2img');
return res;
}
function create_submit_args(args) {
var res = []
var res = [];
for (var i = 0; i < args.length; i++) {
res.push(args[i])
res.push(args[i]);
}
// As it is currently, txt2img and img2img send back the previous output args (txt2img_gallery, generation_info, html_info) whenever you generate a new image.
@ -148,157 +153,157 @@ function create_submit_args(args){
// I don't know why gradio is sending outputs along with inputs, but we can prevent sending the image gallery here, which seems to be an issue for some.
// If gradio at some point stops sending outputs, this may break something
if (Array.isArray(res[res.length - 3])) {
res[res.length - 3] = null
res[res.length - 3] = null;
}
return res
return res;
}
function showSubmitButtons(tabname, show) {
gradioApp().getElementById(tabname+'_interrupt').style.display = show ? "none" : "block"
gradioApp().getElementById(tabname+'_skip').style.display = show ? "none" : "block"
gradioApp().getElementById(tabname + '_interrupt').style.display = show ? "none" : "block";
gradioApp().getElementById(tabname + '_skip').style.display = show ? "none" : "block";
}
function showRestoreProgressButton(tabname, show) {
var button = gradioApp().getElementById(tabname + "_restore_progress")
if(! button) return
var button = gradioApp().getElementById(tabname + "_restore_progress");
if (!button) return;
button.style.display = show ? "flex" : "none"
button.style.display = show ? "flex" : "none";
}
function submit() {
rememberGallerySelection('txt2img_gallery')
showSubmitButtons('txt2img', false)
rememberGallerySelection('txt2img_gallery');
showSubmitButtons('txt2img', false);
var id = randomId()
var id = randomId();
localStorage.setItem("txt2img_task_id", id);
requestProgress(id, gradioApp().getElementById('txt2img_gallery_container'), gradioApp().getElementById('txt2img_gallery'), function() {
showSubmitButtons('txt2img', true)
localStorage.removeItem("txt2img_task_id")
showRestoreProgressButton('txt2img', false)
})
showSubmitButtons('txt2img', true);
localStorage.removeItem("txt2img_task_id");
showRestoreProgressButton('txt2img', false);
});
var res = create_submit_args(arguments)
var res = create_submit_args(arguments);
res[0] = id
res[0] = id;
return res
return res;
}
function submit_img2img() {
rememberGallerySelection('img2img_gallery')
showSubmitButtons('img2img', false)
rememberGallerySelection('img2img_gallery');
showSubmitButtons('img2img', false);
var id = randomId()
var id = randomId();
localStorage.setItem("img2img_task_id", id);
requestProgress(id, gradioApp().getElementById('img2img_gallery_container'), gradioApp().getElementById('img2img_gallery'), function() {
showSubmitButtons('img2img', true)
localStorage.removeItem("img2img_task_id")
showRestoreProgressButton('img2img', false)
})
showSubmitButtons('img2img', true);
localStorage.removeItem("img2img_task_id");
showRestoreProgressButton('img2img', false);
});
var res = create_submit_args(arguments)
var res = create_submit_args(arguments);
res[0] = id
res[1] = get_tab_index('mode_img2img')
res[0] = id;
res[1] = get_tab_index('mode_img2img');
return res
return res;
}
function restoreProgressTxt2img() {
showRestoreProgressButton("txt2img", false)
var id = localStorage.getItem("txt2img_task_id")
showRestoreProgressButton("txt2img", false);
var id = localStorage.getItem("txt2img_task_id");
id = localStorage.getItem("txt2img_task_id")
id = localStorage.getItem("txt2img_task_id");
if (id) {
requestProgress(id, gradioApp().getElementById('txt2img_gallery_container'), gradioApp().getElementById('txt2img_gallery'), function() {
showSubmitButtons('txt2img', true)
}, null, 0)
showSubmitButtons('txt2img', true);
}, null, 0);
}
return id
return id;
}
function restoreProgressImg2img() {
showRestoreProgressButton("img2img", false)
showRestoreProgressButton("img2img", false);
var id = localStorage.getItem("img2img_task_id")
var id = localStorage.getItem("img2img_task_id");
if (id) {
requestProgress(id, gradioApp().getElementById('img2img_gallery_container'), gradioApp().getElementById('img2img_gallery'), function() {
showSubmitButtons('img2img', true)
}, null, 0)
showSubmitButtons('img2img', true);
}, null, 0);
}
return id
return id;
}
onUiLoaded(function() {
showRestoreProgressButton('txt2img', localStorage.getItem("txt2img_task_id"))
showRestoreProgressButton('img2img', localStorage.getItem("img2img_task_id"))
showRestoreProgressButton('txt2img', localStorage.getItem("txt2img_task_id"));
showRestoreProgressButton('img2img', localStorage.getItem("img2img_task_id"));
});
function modelmerger() {
var id = randomId()
requestProgress(id, gradioApp().getElementById('modelmerger_results_panel'), null, function(){})
var id = randomId();
requestProgress(id, gradioApp().getElementById('modelmerger_results_panel'), null, function() {});
var res = create_submit_args(arguments)
res[0] = id
return res
var res = create_submit_args(arguments);
res[0] = id;
return res;
}
function ask_for_style_name(_, prompt_text, negative_prompt_text) {
var name_ = prompt('Style name:')
return [name_, prompt_text, negative_prompt_text]
var name_ = prompt('Style name:');
return [name_, prompt_text, negative_prompt_text];
}
function confirm_clear_prompt(prompt, negative_prompt) {
if (confirm("Delete prompt?")) {
prompt = ""
negative_prompt = ""
prompt = "";
negative_prompt = "";
}
return [prompt, negative_prompt]
return [prompt, negative_prompt];
}
promptTokecountUpdateFuncs = {}
promptTokecountUpdateFuncs = {};
function recalculatePromptTokens(name) {
if (promptTokecountUpdateFuncs[name]) {
promptTokecountUpdateFuncs[name]()
promptTokecountUpdateFuncs[name]();
}
}
function recalculate_prompts_txt2img() {
recalculatePromptTokens('txt2img_prompt')
recalculatePromptTokens('txt2img_neg_prompt')
recalculatePromptTokens('txt2img_prompt');
recalculatePromptTokens('txt2img_neg_prompt');
return args_to_array(arguments);
}
function recalculate_prompts_img2img() {
recalculatePromptTokens('img2img_prompt')
recalculatePromptTokens('img2img_neg_prompt')
recalculatePromptTokens('img2img_prompt');
recalculatePromptTokens('img2img_neg_prompt');
return args_to_array(arguments);
}
var opts = {}
var opts = {};
onUiUpdate(function() {
if (Object.keys(opts).length != 0) return;
var json_elem = gradioApp().getElementById('settings_json')
var json_elem = gradioApp().getElementById('settings_json');
if (json_elem == null) return;
var textarea = json_elem.querySelector('textarea')
var jsdata = textarea.value
opts = JSON.parse(jsdata)
var textarea = json_elem.querySelector('textarea');
var jsdata = textarea.value;
opts = JSON.parse(jsdata);
executeCallbacks(optionsChangedCallbacks);
Object.defineProperty(textarea, 'value', {
@ -308,7 +313,7 @@ onUiUpdate(function(){
valueProp.set.call(textarea, newValue);
if (oldValue != newValue) {
opts = JSON.parse(textarea.value)
opts = JSON.parse(textarea.value);
}
executeCallbacks(optionsChangedCallbacks);
@ -319,77 +324,83 @@ onUiUpdate(function(){
}
});
json_elem.parentElement.style.display="none"
json_elem.parentElement.style.display = "none";
function registerTextarea(id, id_counter, id_button) {
var prompt = gradioApp().getElementById(id)
var counter = gradioApp().getElementById(id_counter)
var prompt = gradioApp().getElementById(id);
var counter = gradioApp().getElementById(id_counter);
var textarea = gradioApp().querySelector("#" + id + " > label > textarea");
if (counter.parentElement == prompt.parentElement) {
return
return;
}
prompt.parentElement.insertBefore(counter, prompt)
prompt.parentElement.style.position = "relative"
prompt.parentElement.insertBefore(counter, prompt);
prompt.parentElement.style.position = "relative";
promptTokecountUpdateFuncs[id] = function(){ update_token_counter(id_button); }
promptTokecountUpdateFuncs[id] = function() {
update_token_counter(id_button);
};
textarea.addEventListener("input", promptTokecountUpdateFuncs[id]);
}
registerTextarea('txt2img_prompt', 'txt2img_token_counter', 'txt2img_token_button')
registerTextarea('txt2img_neg_prompt', 'txt2img_negative_token_counter', 'txt2img_negative_token_button')
registerTextarea('img2img_prompt', 'img2img_token_counter', 'img2img_token_button')
registerTextarea('img2img_neg_prompt', 'img2img_negative_token_counter', 'img2img_negative_token_button')
registerTextarea('txt2img_prompt', 'txt2img_token_counter', 'txt2img_token_button');
registerTextarea('txt2img_neg_prompt', 'txt2img_negative_token_counter', 'txt2img_negative_token_button');
registerTextarea('img2img_prompt', 'img2img_token_counter', 'img2img_token_button');
registerTextarea('img2img_neg_prompt', 'img2img_negative_token_counter', 'img2img_negative_token_button');
var show_all_pages = gradioApp().getElementById('settings_show_all_pages')
var settings_tabs = gradioApp().querySelector('#settings div')
var show_all_pages = gradioApp().getElementById('settings_show_all_pages');
var settings_tabs = gradioApp().querySelector('#settings div');
if (show_all_pages && settings_tabs) {
settings_tabs.appendChild(show_all_pages)
settings_tabs.appendChild(show_all_pages);
show_all_pages.onclick = function() {
gradioApp().querySelectorAll('#settings > div').forEach(function(elem) {
if(elem.id == "settings_tab_licenses")
if (elem.id == "settings_tab_licenses") {
return;
}
elem.style.display = "block";
})
});
};
}
}
})
});
onOptionsChanged(function() {
var elem = gradioApp().getElementById('sd_checkpoint_hash')
var sd_checkpoint_hash = opts.sd_checkpoint_hash || ""
var shorthash = sd_checkpoint_hash.substring(0,10)
var elem = gradioApp().getElementById('sd_checkpoint_hash');
var sd_checkpoint_hash = opts.sd_checkpoint_hash || "";
var shorthash = sd_checkpoint_hash.substring(0, 10);
if (elem && elem.textContent != shorthash) {
elem.textContent = shorthash
elem.title = sd_checkpoint_hash
elem.href = "https://google.com/search?q=" + sd_checkpoint_hash
elem.textContent = shorthash;
elem.title = sd_checkpoint_hash;
elem.href = "https://google.com/search?q=" + sd_checkpoint_hash;
}
})
});
let txt2img_textarea, img2img_textarea = undefined;
let wait_time = 800
let wait_time = 800;
let token_timeouts = {};
function update_txt2img_tokens(...args) {
update_token_counter("txt2img_token_button")
if (args.length == 2)
return args[0]
update_token_counter("txt2img_token_button");
if (args.length == 2) {
return args[0];
}
return args;
}
function update_img2img_tokens(...args) {
update_token_counter("img2img_token_button")
if (args.length == 2)
return args[0]
update_token_counter("img2img_token_button");
if (args.length == 2) {
return args[0];
}
return args;
}
function update_token_counter(button_id) {
if (token_timeouts[button_id])
if (token_timeouts[button_id]) {
clearTimeout(token_timeouts[button_id]);
}
token_timeouts[button_id] = setTimeout(() => gradioApp().getElementById(button_id)?.click(), wait_time);
}
@ -401,19 +412,19 @@ function restart_reload(){
location.reload();
}, function() {
setTimeout(requestPing, 500);
})
}
});
};
setTimeout(requestPing, 2000);
return []
return [];
}
// Simulate an `input` DOM event for Gradio Textbox component. Needed after you edit its contents in javascript, otherwise your edits
// will only visible on web page and not sent to python.
function updateInput(target) {
let e = new Event("input", { bubbles: true })
Object.defineProperty(e, "target", {value: target})
let e = new Event("input", { bubbles: true });
Object.defineProperty(e, "target", {value: target});
target.dispatchEvent(e);
}
@ -421,12 +432,12 @@ function updateInput(target){
var desiredCheckpointName = null;
function selectCheckpoint(name) {
desiredCheckpointName = name;
gradioApp().getElementById('change_checkpoint').click()
gradioApp().getElementById('change_checkpoint').click();
}
function currentImg2imgSourceResolution(_, _, scaleBy) {
var img = gradioApp().querySelector('#mode_img2img > div[style="display: block;"] img')
return img ? [img.naturalWidth, img.naturalHeight, scaleBy] : [0, 0, scaleBy]
var img = gradioApp().querySelector('#mode_img2img > div[style="display: block;"] img');
return img ? [img.naturalWidth, img.naturalHeight, scaleBy] : [0, 0, scaleBy];
}
function updateImg2imgResizeToTextAfterChangingImage() {
@ -434,8 +445,8 @@ function updateImg2imgResizeToTextAfterChangingImage(){
// There may be a better solution, but this is simple and straightforward so I'm going with it.
setTimeout(function() {
gradioApp().getElementById('img2img_update_resize_to').click()
gradioApp().getElementById('img2img_update_resize_to').click();
}, 500);
return []
return [];
}

76
javascript/ui_settings_hints.js
View File

@ -1,62 +1,62 @@
// various hints and extra info for the settings tab
settingsHintsSetup = false
settingsHintsSetup = false;
onOptionsChanged(function() {
if(settingsHintsSetup) return
settingsHintsSetup = true
if (settingsHintsSetup) return;
settingsHintsSetup = true;
gradioApp().querySelectorAll('#settings [id^=setting_]').forEach(function(div) {
var name = div.id.substr(8)
var commentBefore = opts._comments_before[name]
var commentAfter = opts._comments_after[name]
var name = div.id.substr(8);
var commentBefore = opts._comments_before[name];
var commentAfter = opts._comments_after[name];
if(! commentBefore && !commentAfter) return
if (!commentBefore && !commentAfter) return;
var span = null
if(div.classList.contains('gradio-checkbox')) span = div.querySelector('label span')
else if(div.classList.contains('gradio-checkboxgroup')) span = div.querySelector('span').firstChild
else if(div.classList.contains('gradio-radio')) span = div.querySelector('span').firstChild
else span = div.querySelector('label span').firstChild
var span = null;
if (div.classList.contains('gradio-checkbox')) span = div.querySelector('label span');
else if (div.classList.contains('gradio-checkboxgroup')) span = div.querySelector('span').firstChild;
else if (div.classList.contains('gradio-radio')) span = div.querySelector('span').firstChild;
else span = div.querySelector('label span').firstChild;
if(!span) return
if (!span) return;
if (commentBefore) {
var comment = document.createElement('DIV')
comment.className = 'settings-comment'
comment.innerHTML = commentBefore
span.parentElement.insertBefore(document.createTextNode('\xa0'), span)
span.parentElement.insertBefore(comment, span)
span.parentElement.insertBefore(document.createTextNode('\xa0'), span)
var comment = document.createElement('DIV');
comment.className = 'settings-comment';
comment.innerHTML = commentBefore;
span.parentElement.insertBefore(document.createTextNode('\xa0'), span);
span.parentElement.insertBefore(comment, span);
span.parentElement.insertBefore(document.createTextNode('\xa0'), span);
}
if (commentAfter) {
var comment = document.createElement('DIV')
comment.className = 'settings-comment'
comment.innerHTML = commentAfter
span.parentElement.insertBefore(comment, span.nextSibling)
span.parentElement.insertBefore(document.createTextNode('\xa0'), span.nextSibling)
var comment = document.createElement('DIV');
comment.className = 'settings-comment';
comment.innerHTML = commentAfter;
span.parentElement.insertBefore(comment, span.nextSibling);
span.parentElement.insertBefore(document.createTextNode('\xa0'), span.nextSibling);
}
})
})
});
});
function settingsHintsShowQuicksettings() {
requestGet("./internal/quicksettings-hint", {}, function(data) {
var table = document.createElement('table')
table.className = 'settings-value-table'
var table = document.createElement('table');
table.className = 'settings-value-table';
data.forEach(function(obj) {
var tr = document.createElement('tr')
var td = document.createElement('td')
td.textContent = obj.name
tr.appendChild(td)
var tr = document.createElement('tr');
var td = document.createElement('td');
td.textContent = obj.name;
tr.appendChild(td);
var td = document.createElement('td')
td.textContent = obj.label
tr.appendChild(td)
var td = document.createElement('td');
td.textContent = obj.label;
tr.appendChild(td);
table.appendChild(tr)
})
table.appendChild(tr);
});
popup(table);
})
});
}

46
script.js
View File

@ -1,47 +1,53 @@
function gradioApp() {
const elems = document.getElementsByTagName('gradio-app')
const elem = elems.length == 0 ? document : elems[0]
const elems = document.getElementsByTagName('gradio-app');
const elem = elems.length == 0 ? document : elems[0];
if (elem !== document) elem.getElementById = function(id){ return document.getElementById(id) }
return elem.shadowRoot ? elem.shadowRoot : elem
if (elem !== document) {
elem.getElementById = function(id) {
return document.getElementById(id);
};
}
return elem.shadowRoot ? elem.shadowRoot : elem;
}
function get_uiCurrentTab() {
return gradioApp().querySelector('#tabs button.selected')
return gradioApp().querySelector('#tabs button.selected');
}
function get_uiCurrentTabContent() {
return gradioApp().querySelector('.tabitem[id^=tab_]:not([style*="display: none"])')
return gradioApp().querySelector('.tabitem[id^=tab_]:not([style*="display: none"])');
}
uiUpdateCallbacks = []
uiLoadedCallbacks = []
uiTabChangeCallbacks = []
optionsChangedCallbacks = []
let uiCurrentTab = null
uiUpdateCallbacks = [];
uiLoadedCallbacks = [];
uiTabChangeCallbacks = [];
optionsChangedCallbacks = [];
let uiCurrentTab = null;
function onUiUpdate(callback) {
uiUpdateCallbacks.push(callback)
uiUpdateCallbacks.push(callback);
}
function onUiLoaded(callback) {
uiLoadedCallbacks.push(callback)
uiLoadedCallbacks.push(callback);
}
function onUiTabChange(callback) {
uiTabChangeCallbacks.push(callback)
uiTabChangeCallbacks.push(callback);
}
function onOptionsChanged(callback) {
optionsChangedCallbacks.push(callback)
optionsChangedCallbacks.push(callback);
}
function runCallback(x, m) {
try {
x(m)
x(m);
} catch (e) {
(console.error || console.log).call(console, e.message, e);
}
}
function executeCallbacks(queue, m) {
queue.forEach(function(x){runCallback(x, m)})
queue.forEach(function(x) {
runCallback(x, m);
});
}
var executedOnLoaded = false;
@ -60,7 +66,7 @@ document.addEventListener("DOMContentLoaded", function() {
executeCallbacks(uiTabChangeCallbacks);
}
});
mutationObserver.observe( gradioApp(), { childList:true, subtree:true })
mutationObserver.observe(gradioApp(), { childList: true, subtree: true });
});
/**
@ -80,7 +86,7 @@ document.addEventListener('keydown', function(e) {
}
e.preventDefault();
}
})
});
/**
* checks that a UI element is not in another hidden element or tab content
@ -95,7 +101,7 @@ function uiElementIsVisible(el) {
if (!isVisible) {
return false;
} else if (el.parentElement) {
el = el.parentElement
el = el.parentElement;
} else {
break;
}