Files
Shape_Model_2D/pm2d/web/static/index.html
T
Adriano 3e4c20ecf5 feat: upload file nella cartella IMAGES_DIR
POST /upload_to_folder: sanitizza nome, valida estensione e contenuto
via cv2.imdecode, auto-rename su collisione.
Toolbar UI: bottone 'Carica file', dopo upload ricarica picker.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-24 14:45:16 +02:00

153 lines
4.8 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="it">
<head>
<meta charset="utf-8" />
<title>Pattern Matching 2D</title>
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
<header>
<h1>Pattern Matching 2D</h1>
<div class="toolbar">
<label class="tb-label">Modello:</label>
<div class="thumb-picker" id="picker-model">
<div class="picker-current" tabindex="0">
<span class="picker-text">-- seleziona --</span>
<span class="caret"></span>
</div>
<div class="picker-list"></div>
</div>
<label class="tb-label">Scena:</label>
<div class="thumb-picker" id="picker-scene">
<div class="picker-current" tabindex="0">
<span class="picker-text">-- seleziona --</span>
<span class="caret"></span>
</div>
<div class="picker-list"></div>
</div>
<button class="btn btn-go" id="btn-match">▶ MATCH</button>
<label class="btn" title="Carica nuovo file nella cartella immagini">
⬆ Carica file
<input type="file" id="file-upload" accept="image/*" hidden>
</label>
<span id="status">Seleziona modello, disegna ROI, seleziona scena</span>
</div>
</header>
<main>
<section class="col" id="col-model">
<h2>MODELLO</h2>
<div class="canvas-wrap">
<canvas id="c-model" width="380" height="420"></canvas>
</div>
<div id="roi-info">ROI: (nessuna)</div>
</section>
<section class="col" id="col-scene">
<h2>SCENA</h2>
<div class="canvas-wrap">
<canvas id="c-scene" width="820" height="620"></canvas>
</div>
</section>
<section class="col" id="col-params">
<h2>IMPOSTAZIONI</h2>
<div class="field">
<label>Tipo modello</label>
<select id="p-tipo">
<option value="intero">Oggetto intero</option>
<option value="parziale">Parte di oggetto</option>
</select>
</div>
<div class="field">
<label>Simmetria</label>
<select id="p-simmetria">
<option value="invariante">Invariante (cerchi — no rotazione)</option>
<option value="nessuna">Nessuna (0..360°)</option>
<option value="bilaterale">Bilaterale (speculare 180°)</option>
<option value="rot_3">Rotazionale 3× (120°)</option>
<option value="rot_4">Rotazionale 4× (90°)</option>
<option value="rot_6">Rotazionale 6× (60°)</option>
<option value="rot_8">Rotazionale 8× (45°)</option>
</select>
</div>
<div class="field">
<label>Variazione scala</label>
<select id="p-scala">
<option value="fissa">Fissa (setup calibrato)</option>
<option value="mini">±10%</option>
<option value="medio">±25%</option>
<option value="max">±50%</option>
</select>
</div>
<div class="field">
<label>Precisione angolare</label>
<select id="p-precisione">
<option value="veloce">Veloce (10°)</option>
<option value="normale" selected>Normale (5°)</option>
<option value="preciso">Preciso (2°)</option>
</select>
</div>
<div class="field">
<label>Filtro falsi positivi
<span class="hint">(verifica intensità colori)</span>
</label>
<select id="p-filtro-fp">
<option value="off">Disattivato (massimo recall)</option>
<option value="leggero">Leggero (tollera illuminazione)</option>
<option value="medio" selected>Medio (consigliato)</option>
<option value="forte">Forte (massima selettività)</option>
</select>
</div>
<div class="field">
<label>Peso dimensione nel score
<span class="hint">(penalizza scala ≠ 1.0)</span>
</label>
<select id="p-penalita-scala">
<option value="0" selected>Nessuno (score shape puro)</option>
<option value="0.3">Leggero (30% max)</option>
<option value="0.5">Medio (50% max)</option>
<option value="0.8">Forte (80% max)</option>
</select>
</div>
<div class="field">
<label>Score minimo <span id="v-score">0.65</span>
<span class="hint">(più basso = più match anche incerti)</span>
</label>
<input type="range" id="p-min-score" min="0.30" max="0.95" step="0.05" value="0.65">
</div>
<div class="field">
<label>Max match</label>
<input type="number" id="p-max-matches" value="25" min="1" max="200">
</div>
<details>
<summary>Avanzate</summary>
<div id="adv-form"></div>
</details>
<h2 style="margin-top:14px">TEMPI</h2>
<div class="kv"><span>train:</span><span id="t-train">-</span></div>
<div class="kv"><span>find:</span><span id="t-find">-</span></div>
<div class="kv"><span>varianti:</span><span id="t-var">-</span></div>
<div class="kv"><span>match:</span><span id="t-match">-</span></div>
</section>
</main>
<footer>
<h2>LEGENDA</h2>
<div id="legend"></div>
</footer>
<script src="/static/app.js"></script>
</body>
</html>