-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
78 lines (75 loc) · 2.55 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>EdX Learning Dashboard Challenge Prototype Demo</title>
<link rel="stylesheet" href="index.css">
<script src="http://d3js.org/d3.v3.min.js"></script>
</head>
<body>
<header>
<nav class='nav'>
<span class="nav-logo">
<img src="https://d37djvu3ytnwxt.cloudfront.net/static/images/logo-edX-77x36.png" alt="edX" title="edX" itemprop="url" height="30" width="64">
</span>
<span class="nav-provider">MITx:</span>
<span class="nav-text">0.000x </span>
<span class="nav-text nav-hide-on-small">EdX Learning Dashboard Challenge</span>
<span class="nav-text nav-float-right">
<select name="student" id="select-student"></select>
<script src="student-selectbox.js"></script>
</span>
</nav>
</header>
<nav class="nav-course">
<span>Courseware</span>
<span class="tab-active">Progress</span>
</nav>
<div class="content">
<div id="lcol">
<div class="card">
<h2 class="card-header">Progress</h2>
<div class="card-content" id="progress">
<div class="chart-options">
<label for="category">Show</label>
<select name="category" id="select-category">
<option value="problem" selected>problem</option>
<option value="video">video</option>
</select>
<label for="peers"> progress compared to</label>
<select name="peers" id="select-peer"></select>
</div>
</div>
</div>
</div>
<div id="rcol">
<div class="card">
<h2 class="card-header">Timeline</h2>
<div class="card-content" id="timeline">
<div class="chart-options">
<label for="timelinetype">Show</label>
<select name="timelinetype" id="select-timelinetype">
<option value="accumulated" selected>accumulated</option>
<option value="perday">perday</option>
</select>
<span>progress</span>
</div>
</div>
</div>
<div class="card">
<h2 class="card-header">Leaderboard</h2>
<div class="card-content" id="leaderboard">
<div class="chart-options">
<label for="top10">Show</label>
<select name="top10" id="select-top10">
</select>
</div>
</div>
</div>
</div>
</div>
<script src="progress-donut-chart.js"></script>
<script src="timeline-line-chart.js"></script>
<script src="leaderboard-bar-chart.js"></script>
</body>
</html>