diff --git a/web/assets/js/main.js b/web/assets/js/main.js
index 55be32c..7cdd6bb 100644
--- a/web/assets/js/main.js
+++ b/web/assets/js/main.js
@@ -70,7 +70,7 @@ thead_name.addEventListener('click', e => {
         const a_name = a.children[0].textContent.toLowerCase();
         const b_name = b.children[0].textContent.toLowerCase();
         return a_name < b_name ? -1 : a_name > b_name ? 1 : 0;
-    }, thead_name, [thead_date, thead_size]);
+    }, null, null, thead_name, [thead_date, thead_size]);
 });
 
 thead_date.classList.toggle("clickable");
@@ -80,31 +80,42 @@ thead_date.addEventListener('click', e => {
         const a_date = new Date(a.children[1].textContent.slice(0, -4));
         const b_date = new Date(b.children[1].textContent.slice(0, -4));
         return a_date - b_date;
-    }, thead_date, [thead_name, thead_size]);
+    }, null, null, thead_date, [thead_name, thead_size]);
 });
 
 const units = {"B": 0, "KiB": 1, "MiB": 2, "GiB": 3, "TiB": 4};
 
 function sizeToBytes(size, unit) {
     if (units[unit] == 0) return size;
-    for (let i = 0; i < units[unit]; ++i) size *= 1024;
+    for (let i = 0; i <= units[unit]; ++i) size *= 1024;
     return size;
 }
 
 thead_size.classList.toggle("clickable");
 thead_size.addEventListener('click', e => {
     e.preventDefault();
-    sortTable((a,b) => {
+    sortTable(
+    (a,b) => {
         if (a.textContent == "DIR")
             return 1;
         let [a_size, a_unit] = a.children[2].textContent.split(" ");
         let [b_size, b_unit] = b.children[2].textContent.split(" ");
         return sizeToBytes(+a_size, a_unit) - sizeToBytes(+b_size, b_unit);
-    }, thead_size, [thead_name, thead_date]);
+    },
+    e => e.children[2].textContent == "DIR",
+    e => e.children[2].textContent != "DIR",
+    thead_size, [thead_name, thead_date]);
 });
 
-function sortTable(compareFn, target, other) {
-    const records = Array.from(document.getElementsByTagName('tbody')[0].children)
+function sortTable(compareFn, filterFn, filterNegFn, target, other) {
+    let records = Array.from(document.getElementsByTagName('tbody')[0].children);
+
+    let dirs = [];
+    if (filterFn != null) {
+        dirs = records.filter(filterFn);
+        records = records.filter(filterNegFn);
+    }
+
     records.sort(compareFn);
 
     tbody.textContent = "";
@@ -114,14 +125,17 @@ function sortTable(compareFn, target, other) {
         v.classList.remove("sort-down");
     });
 
+    if (filterFn != null)
+            tbody.append(...dirs);
+
     if (g_sort_reverse) {
         tbody.append(...records.reverse());
-        target.classList.add("sort-down");
-        target.classList.remove("sort-up");
-    } else {
-        tbody.append(...records);
         target.classList.add("sort-up");
         target.classList.remove("sort-down");
+    } else {
+        tbody.append(...records);
+        target.classList.add("sort-down");
+        target.classList.remove("sort-up");
     }
     
     g_sort_reverse = !g_sort_reverse;