ELAB
/
ELAB-RFID-locks
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added Pi home page and help page

Browse Source
master
Jared 7 years ago
parent 0ae4092789
commit 4d80abf4de
4 changed files with 308 additions and 187 deletions
Show Stats Download Patch File Download Diff File

6
server.py
Unescape View File

@ -26,7 +26,11 @@ def requires_auth(f):
@app.route('/') @app.route('/')
def index(): def index():
return '{"onFire": false}\nGo to <a href="status">status</a>.' return render_template('home.html')
@app.route('/help')
def help():
return render_template('help.html')
@app.route('/status') @app.route('/status')
@requires_auth @requires_auth

433
static/style.css
Unescape View File

@ -1,186 +1,247 @@
html { html {
background: #D7E2E2; background: #D7E2E2;
font-family: 'Roboto'; font-family: 'Roboto';
color: #000F0F; color: #000F0F;
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
display: none; display: none;
} }
.recent { .recent {
display: inline-block; display: inline-block;
left: 0; left: 0;
position: absolute; position: absolute;
top: 0; top: 0;
width: 30%; width: 30%;
text-align: center; text-align: center;
} }
.event { .event {
font-size: 12pt; font-size: 12pt;
padding: 0 6pt 0 6pt; padding: 0 6pt 0 6pt;
margin-left: 8pt; margin-left: 8pt;
transition: 0.4s; transition: 0.4s;
width: 100%; width: 100%;
} }
.event:hover { .event:hover {
background: #226666; background: #226666;
width: 105%; width: 105%;
} }
.history-header { .history-header {
display: inline-block; display: inline-block;
background-color: #013A3A; background-color: #013A3A;
color: #D7E2E2; color: #D7E2E2;
margin: 0 0 8pt 0; margin: 0 0 8pt 0;
padding: 10pt 0 10pt 0; padding: 10pt 0 10pt 0;
text-align: center; text-align: center;
font-size: 16pt; font-size: 16pt;
width: 100%; width: 100%;
} }
.time { .time {
padding: 6pt 0 6pt 0; padding: 6pt 0 6pt 0;
display: inline-block; display: inline-block;
width: 49%; width: 49%;
text-align: left; text-align: left;
} }
.name { .name {
padding: 6pt 0 6pt 0; padding: 6pt 0 6pt 0;
display: inline-block; display: inline-block;
width: 49%; width: 49%;
text-align: right; text-align: right;
} }
.unknown_card { .unknown_card {
color: #E26B08; color: #E26B08;
} }
.everything-else { .everything-else {
display: inline-block; display: inline-block;
width: 69%; width: 69%;
left: 30%; left: 30%;
top: 0; top: 0;
position: absolute; position: absolute;
text-align: center; text-align: center;
} }
h1 { h1 {
text-align: center; text-align: center;
font-weight: 300; font-weight: 300;
} }
.big-button { .big-button {
display: inline-block; display: inline-block;
background-color: #013A3A; background-color: #013A3A;
color: #D7E2E2; color: #D7E2E2;
text-align: center; text-align: center;
font-size: 12pt; font-size: 12pt;
padding: 10pt; padding: 10pt;
margin: 6pt 0 10pt 0; margin: 6pt 0 10pt 0;
width: 120pt; width: 120pt;
border-radius: 2pt; border-radius: 2pt;
transition: 0.2s; transition: 0.2s;
} }
.big-button:hover { .big-button:hover {
background-color: #226666; background-color: #226666;
} }
.button { .button {
width: 50%; width: 50%;
background-color: #013A3A; background-color: #013A3A;
color: #5E9292; color: #5E9292;
padding: 6pt; padding: 6pt;
text-align: center; text-align: center;
font-size: 16pt; font-size: 16pt;
margin: 16pt 0 16pt 0; margin: 16pt 0 16pt 0;
transition: 0.2s; transition: 0.2s;
} }
.separator { .separator {
height: 10%; height: 10%;
} }
.vertical-separator { .vertical-separator {
height: 100%; height: 100%;
width: 1px; width: 1px;
background-color: #5E9292; background-color: #5E9292;
position: absolute; position: absolute;
top: 0; top: 0;
left: 33%; left: 33%;
z-index: 100; z-index: 100;
} }
.shadow { .shadow {
background-color: black; background-color: black;
display: none; display: none;
height: 100%; height: 100%;
left: 0; left: 0;
opacity: 0.0; opacity: 0.0;
position: absolute; position: absolute;
top: 0; top: 0;
width: 100%; width: 100%;
z-index: 200; z-index: 200;
} }
.overlay { .overlay {
background-color: #226666; background-color: #226666;
color: #D7E2E2; color: #D7E2E2;
display: none; display: none;
height: 60%; height: 60%;
left: 35%; left: 35%;
padding: 8pt; padding: 8pt;
position: absolute; /*Should probably be 'fixed' instead*/ position: absolute; /*Should probably be 'fixed' instead*/
top: -70%; top: -70%;
width: 30%; width: 30%;
z-index: 201; z-index: 201;
border-radius: 2pt; border-radius: 2pt;
text-align: center; text-align: center;
} }
.checkbox-wrapper { .checkbox-wrapper {
text-align: left; text-align: left;
} }
.card-id { .card-id {
font-weight: 300; font-weight: 300;
text-align: center; text-align: center;
padding: 8pt; padding: 8pt;
font-size: 24pt; font-size: 24pt;
} }
input[type=text] { input[type=text] {
font-size: 16pt; font-size: 16pt;
padding: 5pt 8pt 5pt 8pt; padding: 5pt 8pt 5pt 8pt;
margin-top: 8pt; margin-top: 8pt;
margin-bottom: 8pt; margin-bottom: 8pt;
width: 90%; width: 90%;
} }
input[type=text].search-bar { input[type=text].search-bar {
width: 75%; width: 75%;
} }
.button { .button {
background-color: #013A3A; background-color: #013A3A;
color: #5E9292; color: #5E9292;
border: none; border: none;
text-align: center; text-align: center;
font-size: 10pt; font-size: 10pt;
width: 45%; width: 45%;
margin: 8pt; margin: 8pt;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
} }
#save { #save {
right: 0; right: 0;
} }
#cancel { #cancel {
left: 0; left: 0;
} }
ul.navbar {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #5E9292;
}
ul.navbar li {
float: left;
}
ul.navbar li a {
display: block;
color: #000F0F;
text-align: center;
padding: 14px 16px;
width: 60pt;
text-decoration: none;
font-size: 12pt;
}
ul.navbar li a:hover {
background-color: #226666;
}
ul.navbar li a.active {
background-color: #226666;
color: #D7E2E2;
}
h2 {
font-size: 26pt;
text-align: left;
padding: 26pt 0 10pt 80pt;
color: #013A3A;
}
p {
font-size: 16pt;
width: 60%;
padding-left: 40pt;
color: #013A3A;
}
ul.mail-list {
padding-left: 50pt;
}
ul.mail-list li {
padding: 0 0 5pt 0;
font-size: 16pt;
color: #013A3A;
}
a.mail-link {
text-decoration: none;
font-weight: bold;
color: #013A3A;
}

