You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@annotator.apache.org by ge...@apache.org on 2020/03/05 23:14:14 UTC

[incubator-annotator] branch use-highlighter-in-demo created (now 7e381e8)

This is an automated email from the ASF dual-hosted git repository.

gerben pushed a change to branch use-highlighter-in-demo
in repository https://gitbox.apache.org/repos/asf/incubator-annotator.git.


      at 7e381e8  Remove <mark> border because text nodes remain split.

This branch includes the following new commits:

     new 7a62abc  Use @dom/highlightRange in demo
     new 7f7ea7c  Use removeHighlight() instead of replacing innerHTML
     new 7e381e8  Remove <mark> border because text nodes remain split.

The 3 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.



[incubator-annotator] 03/03: Remove border because text nodes remain split.

Posted by ge...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

gerben pushed a commit to branch use-highlighter-in-demo
in repository https://gitbox.apache.org/repos/asf/incubator-annotator.git

commit 7e381e88a8472d310d1168a9a2307e95e903403e
Author: Gerben <ge...@treora.com>
AuthorDate: Fri Mar 6 00:10:42 2020 +0100

    Remove <mark> border because text nodes remain split.
    
    A motivation to merge split nodes again in the removeHighlight function,
    e.g. using Node.normalize().
---
 demo/index.html | 1 -
 1 file changed, 1 deletion(-)

diff --git a/demo/index.html b/demo/index.html
index facccec..0ae10c1 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -33,7 +33,6 @@ under the License.
     }
     mark {
       background-color: rgba(255, 255, 0, 0.5);
-      outline: 0.1px solid rgba(255, 100, 0, 0.8);
     }
     #parsed {
       height: 15rem;


[incubator-annotator] 01/03: Use @dom/highlightRange in demo

Posted by ge...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

gerben pushed a commit to branch use-highlighter-in-demo
in repository https://gitbox.apache.org/repos/asf/incubator-annotator.git

commit 7a62abc8fb5f363c2241148c31833947533b51b1
Author: Gerben <ge...@treora.com>
AuthorDate: Fri Mar 6 00:06:10 2020 +0100

    Use @dom/highlightRange in demo
---
 demo/index.js | 54 ++----------------------------------------------------
 1 file changed, 2 insertions(+), 52 deletions(-)

diff --git a/demo/index.js b/demo/index.js
index 63acf12..629d489 100644
--- a/demo/index.js
+++ b/demo/index.js
@@ -28,6 +28,7 @@ import {
   createRangeSelectorCreator,
   createTextQuoteSelector,
   describeTextQuote,
+  highlightRange,
 } from '@annotator/dom';
 import { makeRefinable } from '@annotator/selector';
 
@@ -35,57 +36,6 @@ function clear() {
   corpus.innerHTML = selectable.innerHTML;
 }
 
-function highlight(range) {
-  for (const node of textNodes(range)) {
-    const mark = document.createElement('mark');
-    const markRange = document.createRange();
-    markRange.selectNode(node);
-    markRange.surroundContents(mark);
-  }
-}
-
-function textNodes(range) {
-  const nodes = [];
-
-  if (range.collapsed) return nodes;
-
-  let startNode = range.startContainer;
-  let startOffset = range.startOffset;
-
-  if (startNode.nodeType === 3) {
-    if (startOffset > 0 && startOffset < startNode.length) {
-      startNode = startNode.splitText(startOffset);
-      startOffset = 0;
-    }
-  }
-
-  let endNode = range.endContainer;
-  let endOffset = range.endOffset;
-
-  if (endNode.nodeType === 3) {
-    if (endOffset > 0 && endOffset < endNode.length) {
-      endNode = endNode.splitText(endOffset);
-      endOffset = 0;
-    }
-  }
-
-  const walker = document.createTreeWalker(document.documentElement);
-  walker.currentNode = startNode;
-
-  while (walker.currentNode !== endNode) {
-    if (walker.currentNode.nodeType === 3) {
-      nodes.push(walker.currentNode);
-    }
-    walker.nextNode();
-  }
-
-  if (endNode.nodeType === 3 && endOffset > 0) {
-    nodes.push(endNode);
-  }
-
-  return nodes;
-}
-
 const createSelector = makeRefinable(selector => {
   const selectorCreator = {
     TextQuoteSelector: createTextQuoteSelector,
@@ -114,7 +64,7 @@ const refresh = async () => {
   }
 
   for (const range of ranges) {
-    highlight(range);
+    highlightRange(range);
   }
 
   parsed.innerText = JSON.stringify(selector, null, 2);


[incubator-annotator] 02/03: Use removeHighlight() instead of replacing innerHTML

Posted by ge...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

gerben pushed a commit to branch use-highlighter-in-demo
in repository https://gitbox.apache.org/repos/asf/incubator-annotator.git

commit 7f7ea7c126dc4f9a2fbc531aa1f87dab0b97cb87
Author: Gerben <ge...@treora.com>
AuthorDate: Fri Mar 6 00:08:53 2020 +0100

    Use removeHighlight() instead of replacing innerHTML
---
 demo/index.js | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/demo/index.js b/demo/index.js
index 629d489..0506666 100644
--- a/demo/index.js
+++ b/demo/index.js
@@ -32,8 +32,13 @@ import {
 } from '@annotator/dom';
 import { makeRefinable } from '@annotator/selector';
 
-function clear() {
-  corpus.innerHTML = selectable.innerHTML;
+const cleanupFunctions = [];
+
+function cleanup() {
+  let removeHighlight;
+  while (removeHighlight = cleanupFunctions.shift()) {
+    removeHighlight();
+  }
 }
 
 const createSelector = makeRefinable(selector => {
@@ -50,7 +55,7 @@ const createSelector = makeRefinable(selector => {
 });
 
 const refresh = async () => {
-  clear();
+  cleanup();
 
   const fragment = window.location.hash.slice(1);
   if (!fragment) return;
@@ -64,7 +69,8 @@ const refresh = async () => {
   }
 
   for (const range of ranges) {
-    highlightRange(range);
+    const removeHighlight = highlightRange(range);
+    cleanupFunctions.push(removeHighlight);
   }
 
   parsed.innerText = JSON.stringify(selector, null, 2);