Skip to content

Commit d560a8f

Browse files
BaldwinBaldwin
authored andcommitted
Dashboard displays simple vehicle messages
1 parent 31047b7 commit d560a8f

4 files changed

Lines changed: 66 additions & 20 deletions

File tree

openxc/tools/dashboard.py

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,13 @@
66
"""
77

88
import argparse
9+
import threading
10+
import logging
911
from flask import Flask
1012
from flask import render_template
1113
from flask_socketio import SocketIO
14+
1215
from openxc.interface import UsbVehicleInterface
13-
import threading
14-
import logging
1516

1617
log = logging.getLogger('werkzeug')
1718
log.setLevel(logging.ERROR)
@@ -45,7 +46,3 @@ def main():
4546
socketio.start_background_task(vehicle_data_thread)
4647
print("View the dashboard at http://127.0.0.1:5000")
4748
app.run()
48-
49-
if __name__ == '__main__':
50-
socketio.start_background_task(vehicle_data_thread)
51-
app.run()
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
caption {
2+
font-size: 1.5em;
3+
}
4+
5+
table, th, td {
6+
text-align: left;
7+
border-spacing: 8px 1px;
8+
}
9+
10+
.metric {
11+
text-align: right;
12+
}

openxc/tools/static/js/dashboard.js

Lines changed: 40 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -20,40 +20,68 @@ $(document).ready(function() {
2020
}
2121

2222
updateDataPoint(dataPoints[msg.name], msg);
23-
updateDisplay(msg.name, msg.value);
23+
updateDisplay(dataPoints[msg.name]);
2424

2525
if (cb)
2626
cb();
2727
});
2828
});
2929

3030
function addToDisplay(msgName) {
31-
$('<div/>', {
32-
id: msgName
33-
}).appendTo('#log');
31+
// Insert new rows alphabetically
32+
var added = false;
33+
$('#log tr').each(function() {
34+
if (msgName < $(this).children('td:eq(0)').text()) {
35+
$('<tr/>', {
36+
id: msgName
37+
}).insertBefore($(this));
38+
added = true;
39+
return false;
40+
}
41+
});
3442

35-
$('<span/>', {
43+
if (!added) {
44+
$('<tr/>', {
45+
id: msgName
46+
}).appendTo('#log');
47+
}
48+
49+
$('<td/>', {
3650
id: msgName + '_label',
37-
text: msgName + ': '
51+
text: msgName
3852
}).appendTo('#' + msgName);
3953

40-
$('<span/>', {
54+
$('<td/>', {
4155
id: msgName + '_value'
4256
}).appendTo('#' + msgName);
57+
58+
$('<td/>', {
59+
id: msgName + '_num',
60+
class: 'metric'
61+
}).appendTo('#' + msgName);
62+
63+
$('<td/>', {
64+
id: msgName + '_freq',
65+
class: 'metric'
66+
}).appendTo('#' + msgName);
4367
}
4468

45-
function updateDisplay(msgName, msgValue) {
46-
if (!($('#' + msgName).length > 0)) {
47-
addToDisplay(msgName);
69+
function updateDisplay(dataPoint) {
70+
msg = dataPoint.current_data
71+
72+
if (!($('#' + msg.name).length > 0)) {
73+
addToDisplay(msg.name);
4874
}
4975

50-
$('#' + msgName + '_value').text(msgValue);
76+
$('#' + msg.name + '_value').text(msg.value);
77+
$('#' + msg.name + '_num').text(dataPoint.messages_received);
78+
$('#' + msg.name + '_freq').text(Math.ceil(1 / dataPoint.average_time_since_update));
5179
}
5280

5381
function updateDataPoint(dataPoint, measurement) {
5482
dataPoint.messages_received++;
5583
dataPoint.current_data = measurement;
56-
let update_time = (new Date()).getTime();
84+
let update_time = (new Date()).getTime() / 1000;
5785

5886
if (dataPoint.last_update_time !== undefined) {
5987
dataPoint.average_time_since_update =

openxc/tools/templates/dashboard.html

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,18 @@
55
<script src="{{url_for('static', filename='js/jquery-3.4.1.slim.min.js')}}"></script>
66
<script src="{{url_for('static', filename='js/socket.io.slim.js')}}"></script>
77
<script src="{{url_for('static', filename='js/dashboard.js')}}"></script>
8+
<link rel="stylesheet" href="{{url_for('static', filename='css/dashboard.css')}}">
89
</head>
910
<body>
10-
<h2>Receive:</h2>
11-
<div id="log"></div>
11+
<table id="log">
12+
<caption>OpenXC Dashboard</caption>
13+
<tr>
14+
<th>Signal Name</th>
15+
<th>Value</th>
16+
<th># Received</th>
17+
<th>Freq. (Hz)</th>
18+
</tr>
19+
</table>
20+
</div>
1221
</body>
1322
</html>

0 commit comments

Comments
 (0)