From 4dd16df2bd69274562fdf97583e3c3f67e757b46 Mon Sep 17 00:00:00 2001
From: Jersey Fonseca <jfonseca@root16.com>
Date: Thu, 14 Apr 2022 15:58:32 -0500
Subject: [PATCH] Added upload file feature

---
 src/ui/css/style.css    | 15 +++++++++++++++
 src/ui/devtoolstab.html | 12 ++++++++++--
 src/ui/devtoolstab.js   |  4 ++++
 src/ui/fileRule.js      | 25 +++++++++++++++++++++----
 src/ui/tabGroup.js      |  1 +
 5 files changed, 51 insertions(+), 6 deletions(-)

diff --git a/src/ui/css/style.css b/src/ui/css/style.css
index 3b3f9794..39f212da 100644
--- a/src/ui/css/style.css
+++ b/src/ui/css/style.css
@@ -86,6 +86,15 @@ div, span {
     float: left;
 }
 
+.uploadBtnContainer {
+    float: left;
+}
+
+.fileNameContainer {
+    float: left;
+    margin-right: 10px;
+}
+
 #domainDefs {
     margin-top: 30px;
 }
@@ -418,6 +427,12 @@ div, span {
     text-align: center;
 }
 
+.uploadedFileName {
+    flex: 0 0 55px;
+    text-align: center;
+    padding-top: 10px;
+}
+
 .ruleContainer .fileType {
     flex: 0 0 75px;
     padding-top: 8px;
diff --git a/src/ui/devtoolstab.html b/src/ui/devtoolstab.html
index 66b75b11..2f622f5f 100644
--- a/src/ui/devtoolstab.html
+++ b/src/ui/devtoolstab.html
@@ -82,8 +82,16 @@
         <div class="arrow">
             To:
         </div>
-        <div class="edit">
-            <button class="btn edit-btn">Edit File</button>
+        <div class="upload">
+            <div class="fileNameContainer">
+                <div class="uploadedFileName">
+                    No File Selected
+                </div>
+            </div>
+            <div class="uploadBtnContainer">
+                <input style="display:none" class="file-btn" type="file" id="file" name="filename">
+                <button class="btn upload-btn">Upload File</button>            
+            </div>
         </div>
         <div class="switch"></div>
         <div class="delete">
diff --git a/src/ui/devtoolstab.js b/src/ui/devtoolstab.js
index 004d666f..17622471 100644
--- a/src/ui/devtoolstab.js
+++ b/src/ui/devtoolstab.js
@@ -11,10 +11,14 @@
     app.requestHeadersSuggest = app.suggest();
     app.responseHeadersSuggest = app.suggest();
     app.files = {};
+    app.fileNames = {};
+
     app.skipNextSync = false;
 
     function renderData() {
         app.files = {};
+        app.fileNames = {};
+
         ui.domainDefs.children().remove();
         chrome.runtime.sendMessage({action: "getDomains"}, function(domains) {
             if (domains.length) {
diff --git a/src/ui/fileRule.js b/src/ui/fileRule.js
index 535106e6..b479e629 100644
--- a/src/ui/fileRule.js
+++ b/src/ui/fileRule.js
@@ -1,4 +1,4 @@
-(function() {
+(function () {
     "use strict";
 
     /* globals $ */
@@ -13,9 +13,11 @@
 
         const override = util.instanceTemplate(ui.fileOverrideTemplate);
         const matchInput = override.find(".matchInput");
-        const editBtn = override.find(".edit-btn");
         const ruleOnOff = override.find(".onoffswitch");
         const deleteBtn = override.find(".sym-btn");
+        const uploadBtn = override.find(".upload-btn");
+        const fileBtn = override.find(".file-btn");
+        const fileName = override.find(".uploadedFileName");
 
         matchInput.val(savedData.match || "");
         util.makeFieldRequired(matchInput);
@@ -25,8 +27,22 @@
             override.addClass("disabled");
         }
 
-        editBtn.on("click", function() {
-            app.editor.open(override[0].id, matchInput.val(), false, saveFunc);
+        uploadBtn.on("click", function () {
+            document.getElementById('file').click();
+        });
+        
+
+        fileBtn.on("change", function () {
+            const selectedFile = document.getElementById('file').files[0];
+
+            var reader = new FileReader();
+            reader.onload = function (event) {
+                app.files[override[0].id] = event.target.result;
+                app.fileNames[override[0].id] = selectedFile.name;
+                saveFunc();
+                fileName.text(selectedFile.name);
+            };
+            reader.readAsText(selectedFile);
         });
 
         deleteBtn.on("click", function() {
@@ -61,6 +77,7 @@
 
         if (savedData.file) {
             app.files[id] = savedData.file;
+            fileName.text(savedData.fileName);
         }
 
         return override;
diff --git a/src/ui/tabGroup.js b/src/ui/tabGroup.js
index 84c43fb5..15822683 100644
--- a/src/ui/tabGroup.js
+++ b/src/ui/tabGroup.js
@@ -67,6 +67,7 @@
                     type: "fileOverride",
                     match: $el.find(".matchInput").val(),
                     file: app.files[el.id] || "",
+                    fileName: app.fileNames[el.id] || "No File Selected",
                     fileId: el.id,
                     on: $el.find(".onoffswitch")[0].isOn
                 });