added list (home) and details pages

Cargo.toml

@@ -1,5 +1,5 @@
 [package]
-name = "quick-rust-website"
+name = "slimes-website"
 version = "0.1.1"
 edition = "2024"
 
@@ -16,3 +16,4 @@ lazy_static = "1.5"
 tower_governor = "0.8.0"
 serde = { version = "1.0.228", features = ["derive"] }
 chrono = { version = "0.4.44", features = ["serde"] }
+reqwest = { version = "0.13.2", features = ["json"] }

flake.nix

@@ -1,5 +1,5 @@
 {
-    description = "Quick rust website template";
+    description = "Slimes API Website";
 
     inputs = {
         nixpkgs.url = "github:NixOS/nixpkgs/nixos-unstable";
@@ -24,7 +24,7 @@
                 in
                 {
                     default = pkgs.rustPlatform.buildRustPackage {
-                        pname = "quick-rust-website";
+                        pname = "slimes-website";
                         version = "0.1.0";
 
                         src = ./.;
@@ -76,32 +76,32 @@
                     ...
                 }:
                 let
-                    cfg = config.services.quick-rust-website;
+                    cfg = config.services.slimes-website;
                 in
                 {
-                    options.services.quick-rust-website = {
+                    options.services.slimes-website = {
-                        enable = lib.mkEnableOption "Quick rust website template";
+                        enable = lib.mkEnableOption "Slimes API Website";
                         port = lib.mkOption {
                             type = lib.types.port;
                             default = 9003;
                         };
                         # databasePath = lib.mkOption {
                         #   type = lib.types.str;
-                        #   default = "/var/lib/quick-rust-website/database.db";
+                        #   default = "/var/lib/slimes-website/database.db";
                         # };
                     };
 
                     config = lib.mkIf cfg.enable {
-                        systemd.services.quick-rust-website = {
+                        systemd.services.slimes-website = {
-                            description = "Quick rust website template";
+                            description = "Slimes API Website";
                             after = [ "network.target" ];
                             wantedBy = [ "multi-user.target" ];
                             serviceConfig = {
                                 ExecStart = "${
                                     self.packages.${pkgs.system}.default
-                                }/bin/quick-rust-website --port ${toString cfg.port} --host";
+                                }/bin/slimes-website --port ${toString cfg.port} --host";
                                 Restart = "on-failure";
-                                StateDirectory = "quick-rust-website";
+                                StateDirectory = "slimes-website";
                                 DynamicUser = true;
                                 ProtectSystem = "strict";
                                 ProtectHome = true;

src/handlers.rs

@@ -1,55 +1,151 @@
-use std::sync::Arc;
-
 use axum::{
-    extract::State,
+    extract::{Path, State},
     response::{Html, IntoResponse},
 };
-use serde::Serialize;
+use chrono::{DateTime, Utc};
+use reqwest::StatusCode;
+use serde::{Deserialize, Serialize};
+use std::{collections::HashMap, sync::Arc};
 use tera::Context;
 
 use crate::{AppState, TEMPLATES};
 
-/// Handler for the Home Page
+#[derive(Debug, Serialize, Deserialize)]
-pub async fn home_handler(State(state): State<Arc<AppState>>) -> impl IntoResponse {
+pub struct Report {
+    pub id: u64,
+    pub mac_address: String,
+    pub timestamp: String,
+    pub slimes: HashMap<String, Vec<String>>,
+    pub benchmark: Benchmark,
+    pub client_version: String,
+    pub signature: String,
+}
+
+#[derive(serde::Serialize)]
+pub struct ReportRow {
+    pub id: u64,
+    pub score: u64,
+    pub cores: u32,
+    pub ram: String,
+    pub os: String,
+    pub hostname: String,
+    pub time_ago: String,
+    pub signature: String,
+}
+
+#[derive(Debug, Serialize, Deserialize)]
+pub struct Benchmark {
+    pub logical_cores: u32,
+    pub multi_thread: ScoreDetail,
+    pub single_thread: ScoreDetail,
+}
+
+#[derive(Debug, Serialize, Deserialize)]
+pub struct ScoreDetail {
+    pub score: u64,
+}
+
+fn format_time_ago(timestamp: &str) -> String {
+    let Ok(ts) = DateTime::parse_from_rfc3339(timestamp) else {
+        return "unknown".into();
+    };
+    let now = Utc::now();
+    let diff = now.signed_duration_since(ts.with_timezone(&Utc));
+
+    if diff.num_days() > 0 {
+        format!("{}d ago", diff.num_days())
+    } else if diff.num_hours() > 0 {
+        format!("{}h ago", diff.num_hours())
+    } else if diff.num_minutes() > 0 {
+        format!("{}min ago", diff.num_minutes())
+    } else {
+        "just now".into()
+    }
+}
+
+fn parse_total_ram(ram_str: &str) -> String {
+    let total_part = ram_str.split('/').last().unwrap_or("").trim();
+    let digits: String = total_part.chars().filter(|c| c.is_ascii_digit()).collect();
+    if let Ok(mb) = digits.parse::<f32>() {
+        format!("{}GB", (mb / 1024.0).round())
+    } else {
+        "Unknown".into()
+    }
+}
+
+pub async fn home_handler(
+    State(state): State<Arc<AppState>>,
+) -> Result<impl IntoResponse, (StatusCode, String)> {
+    let response = reqwest::get("https://alatreon.org/slimes?limit=1000")
+        .await
+        .map_err(|e| (StatusCode::INTERNAL_SERVER_ERROR, e.to_string()))?;
+
+    let raw_reports = response.json::<Vec<Report>>().await.map_err(|e| {
+        (
+            StatusCode::INTERNAL_SERVER_ERROR,
+            format!("JSON Error: {}", e),
+        )
+    })?;
+
+    let reports: Vec<ReportRow> = raw_reports
+        .into_iter()
+        .map(|s| ReportRow {
+            id: s.id,
+            score: s.benchmark.multi_thread.score,
+            cores: s.benchmark.logical_cores,
+            ram: s
+                .slimes
+                .get("RAM")
+                .and_then(|v| v.first())
+                .map(|r| parse_total_ram(r))
+                .unwrap_or_else(|| "-".into()),
+            os: s
+                .slimes
+                .get("OS")
+                .and_then(|v| v.first())
+                .cloned()
+                .unwrap_or_else(|| "Unknown".into()),
+            hostname: s
+                .slimes
+                .get("Hostname")
+                .and_then(|v| v.first())
+                .cloned()
+                .unwrap_or_else(|| "-".into()),
+            time_ago: format_time_ago(&s.timestamp),
+            signature: s.signature,
+        })
+        .collect();
+
     let mut context = Context::new();
+    context.insert("reports", &reports);
     context.insert("title", &state.app_name);
-    context.insert("server_time", &chrono::Local::now().to_rfc2822());
 
     match TEMPLATES.render("index.html", &context) {
-        Ok(html) => Html(html).into_response(),
+        Ok(html) => Ok(Html(html)),
-        Err(e) => (axum::http::StatusCode::INTERNAL_SERVER_ERROR, e.to_string()).into_response(),
+        Err(e) => Err((StatusCode::INTERNAL_SERVER_ERROR, e.to_string())),
     }
 }
 
-/// Handler for the Showcase Page
+pub async fn report_details_handler(
-pub async fn showcase_handler() -> impl IntoResponse {
+    State(state): State<Arc<AppState>>,
-    #[derive(Serialize)]
+    Path(id): Path<u64>,
-    struct ShowcaseItem {
+) -> Result<impl IntoResponse, (StatusCode, String)> {
-        name: String,
+    let url = format!("https://alatreon.org/slimes/{}", id);
-        description: String,
+
-    }
+    let report = reqwest::get(url)
+        .await
+        .map_err(|e| (StatusCode::INTERNAL_SERVER_ERROR, e.to_string()))?
+        .json::<Report>()
+        .await
+        .map_err(|e| (StatusCode::NOT_FOUND, format!("Report not found: {}", e)))?;
 
     let mut context = Context::new();
-    context.insert("title", "Showcase");
+    context.insert("report", &report);
+    context.insert("title", &format!("Report #{} | {}", id, state.app_name));
+    context.insert("time_ago", &format_time_ago(&report.timestamp));
 
-    let items = vec![
+    match TEMPLATES.render("details.html", &context) {
-        ShowcaseItem {
+        Ok(html) => Ok(Html(html)),
-            name: "Project Alpha".into(),
+        Err(e) => Err((StatusCode::INTERNAL_SERVER_ERROR, e.to_string())),
-            description: "A cool Rust project".into(),
-        },
-        ShowcaseItem {
-            name: "Project Beta".into(),
-            description: "An Axum powered API".into(),
-        },
-        ShowcaseItem {
-            name: "Project Gamma".into(),
-            description: "Tera template engine".into(),
-        },
-    ];
-    context.insert("items", &items);
-
-    match TEMPLATES.render("showcase.html", &context) {
-        Ok(html) => Html(html).into_response(),
-        Err(e) => (axum::http::StatusCode::INTERNAL_SERVER_ERROR, e.to_string()).into_response(),
     }
 }

src/main.rs

@@ -5,7 +5,9 @@ use std::sync::Arc;
 use tera::Tera;
 
 mod handlers;
-use handlers::{home_handler, showcase_handler};
+use handlers::home_handler;
+
+use crate::handlers::report_details_handler;
 
 lazy_static! {
     pub static ref TEMPLATES: Tera = {
@@ -14,7 +16,7 @@ lazy_static! {
             ("_layout.html", include_str!("../templates/_layout.html")),
             ("_base.css", include_str!("../templates/_base.css")),
             ("index.html", include_str!("../templates/homepage.html")),
-            ("showcase.html", include_str!("../templates/showcase.html")),
+            ("details.html", include_str!("../templates/details.html")),
         ])
         .unwrap();
         tera
@@ -29,7 +31,7 @@ pub struct Cli {
     port: String,
 
     /// Whether to listen on 0.0.0.0
-    #[arg(short, long)]
+    #[arg(long)]
     host: bool,
 
     /// Verbose mode
@@ -55,7 +57,7 @@ async fn main() -> anyhow::Result<()> {
 
     let app = Router::new()
         .route("/", get(home_handler))
-        .route("/showcase", get(showcase_handler))
+        .route("/report/{id}", get(report_details_handler))
         .with_state(shared_state);
 
     let addr = if cli.host {

templates/_base.css

@@ -2,59 +2,160 @@
     box-sizing: border-box;
 }
 
-html {
+:root {
-    font-size: 15px;
+    --primary-color: #d946ef;
+    --primary-soft: #fdf2f8;
+    --primary-border: #fce7f3;
+    --primary-text: #86198f;
+
+    --bg-main: #faf5ff;
+    --bg-card: #ffffff;
+    --bg-header: #f5f3ff;
+
+    --border-color: #f3e8ff;
+    --hover-color: #fdf2f8;
+
+    --text-dark: #2e1065;
+    --text-muted: #7e6c88;
+    --text-secondary: #4a3a54;
+}
+
+html, body {
+    margin: 0;
+    padding: 0;
+    background-color: var(--bg-main);
+    color: var(--text-dark);
+    font-family: "Inter", system-ui, -apple-system, sans-serif;
+    line-height: 1.5;
 }
 
 body {
-    font-family:
+    min-height: 100vh;
-        "Inter",
-        system-ui,
-        -apple-system,
-        Roboto,
-        "Segoe UI",
-        Arial,
-        sans-serif;
-    padding: 20px;
-    margin: 0;
     display: flex;
     flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    background-color: #fff;
-    overflow-x: hidden;
-    height: 100vh;
-}
-
-h2 {
-    font-size: 1.8rem;
-    margin-bottom: 15px;
-}
-
-nav {
-    padding: 1rem;
-}
-
-nav a {
-    margin-right: 15px;
-    text-decoration: none;
 }
 
 main {
-    padding: 2rem;
+    width: 100%;
-    flex: 1;
+    max-width: 1200px;
-    max-width: 800px;
     margin: 0 auto;
+    padding: 1rem;
+    flex: 1;
+}
+
+h2 {
+    text-align: center;
+    margin: 2rem 0;
+}
+
+table {
+    width: 100%;
+    border-collapse: collapse;
+    background: var(--bg-card);
+    border-radius: 12px;
+    overflow: hidden;
+    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
+}
+
+th {
+    background: var(--bg-header);
+    padding: 12px 15px;
+    text-align: left;
+    font-size: 0.85rem;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    color: var(--text-muted);
+    border-bottom: 2px solid var(--border-color);
+}
+
+td {
+    padding: 12px 15px;
+    border-bottom: 1px solid var(--border-color);
+    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+    font-size: 0.9rem;
+}
+
+tr:last-child td {
+    border-bottom: none;
+}
+
+tr:hover {
+    background-color: var(--hover-color);
+}
+
+.score-cell {
+    color: var(--primary-color);
+    font-weight: 700;
+}
+
+.signature-cell {
+    color: var(--text-muted);
+    font-style: italic;
+    font-size: 0.8rem;
+    max-width: 200px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 }
 
 footer {
-    padding: 1rem;
+    padding: 2rem;
     text-align: center;
+    color: var(--text-muted);
+    font-size: 0.9rem;
 }
 
-.card {
+@media (max-width: 768px) {
-    border: 1px solid #ddd;
+    main {
-    padding: 10px;
+        padding: 0.5rem;
-    border-radius: 8px;
+    }
-    margin-top: 10px;
+
+    table thead {
+        display: none;
+    }
+
+    table, table tbody, table tr, table td {
+        display: block;
+        width: 100%;
+    }
+
+    table {
+        background: transparent;
+        box-shadow: none;
+    }
+
+    table tr {
+        background: var(--bg-card);
+        margin-bottom: 1rem;
+        border-radius: 12px;
+        padding: 1rem;
+        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
+        border: 1px solid var(--border-color);
+    }
+
+    table td {
+        text-align: right;
+        padding: 8px 0;
+        border-bottom: 1px solid var(--bg-header);
+        position: relative;
+    }
+
+    table td:last-child {
+        border-bottom: none;
+    }
+
+    table td::before {
+        content: attr(data-label);
+        position: absolute;
+        left: 0;
+        font-weight: 600;
+        text-transform: uppercase;
+        font-size: 0.75rem;
+        color: var(--text-muted);
+        font-family: "Inter", sans-serif;
+    }
+
+    .signature-cell {
+        max-width: 100%;
+    }
 }

templates/_layout.html

@@ -1,20 +1,17 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
 <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>{{ title }}</title>
-    <link rel="stylesheet" href="_base.css">
     <style>
         {% include "_base.css" %}
     </style>
 </head>
 <body>
-    <nav>
-        <a href="/">Home</a>
-        <a href="/showcase">Showcase</a>
-    </nav>
     <main>
         {% block content %}{% endblock %}
     </main>
-    <footer>Quick rust website template</footer>
+    <footer>{{ now() | date(format="%Y") }} - Slimes</footer>
 </body>
 </html>

templates/details.html

@@ -0,0 +1,258 @@
+{% extends "_layout.html" %}
+
+{% block content %}
+<div class="back-nav">
+    <a href="/">&larr; Back to Leaderboard</a>
+</div>
+
+<div class="report-card">
+    <div class="report-header">
+        <div class="header-main">
+            <h1 class="hostname-title">
+                {% if report.slimes["Hostname"] %}
+                    {{ report.slimes["Hostname"].0 }}
+                {% else %}
+                    Device {{ report.signature | truncate(length=10) }}
+                {% endif %}
+            </h1>
+
+            <p class="report-signature">{% if report.signature %}"{{ report.signature }}"{% endif %}</p>
+
+            <div class="meta-container">
+                <div class="meta-group system-context">
+                    <div class="meta-item">
+                        <span class="label">ID</span>
+                        <span class="value">#{{ report.id }}</span>
+                    </div>
+                    <div class="meta-item">
+                        <span class="label">VERSION</span>
+                        <span class="value">v{{ report.client_version }}</span>
+                    </div>
+                </div>
+
+                <div class="meta-group hardware-context">
+                    <div class="meta-item">
+                        <span class="label">MAC</span>
+                        <span class="value">{{ report.mac_address }}</span>
+                    </div>
+                    <div class="meta-item">
+                        <span class="label">REPORTED</span>
+                        <span class="value">{{ time_ago }}</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="score-container">
+            <div class="score-value">{{ report.benchmark.multi_thread.score }}</div>
+            <div class="score-label">Multi-Thread Score</div>
+        </div>
+    </div>
+
+    <div class="report-grid">
+        <div class="info-section">
+            <h3>Performance Breakdown</h3>
+            <div class="bench-stats">
+                <div class="stat-row">
+                    <span>Single-Thread</span>
+                    <strong>{{ report.benchmark.single_thread.score }}</strong>
+                </div>
+                <div class="stat-row">
+                    <span>Multi-Thread</span>
+                    <strong>{{ report.benchmark.multi_thread.score }}</strong>
+                </div>
+                <div class="stat-row">
+                    <span>Threads</span>
+                    <strong>{{ report.benchmark.logical_cores }}</strong>
+                </div>
+            </div>
+        </div>
+
+        {% for key, list in report.slimes %}
+            {% if key != "Hostname" %}
+            <div class="info-section">
+                <h3>{{ key }}</h3>
+                <ul class="info-list">
+                    {% for item in list %}
+                    <li>{{ item }}</li>
+                    {% endfor %}
+                </ul>
+            </div>
+            {% endif %}
+        {% endfor %}
+    </div>
+</div>
+
+<style>
+.back-nav { margin-bottom: 1.5rem; }
+.back-nav a { color: var(--primary-color); text-decoration: none; font-weight: 500; }
+
+.report-card {
+    background: var(--bg-card);
+    border-radius: 12px;
+    padding: 2.5rem;
+    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
+    border: 1px solid var(--border-color);
+}
+
+.report-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start;
+    margin-bottom: 2.5rem;
+    padding-bottom: 2rem;
+    border-bottom: 1px solid var(--border-color);
+    gap: 1.5rem;
+}
+
+.hostname-title {
+    margin: 0;
+    font-size: 2.2rem;
+    color: var(--text-dark);
+    letter-spacing: -0.02em;
+    line-height: 1.1;
+}
+
+.report-signature {
+    margin: 0.2rem 0 1.5rem 0;
+    font-style: italic;
+    color: var(--text-muted);
+    opacity: 0.7;
+    font-size: 1.1rem;
+    word-break: break-word;
+}
+
+.meta-container {
+    display: flex;
+    gap: 0.75rem;
+    flex-wrap: wrap;
+}
+
+.meta-group {
+    display: flex;
+    gap: 1.25rem;
+    padding: 0.6rem 1rem;
+    border-radius: 8px;
+    font-size: 0.85rem;
+}
+
+.system-context { 
+    background: var(--primary-soft); 
+    border: 1px solid var(--primary-border); 
+    color: var(--primary-text); 
+}
+.hardware-context { 
+    background: var(--bg-main); 
+    border: 1px solid var(--border-color); 
+    color: var(--text-secondary); 
+}
+
+.meta-item { display: flex; flex-direction: column; }
+.meta-item .label {
+    font-size: 0.65rem;
+    font-weight: 700;
+    text-transform: uppercase;
+    opacity: 0.6;
+    letter-spacing: 0.05em;
+}
+.meta-item .value { font-family: ui-monospace, monospace; font-weight: 600; white-space: nowrap; }
+
+.score-container { text-align: right; flex-shrink: 0; }
+.score-value {
+    font-size: 2.5rem;
+    font-weight: 900;
+    color: var(--primary-color);
+    line-height: 1;
+}
+.score-label {
+    font-size: 0.7rem;
+    text-transform: uppercase;
+    color: var(--text-muted);
+    letter-spacing: 0.1em;
+}
+
+.report-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+    gap: 1.5rem;
+}
+
+.info-section {
+    background: var(--bg-card);
+    padding: 1.25rem;
+    border-radius: 8px;
+    border: 1px solid var(--border-color);
+}
+
+.info-section h3 {
+    margin: 0 0 1rem 0;
+    font-size: 0.75rem;
+    text-transform: uppercase;
+    color: var(--text-muted);
+    border-bottom: 1px solid var(--border-color);
+    padding-bottom: 0.5rem;
+}
+
+.info-list { list-style: none; padding: 0; margin: 0; font-family: ui-monospace, monospace; font-size: 0.85rem; }
+.info-list li { 
+    margin-bottom: 0.5rem;
+    padding-left: 1rem;
+    position: relative;
+    word-break: break-word;
+}
+.info-list li::before { content: "›"; position: absolute; left: 0; color: var(--primary-color); font-weight: bold; }
+
+.bench-stats { display: flex; flex-direction: column; gap: 0.6rem; }
+.stat-row { display: flex; justify-content: space-between; font-size: 0.9rem; }
+
+@media (max-width: 640px) {
+    .report-card {
+        padding: 1.25rem;
+        border-radius: 0;
+        border-left: none;
+        border-right: none;
+    }
+
+    .report-header {
+        flex-direction: column;
+        align-items: flex-start;
+        margin-bottom: 1.5rem;
+        padding-bottom: 1.5rem;
+        gap: 1.5rem;
+    }
+
+    .hostname-title {
+        font-size: 1.75rem;
+    }
+
+    .score-container {
+        text-align: left;
+        width: 100%;
+        padding: 1rem;
+        background: var(--primary-soft);
+        border-radius: 8px;
+        box-sizing: border-box;
+    }
+
+    .score-value {
+        font-size: 2.0rem;
+    }
+
+    .meta-container {
+        flex-direction: column;
+        gap: 0.5rem;
+    }
+
+    .meta-group {
+        width: 100%;
+        box-sizing: border-box;
+        justify-content: flex-start;
+    }
+
+    .report-grid {
+        grid-template-columns: 1fr;
+        gap: 1rem;
+    }
+}
+</style>
+{% endblock %}

templates/homepage.html

@@ -1,6 +1,49 @@
 {% extends "_layout.html" %}
+
 {% block content %}
-    <h1>Welcome to the Home Page</h1>
+<h2>Benchmark Reports</h2>
-    <p>This is a starter website built with Axum and Tera.</p>
+<table>
-    <p>The time on the server is: <strong>{{ server_time }}</strong></p>
+    <thead>
+        <tr>
+            <th>MT Score</th>
+            <th>Threads</th>
+            <th>RAM</th>
+            <th>OS</th>
+            <th>Hostname</th>
+            <th>Time</th>
+            <th>Note</th>
+        </tr>
+    </thead>
+    <tbody>
+        {% for report in reports %}
+        <tr class="clickable-row" onclick="window.location='/report/{{ report.id }}';">
+            <td data-label="MT Score" class="score-cell">
+                <a href="/report/{{ report.id }}">{{ report.score }}</a>
+            </td>
+            <td data-label="Threads">{{ report.cores }}</td>
+            <td data-label="RAM">{{ report.ram }}</td>
+            <td data-label="OS">{{ report.os | truncate(length=30) }}</td>
+            <td data-label="Hostname">{{ report.hostname }}</td>
+            <td data-label="Time">{{ report.time_ago }}</td>
+            <td data-label="Note" class="signature-cell">{{ report.signature }}</td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+
+<style>
+.clickable-row {
+    cursor: pointer;
+    transition: background-color 0.2s;
+}
+
+.clickable-row:hover {
+    background-color: var(--hover-color);
+}
+
+.clickable-row a {
+    text-decoration: none;
+    color: inherit;
+}
+</style>
 {% endblock %}

templates/showcase.html

@@ -1,12 +0,0 @@
-{% extends "_layout.html" %}
-{% block content %}
-    <h1>Project Showcase</h1>
-    <p>Here are some items passed from Rust to the template:</p>
-
-    {% for item in items %}
-    <div class="card">
-        <h3>{{ item.name }}</h3>
-        <p>{{ item.description }}</p>
-    </div>
-    {% endfor %}
-{% endblock %}