diff --git a/scripts/calibrazione_pagina.py b/scripts/calibrazione_pagina.py index c964c84..f65b952 100644 --- a/scripts/calibrazione_pagina.py +++ b/scripts/calibrazione_pagina.py @@ -85,13 +85,13 @@ PAGINA = r""" flex: 0 1 auto; padding: 8px 18px; } .tabs button[aria-selected=true] { color: var(--testo); background: var(--pannello); border-bottom-color: var(--accento); font-weight: 600; } /* #91: calibrazione con nome, elenco delle salvate */ - .scorri { overflow-x: auto; margin-top: 8px; } - .elenco { width: 100%; } - .elenco th { text-align: left; font-size: .78rem; font-weight: 600; color: var(--secondario); padding: 2px 12px 4px 0; white-space: nowrap; } - .elenco td { padding: 5px 12px 5px 0; border-top: 1px solid var(--bordo); vertical-align: top; } - .elenco td:first-child { color: var(--testo); } - .elenco .azioni { white-space: nowrap; } - .elenco button { padding: 3px 9px; font-size: .82rem; margin-right: 4px; } + /* #91: elenco a schede, una per calibrazione; nome e risoluzione sempre visibili, niente scorrimento orizzontale */ + .elenco { margin-top: 8px; } + .scheda-cal { border-top: 1px solid var(--bordo); padding: 8px 0; } + .scheda-cal .nome-cal { font-weight: 700; overflow-wrap: anywhere; } + .scheda-cal .dettagli { font-size: .8rem; color: var(--secondario); margin-top: 2px; overflow-wrap: anywhere; } + .scheda-cal .azioni { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; } + .scheda-cal .azioni button { padding: 3px 10px; font-size: .82rem; } .segno { display: inline-block; font-size: .72rem; padding: 0 6px; border-radius: 9px; background: var(--ok); color: #052e16; margin-left: 6px; } .segno.diversa { background: var(--avviso); color: #422006; } .origine label { display: inline-block; margin: 0 14px 4px 0; color: var(--testo); font-size: .92rem; } @@ -227,7 +227,7 @@ PAGINA = r"""

Calibrazioni salvate

-
-
+
@@ -488,6 +488,12 @@ async function caricaParametri() { $("salvaParametriRiga").hidden = true; dire("msgParametri", ""); if (!sorgente) { $("parametri").textContent = "-"; return; } + // #91: subito via il testo della sorgente precedente; la prima apertura della camera puo' durare ~20 s + $("parametri").textContent = ""; + var attesa = document.createElement("div"); + attesa.className = "nota"; + attesa.textContent = "Lettura dei parametri..."; + $("parametri").appendChild(attesa); try { var r = await fetch("/camera/parametri?source=" + encodeURIComponent(sorgente)); if (g !== P.gen) return; @@ -791,13 +797,6 @@ async function caricaCalibrazioni() { } } -function cella(tr, testo) { - var td = document.createElement("td"); - td.textContent = testo; - tr.appendChild(td); - return td; -} - function bottone(testo, classe, fn) { var b = document.createElement("button"); b.textContent = testo; @@ -812,48 +811,51 @@ function disegnaElenco() { t.textContent = ""; C.celle = []; if (!C.elenco.length) { - var trVuota = document.createElement("tr"); - cella(trVuota, "Nessuna calibrazione salvata."); - t.appendChild(trVuota); + var vuota = document.createElement("div"); + vuota.className = "nota"; + vuota.textContent = "Nessuna calibrazione salvata."; + t.appendChild(vuota); return; } - var testa = document.createElement("tr"); - ["Nome", "Risoluzione", "px/mm", "Metodo", "Data", "Origine", ""].forEach(function (h) { - var th = document.createElement("th"); - th.textContent = h; - testa.appendChild(th); - }); - t.appendChild(testa); C.elenco.forEach(function (c) { - var tr = document.createElement("tr"); - var tdNome = cella(tr, c.nome); + var sc = document.createElement("div"); // #91: scheda della calibrazione + sc.className = "scheda-cal"; var attiva = C.attiva !== null && c.nome === C.attiva; + var riga1 = document.createElement("div"); + riga1.className = "nome-cal"; + riga1.appendChild(document.createTextNode(c.nome)); if (attiva) { var s1 = document.createElement("span"); s1.className = "segno"; s1.textContent = "attiva"; - tdNome.appendChild(s1); + riga1.appendChild(s1); } var s2 = document.createElement("span"); // «risoluzione diversa» dal frame della sorgente (si accende in segnaRisoluzioni) s2.className = "segno diversa"; s2.textContent = "risoluzione diversa"; s2.hidden = true; - tdNome.appendChild(s2); + riga1.appendChild(s2); C.celle.push({ w: Number(c.image_width), h: Number(c.image_height), span: s2 }); - cella(tr, c.image_width && c.image_height ? fmt(c.image_width, 0) + "×" + fmt(c.image_height, 0) : "-"); - cella(tr, fmt(c.px_per_mm, 3)); - cella(tr, c.metodo === "densa" ? "densa" : "planare"); - cella(tr, c.calibrated_at ? dataItaliana(c.calibrated_at) : "-"); - cella(tr, descriviOrigine(c.origine)); - var az = document.createElement("td"); + var riga2 = document.createElement("div"); + riga2.className = "dettagli"; + riga2.textContent = [ + c.image_width && c.image_height ? fmt(c.image_width, 0) + "×" + fmt(c.image_height, 0) : "-", + fmt(c.px_per_mm, 3) + " px/mm", + c.metodo === "densa" ? "densa" : "planare", + c.calibrated_at ? dataItaliana(c.calibrated_at) : "-", + descriviOrigine(c.origine) + ].join(" · "); + var az = document.createElement("div"); az.className = "azioni"; var bc = bottone("Carica", "", function () { caricaNome(c.nome); }); bc.disabled = !$("sorgente").value; az.appendChild(bc); if (attiva) az.appendChild(bottone("Scollega", "secondario", scollega)); az.appendChild(bottone("Elimina", "secondario", function (e) { eliminaNome(c.nome, e.currentTarget); })); - tr.appendChild(az); - t.appendChild(tr); + sc.appendChild(riga1); + sc.appendChild(riga2); + sc.appendChild(az); + t.appendChild(sc); }); segnaRisoluzioni(); } diff --git a/scripts/tests/test_pagina_tab.py b/scripts/tests/test_pagina_tab.py index 63ed98a..e3aa9b7 100644 --- a/scripts/tests/test_pagina_tab.py +++ b/scripts/tests/test_pagina_tab.py @@ -72,4 +72,6 @@ def test_acquisizione_di_87_90_conservata(): def test_pagina_stretta(): assert "@media (max-width: 500px)" in PAGINA - assert "overflow-x: auto" in PAGINA # l'elenco scorre di lato invece di rompere la pagina + # #91: elenco a schede, niente tabella larga ne' scorrimento orizzontale + assert 'id="calibrazioni" class="elenco"' in PAGINA and "overflow-x" not in PAGINA + assert "Lettura dei parametri..." in PAGINA