feat: 调整chatbot placeholder

locale/en_US.json

@@ -270,4 +270,6 @@
     "groq_llama3_70b_description": "LLaMA 3 70B with [Groq](https://console.groq.com/), the impressively fast language model inferencing service.",
     "groq_mixtral_8x7b_description": "Mixtral 8x7B with [Groq](https://console.groq.com/), the impressively fast language model inferencing service.",
     "groq_gemma_7b_description": "Gemma 7B with [Groq](https://console.groq.com/), the impressively fast language model inferencing service.",
+    "gpt_default_slogan": "How can I help you today?",
+    "claude_default_slogan": "What can l help you with?",
 }

locale/zh_CN.json

@@ -12,4 +12,6 @@
     "groq_llama3_70b_description": "采用 [Groq](https://console.groq.com/) 的 LLaMA 3 70B。Groq 是一个非常快速的语言模型推理服务。",
     "groq_mixtral_8x7b_description": "采用 [Groq](https://console.groq.com/) 的 Mixtral 8x7B。Groq 是一个非常快速的语言模型推理服务。",
     "groq_gemma_7b_description": "采用 [Groq](https://console.groq.com/) 的 Gemma 7B。Groq 是一个非常快速的语言模型推理服务。",
+    "gpt_default_slogan": "今天能帮您些什么？",
+    "claude_default_slogan": "What can l help you with?",
 }

modules/presets.py

