ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-03 01:25:38 -05:00
Code Issues Packages Projects Releases Wiki Activity

WYSIWYG Improvements to highlight (#13032)

Browse Source 
* Improvements to highlight

* wip

* Tests pass

* Leverage escaping mechanism

* Tweak highlight logic

* PR comments
This commit is contained in:
Chris LaFreniere
2020-12-02 15:51:40 -08:00
committed by GitHub
parent cb567989da
commit d86e1eec10
3 changed files with 149 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/sql/workbench/contrib/notebook/browser/markdownToolbarActions.ts
View File

@@ -65,7 +65,44 @@ export class TransformMarkdownAction extends Action {
document.execCommand('formatBlock', false, 'H3');
break;
case MarkdownButtonType.HIGHLIGHT:
document.execCommand('hiliteColor', false, 'Yellow');
let selectionFocusNode = document.getSelection()?.focusNode;
// Find if element is wrapped in <mark></mark>
while (selectionFocusNode?.parentNode?.nodeName?.toLowerCase() && selectionFocusNode?.parentNode?.nodeName?.toLowerCase() !== 'mark') {
selectionFocusNode = selectionFocusNode.parentNode;
}
// Find if element is wrapped in <span background-color="yellow">
if (selectionFocusNode?.parentNode?.nodeName?.toLowerCase() !== 'mark') {
selectionFocusNode = document.getSelection()?.focusNode;
while (selectionFocusNode?.parentNode?.nodeName?.toLowerCase() && selectionFocusNode?.parentNode?.nodeName?.toLowerCase() !== 'span' && selectionFocusNode?.parentElement?.style?.backgroundColor !== 'yellow') {
selectionFocusNode = selectionFocusNode.parentNode;
}
}
let nodeName = selectionFocusNode?.parentNode?.nodeName?.toLowerCase();
let backgroundColor = selectionFocusNode?.parentElement?.style?.backgroundColor;
if (nodeName === 'mark') {
let oldParent = selectionFocusNode.parentNode;
let newParent = selectionFocusNode.parentNode.parentNode;
let oldParentNextSibling = oldParent.nextSibling;
// Remove mark element, reparent
while (oldParent.childNodes.length > 0) {
// If no next sibling, then old parent was the final child node, so we can append
if (!oldParentNextSibling) {
newParent.appendChild(oldParent.firstChild);
} else {
newParent.insertBefore(oldParent.firstChild, oldParentNextSibling);
}
}
// Empty span required to force an input so that HTML change is seen from text cell component
// This span doesn't have any effect on the markdown generated.
document.execCommand('formatBlock', false, 'span');
} else if (selectionFocusNode?.parentNode?.nodeName?.toLowerCase() === 'span' && backgroundColor === 'yellow') {
selectionFocusNode.parentElement.style.backgroundColor = '';
// Empty span required to force an input so that HTML change is seen from text cell component
// This span doesn't have any effect on the markdown generated.
document.execCommand('formatBlock', false, 'span');
} else {
document.execCommand('hiliteColor', false, 'Yellow');
}
break;
case MarkdownButtonType.IMAGE:
// TODO