From b39ae2a8b4d2bddf054a45d52f9f52c0e971aaa1 Mon Sep 17 00:00:00 2001 From: Roland Stigge Date: Thu, 11 Jan 2018 20:18:29 +0100 Subject: Add logout, rename and ui improvements --- html/index.html | 14 ++++++++- html/webbox.css | 16 ++++++++-- html/webbox.js | 95 +++++++++++++++++++++++++++++++++++++++++++++++++++++++-- 3 files changed, 120 insertions(+), 5 deletions(-) (limited to 'html') diff --git a/html/index.html b/html/index.html index 580e415..904d5e0 100644 --- a/html/index.html +++ b/html/index.html @@ -11,7 +11,7 @@
- +
 Webbox
@@ -44,8 +44,10 @@ Upload Delete Move + Rename Info Select/Unselect All + Logout Close Menu
@@ -69,6 +71,16 @@
+ +
diff --git a/html/webbox.css b/html/webbox.css index ffb16cc..67d87b4 100644 --- a/html/webbox.css +++ b/html/webbox.css @@ -157,6 +157,7 @@ table.list { border: 0; /* 1px solid #000000; */ cursor: pointer; background-color: #FFFFFF; + border-collapse: collapse; } table.list tr { @@ -167,15 +168,21 @@ table.list tr.selectedrow { background-color: #CCCCFF; } +table.list td { + border-width: 0; + border-bottom-width: 1px; + border-style: solid; + border-color: #808080; +} + table.list td.type { width: 50px; - border: 0; /* 1px solid #000000; */ } table.list td.name { width: 100%; - border: 0; /* 1px solid #000000; */ color: #0000FF; + white-space: pre; } @media only screen and (min-width: 1px) and (max-width: 630px) { @@ -196,4 +203,9 @@ table.list td.name { height: 100%; margin: 0; } + + table.list td { + padding: 5px; + } } + diff --git a/html/webbox.js b/html/webbox.js index 40a7a1a..7c1b43f 100644 --- a/html/webbox.js +++ b/html/webbox.js @@ -2,6 +2,16 @@ var currentDir = "/"; var listElements; var numberOfSelectedRows = 0; +function clearContents() { + var result = ""; + result += ""; + result += "
(empty)
" + + var listElement = document.getElementById("list"); + + listElement.innerHTML = result; +} + function loadContents(dir) { numberOfSelectedRows = 0; @@ -39,7 +49,7 @@ function loadContents(dir) { result += "" - listElement = document.getElementById("list"); + var listElement = document.getElementById("list"); listElement.innerHTML = result; @@ -301,10 +311,16 @@ function setCurrentDir(newDir) { } function download(filename) { + var files = getSelectedFiles(); + + // if activated via menu, download directly (not as zip) + if (files.length == 1 && filename === undefined) { + filename = files[0]; + } + if (filename === undefined) { // download selection as ZIP showDialog(); - var files = getSelectedFiles(); if (files.length == 0) { document.getElementById("dialog").innerHTML = "No files selected."; document.getElementById("okbutton").onclick = hideDialog; @@ -558,6 +574,70 @@ function move() { xhr.send(xmlDocument); } } +function rename() { + showDialog(); + + var files = getSelectedFiles(); + if (files.length == 0) { + document.getElementById("dialog").innerHTML = "No files selected."; + document.getElementById("okbutton").onclick = hideDialog; + return; + } + if (files.length > 1) { + document.getElementById("dialog").innerHTML = "Only one file can be renamed at once."; + document.getElementById("okbutton").onclick = hideDialog; + return; + } + + document.getElementById("renameold").innerHTML = files[0]; + + document.getElementById("dialog").innerHTML = document.getElementById("rename-dialog").innerHTML; + document.getElementById("renamenew").value = files[0]; + document.getElementById("renamenew").focus(); + document.getElementById("renamenew").onkeydown = function(evt) { + if (evt.key == "Enter") { + document.getElementById("okbutton").click(); + } + } + + document.getElementById("okbutton").onclick = function() { + + var xhr = new XMLHttpRequest(); + + xhr.onreadystatechange = function() { + if (this.readyState != 4) { + return; + } + if (this.status != 200) { + document.getElementById("dialog").innerHTML = "HTTP error"; + } else { + document.getElementById("dialog").innerHTML = xhr.responseText; + } + + document.getElementById("okbutton").onclick = hideDialog; + document.getElementById("okbutton").focus(); + loadContents(currentDir); // load new file list with deleted items + } + + var filename = getSelectedFiles()[0]; + + var parser = new DOMParser(); + var xmlDocument = parser.parseFromString("", "text/xml"); + var filesElement = xmlDocument.getElementsByTagName("request")[0]; + + var oldnameElement = xmlDocument.createElement("oldname"); + oldnameElement.appendChild(document.createTextNode(document.getElementById("renameold").childNodes[0].nodeValue)); + filesElement.appendChild(oldnameElement); + + var newnameElement = xmlDocument.createElement("newname"); + newnameElement.appendChild(document.createTextNode(document.getElementById("renamenew").value)); + filesElement.appendChild(newnameElement); + + xhr.open("POST", "/bin/query" + currentDir + "?command=rename", true); + xhr.setRequestHeader("Content-type", "text/xml"); + xhr.send(xmlDocument); + } +} // File info: date, size, type function info() { @@ -630,3 +710,14 @@ function refresh() { loadContents(currentDir); // load new file list } +function logout() { + var menu = document.getElementsByClassName("menu")[0]; + var firsttd = menu.getElementsByClassName("firsttd")[0]; + firsttd.innerHTML = "/"; + + clearContents(); + + var p = window.location.protocol + '//' + // current location must return 200 OK for this GET + window.location = window.location.href.replace(p, p + 'logout:password@') +} -- cgit v1.2.3