extensive readme

README.md

@@ -1,12 +1,36 @@
 # Ignotus
 
+    this extension doesnt work in messenger.com and other sites where the input field is  heavily scripted but a hack has been used to make it work on facebook.com. other than that it should work in sites with simple html input fields.  
+
+It uses [AES encryption method](https://en.wikipedia.org/wiki/Advanced_Encryption_Standard) ( implementation of [Crypto-js](https://cryptojs.gitbook.io/docs/#ciphers) ) to encrypt your messages using a secret/password that you provide. If you click on the extension icon you'll have a text input box to enter your secret - You have to enter the password there and the extension will use it for further encryptions. You can also uncheck the extension active checkbox to disable the extension.
+
+![Popup](/images/extension_popup.PNG "Popup")
+
+<br>
+
+## Installation
+
 Follow this guide to install the extension
 
 https://dev.to/ben/how-to-install-chrome-extensions-manually-from-github-1612
 
+<br>
 
-It uses [AES encryption method](https://en.wikipedia.org/wiki/Advanced_Encryption_Standard) ( implementation of [Crypto-js](https://cryptojs.gitbook.io/docs/#ciphers) ) to encrypt your messages using a secret/password that you provide. If you click on the extension icon you'll have a text input box to enter your secret - You have to enter the password there and the extension will use it for further encryptions. If your press ctrl+alt+q After you write something on the text input field of chatbox the text will automatically get replaced by the encrypted text. 
+## Encryption
 
+If your press ctrl+alt+q after you write something on the text input field of chatbox the text will automatically get replaced by the encrypted text. 
 
+Before Encryption             |  After pressing ctrl+alt+q
+:-------------------------:|:-------------------------:
+![Before Encryption](/images/before_encrypt.PNG "Before Encryption")  |  ![After Encryption](/images/after_encrypt.PNG "After Encryption")
+<br>
+
+
+
+## Decryption
 
 After you send the encrypted text, facebook will send the encrypted texts to the receipent. Then the receipent will have to press ctrl+q to decrypt all the encrypted texts on screen. 
+
+Before Decryption             |  After pressing ctrl+q
+:-------------------------:|:-------------------------:
+![Before Decryption](/images/before_decrypt.PNG "Before Encryption")  |  ![After Decryption](/images/after_decrypt.PNG "After Encryption")

background.js

@@ -1,6 +1,6 @@
 chrome.runtime.onInstalled.addListener(function () {
-    chrome.storage.sync.set({ hide: true }, function () {
-        console.log("Hide image is on");
+    chrome.storage.sync.set({ active: true }, function () {
+        console.log("Ignotus is on");
     });
 });
 

content.js

@@ -72,6 +72,7 @@ function getDeepestChild(element) {
 }
 
 function keyDownListener(e) {
+    console.log("asdasdasd")
     if (!checkIfMatchKey(e.key)) return;
     keypressState[e.key] = true;
     // document.querySelector("#debug").textContent = JSON.stringify(keypressState);
@@ -135,6 +136,7 @@ var removeListeners = function () {
 chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
     if (request.command === "set_secret") {
         secret = request.secret;
+        console.log(secret);
     } else if (request.command === 'init') {
         addListeners();
     } else {

index.html

@@ -35,7 +35,7 @@
         <input type="checkbox" id="changeActive" checked/>
       </div>
       <div class="section">
-        <label>Secret Passphrase: </label>
+        <label>Secret Password: </label>
         <input type="text" id="secret" />  
       </div>  
     </div>
@@ -45,6 +45,6 @@
       <br> After you write a message press ctrl+alt+q to encode the message on place 
     </div>
 
-    <script src=popup_script.js"></script>
+    <script src="popup_script.js"></script>
   </body>
 </html>

popup_script.js

@@ -1,7 +1,12 @@
 
 
 
-let secretKeyElem = document.getElementById("secret");
+let secretKeyElem = document.querySelector("#secret");
+
+chrome.storage.sync.get('secret', function (data) {
+  if(data.secret)
+    secretKeyElem.value = data.secret;
+});
 
 secretKeyElem.onchange = function (element) {
   const secret = this.value;