Browse Source

add mobile detect and search conditional

RoyLiu 4 years ago
parent
commit
d77b511328
4 changed files with 24 additions and 4 deletions
  1. 9 2
      containers/HighlightTools.tsx
  2. 8 1
      containers/Search.tsx
  3. 2 1
      package.json
  4. 5 0
      yarn.lock

+ 9 - 2
containers/HighlightTools.tsx

@@ -1,4 +1,5 @@
 import React, { useEffect, useState, useCallback } from 'react';
+import MobileDetect from 'mobile-detect';
 
 import Icon from '../components/Icon';
 import Button from '../components/Button';
@@ -125,6 +126,8 @@ const HighlightTools: React.FC<Props> = ({
   }, [annotations, data, scale, currentId]);
 
   useEffect(() => {
+    const md = new MobileDetect(window.navigator.userAgent);
+
     if (isActive) {
       document.addEventListener('mousedown', handleDown);
       document.addEventListener('touchstart', handleDown);
@@ -133,7 +136,9 @@ const HighlightTools: React.FC<Props> = ({
       document.addEventListener('mouseup', handleUp);
       document.addEventListener('touchend', handleUp);
       document.addEventListener('selectstart', handleSelectStart);
-      document.addEventListener('selectionchange', handleSelectChange);
+      if (md.mobile() || md.tablet()) {
+        document.addEventListener('selectionchange', handleSelectChange);
+      }
     } else if (textLayer) {
       textLayer.style.zIndex = 0;
     }
@@ -146,7 +151,9 @@ const HighlightTools: React.FC<Props> = ({
       document.removeEventListener('mouseup', handleUp);
       document.removeEventListener('touchend', handleUp);
       document.removeEventListener('selectstart', handleSelectStart);
-      document.removeEventListener('selectionchange', handleSelectChange);
+      if (md.mobile() || md.tablet()) {
+        document.removeEventListener('selectionchange', handleSelectChange);
+      }
     };
   }, [isActive, handleUp, handleSelectChange]);
 

+ 8 - 1
containers/Search.tsx

@@ -43,7 +43,14 @@ const Search: React.FC = () => {
     const strBuf = [];
 
     for (let j = 0, len = textContent.length; j < len; j += 1) {
-      if (textContent[j].str) {
+      // add whitespace in front if start character is Uppercase
+      if (
+        textContent[j].str.match(/^[A-Z]/) &&
+        j > 0 &&
+        textContent[j - 1].str !== ' '
+      ) {
+        strBuf.push(` ${textContent[j].str}`);
+      } else {
         strBuf.push(textContent[j].str);
       }
     }

+ 2 - 1
package.json

@@ -18,6 +18,7 @@
     "i18next": "^19.4.0",
     "i18next-browser-languagedetector": "^4.0.2",
     "lodash": "^4.17.15",
+    "mobile-detect": "^1.4.4",
     "next": "9.5.0",
     "next-i18next": "4.3.0",
     "pdfjs-dist": "2.3.200",
@@ -72,4 +73,4 @@
   "engines": {
     "node": ">=10.0.0"
   }
-}
+}

+ 5 - 0
yarn.lock

@@ -6425,6 +6425,11 @@ mkdirp@0.x, mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@~0.5.1:
   dependencies:
     minimist "^1.2.5"
 
+mobile-detect@^1.4.4:
+  version "1.4.4"
+  resolved "https://registry.yarnpkg.com/mobile-detect/-/mobile-detect-1.4.4.tgz#686c74e92d3cc06b09a9b3594b7b981494b137f6"
+  integrity sha512-vTgEjKjS89C5yHL5qWPpT6BzKuOVqABp+A3Szpbx34pIy3sngxlGaFpgHhfj6fKze1w0QKeOSDbU7SKu7wDvRQ==
+
 move-concurrently@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"