From c5b6c3d618b700024c220e0d39043ec1b3409834 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sven=20K=C3=A4stle?= <sven.kaestle@gmx.de>
Date: Fri, 7 Sep 2018 12:44:46 +0200
Subject: [PATCH] feat: Scroll to highlighted text on card hover
---
.../src/main/webapp/assets/js/annotationScript.js | 7 ++++++-
.../src/main/webapp/pages/annotation-document.jsp | 2 ++
2 files changed, 8 insertions(+), 1 deletion(-)
diff --git a/gemeinsamforschen/src/main/webapp/assets/js/annotationScript.js b/gemeinsamforschen/src/main/webapp/assets/js/annotationScript.js
index f1f7ccee..f2b891a1 100644
--- a/gemeinsamforschen/src/main/webapp/assets/js/annotationScript.js
+++ b/gemeinsamforschen/src/main/webapp/assets/js/annotationScript.js
@@ -341,6 +341,11 @@ function displayAnnotation(annotation) {
.data('annotation', annotation)
.mouseenter(function () {
addHighlightedText(annotation.body.startCharacter, annotation.body.endCharacter, annotation.userToken);
+
+ // scroll document text to anchor element
+ let documentText = $('#documentText');
+ let anchor = $('#anchor');
+ documentText.scrollTo(anchor);
})
.mouseleave(function () {
deleteHighlightedText();
@@ -362,7 +367,7 @@ function displayAnnotation(annotation) {
*/
function addHighlightedText(startCharacter, endCharacter, userToken) {
// create <span> tag with the annotated text
- var replacement = $('<span></span>').css('background-color', getUserColor(userToken)).html(documentText.slice(startCharacter, endCharacter));
+ var replacement = $('<span></span>').attr('id', 'anchor').css('background-color', getUserColor(userToken)).html(documentText.slice(startCharacter, endCharacter));
// wrap an <p> tag around the replacement, get its parent (the <p>) and ask for the html
var replacementHtml = replacement.wrap('<p/>').parent().html();
diff --git a/gemeinsamforschen/src/main/webapp/pages/annotation-document.jsp b/gemeinsamforschen/src/main/webapp/pages/annotation-document.jsp
index 4780336a..30aeafc1 100644
--- a/gemeinsamforschen/src/main/webapp/pages/annotation-document.jsp
+++ b/gemeinsamforschen/src/main/webapp/pages/annotation-document.jsp
@@ -20,6 +20,8 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" type="text/javascript"></script>
<!-- js - contextMenu script -->
<script src="https://swisnl.github.io/jQuery-contextMenu/dist/jquery.contextMenu.js" type="text/javascript"></script>
+ <!-- js - scrollTo -->
+ <script src="//cdn.jsdelivr.net/npm/jquery.scrollto@2.1.2/jquery.scrollTo.min.js"></script>
<!-- js - annotation websocket script -->
<script src="../assets/js/annotationWebsocket.js"></script>
<!-- js - annotation REST script -->
--
GitLab