diff options
| -rw-r--r-- | html/index.html | 13 | ||||
| -rw-r--r-- | html/webbox.js | 72 |
2 files changed, 72 insertions, 13 deletions
diff --git a/html/index.html b/html/index.html index 3b75f44..6885bd4 100644 --- a/html/index.html +++ b/html/index.html @@ -80,6 +80,19 @@ <input type="text" id="renamenew" class="textinput"></input> <br/> </div> + + <div id="login-dialog" hidden> + <span id="logintitle">Webbox</span><br/> + <br/> + Username:<br/> + <input type="text" id="loginusername" class="textinput"></input> + Password:<br/> + <input type="password" id="loginpassword" class="textinput"></input> + </div> + + <div id="logout-dialog" hidden> + Are you sure you want to log out? + </div> <a id="download-a" hidden></a> diff --git a/html/webbox.js b/html/webbox.js index b408078..fa24e29 100644 --- a/html/webbox.js +++ b/html/webbox.js @@ -6,7 +6,7 @@ var password = "password"; function clearContents() { var result = "<table class=\"list\">"; - result += "<tr><td class=\"type\"></td><td class=\"name\">(empty)</td></tr>"; + // empty list result += "</table>" var listElement = document.getElementById("list"); @@ -247,10 +247,42 @@ function prepareReadOnly(readOnly) { } } -function login() { - username = "kneipen"; - password = "band"; - initMainpage(); +function login(title) { + showDialog(); + + document.getElementById("okbutton").onclick = function() { + // restore dialog buttons + document.getElementById("cancelbutton").style.display = "block"; + document.getElementById("okbutton").childNodes[0].nodeValue = "OK"; + hideDialog(); + + username = document.getElementById("loginusername").value; + password = document.getElementById("loginpassword").value; + + initMainpage(); + } + + // rearrange dialog buttons + document.getElementById("cancelbutton").style.display = "none"; + document.getElementById("okbutton").childNodes[0].nodeValue = "Login"; + + document.getElementById("dialog").innerHTML = document.getElementById("login-dialog").innerHTML; + + document.getElementById("logintitle").childNodes[0].nodeValue = title; + + document.getElementById("loginusername").focus(); + + document.getElementById("loginusername").onkeydown = function(evt) { + if (evt.key == "Enter") { + document.getElementById("okbutton").click(); + } + } + + document.getElementById("loginpassword").onkeydown = function(evt) { + if (evt.key == "Enter") { + document.getElementById("okbutton").click(); + } + } } function initMainpage() { @@ -262,7 +294,12 @@ function initMainpage() { return; } if (this.status == 401) { // login error: goto login page - login(); + var authheader = this.getResponseHeader("WWW-Authenticate"); + var title = "Webbox"; + if (authheader.startsWith("Basic realm=\"") && authheader.endsWith("\"")) { + title = authheader.substr(13, authheader.length - 14); + } + login(title); return; } else if (this.status != 200) { @@ -759,13 +796,22 @@ function refresh() { } function logout() { - var menu = document.getElementsByClassName("menu")[0]; - var firsttd = menu.getElementsByClassName("firsttd")[0]; - firsttd.innerHTML = "/"; + showDialog(); + + document.getElementById("okbutton").onclick = function() { + hideDialog(); - clearContents(); + var menu = document.getElementsByClassName("menu")[0]; + var firsttd = menu.getElementsByClassName("firsttd")[0]; + firsttd.innerHTML = "/"; - username = "notaname"; - password = "password"; - initMainpage(); + clearContents(); + + username = "notaname"; + password = "password"; + initMainpage(); + } + + document.getElementById("dialog").innerHTML = document.getElementById("logout-dialog").innerHTML; } + |