From aeb74f4183fc71986b05ed5859ddc3ceea4f9337 Mon Sep 17 00:00:00 2001
From: Paolo Brasolin <paolo.brasolin@eurac.edu>
Date: Wed, 30 Mar 2022 15:14:32 +0200
Subject: [PATCH] feat: #be quick stats for dashboard
---
backend/src/index.ts | 8 ++++++++
backend/templates/dashboard.ejs | 36 +++++++++++++++++++++++++++++++++
2 files changed, 44 insertions(+)
diff --git a/backend/src/index.ts b/backend/src/index.ts
index 9253cb7..298ace7 100644
--- a/backend/src/index.ts
+++ b/backend/src/index.ts
@@ -58,6 +58,11 @@ import { connection } from "./db";
server.get("/", async (request, reply) => {
// reply.code(200).send("Hello, World!");
+
+ const gamesCount = (await connection.table("games").count())[0].count;
+ const cluesCount = (await connection.table("clues").count())[0].count;
+ const shotsCount = (await connection.table("shots").count())[0].count;
+
const gamesByDate = await connection
.table("games")
.select(
@@ -76,6 +81,9 @@ server.get("/", async (request, reply) => {
.orderBy("bucket");
reply.view("/templates/dashboard.ejs", {
+ gamesCount,
+ cluesCount,
+ shotsCount,
gamesByDate,
shotsByDuration,
});
diff --git a/backend/templates/dashboard.ejs b/backend/templates/dashboard.ejs
index 9cadcd8..8d2c5b8 100644
--- a/backend/templates/dashboard.ejs
+++ b/backend/templates/dashboard.ejs
@@ -32,9 +32,45 @@
<div class="container-fluid">
<div class="row">
<main class="col-lg-8 col-md-10 mx-auto p-md-4">
+
+ <h1>Quick facts</h1>
+ <div class="row">
+ <div class="col-sm-4">
+ <div class="card text-dark bg-light m-2">
+ <div class="card-body">
+ <h5 class="card-title">
+ <%= gamesCount %>
+ </h5>
+ <h6 class="card-subtitle mb-2 text-muted">Games played</h6>
+ </div>
+ </div>
+ </div>
+ <div class="col-sm-4">
+ <div class="card text-dark bg-light m-2">
+ <div class="card-body">
+ <h5 class="card-title">
+ <%= cluesCount %>
+ </h5>
+ <h6 class="card-subtitle mb-2 text-muted">Clues shown</h6>
+ </div>
+ </div>
+ </div>
+ <div class="col-sm-4">
+ <div class="card text-dark bg-light m-2">
+ <div class="card-body">
+ <h5 class="card-title">
+ <%= shotsCount %>
+ </h5>
+ <h6 class="card-subtitle mb-2 text-muted">Shots taken</h6>
+ </div>
+ </div>
+ </div>
+ </div>
+
<h1>Game count by date</h1>
<script id="gamesByDateData" type="application/json"><%- JSON.stringify(gamesByDate) %></script>
<canvas id="gamesByDateChart"></canvas>
+
<h1>Shot count by duration [ms]</h1>
<script id="shotsByDurationData" type="application/json"><%- JSON.stringify(shotsByDuration) %></script>
<canvas id="shotsByDurationChart"></canvas>
--
GitLab