Skip to content

Commit 4b01b56

Browse files
committed
Added day selection to mouse and keyboard pages.
1 parent e011dce commit 4b01b56

File tree

6 files changed

+129
-31
lines changed

6 files changed

+129
-31
lines changed

inputscope/static/site.css

+50-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
*
44
* @author Erki Suurjaak
55
* @created 07.04.2015
6-
* @modified 04.05.2015
6+
* @modified 20.05.2015
77
*/
88
* {
99
font-family: Tahoma;
@@ -43,12 +43,60 @@
4343
padding: 7px;
4444
}
4545
#header a {
46-
font-size: 1.5em;
4746
color: white;
47+
text-decoration: none;
48+
}
49+
#header a:hover {
50+
text-decoration: underline;
51+
}
52+
#headerlinks {
53+
float: left;
54+
position: relative;
55+
}
56+
#indexlink {
57+
font-size: 2em;
4858
padding: 10px;
4959
position: relative;
5060
top: 6px;
5161
}
62+
#inputlinks {
63+
float: right;
64+
font-size: 1em;
65+
padding: 3px;
66+
position: relative;
67+
top: 5px;
68+
}
69+
#inputlinks a {
70+
display: block;
71+
}
72+
#replaysection {
73+
float: right;
74+
margin-top: 20px;
75+
}
76+
#daysection {
77+
float: right;
78+
font-size: 1em;
79+
padding: 10px;
80+
min-width: 260px;
81+
display: table;
82+
margin: 0 auto;
83+
text-align: center;
84+
position: relative;
85+
}
86+
#daysection a {
87+
position: absolute;
88+
top: 3px;
89+
padding: 10px;
90+
}
91+
#daysection a:first-child {
92+
left: 0px;
93+
}
94+
#daysection a:last-child {
95+
right: 0px;
96+
}
97+
#daysection select {
98+
text-align: center;
99+
}
52100
#footer a {
53101
position: absolute;
54102
right: 10px;

inputscope/views/base.tpl

+45-3
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,16 @@ Base template, with site layout and style.
44
Template arguments:
55
title page title, if any
66
base main content
7+
days list of available days
8+
input "mouse"|"keyboard"
9+
table events table shown, moves|clicks|scrolls|keys|combos
710

811
@author Erki Suurjaak
912
@created 07.04.2015
1013
@modified 23.04.2015
1114
%"""
1215
%WEBROOT = get_url("/")
16+
%days = get("days", [])
1317
<!DOCTYPE html>
1418
<html>
1519
<head>
@@ -21,11 +25,39 @@ Template arguments:
2125
<script src="{{WEBROOT}}static/heatmap.min.js"></script>
2226
</head>
2327
<body>
24-
<div id="header">
25-
<a href="{{WEBROOT}}" id="indexlink">{{conf.Title}}</a>
28+
<div id="header" style="position: relative;">
29+
30+
<span id="headerlinks">
31+
<a href="{{WEBROOT}}" id="indexlink">{{conf.Title}}</a>
32+
<span id="inputlinks">
33+
%for x in ["mouse", "keyboard"]:
34+
<a href="{{get_url("/<input>", input=x)}}">{{x}}</a>
35+
%end # for x
36+
</span>
37+
</span>
38+
39+
%if days:
40+
<span id="daysection">
41+
%dayidx = next((i for i, x in enumerate(days) if x["day"] == day), None)
42+
%prevday, nextday = (days[x]["day"] if 0 <= x < len(days) else None for x in [dayidx-1, dayidx+1]) if dayidx is not None else [None]*2
43+
<a href="{{get_url("/%s/<table>/<day>" % input, table=table, day=prevday)}}">{{"< %s" % prevday if prevday else ""}}</a>
44+
45+
<select id="dayselector">
46+
%if not day:
47+
<option>- day -</option>
48+
%end # if not day
49+
%for d in days:
50+
<option{{' selected="selected"' if day == d["day"] else ""}}>{{d["day"]}}</option>
51+
%end # for d
52+
</select>
53+
54+
<a href="{{get_url("/%s/<table>/<day>" % input, table=table, day=nextday)}}">{{"%s >" % nextday if nextday else ""}}</a>
55+
</span>
56+
%end # if days
57+
2658
</div>
2759

28-
<div id="content">
60+
<div id="content" style="position: relative;">
2961
{{!base}}
3062
</div>
3163

@@ -35,5 +67,15 @@ Template arguments:
3567
</div>
3668
</div>
3769

70+
71+
%if days:
72+
<script type="text/javascript">
73+
window.addEventListener("load", function() {
74+
document.getElementById("dayselector").addEventListener("change", function() {
75+
window.location.href = "{{get_url("/%s/<table>" % input, table=table)}}/" + this.value;
76+
});
77+
});
78+
</script>
79+
%end # if days
3880
</body>
3981
</html>

inputscope/views/input.tpl

+3-2
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,11 @@ Index page.
44
Template arguments:
55
stats data statistics
66
input "mouse"|"keyboard"
7+
table "moves"|"clicks"|"scrolls"|"keys"|"combos", if any
78

89
@author Erki Suurjaak
910
@created 07.04.2015
10-
@modified 07.04.2015
11+
@modified 20.05.2015
1112
%"""
1213
%WEBROOT = get_url("/")
1314
%title = input.capitalize()
@@ -33,4 +34,4 @@ Template arguments:
3334
</tbody>
3435
%end # for table, data
3536
</table>
36-
</div>
37+
</div>

