Added table for file list view

1 files changed, 15 insertions, 1 deletions

diff --git a/src/main/resources/js/files.js b/src/main/resources/js/files.js
index 24140b0..3cdf4fd 100644
--- a/src/main/resources/js/files.js
+++ b/src/main/resources/js/files.js
@@ -22,10 +22,24 @@ drop.addEventListener('drop', e => {
         let request = new XMLHttpRequest();
         let formData = new FormData();
 
-        drop.insertAdjacentHTML('beforeend', `<a class="filename" href="${files[i].name}">${files[i].name}</a><br><hr>`);
+        // TODO: Consider using current date due to updated lastModified state at upload
+        const date = new Date(files[i].lastModified);
+        const lastModified = `${date.getMonth() + 1}/${date.getDate()}/${date.getFullYear()} ${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`;
+
+        const row = document.getElementById("table").insertRow(-1);
+        row.insertCell(0).innerHTML = `<a class="filename" href="${files[i].name}">${files[i].name}</a>`;
+        row.insertCell(1).innerHTML = `<a class="filename" href="${files[i].name}">${bytesToSize(files[i].size)}</a>`;
+        row.insertCell(2).innerHTML = `<a class="filename" href="${files[i].name}">${lastModified}</a>`;
 
         formData.append("file", files[i]);
         request.open("POST", "/upload/" + path);
         request.send(formData);
     }
+
+    function bytesToSize(bytes) {
+        const sizes = ['B', 'KiB', 'MiB', 'GiB', 'TiB'];
+        if (bytes === 0) return '0 Byte';
+        const i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
+        return Math.round(bytes / Math.pow(1024, i), 2) + ' ' + sizes[i];
+    }
 });