refactoring, so that a function called update_(name of the pannel) will automaticaly executed if the pannel is clicked

make the pannel as overflow auto
style loginpage for admin
This commit is contained in:
BlubbFish 2019-04-03 20:55:27 +02:00
parent 81ea11e2fe
commit 645070a3c2
5 changed files with 52 additions and 15 deletions

View File

@ -1,15 +1,41 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <html lang="de-de" xmlns="http://www.w3.org/1999/xhtml">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title></title> <title>Lora-Map Admin</title>
<style type="text/css">
body {
font-family: Verdana;
font-size: 13px;
}
.label {
width: 100px;
display: inline-block;
font-weight: bold;
}
.login {
margin-left: 105px;
}
div {
margin-bottom: 5px;
}
</style>
</head> </head>
<body> <body>
<h1>Login to Lora-Map Admin!</h1>
<form method="post" action="/admin/login"> <form method="post" action="/admin/login">
U:<input name='user'><br> <div class="user">
P:<input type='password' name='pass'><br> <span class="label">Username: </span>
<input type='submit'> <input name="user"/>
</div>
<div class="pass">
<span class="label">Password: </span>
<input name="pass" type="password"/>
</div>
<div class="login">
<input type="submit" />
</div>
</form> </form>
</body> </body>
</html> </html>

View File

@ -71,6 +71,7 @@ object {
display: none; display: none;
font-size: 11px; font-size: 11px;
font-family: Verdana; font-family: Verdana;
overflow: auto;
} }
#pannels #pannels_pos { #pannels #pannels_pos {
display: none; display: none;

View File

@ -19,7 +19,9 @@
<div id="pannels_info"> <div id="pannels_info">
<!-- Shows infos about selected device here, this will be cleand by js --> <!-- Shows infos about selected device here, this will be cleand by js -->
</div> </div>
<div id="pannels_admin"></div> <div id="pannels_admin">
Teste Login...
</div>
<div id="pannels_version"> <div id="pannels_version">
<div class="versionstring"> <div class="versionstring">
Version: Version:

View File

@ -42,7 +42,7 @@ function parseAjaxLoc() {
} }
} }
updateStatus(); updateStatus();
updateDeviceStatus(); update_pannels_info();
} }
} }

View File

@ -4,6 +4,9 @@ function showHidePanel(name) {
document.getElementById("pannels").style.display = "block"; document.getElementById("pannels").style.display = "block";
document.getElementById(name).style.display = "block"; document.getElementById(name).style.display = "block";
visiblePanel = name; visiblePanel = name;
if (typeof window["update_" + name] === "function") {
window["update_" + name]();
}
} else if (visiblePanel === name && name !== "pannels_info" || name === null) { } else if (visiblePanel === name && name !== "pannels_info" || name === null) {
document.getElementById("pannels").style.display = "none"; document.getElementById("pannels").style.display = "none";
if (visiblePanel !== null) { if (visiblePanel !== null) {
@ -14,29 +17,29 @@ function showHidePanel(name) {
document.getElementById(visiblePanel).style.display = "none"; document.getElementById(visiblePanel).style.display = "none";
document.getElementById(name).style.display = "block"; document.getElementById(name).style.display = "block";
visiblePanel = name; visiblePanel = name;
if (typeof window["update_" + name] === "function") {
window["update_" + name]();
}
} }
} }
var statusToDevice = null; var statusToDevice = null;
function showMarkerInfo(e) { function showMarkerInfo(e) {
showHidePanel("pannels_info");
statusToDevice = this; statusToDevice = this;
updateDeviceStatus(); showHidePanel("pannels_info");
} }
function showMarkerInfoPerId(id) { function showMarkerInfoPerId(id) {
showHidePanel("pannels_info");
statusToDevice = id; statusToDevice = id;
updateDeviceStatus(); showHidePanel("pannels_info");
} }
function showMarkerInfoMenu() { function showMarkerInfoMenu() {
showHidePanel("pannels_info");
statusToDevice = this.getAttribute("rel"); statusToDevice = this.getAttribute("rel");
updateDeviceStatus(); showHidePanel("pannels_info");
} }
function updateDeviceStatus() { function update_pannels_info() {
document.getElementById("pannels_info").innerHTML = ""; document.getElementById("pannels_info").innerHTML = "";
if (serverLocation.hasOwnProperty(statusToDevice)) { if (serverLocation.hasOwnProperty(statusToDevice)) {
var positionItem = serverLocation[statusToDevice]; var positionItem = serverLocation[statusToDevice];
@ -110,4 +113,9 @@ function createOverviewElement(positionItem, id) {
divItem.innerHTML += "<div class=\"line2\" style=\"color: red;\" id=\"overview-gps-id-" + id + "\">kein GPS-Empfang</div>"; divItem.innerHTML += "<div class=\"line2\" style=\"color: red;\" id=\"overview-gps-id-" + id + "\">kein GPS-Empfang</div>";
divItem.innerHTML += "<div class=\"line3\" id=\"overview-update-id-" + id + "\">Letzter Datenempfang: vor " + timeCalculation(positionItem["Recievedtime"], "difftext") + "</div>"; divItem.innerHTML += "<div class=\"line3\" id=\"overview-update-id-" + id + "\">Letzter Datenempfang: vor " + timeCalculation(positionItem["Recievedtime"], "difftext") + "</div>";
return divItem; return divItem;
}
function update_pannels_admin() {
alert("update admin");
} }