feat: add quote colors

src/lib/Setting/Pages/AdvancedSettings.svelte

@@ -105,11 +105,6 @@
         <Help key="experimental"/><Help key="oaiRandomUser"/>
     </Check>
 </div>
-<div class="flex items-center mt-4">
-    <Check bind:check={$DataBase.automark} name={language.nativeAutomark}>
-        <Help key="experimental"/>
-    </Check>
-</div>
 {#if $DataBase.showUnrecommended}
     <div class="flex items-center mt-4">
         <Check bind:check={$DataBase.chainOfThought} name={language.cot}>

src/lib/Setting/Pages/DisplaySettings.svelte

@@ -127,6 +127,14 @@
         <input type="color" class="style2 text-sm" bind:value={$DataBase.customTextTheme.FontColorItalicBold} on:change={updateTextTheme}>
         <span class="ml-2">Italic Bold Text</span>
     </div>
+    <div class="flex items-center mt-2">
+        <input type="color" class="style2 text-sm" bind:value={$DataBase.customTextTheme.FontColorQuote1} on:change={updateTextTheme}>
+        <span class="ml-2">Single Quote Text</span>
+    </div>
+    <div class="flex items-center mt-2">
+        <input type="color" class="style2 text-sm" bind:value={$DataBase.customTextTheme.FontColorQuote2} on:change={updateTextTheme}>
+        <span class="ml-2">Double Quote Text</span>
+    </div>
 {/if}
 
 <span class="text-textcolor mt-4">{language.UISize}</span>

src/lib/Setting/Pages/PluginSettings.svelte

@@ -18,12 +18,6 @@
 
 
 <div class="border-solid border-borderc p-2 flex flex-col border-1">
-    <div class="flex">
-        <span class="font-bold flex-grow">AutoMark <span class="text-green-500 italic">(Official Plugin)</span></span>
-    </div>
-    <div class="flex items-center mt-2">
-        <Check bind:check={$DataBase.officialplugins.automark} name={language.able}/>
-    </div>
     <div class="flex">
         <span class="font-bold flex-grow">Metric Systemizer <Help key="metrica" /> <span class="text-green-500 italic">(Official Plugin)</span></span>
     </div>

src/styles.css

@@ -16,6 +16,8 @@ body{
   --FontColorBold : ##e5e5e5;
   --FontColorItalic : #8C8D93;
   --FontColorItalicBold : #8C8D93;
+  --FontColorQuote1 : #8C8D93;
+  --FontColorQuote2 : #8C8D93;
   --risu-animation-speed: 0.2s;
   --risu-theme-bgcolor: #282a36;
   --risu-theme-darkbg:  #21222c;
@@ -72,6 +74,16 @@ html, body{
   font-weight: bold;
 }
 
+.chattext mark[risu-mark=quote1]{
+  background-color: transparent;
+  color: var(--FontColorQuote1);
+}
+
+.chattext mark[risu-mark=quote2]{
+  background-color: transparent;
+  color: var(--FontColorQuote2);
+}
+
 .strokeme {
   color: #000;
   text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;

src/ts/gui/colorscheme.ts

@@ -184,11 +184,15 @@ export function updateTextTheme(){
                 root.style.setProperty('--FontColorItalic', '#8C8D93');
                 root.style.setProperty('--FontColorBold', '#fafafa');
                 root.style.setProperty('--FontColorItalicBold', '#8C8D93');
+                root.style.setProperty('--FontColorQuote1', '#8BE9FD');
+                root.style.setProperty('--FontColorQuote2', '#FFB86C');
             }else{
                 root.style.setProperty('--FontColorStandard', '#0f172a');
                 root.style.setProperty('--FontColorItalic', '#8C8D93');
                 root.style.setProperty('--FontColorBold', '#0f172a');
                 root.style.setProperty('--FontColorItalicBold', '#8C8D93');
+                root.style.setProperty('--FontColorQuote1', '#8BE9FD');
+                root.style.setProperty('--FontColorQuote2', '#FFB86C');
             }
             break
         }
@@ -198,12 +202,16 @@ export function updateTextTheme(){
                 root.style.setProperty('--FontColorItalic', '#F1FA8C');
                 root.style.setProperty('--FontColorBold', '#8BE9FD');
                 root.style.setProperty('--FontColorItalicBold', '#FFB86C');
+                root.style.setProperty('--FontColorQuote1', '#8BE9FD');
+                root.style.setProperty('--FontColorQuote2', '#FFB86C');
             }
             else{
                 root.style.setProperty('--FontColorStandard', '#0f172a');
                 root.style.setProperty('--FontColorItalic', '#F1FA8C');
                 root.style.setProperty('--FontColorBold', '#8BE9FD');
                 root.style.setProperty('--FontColorItalicBold', '#FFB86C');
+                root.style.setProperty('--FontColorQuote1', '#8BE9FD');
+                root.style.setProperty('--FontColorQuote2', '#FFB86C');
             }
             break
         }
@@ -212,6 +220,8 @@ export function updateTextTheme(){
             root.style.setProperty('--FontColorItalic', db.customTextTheme.FontColorItalic);
             root.style.setProperty('--FontColorBold', db.customTextTheme.FontColorBold);
             root.style.setProperty('--FontColorItalicBold', db.customTextTheme.FontColorItalicBold);
+            root.style.setProperty('--FontColorQuote1', db.customTextTheme.FontColorQuote1);
+            root.style.setProperty('--FontColorQuote2', db.customTextTheme.FontColorQuote2);
             break
         }
     }

