Redeem code

This commit is contained in:
Ruben van de Ven 2018-11-04 08:09:17 +01:00
parent 260ab48a72
commit b9f2e0050b
4 changed files with 206 additions and 11 deletions

View file

@ -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

View file

@ -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,7 +15,21 @@ class FrontendHandler(tornado.web.RequestHandler):
""" """
self.conn = conn self.conn = conn
def get(self): def get(self, page):
print("getting", page)
if page in yamiIchiCodes:
range = yamiIchiCodes[page]
ranges = {
"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"),
"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 = self.conn.cursor()
# c.execute("SELECT * FROM beats ORDER BY createdAt DESC LIMIT 20") # c.execute("SELECT * FROM beats ORDER BY createdAt DESC LIMIT 20")
# beats = [row for row in c] # beats = [row for row in c]
@ -23,3 +37,5 @@ class FrontendHandler(tornado.web.RequestHandler):
# html = loader.load("sockets.html").generate(beats=beats) # html = loader.load("sockets.html").generate(beats=beats)
html = loader.load("plot.html").generate() html = loader.load("plot.html").generate()
self.write(html) self.write(html)
else:
raise tornado.web.HTTPError(404)

View file

@ -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
View 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>