This is an automated email from the ASF dual-hosted git repository. gerben pushed a commit to branch demo-empty-quote in repository https://gitbox.apache.org/repos/asf/incubator-annotator.git
commit 8800720efcc99548341ee76d33d0db6988371e66 Author: Gerben <[email protected]> AuthorDate: Thu Jun 25 22:10:56 2020 +0200 Support empty ranges in highlighter & demo --- packages/dom/src/highlight-range.ts | 3 --- web/demo/index.js | 18 ++++-------------- web/style.css | 2 +- 3 files changed, 5 insertions(+), 18 deletions(-) diff --git a/packages/dom/src/highlight-range.ts b/packages/dom/src/highlight-range.ts index e18a6a4..091c24f 100644 --- a/packages/dom/src/highlight-range.ts +++ b/packages/dom/src/highlight-range.ts @@ -55,9 +55,6 @@ export function highlightRange( // Return an array of the text nodes in the range. Split the start and end nodes if required. function textNodesInRange(range: Range): Text[] { - // If the range is empty, avoid creating and returning an empty text node. - if (range.collapsed) return []; - // If the start or end node is a text node and only partly in the range, split it. if ( isTextNode(range.startContainer) && diff --git a/web/demo/index.js b/web/demo/index.js index 88b9a06..a1688b0 100644 --- a/web/demo/index.js +++ b/web/demo/index.js @@ -120,22 +120,12 @@ async function anchor(selector) { info.innerText = JSON.stringify(selector, null, 2); } -async function describeSelection() { +async function onSelectionChange() { + cleanup(); const selection = document.getSelection(); - if (selection.type !== 'Range') return; - const range = selection.getRangeAt(0); - if (range.collapsed) return; - - return describeTextQuote(range, source); -} - -async function onSelectionChange() { - const selector = await describeSelection(); - if (selector) { - cleanup(); - anchor(selector); - } + const selector = await describeTextQuote(range, source); + anchor(selector); } function onSelectorExampleClick(event) { diff --git a/web/style.css b/web/style.css index 29fef4d..4ef867d 100644 --- a/web/style.css +++ b/web/style.css @@ -56,7 +56,7 @@ li { mark { background-color: rgba(255, 255, 0, 0.5); - outline: 0.1px solid rgba(255, 100, 0, 0.8); + outline: 1px solid rgba(255, 100, 0, 0.8); } .columns {
