preserve theme selection

2024-07-04 14:11:51 +00:00
parent 379dcb2fa7
commit f945a7bd19
7 changed files with 209 additions and 169 deletions
--- a/themes/common.js
+++ b/themes/common.js
@@ -1,3 +1,6 @@
+// 标志位
+enable_tts = false;
+
 // -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
 //  第 1 部分: 工具函数
 // -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
@@ -914,131 +917,6 @@ function gpt_academic_gradio_saveload(
    }
 }

-enable_tts = false;
-async function GptAcademicJavaScriptInit(dark, prompt, live2d, layout, tts) {
-    // 第一部分，布局初始化
-    audio_fn_init();
-    minor_ui_adjustment();
-    chatbotIndicator = gradioApp().querySelector('#gpt-chatbot > div.wrap');
-    var chatbotObserver = new MutationObserver(() => {
-        chatbotContentChanged(1);
-    });
-    chatbotObserver.observe(chatbotIndicator, { attributes: true, childList: true, subtree: true });
-    if (layout === "LEFT-RIGHT") { chatbotAutoHeight(); }
-    if (layout === "LEFT-RIGHT") { limit_scroll_position(); }
-
-    // 第二部分，读取Cookie，初始话界面
-    let searchString = "";
-    let bool_value = "";
-    //  darkmode 深色模式
-    if (getCookie("js_darkmode_cookie")) {
-        dark = getCookie("js_darkmode_cookie")
-    }
-    dark = dark == "True";
-    if (document.querySelectorAll('.dark').length) {
-        if (!dark) {
-            document.querySelectorAll('.dark').forEach(el => el.classList.remove('dark'));
-        }
-    } else {
-        if (dark) {
-            document.querySelector('body').classList.add('dark');
-        }
-    }
-
-    //  自动朗读
-    if (tts != "DISABLE"){
-        enable_tts = true;
-        if (getCookie("js_auto_read_cookie")) {
-            auto_read_tts = getCookie("js_auto_read_cookie")
-            auto_read_tts = auto_read_tts == "True";
-            if (auto_read_tts) {
-                allow_auto_read_tts_flag = true;
-            }
-        }
-    }
-
-    // SysPrompt 系统静默提示词
-    gpt_academic_gradio_saveload("load", "elem_prompt", "js_system_prompt_cookie", null, "str");
-    // Temperature 大模型温度参数
-    gpt_academic_gradio_saveload("load", "elem_temperature", "js_temperature_cookie", null, "float");
-    // md_dropdown 大模型类型选择
-    if (getCookie("js_md_dropdown_cookie")) {
-        const cached_model = getCookie("js_md_dropdown_cookie");
-        var model_sel = await get_gradio_component("elem_model_sel");
-        // determine whether the cached model is in the choices
-        if (model_sel.props.choices.includes(cached_model)){
-            // change dropdown
-            gpt_academic_gradio_saveload("load", "elem_model_sel", "js_md_dropdown_cookie", null, "str");
-            // 连锁修改chatbot的label
-            push_data_to_gradio_component({
-                label: '当前模型：' + getCookie("js_md_dropdown_cookie"),
-                __type__: 'update'
-            }, "gpt-chatbot", "obj")
-        }
-    }
-
-
-
-    // clearButton 自动清除按钮
-    if (getCookie("js_clearbtn_show_cookie")) {
-        // have cookie
-        bool_value = getCookie("js_clearbtn_show_cookie")
-        bool_value = bool_value == "True";
-        searchString = "输入清除键";
-
-        if (bool_value) {
-            // make btns appear
-            let clearButton = document.getElementById("elem_clear"); clearButton.style.display = "block";
-            let clearButton2 = document.getElementById("elem_clear2"); clearButton2.style.display = "block";
-            // deal with checkboxes
-            let arr_with_clear_btn = update_array(
-                await get_data_from_gradio_component('cbs'), "输入清除键", "add"
-            )
-            push_data_to_gradio_component(arr_with_clear_btn, "cbs", "no_conversion");
-        } else {
-            // make btns disappear
-            let clearButton = document.getElementById("elem_clear"); clearButton.style.display = "none";
-            let clearButton2 = document.getElementById("elem_clear2"); clearButton2.style.display = "none";
-            // deal with checkboxes
-            let arr_without_clear_btn = update_array(
-                await get_data_from_gradio_component('cbs'), "输入清除键", "remove"
-            )
-            push_data_to_gradio_component(arr_without_clear_btn, "cbs", "no_conversion");
-        }
-    }
-
-    // live2d 显示
-    if (getCookie("js_live2d_show_cookie")) {
-        // have cookie
-        searchString = "添加Live2D形象";
-        bool_value = getCookie("js_live2d_show_cookie");
-        bool_value = bool_value == "True";
-        if (bool_value) {
-            loadLive2D();
-            let arr_with_live2d = update_array(
-                await get_data_from_gradio_component('cbsc'), "添加Live2D形象", "add"
-            )
-            push_data_to_gradio_component(arr_with_live2d, "cbsc", "no_conversion");
-        } else {
-            try {
-                $('.waifu').hide();
-                let arr_without_live2d = update_array(
-                    await get_data_from_gradio_component('cbsc'), "添加Live2D形象", "remove"
-                )
-                push_data_to_gradio_component(arr_without_live2d, "cbsc", "no_conversion");
-            } catch (error) {
-            }
-        }
-    } else {
-        // do not have cookie
-        if (live2d) {
-            loadLive2D();
-        } else {
-        }
-    }
-
-}
-

 function reset_conversation(a, b) {
    // console.log("js_code_reset");
--- a/themes/common.py
+++ b/themes/common.py
@@ -1,3 +1,4 @@
+from functools import cache
 from toolbox import get_conf
 CODE_HIGHLIGHT, ADD_WAIFU, LAYOUT = get_conf("CODE_HIGHLIGHT", "ADD_WAIFU", "LAYOUT")

@@ -23,22 +24,30 @@ def minimize_js(common_js_path):
    except:
        return common_js_path

+@cache
 def get_common_html_javascript_code():
    js = "\n"
-    common_js_path = "themes/common.js"
-    minimized_js_path = minimize_js(common_js_path)
-    for jsf in [
-        f"file={minimized_js_path}",
-    ]:
-        js += f"""<script src="{jsf}"></script>\n"""
+    common_js_path_list = [
+        "themes/common.js",
+        "themes/theme.js",
+        "themes/init.js",
+    ]

-    # 添加Live2D
-    if ADD_WAIFU:
+    if ADD_WAIFU: # 添加Live2D
+        common_js_path_list += [
+            "themes/waifu_plugin/jquery.min.js",
+            "themes/waifu_plugin/jquery-ui.min.js",
+        ]
+
+    for common_js_path in common_js_path_list:
+        if '.min.' not in common_js_path:
+            minimized_js_path = minimize_js(common_js_path)
        for jsf in [
-            "file=themes/waifu_plugin/jquery.min.js",
-            "file=themes/waifu_plugin/jquery-ui.min.js",
+            f"file={minimized_js_path}",
        ]:
            js += f"""<script src="{jsf}"></script>\n"""
-    else:
+
+    if not ADD_WAIFU:
        js += """<script>window.loadLive2D = function(){};</script>\n"""
+
    return js
--- a/themes/init.js
+++ b/themes/init.js
@@ -0,0 +1,125 @@
+async function GptAcademicJavaScriptInit(dark, prompt, live2d, layout, tts) {
+    // 第一部分，布局初始化
+    audio_fn_init();
+    minor_ui_adjustment();
+    chatbotIndicator = gradioApp().querySelector('#gpt-chatbot > div.wrap');
+    var chatbotObserver = new MutationObserver(() => {
+        chatbotContentChanged(1);
+    });
+    chatbotObserver.observe(chatbotIndicator, { attributes: true, childList: true, subtree: true });
+    if (layout === "LEFT-RIGHT") { chatbotAutoHeight(); }
+    if (layout === "LEFT-RIGHT") { limit_scroll_position(); }
+
+    // 第二部分，读取Cookie，初始话界面
+    let searchString = "";
+    let bool_value = "";
+    //  darkmode 深色模式
+    if (getCookie("js_darkmode_cookie")) {
+        dark = getCookie("js_darkmode_cookie")
+    }
+    dark = dark == "True";
+    if (document.querySelectorAll('.dark').length) {
+        if (!dark) {
+            document.querySelectorAll('.dark').forEach(el => el.classList.remove('dark'));
+        }
+    } else {
+        if (dark) {
+            document.querySelector('body').classList.add('dark');
+        }
+    }
+
+    //  自动朗读
+    if (tts != "DISABLE"){
+        enable_tts = true;
+        if (getCookie("js_auto_read_cookie")) {
+            auto_read_tts = getCookie("js_auto_read_cookie")
+            auto_read_tts = auto_read_tts == "True";
+            if (auto_read_tts) {
+                allow_auto_read_tts_flag = true;
+            }
+        }
+    }
+
+    // SysPrompt 系统静默提示词
+    gpt_academic_gradio_saveload("load", "elem_prompt", "js_system_prompt_cookie", null, "str");
+    // Temperature 大模型温度参数
+    gpt_academic_gradio_saveload("load", "elem_temperature", "js_temperature_cookie", null, "float");
+    // md_dropdown 大模型类型选择
+    if (getCookie("js_md_dropdown_cookie")) {
+        const cached_model = getCookie("js_md_dropdown_cookie");
+        var model_sel = await get_gradio_component("elem_model_sel");
+        // determine whether the cached model is in the choices
+        if (model_sel.props.choices.includes(cached_model)){
+            // change dropdown
+            gpt_academic_gradio_saveload("load", "elem_model_sel", "js_md_dropdown_cookie", null, "str");
+            // 连锁修改chatbot的label
+            push_data_to_gradio_component({
+                label: '当前模型：' + getCookie("js_md_dropdown_cookie"),
+                __type__: 'update'
+            }, "gpt-chatbot", "obj")
+        }
+    }
+
+
+
+    // clearButton 自动清除按钮
+    if (getCookie("js_clearbtn_show_cookie")) {
+        // have cookie
+        bool_value = getCookie("js_clearbtn_show_cookie")
+        bool_value = bool_value == "True";
+        searchString = "输入清除键";
+
+        if (bool_value) {
+            // make btns appear
+            let clearButton = document.getElementById("elem_clear"); clearButton.style.display = "block";
+            let clearButton2 = document.getElementById("elem_clear2"); clearButton2.style.display = "block";
+            // deal with checkboxes
+            let arr_with_clear_btn = update_array(
+                await get_data_from_gradio_component('cbs'), "输入清除键", "add"
+            )
+            push_data_to_gradio_component(arr_with_clear_btn, "cbs", "no_conversion");
+        } else {
+            // make btns disappear
+            let clearButton = document.getElementById("elem_clear"); clearButton.style.display = "none";
+            let clearButton2 = document.getElementById("elem_clear2"); clearButton2.style.display = "none";
+            // deal with checkboxes
+            let arr_without_clear_btn = update_array(
+                await get_data_from_gradio_component('cbs'), "输入清除键", "remove"
+            )
+            push_data_to_gradio_component(arr_without_clear_btn, "cbs", "no_conversion");
+        }
+    }
+
+    // live2d 显示
+    if (getCookie("js_live2d_show_cookie")) {
+        // have cookie
+        searchString = "添加Live2D形象";
+        bool_value = getCookie("js_live2d_show_cookie");
+        bool_value = bool_value == "True";
+        if (bool_value) {
+            loadLive2D();
+            let arr_with_live2d = update_array(
+                await get_data_from_gradio_component('cbsc'), "添加Live2D形象", "add"
+            )
+            push_data_to_gradio_component(arr_with_live2d, "cbsc", "no_conversion");
+        } else {
+            try {
+                $('.waifu').hide();
+                let arr_without_live2d = update_array(
+                    await get_data_from_gradio_component('cbsc'), "添加Live2D形象", "remove"
+                )
+                push_data_to_gradio_component(arr_without_live2d, "cbsc", "no_conversion");
+            } catch (error) {
+            }
+        }
+    } else {
+        // do not have cookie
+        if (live2d) {
+            loadLive2D();
+        } else {
+        }
+    }
+
+    // 主题加载（恢复到上次）
+    change_theme("", "")
+}
--- a/themes/theme.js
+++ b/themes/theme.js
@@ -0,0 +1,41 @@
+async function try_load_previous_theme(){
+    if (getCookie("js_theme_selection_cookie")) {
+        theme_selection = getCookie("js_theme_selection_cookie");
+        let css = localStorage.getItem('theme-' + theme_selection);
+        if (css) {
+            change_theme(theme_selection, css);
+        }
+    }
+}
+
+async function change_theme(theme_selection, css) {
+    if (theme_selection.length==0) {
+        try_load_previous_theme();
+        return;
+    }
+
+    var existingStyles = document.querySelectorAll("body > gradio-app > div > style")
+    for (var i = 0; i < existingStyles.length; i++) {
+        var style = existingStyles[i];
+        style.parentNode.removeChild(style);
+    }
+    var existingStyles = document.querySelectorAll("style[data-loaded-css]");
+    for (var i = 0; i < existingStyles.length; i++) {
+        var style = existingStyles[i];
+        style.parentNode.removeChild(style);
+    }
+
+    setCookie("js_theme_selection_cookie", theme_selection, 3);
+    localStorage.setItem('theme-' + theme_selection, css);
+
+    var styleElement = document.createElement('style');
+    styleElement.setAttribute('data-loaded-css', 'placeholder');
+    styleElement.innerHTML = css;
+    document.body.appendChild(styleElement);
+}
+
+
+// // 记录本次的主题切换
+// async function change_theme_prepare(theme_selection, secret_css) {
+//     setCookie("js_theme_selection_cookie", theme_selection, 3);
+// }
--- a/themes/theme.py
+++ b/themes/theme.py
@@ -71,29 +71,10 @@ def from_cookie_str(c):
 """
 -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
 第 3 部分
-内嵌的javascript代码
+内嵌的javascript代码（这部分代码会逐渐移动到common.js中）
 -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
 """

-js_code_for_css_changing = """(css) => {
-    var existingStyles = document.querySelectorAll("body > gradio-app > div > style")
-    for (var i = 0; i < existingStyles.length; i++) {
-        var style = existingStyles[i];
-        style.parentNode.removeChild(style);
-    }
-    var existingStyles = document.querySelectorAll("style[data-loaded-css]");
-    for (var i = 0; i < existingStyles.length; i++) {
-        var style = existingStyles[i];
-        style.parentNode.removeChild(style);
-    }
-    var styleElement = document.createElement('style');
-    styleElement.setAttribute('data-loaded-css', 'placeholder');
-    styleElement.innerHTML = css;
-    document.body.appendChild(styleElement);
-}
-"""
-
-
 js_code_for_toggle_darkmode = """() => {
    if (document.querySelectorAll('.dark').length) {
        setCookie("js_darkmode_cookie", "False", 365);