Merge branch 'main_upstream'

# Conflicts:
#	webui.py

javascript/localization.js

@@ -80,6 +80,12 @@ function refresh_style_localization() {
     processNode(document.querySelector('.style_selections'));
 }
 
+function refresh_aspect_ratios_label(value) {
+    label = document.querySelector('#aspect_ratios_accordion div span[data-original-text="Aspect Ratios"]')
+    translation = getTranslation("Aspect Ratios")
+    label.textContent = translation + " " + htmlDecode(value)
+}
+
 function localizeWholePage() {
     processNode(gradioApp());
 

javascript/script.js

@@ -256,3 +256,8 @@ function set_theme(theme) {
         window.location.replace(gradioURL + '?__theme=' + theme);
     }
 }
+
+function htmlDecode(input) {
+  var doc = new DOMParser().parseFromString(input, "text/html");
+  return doc.documentElement.textContent;
+}

update_log.md

@@ -1,5 +1,6 @@
 # [2.4.0](https://github.com/lllyasviel/Fooocus/releases/tag/v2.4.0)
 
+* Change settings tab elements to be more compact
 * Add clip skip slider
 * Add select for custom VAE
 * Add new style "Random Style"

webui.py

@@ -332,21 +332,15 @@ with shared.gradio_root:
                                                  value=modules.config.default_performance,
                                                  elem_classes='performance_selections')
 
-                with gr.Accordion(label='Aspect Ratios', open=False) as aspect_ratios_accordion:
+                with gr.Accordion(label='Aspect Ratios', open=False, elem_id='aspect_ratios_accordion') as aspect_ratios_accordion:
                     aspect_ratios_selection = gr.Radio(label='Aspect Ratios', show_label=False,
                                                        choices=modules.config.available_aspect_ratios_labels,
                                                        value=modules.config.default_aspect_ratio,
                                                        info='width × height',
                                                        elem_classes='aspect_ratios')
 
-                    def change_aspect_ratio(text):
-                        import re
-                        regex = re.compile('<.*?>')
-                        cleaned_text = re.sub(regex, '', text)
-                        return gr.update(label='Aspect Ratios ' + cleaned_text)
-
-                    aspect_ratios_selection.change(change_aspect_ratio, inputs=aspect_ratios_selection, outputs=aspect_ratios_accordion, queue=False, show_progress=False)
-                    shared.gradio_root.load(change_aspect_ratio, inputs=aspect_ratios_selection, outputs=aspect_ratios_accordion, queue=False, show_progress=False)
+                    aspect_ratios_selection.change(lambda x: None, inputs=aspect_ratios_selection, queue=False, show_progress=False, _js='(x)=>{refresh_aspect_ratios_label(x);}')
+                    shared.gradio_root.load(lambda x: None, inputs=aspect_ratios_selection, queue=False, show_progress=False, _js='(x)=>{refresh_aspect_ratios_label(x);}')
 
                 image_number = gr.Slider(label='Image Number', minimum=1, maximum=modules.config.default_max_image_number, step=1, value=modules.config.default_image_number)