aboutsummaryrefslogtreecommitdiffstats
path: root/javascript
diff options
context:
space:
mode:
Diffstat (limited to 'javascript')
-rw-r--r--javascript/badScaleChecker.js108
-rw-r--r--javascript/extraNetworks.js39
-rw-r--r--javascript/hints.js11
-rw-r--r--javascript/imageviewer.js5
-rw-r--r--javascript/localStorage.js26
-rw-r--r--javascript/localization.js10
-rw-r--r--javascript/ui.js18
7 files changed, 88 insertions, 129 deletions
diff --git a/javascript/badScaleChecker.js b/javascript/badScaleChecker.js
deleted file mode 100644
index 625ad309..00000000
--- a/javascript/badScaleChecker.js
+++ /dev/null
@@ -1,108 +0,0 @@
-(function() {
- var ignore = localStorage.getItem("bad-scale-ignore-it") == "ignore-it";
-
- function getScale() {
- var ratio = 0,
- screen = window.screen,
- ua = navigator.userAgent.toLowerCase();
-
- if (window.devicePixelRatio !== undefined) {
- ratio = window.devicePixelRatio;
- } else if (~ua.indexOf('msie')) {
- if (screen.deviceXDPI && screen.logicalXDPI) {
- ratio = screen.deviceXDPI / screen.logicalXDPI;
- }
- } else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {
- ratio = window.outerWidth / window.innerWidth;
- }
-
- return ratio == 0 ? 0 : Math.round(ratio * 100);
- }
-
- var showing = false;
-
- var div = document.createElement("div");
- div.style.position = "fixed";
- div.style.top = "0px";
- div.style.left = "0px";
- div.style.width = "100vw";
- div.style.backgroundColor = "firebrick";
- div.style.textAlign = "center";
- div.style.zIndex = 99;
-
- var b = document.createElement("b");
- b.innerHTML = 'Bad Scale: ??% ';
-
- div.appendChild(b);
-
- var note1 = document.createElement("p");
- note1.innerHTML = "Change your browser or your computer settings!";
- note1.title = 'Just make sure "computer-scale" * "browser-scale" = 100% ,\n' +
- "you can keep your computer-scale and only change this page's scale,\n" +
- "for example: your computer-scale is 125%, just use [\"CTRL\"+\"-\"] to make your browser-scale of this page to 80%.";
- div.appendChild(note1);
-
- var note2 = document.createElement("p");
- note2.innerHTML = " Otherwise, it will cause this page to not function properly!";
- note2.title = "When you click \"Copy image to: [inpaint sketch]\" in some img2img's tab,\n" +
- "if scale<100% the canvas will be invisible,\n" +
- "else if scale>100% this page will take large amount of memory and CPU performance.";
- div.appendChild(note2);
-
- var btn = document.createElement("button");
- btn.innerHTML = "Click here to ignore";
-
- div.appendChild(btn);
-
- function tryShowTopBar(scale) {
- if (showing) return;
-
- b.innerHTML = 'Bad Scale: ' + scale + '% ';
-
- var updateScaleTimer = setInterval(function() {
- var newScale = getScale();
- b.innerHTML = 'Bad Scale: ' + newScale + '% ';
- if (newScale == 100) {
- var p = div.parentNode;
- if (p != null) p.removeChild(div);
- showing = false;
- clearInterval(updateScaleTimer);
- check();
- }
- }, 999);
-
- btn.onclick = function() {
- clearInterval(updateScaleTimer);
- var p = div.parentNode;
- if (p != null) p.removeChild(div);
- ignore = true;
- showing = false;
- localStorage.setItem("bad-scale-ignore-it", "ignore-it");
- };
-
- document.body.appendChild(div);
- }
-
- function check() {
- if (!ignore) {
- var timer = setInterval(function() {
- var scale = getScale();
- if (scale != 100 && !ignore) {
- tryShowTopBar(scale);
- clearInterval(timer);
- }
- if (ignore) {
- clearInterval(timer);
- }
- }, 999);
- }
- }
-
- if (document.readyState != "complete") {
- document.onreadystatechange = function() {
- if (document.readyState != "complete") check();
- };
- } else {
- check();
- }
-})();
diff --git a/javascript/extraNetworks.js b/javascript/extraNetworks.js
index 5582a6e5..897ebeba 100644
--- a/javascript/extraNetworks.js
+++ b/javascript/extraNetworks.js
@@ -1,20 +1,38 @@
+function toggleCss(key, css, enable) {
+ var style = document.getElementById(key);
+ if (enable && !style) {
+ style = document.createElement('style');
+ style.id = key;
+ style.type = 'text/css';
+ document.head.appendChild(style);
+ }
+ if (style && !enable) {
+ document.head.removeChild(style);
+ }
+ if (style) {
+ style.innerHTML == '';
+ style.appendChild(document.createTextNode(css));
+ }
+}
+
function setupExtraNetworksForTab(tabname) {
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 searchDiv = gradioApp().getElementById(tabname + '_extra_search');
+ var search = searchDiv.querySelector('textarea');
var sort = gradioApp().getElementById(tabname + '_extra_sort');
var sortOrder = gradioApp().getElementById(tabname + '_extra_sortorder');
var refresh = gradioApp().getElementById(tabname + '_extra_refresh');
+ var showDirsDiv = gradioApp().getElementById(tabname + '_extra_show_dirs');
+ var showDirs = gradioApp().querySelector('#' + tabname + '_extra_show_dirs input');
- search.classList.add('search');
- sort.classList.add('sort');
- sortOrder.classList.add('sortorder');
sort.dataset.sortkey = 'sortDefault';
- tabs.appendChild(search);
+ tabs.appendChild(searchDiv);
tabs.appendChild(sort);
tabs.appendChild(sortOrder);
tabs.appendChild(refresh);
+ tabs.appendChild(showDirsDiv);
var applyFilter = function() {
var searchTerm = search.value.toLowerCase();
@@ -80,6 +98,15 @@ function setupExtraNetworksForTab(tabname) {
});
extraNetworksApplyFilter[tabname] = applyFilter;
+
+ var showDirsUpdate = function() {
+ var css = '#' + tabname + '_extra_tabs .extra-network-subdirs { display: none; }';
+ toggleCss(tabname + '_extra_show_dirs_style', css, !showDirs.checked);
+ localSet('extra-networks-show-dirs', showDirs.checked ? 1 : 0);
+ };
+ showDirs.checked = localGet('extra-networks-show-dirs', 1) == 1;
+ showDirs.addEventListener("change", showDirsUpdate);
+ showDirsUpdate();
}
function applyExtraNetworkFilter(tabname) {
@@ -179,7 +206,7 @@ function saveCardPreview(event, tabname, filename) {
}
function extraNetworksSearchButton(tabs_id, event) {
- var searchTextarea = gradioApp().querySelector("#" + tabs_id + ' > div > textarea');
+ var searchTextarea = gradioApp().querySelector("#" + tabs_id + ' > label > textarea');
var button = event.target;
var text = button.classList.contains("search-all") ? "" : button.textContent.trim();
diff --git a/javascript/hints.js b/javascript/hints.js
index 4167cb28..6de9372e 100644
--- a/javascript/hints.js
+++ b/javascript/hints.js
@@ -190,3 +190,14 @@ onUiUpdate(function(mutationRecords) {
tooltipCheckTimer = setTimeout(processTooltipCheckNodes, 1000);
}
});
+
+onUiLoaded(function() {
+ for (var comp of window.gradio_config.components) {
+ if (comp.props.webui_tooltip && comp.props.elem_id) {
+ var elem = gradioApp().getElementById(comp.props.elem_id);
+ if (elem) {
+ elem.title = comp.props.webui_tooltip;
+ }
+ }
+ }
+});
diff --git a/javascript/imageviewer.js b/javascript/imageviewer.js
index 677e95c1..c21d396e 100644
--- a/javascript/imageviewer.js
+++ b/javascript/imageviewer.js
@@ -136,6 +136,11 @@ function setupImageForLightbox(e) {
var event = isFirefox ? 'mousedown' : 'click';
e.addEventListener(event, function(evt) {
+ if (evt.button == 1) {
+ open(evt.target.src);
+ evt.preventDefault();
+ return;
+ }
if (!opts.js_modal_lightbox || evt.button != 0) return;
modalZoomSet(gradioApp().getElementById('modalImage'), opts.js_modal_lightbox_initially_zoomed);
diff --git a/javascript/localStorage.js b/javascript/localStorage.js
new file mode 100644
index 00000000..dc1a36c3
--- /dev/null
+++ b/javascript/localStorage.js
@@ -0,0 +1,26 @@
+
+function localSet(k, v) {
+ try {
+ localStorage.setItem(k, v);
+ } catch (e) {
+ console.warn(`Failed to save ${k} to localStorage: ${e}`);
+ }
+}
+
+function localGet(k, def) {
+ try {
+ return localStorage.getItem(k);
+ } catch (e) {
+ console.warn(`Failed to load ${k} from localStorage: ${e}`);
+ }
+
+ return def;
+}
+
+function localRemove(k) {
+ try {
+ return localStorage.removeItem(k);
+ } catch (e) {
+ console.warn(`Failed to remove ${k} from localStorage: ${e}`);
+ }
+}
diff --git a/javascript/localization.js b/javascript/localization.js
index eb22b8a7..0c9032f9 100644
--- a/javascript/localization.js
+++ b/javascript/localization.js
@@ -11,11 +11,11 @@ var ignore_ids_for_localization = {
train_hypernetwork: 'OPTION',
txt2img_styles: 'OPTION',
img2img_styles: 'OPTION',
- setting_random_artist_categories: 'SPAN',
- setting_face_restoration_model: 'SPAN',
- setting_realesrgan_enabled_models: 'SPAN',
- extras_upscaler_1: 'SPAN',
- extras_upscaler_2: 'SPAN',
+ setting_random_artist_categories: 'OPTION',
+ setting_face_restoration_model: 'OPTION',
+ setting_realesrgan_enabled_models: 'OPTION',
+ extras_upscaler_1: 'OPTION',
+ extras_upscaler_2: 'OPTION',
};
var re_num = /^[.\d]+$/;
diff --git a/javascript/ui.js b/javascript/ui.js
index d70a681b..bade3089 100644
--- a/javascript/ui.js
+++ b/javascript/ui.js
@@ -152,11 +152,11 @@ function submit() {
showSubmitButtons('txt2img', false);
var id = randomId();
- localStorage.setItem("txt2img_task_id", id);
+ localSet("txt2img_task_id", id);
requestProgress(id, gradioApp().getElementById('txt2img_gallery_container'), gradioApp().getElementById('txt2img_gallery'), function() {
showSubmitButtons('txt2img', true);
- localStorage.removeItem("txt2img_task_id");
+ localRemove("txt2img_task_id");
showRestoreProgressButton('txt2img', false);
});
@@ -171,11 +171,11 @@ function submit_img2img() {
showSubmitButtons('img2img', false);
var id = randomId();
- localStorage.setItem("img2img_task_id", id);
+ localSet("img2img_task_id", id);
requestProgress(id, gradioApp().getElementById('img2img_gallery_container'), gradioApp().getElementById('img2img_gallery'), function() {
showSubmitButtons('img2img', true);
- localStorage.removeItem("img2img_task_id");
+ localRemove("img2img_task_id");
showRestoreProgressButton('img2img', false);
});
@@ -189,9 +189,7 @@ function submit_img2img() {
function restoreProgressTxt2img() {
showRestoreProgressButton("txt2img", false);
- var id = localStorage.getItem("txt2img_task_id");
-
- id = localStorage.getItem("txt2img_task_id");
+ var id = localGet("txt2img_task_id");
if (id) {
requestProgress(id, gradioApp().getElementById('txt2img_gallery_container'), gradioApp().getElementById('txt2img_gallery'), function() {
@@ -205,7 +203,7 @@ function restoreProgressTxt2img() {
function restoreProgressImg2img() {
showRestoreProgressButton("img2img", false);
- var id = localStorage.getItem("img2img_task_id");
+ var id = localGet("img2img_task_id");
if (id) {
requestProgress(id, gradioApp().getElementById('img2img_gallery_container'), gradioApp().getElementById('img2img_gallery'), function() {
@@ -218,8 +216,8 @@ function restoreProgressImg2img() {
onUiLoaded(function() {
- showRestoreProgressButton('txt2img', localStorage.getItem("txt2img_task_id"));
- showRestoreProgressButton('img2img', localStorage.getItem("img2img_task_id"));
+ showRestoreProgressButton('txt2img', localGet("txt2img_task_id"));
+ showRestoreProgressButton('img2img', localGet("img2img_task_id"));
});
generated by cgit v1.2.3 (git 2.25.1) at 2025-05-01 18:29:49 +0000