Merge pull request #6 from beatrycze-volk/serach-multiple-words

Highlight and preserve all searched words - v2
slub · Jun 4, 2021 · 14d5b85 · 14d5b85
2 parents e5a5e95 + 0d24325
commit 14d5b85
Show file tree

Hide file tree

Showing 4 changed files with 107 additions and 17 deletions.
diff --git a/Resources/Private/JavaScript/Kitodo/PageView/PageView.js b/Resources/Private/JavaScript/Kitodo/PageView/PageView.js
@@ -77,7 +77,13 @@ var dlfViewer = function(settings){
      * @type {string|undefined}
      * @private
      */
-    this.highlightKeys = undefined;
+    this.highlightKeys = 'tx_dlf[highlight_word]';
+
+    /**
+     * @type {string|undefined}
+     * @private
+     */
+     this.highlightWords = null;
 
     /**
      * @type {Object|undefined}
@@ -289,8 +295,10 @@ dlfViewer.prototype.createControls_ = function(controlNames, layers) {
 /**
  * Displays highlight words
  */
-dlfViewer.prototype.displayHighlightWord = function() {
-
+dlfViewer.prototype.displayHighlightWord = function(highlightWords = null) {
+    if(highlightWords != null) {
+        this.highlightWords = highlightWords;
+    }
     if (!dlfUtils.exists(this.highlightLayer)) {
 
         this.highlightLayer = new ol.layer.Vector({
@@ -345,12 +353,21 @@ dlfViewer.prototype.displayHighlightWord = function() {
         }
     };
 
-    if (hasOwnProperty && this.fulltexts[0] !== undefined && this.fulltexts[0].url !== '' && this.images.length > 0) {
-        var value = urlParams[param],
-            values = decodeURIComponent(value).split(' '),
+    if ((hasOwnProperty || this.highlightWords != null) && this.fulltexts[0] !== undefined && this.fulltexts[0].url !== '' && this.images.length > 0) {
+        var value = undefined,
             fulltextData = dlfFullTextUtils.fetchFullTextDataFromServer(this.fulltexts[0].url, this.images[0]),
             fulltextDataImageTwo = undefined;
 
+        if(this.highlightWords != null) {
+            value = this.highlightWords;
+        } else {
+            value = urlParams[param];
+        }
+
+        var values = decodeURIComponent(value).split(' ');
+        values = values.filter(item => item !== '.');
+        values = values.filter(item => item !== ',');
+
         // check if there is another image / fulltext to look for
         if (this.images.length === 2 & this.fulltexts[1] !== undefined && this.fulltexts[1].url !== '') {
             var image = $.extend({}, this.images[1]);

diff --git a/Resources/Private/JavaScript/Kitodo/PageView/SearchInDocument.js b/Resources/Private/JavaScript/Kitodo/PageView/SearchInDocument.js
@@ -50,7 +50,6 @@ function resetStart() {
  * @returns void
  */
 function addHighlightEffect(highlightIds) {
-    // TODO: highlight found phrase in full text - verify page?
     if (highlightIds.length > 0) {
         highlightIds.forEach(function (highlightId) {
             var targetElement = $('#' + highlightId);
@@ -146,10 +145,28 @@ function getNeededQueryParams(element) {
     queryParams[highlightWord] = encodeURIComponent($("input[id='tx-dlf-search-in-document-query']").val());
     queryParams.push(page);
     queryParams[page] = element['page'];
+    queryParams.push('hl');
+    queryParams['hl'] = encodeURIComponent(getHighlightWords(element['words']));
 
     return queryParams;
 }
 
+function getHighlightWords(words) {
+    var highlightWords = $("input[id='tx-dlf-search-in-document-query']").val();
+
+    for(var i = 0; i < words.length; i++) {
+        if (highlightWords === "") {
+            highlightWords += words[i];
+        } else {
+            if(highlightWords.indexOf(words[i]) === -1) {
+                highlightWords += ' ' + words[i];
+            }
+        }
+    }
+
+    return highlightWords;
+}
+
 /**
  * Get snippet link.
  * 
@@ -213,6 +230,7 @@ function search() {
             var resultList = '<div class="results-active-indicator"></div><ul>';
             var start = -1;
             if (data['numFound'] > 0) {
+                var page = getCurrentPage();
                 data['documents'].forEach(function (element, i) {
                     if (start < 0) {
                         start = i;
@@ -227,7 +245,9 @@ function search() {
                             + '</span>';
                     }
 
-                    addHighlightEffect(element['highlight']);
+                    if(element['page'] == page) {
+                        addHighlightEffect(element['highlight']);
+                    }
                 });
                 // Sort result by page.
                 resultItems.sort(function (a, b) {
@@ -242,13 +262,60 @@ function search() {
             resultList += '</ul>';
             resultList += getNavigationButtons(start, data['numFound']);
             $('#tx-dlf-search-in-document-results').html(resultList);
+
+            addImageHighlightAfterFirstLoad(data);
         },
         "json"
-    )
-        .done(function (data) {
-            $('#tx-dfgviewer-sru-results-loading').hide();
-            $('#tx-dfgviewer-sru-results-clearing').show();
+    ).done(function (data) {
+        $('#tx-dfgviewer-sru-results-loading').hide();
+        $('#tx-dfgviewer-sru-results-clearing').show();
+    });
+}
+
+function getCurrentPage() {
+    var page = 1;
+    var queryParams = getCurrentQueryParams(getBaseUrl(" "));
+
+    for(var i = 0; i < queryParams.length; i++) {
+        var queryParam = queryParams[i].split('=');
+
+        if(queryParam[0] === $("input[id='tx-dlf-search-in-document-page']").attr('name')) {
+            page = queryParam[1];
+        }
+    }
+
+    return page;
+}
+
+function addImageHighlightAfterFirstLoad(data) {
+    var queryParams = getCurrentQueryParams(getBaseUrl(" "));
+    var hlParameterFound = false;
+
+    for(var i = 0; i < queryParams.length; i++) {
+        var queryParam = queryParams[i].split('=');
+
+        if(queryParam[0] ==='hl') {
+            hlParameterFound = true;
+            break;
+        }
+    }
+
+    if(!hlParameterFound && data['numFound'] > 0) {
+        var page = getCurrentPage();
+
+        data['documents'].forEach(function (element, i) {
+            if(element['page'] == page) {
+                if (element['words'].length > 0) {
+                    if(tx_dlf_viewer.map != null) {
+                        tx_dlf_viewer.displayHighlightWord(encodeURIComponent(getHighlightWords(element['words'])));
+                    } else {
+                        setTimeout(addImageHighlightAfterFirstLoad, 500, data);
+                    }
+                }
+                addHighlightEffect(element['highlight'])
+            }
         });
+    }
 }
 
 function clearSearch() {
@@ -267,6 +334,10 @@ function triggerSearchAfterHitLoad() {
             $("input[id='tx-dlf-search-in-document-query']").val(decodeURIComponent(queryParam[1]));
             search();
             break;
+        } else if(queryParam[0].indexOf('query') != -1) {
+            $("input[id='tx-dlf-search-in-document-query']").val(decodeURIComponent(queryParam[1]).replace('+', ' '));
+            search();
+            break;
         }
     }
 }

diff --git a/Resources/Private/JavaScript/Kitodo/PageView/Utility.js b/Resources/Private/JavaScript/Kitodo/PageView/Utility.js
@@ -898,13 +898,15 @@ function trimByChars(string, characters) {
  */
 dlfUtils.searchFeatureCollectionForText = function (featureCollection, text) {
     var features = [];
+    //TODO: check what is inside ft
     featureCollection.forEach(function (ft) {
         if (ft.get('fulltext') !== undefined) {
             var trimmedFt = trimByChars(
                 ft.get('fulltext'),
                 [',', '.', ';', ':', '-', '\'', '"', '!', '?', '(', ')', '[', ']']
                 );
-            if (trimmedFt.toLowerCase() === text.toLowerCase()) {
+                //it highlights word if it is connected with other one by '-'
+            if ((trimmedFt.toLowerCase() === text.toLowerCase()) || (ft.get('fulltext').toLowerCase().indexOf(text.concat('-')) != -1)) {
                 features.push(ft);
             }
         }

diff --git a/Resources/Public/JavaScript/ddbKitodoZeitungsportal.js b/Resources/Public/JavaScript/ddbKitodoZeitungsportal.js