[feat] added background embedding

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]}}}`,`<img src="${assetPath}" />`)
+                data = data.replaceAll(`{{raw::${asset[0]}}}`, assetPath).
+                        replaceAll(`{{img::${asset[0]}}}`,`<img src="${assetPath}" />`)
+                        .replaceAll(`{{video::${asset[0]}}}`,`<video autoplay loop><source src="${assetPath}" type="video/mp4"></video>`)
+                        .replaceAll(`{{audio::${asset[0]}}}`,`<audio autoplay loop><source src="${assetPath}" type="audio/mpeg"></audio>`)
+                if(mode === 'back'){
+                    data = data.replaceAll(`{{bg::${asset[0]}}}`, `<div style="width:100%;height:100%;background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)),url(${assetPath}); background-size: cover;"></div>`)
+                }
             }
         }
     }
@@ -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"]
     })
 }
 

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{