Merge pull request #4897 from MetaMask/qr-code-scan

QR Code Scanner

6 files changed, 95 insertions, 2 deletions

diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index 1b0183c92..62ec4ce37 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -2,6 +2,9 @@
   "accept": {
     "message": "Accept"
   },
+  "accessingYourCamera": {
+    "message": "Accesing your camera..."
+  },
   "account": {
     "message": "Account"
   },
@@ -656,6 +659,12 @@
   "notStarted": {
     "message": "Not Started"
   },
+  "noWebcamFoundTitle": {
+    "message": "Webcam not found"
+  },
+  "noWebcamFound": {
+    "message": "Your computer's webcam was not found. Please try again."
+  },
   "oldUI": {
     "message": "Old UI"
   },
@@ -940,6 +949,12 @@
   "info": {
   "message": "Info"
   },
+  "scanInstructions": {
+    "message": "Place the QR code in front of your camera"
+  },
+  "scanQrCode": {
+    "message": "Scan QR Code"
+  },
   "shapeshiftBuy": {
     "message": "Buy with Shapeshift"
   },
@@ -1059,6 +1074,9 @@
     "message": "We had trouble loading your token balances. You can view them ",
     "description": "Followed by a link (here) to view token balances"
   },
+  "tryAgain": {
+    "message": "Try again"
+  },
   "twelveWords": {
     "message": "These 12 words are the only way to restore your MetaMask accounts.\nSave them somewhere safe and secret."
   },
@@ -1089,6 +1107,15 @@
   "unknownNetworkId": {
     "message": "Unknown network ID"
   },
+  "unknownQrCode": {
+    "message": "Error: We couldn't identify that QR code"
+  },
+  "unknownCameraErrorTitle": {
+    "message": "Ooops! Something went wrong...."
+  },
+  "unknownCameraError": {
+    "message": "There was an error while trying to access you camera. Please try again..."
+  },
   "unlock": {
     "message": "Unlock"
   },
@@ -1135,6 +1162,9 @@
   "whatsThis": {
     "message": "What's this?"
   },
+  "youNeedToAllowCameraAccess": {
+    "message": "You need to allow camera access to use this feature."
+  },
   "yourSigRequested": {
     "message": "Your signature is being requested"
   },
diff --git a/app/images/webcam.svg b/app/images/webcam.svg
new file mode 100644
index 000000000..4b9b58148
--- /dev/null
+++ b/app/images/webcam.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="53px" height="53px" viewBox="0 0 53 53" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 50.2 (55047) - http://www.bohemiancoding.com/sketch -->
+    <title>webcam</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="QR-Code-Scan" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-4-Copy" transform="translate(-482.000000, -218.000000)">
+            <g id="webcam" transform="translate(482.000000, 218.000000)">
+                <circle id="Oval" fill="#D5ECFA" cx="26.5" cy="26.5" r="26.5"></circle>
+                <g id="Group" transform="translate(14.000000, 19.000000)" fill="#259DE5">
+                    <rect id="Rectangle" x="0" y="0" width="18" height="16"></rect>
+                    <polygon id="Triangle" points="19 6.57142857 26 3 26 13 19 9.42857143"></polygon>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/app/scripts/contentscript.js b/app/scripts/contentscript.js
index b7496f318..e0a2b0061 100644
--- a/app/scripts/contentscript.js
+++ b/app/scripts/contentscript.js
@@ -198,6 +198,6 @@ function blacklistedDomainCheck () {
  */
 function redirectToPhishingWarning () {
   console.log('MetaMask - routing to Phishing Warning component')
-  let extensionURL = extension.runtime.getURL('phishing.html')
+  const extensionURL = extension.runtime.getURL('phishing.html')
   window.location.href = extensionURL
 }
diff --git a/app/scripts/lib/enums.js b/app/scripts/lib/enums.js
index 0a3afca47..c6d57a1bc 100644
--- a/app/scripts/lib/enums.js
+++ b/app/scripts/lib/enums.js
@@ -2,8 +2,19 @@ const ENVIRONMENT_TYPE_POPUP = 'popup'
 const ENVIRONMENT_TYPE_NOTIFICATION = 'notification'
 const ENVIRONMENT_TYPE_FULLSCREEN = 'fullscreen'
 
+const PLATFORM_BRAVE = 'Brave'
+const PLATFORM_CHROME = 'Chrome'
+const PLATFORM_EDGE = 'Edge'
+const PLATFORM_FIREFOX = 'Firefox'
+const PLATFORM_OPERA = 'Opera'
+
 module.exports = {
   ENVIRONMENT_TYPE_POPUP,
   ENVIRONMENT_TYPE_NOTIFICATION,
   ENVIRONMENT_TYPE_FULLSCREEN,
+  PLATFORM_BRAVE,
+  PLATFORM_CHROME,
+  PLATFORM_EDGE,
+  PLATFORM_FIREFOX,
+  PLATFORM_OPERA,
 }
diff --git a/app/scripts/lib/util.js b/app/scripts/lib/util.js
index 51e9036cc..d7423f2ad 100644
--- a/app/scripts/lib/util.js
+++ b/app/scripts/lib/util.js
@@ -5,6 +5,11 @@ const {
   ENVIRONMENT_TYPE_POPUP,
   ENVIRONMENT_TYPE_NOTIFICATION,
   ENVIRONMENT_TYPE_FULLSCREEN,
+  PLATFORM_FIREFOX,
+  PLATFORM_OPERA,
+  PLATFORM_CHROME,
+  PLATFORM_EDGE,
+  PLATFORM_BRAVE,
 } = require('./enums')
 
 /**
@@ -38,6 +43,29 @@ const getEnvironmentType = (url = window.location.href) => {
 }
 
 /**
+ * Returns the platform (browser) where the extension is running.
+ *
+ * @returns {string} the platform ENUM
+ *
+ */
+const getPlatform = _ => {
+  const ua = navigator.userAgent
+  if (ua.search('Firefox') !== -1) {
+    return PLATFORM_FIREFOX
+  } else {
+    if (window && window.chrome && window.chrome.ipcRenderer) {
+      return PLATFORM_BRAVE
+    } else if (ua.search('Edge') !== -1) {
+      return PLATFORM_EDGE
+    } else if (ua.search('OPR') !== -1) {
+      return PLATFORM_OPERA
+    } else {
+      return PLATFORM_CHROME
+    }
+  }
+}
+
+/**
  * Checks whether a given balance of ETH, represented as a hex string, is sufficient to pay a value plus a gas fee
  *
  * @param {object} txParams Contains data about a transaction
@@ -100,6 +128,7 @@ function BnMultiplyByFraction (targetBN, numerator, denominator) {
 }
 
 module.exports = {
+  getPlatform,
   getStack,
   getEnvironmentType,
   sufficientBalance,
diff --git a/app/scripts/platforms/extension.js b/app/scripts/platforms/extension.js
index 0803164e8..71b162dd0 100644
--- a/app/scripts/platforms/extension.js
+++ b/app/scripts/platforms/extension.js
@@ -24,8 +24,13 @@ class ExtensionPlatform {
     return extension.runtime.getManifest().version
   }
 
-  openExtensionInBrowser (route = null) {
+  openExtensionInBrowser (route = null, queryString = null) {
     let extensionURL = extension.runtime.getURL('home.html')
+
+    if (queryString) {
+      extensionURL += `?${queryString}`
+    }
+
     if (route) {
       extensionURL += `#${route}`
     }