Version 2.7.7: Schriftgroesse der Vorschau wird gerechnet

apps/tesm/pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "tesm"
-version = "2.7.5"
+version = "2.7.7"
 description = "TESM -- Verwaltung und Ueberwachung von PoE-Endgeraeten und Aruba-Switchen"
 requires-python = ">=3.11"
 dependencies = [

packages/tesm-core/pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "tesm-core"
-version = "2.7.5"
+version = "2.7.7"
 description = "Gemeinsames Anwendungsgeruest (Auth, RBAC, Navigation, Design-System, Migrationen) fuer TESM und TESM-Lizenzserver"
 requires-python = ">=3.11"
 dependencies = [

packages/tesm-core/src/tesm_core/app_factory.py

@@ -148,7 +148,7 @@ def create_base_app(
     #: Wortmarke, ohne Zeile darunter; die Marke selbst zeigen beide
     #: Anwendungen.
     auth_tagline: str = "",
-    app_version: str = "2.7.5",
+    app_version: str = "2.7.7",
     built_in_trusted_keys: tuple[str, ...] = (),
     enable_license: bool = True,
     template_folder: str | None = None,

packages/tesm-core/src/tesm_core/static/tesm_core/css/components.css

@@ -1461,7 +1461,6 @@
   z-index: 3;
   cursor: grab;
   touch-action: none;
-  container-type: inline-size;
   border: 1px dashed transparent;
 }
 
@@ -1483,7 +1482,14 @@
    wie im PDF. Waere er so breit wie der Block, zeigte die Vorschau etwas
    anderes als die Datei. */
 .viewer__unterschrifttext {
-  font-size: 5.6cqw;
+  /* Helvetica: dieselbe Schrift, die das PDF benutzt (StandardFonts.Helvetica).
+     Mit der Hausschrift sah die Vorschau anders aus als das Ergebnis. Die
+     Groesse setzt das Skript je Unterschrift -- hier steht nur ein Rueckfall. */
+  font-family: Helvetica, Arial, sans-serif;
+  /* Die tatsaechliche Groesse setzt das Skript in Pixeln (Punkte mal
+     Pixel-je-Punkt der Seite). Dieser Wert gilt nur, solange sie noch nicht
+     gerechnet wurde -- geerbt wuerde sonst die Schriftgroesse der Seite. */
+  font-size: 8px;
   line-height: 1.15;
   color: #111;
   border-top: 1px solid rgba(0, 0, 0, 0.85);

packages/tesm-core/src/tesm_core/static/tesm_core/js/viewer.js

@@ -346,8 +346,8 @@ async function nachbearbeiten(
  *
  * Ein Achtzehntel: bei den 150 Punkt der vollen Breite sind das gut acht
  * Punkt -- die uebliche Groesse einer Unterschriftszeile auf Papier. Dieselbe
- * Rechnung benutzt die Vorschau (als ``cqw``), damit auf dem Schirm steht,
- * was spaeter im PDF steht.
+ * Rechnung benutzt die Vorschau -- in Pixeln umgerechnet --, damit auf dem
+ * Schirm steht, was spaeter im PDF steht.
  */
 function schriftgroesse(breite) {
   return Math.max(5, Math.min(10, breite / 18));
@@ -637,6 +637,8 @@ async function pdfBetrachter(behaelter, seiten, url, basis, { formulare = true }
   const MAX_BREITE = 150;
   const MAX_HOEHE = 50;
   const unterschriften = [];
+  //: Je gesetzte Unterschrift eine Funktion, die ihre Marke neu vermisst.
+  const neuzeichnen = new Set();
   let wartendeUnterschrift = null;
   let zeugenzeile = () => "";
 
@@ -684,11 +686,20 @@ async function pdfBetrachter(behaelter, seiten, url, basis, { formulare = true }
     const bild = document.createElement("img");
     bild.src = eintrag.vorschau;
     bild.alt = "";
+    // Genau der Aufbau der spaeteren Datei: eine Zeile mit Namen und
+    // Zeitpunkt, darunter -- als eigene Zeile -- der Zeugenvermerk. In der
+    // Vorschau standen beide hintereinander, getrennt durch einen
+    // Schraegstrich; beim Positionieren sah der Block dadurch breiter und
+    // flacher aus als das Ergebnis.
     const text = document.createElement("div");
     text.className = "viewer__unterschrifttext";
-    text.textContent = `${eintrag.name} | ${eintrag.zeit}`;
+    const namenszeile = document.createElement("div");
+    namenszeile.textContent = `${eintrag.name} | ${eintrag.zeit}`;
+    text.append(namenszeile);
     if (zeuge && eintrag === unterschriften[0]) {
-      text.textContent += ` / In TESM abgelegt durch ${zeuge}`;
+      const zeugenzeile = document.createElement("div");
+      zeugenzeile.textContent = `In TESM abgelegt durch ${zeuge}`;
+      text.append(zeugenzeile);
     }
     const griff = document.createElement("button");
     griff.type = "button";
@@ -708,13 +719,24 @@ async function pdfBetrachter(behaelter, seiten, url, basis, { formulare = true }
       marke.style.left = `${(eintrag.x / blick.width) * 100}%`;
       marke.style.bottom = `${(eintrag.y / blick.height) * 100}%`;
       marke.style.width = `${(eintrag.breite / blick.width) * 100}%`;
+      // Die Schriftgroesse wird gerechnet, nicht vom Stylesheet abgeleitet:
+      // Punkte mal Pixel-je-Punkt der gerade dargestellten Seite. Ueber
+      // Container-Einheiten ("cqw") ging das auch -- aber nur dort, wo der
+      // Browser sie kennt; wo nicht, erbte der Block die Schriftgroesse der
+      // Seite, und der Text war um die Haelfte zu breit. Genau das war der
+      // Unterschied zwischen Vorschau und Datei.
+      const proPunkt = seitenEl.getBoundingClientRect().width / blick.width;
+      text.style.fontSize = `${schriftgroesse(eintrag.breite) * proPunkt}px`;
     };
+    // Beim Zoomen aendert sich Pixel-je-Punkt -- dann neu rechnen.
+    neuzeichnen.add(zeichnen);
     zeichnen();
 
     weg.addEventListener("click", (event) => {
       event.stopPropagation();
       const stelle = unterschriften.indexOf(eintrag);
       if (stelle >= 0) unterschriften.splice(stelle, 1);
+      neuzeichnen.delete(zeichnen);
       marke.remove();
     });
 
@@ -766,6 +788,18 @@ async function pdfBetrachter(behaelter, seiten, url, basis, { formulare = true }
     platzieren(event).catch((fehler) => console.error("Unterschrift", fehler));
   });
 
+  // Nach dem Zoomen stehen die Marken anteilig richtig, aber die Schrift
+  // haengt an der Pixelgroesse der Seite -- die ist jetzt eine andere.
+  eventBus.on("scalechanging", () => {
+    for (const zeichnen of neuzeichnen) {
+      try {
+        zeichnen();
+      } catch (fehler) {
+        console.error("Unterschrift neu vermessen", fehler);
+      }
+    }
+  });
+
   return {
     hinein: () => {
       viewer.currentScale = Math.min(MAX_ZOOM, viewer.currentScale * 1.2);

packages/tesm-licensing/pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "tesm-licensing"
-version = "2.7.5"
+version = "2.7.7"
 description = "Ed25519-basiertes Lizenz- und Aktivierungsprotokoll fuer TESM und TESM-Lizenzserver"
 requires-python = ">=3.11"
 dependencies = ["cryptography>=42"]