ramon
/
skillbox
1
0
Fork 0
Code Issues 1 Pull Requests 1 Packages Projects 1 Releases 1 Wiki Activity

Add solution text to highlight exclusion

This commit is contained in:
Lorenz Padberg 2024-03-19 10:54:29 +01:00
parent 7fc13032ae
commit 431cded293
1 changed files with 11 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
client/src/helpers/highlight.ts
View File

@ -161,6 +161,9 @@ export const getSelectionHandler =
// the selection is inside our container, so we can do something with it // the selection is inside our container, so we can do something with it
const { startContainer, endContainer } = range; const { startContainer, endContainer } = range;
// todo: handle case with paragraphs and list items // todo: handle case with paragraphs and list items
if (startContainer.parentElement && isNotHighlightable(startContainer.parentElement)) {
return;
}
const startAncestor = findClosestAncestorWithTag(startContainer, ['p', 'li']); const startAncestor = findClosestAncestorWithTag(startContainer, ['p', 'li']);
// const endAncestor = findClosestAncestorWithTag(endContainer, 'p'); // const endAncestor = findClosestAncestorWithTag(endContainer, 'p');
if (!startAncestor) { if (!startAncestor) {
@ -175,10 +178,10 @@ export const getSelectionHandler =
const selector = parentSelector ? parentSelector : 'content-component'; const selector = parentSelector ? parentSelector : 'content-component';
const contentComponent = findClosestAncestorWithClass(startContainer, selector); const contentComponent = findClosestAncestorWithClass(startContainer, selector);
if (contentComponent) { if (contentComponent) {
if (contentComponent.classList.contains('content-component--solution')) { if (isNotHighlightable(contentComponent)) {
// Lorenz: I added this to prevent highlighting of the solution. It ain't pretty, but it works
return; return;
} }
// our selection is wholly inside the container node, we continue with it // our selection is wholly inside the container node, we continue with it
const position = findPositionInParent(contentComponent); const position = findPositionInParent(contentComponent);
const uuid = contentComponent.dataset.uuid || ''; const uuid = contentComponent.dataset.uuid || '';
@ -229,6 +232,11 @@ export const getSelectionHandler =
} }
}; };
const isNotHighlightable = (element: HTMLElement) => {
const nonHighlightableClasses = ['content-component--solution', 'solution-text'];
return [...element.classList].some((value) => nonHighlightableClasses.includes(value));
};
export const replacePopover = (highlight: HighlightNode) => { export const replacePopover = (highlight: HighlightNode) => {
// we need to replace the Popover after the Highlight is created // we need to replace the Popover after the Highlight is created
// todo: is there a cleaner way than to look for the element and click it? // todo: is there a cleaner way than to look for the element and click it?
@ -306,6 +314,7 @@ interface ClickListenerCurryOptions {
parent: HTMLElement; // the element (paragraph/list) the highlight is inside parent: HTMLElement; // the element (paragraph/list) the highlight is inside
highlight: HighlightNode; highlight: HighlightNode;
} }
const markClickListenerCurry = const markClickListenerCurry =
({ wrapper, parent, highlight }: ClickListenerCurryOptions) => ({ wrapper, parent, highlight }: ClickListenerCurryOptions) =>
() => { () => {