30
templates/help.html
Unescape View File

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ELAB RFID Locks</title>
<link rel="stylesheet" type="text/css" href="static/style.css">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400" rel="stylesheet">
<script
src="http://code.jquery.com/jquery-3.1.1.js"
integrity="sha256-16cdPddA6VdVInumRGo6IbivbERE8p7CQR3HzTBuELA="
crossorigin="anonymous"></script>
<script src="https://use.fontawesome.com/5c9d51f09a.js"></script>
</head>
<body>
<ul class="navbar">
<li><a href="/">Home</a></li>
<li><a class="active" href="/help">Help</a></li>
<li style="float:right"><a class="right" href="/status">Login</a></li>
</ul>
<h2>Page under construction!</h2>
<p>For now, you can gain <u>UNLIMITED RFID POWERS</u> by emailing one of these people:</p>
<ul class="mail-list">
<li>David Rozenbeek, <a class="mail-link" href="mailto:davidroz@kth.se">davidroz@kth.se</a></li>
<li>Davide Bongiovanni, <a class="mail-link" href="mailto:davdebo@kth.se">davidebo@kth.se</a></li>
<li>Sven Hedin, <a class="mail-link" href="mailto:svenhed@kth.se">svenhed@kth.se</a></li>
<li>Marek Baczynski, <a class="mail-link" href="mailto:marekba@kth.se">marekba@kth.se</a></li>
</ul>
<p>In that order.</p>
</body>
</html>

26
templates/home.html
Unescape View File

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ELAB RFID Locks</title>
<link rel="stylesheet" type="text/css" href="static/style.css">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400" rel="stylesheet">
<script
src="http://code.jquery.com/jquery-3.1.1.js"
integrity="sha256-16cdPddA6VdVInumRGo6IbivbERE8p7CQR3HzTBuELA="
crossorigin="anonymous"></script>
<script src="https://use.fontawesome.com/5c9d51f09a.js"></script>
</head>
<body>
<ul class="navbar">
<li><a class="active" href="/">Home</a></li>
<li><a href="/help">Help</a></li>
<li style="float:right"><a class="right" href="/status">Login</a></li>
</ul>
<h2>Welcome!</h2>
<p>If you are reading this, it is probably because you obeyed some instructions printed on a fridge.</p>
<p>Good boy.</p>
<p>You are one step closer to gaining access to an unlimited supply of delicious frozen dinners and a wide range of refreshing beverages, such as sodas, or... yeah just soda.</p>
<p>To proceed, press the Help button, located on top of this page.</p>
</body>
</html>
Write Preview
Loading…
Cancel
Save