added i18n but not using it yet

This commit is contained in:
2026-05-07 21:12:31 +02:00
parent 4e450430f6
commit d8e67d8ef0
10 changed files with 541 additions and 75 deletions

View File

@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html lang="{{ fluent(key='lang', lang=lang) }}">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -15,8 +15,8 @@
<div class="nav-left">
<span class="nav-logo">Slimes 🧪</span>
<div class="nav-links">
<a href="{{ prefix }}./" class="{% if current_page == 'leaderboard' %}active{% endif %}">Leaderboard</a>
<a href="{{ prefix }}analytics" class="{% if current_page == 'analytics' %}active{% endif %}">Analytics</a>
<a href="{{ prefix }}./" class="{% if current_page == 'leaderboard' %}active{% endif %}">{{ fluent(key="nav-leaderboard", lang=lang) }}</a>
<a href="{{ prefix }}analytics" class="{% if current_page == 'analytics' %}active{% endif %}">{{ fluent(key="nav-analytics", lang=lang) }}</a>
</div>
</div>
@@ -27,21 +27,31 @@
<i class="fa-solid fa-chevron-down chevron"></i>
</button>
<div class="dropdown-menu">
<div class="dropdown-header">Source Code</div>
<div class="dropdown-header">{{ fluent(key="nav-source-header", lang=lang) }}</div>
<a href="https://git.alatreon.org/strawberries/slimes" target="_blank" rel="noopener">
<span class="link-title"><i class="fa-solid fa-terminal fa-fw"></i> CLI + Server</span>
<span class="link-desc">Core lib, CLI and API monorepo</span>
<span class="link-title"><i class="fa-solid fa-terminal fa-fw"></i> {{ fluent(key="nav-cli-title", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="nav-cli-desc", lang=lang) }}</span>
</a>
<a href="https://git.alatreon.org/strawberries/slimes-website" target="_blank" rel="noopener">
<span class="link-title"><i class="fa-solid fa-globe fa-fw"></i> Website</span>
<span class="link-desc">This very website</span>
<span class="link-title"><i class="fa-solid fa-globe fa-fw"></i> {{ fluent(key="nav-web-title", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="nav-web-desc", lang=lang) }}</span>
</a>
<a href="https://git.alatreon.org/strawberries/slimes-gui" target="_blank" rel="noopener">
<span class="link-title"><i class="fa-solid fa-window-restore fa-fw"></i> GUI Version</span>
<span class="link-desc">Experimental Cross-platform GUI</span>
<span class="link-title"><i class="fa-solid fa-window-restore fa-fw"></i> {{ fluent(key="nav-gui-title", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="nav-gui-desc", lang=lang) }}</span>
</a>
</div>
</div>
<!-- <div class="dropdown"> -->
<!-- <button class="dropdown-trigger"> -->
<!-- <i class="fa-solid fa-language"></i> {{ lang | truncate(length=2, end="") | upper }} -->
<!-- </button> -->
<!-- <div class="dropdown-menu"> -->
<!-- <a href="/set-lang/en-US">English</a> -->
<!-- <a href="/set-lang/fr-FR">Français</a> -->
<!-- </div> -->
<!-- </div> -->
</div>
</div>
</nav>
@@ -49,7 +59,7 @@
<main>
{% block content %}{% endblock %}
</main>
<footer>{{ now() | date(format="%Y") }} - Slimes</footer>
<footer>{{ now() | date(format="%Y") }} - {{ fluent(key="footer-text", lang=lang) }}</footer>
<script>
function toggleDropdown(event) {

View File

@@ -2,8 +2,8 @@
{% macro chart_card(id, title) %}
<div class="chart-card">
<button class="expand-btn" onclick="openFullView('{{ id }}', '{{ title }}')">
<i class="fa-solid fa-expand"></i> Full View
<button class="expand-btn" onclick="openFullView(`{{ id }}`, `{{ title }}`)">
<i class="fa-solid fa-expand"></i> {{ fluent(key="analytics-full-view", lang=lang) }}
</button>
<h3>{{ title }}</h3>
<canvas id="{{ id }}"></canvas>
@@ -12,8 +12,8 @@
{% block content %}
<div class="header-section">
<h2>Benchmark Analytics</h2>
<p style="text-align: center; color: var(--text-muted);">Insights from {{ data.total_reports }} benchmarks</p>
<h2>{{ fluent(key="analytics-title", lang=lang) }}</h2>
<p style="text-align: center; color: var(--text-muted);">{{ fluent(key="analytics-insights", lang=lang, count=data.total_reports) }}</p>
</div>
<div id="chartModal" class="modal">
@@ -34,21 +34,21 @@
<div class="analytics-grid">
<div class="fact-card">
<span class="fact-title">RAM Efficiency</span>
<span class="fact-title">{{ fluent(key="analytics-ram-eff", lang=lang) }}</span>
<span class="fact-value">{{ data.avg_score_per_gb | round(precision=1) }}</span>
<span class="fact-label">Avg Score per GB RAM</span>
<span class="fact-label">{{ fluent(key="analytics-ram-eff-desc", lang=lang) }}</span>
</div>
<div class="fact-card">
<span class="fact-title">CPU Thread Efficiency</span>
<span class="fact-title">{{ fluent(key="analytics-cpu-eff", lang=lang) }}</span>
<span class="fact-value">{{ data.avg_score_per_thread | round(precision=1) }}</span>
<span class="fact-label">Avg Score per Thread</span>
<span class="fact-label">{{ fluent(key="analytics-cpu-eff-desc", lang=lang) }}</span>
</div>
{{ self::chart_card(id="distChart", title="Score Distribution") }}
{{ self::chart_card(id="osCountChart", title="Reports by Operating System") }}
{{ self::chart_card(id="osChart", title="Avg Score by Operating System") }}
{{ self::chart_card(id="osMaxChart", title="Highest Score by Operating System") }}
{{ self::chart_card(id="osMinChart", title="Lowest Score by Operating System") }}
{{ self::chart_card(id="distChart", title=fluent(key="analytics-chart-dist", lang=lang)) }}
{{ self::chart_card(id="osCountChart", title=fluent(key="analytics-chart-os-count", lang=lang)) }}
{{ self::chart_card(id="osChart", title=fluent(key="analytics-chart-os-avg", lang=lang)) }}
{{ self::chart_card(id="osMaxChart", title=fluent(key="analytics-chart-os-max", lang=lang)) }}
{{ self::chart_card(id="osMinChart", title=fluent(key="analytics-chart-os-min", lang=lang)) }}
</div>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
@@ -244,6 +244,10 @@
z-index: 10;
}
.expand-btn i {
margin-right: 5px;
}
.expand-btn:hover {
background: var(--primary-soft);
}

