Merge branch 'client' into 'master'

Client

See merge request kelder/rubygoldberg-tracker!1
This commit is contained in:
flynn 2019-09-27 19:41:52 +02:00
commit 37c8e13167
6 changed files with 82 additions and 0 deletions

View file

@ -37,3 +37,18 @@ Go enjoy the dashboard @ *localhost:5000*
## The client
This is an example client and will also be used as first link in the machine.
### Requirements
A local http file server of some kind.
for ex the python http server.
### Running
Go into the correct directory with the code
cd watcher
with python's http server
python -m http.server

11
client/index.css Normal file
View file

@ -0,0 +1,11 @@
.input-group {
padding: 10px;
}
input {
padding: 5px;
}
label {
margin-right: 10px;
}

33
client/index.html Normal file
View file

@ -0,0 +1,33 @@
<html>
<head>
<link href="index.css" rel="stylesheet" />
<script src="index.js"></script>
</head>
<body>
<form name="link">
<div class="input-group">
<label for="url-field">Watch server url</label>
<input name="url-field" type="text" value="localhost:5000" required></input>
</div>
<div class="input-group">
<label for="run-field">Run id</label>
<input name="run-field" type="number" value="1" required></input>
</div>
<div class="input-group">
<label for="link-field"> Link id </label>
<input name="link-field" type="number" value="0" required></input>
</div>
<div class="input-group">
<input type="button" name="start" value="Start" onclick="call_backend()" />
<input type="button" name="handoff" value="Handoff" onclick="call_backend()" />
</div>
</form>
<p>Result: <span id="result" style="font-weight: bold;"></span></p>
</body>
</html>

20
client/index.js Normal file
View file

@ -0,0 +1,20 @@
let call_backend = function(e) {
type = event.target.getAttribute('name');
var url_base = document.forms["link"]["url-field"].value;
var run = document.forms["link"]["run-field"].value;
var link = document.forms["link"]["link-field"].value;
x = new XMLHttpRequest();
x.onreadystatechange = function() {
if (x.readyState === 4) {
console.log("response: " + x.responseText);
document.getElementById("result").innerHTML = x.responseText;
};
};
var url = "http://" + url_base + "/link/" + (type === "start" ? "start" : "handoff") + "/" + run + "/" + link;
// console.log(url);
x.open("GET", url, true);
x.send();
};

View file

@ -9,9 +9,11 @@ import matplotlib.pyplot as plt
import socketio
from apscheduler.schedulers.background import BackgroundScheduler
from flask import Flask, render_template, request
from flask_cors import CORS
sio = socketio.Server()
app = Flask(__name__)
cors = CORS(app)
app.wsgi_app = socketio.WSGIApp(sio, app.wsgi_app)
# We request users to send the run number to prevent accidentially getting old requests from a previous run

View file

@ -1,4 +1,5 @@
flask
flask-cors
python-socketio
apscheduler
matplotlib