From 49b14939c415636c38a63606a04554b959093895 Mon Sep 17 00:00:00 2001 From: kwaroran Date: Fri, 7 Jun 2024 17:14:21 +0900 Subject: [PATCH] feat: add quote colors --- src/lib/Setting/Pages/AdvancedSettings.svelte | 5 - src/lib/Setting/Pages/DisplaySettings.svelte | 8 + src/lib/Setting/Pages/PluginSettings.svelte | 6 - src/styles.css | 12 + src/ts/gui/colorscheme.ts | 10 + src/ts/parser.ts | 24 +- src/ts/plugins/automark.ts | 255 +++++++++--------- src/ts/process/scripts.ts | 4 - src/ts/storage/database.ts | 9 +- 9 files changed, 180 insertions(+), 153 deletions(-) diff --git a/src/lib/Setting/Pages/AdvancedSettings.svelte b/src/lib/Setting/Pages/AdvancedSettings.svelte index d1183d46..036d9628 100644 --- a/src/lib/Setting/Pages/AdvancedSettings.svelte +++ b/src/lib/Setting/Pages/AdvancedSettings.svelte @@ -105,11 +105,6 @@ -
- - - -
{#if $DataBase.showUnrecommended}
diff --git a/src/lib/Setting/Pages/DisplaySettings.svelte b/src/lib/Setting/Pages/DisplaySettings.svelte index b88f4a54..a4ec9fb1 100644 --- a/src/lib/Setting/Pages/DisplaySettings.svelte +++ b/src/lib/Setting/Pages/DisplaySettings.svelte @@ -127,6 +127,14 @@ Italic Bold Text
+
+ + Single Quote Text +
+
+ + Double Quote Text +
{/if} {language.UISize} diff --git a/src/lib/Setting/Pages/PluginSettings.svelte b/src/lib/Setting/Pages/PluginSettings.svelte index ecea3c42..9ab4793e 100644 --- a/src/lib/Setting/Pages/PluginSettings.svelte +++ b/src/lib/Setting/Pages/PluginSettings.svelte @@ -18,12 +18,6 @@
-
- AutoMark (Official Plugin) -
-
- -
Metric Systemizer (Official Plugin)
diff --git a/src/styles.css b/src/styles.css index cef1b6f1..d84e08ed 100644 --- a/src/styles.css +++ b/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; diff --git a/src/ts/gui/colorscheme.ts b/src/ts/gui/colorscheme.ts index 72f4b91e..80672109 100644 --- a/src/ts/gui/colorscheme.ts +++ b/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 } } diff --git a/src/ts/parser.ts b/src/ts/parser.ts index f79a3f27..c173f935 100644 --- a/src/ts/parser.ts +++ b/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), { - ADD_TAGS: ["iframe", "style", "risu-style", "x-em"], - ADD_ATTR: ["allow", "allowfullscreen", "frameborder", "scrolling", "risu-btn", 'risu-trigger'], - })) - } - else{ - 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'], - })) - } + + data = encodeStyle(data) + data = risuFormater(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', 'risu-mark'], + })) } export function parseMarkdownSafe(data:string) { diff --git a/src/ts/plugins/automark.ts b/src/ts/plugins/automark.ts index 9ded4aab..73a2c07a 100644 --- a/src/ts/plugins/automark.ts +++ b/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){ - if(reg.length === 0){ - const pluginRegex = [ - {"comment":"[ πŸ’± ]γ…€κ΅¬μ‘°λ³€ν™˜ #1γ…€=γ…€λŒ€μ‚¬ λΆ€ν˜Έ μˆ˜μ •","in":"β€œ|”","out":"\"","type":"editdisplay","ableFlag":false}, - {"comment":"[ πŸ’± ]γ…€κ΅¬μ‘°λ³€ν™˜ #2γ…€=ㅀ생각 λΆ€ν˜Έ μˆ˜μ •","in":"β€˜|’","out":"'","type":"editdisplay","ableFlag":false}, - {"comment":"[ 🧷 ]γ…€μ΄νƒˆλ¦­μ²΄ #1γ…€=γ…€λ¬Έμž₯ μ•ž 묢음 μΆ”κ°€","in":"^(?!\\d\\.)([\\wγ„±-γ…Žκ°€-힣'])(?!.*[{<>}])|(?<=^\\[.*\\] *|^\\(.*\\) *)([\\wγ„±-γ…Žκ°€-힣'])(?!.*[{<>}])","out":"$1$2","type":"editdisplay","ableFlag":true,"flag":"gm"}, - {"comment":"[ 🧷 ]γ…€μ΄νƒˆλ¦­μ²΄ #2γ…€=γ…€λ¬Έμž₯ λ’€ 묢음 μΆ”κ°€","in":"(?.*)(?","type":"editdisplay","ableFlag":true,"flag":"gm"}, - {"comment":"[ 🧷 ]γ…€λŒ€μ‚¬λ¬ΆμŒ #1γ…€=γ…€λŒ€μ‚¬ μ•ž 묢음 μΆ”κ°€","in":"(?<=.*|^\".*)( +\"[\\S])|(?<=.*|\" +.*)( *\\[)","out":"$1$2","type":"editdisplay","ableFlag":true,"flag":"gm"}, - {"comment":"[ 🧷 ]γ…€λŒ€μ‚¬λ¬ΆμŒ #2γ…€=γ…€λŒ€μ‚¬ λ’€ 묢음 μΆ”κ°€","in":"(?<=^\".*|<\\/em>.*)([\\S]\" +|[\\S]\"(?=[,.…ㄱ-γ…Žκ°€-힣]))|(?<=<\\/em>.*)( *\\] *)","out":"$1$2","type":"editdisplay","ableFlag":true,"flag":"gm"}, - {"comment":"[ 🧷 ]γ…€μƒκ°λ¬ΆμŒ #1γ…€=ㅀ생각 μ•ž 묢음 μΆ”κ°€","in":"(?<=.*? +|\\[|\\[.* +|\\(|\\(.* +|\"|\".*? +)(?)('[\\wγ„±-γ…Žκ°€-힣])","out":"$1$2","type":"editdisplay","ableFlag":true,"flag":"gm"}, - {"comment":"[ 🧷 ]γ…€μƒκ°λ¬ΆμŒ #2γ…€=ㅀ생각 λ’€ 묢음 μΆ”κ°€","in":"(?<=')(.*?')(?= +.+?|[γ„±-γ…Žκ°€-힣?!:;,.…—-])|(?<='.*)(')(?=<\\/em>|\")|(?<=\\(')(?=\\))","out":"$1$2","type":"editdisplay","ableFlag":true,"flag":"gm"}, - {"comment":"[ πŸ“ ]γ…€μΆ”κ°€ν•«ν‚€ #1γ…€=γ…€λ”°μ˜΄ν‘œ μΆ”κ°€ : (`)","in":"(? { + for(const tag of selfClosingTags){ + if(dat.startsWith(tag)){ + return true } } - for(let i=0;i { - for(const text of excludeTexts){ - if(data.startsWith(text)){ - return document.createTextNode(data) +export function risuFormater(dat:string){ + const lines:[string,string][] = [['','']] // [type, content] + let htmlType = 0 // 0: not inside tag, 1: closing tag, 2: opening tag + for(let i=0;i 64 && code < 91) || (code > 96 && code < 123) || (code > 127 && code < 256) + if(dat[i] === '>' && lines[lines.length-1][0] === 'html-tag'){ + const pop = lines.pop() + const tagAttr = pop[1].substring(1).trim() + if(htmlType === 1){ + const pop2 = lines.pop() //probably html-inner + const chunk = pop2[1] + pop[1] + '>' + if(lines[lines.length-1][0] === ''){ + 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){ - switch(data[index]){ + + //code block handling + + 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') || 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${pop}${line[j]}` } else{ - stacks[stackIndex].appendChild(document.createTextNode(stackText[stackIndex])) - stackText[stackIndex] = "" - stacks.push(document.createElement('x-placeholder')) - stackText.push(data[index]) - stackType.push(1) - stackIndex++ + depthChunkType.push('"') + depthChunk.push(line[j]) + depth++ } break } case "'": - case "β€˜": - case "’":{ - if(stackType[stackIndex] === 2){ - if(data[index+1] === undefined || !isAlpha(data[index+1])){ - const stack = stacks.pop() - stackText[stackIndex] += data[index] - stack.appendChild(document.createTextNode(stackText.pop())) - stackType.pop() - stackIndex-- - stacks[stackIndex].appendChild(stack) + case 'β€˜': + case '’':{ + if(depthChunkType[depth] === "'"){ + if(line[j-1] === '' || (line[j-2] === 'i' && line[j-1] === 'n')){ + //this is not a quote + depthChunk[depth] += line[j] } else{ - stackText[stackIndex] += data[index] + depthChunkType.pop() + const pop = depthChunk.pop() + depth-- + depthChunk[depth] += `${pop}${line[j]}` } } else{ - if(data[index-1] === ' ' || data[index-1] === '\n' || data[index-1] === undefined){ - stacks[stackIndex].appendChild(document.createTextNode(stackText[stackIndex])) - stackText[stackIndex] = "" - stacks.push(document.createElement('x-em')) - stackText.push(data[index]) - stackType.push(2) - stackIndex++ + if(line[j-1] !== ' ' || line[j+1] === ' '){ + //this is not a quote + depthChunk[depth] += line[j] } 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 0){ + result += depthChunk.pop() + } + + result += '\n' } - const domparser = new DOMParser() - const doc = domparser.parseFromString(`${dat}`, 'text/html') - const body = doc.body - console.log(body.innerHTML) - let newChilds:Node[] = [] - for(let i=0;i