Adjusts endOfContent location to be in the middle of selection

mozilla · Nov 4, 2015 · 9d0634b · 9d0634b
1 parent 7d6fb27
commit 9d0634b
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 2 deletions.
diff --git a/web/text_layer_builder.css b/web/text_layer_builder.css
@@ -66,7 +66,7 @@
   display: block;
   position: absolute;
   left: 0;
-  top: 0;
+  top: 100%;
   right: 0px;
   bottom: 0px;
   z-index: -1;
@@ -75,3 +75,7 @@
   -ms-user-select: none;
   -moz-user-select: none;
 }
+
+.textLayer .endOfContent.active {
+  top: 0px;
+}
diff --git a/web/text_layer_builder.js b/web/text_layer_builder.js
@@ -51,6 +51,7 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
     this.viewport = options.viewport;
     this.textDivs = [];
     this.findController = options.findController || null;
+    this._bindMouse();
   }
 
   TextLayerBuilder.prototype = {
@@ -396,7 +397,48 @@ var TextLayerBuilder = (function TextLayerBuilderClosure() {
       this.matches = this.convertMatches(this.findController === null ?
         [] : (this.findController.pageMatches[this.pageIdx] || []));
       this.renderMatches(this.matches);
-    }
+    },
+
+    /**
+     * Fixes text selection: adds additional div where mouse was clicked.
+     * This reduces flickering of the content if mouse slowly dragged down/up.
+     * @private
+     */
+    _bindMouse: function TextLayerBuilder_bindMouse() {
+      var div = this.textLayerDiv;
+      div.addEventListener('mousedown', function (e) {
+        var end = div.querySelector('.endOfContent');
+        if (!end) {
+          return;
+        }
+//#if !(MOZCENTRAL || FIREFOX)
+        // The non-Firefox browsers will feel better if height of the non-select
+        // div will be adjusted -- avoiding flickering when selections moves up.
+        // This does not work when selection started on empty space.
+        var adjustTop = e.target !== div;
+//#if GENERIC
+        adjustTop = adjustTop && window.getComputedStyle(end).
+          getPropertyValue('-moz-user-select') !== 'none';
+//#endif
+        if (adjustTop) {
+          var divBounds = div.getBoundingClientRect();
+          var r = Math.max(0, (e.pageY - divBounds.top) / divBounds.height);
+          end.style.top = (r * 100).toFixed(2) + '%';
+        }
+//#endif
+        end.classList.add('active');
+      });
+      div.addEventListener('mouseup', function (e) {
+        var end = div.querySelector('.endOfContent');
+        if (!end) {
+          return;
+        }
+//#if !(MOZCENTRAL || FIREFOX)
+        end.style.top = '';
+//#endif
+        end.classList.remove('active');
+      });
+    },
   };
   return TextLayerBuilder;
 })();