feat: Add new API endpoints and HTML pages for ML model management

- Implemented HTML pages for datasets, models, training, testing, and results.
- Created API endpoints for managing repositories, results, tests, and training sessions.
- Added functionality for streaming training progress via Server-Sent Events (SSE).
- Introduced a Dockerfile for the ML runner with necessary dependencies.
- Developed an SDK for user code execution within the runner container.
- Enhanced CSS styles for improved UI layout and navigation.
- Established a layout template for consistent HTML structure across pages.
- Added JavaScript for dynamic interactions on the models page.
- Implemented WebSocket handling for real-time communication with kiosk devices and controllers.
- Implemented model registration and management API at /api/models
- Added Gitea proxy API for repository interactions at /api/repos
- Created results API for listing and comparing training results at /api/results
- Developed training management API for enqueueing and retrieving training jobs at /api/trainings
- Introduced SSE endpoint for live training progress updates
- Added HTML pages for models, datasets, and training management
- Created a Dockerfile for the ML runner with necessary dependencies
- Developed SDK for user code execution within the runner container
- Enhanced CSS styles for improved UI/UX
- Implemented WebSocket communication for real-time device and controller interactions in the kiosk system
This commit is contained in:
Giuseppe Raffa
2026-04-28 09:24:38 +02:00
parent ee478e52ef
commit 0ce879aa44
81 changed files with 7491 additions and 746 deletions

View File

@@ -1,89 +1,33 @@
<!DOCTYPE html>
{% extends "_layout.html" %}
{% block title %}Risultati{% endblock %}
{% block content %}
<div class="page-head">
<h2>Risultati training</h2>
<button id="btn-compare" class="prominent">Confronta selezionati</button>
</div>
<html>
<head>
<title>Risultati</title>
<link href="../static/styles/style.css" rel="stylesheet">
<div id="results-list" class="list"></div>
<style>
.container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
}
<section id="compare-panel" class="hidden">
<h3>Confronto</h3>
<div class="charts">
<canvas id="cmp-loss"></canvas>
</div>
<table id="cmp-table"></table>
<div id="cmp-plots"></div>
</section>
.picker {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
}
.picker .header {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
}
</style>
</head>
<body>
<div class="header">
<h1>Risultati</h1>
<div class="profile">
<p>Utente</p>
<button>Logout</button>
</div>
</div>
<div class="container">
<div class="picker">
<div class="header">
<h2>
Seleziona
</h2>
<p>
una sessione di training eseguita per visualizzarne i risultati
</p>
</div>
<div class="grid">
<div class="card">
<h3>sessione 1</h3>
<div class="train-info">
<p>24/03/2026</p>
<p>12:00</p>
<p>dataset: d-1</p>
</div>
</div>
<div class="card">
<h3>sessione 2</h3>
<p>24/03/2026</p>
</div>
</div>
</div>
</div>
</body>
<script>
</script>
</html>
<section id="detail-panel" class="hidden">
<h3>Dettaglio training <code id="dt-id"></code></h3>
<div id="dt-meta"></div>
<div class="charts">
<canvas id="dt-loss"></canvas>
<canvas id="dt-res"></canvas>
</div>
<div id="dt-plots"></div>
</section>
{% endblock %}
{% block scripts %}
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="/static/js/results.js"></script>
{% endblock %}