highlights disappearing at some scale levels #811 @2

diff --git a/js/libs/fluidbook/fluidbook.search.js b/js/libs/fluidbook/fluidbook.search.js
index 45c8c4a6bc3eae68216bba863b8350010d3ea8ce..ef7fc2689143e3861faf4b62d7d65d4c88fbf8b0 100644 (file)
--- a/js/libs/fluidbook/fluidbook.search.js
+++ b/js/libs/fluidbook/fluidbook.search.js
@@ -8,10 +8,15 @@ function FluidbookSearch(fluidbook) {
 
 FluidbookSearch.prototype = {
     init: function () {
-        var $this=this;
+        var $this = this;
         $(this.fluidbook).on('fluidbook.page.change.end', function (e, pageNr) {
             $this.highlightSearchTerms(pageNr);
         });
+        $(document).on('change', '#q', function () {
+            $this.setHighlightTerms([]);
+            $this.clearHighlights();
+            return true;
+        });
     },
     getHints: function (q, callback) {
         var $this = this;
@@ -184,10 +189,26 @@ FluidbookSearch.prototype = {
     },
 
     highlightOccurence: function (position, word, term, color, offset) {
+        if (word != term) {
+            // When we just highlight a part of the word. For example, searched term is brand and word found is brands
+            var width = 0;
+            for (var i = 0; i < term.length; i++) {
+                width += position.lw[i];
+            }
+        } else {
+            width = position.width;
+        }
+
         var padding = position.height * 0.2;
         var z = this.fluidbook.datas.pageZoomFactor * 1.19;
         var h = $('<div class="highlight" data-color="' + color + '"></div>');
-        $(h).css({top: (position.y - position.height - padding * 2) * z, left: (position.x - padding) * z + offset, width: (position.width + 2 * padding) * z, height: (position.height + padding * 3) * z});
+        var coords = {top: (position.y - position.height - padding * 2) * z, left: (position.x - padding) * z + offset, width: (width + 2 * padding) * z, height: (position.height + padding * 3) * z};
+        var hash = coords.top + '|' + coords.left + '|' + coords.width + '|' + coords.height;
+        if ($('[data-hash="' + hash + '"]').length > 0) {
+            return;
+        }
+        $(h).attr('data-hash', hash);
+        $(h).css(coords);
         $("#searchHighlights").append(h);
     }
 };

diff --git a/style/fluidbook.less b/style/fluidbook.less
index c93c39b75154f2c2e9e81fe1f875e2cd0bb433ae..203d4ec09a8e119f0d929c31f1d9e3dcc8546619 100644 (file)
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -303,6 +303,7 @@ body, html {
        position: absolute;
        top: 0px;
        left: 0px;
+       z-index:3;
        .highlight {
                position: absolute;
                border-width: 2px;