aboutsummaryrefslogtreecommitdiff
path: root/javascript
diff options
context:
space:
mode:
Diffstat (limited to 'javascript')
-rw-r--r--javascript/contextMenus.js3
-rw-r--r--javascript/extraNetworks.js25
-rw-r--r--javascript/hints.js14
-rw-r--r--javascript/imageviewerGamepad.js85
-rw-r--r--javascript/localization.js68
-rw-r--r--javascript/ui.js14
-rw-r--r--javascript/ui_settings_hints.js41
7 files changed, 173 insertions, 77 deletions
diff --git a/javascript/contextMenus.js b/javascript/contextMenus.js
index 42f301ab..b2bdf053 100644
--- a/javascript/contextMenus.js
+++ b/javascript/contextMenus.js
@@ -92,8 +92,7 @@ contextMenuInit = function(){
return;
}
gradioApp().addEventListener("click", function(e) {
- let source = e.composedPath()[0]
- if(source.id && source.id.indexOf('check_progress')>-1){
+ if(! e.isTrusted){
return
}
diff --git a/javascript/extraNetworks.js b/javascript/extraNetworks.js
index c8f6b386..c85bc79a 100644
--- a/javascript/extraNetworks.js
+++ b/javascript/extraNetworks.js
@@ -1,4 +1,3 @@
-
function setupExtraNetworksForTab(tabname){
gradioApp().querySelector('#'+tabname+'_extra_tabs').classList.add('extra-networks')
@@ -10,16 +9,34 @@ function setupExtraNetworksForTab(tabname){
tabs.appendChild(search)
tabs.appendChild(refresh)
- search.addEventListener("input", function(){
+ var applyFilter = function(){
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()
- elem.style.display = text.indexOf(searchTerm) == -1 ? "none" : ""
+
+ var visible = text.indexOf(searchTerm) != -1
+
+ if(searchOnly && searchTerm.length < 4){
+ visible = false
+ }
+
+ elem.style.display = visible ? "" : "none"
})
- });
+ }
+
+ search.addEventListener("input", applyFilter);
+ applyFilter();
+
+ extraNetworksApplyFilter[tabname] = applyFilter;
+}
+
+function applyExtraNetworkFilter(tabname){
+ setTimeout(extraNetworksApplyFilter[tabname], 1);
}
+var extraNetworksApplyFilter = {}
var activePromptTextarea = {};
function setupExtraNetworks(){
diff --git a/javascript/hints.js b/javascript/hints.js
index 8d1967a7..3746df99 100644
--- a/javascript/hints.js
+++ b/javascript/hints.js
@@ -66,8 +66,8 @@ titles = {
"Interrogate": "Reconstruct prompt from existing image and put it into the prompt field.",
- "Images filename pattern": "Use following tags to define how filenames for images are chosen: [steps], [cfg], [clip_skip], [batch_number], [generation_number], [prompt_hash], [prompt], [prompt_no_styles], [prompt_spaces], [width], [height], [styles], [sampler], [seed], [model_hash], [model_name], [prompt_words], [date], [datetime], [datetime<Format>], [datetime<Format><Time Zone>], [job_timestamp], [hasprompt<prompt1|default><prompt2>..]; leave empty for default.",
- "Directory name pattern": "Use following tags to define how subdirectories for images and grids are chosen: [steps], [cfg], [clip_skip], [batch_number], [generation_number], [prompt_hash], [prompt], [prompt_no_styles], [prompt_spaces], [width], [height], [styles], [sampler], [seed], [model_hash], [model_name], [prompt_words], [date], [datetime], [datetime<Format>], [datetime<Format><Time Zone>], [job_timestamp], [hasprompt<prompt1|default><prompt2>..]; leave empty for default.",
+ "Images filename pattern": "Use following tags to define how filenames for images are chosen: [steps], [cfg], [denoising], [clip_skip], [batch_number], [generation_number], [prompt_hash], [prompt], [prompt_no_styles], [prompt_spaces], [width], [height], [styles], [sampler], [seed], [model_hash], [model_name], [prompt_words], [date], [datetime], [datetime<Format>], [datetime<Format><Time Zone>], [job_timestamp], [hasprompt<prompt1|default><prompt2>..]; leave empty for default.",
+ "Directory name pattern": "Use following tags to define how subdirectories for images and grids are chosen: [steps], [cfg], [denoising], [clip_skip], [batch_number], [generation_number], [prompt_hash], [prompt], [prompt_no_styles], [prompt_spaces], [width], [height], [styles], [sampler], [seed], [model_hash], [model_name], [prompt_words], [date], [datetime], [datetime<Format>], [datetime<Format><Time Zone>], [job_timestamp], [hasprompt<prompt1|default><prompt2>..]; leave empty for default.",
"Max prompt words": "Set the maximum number of words to be used in the [prompt_words] option; ATTENTION: If the words are too long, they may exceed the maximum length of the file path that the system can handle",
"Loopback": "Performs img2img processing multiple times. Output images are used as input for the next loop.",
@@ -120,16 +120,16 @@ onUiUpdate(function(){
gradioApp().querySelectorAll('span, button, select, p').forEach(function(span){
if (span.title) return; // already has a title
- let tooltip = titles[span.textContent];
+ let tooltip = localization[titles[span.textContent]] || titles[span.textContent];
- if(!tooltip){
- tooltip = titles[span.value];
+ if(!tooltip){
+ tooltip = localization[titles[span.value]] || titles[span.value];
}
if(!tooltip){
for (const c of span.classList) {
if (c in titles) {
- tooltip = titles[c];
+ tooltip = localization[titles[c]] || titles[c];
break;
}
}
@@ -144,7 +144,7 @@ onUiUpdate(function(){
if (select.onchange != null) return;
select.onchange = function(){
- select.title = titles[select.value] || "";
+ select.title = localization[titles[select.value]] || titles[select.value] || "";
}
})
})
diff --git a/javascript/imageviewerGamepad.js b/javascript/imageviewerGamepad.js
index 29bd7140..6297a12b 100644
--- a/javascript/imageviewerGamepad.js
+++ b/javascript/imageviewerGamepad.js
@@ -1,36 +1,57 @@
- let delay = 350//ms
- window.addEventListener('gamepadconnected', (e) => {
- console.log("Gamepad connected!")
- const gamepad = e.gamepad;
- setInterval(() => {
- const xValue = gamepad.axes[0].toFixed(2);
- if (xValue < -0.3) {
- modalPrevImage(e);
- } else if (xValue > 0.3) {
- modalNextImage(e);
- }
-
- }, delay);
- });
-
-
- /*
- Primarily for vr controller type pointer devices.
- I use the wheel event because there's currently no way to do it properly with web xr.
- */
-
- let isScrolling = false;
- window.addEventListener('wheel', (e) => {
- if (isScrolling) return;
- isScrolling = true;
-
- if (e.deltaX <= -0.6) {
+window.addEventListener('gamepadconnected', (e) => {
+ const index = e.gamepad.index;
+ let isWaiting = false;
+ setInterval(async () => {
+ if (!opts.js_modal_lightbox_gamepad || isWaiting) return;
+ const gamepad = navigator.getGamepads()[index];
+ const xValue = gamepad.axes[0];
+ if (xValue <= -0.3) {
modalPrevImage(e);
- } else if (e.deltaX >= 0.6) {
+ isWaiting = true;
+ } else if (xValue >= 0.3) {
modalNextImage(e);
+ isWaiting = true;
}
+ if (isWaiting) {
+ await sleepUntil(() => {
+ const xValue = navigator.getGamepads()[index].axes[0]
+ if (xValue < 0.3 && xValue > -0.3) {
+ return true;
+ }
+ }, opts.js_modal_lightbox_gamepad_repeat);
+ isWaiting = false;
+ }
+ }, 10);
+});
+
+/*
+Primarily for vr controller type pointer devices.
+I use the wheel event because there's currently no way to do it properly with web xr.
+ */
+let isScrolling = false;
+window.addEventListener('wheel', (e) => {
+ if (!opts.js_modal_lightbox_gamepad || isScrolling) return;
+ isScrolling = true;
+
+ if (e.deltaX <= -0.6) {
+ modalPrevImage(e);
+ } else if (e.deltaX >= 0.6) {
+ modalNextImage(e);
+ }
- setTimeout(() => {
- isScrolling = false;
- }, delay);
- }); \ No newline at end of file
+ setTimeout(() => {
+ isScrolling = false;
+ }, opts.js_modal_lightbox_gamepad_repeat);
+});
+
+function sleepUntil(f, timeout) {
+ return new Promise((resolve) => {
+ const timeStart = new Date();
+ const wait = setInterval(function() {
+ if (f() || new Date() - timeStart > timeout) {
+ clearInterval(wait);
+ resolve();
+ }
+ }, 20);
+ });
+}
diff --git a/javascript/localization.js b/javascript/localization.js
index e1ffa271..0123b877 100644
--- a/javascript/localization.js
+++ b/javascript/localization.js
@@ -25,6 +25,10 @@ re_emoji = /[\p{Extended_Pictographic}\u{1F3FB}-\u{1F3FF}\u{1F9B0}-\u{1F9B3}]/u
original_lines = {}
translated_lines = {}
+function hasLocalization() {
+ return window.localization && Object.keys(window.localization).length > 0;
+}
+
function textNodesUnder(el){
var n, a=[], walk=document.createTreeWalker(el,NodeFilter.SHOW_TEXT,null,false);
while(n=walk.nextNode()) a.push(n);
@@ -119,37 +123,6 @@ function dumpTranslations(){
return dumped
}
-onUiUpdate(function(m){
- m.forEach(function(mutation){
- mutation.addedNodes.forEach(function(node){
- processNode(node)
- })
- });
-})
-
-
-document.addEventListener("DOMContentLoaded", function() {
- processNode(gradioApp())
-
- if (localization.rtl) { // if the language is from right to left,
- (new MutationObserver((mutations, observer) => { // wait for the style to load
- mutations.forEach(mutation => {
- mutation.addedNodes.forEach(node => {
- if (node.tagName === 'STYLE') {
- observer.disconnect();
-
- for (const x of node.sheet.rules) { // find all rtl media rules
- if (Array.from(x.media || []).includes('rtl')) {
- x.media.appendMedium('all'); // enable them
- }
- }
- }
- })
- });
- })).observe(gradioApp(), { childList: true });
- }
-})
-
function download_localization() {
var text = JSON.stringify(dumpTranslations(), null, 4)
@@ -163,3 +136,36 @@ function download_localization() {
document.body.removeChild(element);
}
+
+if(hasLocalization()) {
+ onUiUpdate(function (m) {
+ m.forEach(function (mutation) {
+ mutation.addedNodes.forEach(function (node) {
+ processNode(node)
+ })
+ });
+ })
+
+
+ document.addEventListener("DOMContentLoaded", function () {
+ processNode(gradioApp())
+
+ if (localization.rtl) { // if the language is from right to left,
+ (new MutationObserver((mutations, observer) => { // wait for the style to load
+ mutations.forEach(mutation => {
+ mutation.addedNodes.forEach(node => {
+ if (node.tagName === 'STYLE') {
+ observer.disconnect();
+
+ for (const x of node.sheet.rules) { // find all rtl media rules
+ if (Array.from(x.media || []).includes('rtl')) {
+ x.media.appendMedium('all'); // enable them
+ }
+ }
+ }
+ })
+ });
+ })).observe(gradioApp(), { childList: true });
+ }
+ })
+}
diff --git a/javascript/ui.js b/javascript/ui.js
index b63b84b2..ed9673d6 100644
--- a/javascript/ui.js
+++ b/javascript/ui.js
@@ -348,6 +348,9 @@ onUiUpdate(function(){
settings_tabs.appendChild(show_all_pages)
show_all_pages.onclick = function(){
gradioApp().querySelectorAll('#settings > div').forEach(function(elem){
+ if(elem.id == "settings_tab_licenses")
+ return;
+
elem.style.display = "block";
})
}
@@ -392,7 +395,16 @@ function update_token_counter(button_id) {
function restart_reload(){
document.body.innerHTML='<h1 style="font-family:monospace;margin-top:20%;color:lightgray;text-align:center;">Reloading...</h1>';
- setTimeout(function(){location.reload()},2000)
+
+ var requestPing = function(){
+ requestGet("./internal/ping", {}, function(data){
+ location.reload();
+ }, function(){
+ setTimeout(requestPing, 500);
+ })
+ }
+
+ setTimeout(requestPing, 2000);
return []
}
diff --git a/javascript/ui_settings_hints.js b/javascript/ui_settings_hints.js
new file mode 100644
index 00000000..87a289d3
--- /dev/null
+++ b/javascript/ui_settings_hints.js
@@ -0,0 +1,41 @@
+// various hints and extra info for the settings tab
+
+onUiLoaded(function(){
+ createLink = function(elem_id, text, href){
+ var a = document.createElement('A')
+ a.textContent = text
+ a.target = '_blank';
+
+ elem = gradioApp().querySelector('#'+elem_id)
+ elem.insertBefore(a, elem.querySelector('label'))
+
+ return a
+ }
+
+ createLink("setting_samples_filename_pattern", "[wiki] ").href = "https://github.com/AUTOMATIC1111/stable-diffusion-webui/wiki/Custom-Images-Filename-Name-and-Subdirectory"
+ createLink("setting_directories_filename_pattern", "[wiki] ").href = "https://github.com/AUTOMATIC1111/stable-diffusion-webui/wiki/Custom-Images-Filename-Name-and-Subdirectory"
+
+ createLink("setting_quicksettings_list", "[info] ").addEventListener("click", function(event){
+ requestGet("./internal/quicksettings-hint", {}, function(data){
+ 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 td = document.createElement('td')
+ td.textContent = obj.label
+ tr.appendChild(td)
+
+ table.appendChild(tr)
+ })
+
+ popup(table);
+ })
+ });
+})
+
+