src/ts/parser.ts

@@ -11,7 +11,7 @@ import { selectedCharID } from './stores';
 import { calcString } from './process/infunctions';
 import { findCharacterbyId, parseKeyValue, sfc32, uuidtoNumber } from './util';
 import { getInlayImage } from './process/files/image';
-import { autoMarkNew } from './plugins/automark';
+import { risuFormater } from './plugins/automark';
 import { getModuleLorebooks } from './process/modules';
 import { HypaProcesser } from './process/memory/hypamemory';
 
@@ -194,20 +194,14 @@ export async function ParseMarkdown(data:string, charArg:(character|simpleCharac
         data = await parseAdditionalAssets(data, char, mode, 'post')
     }
     data = await parseInlayImages(data)
-    if(db.automark){
+
-        return (DOMPurify.sanitize(autoMarkNew(data), {
+    data = encodeStyle(data)
-            ADD_TAGS: ["iframe", "style", "risu-style", "x-em"],
+    data = risuFormater(data)
-            ADD_ATTR: ["allow", "allowfullscreen", "frameborder", "scrolling", "risu-btn", 'risu-trigger'],
+    data = mconverted.parse(data)
-        }))
+    return decodeStyle(DOMPurify.sanitize(data, {
-    }
+        ADD_TAGS: ["iframe", "style", "risu-style", "x-em"],
-    else{
+        ADD_ATTR: ["allow", "allowfullscreen", "frameborder", "scrolling", "risu-btn", 'risu-trigger', 'risu-mark'],
-        data = encodeStyle(data)
+    }))
-        data = mconverted.parse(data)
-        return decodeStyle(DOMPurify.sanitize(data, {
-            ADD_TAGS: ["iframe", "style", "risu-style", "x-em"],
-            ADD_ATTR: ["allow", "allowfullscreen", "frameborder", "scrolling", "risu-btn", 'risu-trigger'],
-        }))
-    }
 }
 
 export function parseMarkdownSafe(data:string) {

src/ts/plugins/automark.ts

@@ -1,159 +1,172 @@
-const reg:[RegExp,string][] = []
 
+const excludesDat = ['<','>','{','}','[',']','(',')','-',':',';','…','—','–','_','*','+','/','\\','|','!','?','.',',',' ']
+const selfClosingTags = ['br','hr','img','input','meta','link','base','area','col','command','embed','keygen','param','source','track','wbr']
 
-export function autoMarkPlugin(data:string){
+const checkSelfClosingTag = (dat:string) => {
-    if(reg.length === 0){
+    for(const tag of selfClosingTags){
-        const pluginRegex = [
+        if(dat.startsWith(tag)){
-          {"comment":"[ 💱 ]ㅤ구조변환 #1ㅤ=ㅤ대사 부호 수정","in":"“|”","out":"\"","type":"editdisplay","ableFlag":false},
+            return true
-          {"comment":"[ 💱 ]ㅤ구조변환 #2ㅤ=ㅤ생각 부호 수정","in":"‘|’","out":"'","type":"editdisplay","ableFlag":false},
-          {"comment":"[ 🧷 ]ㅤ이탈릭체 #1ㅤ=ㅤ문장 앞 묶음 추가","in":"^(?!\\d\\.)([\\wㄱ-ㅎ가-힣'])(?!.*[{<>}])|(?<=^\\[.*\\] *|^\\(.*\\) *)([\\wㄱ-ㅎ가-힣'])(?!.*[{<>}])","out":"<em>$1$2","type":"editdisplay","ableFlag":true,"flag":"gm"},
-          {"comment":"[ 🧷 ]ㅤ이탈릭체 #2ㅤ=ㅤ문장 뒤 묶음 추가","in":"(?<!^ +.*)(\".*|<em>.*)(?<!\")$","out":"$1</em>","type":"editdisplay","ableFlag":true,"flag":"gm"},
-          {"comment":"[ 🧷 ]ㅤ대사묶음 #1ㅤ=ㅤ대사 앞 묶음 추가","in":"(?<=<em>.*|^\".*)( +\"[\\S])|(?<=<em>.*|\" +.*)( *\\[)","out":"</em>$1$2","type":"editdisplay","ableFlag":true,"flag":"gm"},
-          {"comment":"[ 🧷 ]ㅤ대사묶음 #2ㅤ=ㅤ대사 뒤 묶음 추가","in":"(?<=^\".*|<\\/em>.*)([\\S]\" +|[\\S]\"(?=[,.…ㄱ-ㅎ가-힣]))|(?<=<\\/em>.*)( *\\] *)","out":"$1$2<em>","type":"editdisplay","ableFlag":true,"flag":"gm"},
-          {"comment":"[ 🧷 ]ㅤ생각묶음 #1ㅤ=ㅤ생각 앞 묶음 추가","in":"(?<=<em>.*? +|\\[|\\[.* +|\\(|\\(.* +|\"|\".*? +)(?<!style=.*)(')|(?<=<em>)('[\\wㄱ-ㅎ가-힣])","out":"<strong><em>$1$2","type":"editdisplay","ableFlag":true,"flag":"gm"},
-          {"comment":"[ 🧷 ]ㅤ생각묶음 #2ㅤ=ㅤ생각 뒤 묶음 추가","in":"(?<=<strong><em>')(.*?')(?= +.+?|[ㄱ-ㅎ가-힣?!:;,.…—-])|(?<=<strong><em>'.*)(')(?=<\\/em>|\")|(?<=\\(<strong><em>')(?=\\))","out":"$1$2</em></strong>","type":"editdisplay","ableFlag":true,"flag":"gm"},
-          {"comment":"[ 📝 ]ㅤ추가핫키 #1ㅤ=ㅤ따옴표 추가 : (`)","in":"(?<!`)`(?!`)","out":"\"","type":"editinput","ableFlag":false},
-          {"comment":"[ 📝 ]ㅤ추가핫키 #2ㅤ=ㅤOOC 추가 : (``)","in":"^``(?!`) *(.*)$","out":"(OOC: $1)","type":"editinput","ableFlag":true,"flag":"gm"}
-        ]
-        for(const r of pluginRegex){
-            reg.push([new RegExp(r.in, r.ableFlag ? r.flag : 'g'),r.out])
         }
     }
-    for(let i=0;i<reg.length;i++){
+    return false
-        data = data.replace(reg[i][0], reg[i][1])
-    }
-
-
-    
-    return data
 }
 
-export function autoMarkNew(dat:string){
+export function risuFormater(dat:string){
-    const excludeTexts = ["#","1.","2.","3.","4.","5.","6.","7.","8.","9.","0."]
+    const lines:[string,string][] = [['','']] // [type, content]
-    const mark = (data:string) => {
+    let htmlType = 0 // 0: not inside tag, 1: closing tag, 2: opening tag
-        for(const text of excludeTexts){
+    for(let i=0;i<dat.length;i++){
-            if(data.startsWith(text)){
+
-                return document.createTextNode(data)
+        //html tag handling
+        if(dat[i] === '<' && lines[lines.length-1][0] !== 'code-block'){
+            lines.push(['html-tag',''])
+            if(dat[i+1] === '/'){
+                htmlType = 1
+            }
+            else{
+                htmlType = 2
             }
         }
 
-        let index = 0
+        if(dat[i] === '>' && lines[lines.length-1][0] === 'html-tag'){
-        let stacks:Node[] = [document.createElement('p')]
+            const pop = lines.pop()
-        let stackText = [""]
+            const tagAttr = pop[1].substring(1).trim()
-        let stackType:number[] = [0]
+            if(htmlType === 1){
-        function isAlpha(str:string) {
+                const pop2 = lines.pop() //probably html-inner
-            //check if string is alphabet, including extended latin by charcode. string.length === 1
+                const chunk = pop2[1] + pop[1] + '>'
-            const code = str.charCodeAt(0)
+                if(lines[lines.length-1][0] === ''){
-            return (code > 64 && code < 91) || (code > 96 && code < 123) || (code > 127 && code < 256)
+                    lines.push(['html-chunk',chunk])
+                    lines.push(['',''])
+                }
+                else{
+                    lines[lines.length-1][1] += chunk
+                }
+                continue
+            }
+            else if(checkSelfClosingTag(tagAttr)){
+                const chunk = pop[1] + '>'
+                if(lines[lines.length-1][0] === ''){
+                    lines.push(['html-chunk',chunk])
+                    lines.push(['',''])
+                }
+                else{
+                    lines[lines.length-1][1] += chunk
+                }
+                continue
+            }
+            else{
+                lines.push(['html-inner',pop[1]])
+            }
+            htmlType = 0
         }
-        let stackIndex = 0
+
-        while(index < data.length){
+        //code block handling
-            switch(data[index]){
+
+        if(dat[i] === '`' && dat[i+1] === '`' && dat[i+2] === '`' && lines[lines.length-1][0] === ''){
+            if(lines[lines.length-1][0] === 'code-block'){
+                lines[lines.length-1][1] += '```'
+                lines.push(['',''])
+            }
+            else{
+                lines.push(['code-block','```'])
+            }
+            i += 2
+            continue
+        }
+        
+
+        if(dat[i] === '\n' && lines[lines.length-1][0] === ''){
+            lines.push(['',''])
+        }
+        else{
+            lines[lines.length-1][1] += dat[i]
+        }
+    }
+
+    let result = ''
+    for(let i=0;i<lines.length;i++){
+        if(lines[i][0] !== ''){
+            result += lines[i][1] + '\n'
+            continue
+        }
+
+        const line = lines[i][1]
+        let isNumbered = false
+        let endMarked = false
+        if(excludesDat.includes(line[0]) || (line[1] === '.' && ['1','2','3','4','5','6','7','8','9'].includes(line[0]))){
+            isNumbered = true
+        }
+        if(line.endsWith('>') || line.endsWith('}') || line.startsWith('<')){
+            endMarked = true
+        }
+
+        if(isNumbered || endMarked){
+            result += line + '\n'
+            continue
+        }
+
+        let depth = 0
+        let depthChunk:string[] = ['']
+        let depthChunkType:string[] = ['']
+        for(let j=0;j<line.length;j++){
+            switch(line[j]){
                 case '"':
                 case '“':
                 case '”':{
-                    if(stackType[stackIndex] === 1){
+                    if(depthChunkType[depth] === '"'){
-                        const stack = stacks.pop()
+                        depthChunkType.pop()
-                        stackText[stackIndex] += data[index]
+                        const pop = depthChunk.pop()
-                        stack.appendChild(document.createTextNode(stackText.pop()))
+                        depth--
-                        stackType.pop()
+                        depthChunk[depth] += `<mark risu-mark="quote2">${pop}${line[j]}</mark>`
-                        stackIndex--
-                        stacks[stackIndex].appendChild(stack)
                     }
                     else{
-                        stacks[stackIndex].appendChild(document.createTextNode(stackText[stackIndex]))
+                        depthChunkType.push('"')
-                        stackText[stackIndex] = ""
+                        depthChunk.push(line[j])
-                        stacks.push(document.createElement('x-placeholder'))
+                        depth++
-                        stackText.push(data[index])
-                        stackType.push(1)
-                        stackIndex++
                     }
                     break
                 }
                 case "'":
-                case "‘":
+                case '‘':
-                case "’":{
+                case '’':{
-                    if(stackType[stackIndex] === 2){
+                    if(depthChunkType[depth] === "'"){
-                        if(data[index+1] === undefined || !isAlpha(data[index+1])){
+                        if(line[j-1] === '' || (line[j-2] === 'i' && line[j-1] === 'n')){
-                            const stack = stacks.pop()
+                            //this is not a quote
-                            stackText[stackIndex] += data[index]
+                            depthChunk[depth] += line[j]
-                            stack.appendChild(document.createTextNode(stackText.pop()))
-                            stackType.pop()
-                            stackIndex--
-                            stacks[stackIndex].appendChild(stack)
                         }
                         else{
-                            stackText[stackIndex] += data[index]
+                            depthChunkType.pop()
+                            const pop = depthChunk.pop()
+                            depth--
+                            depthChunk[depth] += `<mark risu-mark="quote1">${pop}${line[j]}</mark>`
                         }
                     }
                     else{
-                        if(data[index-1] === ' ' || data[index-1] === '\n' || data[index-1] === undefined){
+                        if(line[j-1] !== ' ' || line[j+1] === ' '){
-                            stacks[stackIndex].appendChild(document.createTextNode(stackText[stackIndex]))
+                            //this is not a quote
-                            stackText[stackIndex] = ""
+                            depthChunk[depth] += line[j]
-                            stacks.push(document.createElement('x-em'))
-                            stackText.push(data[index])
-                            stackType.push(2)
-                            stackIndex++
                         }
                         else{
-                            stackText[stackIndex] += data[index]
+                            depthChunkType.push("'")
+                            depthChunk.push(line[j])
+                            depth++
                         }
-
                     }
                     break
+                
                 }
-                case '\n':{
+
-                    stacks[stackIndex].appendChild(document.createTextNode(stackText[stackIndex]))
-                    stackText[stackIndex] = ""
-                    stacks[stackIndex].appendChild(document.createElement('br'))
-                }
                 default:{
-                    stackText[stackIndex] += data[index]
+                    depthChunk[depth] += line[j]
                 }
             }
-            index++
-        }
-        for(let i=stackIndex;i>0;i--){
-            stacks[i-1].appendChild(document.createTextNode(stackText[i]))
-            stacks[i-1].appendChild(stacks[i])
-        }
-        stacks[0].appendChild(document.createTextNode(stackText[0]))
-        const childs = stacks[0].childNodes
-        for(let i=0;i<childs.length;i++){
-            if(childs[i].nodeType === 3){
-                const marked = document.createElement('em')
-                marked.appendChild(document.createTextNode(childs[i].textContent))
-                stacks[0].replaceChild(marked, childs[i])
-            }
         }
 
-        return stacks[0]
+        while(depthChunk.length > 0){
+            result += depthChunk.pop()
+        }
+
+        result += '\n'
     }
 
-    const domparser = new DOMParser()
+    return result.trim()
-    const doc = domparser.parseFromString(`<body>${dat}</body>`, 'text/html')
-    const body = doc.body
-    console.log(body.innerHTML)
-    let newChilds:Node[] = []
-    for(let i=0;i<body.childNodes.length;i++){
-        if(body.childNodes[i].nodeType === 3){
-            const lines = body.childNodes[i].textContent.split('\n')
-            for(let j=0;j<lines.length;j++){
-                newChilds.push(mark(lines[j]))
-            }
-        }
-        else{
-            newChilds.push(body.childNodes[i])
-        }
-    }
-
-    const newBody = document.createElement('body')
-    for(let i=0;i<newChilds.length;i++){
-        if(newChilds[i] === null){
-            continue
-        }
-        newBody.appendChild(newChilds[i])
-    }
-    
-    return newBody.innerHTML
 }

src/ts/process/scripts.ts

@@ -6,7 +6,6 @@ import { alertError, alertNormal } from "../alert";
 import { language } from "src/lang";
 import { selectSingleFile } from "../util";
 import { assetRegex, risuChatParser as risuChatParserOrg, type simpleCharacterArgument } from "../parser";
-import { autoMarkPlugin } from "../plugins/automark";
 import { runCharacterJS } from "../plugins/embedscript";
 import { metricaPlugin } from "../plugins/metrica";
 import { OaiFixKorean } from "../plugins/fixer";
@@ -63,9 +62,6 @@ export async function processScriptFull(char:character|groupChat|simpleCharacter
     let db = get(DataBase)
     let emoChanged = false
     const scripts = (db.globalscript ?? []).concat(char.customscript).concat(getModuleRegexScripts())
-    if(db.officialplugins.automark && mode === 'editdisplay'){
-        data = autoMarkPlugin(data)
-    }
     if(db.officialplugins.metrica && mode === 'editdisplay'){
         data = metricaPlugin(data, 'metrics')
     }

src/ts/storage/database.ts

@@ -270,7 +270,9 @@ export function setDatabase(data:Database){
             FontColorStandard: "#f8f8f2",
             FontColorBold: "#f8f8f2",
             FontColorItalic: "#8C8D93",
-            FontColorItalicBold: "#8C8D93"
+            FontColorItalicBold: "#8C8D93",
+            FontColorQuote1: '#8BE9FD',
+            FontColorQuote2: '#FFB86C'
         }
     }
     if(checkNullish(data.hordeConfig)){
@@ -409,7 +411,8 @@ export function setDatabase(data:Database){
     data.hypaAllocatedTokens ??= 3000
     data.hypaChunkSize ??= 3000
     data.dallEQuality ??= 'standard'
-
+    data.customTextTheme.FontColorQuote1 ??= '#8BE9FD'
+    data.customTextTheme.FontColorQuote2 ??= '#FFB86C'
     changeLanguage(data.language)
     DataBase.set(data)
 }
@@ -500,6 +503,8 @@ export interface Database{
         FontColorBold : string,
         FontColorItalic : string,
         FontColorItalicBold : string,
+        FontColorQuote1 : string,
+        FontColorQuote2 : string
     }
     requestRetrys:number
     emotionPrompt2:string