Vanessa 2025-10-12 11:30:51 +08:00
parent dd34f25b94
commit 130dd32801
3 changed files with 14 additions and 5 deletions

View file

@ -90,8 +90,8 @@ export class Protyle {
if (isSupportCSSHL()) { if (isSupportCSSHL()) {
const styleId = genUUID(); const styleId = genUUID();
this.protyle.highlight.styleElement.dataset.uuid = styleId; this.protyle.highlight.styleElement.dataset.uuid = styleId;
this.protyle.highlight.styleElement.textContent = `.protyle-wysiwyg::highlight(search-mark-${styleId}) {background-color: var(--b3-highlight-background);color: var(--b3-highlight-color);} this.protyle.highlight.styleElement.textContent = `.protyle-content::highlight(search-mark-${styleId}) {background-color: var(--b3-highlight-background);color: var(--b3-highlight-color);}
.protyle-wysiwyg::highlight(search-mark-hl-${styleId}) {color: var(--b3-highlight-color);background-color: var(--b3-highlight-current-background)}`; .protyle-content::highlight(search-mark-hl-${styleId}) {color: var(--b3-highlight-color);background-color: var(--b3-highlight-current-background)}`;
} }
this.protyle.hint = new Hint(this.protyle); this.protyle.hint = new Hint(this.protyle);

View file

@ -8,6 +8,7 @@ export const searchMarkRender = (protyle: IProtyle, keys: string[], hlId?: strin
setTimeout(() => { setTimeout(() => {
protyle.highlight.markHL.clear(); protyle.highlight.markHL.clear();
protyle.highlight.mark.clear(); protyle.highlight.mark.clear();
protyle.highlight.rangeIndex = 0;
protyle.highlight.ranges = []; protyle.highlight.ranges = [];
let isSetHL = false; let isSetHL = false;
let hlBlockElement: Element; let hlBlockElement: Element;
@ -20,12 +21,16 @@ export const searchMarkRender = (protyle: IProtyle, keys: string[], hlId?: strin
}); });
} }
if (!hlBlockElement && hlId === protyle.block.rootID && protyle.title && !protyle.title.element.classList.contains("fn__none")) {
hlBlockElement = protyle.title.element;
}
// 准备一个数组来保存所有文本节点 // 准备一个数组来保存所有文本节点
const textNodes: Node[] = []; const textNodes: Node[] = [];
const textNodesSize: number[] = []; const textNodesSize: number[] = [];
let currentSize = 0; let currentSize = 0;
const treeWalker = document.createTreeWalker(protyle.wysiwyg.element, NodeFilter.SHOW_TEXT); const treeWalker = document.createTreeWalker(protyle.contentElement, NodeFilter.SHOW_TEXT);
let currentNode = treeWalker.nextNode(); let currentNode = treeWalker.nextNode();
while (currentNode) { while (currentNode) {
textNodes.push(currentNode); textNodes.push(currentNode);
@ -34,7 +39,7 @@ export const searchMarkRender = (protyle: IProtyle, keys: string[], hlId?: strin
currentNode = treeWalker.nextNode(); currentNode = treeWalker.nextNode();
} }
const text = protyle.wysiwyg.element.textContent; const text = protyle.contentElement.textContent;
const rangeIndexes: { range: Range, startIndex: number, isCurrent: boolean }[] = []; const rangeIndexes: { range: Range, startIndex: number, isCurrent: boolean }[] = [];
if (keys && keys.length > 0) { if (keys && keys.length > 0) {
keys.forEach(key => { keys.forEach(key => {

View file

@ -1123,6 +1123,7 @@ export const getArticle = (options: {
const contentRect = options.edit.protyle.contentElement.getBoundingClientRect(); const contentRect = options.edit.protyle.contentElement.getBoundingClientRect();
if (isSupportCSSHL()) { if (isSupportCSSHL()) {
let observer:ResizeObserver;
searchMarkRender(options.edit.protyle, getResponse.data.keywords, options.id, () => { searchMarkRender(options.edit.protyle, getResponse.data.keywords, options.id, () => {
const highlightKeys = () => { const highlightKeys = () => {
const currentRange = options.edit.protyle.highlight.ranges[options.edit.protyle.highlight.rangeIndex]; const currentRange = options.edit.protyle.highlight.ranges[options.edit.protyle.highlight.rangeIndex];
@ -1136,8 +1137,11 @@ export const getArticle = (options: {
highlightById(options.edit.protyle, options.id); highlightById(options.edit.protyle, options.id);
} }
}; };
if (observer) {
observer.disconnect();
}
highlightKeys(); highlightKeys();
const observer = new ResizeObserver(() => { observer = new ResizeObserver(() => {
highlightKeys(); highlightKeys();
}); });
observer.observe(options.edit.protyle.wysiwyg.element); observer.observe(options.edit.protyle.wysiwyg.element);