inputscope/views/keyboard.tpl

+14-12
Original file line numberDiff line numberDiff line change
@@ -4,30 +4,32 @@ Keyboard statistics page.
44
Template arguments:
55
table keyboard events table to show, "keys"
66
day day for keyboard events, if any
7+
days list of available days
8+
input "keyboard"
79
events list of all events
810
counts keyboard event counts
911
stats keyboard statistics
1012

1113
@author Erki Suurjaak
1214
@created 07.04.2015
13-
@modified 06.05.2015
15+
@modified 20.05.2015
1416
%"""
15-
%import cgi
1617
%WEBROOT = get_url("/")
17-
%title = "Keyboard %s" % table
18+
%title = "%s %s" % (input.capitalize(), table)
1819
%rebase("base.tpl", **locals())
1920

20-
<a href="{{get_url("/<input>", input="keyboard")}}">Keyboard index</a><br />
2121
<h3>{{title}}</h3>{{", %s" % day if day else ""}} ({{len(events)}})
2222

23-
<input type="button" id="button_replay" value="Replay" />
24-
<span class="range">
25-
<label for="replay_interval" class="range_label">speed</label>
26-
<input type="range" id="replay_interval" min="1" max="100" value="50" title="Animation interval" />
27-
</span>
28-
<span class="range">
29-
<label for="replay_step" class="range_label">step</label>
30-
<input type="range" id="replay_step" min="1" max="100" value="1" title="Points in each animation" />
23+
<span id="replaysection">
24+
<input type="button" id="button_replay" value="Replay" />
25+
<span class="range">
26+
<label for="replay_interval" class="range_label">speed</label>
27+
<input type="range" id="replay_interval" min="1" max="100" value="50" title="Animation interval" />
28+
</span>
29+
<span class="range">
30+
<label for="replay_step" class="range_label">step</label>
31+
<input type="range" id="replay_step" min="1" max="100" value="1" title="Points in each animation" />
32+
</span>
3133
</span>
3234

3335
<div id="status">

inputscope/views/mouse.tpl

+14-11
Original file line numberDiff line numberDiff line change
@@ -4,29 +4,32 @@ Mouse statistics page.
44
Template arguments:
55
table mouse events table shown, moves|clicks|scrolls
66
day day for mouse events, if any
7+
days list of available days
8+
input "mouse"
79
events list of mouse events
810
positions list of mouse positions with counts
911
stats mouse statistics
1012

1113
@author Erki Suurjaak
1214
@created 07.04.2015
13-
@modified 06.05.2015
15+
@modified 20.05.2015
1416
%"""
1517
%WEBROOT = get_url("/")
16-
%title = "Mouse %s" % table
18+
%title = "%s %s" % (input.capitalize(), table)
1719
%rebase("base.tpl", **locals())
1820

19-
<a href="{{get_url("/<input>", input="mouse")}}">Mouse index</a><br />
2021
<h3>{{title}}</h3>{{", %s" % day if day else ""}} ({{len(events)}})
2122

22-
<input type="button" id="button_replay" value="Replay" />
23-
<span class="range">
24-
<label for="replay_interval" class="range_label">speed</label>
25-
<input type="range" id="replay_interval" min="1" max="100" value="50" title="Animation interval" />
26-
</span>
27-
<span class="range">
28-
<label for="replay_step" class="range_label">step</label>
29-
<input type="range" id="replay_step" min="1" max="100" value="1" title="Points in each animation" />
23+
<span id="replaysection">
24+
<input type="button" id="button_replay" value="Replay" />
25+
<span class="range">
26+
<label for="replay_interval" class="range_label">speed</label>
27+
<input type="range" id="replay_interval" min="1" max="100" value="50" title="Animation interval" />
28+
</span>
29+
<span class="range">
30+
<label for="replay_step" class="range_label">step</label>
31+
<input type="range" id="replay_step" min="1" max="100" value="1" title="Points in each animation" />
32+
</span>
3033
</span>
3134

3235
<div id="status">

inputscope/webui.py

+3-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
77
@author Erki Suurjaak
88
@created 06.04.2015
9-
@modified 18.05.2015
9+
@modified 20.05.2015
1010
"""
1111
import collections
1212
import datetime
@@ -43,6 +43,7 @@ def mouse(table, day=None):
4343
events = db.fetch(table, where=where, order="day")
4444
for e in events: e["dt"] = datetime.datetime.fromtimestamp(e["stamp"])
4545
stats, positions, events = stats_mouse(events, table)
46+
days, input = db.fetch("counts", order="day", type=table), "mouse"
4647
return bottle.template("mouse.tpl", locals(), conf=conf)
4748

4849

@@ -59,6 +60,7 @@ def keyboard(table, day=None):
5960
events = db.fetch(table, where=where, order="stamp")
6061
for e in events: e["dt"] = datetime.datetime.fromtimestamp(e["stamp"])
6162
stats, collatedevents = stats_keyboard(events, table)
63+
days, input = db.fetch("counts", order="day", type=table), "keyboard"
6264
return bottle.template("keyboard.tpl", locals(), conf=conf)
6365

6466

0 commit comments

Comments
 (0)