mirror of
https://github.com/Xevion/trivia.git
synced 2025-12-11 08:08:57 -06:00
add autoscroll feature
This commit is contained in:
@@ -8,6 +8,10 @@ table {
|
|||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
th, td {
|
th, td {
|
||||||
font-family: Calibri, serif;
|
font-family: Calibri, serif;
|
||||||
font-size: large;
|
font-size: large;
|
||||||
@@ -35,6 +39,11 @@ th, td {
|
|||||||
width: 1rem;
|
width: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.team-silent {
|
||||||
|
font-style: italic;
|
||||||
|
color: #676767;
|
||||||
|
}
|
||||||
|
|
||||||
th, td > div {
|
th, td > div {
|
||||||
height: 10%;
|
height: 10%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@@ -42,4 +51,8 @@ th, td > div {
|
|||||||
|
|
||||||
th, td {
|
th, td {
|
||||||
height: 20px;
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnav {
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
@@ -1,6 +1,7 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
|
<link rel="stylesheet" type="text/css" href="../static/style.css"/>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>Index</title>
|
<title>Index</title>
|
||||||
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
||||||
@@ -10,34 +11,54 @@
|
|||||||
url_for('static', filename='jquery.js') }}">\x3C/script>')</script>
|
url_for('static', filename='jquery.js') }}">\x3C/script>')</script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div class="topnav" style="height: 1.5rem; float: right">
|
||||||
<table>
|
<a class="toggle-autoscroll">Disable Autoscroll</a>
|
||||||
<thead>
|
<a class="toggle-autorefresh">Enable Autorefresh</a>
|
||||||
<tr>
|
</div>
|
||||||
<th>Rank</th>
|
<div>
|
||||||
<th>ID</th>
|
<table>
|
||||||
<th>Team Name</th>
|
<thead>
|
||||||
{% for i in range(scoreCount) %}
|
<tr>
|
||||||
<th>{{ i + 1 }}</th>
|
<th>Rank</th>
|
||||||
{% endfor %}
|
<th>ID</th>
|
||||||
</tr>
|
<th>Team Name</th>
|
||||||
</thead>
|
{% for i in range(scoreCount) %}
|
||||||
<tbody>
|
<th>{{ i + 1 }}</th>
|
||||||
{% for team in teams %}
|
{% endfor %}
|
||||||
<tr>
|
</tr>
|
||||||
<td>{{ range(1, teams | length) | random }}</td>
|
</thead>
|
||||||
<td>{{ team.id }}</td>
|
<tbody>
|
||||||
{% if team.name | length > 0 %}
|
{% for team in teams %}
|
||||||
<td>{{ team.name }}</td>
|
<tr class="team-row">
|
||||||
{% else %}
|
<td>{{ range(1, teams | length) | random }}</td>
|
||||||
<td>Team {{ team.id }}</td>
|
<td>{{ team.id }}</td>
|
||||||
{% endif %}
|
{% if team.name | length > 0 %}
|
||||||
{% for score in team.scores %}
|
<td>{{ team.name }}</td>
|
||||||
<td>{{ score }}</td>
|
{% else %}
|
||||||
|
<td class="team-silent">Team {{ team.id }}</td>
|
||||||
|
{% endif %}
|
||||||
|
{% for score in team.scores %}
|
||||||
|
<td>{{ score }}</td>
|
||||||
|
{% endfor %}
|
||||||
|
</tr>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</tr>
|
</tbody>
|
||||||
{% endfor %}
|
</table>
|
||||||
</tbody>
|
</div>
|
||||||
</table>
|
|
||||||
</body>
|
</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>
|
</html>
|
||||||
Reference in New Issue
Block a user