View File

@@ -2,7 +2,7 @@
{% block content %}
<div class="back-nav">
<a href="../">&larr; Back to Leaderboard</a>
<a href="../">&larr; {{ fluent(key="details-back", lang=lang) }}</a>
</div>
<div class="report-card">
@@ -12,7 +12,7 @@
{% if report.slimes["Hostname"] %}
{{ report.slimes["Hostname"].0 }}
{% else %}
Device {{ report.signature | truncate(length=10) }}
{{ fluent(key="details-device", lang=lang, sig=report.signature | truncate(length=10)) }}
{% endif %}
</h1>
@@ -21,22 +21,22 @@
<div class="meta-container">
<div class="meta-group system-context">
<div class="meta-item">
<span class="label">ID</span>
<span class="label">{{ fluent(key="details-report-id", lang=lang) }}</span>
<span class="value">#{{ report.id }}</span>
</div>
<div class="meta-item">
<span class="label">VERSION</span>
<span class="label">{{ fluent(key="details-version", lang=lang) }}</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="label">{{ fluent(key="details-mac", lang=lang) }}</span>
<span class="value">{{ report.mac_address }}</span>
</div>
<div class="meta-item">
<span class="label">REPORTED</span>
<span class="label">{{ fluent(key="details-reported", lang=lang) }}</span>
<span class="value">{{ time_ago }}</span>
</div>
</div>
@@ -45,25 +45,25 @@
<div class="score-container">
<div class="score-value">{{ score }}</div>
<div class="score-label">CPU Score</div>
<div class="score-label">{{ fluent(key="details-cpu-score", lang=lang) }}</div>
<div class="score-note">(mt+st)/2</div>
</div>
</div>
<div class="report-grid">
<div class="info-section">
<h3>Performance Breakdown</h3>
<h3>{{ fluent(key="details-perf-breakdown", lang=lang) }}</h3>
<div class="bench-stats">
<div class="stat-row">
<span>Single-Thread</span>
<span>{{ fluent(key="details-single", lang=lang) }}</span>
<strong>{{ report.benchmark.single_thread.score }}</strong>
</div>
<div class="stat-row">
<span>Multi-Thread</span>
<span>{{ fluent(key="details-multi", lang=lang) }}</span>
<strong>{{ report.benchmark.multi_thread.score }}</strong>
</div>
<div class="stat-row">
<span>Threads</span>
<span>{{ fluent(key="details-threads", lang=lang) }}</span>
<strong>{{ report.benchmark.logical_cores }}</strong>
</div>
</div>

