#199 [Feature] Show ExtraNetworks information when the mouse hovers over the keyword

鼠标移动到关键词上展示ExtraNetworks信息

i18n.json

@@ -163,7 +163,15 @@
                 "none": "无",
                 "add_blacklist": "添加到黑名单",
                 "confirm_add_blacklist": "是否将关键词“{0}”加入黑名单？",
-                "cancel_confirm_add_blacklist": "从关键词列表扩展面板中加入黑名单时，取消《确认提示窗口》。"
+                "cancel_confirm_add_blacklist": "从关键词列表扩展面板中加入黑名单时，取消《确认提示窗口》。",
+                "model_name": "模型名称 (name)",
+                "output_name": "输出名称 (output name)",
+                "filename": "文件名 (filename)",
+                "filepath": "文件路径",
+                "trained_words": "触发关键词",
+                "description": "描述",
+                "open_civitai": "打开Civitai",
+                "use_keywords": "使用关键词"
             }
         },
         {
@@ -328,7 +336,15 @@
                 "none": "無",
                 "add_blacklist": "加入黑名單",
                 "confirm_add_blacklist": "是否將關鍵詞“{0}”加入黑名單？",
-                "cancel_confirm_add_blacklist": "從關鍵詞列表擴展面板中加入黑名單時，取消《確認提示窗口》。"
+                "cancel_confirm_add_blacklist": "從關鍵詞列表擴展面板中加入黑名單時，取消《確認提示窗口》。",
+                "model_name": "模型名稱 (name)",
+                "output_name": "輸出名稱 (output name)",
+                "filename": "文件名稱 (filename)",
+                "filepath": "文件路徑",
+                "trained_words": "觸發關鍵詞",
+                "description": "描述",
+                "open_civitai": "打開Civitai",
+                "use_keywords": "使用關鍵詞"
             }
         },
         {
@@ -493,7 +509,15 @@
                 "none": "無",
                 "add_blacklist": "加入黑名單",
                 "confirm_add_blacklist": "是否將關鍵詞“{0}”加入黑名單？",
-                "cancel_confirm_add_blacklist": "從關鍵詞列表擴展面板中加入黑名單時，取消《確認提示視窗》。"
+                "cancel_confirm_add_blacklist": "從關鍵詞列表擴展面板中加入黑名單時，取消《確認提示視窗》。",
+                "model_name": "模型名稱 (name)",
+                "output_name": "輸出名稱 (output name)",
+                "filename": "檔案名稱 (filename)",
+                "filepath": "檔案路徑",
+                "trained_words": "觸發關鍵詞",
+                "description": "描述",
+                "open_civitai": "開啟Civitai",
+                "use_keywords": "使用關鍵詞"
             }
         },
         {
@@ -658,7 +682,15 @@
                 "none": "None",
                 "add_blacklist": "Add to blacklist",
                 "confirm_add_blacklist": "Do you want to add the keyword \"{0}\" to the blacklist?",
-                "cancel_confirm_add_blacklist": "Cancel the confirmation dialog when adding to the blacklist from the keyword list expansion panel."
+                "cancel_confirm_add_blacklist": "Cancel the confirmation dialog when adding to the blacklist from the keyword list expansion panel.",
+                "model_name": "Model Name",
+                "output_name": "Output Name",
+                "filename": "File Name",
+                "filepath": "File Path",
+                "trained_words": "Trigger Keywords",
+                "description": "Description",
+                "open_civitai": "Open Civitai",
+                "use_keywords": "Use Keywords"
             }
         },
         {
@@ -834,7 +866,15 @@
                 "none": "لا شيء",
                 "add_blacklist": "إضافة إلى القائمة السوداء",
                 "confirm_add_blacklist": "هل ترغب في إضافة الكلمة الرئيسية \"{0}\" إلى القائمة السوداء؟",
-                "cancel_confirm_add_blacklist": "إلغاء نافذة التأكيد عند إضافة إلى القائمة السوداء من لوحة توسيع قائمة الكلمات الرئيسية."
+                "cancel_confirm_add_blacklist": "إلغاء نافذة التأكيد عند إضافة إلى القائمة السوداء من لوحة توسيع قائمة الكلمات الرئيسية.",
+                "model_name": "اسم النموذج (name)",
+                "output_name": "اسم الإخراج (output name)",
+                "filename": "اسم الملف (filename)",
+                "filepath": "مسار الملف",
+                "trained_words": "كلمات المفاتيح المدربة",
+                "description": "الوصف",
+                "open_civitai": "افتح سيفيتاي",
+                "use_keywords": "استخدم الكلمات المفتاحية"
             }
         },
         {
@@ -1098,7 +1138,15 @@
                 "none": "Aucun",
                 "add_blacklist": "Ajouter à la liste noire",
                 "confirm_add_blacklist": "Voulez-vous ajouter le mot-clé \"{0}\" à la liste noire ?",
-                "cancel_confirm_add_blacklist": "Annuler la fenêtre de confirmation lors de l'ajout à la liste noire depuis le panneau d'extension de la liste de mots-clés."
+                "cancel_confirm_add_blacklist": "Annuler la fenêtre de confirmation lors de l'ajout à la liste noire depuis le panneau d'extension de la liste de mots-clés.",
+                "model_name": "Nom du modèle (name)",
+                "output_name": "Nom de sortie (output name)",
+                "filename": "Nom de fichier (filename)",
+                "filepath": "Chemin du fichier",
+                "trained_words": "Mots clés entraînés",
+                "description": "Description",
+                "open_civitai": "Ouvrir Civitai",
+                "use_keywords": "Utiliser des mots clés"
             }
         },
         {
@@ -1277,7 +1325,15 @@
                 "none": "Keine",
                 "add_blacklist": "Zur schwarzen Liste hinzufügen",
                 "confirm_add_blacklist": "Möchten Sie das Schlüsselwort \"{0}\" zur schwarzen Liste hinzufügen?",
-                "cancel_confirm_add_blacklist": "Die Bestätigungsmeldung beim Hinzufügen zur Blacklist aus der Schlüsselwortliste-Erweiterungsleiste abbrechen."
+                "cancel_confirm_add_blacklist": "Die Bestätigungsmeldung beim Hinzufügen zur Blacklist aus der Schlüsselwortliste-Erweiterungsleiste abbrechen.",
+                "model_name": "Modellname (name)",
+                "output_name": "Ausgabename (output name)",
+                "filename": "Dateiname (filename)",
+                "filepath": "Dateipfad",
+                "trained_words": "Trainierte Schlüsselwörter",
+                "description": "Beschreibung",
+                "open_civitai": "Civitai öffnen",
+                "use_keywords": "Schlüsselwörter verwenden"
             }
         },
         {
@@ -1506,7 +1562,15 @@
                 "none": "Nessuno",
                 "add_blacklist": "Aggiungi alla lista nera",
                 "confirm_add_blacklist": "Vuoi aggiungere la parola chiave \"{0}\" alla lista nera?",
-                "cancel_confirm_add_blacklist": "Annulla la finestra di conferma durante l'aggiunta alla lista nera dalla barra di espansione dell'elenco delle parole chiave."
+                "cancel_confirm_add_blacklist": "Annulla la finestra di conferma durante l'aggiunta alla lista nera dalla barra di espansione dell'elenco delle parole chiave.",
+                "model_name": "Nome del modello (name)",
+                "output_name": "Nome dell'output (output name)",
+                "filename": "Nome del file (filename)",
+                "filepath": "Percorso del file",
+                "trained_words": "Parole chiave addestrate",
+                "description": "Descrizione",
+                "open_civitai": "Apri Civitai",
+                "use_keywords": "Usa parole chiave"
             }
         },
         {
@@ -1670,7 +1734,15 @@
                 "none": "なし",
                 "add_blacklist": "ブラックリストに追加",
                 "confirm_add_blacklist": "キーワード「{0}」をブラックリストに追加しますか？",
-                "cancel_confirm_add_blacklist": "キーワードリスト拡張パネルからブラックリストに追加する際の確認ダイアログをキャンセルします。"
+                "cancel_confirm_add_blacklist": "キーワードリスト拡張パネルからブラックリストに追加する際の確認ダイアログをキャンセルします。",
+                "model_name": "モデル名 (name)",
+                "output_name": "出力名 (output name)",
+                "filename": "ファイル名 (filename)",
+                "filepath": "ファイルパス",
+                "trained_words": "トリガーキーワード",
+                "description": "説明",
+                "open_civitai": "Civitaiを開く",
+                "use_keywords": "キーワードを使用する"
             }
         },
         {
@@ -1859,7 +1931,15 @@
                 "none": "없음",
                 "add_blacklist": "블랙리스트에 추가",
                 "confirm_add_blacklist": "키워드 \"{0}\"를 블랙리스트에 추가하시겠습니까?",
-                "cancel_confirm_add_blacklist": "키워드 목록 확장 패널에서 블랙리스트에 추가할 때 확인 대화 상자를 취소합니다."
+                "cancel_confirm_add_blacklist": "키워드 목록 확장 패널에서 블랙리스트에 추가할 때 확인 대화 상자를 취소합니다.",
+                "model_name": "모델 이름 (name)",
+                "output_name": "출력 이름 (output name)",
+                "filename": "파일 이름 (filename)",
+                "filepath": "파일 경로",
+                "trained_words": "트리거 키워드",
+                "description": "설명",
+                "open_civitai": "Civitai 열기",
+                "use_keywords": "키워드 사용"
             }
         },
         {
@@ -2138,7 +2218,15 @@
                 "none": "Nenhum",
                 "add_blacklist": "Adicionar à lista negra",
                 "confirm_add_blacklist": "Deseja adicionar a palavra-chave \"{0}\" à lista negra?",
-                "cancel_confirm_add_blacklist": "Cancelar a janela de confirmação ao adicionar à lista negra a partir do painel de expansão da lista de palavras-chave."
+                "cancel_confirm_add_blacklist": "Cancelar a janela de confirmação ao adicionar à lista negra a partir do painel de expansão da lista de palavras-chave.",
+                "model_name": "Nome do modelo (name)",
+                "output_name": "Nome de saída (output name)",
+                "filename": "Nome do arquivo (filename)",
+                "filepath": "Caminho do arquivo",
+                "trained_words": "Palavras-chave treinadas",
+                "description": "Descrição",
+                "open_civitai": "Abrir Civitai",
+                "use_keywords": "Usar palavras-chave"
             }
         },
         {
@@ -2317,7 +2405,15 @@
                 "none": "Нет",
                 "add_blacklist": "Добавить в черный список",
                 "confirm_add_blacklist": "Хотите добавить ключевое слово \"{0}\" в черный список?",
-                "cancel_confirm_add_blacklist": "Отменить окно подтверждения при добавлении в черный список из панели расширения списка ключевых слов."
+                "cancel_confirm_add_blacklist": "Отменить окно подтверждения при добавлении в черный список из панели расширения списка ключевых слов.",
+                "model_name": "Имя модели (name)",
+                "output_name": "Имя вывода (output name)",
+                "filename": "Имя файла (filename)",
+                "filepath": "Путь к файлу",
+                "trained_words": "Обученные ключевые слова",
+                "description": "Описание",
+                "open_civitai": "Открыть Civitai",
+                "use_keywords": "Использовать ключевые слова"
             }
         },
         {
@@ -2511,7 +2607,15 @@
                 "none": "Ninguno",
                 "add_blacklist": "Agregar a la lista negra",
                 "confirm_add_blacklist": "¿Deseas agregar la palabra clave \"{0}\" a la lista negra?",
-                "cancel_confirm_add_blacklist": "Cancelar el cuadro de diálogo de confirmación al agregar a la lista negra desde el panel de expansión de la lista de palabras clave."
+                "cancel_confirm_add_blacklist": "Cancelar el cuadro de diálogo de confirmación al agregar a la lista negra desde el panel de expansión de la lista de palabras clave.",
+                "model_name": "Nombre del modelo (name)",
+                "output_name": "Nombre de salida (output name)",
+                "filename": "Nombre de archivo (filename)",
+                "filepath": "Ruta del archivo",
+                "trained_words": "Palabras clave entrenadas",
+                "description": "Descripción",
+                "open_civitai": "Abrir Civitai",
+                "use_keywords": "Usar palabras clave"
             }
         },
         {

scripts/physton_prompt/get_extra_networks.py

@@ -5,8 +5,8 @@ import json
 import os
 
 filters = [
-    'filename',
-    'description',
+    # 'filename',
+    # 'description',
     'search_term',
     'local_preview',
     'metadata',
@@ -38,6 +38,8 @@ def get_extra_networks():
                 item['civitai_info'] = {}
                 try:
                     if 'filename' in item and item['filename']:
+                        item['basename'] = os.path.basename(item['filename'])
+                        item['dirname'] = os.path.dirname(item['filename'])
                         base, ext = os.path.splitext(item['filename'])
                         info_file = base + '.civitai.info'
                         if not os.path.isfile(info_file):
@@ -45,10 +47,19 @@ def get_extra_networks():
                         if os.path.isfile(info_file):
                             with open(info_file, 'r') as f:
                                 info = json.load(f)
+                                images = info.get('images', [])
                                 info = {
+                                    'modelId': info.get('modelId', ''),
                                     'name': info.get('name', ''),
+                                    'description': info.get('description', ''),
+                                    'baseModel': info.get('baseModel', ''),
                                     'model': info.get('model', {}),
+                                    'trainedWords': info.get('trainedWords', []),
+                                    'images': [],
                                 }
+                                if images and len(images) > 0:
+                                    for image in images:
+                                        info['images'].append(image['url'])
                                 item['civitai_info'] = info
                 except Exception as e:
                     pass

src/globals.js

@@ -10,4 +10,5 @@ export default {
     nameTagComplete: 'DominikDoom/a1111-sd-webui-tagcomplete',
     shortNameTagComplete: 'a1111-sd-webui-tagcomplete',
     githubTagComplete: 'https://github.com/DominikDoom/a1111-sd-webui-tagcomplete',
+    civitaiUrl: 'https://civitai.com',
 }

src/src/App.vue

@@ -57,6 +57,8 @@
                             :cancel-blacklist-confirm="cancelBlacklistConfirm"
                             @update:blacklist="onUpdateBlacklist"
                             :hotkey="hotkey"
+                            @show-extra-networks="onShowExtraNetworks"
+                            @hide-extra-networks="onHideExtraNetworks"
             ></physton-prompt>
         </template>
         <translate-setting ref="translateSetting" v-model:language-code="languageCode"
@@ -114,6 +116,11 @@
         <about ref="about" v-model:language-code="languageCode"
                :translate-apis="translateApis" :languages="languages" />
 
+        <extra-networks-popup ref="extraNetworksPopup"
+                              v-model:language-code="languageCode"
+                              :translate-apis="translateApis" :languages="languages"
+                              :extra-networks="extraNetworks" />
+
         <div class="physton-paste-popup" v-if="showPastePopup" @click="closePastePopup">
             <div class="paste-popup-main" @click.stop>
                 <div class="paste-popup-close" @click="closePastePopup">
@@ -152,6 +159,7 @@ import jsYaml from "js-yaml";
 import {ref} from "vue";
 import Hotkey from "@/components/hotkey.vue";
 import { slugify } from '@lazy-cjk/zh-slugify';
+import ExtraNetworksPopup from "@/components/extraNetworksPopup.vue";
 
 export default {
     name: 'App',
@@ -169,6 +177,7 @@ export default {
         SelectLanguage,
         TranslateSetting,
         PhystonPrompt,
+        ExtraNetworksPopup
     },
     mixins: [],
     data() {
@@ -1063,6 +1072,12 @@ export default {
         onUpdateHotkey(data) {
             this.hotkey = data
         },
+        onShowExtraNetworks(e, name, useCallback) {
+            this.$refs.extraNetworksPopup.show(e, name, useCallback)
+        },
+        onHideExtraNetworks() {
+            this.$refs.extraNetworksPopup.hide()
+        },
     },
 }
 </script>

src/src/components/extraNetworksPopup.vue

@@ -0,0 +1,189 @@
+<template>
+    <div class="physton-prompt-extra-networks-popup" ref="extraNetworks"
+         @mouseenter.stop="onMouseEnter"
+         @mousemove.stop="onMouseMove"
+         @mouseleave.stop="onMouseLeave"
+         v-show="isShow"
+         :style="style">
+        <div class="popup-main">
+            <img class="info-preview" v-if="data.preview" :src="data.preview" :style="previewStyle" @load="onPreviewLoad"/>
+            <div class="info-raws">
+                <div class="info-raw">
+                    <div class="raw-name">{{ getLang('model_name') }}</div>
+                    <div class="raw-value" @click="copy(data.name)">{{ data.name }}</div>
+                </div>
+                <div class="info-raw" v-if="data.output_name">
+                    <div class="raw-name">{{ getLang('output_name') }}</div>
+                    <div class="raw-value" @click="copy(data.output_name)">{{ data.output_name }}</div>
+                </div>
+                <div class="info-raw" v-if="data.basename">
+                    <div class="raw-name">{{ getLang('filename') }}</div>
+                    <div class="raw-value" @click="copy(data.basename)">{{ data.basename }}</div>
+                </div>
+                <div class="info-raw" v-if="data.dirname">
+                    <div class="raw-name">{{ getLang('filepath') }}</div>
+                    <div class="raw-value" @click="copy(data.dirname)">{{ data.dirname }}</div>
+                </div>
+                <div class="info-raw" v-if="data.trainedWords && data.trainedWords.length">
+                    <div class="raw-name">{{ getLang('trained_words') }}</div>
+                    <div class="raw-value" @click="copy(data.trainedWords.join(', '))">{{ data.trainedWords.join(', ') }}</div>
+                </div>
+                <div class="info-raw" v-if="data.description">
+                    <div class="raw-name">{{ getLang('description') }}</div>
+                    <div class="raw-value description" v-tooltip="data.description" @click="copy(data.description)">{{ data.description }}</div>
+                </div>
+                <div class="info-btns">
+                    <div class="info-btn hover-scale-120" v-if="data.modelId" @click="onOpenCivitaiClick">{{ getLang('open_civitai') }}</div>
+                    <div class="info-btn hover-scale-120" v-if="data.trainedWords && data.trainedWords.length" @click="onUseKeywordsClick">{{ getLang('use_keywords') }}</div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script>
+import LanguageMixin from "@/mixins/languageMixin";
+import IconSvg from "@/components/iconSvg.vue";
+import common from "@/utils/common";
+import globals from "../../globals";
+
+const TYPE_LORA = 'lora'
+const TYPE_LYCO = 'lyco'
+const TYPE_EMBEDDING = 'embedding'
+export default {
+    name: 'ExtraNetworksPopup',
+    components: {IconSvg},
+    mixins: [LanguageMixin],
+    props: {
+        extraNetworks: {
+            type: Array,
+            default: () => [],
+        },
+    },
+    data() {
+        return {
+            isShow: false,
+            e: null,
+            name: '',
+            useCallback: null,
+            type: '',
+            data: {},
+            style: {},
+            previewStyle: {},
+            mouseIn: false,
+            eMouseIn: false,
+        }
+    },
+    computed: {},
+    mounted() {
+    },
+    methods: {
+        show(e, name, useCallback) {
+            this.mouseIn = false
+            this.eMouseIn = true
+            this.e = e
+            this.name = name
+            this.useCallback = useCallback
+            this.type = ''
+            this.data = {}
+            this.style = {}
+            this.previewStyle = {}
+            let data
+            name = name.toLowerCase()
+            for (let extraNetwork of this.extraNetworks) {
+                if (extraNetwork.name === 'textual inversion') {
+                    for (let item of extraNetwork.items) {
+                        if (item.name.toLowerCase() === name) {
+                            this.type = TYPE_EMBEDDING
+                            data = item
+                            break
+                        }
+                    }
+                } else if (extraNetwork.name === 'lora' || extraNetwork.name === 'lycoris') {
+                    for (let item of extraNetwork.items) {
+                        if (item.name.toLowerCase() === name || (item.output_name && item.output_name.toLowerCase() === name)) {
+                            this.type = extraNetwork.name === 'lora' ? TYPE_LORA : TYPE_LYCO
+                            data = item
+                            break
+                        }
+                    }
+                }
+            }
+            if (!this.type) return this.isShow = false
+            this.isShow = true
+
+            this.data.name = data.civitai_info && data.civitai_info.model && data.civitai_info.model.name ? data.civitai_info.model.name : data.name
+            this.data.output_name = data.output_name && data.output_name !== this.data.name ? data.output_name : ''
+            this.data.basename = data.basename || ''
+            this.data.dirname = data.dirname || ''
+            this.data.description = data.civitai_info && data.civitai_info.description ? data.civitai_info.description : (data.description || '')
+            this.data.description = this.data.description.replace(/<[^>]+>/g, '')
+            this.data.trainedWords = data.civitai_info && data.civitai_info.trainedWords ? data.civitai_info.trainedWords : []
+            this.data.preview = data.preview || (data.civitai_info && data.civitai_info.images && data.civitai_info.images.length ? data.civitai_info.images[0] : '')
+            this.data.modelId = data.civitai_info && data.civitai_info.modelId ? data.civitai_info.modelId : ''
+            this.$nextTick(() => {
+                const eRect = e.getBoundingClientRect()
+                this.style.top = (eRect.top + e.offsetHeight + 4) + 'px'
+                this.style.left = eRect.left + 'px'
+                if (this.data.preview) {
+                    this.previewStyle = {
+                        width: 'auto',
+                        height: this.$refs.extraNetworks.offsetHeight + 'px',
+                    }
+                }
+                this.$nextTick(() => {
+                    this.onPreviewLoad()
+                })
+            })
+        },
+        onPreviewLoad() {
+            const rect = this.$refs.extraNetworks.getBoundingClientRect()
+            if (rect.right > window.innerWidth) {
+                this.style.left = (window.innerWidth - rect.width - 10) + 'px'
+            }
+        },
+        _hide() {
+            if (!this.isShow) return
+            if (this.hideTimer) clearTimeout(this.hideTimer)
+            this.hideTimer = setTimeout(() => {
+                this.hideTimer = null
+                if (!this.mouseIn && !this.eMouseIn) {
+                    this.isShow = false
+                }
+            }, 10)
+        },
+        hide() {
+            this.eMouseIn = false
+            this._hide()
+        },
+        onMouseEnter() {
+            this.mouseIn = true
+        },
+        onMouseMove() {
+            this.mouseIn = true
+        },
+        onMouseLeave() {
+            this.mouseIn = false
+            this._hide()
+        },
+        copy(text) {
+            this.$copyText(text).then(() => {
+                this.$toastr.success(this.getLang('success'))
+            }).catch(() => {
+                this.$toastr.error(this.getLang('failed'))
+            })
+        },
+        onOpenCivitaiClick() {
+            if (!this.data.modelId) return
+            let url = globals.civitaiUrl + '/models/' + this.data.modelId
+            window.open(url)
+        },
+        onUseKeywordsClick() {
+            if (!this.data.trainedWords || !this.data.trainedWords.length) return
+            if (!this.useCallback) return
+            if (typeof this.useCallback !== 'function') return
+            this.useCallback(this.data.trainedWords)
+            this.$toastr.success(this.getLang('success'))
+        },
+    },
+}
+</script>

src/src/components/phystonPrompt.vue

@@ -295,7 +295,7 @@
                                          :class="tag.classes"
                                          :style="getTagColorStyle(tag)"
                                          :ref="'promptTagValue-' + tag.id"
-                                         v-tooltip="getLang('click_to_edit') + '<br/>' + getLang('dblclick_to_disable') + '<br/>' + getLang('drop_to_order')"
+                                         v-tooltip="tag.isLora || tag.isLyco ? '' : getLang('click_to_edit') + '<br/>' + getLang('dblclick_to_disable') + '<br/>' + getLang('drop_to_order')"
                                          @click="onTagClick(tag.id, $event)"
                                          @dblclick="onTagDblclick(tag.id)"
                                          @click.right.prevent="onTagRightClick(tag.id, $event)"
@@ -699,7 +699,7 @@ export default {
             default: () => ({}),
         }
     },
-    emits: ['update:languageCode', 'update:autoTranslate', 'update:autoTranslateToEnglish', 'update:autoTranslateToLocal', 'update:autoRemoveSpace', 'update:autoRemoveLastComma', 'update:autoKeepWeightZero', 'update:autoKeepWeightOne', 'update:hideDefaultInput', 'update:hidePanel', 'update:enableTooltip', 'update:translateApi', 'click:translateApi', 'click:promptFormat', 'click:blacklist', 'click:hotkey', 'click:selectTheme', 'click:switchTheme', 'click:showAbout', 'click:selectLanguage', 'click:showHistory', 'click:showFavorite', 'refreshFavorites', 'click:showChatgpt', 'update:hideGroupTags', 'update:groupTagsColor', 'update:blacklist'],
+    emits: ['update:languageCode', 'update:autoTranslate', 'update:autoTranslateToEnglish', 'update:autoTranslateToLocal', 'update:autoRemoveSpace', 'update:autoRemoveLastComma', 'update:autoKeepWeightZero', 'update:autoKeepWeightOne', 'update:hideDefaultInput', 'update:hidePanel', 'update:enableTooltip', 'update:translateApi', 'click:translateApi', 'click:promptFormat', 'click:blacklist', 'click:hotkey', 'click:selectTheme', 'click:switchTheme', 'click:showAbout', 'click:selectLanguage', 'click:showHistory', 'click:showFavorite', 'refreshFavorites', 'click:showChatgpt', 'update:hideGroupTags', 'update:groupTagsColor', 'update:blacklist', 'showExtraNetworks', 'hideExtraNetworks'],
     data() {
         return {
             prompt: '',

src/src/main.js

@@ -38,7 +38,9 @@ onUiLoaded(() => {
                 theme: 'light',
                 allowHTML: true,
                 onCreate(instance, partialProps) {
+                    if (!binding.value) return
                     if (unaffected) return
+                    instance.enable()
                     const enable = localStorage.getItem('phystonPromptEnableTooltip') === 'true'
                     if (!enable) {
                         instance.disable()
@@ -49,8 +51,12 @@ onUiLoaded(() => {
             if (!unaffected) app.config.globalProperties.$tippyList.push(instance)
         },
         updated(el, binding) {
-            el.setAttribute('data-tippy-content', binding.value)
-            el.$tippyInstance.setContent(binding.value)
+            if (!binding.value) {
+                el.$tippyInstance.disable()
+            } else {
+                el.setAttribute('data-tippy-content', binding.value)
+                el.$tippyInstance.setContent(binding.value)
+            }
         }
     })
 

src/src/mixins/phystonPrompt/dropMixin.js

@@ -70,6 +70,7 @@ export default {
                 if (this.dropTimeId) clearTimeout(this.dropTimeId)
                 this.dropTimeId = setTimeout(this.dropSelectItems, 10)
             }
+            this.$emit('hideExtraNetworks')
         },
         dropSelectItems() {
             if (this.dropTimeId) clearTimeout(this.dropTimeId)

src/src/mixins/phystonPrompt/headerMixin.js

@@ -320,31 +320,34 @@ export default {
                         }
                         if (index !== -1) indexes.push(index)
                     })
-                    this.updatePrompt() // 先更新再翻译
-                    if (this.autoTranslateToEnglish || this.autoTranslateToLocal) {
-                        this.$nextTick(() => {
-                            let useNetwork = !(this.tagCompleteFile && this.onlyCsvOnAuto)
-                            if (this.autoTranslateToEnglish) {
-                                // 如果开启了自动翻译到英语，那么就自动翻译
-                                this.translates(indexes, false, useNetwork).finally(() => {
-                                    this.updateTags()
-                                })
-                            } else if (this.autoTranslateToLocal) {
-                                // 如果开启了自动翻译到本地语言，那么就自动翻译
-                                this.translates(indexes, true, useNetwork).finally(() => {
-                                    this.updateTags()
-                                })
-                            }
-                        })
-                    } else {
-                        this.updateTags()
-                    }
+                    this.autoTranslateByIndexes(indexes)
                 }
             } else {
                 // 不是上下键，也不是回车
                 this.removeAutocompleteResultsSelected()
             }
         },
+        autoTranslateByIndexes(indexes) {
+            this.updatePrompt() // 先更新再翻译
+            if (this.autoTranslateToEnglish || this.autoTranslateToLocal) {
+                this.$nextTick(() => {
+                    let useNetwork = !(this.tagCompleteFile && this.onlyCsvOnAuto)
+                    if (this.autoTranslateToEnglish) {
+                        // 如果开启了自动翻译到英语，那么就自动翻译
+                        this.translates(indexes, false, useNetwork).finally(() => {
+                            this.updateTags()
+                        })
+                    } else if (this.autoTranslateToLocal) {
+                        // 如果开启了自动翻译到本地语言，那么就自动翻译
+                        this.translates(indexes, true, useNetwork).finally(() => {
+                            this.updateTags()
+                        })
+                    }
+                })
+            } else {
+                this.updateTags()
+            }
+        },
         onAppendTagKeyUp(e) {
             if (this.$refs.promptTagAppend.value === '' || this.$refs.promptTagAppend.value.trim() === '') {
                 this.$refs.promptTagAppend.value = ''

src/src/mixins/phystonPrompt/tagMixin.js

@@ -229,11 +229,29 @@ export default {
             }
             return false
         },
+        onLoraPopupUseKeywords(keywords) {
+            let indexes = []
+            for (let keyword of keywords) {
+                let temp = keyword.toLowerCase()
+                let find = this.tags.find(tag => tag.value.toLowerCase() === temp)
+                if (!find) {
+                    let index = this._appendTag(keyword, '', false, -1, 'text')
+                    if (index !== -1) indexes.push(index)
+                }
+            }
+            if (indexes.length) {
+                this.autoTranslateByIndexes(indexes)
+            }
+        },
         onTagMouseEnter(id) {
             let tag = this.tags.find(tag => tag.id === id)
             if (!tag) return false
             tag.isFavorite = this.isFavorite(tag.id)
             if (this.hotkey.hover === 'extend') this.showExtendId = id
+            if (tag.isLora || tag.isLyco || tag.isEmbedding) {
+                let name = tag.isLora ? tag.loraName : (tag.isLyco ? tag.lycoName : tag.embeddingName)
+                this.$emit('showExtraNetworks', this.$refs['promptTagValue-' + tag.id][0], name, this.onLoraPopupUseKeywords)
+            }
         },
         onTagMouseMove(id) {
             let tag = this.tags.find(tag => tag.id === id)
@@ -244,6 +262,7 @@ export default {
             let tag = this.tags.find(tag => tag.id === id)
             if (!tag) return false
             if (this.hotkey.hover === 'extend') this.showExtendId = ''
+            this.$emit('hideExtraNetworks')
         },
         onTagClick(id) {
             if (this.tagClickTimeId) clearTimeout(this.tagClickTimeId)

styles/main.less

@@ -2049,6 +2049,77 @@
 
     // .physton-highlight-prompt
     --physton-highlight-prompt-background: rgba(0, 175, 255, 0.2);
+
+    // .physton-prompt-extra-networks-popup
+    --ppenp-display: block;
+    --ppenp-position: absolute;
+    --ppenp-top: 0;
+    --ppenp-left: 0;
+    --ppenp-z-index: 999;
+    --ppenp-background: rgba(0, 0, 0, 0.8);
+    --ppenp-border-radius: 6px;
+    --ppenp-color: #fff;
+    --ppenp-overflow: hidden;
+    --ppenp-box-shadow: 0 0 3px 0 @common-blue;
+    --ppenp-box-sizing: border-box;
+
+    // .physton-prompt-extra-networks-popup .popup-main
+    --ppenp-popupMain-display: flex;
+    --ppenp-popupMain-justify-content: flex-start;
+    --ppenp-popupMain-align-items: flex-start;
+
+    // .physton-prompt-extra-networks-popup .popup-main .info-preview
+    --ppenp-pm-infoPreview-width: 0;
+    --ppenp-pm-infoPreview-height: 0;
+    --ppenp-pm-infoPreview-display: block;
+
+    // .physton-prompt-extra-networks-popup .popup-main .info-raws .info-raw
+    --ppenp-pm-ir-infoRaw-display: flex;
+    --ppenp-pm-ir-infoRaw-justify-content: space-between;
+    --ppenp-pm-ir-infoRaw-align-items: flex-start;
+    --ppenp-pm-ir-infoRaw-padding: 2px 5px;
+    --ppenp-pm-ir-infoRaw-border-bottom: 1px dashed rgba(186, 186, 186, .2);
+
+    // .physton-prompt-extra-networks-popup .popup-main .info-raws .info-raw .raw-name
+    --ppenp-pm-ir-ir-rawName-color: #fff;
+    --ppenp-pm-ir-ir-rawName-white-space: nowrap;
+    --ppenp-pm-ir-ir-rawName-margin-right: 20px;
+    --ppenp-pm-ir-ir-rawName-font-size: 12px;
+    --ppenp-pm-ir-ir-rawName-line-height: 16px;
+
+    // .physton-prompt-extra-networks-popup .popup-main .info-raws .info-raw .raw-value
+    --ppenp-pm-ir-ir-rawValue-flex: 1;
+    --ppenp-pm-ir-ir-rawValue-color: #fff;
+    --ppenp-pm-ir-ir-rawValue-white-space: break-spaces;
+    --ppenp-pm-ir-ir-rawValue-word-break: break-all;
+    --ppenp-pm-ir-ir-rawValue-width: 250px;
+    --ppenp-pm-ir-ir-rawValue-text-align: right;
+    --ppenp-pm-ir-ir-rawValue-font-size: 12px;
+    --ppenp-pm-ir-ir-rawValue-line-height: 16px;
+    --ppenp-pm-ir-ir-rawValue-cursor: pointer;
+
+    // .physton-prompt-extra-networks-popup .popup-main .info-raws .info-raw .description
+    --ppenp-pm-ir-ir-description-max-height: 32px;
+    --ppenp-pm-ir-ir-description-overflow: hidden;
+    --ppenp-pm-ir-ir-description-text-overflow: ellipsis;
+
+    // .physton-prompt-extra-networks-popup .popup-main .info-btns
+    --ppenp-pm-infoBtns-display: flex;
+    --ppenp-pm-infoBtns-justify-content: flex-end;
+    --ppenp-pm-infoBtns-align-items: center;
+    --ppenp-pm-infoBtns-padding: 2px 5px;
+
+    // .physton-prompt-extra-networks-popup .popup-main .info-btns .info-btn
+    --ppenp-pm-ib-infoBtn-background: #416972;
+    --ppenp-pm-ib-infoBtn-display: inline-block;
+    --ppenp-pm-ib-infoBtn-padding: 4px 6px;
+    --ppenp-pm-ib-infoBtn-border-radius: 5px;
+    --ppenp-pm-ib-infoBtn-margin-right: 10px;
+    --ppenp-pm-ib-infoBtn-cursor: pointer;
+    --ppenp-pm-ib-infoBtn-font-size: 12px;
+
+    // .physton-prompt-extra-networks-popup .popup-main .info-btns .info-btn:last-child
+    --ppenp-pm-ib-infoBtnLastChild-margin-right: 0;
 }
 
 .hover-scale-120 {
@@ -4672,6 +4743,94 @@
     }
 }
 
+.physton-prompt-extra-networks-popup {
+    display: var(--ppenp-display);
+    position: var(--ppenp-position);
+    top: var(--ppenp-top);
+    left: var(--ppenp-left);
+    z-index: var(--ppenp-z-index);
+    background: var(--ppenp-background);
+    border-radius: var(--ppenp-border-radius);
+    color: var(--ppenp-color);
+    overflow: var(--ppenp-overflow);
+    box-shadow: var(--ppenp-box-shadow);
+    box-sizing: var(--ppenp-box-sizing);
+
+    .popup-main {
+        display: var(--ppenp-popupMain-display);
+        justify-content: var(--ppenp-popupMain-justify-content);
+        align-items: var(--ppenp-popupMain-align-items);
+
+        .info-preview {
+            width: var(--ppenp-pm-infoPreview-width);
+            height: var(--ppenp-pm-infoPreview-height);
+            display: var(--ppenp-pm-infoPreview-display);
+        }
+
+        .info-raws {
+
+            .info-raw {
+                display: var(--ppenp-pm-ir-infoRaw-display);
+                justify-content: var(--ppenp-pm-ir-infoRaw-justify-content);
+                align-items: var(--ppenp-pm-ir-infoRaw-align-items);
+                padding: var(--ppenp-pm-ir-infoRaw-padding);
+                border-bottom: var(--ppenp-pm-ir-infoRaw-border-bottom);
+
+                .raw-name {
+                    color: var(--ppenp-pm-ir-ir-rawName-color);
+                    white-space: var(--ppenp-pm-ir-ir-rawName-white-space);
+                    margin-right: var(--ppenp-pm-ir-ir-rawName-margin-right);
+                    font-size: var(--ppenp-pm-ir-ir-rawName-font-size);
+                    line-height: var(--ppenp-pm-ir-ir-rawName-line-height);
+                }
+
+                .raw-value {
+                    flex: var(--ppenp-pm-ir-ir-rawValue-flex);
+                    color: var(--ppenp-pm-ir-ir-rawValue-color);
+                    white-space: var(--ppenp-pm-ir-ir-rawValue-white-space);
+                    word-break: var(--ppenp-pm-ir-ir-rawValue-word-break);
+                    width: var(--ppenp-pm-ir-ir-rawValue-width);
+                    text-align: var(--ppenp-pm-ir-ir-rawValue-text-align);
+                    font-size: var(--ppenp-pm-ir-ir-rawValue-font-size);
+                    line-height: var(--ppenp-pm-ir-ir-rawValue-line-height);
+                    cursor: var(--ppenp-pm-ir-ir-rawValue-cursor);
+                    -webkit-user-select: none;
+                    -moz-user-select: none;
+                    -ms-user-select: none;
+                    user-select: none;
+                }
+
+                .description {
+                    max-height: var(--ppenp-pm-ir-ir-description-max-height);
+                    overflow: var(--ppenp-pm-ir-ir-description-overflow);
+                    text-overflow: var(--ppenp-pm-ir-ir-description-text-overflow);
+                }
+            }
+        }
+
+        .info-btns {
+            display: var(--ppenp-pm-infoBtns-display);
+            justify-content: var(--ppenp-pm-infoBtns-justify-content);
+            align-items: var(--ppenp-pm-infoBtns-align-items);
+            padding: var(--ppenp-pm-infoBtns-padding);
+
+            .info-btn {
+                background: var(--ppenp-pm-ib-infoBtn-background);
+                display: var(--ppenp-pm-ib-infoBtn-display);
+                padding: var(--ppenp-pm-ib-infoBtn-padding);
+                border-radius: var(--ppenp-pm-ib-infoBtn-border-radius);
+                margin-right: var(--ppenp-pm-ib-infoBtn-margin-right);
+                cursor: var(--ppenp-pm-ib-infoBtn-cursor);
+                font-size: var(--ppenp-pm-ib-infoBtn-font-size);
+
+                &:last-child {
+                    margin-right: var(--ppenp-pm-ib-infoBtnLastChild-margin-right);
+                }
+            }
+        }
+    }
+}
+
 .physton-highlight-prompt {
     background: var(--physton-highlight-prompt-background);
 }