Redeem code
This commit is contained in:
parent
260ab48a72
commit
b9f2e0050b
4 changed files with 206 additions and 11 deletions
|
@ -22,12 +22,13 @@ class ExportHandler(tornado.web.RequestHandler):
|
||||||
range = yamiIchiCodes[range]
|
range = yamiIchiCodes[range]
|
||||||
# range = 1d, 3d, 1w
|
# range = 1d, 3d, 1w
|
||||||
ranges = {
|
ranges = {
|
||||||
"1d": ("2018-11-04 10:00:00","2018-11-05 12:00:00"),
|
"24h": ("2018-11-04 10:00:00","2018-11-05 12:00:00"),
|
||||||
"3d": ("2018-11-04 10:00:00","2018-11-07 12:00:00"),
|
"3d": ("2018-11-04 10:00:00","2018-11-07 12:00:00"),
|
||||||
"1w": ("2018-11-04 10:00:00","2018-11-11 12:00:00")
|
"1w": ("2018-11-04 10:00:00","2018-11-11 12:00:00")
|
||||||
}
|
}
|
||||||
q = "SELECT * FROM beats WHERE recordedAt > ? AND recordedAt < ? ORDER BY recordedAt ASC"
|
q = "SELECT * FROM beats WHERE recordedAt > ? AND recordedAt < ? ORDER BY recordedAt ASC"
|
||||||
|
|
||||||
|
print(range, ranges)
|
||||||
# TODO: userid + start time
|
# TODO: userid + start time
|
||||||
if range not in ranges:
|
if range not in ranges:
|
||||||
# Not found
|
# Not found
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
import os
|
import os
|
||||||
import tornado.web
|
import tornado.web
|
||||||
import tornado.template
|
import tornado.template
|
||||||
|
from .ranges import yamiIchiCodes
|
||||||
|
|
||||||
viewdir = os.path.dirname(os.path.realpath(__file__)) + '/../views'
|
viewdir = os.path.dirname(os.path.realpath(__file__)) + '/../views'
|
||||||
loader = tornado.template.Loader(viewdir)
|
loader = tornado.template.Loader(viewdir)
|
||||||
|
@ -15,11 +15,27 @@ class FrontendHandler(tornado.web.RequestHandler):
|
||||||
"""
|
"""
|
||||||
self.conn = conn
|
self.conn = conn
|
||||||
|
|
||||||
def get(self):
|
def get(self, page):
|
||||||
# c = self.conn.cursor()
|
print("getting", page)
|
||||||
# c.execute("SELECT * FROM beats ORDER BY createdAt DESC LIMIT 20")
|
|
||||||
# beats = [row for row in c]
|
if page in yamiIchiCodes:
|
||||||
# print(beats)
|
range = yamiIchiCodes[page]
|
||||||
# html = loader.load("sockets.html").generate(beats=beats)
|
ranges = {
|
||||||
html = loader.load("plot.html").generate()
|
"24h": ("2018-11-04 10:00:00","2018-11-05 12:00:00"),
|
||||||
self.write(html)
|
"3d": ("2018-11-04 10:00:00","2018-11-07 12:00:00"),
|
||||||
|
"1w": ("2018-11-04 10:00:00","2018-11-11 12:00:00")
|
||||||
|
}
|
||||||
|
startDate = ranges[range][0]
|
||||||
|
endDate = ranges[range][1]
|
||||||
|
html = loader.load("redeem.html").generate(code=page, startDate=startDate, endDate=endDate)
|
||||||
|
self.write(html)
|
||||||
|
elif page == "yamiichi":
|
||||||
|
# c = self.conn.cursor()
|
||||||
|
# c.execute("SELECT * FROM beats ORDER BY createdAt DESC LIMIT 20")
|
||||||
|
# beats = [row for row in c]
|
||||||
|
# print(beats)
|
||||||
|
# html = loader.load("sockets.html").generate(beats=beats)
|
||||||
|
html = loader.load("plot.html").generate()
|
||||||
|
self.write(html)
|
||||||
|
else:
|
||||||
|
raise tornado.web.HTTPError(404)
|
||||||
|
|
|
@ -39,10 +39,10 @@ def start(args):
|
||||||
# use "/" as the root, and the
|
# use "/" as the root, and the
|
||||||
# WebSocketHandler as our handler
|
# WebSocketHandler as our handler
|
||||||
application = tornado.web.Application([
|
application = tornado.web.Application([
|
||||||
(r"/", FrontendHandler, {"conn": conn}),
|
|
||||||
(r"/ws", WebSocketHandler, {"conn": conn, "token": token}),
|
(r"/ws", WebSocketHandler, {"conn": conn, "token": token}),
|
||||||
(r"/(.*).csv", ExportHandler, {"conn": conn}),
|
(r"/(.*).csv", ExportHandler, {"conn": conn}),
|
||||||
(r"/assets/(.*)", tornado.web.StaticFileHandler, {"path": "assets/"}),
|
(r"/assets/(.*)", tornado.web.StaticFileHandler, {"path": "assets/"}),
|
||||||
|
(r"/(.*)", FrontendHandler, {"conn": conn}),
|
||||||
],debug=True)
|
],debug=True)
|
||||||
|
|
||||||
application.listen(8888)
|
application.listen(8888)
|
||||||
|
|
178
views/redeem.html
Normal file
178
views/redeem.html
Normal file
|
@ -0,0 +1,178 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<title>Quantified Other: Heart Edition</title>
|
||||||
|
<link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/d-din" type="text/css"/>
|
||||||
|
<style media="screen">
|
||||||
|
body{
|
||||||
|
font-family: 'DDINRegular', Helvetica, sans-serif;
|
||||||
|
}
|
||||||
|
#graph{
|
||||||
|
height: calc(100vh);
|
||||||
|
width:100vw;
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
left:0;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
h1{
|
||||||
|
color: darkblue;
|
||||||
|
}
|
||||||
|
#downloads {
|
||||||
|
border: solid #000 1px;
|
||||||
|
padding: 10px;
|
||||||
|
position: absolute;
|
||||||
|
top: 160px;
|
||||||
|
right: 10px;
|
||||||
|
background: darkblue;
|
||||||
|
font-weight: bold;
|
||||||
|
width: 200px;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
#downloads a{
|
||||||
|
color: yellow;
|
||||||
|
}
|
||||||
|
#title {
|
||||||
|
background: darkblue;
|
||||||
|
width: 200px;
|
||||||
|
height: 130px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
color: white;
|
||||||
|
font-size: 20pt;
|
||||||
|
padding: 10px;
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
right: 10px;
|
||||||
|
border: solid 1px #000;
|
||||||
|
text-shadow: 1px 1px #000, -1px -1px #000,1px -1px #000, -1px 1px #000;
|
||||||
|
margin-top:0;
|
||||||
|
}
|
||||||
|
#value {
|
||||||
|
padding-left: 6px;
|
||||||
|
font-size: 60px;
|
||||||
|
display: block;
|
||||||
|
float: right;
|
||||||
|
width: 50%;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
#downloads span {
|
||||||
|
font-weight: normal;
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#projecttitle{
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#me{
|
||||||
|
font-style: italic;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 10px;
|
||||||
|
right:10px;
|
||||||
|
font-size: 70%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gtitle{
|
||||||
|
transform: translateY(47px);
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
<script src="https://cdn.plot.ly/plotly-1.5.0.min.js"></script>
|
||||||
|
<script language="javascript" type="text/javascript">
|
||||||
|
|
||||||
|
var wsUri = window.location.toString().replace('http','ws') + "ws";
|
||||||
|
console.log(wsUri)
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<h1 id="projecttitle">Data Double Black Market - Redeem code {{ code }}</h1>
|
||||||
|
<div id="me">A project by <a href="https://rubenvandeven.com">Ruben van de Ven</a></div>
|
||||||
|
<h2 id="title">live bpm: <span id='value'>...</span></h2>
|
||||||
|
<div id='downloads'>
|
||||||
|
<div class='description>'>Get as <a href="/{{ code }}.csv">csv</a></div>
|
||||||
|
</div>
|
||||||
|
<div id="graph">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<script type="text/javascript">
|
||||||
|
var valueEl = document.getElementById('value');
|
||||||
|
var audio = new Audio('/assets/heartbeat.mp3');
|
||||||
|
Plotly.d3.csv("/{{ code }}.csv", function(err, rows){
|
||||||
|
console.log(rows);
|
||||||
|
function unpack(rows, key) {
|
||||||
|
return rows.map(function(row) { return row[key]; });
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
var trace1 = {
|
||||||
|
type: "scatter",
|
||||||
|
mode: "lines",
|
||||||
|
name: 'BPM',
|
||||||
|
x: unpack(rows, 'timestamp'),
|
||||||
|
y: unpack(rows, 'bpm'),
|
||||||
|
line: {color: '#02028b'}//17BECF
|
||||||
|
}
|
||||||
|
|
||||||
|
var data = [trace1];
|
||||||
|
|
||||||
|
var layout = {
|
||||||
|
title: 'Redeem heartbeat: Ruben van de Ven',
|
||||||
|
xaxis: {
|
||||||
|
|
||||||
|
type: 'date',
|
||||||
|
range: [ new Date("{{ startDate }}").getTime(), new Date("{{ endDate }}").getTime() ],
|
||||||
|
autorange: false
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var currentBpm = null;
|
||||||
|
|
||||||
|
Plotly.newPlot('graph', data, layout);
|
||||||
|
|
||||||
|
var wsUri = window.location.toString().replace('http','ws') + "ws";
|
||||||
|
|
||||||
|
var connectSocket = function() {
|
||||||
|
websocket = new WebSocket(wsUri);
|
||||||
|
websocket.onopen = function(evt) {
|
||||||
|
console.log("opened");
|
||||||
|
};
|
||||||
|
websocket.onclose = function(evt) {
|
||||||
|
console.log("closed", evt);
|
||||||
|
valueEl.innerHTML = '...';
|
||||||
|
setTimeout(connectSocket, 1000 * 10);
|
||||||
|
};
|
||||||
|
websocket.onmessage = function(evt) {
|
||||||
|
data = JSON.parse(evt.data);
|
||||||
|
var update = {
|
||||||
|
x: [[data['timestamp']]],
|
||||||
|
y: [[data['bpm']]]
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log("update", update)
|
||||||
|
valueEl.innerHTML = data['bpm'];
|
||||||
|
currentBpm = data['bpm'];
|
||||||
|
|
||||||
|
Plotly.extendTraces('graph', update, [0])
|
||||||
|
};
|
||||||
|
websocket.onerror = function(evt) {
|
||||||
|
|
||||||
|
};
|
||||||
|
}
|
||||||
|
connectSocket();
|
||||||
|
|
||||||
|
let tick = function() {
|
||||||
|
var duration = 10000;
|
||||||
|
if(currentBpm != null) {
|
||||||
|
audio.play();
|
||||||
|
duration = 60000 / currentBpm;
|
||||||
|
}
|
||||||
|
setTimeout(tick, duration);
|
||||||
|
}
|
||||||
|
tick();
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
Loading…
Reference in a new issue