easyctf/easyctf-2017
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Added C3js scoreboard with fake teams

Browse source
This commit is contained in:
Thomas 2016-01-01 23:22:06 -06:00
parent 0901f05cca
commit d9c16f2830
5 changed files with 143 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
web/index.html
View file

@ -3,6 +3,9 @@
<head>
<meta charset="utf-8">
<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 type="text/css" rel="stylesheet" href="css/style.css">
<base href="/">
@ -25,45 +28,45 @@
<ul class="nav navbar-nav navbar-fixed">
<li>
<a href="/about">
<img src="images/info.png" class="icn" alt="information icon">&nbsp;&nbsp;About</a>
<span class="glyphicon glyphicon-info-sign"></span>&nbsp;&nbsp;About</a>
</li>
<li>
<a href="/rules">
<img src="images/rules.png" class="icn" alt="">&nbsp;&nbsp;Rules</a>
<span class="glyphicon glyphicon-th-list"></span>&nbsp;&nbsp;Rules</a>
</li>
<li>
<a href="/updates">
<img src="images/updates.png" class="icn" alt="">&nbsp;&nbsp;Updates</a>
<span class="glyphicon glyphicon-refresh"></span>&nbsp;&nbsp;Updates</a>
</li>
<li>
<a href="/chat">
<img src="images/chat.png" class="icn" alt="">&nbsp;&nbsp;Chat</a>
<span class="glyphicon glyphicon-comment"></span>&nbsp;&nbsp;Chat</a>
</li>
<li>
<a href="/scoreboard">
<img src="images/scoreboard.png" class="icn" alt="">&nbsp;&nbsp;Scoreboard</a>
<span class="glyphicon glyphicon-stats"></span>&nbsp;&nbsp;Scoreboard</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="/programming">
<img src="images/programming.png" class="icn" alt="programming icon">&nbsp;&nbsp;Programming</a>
<span class="glyphicon glyphicon-flash"></span>&nbsp;&nbsp;Programming</a>
</li>
<li>
<a href="/shell">
<img src="images/terminal.png" class="icn" alt="shell icon">&nbsp;&nbsp;Shell</a>
<span class="glyphicon glyphicon-console"></span>&nbsp;&nbsp;Shell</a>
</li>
<li>
<a href="/problems">
<img src="images/problems.png" class="icn" alt="problems icon">&nbsp;&nbsp;Problems</a>
<span class="glyphicon glyphicon-flag"></span>&nbsp;&nbsp;Problems</a>
</li>
<li>
<a href="/login">
<img src="images/login.png" class="icn" alt="login icon">&nbsp;&nbsp;Login</a>
<span class="glyphicon glyphicon-log-in"></span>&nbsp;&nbsp;Login</a>
</li>
<li>
<a href="/register">
<img src="images/register.png" class="icn" alt="register icon">&nbsp;&nbsp;Register</a>
<span class="glyphicon glyphicon-pencil"></span>&nbsp;&nbsp;Register</a>
</li>
</ul>
</div>

5
web/js/c3.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

5
web/js/d3.v3.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

45
web/js/scoreboard.js Normal file
View 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);

77
web/pages/scoreboard.html
View file

@ -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">
<h1 class="heading1">Scoreboard</h1>
<br>
<div id="chart"></div>
<br>
<table class="table">
<thead>
<tr>
<th>#</th>
<th>Team Name</th>
<th>School</th>
<th>Points</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Charles Is The Best</td>
<td>pg</td>
<td>Team Thomas</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>
</tbody>
</table>