first draft of tabulator tables

This commit is contained in:
Maximilian Keßler 2023-12-05 15:14:20 +01:00
parent 081601f0f7
commit 31f71c6d5c
Signed by: max
GPG key ID: BCC5A619923C0BA5
2 changed files with 104 additions and 3 deletions

View file

@ -1,3 +1,4 @@
import dataclasses
import shutil
from pathlib import Path
from typing import Dict, List
@ -5,6 +6,7 @@ from typing import Dict, List
import jinja2
import datetime
import psycopg2.extras
import stats
import constants
import utils
@ -75,6 +77,79 @@ class VariantRow:
stats: VariantStats
@dataclass
class GameRow:
game_id: int
num_players: int
users: List[str]
user_ids: List[int]
variant_id: int
variant_name: str
seed: str
score: int
num_turns: int
league_id: int
num_bdrs: int
num_crits_lost: int
game_outcomes: List[stats.GameOutcome]
def get_games():
cur = conn_manager.get_connection().cursor(cursor_factory=psycopg2.extras.DictCursor)
cur.execute(
"SELECT"
" game_data.game_id AS game_id,"
" num_players,"
" users,"
" user_ids,"
" variant_id,"
" variants.name AS variant_name,"
" seed,"
" score,"
" num_turns,"
" league_id,"
" num_bottom_deck_risks AS num_bdrs,"
" num_crits_lost,"
" coalesce(array_agg(outcome ORDER BY outcome) FILTER (WHERE outcome IS NOT NULL), '{}') AS game_outcomes"
" FROM"
" ("
" SELECT "
" games.id AS game_id,"
" num_players,"
" array_agg(users.player_name ORDER BY users.player_name) AS users,"
" array_agg(users.id ORDER BY users.player_name) AS user_ids,"
" variant_id,"
" seed,"
" score,"
" num_turns,"
" league_id,"
" num_bottom_deck_risks,"
" num_crits_lost "
" FROM games "
" LEFT OUTER JOIN game_statistics "
" ON games.id = game_statistics.game_id "
" LEFT OUTER JOIN game_participants"
" ON games.id = game_participants.game_id "
" LEFT OUTER JOIN users"
" ON game_participants.user_id = users.id "
" GROUP BY ("
" games.id, num_players, variant_id, seed, score, num_turns,"
" league_id, num_bottom_deck_risks, num_crits_lost"
" )"
" ) AS game_data "
"LEFT OUTER JOIN game_outcomes "
" ON game_outcomes.game_id = game_data.game_id "
" LEFT OUTER JOIN variants"
" ON variants.id = game_data.variant_id "
"GROUP BY ("
" game_data.game_id, num_players, users, user_ids, variant_id, variants.name, seed, score, num_turns,"
" league_id, num_bottom_deck_risks, num_crits_lost"
" ) "
"ORDER BY league_id DESC"
)
return [GameRow(**row) for row in cur.fetchall()]
def get_rating_lists() -> Dict[int, List[PlayerEntry]]:
cur = conn_manager.get_connection().cursor()
rating_types = [utils.get_rating_type(x) for x in [False, True]]
@ -270,7 +345,8 @@ def render_leaderboard():
total_players=get_num_players(),
latest_run=datetime.datetime.now().isoformat(),
variant_stats=stats,
variant_name=variant_names[variant_id]
variant_name=variant_names[variant_id],
games=[dataclasses.asdict(game) for game in get_games()]
)
output_file = out_dir / 'variant' / str(variant_id) / 'index.html'
@ -282,5 +358,6 @@ def render_leaderboard():
# Copy CSS to output directory
shutil.copytree('css', 'build/css', dirs_exist_ok=True)
for x in get_games():
print(x)
render_leaderboard()

View file

@ -5,7 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hanabi Pro Hunting League</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
<link rel="stylesheet" href="../../css/leaderboards.css">
<link rel="stylesheet" href="/css/leaderboards.css">
<link href="/css/tabulator.min.css" rel="stylesheet">
<!-- Tabulator JS dependency -->
<script type="text/javascript" src="/js/tabulator.min.js"></script>
</head>
<body>
@ -84,6 +88,25 @@
</li>
</ul>
</div>
<div id="table-{{num_players}}p"></div>
<script>
let tabledata_{{num_players}} = [
{% for game in games %}
{{game}},
{% endfor %}
];
var table = new Tabulator("#table-{{num_players}}p", {
height: 205,
data:tabledata_{{num_players}},
layout:"fitColumns",
columns:[
{title: "Game", field: "game_id", width: 150},
{title: "# Players", field: "num_players", width:200},
{title: "Seed", field: "seed"},
],
});
</script>
</div>
</div>
{% endfor %}
@ -101,6 +124,7 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
$('.nav-link').on('shown.bs.tab', function(e) {