first draft of tabulator tables

src/render_site.py

@@ -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()

templates/variant.html

@@ -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) {