updates; new file/folder working

assets/public/css/styles.css

@@ -631,6 +631,30 @@ header div:nth-child(2) {
  box-shadow: 0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .12);
 }
 
+#newdir {
+ position: fixed;
+ bottom: 1.3em;
+ right: 5em;
+ transition: .2s ease all;
+ opacity: 0;
+ border: 0;
+ box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
+ padding: .5em;
+ width: 10em;
+ border-radius: .2em;
+}
+
+#newdir.enabled {
+ opacity: 1;
+}
+
+*,
+*:hover,
+*:active,
+*:focus {
+ outline: 0
+}
+
 
 /* LISTING */
 

assets/public/js/application.js

@@ -261,7 +261,7 @@ var handleFiles = function(files) {
     request.onreadystatechange = function() {
         if (request.readyState == 4) {
             if (request.status == 200) {
-                location.reload();
+                history.go(0);
             }
 
             button.changeToDone((request.status != 200), html);
@@ -406,6 +406,39 @@ document.addEventListener('listing', event => {
     // Enables rename button
     document.getElementById("rename").addEventListener("click", renameEvent);
 
+    document.getElementById('new').addEventListener('click', event => {
+        let newdir = document.getElementById('newdir');
+        newdir.classList.toggle('enabled');
+        newdir.focus();
+    });
+
+    document.getElementById('newdir').addEventListener('keydown', event => {
+        if (event.keyCode == 27) {
+            document.getElementById('newdir').classList.toggle('enabled');
+            setTimeout(() => {
+                document.getElementById('newdir').value = '';
+            }, 200);
+        }
+
+        if (event.keyCode == 13) {
+            event.preventDefault();
+
+            let button = document.getElementById('new');
+            let html = button.changeToLoading();
+            let request = new XMLHttpRequest();
+            request.open("POST", window.location);
+            request.setRequestHeader('Filename', document.getElementById('newdir').value);
+            request.send();
+            request.onreadystatechange = function() {
+                if (request.readyState == 4) {
+                    button.changeToDone((request.status != 200), html);
+                    history.go(0);
+                }
+            }
+
+        }
+    });
+
     // Drag and Drop
     document.addEventListener("dragover", function(event) {
         event.preventDefault();

assets/templates/base.tmpl

@@ -81,14 +81,6 @@
    {{ template "content" .Data }}
   </main>
 
-  {{ if .IsDir }}
-   <div class="floating">
-    <div class="action" id="newfolder">
-     <i class="material-icons">add</i>
-    </div>
-   </div>
-  {{ end }}
-
   <footer>
    Served with
    <a rel="noopener noreferrer" href="https://caddyserver.com">Caddy</a>

assets/templates/listing.tmpl

@@ -31,4 +31,12 @@
   </div>
 
   <input style="display:none" type="file" id="upload-input" onchange="handleFiles(this.files)" value="Upload" multiple>
+
+<input id="newdir" type="text" placeholder="Name...">
+
+  <div class="floating">
+   <div class="action" id="new">
+    <i class="material-icons">add</i>
+   </div>
+  </div>
  {{ end }}

filemanager.go

@@ -9,6 +9,7 @@ package filemanager
 
 import (
 	"io"
+	"io/ioutil"
 	"log"
 	"mime/multipart"
 	"net/http"
@@ -163,9 +164,24 @@ func upload(w http.ResponseWriter, r *http.Request, c *config.Config) (int, erro
 
 // newDirectory makes a new directory
 func newDirectory(w http.ResponseWriter, r *http.Request, c *config.Config) (int, error) {
-	path := strings.Replace(r.URL.Path, c.BaseURL, c.PathScope, 1)
+	filename := r.Header.Get("Filename")
+
+	if filename == "" {
+		return http.StatusBadRequest, nil
+	}
+
+	path := strings.Replace(r.URL.Path, c.BaseURL, c.PathScope, 1) + filename
 	path = filepath.Clean(path)
-	err := os.MkdirAll(path, 0755)
+	extension := filepath.Ext(path)
+
+	var err error
+
+	if extension == "" {
+		err = os.MkdirAll(path, 0755)
+	} else {
+		err = ioutil.WriteFile(path, []byte(""), 0755)
+	}
+
 	if err != nil {
 		switch {
 		case os.IsPermission(err):