From 0ff767e4544bec9150090ab92e573a6c5edca0e4 Mon Sep 17 00:00:00 2001 From: kwaroran Date: Tue, 6 Jun 2023 07:17:19 +0900 Subject: [PATCH] [feat] added background embedding --- src/lang/cn.ts | 2 +- src/lang/en.ts | 10 +++++++--- src/lang/ko.ts | 3 ++- src/lib/ChatScreens/BackgroundDom.svelte | 14 ++++++++++++++ src/lib/ChatScreens/ChatScreen.svelte | 9 +++++++-- src/lib/SideBars/CharConfig.svelte | 3 +++ src/ts/parser.ts | 20 +++++++++++++++++--- src/ts/storage/database.ts | 2 ++ 8 files changed, 53 insertions(+), 10 deletions(-) create mode 100644 src/lib/ChatScreens/BackgroundDom.svelte diff --git a/src/lang/cn.ts b/src/lang/cn.ts index 71ce4c21..ac34c54e 100644 --- a/src/lang/cn.ts +++ b/src/lang/cn.ts @@ -81,7 +81,7 @@ export const languageChinese = { utilityBot: "激活后，它会忽略主提示词。\n\n**不建议使用此选项。改为修改系统提示词。**", loreSelective: "如果已切换选择模式，则激活密钥和次级密钥都应有匹配项才能激活lorebook。", loreRandomActivation: "如果启用了使用概率条件，如果lorebook的其他条件都已满足，每次发送聊天时，lorebook将以“概率”设置的概率被激活。", - additionalAssets: "在你的聊天中显示的额外资源。 \n\n - 使用 `{{raw::}}` 作为路径。\n - 使用 `{{img::}}` 作为图片", + additionalAssets: "在你的聊天中显示的额外资源。 \n\n - 使用 `{{raw::}}` 作为路径。\n - 使用 `{{img::}}` 作为图片\n - use `{{video::}}` to use as video\n - use `{{audio::}}` to use as audio (recommended to put in Background HTML)", superMemory: "SuperMemory 通过给 AI 提供总结数据使你的角色记忆更多信息。\n\n" + "SuperMemory 模型是一个总结文本的模型。推荐使用Davinci，除非是具有超过2000个token数的高度总结能力的成人模型，否则不推荐使用辅助模型。\n\n" + "SuperMemory 提示词决定了应发送什么提示词进行总结。如果你留空，它将使用默认提示词。建议留空。\n\n" diff --git a/src/lang/en.ts b/src/lang/en.ts index 5e46dfa9..c5e5ec2b 100644 --- a/src/lang/en.ts +++ b/src/lang/en.ts @@ -80,12 +80,15 @@ export const languageEnglish = { utilityBot: "When activated, it ignores main prompt. \n\n**It is not recommended to use this option. Modifiy system prompt instead.**", loreSelective: "If Selective mode is toggled, both Activation Key and Secondary key should have a match to activate the lore.", loreRandomActivation: "If Use Probability Condition is abled, if the lore's other conditions are all met, the lore will be activated with a set probability which is set by 'Probability' each time a chat is sent.", - additionalAssets: "Additional assets to display in your chat. \n\n - use `{{raw::}}` to use as path.\n - use `{{img::}}` to use as image", + additionalAssets: "Additional assets to display in your chat. \n\n - use `{{raw::}}` to use as path.\n - use `{{img::}}` to use as image\n - use `{{video::}}` to use as video\n - use `{{audio::}}` to use as audio\n - recommended to put in Background HTML", superMemory: "SuperMemory makes your character memorize more by giving summarized data to AI.\n\n" + "SuperMemory model is a model that summarizes that text. davinci is recommended, and Auxiliary models are not recommended unless it is an unfiltered model with over 2000 tokens with great summarizing skill.\n\n" + "SuperMemory Prompt decides what prompt should be sent to summarize. if you leave it blank, it will use the default prompt. leaving blank is recommended.\n\n" + "After it is all setup, you can able it in the setting of a character.", - replaceGlobalNote: "If its not blank, it replaces current global note to this." + replaceGlobalNote: "If its not blank, it replaces current global note to this.", + backgroundHTML: "A Markdown/HTML Data that would be injected to the background of chat screen.\n\n you can also use additional assets. for example, you can use `{{audio::}}`: inject the background as asset" }, setup: { chooseProvider: "Choose AI Provider", @@ -300,5 +303,6 @@ export const languageEnglish = { activationProbability: "Probability", shareCloud: "Share to RisuRealm", hub: "RisuRealm", - tags: "Tags" + tags: "Tags", + backgroundHTML: "Background Embedding" } \ No newline at end of file diff --git a/src/lang/ko.ts b/src/lang/ko.ts index ac5bb1ca..9049a5c6 100644 --- a/src/lang/ko.ts +++ b/src/lang/ko.ts @@ -275,5 +275,6 @@ export const languageKorean = { talkness: "대화량", active: "활성화", loreRandomActivation: "확률 조건 사용", - activationProbability: "발동 확률" + activationProbability: "발동 확률", + backgroundHTML: "백그라운드 임베딩" } \ No newline at end of file diff --git a/src/lib/ChatScreens/BackgroundDom.svelte b/src/lib/ChatScreens/BackgroundDom.svelte new file mode 100644 index 00000000..6ac2d0ef --- /dev/null +++ b/src/lib/ChatScreens/BackgroundDom.svelte @@ -0,0 +1,14 @@ + + + +{#if $selectedCharID > 0 && $DataBase.characters[$selectedCharID].backgroundHTML} +
+ {#await ParseMarkdown($DataBase.characters[$selectedCharID].backgroundHTML, $DataBase.characters[$selectedCharID], 'back') then md} + {@html md} + {/await} +
+{/if} \ No newline at end of file diff --git a/src/lib/ChatScreens/ChatScreen.svelte b/src/lib/ChatScreens/ChatScreen.svelte index beb6f00c..808feacf 100644 --- a/src/lib/ChatScreens/ChatScreen.svelte +++ b/src/lib/ChatScreens/ChatScreen.svelte @@ -7,6 +7,7 @@ import defaultWallpaper from '../../etc/bg.jpg' import ChatList from "../Others/ChatList.svelte"; import TransitionImage from "./TransitionImage.svelte"; + import BackgroundDom from "./BackgroundDom.svelte"; let openChatList = false const wallPaper = `background: url(${defaultWallpaper})` @@ -26,16 +27,19 @@ })() {#if $DataBase.theme === ''} -
+
+ {#if $selectedCharID >= 0} {#if $DataBase.characters[$selectedCharID].viewScreen !== 'none'} {/if} {/if} + 2 ? `${externalStyles}`: ''} bind:openChatList/>
{:else if $DataBase.theme === 'waifu'} -
+
+ {#if $selectedCharID >= 0} {#if $DataBase.characters[$selectedCharID].viewScreen !== 'none'}
@@ -49,6 +53,7 @@
{:else if $DataBase.theme === 'waifuMobile'}
+
diff --git a/src/lib/SideBars/CharConfig.svelte b/src/lib/SideBars/CharConfig.svelte index 14ae070e..5f3894b8 100644 --- a/src/lib/SideBars/CharConfig.svelte +++ b/src/lib/SideBars/CharConfig.svelte @@ -553,6 +553,9 @@ {/if} + {language.backgroundHTML} + + {language.creator} diff --git a/src/ts/parser.ts b/src/ts/parser.ts index c21e1fb4..92cc7bc8 100644 --- a/src/ts/parser.ts +++ b/src/ts/parser.ts @@ -26,7 +26,14 @@ DOMPurify.addHook("uponSanitizeElement", (node: HTMLElement, data) => { } }); -export async function ParseMarkdown(data:string, char:(character | groupChat) = null) { +DOMPurify.addHook("uponSanitizeAttribute", (node) => { + const style = node.getAttribute("style"); + if(style){ + node.setAttribute('style', style.replace(/(absolute)|(z-index)|(fixed)/g, '')) + } +}) + +export async function ParseMarkdown(data:string, char:(character | groupChat) = null, mode:'normal'|'back' = 'normal') { if(char && char.type !== 'group'){ if(char.customscript){ data = processScript(char, data, 'editdisplay') @@ -34,7 +41,13 @@ export async function ParseMarkdown(data:string, char:(character | groupChat) = if(char.additionalAssets){ for(const asset of char.additionalAssets){ const assetPath = await getFileSrc(asset[1]) - data = data.replaceAll(`{{raw::${asset[0]}}}`, assetPath).replaceAll(`{{img::${asset[0]}}}`,``) + data = data.replaceAll(`{{raw::${asset[0]}}}`, assetPath). + replaceAll(`{{img::${asset[0]}}}`,``) + .replaceAll(`{{video::${asset[0]}}}`,``) + .replaceAll(`{{audio::${asset[0]}}}`,``) + if(mode === 'back'){ + data = data.replaceAll(`{{bg::${asset[0]}}}`, `
`) + } } } } @@ -46,7 +59,8 @@ export async function ParseMarkdown(data:string, char:(character | groupChat) = export function parseMarkdownSafe(data:string) { return DOMPurify.sanitize(safeConvertor.makeHtml(data), { - FORBID_TAGS: ["a", "style"] + FORBID_TAGS: ["a", "style"], + FORBID_ATTR: ["style"] }) } diff --git a/src/ts/storage/database.ts b/src/ts/storage/database.ts index 9384b390..7bcb1ec9 100644 --- a/src/ts/storage/database.ts +++ b/src/ts/storage/database.ts @@ -335,6 +335,7 @@ export interface character{ additionalAssets?:[string, string][] ttsReadOnlyQuoted?:boolean replaceGlobalNote:string + backgroundHTML?:string } @@ -371,6 +372,7 @@ export interface groupChat{ ttsMode?:string suggestMessages?:string[] orderByOrder?:boolean + backgroundHTML?:string } export interface botPreset{