FaSTTUBe
/
ftracker
38
1
Fork 0
Code Issues 2 Pull Requests Releases 1 Wiki Activity

Basic web frontend

This commit is contained in:
Oskar Winkels 2020-12-01 13:08:40 +01:00 committed by Oskar
parent 9622bfaf1d
commit a93df189d6
5 changed files with 105 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/API.md
View File

@ -28,7 +28,7 @@ POST /departure
}
[Response]
OK
200 OK
```

8
ftracker/__main__.py
View File

@ -3,6 +3,14 @@ from .core import *
# Start the flask server if run from terminal
if __name__ == "__main__":
@app.route('/')
def get_root():
return app.send_static_file('index.html')
@app.route('/<path:path>')
def get_file(path):
return app.send_static_file(path)
# Just allow everything to avoid the hassle when running locally.
@app.after_request
def add_headers(response):

7
ftracker/core.py
View File

@ -18,12 +18,7 @@ namelist = NameList(namefile)
from flask import Flask, request
app = Flask(__name__)
@app.route('/')
def get_root():
return "Error: No Endpoint selected. See docs/API.md for reference.", 404
app = Flask(__name__, static_folder='../web')
@app.route('/arrival', methods=['POST'])

BIN
web/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.1 KiB

95
web/index.html Normal file
View File

@ -0,0 +1,95 @@
<!DOCTYPE html>
<html>
<head>
<title>FTracker</title>
<script>
var cbt = {
'arrival': 'I have read the protection <a href="/guidelines">guidelines</a>',
'departure': 'I have cleaned my workspace'
}
function getParams() {
var h = document.location.href
var qparam = h.split('?')[1] || null
if (qparam == null) {
alert("Query parameter(s) missing")
return null
}
var vals = qparam.split('=')
if (vals.length < 2 || !cbt.hasOwnProperty(vals[0])) {
alert("Invalid query parameter")
return null
}
return {
action: vals[0],
room: vals[1]
}
}
var qp = getParams()
</script>
</head>
<body>
<main>
<h1><script>
document.write(qp.action + " " + qp.room)
</script></h1>
<form action="#">
<label>
Full Name:<br>
<input type="text" name="name" id="name" required>
</label><br>
<label>
<input type="checkbox" name="agree" id="agree" required>
<script>document.write(cbt[qp.action])</script>
</label><br>
<input type="submit">
</form>
</main>
<script>
form = document.querySelector('form')
form.onsubmit= function(e) {
e.preventDefault()
console.log(e)
var payload = (qp.action == 'arrival') ?
{
'room': qp.room,
'name': e.srcElement[0].value,
'agreetoguidelines': e.srcElement[1].checked
} :
{
'name': e.srcElement[0].value,
'cleanedworkspace': e.srcElement[1].checked
}
fetch("/" + qp.action, {
method: "POST",
body: JSON.stringify(payload)
}).then(res => {
console.log("Request complete! response:", res)
if (Math.floor(res.status / 100) == 2) {
form.innerHTML = "<h2>Done. Thanks!</h2>"
} else if (res.status == 409) {
// Conflict, more data requested
res.json().then(function (json) {
// TODO: Ask
alert(json.message)
})
} else {
// Any other generic error
res.text().then(function (text) {
alert(text)
})
}
})
console.log(payload)
}
</script>
</body>
</html>