From 9477824ac18dc016640d41fd13f3a8ab183908e7 Mon Sep 17 00:00:00 2001
From: binary-husky <qingxu.fu@outlook.com>
Date: Sat, 18 May 2024 21:54:15 +0800
Subject: [PATCH] improve css

---
 themes/common.css                   |  1 +
 themes/common.js                    | 32 ++++++++++++++++++++---------
 themes/gui_advanced_plugin_class.py |  8 +++++++-
 3 files changed, 30 insertions(+), 11 deletions(-)

diff --git a/themes/common.css b/themes/common.css
index d9ade2bc..1512bec8 100644
--- a/themes/common.css
+++ b/themes/common.css
@@ -109,6 +109,7 @@
     border-width: thin;
     user-select: none;
     padding-left: 2%;
+    text-align: center;
 }
 
 .floating-component #input-panel2 {
diff --git a/themes/common.js b/themes/common.js
index 7fb622af..2bcb9ac7 100644
--- a/themes/common.js
+++ b/themes/common.js
@@ -1548,8 +1548,8 @@ async function generate_menu(guiBase64String, btnName){
         visible: true,
         __type__: 'update'
     }, "plugin_arg_menu", "obj");
-
-    // 根据 gui_args，使得对应参数项显现
+    hide_all_elem();
+    // 根据 gui_args, 使得对应参数项显现
     let text_cnt = 0;
     for (const key in gui_args) {
         if (gui_args.hasOwnProperty(key)) {
@@ -1558,6 +1558,8 @@ async function generate_menu(guiBase64String, btnName){
                 push_data_to_gradio_component({
                     visible: true,
                     label: gui_args[key].title + "(" + gui_args[key].description +  ")",
+                    // label: gui_args[key].title,
+                    placeholder: gui_args[key].description,
                     __type__: 'update'
                 }, component_name, "obj");
                 if (key === "main_input"){
@@ -1574,6 +1576,7 @@ async function generate_menu(guiBase64String, btnName){
                 else {
                     push_data_to_gradio_component(gui_args[key].default_value, component_name, "obj");
                 }
+                document.getElementById(component_name).parentNode.parentNode.style.display = '';
                 text_cnt += 1;
             }
         }
@@ -1609,18 +1612,31 @@ async function execute_current_pop_up_plugin(){
         visible: false,
         __type__: 'update'
     }, "plugin_arg_menu", "obj");
+    hide_all_elem();
+
+    // execute the plugin
+    push_data_to_gradio_component(JSON.stringify(gui_args), "invisible_current_pop_up_plugin_arg_final", "string");
+    document.getElementById("invisible_callback_btn_for_plugin_exe").click();
+
+}
+
+function hide_all_elem(){
     for (text_cnt = 0; text_cnt < 8; text_cnt++){
         push_data_to_gradio_component({
             visible: false,
             label: "",
             __type__: 'update'
         }, "plugin_arg_txt_"+text_cnt, "obj");
+        document.getElementById("plugin_arg_txt_"+text_cnt).parentNode.parentNode.style.display = 'none';
     }
+}
 
-    // execute the plugin
-    push_data_to_gradio_component(JSON.stringify(gui_args), "invisible_current_pop_up_plugin_arg_final", "string");
-    document.getElementById("invisible_callback_btn_for_plugin_exe").click();
-
+function close_current_pop_up_plugin(){
+    push_data_to_gradio_component({
+        visible: false,
+        __type__: 'update'
+    }, "plugin_arg_menu", "obj");
+    hide_all_elem();
 }
 
 
@@ -1630,7 +1646,3 @@ async function execute_current_pop_up_plugin(){
 
 
 
-
-
-
-
diff --git a/themes/gui_advanced_plugin_class.py b/themes/gui_advanced_plugin_class.py
index 96244a03..d72f866e 100644
--- a/themes/gui_advanced_plugin_class.py
+++ b/themes/gui_advanced_plugin_class.py
@@ -18,8 +18,14 @@ def define_gui_advanced_plugin_class(plugins):
                         elem_id=f"invisible_current_pop_up_plugin_arg").style(container=False)
                 usr_confirmed_arg = gr.Textbox(show_label=False, placeholder="请输入", lines=1, visible=False,
                         elem_id=f"invisible_current_pop_up_plugin_arg_final").style(container=False)
-                arg_confirm_btn = gr.Button("确认参数并执行", variant="primary");
+
+                arg_confirm_btn = gr.Button("确认参数并执行", variant="stop")
                 arg_confirm_btn.style(size="sm")
+
+                arg_cancel_btn = gr.Button("取消", variant="stop")
+                arg_cancel_btn.click(None, None, None, _js="""()=>close_current_pop_up_plugin()""")
+                arg_cancel_btn.style(size="sm")
+
                 arg_confirm_btn.click(None, None, None, _js="""()=>execute_current_pop_up_plugin()""")
                 invisible_callback_btn_for_plugin_exe = gr.Button(r"未选定任何插件", variant="secondary", visible=False, elem_id="invisible_callback_btn_for_plugin_exe").style(size="sm")
                 # 随变按钮的回调函数注册