qr scanner ui (#247)

Author: Sneezry

css/content.css

@@ -4,7 +4,7 @@
     left: 0;
     width: 100%;
     height: 100%;
-    background: rgba(0, 0, 0, 0.6);
+    background: rgba(255, 255, 255, 0.6);
     z-index: 1000000;
     display: none;
     cursor: crosshair;
@@ -20,6 +20,6 @@
 
 #__ga_captureBox__ {
     position: absolute;
-    border: white 1px dashed;
+    border: black 1px dashed;
     display: none;
 }

src/content.ts

@@ -207,7 +207,8 @@ function pasteCode(code: string) {
     }
   }
 
-  const activeInputBox = document.activeElement.tagName === 'INPUT' ?
+  const activeInputBox =
+      document.activeElement && document.activeElement.tagName === 'INPUT' ?
       document.activeElement :
       null;
   if (activeInputBox) {
@@ -221,3 +222,18 @@ function pasteCode(code: string) {
   firstInputBox.value = code;
   return;
 }
+
+window.onkeydown = (event) => {
+  if (event.keyCode === 27) {
+    event.preventDefault();
+    const grayLayout = document.getElementById('__ga_grayLayout__');
+    const captureBox = document.getElementById('__ga_captureBox__');
+
+    if (grayLayout) {
+      grayLayout.style.display = 'none';
+    }
+    if (captureBox) {
+      captureBox.style.display = 'none';
+    }
+  }
+};