@@ -111,7 +111,9 @@ DEFAULT_METADATA = {
     "model_name": None, # api model name, used if this model is meant to be used online
     "filelist": None, # file list in the repo to download, now only support .gguf file
     "description": "", # description of the model, displayed in the chatbot header when cursor overing the info icon
-    "placeholder": {}, # placeholder for the model, displayed in the chat area when no message is present
+    "placeholder": { # placeholder for the model, displayed in the chat area when no message is present
+        "slogan": i18n("gpt_default_slogan"),
+    },
     "model_type": None, # model type, used to determine the model's behavior. If not set, the model type is inferred from the model name
     "multimodal": False, # whether the model is multimodal
     "api_host": None, # base url for the model's api
@@ -150,80 +152,140 @@ MODEL_METADATA = {
         "model_name": "gpt-3.5-turbo",
         "description": "gpt3.5turbo_description",
         "token_limit": 4096,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-green.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "GPT3.5 Turbo Instruct": {
         "model_name": "gpt-3.5-turbo-instruct",
         "description": "gpt3.5turbo_instruct_description",
         "token_limit": 4096,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-green.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "GPT3.5 Turbo 16K": {
         "model_name": "gpt-3.5-turbo-16k",
         "description": "gpt3.5turbo_16k_description",
         "token_limit": 16384,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-green.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "GPT3.5 Turbo 0301": {
         "model_name": "gpt-3.5-turbo-0301",
         "token_limit": 4096,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-green.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "GPT3.5 Turbo 0613": {
         "model_name": "gpt-3.5-turbo-0613",
         "token_limit": 4096,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-green.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "GPT3.5 Turbo 1106": {
     "model_name": "gpt-3.5-turbo-1106",
     "token_limit": 16384,
+    "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-green.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "GPT4": {
         "model_name": "gpt-4",
         "description": "gpt4_description",
         "token_limit": 8192,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-black.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "GPT4 32K": {
         "model_name": "gpt-4-32k",
         "description": "gpt4_32k_description",
         "token_limit": 32768,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-black.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "GPT4 Turbo": {
         "model_name": "gpt-4-turbo",
         "description": "gpt4turbo_description",
         "token_limit": 128000,
-        "multimodal": True
+        "multimodal": True,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/openai-black.webp",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "Claude 3 Haiku": {
         "model_name": "claude-3-haiku-20240307",
         "description": "claude3_haiku_description",
         "token_limit": 200000,
         "max_generation": 4096,
-        "multimodal": True
+        "multimodal": True,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/claude-3.jpg",
+            "slogan": i18n("claude_default_slogan"),
+        }
     },
     "Claude 3 Sonnet": {
         "model_name": "claude-3-sonnet-20240229",
         "description": "claude3_sonnet_description",
         "token_limit": 200000,
         "max_generation": 4096,
-        "multimodal": True
+        "multimodal": True,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/claude-3.jpg",
+            "slogan": i18n("claude_default_slogan"),
+        }
     },
     "Claude 3 Opus": {
         "model_name": "claude-3-opus-20240229",
         "description": "claude3_opus_description",
         "token_limit": 200000,
         "max_generation": 4096,
-        "multimodal": True
+        "multimodal": True,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/claude-3.jpg",
+            "slogan": i18n("claude_default_slogan"),
+        }
     },
     "川虎助理": {
         "model_name": "川虎助理",
-        "description": "川虎助理是一款虚拟世界游戏，在这个游戏中，川虎扮演……",
+        "description": "类似 AutoGPT，全自动解决你的问题",
+        "placeholder": {
+            "logo": "file=web_assets/icon/any-icon-512.png",
+            "logo_rounded": "false",
+            "slogan": "川虎今天能帮你做些什么？",
+            "question_1": "今天杭州天气如何？",
+            "question_2": "最近 Apple 发布了什么新品？",
+            "question_3": "现在显卡的价格如何？",
+            "question_4": "TikTok 上有什么新梗？",
+        }
+    },
+    "川虎助理 Pro": {
+        "model_name": "川虎助理 Pro",
+        "description": "类似 AutoGPT，全自动解决你的问题",
         "placeholder": {
             "logo": "file=web_assets/icon/any-icon-512.png",
             "logo_rounded": "false",
-            "slogon": "我川虎今天能帮你做什么？",
-            "question_1": "你好",
-            "question_2": "你是谁",
-            "question_3": "你会做什么",
-            "question_4": "你会说什么语言",
+            "slogan": "川虎Pro今天能帮你做些什么？",
+            "question_1": "今天杭州天气如何？",
+            "question_2": "最近 Apple 发布了什么新品？",
+            "question_3": "现在显卡的价格如何？",
+            "question_4": "TikTok 上有什么新梗？",
         }
     },
-    "川虎助理 Pro": {"model_name": "川虎助理 Pro"},
     "DALL-E 3": {"model_name": "dall-e-3"},
     "ERNIE-Bot-turbo": {
         "model_name": "ERNIE-Bot-turbo",
@@ -240,10 +302,18 @@ MODEL_METADATA = {
     "Gemini Pro": {
         "model_name": "gemini-pro",
         "token_limit": 30720,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/gemini.svg",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "Gemini Pro Vision": {
         "model_name": "gemini-pro-vision",
         "token_limit": 30720,
+        "placeholder": {
+            "logo": "file=web_assets/model_logos/gemini.svg",
+            "slogan": i18n("gpt_default_slogan"),
+        }
     },
     "Ollama": {
         "model_name": "ollama",

modules/utils.py

@@ -1422,8 +1422,8 @@ def reboot_chuanhu():
 from .models.base_model import BaseLLMModel
 def setPlaceholder(model_name: str | None = "", model: BaseLLMModel | None = None):
     from .webui import get_html
-    logo_class, slogon_class, question_class = "", "", ""
-    model_logo, model_logo_round, model_slogon, model_question_1, model_question_2, model_question_3, model_question_4 = "", "", "", "", "", "", ""
+    logo_class, slogan_class, question_class = "", "", ""
+    model_logo, model_logo_round, model_slogan, model_question_1, model_question_2, model_question_3, model_question_4 = "", "", "", "", "", "", ""
 
     if model is None:
         try:
@@ -1435,9 +1435,9 @@ def setPlaceholder(model_name: str | None = "", model: BaseLLMModel | None = Non
         except:
             pass
         try:
-            model_slogon = i18n(MODEL_METADATA[model_name]["placeholder"]["slogon"])
+            model_slogan = i18n(MODEL_METADATA[model_name]["placeholder"]["slogan"])
         except:
-            slogon_class = "hideK"
+            slogan_class = "hideK"
         try:
             model_question_1 = i18n(MODEL_METADATA[model_name]["placeholder"]["question_1"])
             model_question_2 = i18n(MODEL_METADATA[model_name]["placeholder"]["question_2"])
@@ -1455,9 +1455,9 @@ def setPlaceholder(model_name: str | None = "", model: BaseLLMModel | None = Non
         except:
             pass
         try:
-            model_slogon = i18n(model.placeholder["slogon"])
+            model_slogan = i18n(model.placeholder["slogan"])
         except:
-            slogon_class = "hideK"
+            slogan_class = "hideK"
         try:
             model_question_1 = i18n(model.placeholder["question_1"])
             model_question_2 = i18n(model.placeholder["question_2"])
@@ -1466,7 +1466,7 @@ def setPlaceholder(model_name: str | None = "", model: BaseLLMModel | None = Non
         except:
             question_class = "hideK"
 
-    if logo_class == "hideK" and slogon_class == "hideK" and question_class == "hideK":
+    if logo_class == "hideK" and slogan_class == "hideK" and question_class == "hideK":
         return ""
     else:
         # 除非明确指定为 squared 或 false 等，否则默认为圆角
@@ -1474,13 +1474,13 @@ def setPlaceholder(model_name: str | None = "", model: BaseLLMModel | None = Non
             logo_class += " rounded"
         return get_html("chatbot_placeholder.html").format(
             chatbot_ph_logo = model_logo,
-            chatbot_ph_slogon = model_slogon,
+            chatbot_ph_slogan = model_slogan,
             chatbot_ph_question_1 = model_question_1,
             chatbot_ph_question_2 = model_question_2,
             chatbot_ph_question_3 = model_question_3,
             chatbot_ph_question_4 = model_question_4,
             chatbot_ph_logo_class = logo_class,
-            chatbot_ph_slogon_class = slogon_class,
+            chatbot_ph_slogan_class = slogan_class,
             chatbot_ph_question_class = question_class
         )
 

web_assets/html/chatbot_placeholder.html

@@ -1,7 +1,7 @@
 <div id="chatbot-placeholder-pl">
 <div id="chatbot-placeholder-header">
     <img src="{chatbot_ph_logo}" alt="avatar" class="{chatbot_ph_logo_class}" />
-    <h1 class="{chatbot_ph_slogon_class}">{chatbot_ph_slogon}</h1>
+    <h1 class="{chatbot_ph_slogan_class}">{chatbot_ph_slogan}</h1>
 </div>
 
 <div id="chatbot-placeholder-options" class="{chatbot_ph_question_class}">

web_assets/stylesheet/chatbot.css

@@ -414,13 +414,17 @@ img.avatar-image {
     display: block;
 }
 #chatbot-placeholder-header img {
-    width: 100px;
-    height: 100px;
+    width: 72px;
+    height: 72px;
     margin: 20px auto;
+    border-radius: 8px;
 }
 .rounded {
     border-radius: 50%;
 }
+#chatbot-placeholder-header img.rounded {
+    border-radius: 50% !important;
+}
 
 #chatbot-placeholder-header h1 {
     font-size: 1.5em;
@@ -448,6 +452,9 @@ img.avatar-image {
     flex: 0 1 320px;
     opacity: 0.65;
     height: 48px;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
 }
 
 #chatbot-placeholder-options button:hover {