View File

@@ -2,64 +2,64 @@
{% block content %}
<div class="header-section">
<h2>Benchmark Reports</h2>
<h2>{{ fluent(key="home-title", lang=lang) }}</h2>
<div class="table-controls">
<form id="sortForm" method="get" action="">
<div class="control-group">
<label class="switch-ui" title="Show Android clients">
<label class="switch-ui" title="{{ fluent(key='home-experimental-tooltip', lang=lang) }}">
<input type="checkbox" name="experimental" value="true"
onchange="this.form.submit()"
{% if show_experimental %}checked{% endif %}>
<span class="slider"></span>
</label>
<span class="switch-text">Experimental</span>
<span class="switch-text">{{ fluent(key="home-experimental", lang=lang) }}</span>
</div>
<input type="hidden" name="sort" id="sortInput" value="{{ current_sort }}">
<input type="hidden" name="order" id="orderInput" value="{{ current_order }}">
<div class="control-group">
<label>Sort by:</label>
<label>{{ fluent(key="home-sort-by", lang=lang) }}</label>
<div class="dropdown" id="sortDropdown">
<button class="dropdown-trigger select-styled" type="button" onclick="toggleSortDropdown(event)">
<span>
{% if current_sort == "score" %}Score
{% elif current_sort == "single" %}Single Thread
{% elif current_sort == "multi" %}Multi Thread
{% elif current_sort == "ram" %}RAM Amount
{% elif current_sort == "threads" %}Thread Count
{% elif current_sort == "time" %}Time Ago
{% if current_sort == "score" %}{{ fluent(key="sort-score", lang=lang) }}
{% elif current_sort == "single" %}{{ fluent(key="sort-single", lang=lang) }}
{% elif current_sort == "multi" %}{{ fluent(key="sort-multi", lang=lang) }}
{% elif current_sort == "ram" %}{{ fluent(key="sort-ram", lang=lang) }}
{% elif current_sort == "threads" %}{{ fluent(key="sort-threads", lang=lang) }}
{% elif current_sort == "time" %}{{ fluent(key="sort-time", lang=lang) }}
{% endif %}
</span>
<i class="fa-solid fa-chevron-down chevron"></i>
</button>
<div class="dropdown-menu">
<div class="dropdown-header">Sort Benchmarks By</div>
<div class="dropdown-header">{{ fluent(key="home-sort-by", lang=lang) }}</div>
<a href="javascript:void(0)" onclick="selectSort('score')">
<span class="link-title"><i class="fa-solid fa-award fa-fw"></i> Score</span>
<span class="link-desc">(Singlethread + Multithread) / 2</span>
<span class="link-title"><i class="fa-solid fa-award fa-fw"></i> {{ fluent(key="sort-score", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="sort-desc-score", lang=lang) }}</span>
</a>
<a href="javascript:void(0)" onclick="selectSort('single')">
<span class="link-title"><i class="fa-solid fa-microchip fa-fw"></i> Singlethread</span>
<span class="link-desc">Single-core efficiency</span>
<span class="link-title"><i class="fa-solid fa-microchip fa-fw"></i> {{ fluent(key="sort-single", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="sort-desc-single", lang=lang) }}</span>
</a>
<a href="javascript:void(0)" onclick="selectSort('multi')">
<span class="link-title"><i class="fa-solid fa-microchip fa-fw"></i> Multithread</span>
<span class="link-desc">Multi-core efficiency</span>
<span class="link-title"><i class="fa-solid fa-microchip fa-fw"></i> {{ fluent(key="sort-multi", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="sort-desc-multi", lang=lang) }}</span>
</a>
<a href="javascript:void(0)" onclick="selectSort('ram')">
<span class="link-title"><i class="fa-solid fa-memory fa-fw"></i> RAM Amount</span>
<span class="link-desc">System memory capacity</span>
<span class="link-title"><i class="fa-solid fa-memory fa-fw"></i> {{ fluent(key="sort-ram", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="sort-desc-ram", lang=lang) }}</span>
</a>
<a href="javascript:void(0)" onclick="selectSort('threads')">
<span class="link-title"><i class="fa-solid fa-microchip fa-fw"></i> Thread Count</span>
<span class="link-desc">Total logical cores</span>
<span class="link-title"><i class="fa-solid fa-microchip fa-fw"></i> {{ fluent(key="sort-threads", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="sort-desc-threads", lang=lang) }}</span>
</a>
<a href="javascript:void(0)" onclick="selectSort('time')">
<span class="link-title"><i class="fa-solid fa-clock fa-fw"></i> Time Ago</span>
<span class="link-desc">Newest reports first</span>
<span class="link-title"><i class="fa-solid fa-clock fa-fw"></i> {{ fluent(key="sort-time", lang=lang) }}</span>
<span class="link-desc">{{ fluent(key="sort-desc-time", lang=lang) }}</span>
</a>
</div>
</div>
@@ -68,7 +68,7 @@
<div class="control-group">
<button type="button" class="order-toggle" onclick="toggleOrder()">
<span>
{% if current_order == "desc" %}Descending{% else %}Ascending{% endif %}
{% if current_order == "desc" %}{{ fluent(key="home-order-desc", lang=lang) }}{% else %}{{ fluent(key="home-order-asc", lang=lang) }}{% endif %}
</span>
<i class="fa-solid {% if current_order == 'desc' %}fa-arrow-down-wide-short{% else %}fa-arrow-up-short-wide{% endif %}"></i>
</button>
@@ -81,13 +81,13 @@
<thead>
<tr>
<th class="rank-header"></th>
<th>CPU Score</th>
<th>Threads</th>
<th>RAM</th>
<th>OS</th>
<th>Hostname</th>
<th>Time</th>
<th>Note</th>
<th>{{ fluent(key="table-cpu-score", lang=lang) }}</th>
<th>{{ fluent(key="table-threads", lang=lang) }}</th>
<th>{{ fluent(key="table-ram", lang=lang) }}</th>
<th>{{ fluent(key="table-os", lang=lang) }}</th>
<th>{{ fluent(key="table-hostname", lang=lang) }}</th>
<th>{{ fluent(key="table-time", lang=lang) }}</th>
<th>{{ fluent(key="table-note", lang=lang) }}</th>
</tr>
</thead>
<tbody>
@@ -114,7 +114,7 @@
<td data-label="Hostname">{{ report.hostname }}</td>
<td data-label="Time">{{ report.time_ago }}
{% if report.is_new %}
<span class="new-badge">NEW</span>
<span class="new-badge">{{ fluent(key="badge-new", lang=lang) }}</span>
{% endif %}
</td>
<td data-label="Note" class="signature-cell">{{ report.signature }}</td>