Merge branch 'dev' into text-drag-fix

1 files changed, 62 insertions, 41 deletions

diff --git a/javascript/ui_settings_hints.js b/javascript/ui_settings_hints.js
index 87a289d3..e216852b 100644
--- a/javascript/ui_settings_hints.js
+++ b/javascript/ui_settings_hints.js
@@ -1,41 +1,62 @@
-// 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);

-        })

-    });

-})

-

-

+// various hints and extra info for the settings tab
+
+var settingsHintsSetup = false;
+
+onOptionsChanged(function() {
+    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];
+
+        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;
+
+        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);
+        }
+        if (commentAfter) {
+            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';
+
+        data.forEach(function(obj) {
+            var tr = document.createElement('tr');
+            var td = document.createElement('td');
+            td.textContent = obj.name;
+            tr.appendChild(td);
+
+            td = document.createElement('td');
+            td.textContent = obj.label;
+            tr.appendChild(td);
+
+            table.appendChild(tr);
+        });
+
+        popup(table);
+    });
+}