20c8f124e5
The reload API data button (top-right) refreshes the API for new data The refreshed API data are added to memory as well as stored in IDB. The kBucket is reloaded
146 lines
2.8 KiB
HTML
146 lines
2.8 KiB
HTML
<html>
|
|
<head>
|
|
<title>Login</title>
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
|
|
|
|
<style>
|
|
@charset "utf-8";
|
|
/* CSS Document */
|
|
|
|
h1{
|
|
margin: 0 auto;
|
|
padding-left: 15%;
|
|
text-transform:uppercase;
|
|
font-size:30px;
|
|
color:white;
|
|
}
|
|
|
|
|
|
h2{
|
|
margin: 0 auto;
|
|
padding-left: 15%;
|
|
font-size:18px;
|
|
color:#fff;
|
|
}
|
|
|
|
|
|
body {
|
|
font-family: Helvetica;
|
|
margin:0 auto;
|
|
min-height:100%;
|
|
background: lightblue;
|
|
-webkit-background-size: cover;
|
|
-moz-background-size: cover;
|
|
-o-background-size: cover;
|
|
background-size: cover;
|
|
}
|
|
|
|
.nav {
|
|
margin: 0 auto;
|
|
margin-top: 100px;
|
|
margin-left: 35%;
|
|
width: 300px;
|
|
height: auto;
|
|
background: #fff;
|
|
border-radius: 5px;
|
|
text-align: center;
|
|
padding-top: 10px;
|
|
padding-bottom: 10px;
|
|
box-shadow: 0 0 10px rgba(0,0,0, .5);
|
|
|
|
}
|
|
|
|
.input {
|
|
border: 1px solid #a6a6a6;
|
|
width: 230px;
|
|
height: 40px;
|
|
border-radius: 3px;
|
|
margin-top: 5px;
|
|
padding-left: 9px;
|
|
color: #6c6c6c;
|
|
background: #fcfcfc;
|
|
outline: none;
|
|
}
|
|
|
|
.input:hover:enabled{
|
|
box-shadow: 0 0 10px #337AB7;
|
|
border: 1px #337AB7 solid ;
|
|
}
|
|
|
|
.input:focus, .button:focus, .button:hover:focus{
|
|
box-shadow: 0 0 10px #337AB7;
|
|
border: 1px #337AB7 solid ;
|
|
}
|
|
|
|
.button {
|
|
color:#fff;
|
|
font-size:20px;
|
|
border: 1px solid #a6a6a6;
|
|
width: 243px;
|
|
height: 43px;
|
|
border-radius: 5px;
|
|
margin-top: 5px;
|
|
margin-right: 6px;
|
|
outline: none;
|
|
}
|
|
.button:disabled,.input:disabled{
|
|
cursor:not-allowed;
|
|
}
|
|
label {
|
|
position: relative;
|
|
top: 5px;
|
|
margin-right: 115px;
|
|
}
|
|
label span {
|
|
margin-left: 5px;
|
|
font-size:14px;
|
|
}
|
|
</style>
|
|
<style>
|
|
#alert-container{
|
|
width: 100%;
|
|
text-align: center;
|
|
position: fixed;
|
|
top:0;
|
|
z-index: 2;
|
|
}
|
|
.alert {
|
|
padding: 10px;
|
|
color: white;
|
|
max-width: 700px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.closebtn {
|
|
margin-left: 15px;
|
|
color: white;
|
|
font-weight: bold;
|
|
float: right;
|
|
cursor: pointer;
|
|
transition: 0.3s;
|
|
}
|
|
|
|
.closebtn:hover {
|
|
color: black;
|
|
}
|
|
</style>
|
|
<script type="text/javascript" src="init.js"></script>
|
|
<script type="text/javascript" src="app.js"></script>
|
|
<script type="text/javascript" src="login.js"></script>
|
|
</head>
|
|
|
|
<body onload="initAPIdata();">
|
|
<div id="alert-container"></div>
|
|
<div class="nav">
|
|
<form id='serverConnect'>
|
|
<input type="password" id="serverPass" class="input" placeholder="ServerPass" />
|
|
<input type="button" value="Connect" class="button btn-primary" onclick="connect()"/></br>
|
|
</form>
|
|
<form id='userSignIn'>
|
|
<input type="text" id="username" class="input" placeholder="Username" disabled/>
|
|
<input type="password" id="privKey" class="input" placeholder="PrivKey" disabled/>
|
|
<input type="button" value="Sign In" class="button btn-primary" onclick="signIn()" disabled/>
|
|
</form>
|
|
</div>
|
|
</body>
|
|
</html> |