diff options
| -rw-r--r-- | css/style.css | 2 | ||||
| -rw-r--r-- | loggedin.js | 48 | ||||
| -rw-r--r-- | loggedin.php | 10 |
3 files changed, 45 insertions, 15 deletions
diff --git a/css/style.css b/css/style.css index 24fa86f..39a545c 100644 --- a/css/style.css +++ b/css/style.css @@ -295,7 +295,7 @@ input[type=submit]:hover { .filesystem > h2 button { border: none; - padding: 0.3rem 0.7rem; + padding: 0.3rem 1.1rem; background: inherit; border-radius: 0; } diff --git a/loggedin.js b/loggedin.js index d4f56ae..1affb09 100644 --- a/loggedin.js +++ b/loggedin.js @@ -4,13 +4,12 @@ const upload_form = document.getElementById("upload_form"); const the_file = document.getElementById("the_file"); const filename_input = document.getElementById("filename"); const upload_btn = document.getElementById("upload_btn"); +const the_path = document.getElementById("the_path"); const current_directory = document.getElementById("current_directory"); the_file.onchange = on_file_added; - -const pwd = "/"; - +var pwd = []; const pending_uploads = []; class FileView { @@ -48,8 +47,7 @@ function on_file_added(_e) { }).then((resp) => { if (resp.status == 200) { done_upload(fileview); - } - else { + } else { alert("Upload failed"); } }, () => { @@ -67,12 +65,40 @@ function done_upload(fileview) { var index = pending_uploads.indexOf(fileview); if (index >= 0) pending_uploads.splice(index, 1); - load_dir(pwd); + + load_dir(); } -function load_dir(pwd) { +function load_dir() { var data = new FormData(); - data.append('path', '/'); + + var path = "/"; + for (const d of pwd) + path += d + "/"; + + while (the_path.children.length > 1) + the_path.removeChild(the_path.lastChild); + + for (let i = 0; i < pwd.length; i++) { + var d = pwd[i]; + + var separator_div = document.createElement('div'); + separator_div.classList.add('separator'); + the_path.appendChild(separator_div); + separator_div.innerText = "»"; + + var entry = document.createElement('button'); + entry.classList.add('pathentry'); + entry.innerText = d; + the_path.appendChild(entry); + + entry.onclick = () => { + pwd.length = i + 1; + load_dir(); + } + } + + data.append('path', path); var xhr = new XMLHttpRequest(); xhr.open('POST', '/php/readdir.php', true); @@ -97,6 +123,10 @@ function add_file_visuals(name, is_directory, mimetype) { if (is_directory) { img.src="/mimeicons/directory.png"; + fileDiv.onclick = () => { + pwd.push(name); + load_dir(); + } } else { img.src=`/mimeicons/${mimetype.replace("/", "-")}.png`; @@ -123,4 +153,4 @@ function begin_upload() { the_file.click(); } -load_dir("/"); +load_dir(); diff --git a/loggedin.php b/loggedin.php index 0c95750..34b8997 100644 --- a/loggedin.php +++ b/loggedin.php @@ -3,11 +3,11 @@ <h2 style="display: flex; gap: 0rem;"> <button id="upload_btn" onclick="begin_upload()">Upload</button> <div class="separator"></div> - <div class="path"> - <!-- <a class="pathentry" href="#"> <?php echo $_SESSION['username'] ?>'s files/</a><a class="pathentry" href="#">foo/</a><a class="pathentry" href="#">bar</a> --> - <button class="pathentry">Haha's files</button> - <div class="separator">»</div> - <button class="pathentry">Haha's files</button> + <button id="upload_btn" onclick="begin_upload()">New Folder</button> + <div class="separator"></div> + <div class="path" id="the_path"> + <!-- <a class="pathentry" href="#"> /</a><a class="pathentry" href="#">foo/</a><a class="pathentry" href="#">bar</a> --> + <button class="pathentry" onclick="pwd.length = 0; load_dir();"><?php echo $_SESSION['username'] ?>'s files</button> </div> </h2> |