Added C3js scoreboard with fake teams
This commit is contained in:
Thomas
parent
0901f05cca
commit
d9c16f2830
5 changed files with 143 additions and 12 deletions
|
|
@ -3,6 +3,9 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>EasyCTF 2016</title>
|
<title>EasyCTF 2016</title>
|
||||||
|
<link href="css/c3.css" rel="stylesheet" type="text/css">
|
||||||
|
<script src="js/d3.v3.min.js" charset="utf-8"></script>
|
||||||
|
<script src="js/c3.min.js"></script>
|
||||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
|
||||||
<link type="text/css" rel="stylesheet" href="css/style.css">
|
<link type="text/css" rel="stylesheet" href="css/style.css">
|
||||||
<base href="/">
|
<base href="/">
|
||||||
|
|
@ -25,45 +28,45 @@
|
||||||
<ul class="nav navbar-nav navbar-fixed">
|
<ul class="nav navbar-nav navbar-fixed">
|
||||||
<li>
|
<li>
|
||||||
<a href="/about">
|
<a href="/about">
|
||||||
<img src="images/info.png" class="icn" alt="information icon"> About</a>
|
<span class="glyphicon glyphicon-info-sign"></span> About</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/rules">
|
<a href="/rules">
|
||||||
<img src="images/rules.png" class="icn" alt=""> Rules</a>
|
<span class="glyphicon glyphicon-th-list"></span> Rules</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/updates">
|
<a href="/updates">
|
||||||
<img src="images/updates.png" class="icn" alt=""> Updates</a>
|
<span class="glyphicon glyphicon-refresh"></span> Updates</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/chat">
|
<a href="/chat">
|
||||||
<img src="images/chat.png" class="icn" alt=""> Chat</a>
|
<span class="glyphicon glyphicon-comment"></span> Chat</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/scoreboard">
|
<a href="/scoreboard">
|
||||||
<img src="images/scoreboard.png" class="icn" alt=""> Scoreboard</a>
|
<span class="glyphicon glyphicon-stats"></span> Scoreboard</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="nav navbar-nav navbar-right">
|
<ul class="nav navbar-nav navbar-right">
|
||||||
<li>
|
<li>
|
||||||
<a href="/programming">
|
<a href="/programming">
|
||||||
<img src="images/programming.png" class="icn" alt="programming icon"> Programming</a>
|
<span class="glyphicon glyphicon-flash"></span> Programming</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/shell">
|
<a href="/shell">
|
||||||
<img src="images/terminal.png" class="icn" alt="shell icon"> Shell</a>
|
<span class="glyphicon glyphicon-console"></span> Shell</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/problems">
|
<a href="/problems">
|
||||||
<img src="images/problems.png" class="icn" alt="problems icon"> Problems</a>
|
<span class="glyphicon glyphicon-flag"></span> Problems</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/login">
|
<a href="/login">
|
||||||
<img src="images/login.png" class="icn" alt="login icon"> Login</a>
|
<span class="glyphicon glyphicon-log-in"></span> Login</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="/register">
|
<a href="/register">
|
||||||
<img src="images/register.png" class="icn" alt="register icon"> Register</a>
|
<span class="glyphicon glyphicon-pencil"></span> Register</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
5
web/js/c3.min.js
vendored
Normal file
5
web/js/c3.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
5
web/js/d3.v3.min.js
vendored
Normal file
5
web/js/d3.v3.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
45
web/js/scoreboard.js
Normal file
45
web/js/scoreboard.js
Normal file
|
|
@ -0,0 +1,45 @@
|
||||||
|
var chart = c3.generate({
|
||||||
|
data: {
|
||||||
|
x: 'x',
|
||||||
|
columns: [
|
||||||
|
['x', '2013-01-01', '2013-01-02', '2013-01-03', '2013-01-04', '2013-01-05', '2013-01-06'],
|
||||||
|
['Team Thomas', 30, 250, 380, 500, 620, 740],
|
||||||
|
]
|
||||||
|
},
|
||||||
|
axis: {
|
||||||
|
x: {
|
||||||
|
type: 'timeseries',
|
||||||
|
tick: {
|
||||||
|
format: '%Y-%m-%d'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
setTimeout(function() {
|
||||||
|
chart.load({
|
||||||
|
columns: [
|
||||||
|
['Team Charles', 100, 210, 320, 430, 540, 650]
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 1000);
|
||||||
|
setTimeout(function() {
|
||||||
|
chart.load({
|
||||||
|
columns: [
|
||||||
|
['Team Zach', 10, 120, 230, 340, 450, 560]
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 2000);
|
||||||
|
setTimeout(function() {
|
||||||
|
chart.load({
|
||||||
|
columns: [
|
||||||
|
['Team Michael', 0, 80, 190, 300, 410, 520]
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 3000);
|
||||||
|
setTimeout(function() {
|
||||||
|
chart.load({
|
||||||
|
columns: [
|
||||||
|
['Team James', 0, 100, 250, 300, 450, 600]
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 4000);
|
||||||
|
|
@ -1,18 +1,91 @@
|
||||||
|
<script type="text/javascript">
|
||||||
|
var chart = c3.generate({
|
||||||
|
data: {
|
||||||
|
x: 'x',
|
||||||
|
columns: [
|
||||||
|
['x', '2013-01-01', '2013-01-02', '2013-01-03', '2013-01-04', '2013-01-05', '2013-01-06'],
|
||||||
|
['Team Thomas', 30, 250, 380, 500, 620, 740],
|
||||||
|
]
|
||||||
|
},
|
||||||
|
axis: {
|
||||||
|
x: {
|
||||||
|
type: 'timeseries',
|
||||||
|
tick: {
|
||||||
|
format: '%Y-%m-%d'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
setTimeout(function() {
|
||||||
|
chart.load({
|
||||||
|
columns: [
|
||||||
|
['Team Charles', 100, 210, 320, 430, 540, 650]
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 1000);
|
||||||
|
setTimeout(function() {
|
||||||
|
chart.load({
|
||||||
|
columns: [
|
||||||
|
['Team Zach', 10, 120, 230, 340, 450, 560]
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 2000);
|
||||||
|
setTimeout(function() {
|
||||||
|
chart.load({
|
||||||
|
columns: [
|
||||||
|
['Team Michael', 0, 80, 190, 300, 410, 520]
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 3000);
|
||||||
|
setTimeout(function() {
|
||||||
|
chart.load({
|
||||||
|
columns: [
|
||||||
|
['Team James', 0, 100, 250, 300, 450, 600]
|
||||||
|
]
|
||||||
|
});
|
||||||
|
}, 4000);
|
||||||
|
</script>
|
||||||
<center class="fade_in">
|
<center class="fade_in">
|
||||||
<h1 class="heading1">Scoreboard</h1>
|
<h1 class="heading1">Scoreboard</h1>
|
||||||
|
<br>
|
||||||
|
<div id="chart"></div>
|
||||||
|
<br>
|
||||||
<table class="table">
|
<table class="table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>#</th>
|
<th>#</th>
|
||||||
<th>Team Name</th>
|
<th>Team Name</th>
|
||||||
<th>School</th>
|
<th>School</th>
|
||||||
|
<th>Points</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<td>1</td>
|
<td>1</td>
|
||||||
<td>Charles Is The Best</td>
|
<td>Team Thomas</td>
|
||||||
<td>pg</td>
|
<td>T. High School</td>
|
||||||
|
<td>740</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>2</td>
|
||||||
|
<td>Team Charles</td>
|
||||||
|
<td>C. High School</td>
|
||||||
|
<td>650</td>
|
||||||
|
</tr><tr>
|
||||||
|
<td>3</td>
|
||||||
|
<td>Team Zach</td>
|
||||||
|
<td>Z. High School</td>
|
||||||
|
<td>560</td>
|
||||||
|
</tr><tr>
|
||||||
|
<td>4</td>
|
||||||
|
<td>Team Michael</td>
|
||||||
|
<td>M. High School</td>
|
||||||
|
<td>520</td>
|
||||||
|
</tr><tr>
|
||||||
|
<td>5</td>
|
||||||
|
<td>Team James</td>
|
||||||
|
<td>J. High School</td>
|
||||||
|
<td>600</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue