diff --git a/src/js/control-view.js b/src/js/control-view.js
index 7f92c68..2594041 100644
--- a/src/js/control-view.js
+++ b/src/js/control-view.js
@@ -353,7 +353,7 @@ module.exports = {
       utils.clickFileInput("gcode-file-input");
     },
 
-    upload: async function (e) {
+    upload_file: async function (e) {
       const files = e.target.files || e.dataTransfer.files;
       if (!files.length) {
         return;
@@ -396,6 +396,12 @@ module.exports = {
       });
     },
 
+    upload_folder: function (e) {
+      console.log(e);
+      const folderInput = document.getElementById('folderInput');
+      console.log(folderInput);
+    },
+
     delete_current: function () {
       if (this.config.macrosList.find(item => item.file_name == this.state.selected) == undefined) {
         if (this.state.selected) {
diff --git a/src/pug/templates/control-view.pug b/src/pug/templates/control-view.pug
index c5b23cd..1780006 100644
--- a/src/pug/templates/control-view.pug
+++ b/src/pug/templates/control-view.pug
@@ -273,8 +273,16 @@ script#control-view-template(type="text/x-template")
             .fa.fa-folder-open
 
           form.gcode-file-input.file-upload
-            input(type="file", @change="upload", :disabled="!is_ready",
+            input(type="file", @change="upload_file", :disabled="!is_ready",
               accept=".nc,.ngc,.gcode,.gc")
+          
+          button.pure-button(title="Upload a new GCode folder.", @click="open",
+            :disabled="!is_ready",style="height:100px;width:100px;font-weight:normal")
+            .fa.fa-folder-plus
+
+          form.gcode-folder-input.file-upload
+            input#folderInput(type="file", @change="upload_folder", :disabled="!is_ready",
+              webkitdirectory, directory, multiple)
 
           a(:disabled="!state.selected", download,
               :href="'/api/file/' + state.selected",