xevion/trivia
1
0
Fork 0
mirror of https://github.com/Xevion/trivia.git synced 2025-12-09 16:08:54 -06:00
Code Issues Packages Projects Releases Wiki Activity

add autoscroll feature

Browse Source
This commit is contained in:
Xevion
2020-06-23 16:01:42 -05:00
parent e43c7e8bfa
commit 6e9ca747ef
2 changed files with 62 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
trivia/static/style.css
View File

@@ -8,6 +8,10 @@ table {
right: 0;
}
body {
margin: 0;
}
th, td {
font-family: Calibri, serif;
font-size: large;
@@ -35,6 +39,11 @@ th, td {
width: 1rem;
}
.team-silent {
font-style: italic;
color: #676767;
}
th, td > div {
height: 10%;
overflow: hidden;
@@ -42,4 +51,8 @@ th, td > div {
th, td {
height: 20px;
}
.topnav {
overflow: hidden;
}

77
trivia/templates/index.html
View File

@@ -1,6 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="../static/style.css"/>
<meta charset="UTF-8">
<title>Index</title>
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
@@ -10,34 +11,54 @@
url_for('static', filename='jquery.js') }}">\x3C/script>')</script>
</head>
<body>
<table>
<thead>
<tr>
<th>Rank</th>
<th>ID</th>
<th>Team Name</th>
{% for i in range(scoreCount) %}
<th>{{ i + 1 }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for team in teams %}
<tr>
<td>{{ range(1, teams | length) | random }}</td>
<td>{{ team.id }}</td>
{% if team.name | length > 0 %}
<td>{{ team.name }}</td>
{% else %}
<td>Team {{ team.id }}</td>
{% endif %}
{% for score in team.scores %}
<td>{{ score }}</td>
<div class="topnav" style="height: 1.5rem; float: right">
<a class="toggle-autoscroll">Disable Autoscroll</a>
<a class="toggle-autorefresh">Enable Autorefresh</a>
</div>
<div>
<table>
<thead>
<tr>
<th>Rank</th>
<th>ID</th>
<th>Team Name</th>
{% for i in range(scoreCount) %}
<th>{{ i + 1 }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for team in teams %}
<tr class="team-row">
<td>{{ range(1, teams | length) | random }}</td>
<td>{{ team.id }}</td>
{% if team.name | length > 0 %}
<td>{{ team.name }}</td>
{% else %}
<td class="team-silent">Team {{ team.id }}</td>
{% endif %}
{% for score in team.scores %}
<td>{{ score }}</td>
{% endfor %}
</tr>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</tbody>
</table>
</div>
</body>
<script>
SCROLL_INTERVAL = 1500;
function ScrollOnce(autoscroll) {
$(".team-row:first").appendTo("tbody")
if (autoscroll) {
setTimeout(function () {
ScrollOnce(true)
}, SCROLL_INTERVAL)
}
}
ScrollOnce(true);
</script>
</html>