3 Commits

Author SHA1 Message Date
s4luorth
812f4784fd Postkarte: Trennstrich als dünne Kugelschreiber-Linie + mehr Abstand nach Absender
All checks were successful
Build & Deploy / deploy (push) Successful in 10s
- Trennstrich jetzt Single-Stroke (stroke-width 0.6, non-scaling, keine Füllung)
  wie die Handschrift statt 1,2-mm-Balken.
- Brieftext beginnt bei y≈18 mm (statt 14) → mehr Luft nach dem Absender.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-09-11 21:02:39 +02:00
s4luorth
af08202981 Adresszeilen als Platzhalter [[Zeile1]]..[[Zeile5]] (5-Zeilen-Modus)
All checks were successful
Build & Deploy / deploy (push) Successful in 10s
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-09-11 20:55:22 +02:00
s4luorth
e56a71dfdd Postkarte: kein falscher „Text zu lang"-Fehler mehr
All checks were successful
Build & Deploy / deploy (push) Successful in 10s
- Überlauf nur noch am Brieftext messen (echte lineCount/lineLimit statt 0/0) –
  behebt die Meldung „1 Zeile zu lang – 0 statt max. 0".
- Empfänger-Adresse wird automatisch verkleinert, wenn sie nicht ins sichere
  Adressfeld passt → Codierzone bleibt immer frei, keine Blockade der Vorschau.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-09-11 20:53:41 +02:00
2 changed files with 34 additions and 13 deletions

View File

@@ -32,6 +32,8 @@ function addressText(entry) {
/** Platzhalterwerte einer Zeile (strukturierte Felder + freie Platzhalter). */ /** Platzhalterwerte einer Zeile (strukturierte Felder + freie Platzhalter). */
function placeholdersOf(entry) { function placeholdersOf(entry) {
// Die 5 Adresszeilen (5-Zeilen-Modus) auch als [[Zeile1]]..[[Zeile5]] verfügbar.
const zeilen = String(entry.free_text || '').split('\n');
return { return {
Anrede: entry.salutation || '', Anrede: entry.salutation || '',
Vorname: entry.first_name || '', Vorname: entry.first_name || '',
@@ -41,6 +43,8 @@ function placeholdersOf(entry) {
Ort: entry.city || '', Ort: entry.city || '',
Land: entry.country || '', Land: entry.country || '',
Briefnummer: entry.letter_number ?? '', Briefnummer: entry.letter_number ?? '',
Zeile1: zeilen[0] || '', Zeile2: zeilen[1] || '', Zeile3: zeilen[2] || '',
Zeile4: zeilen[3] || '', Zeile5: zeilen[4] || '',
...(entry.placeholders && typeof entry.placeholders === 'object' ? entry.placeholders : {}), ...(entry.placeholders && typeof entry.placeholders === 'object' ? entry.placeholders : {}),
}; };
} }

View File

@@ -476,6 +476,8 @@ function generatePostcardSVG(text, format, options = {}) {
const trennXmm = (textLowerRightMm + addrLeftMm) / 2; // A6: 84 const trennXmm = (textLowerRightMm + addrLeftMm) / 2; // A6: 84
const paths = []; const paths = [];
let bodyLineCount = 0;
let bodyLineLimit = 1;
let overflow = false; let overflow = false;
// Variabler (L-förmiger) Textfluss: oben schmal (bis Frankierzone), unten breit. // Variabler (L-förmiger) Textfluss: oben schmal (bis Frankierzone), unten breit.
@@ -500,12 +502,14 @@ function generatePostcardSVG(text, format, options = {}) {
return out; return out;
} }
// Text links (L-förmig). // Text links (L-förmig). Nur DER Text kann „zu lang" sein (Nutzer kürzt ihn).
// Etwas Abstand nach dem Absender (Absender endet bei y≈12 mm).
const baseline0 = mmToPx(18) + fontSizePx;
bodyLineLimit = Math.max(1, Math.floor((mmToPx(maxYmm) - baseline0) / lineHeightPx) + 1);
if (body) { if (body) {
const baseline0 = mmToPx(14) + fontSizePx;
const bodyLines = flowVariabel(body, fontSizePx, baseline0, lineHeightPx); const bodyLines = flowVariabel(body, fontSizePx, baseline0, lineHeightPx);
const letzteBaseline = baseline0 + Math.max(0, bodyLines.length - 1) * lineHeightPx; bodyLineCount = bodyLines.length;
if (letzteBaseline > mmToPx(maxYmm)) overflow = true; if (bodyLineCount > bodyLineLimit) overflow = true;
paths.push(...layoutTextToPaths({ paths.push(...layoutTextToPaths({
lines: bodyLines, fontFileName: fontFile, fontSizePx, lines: bodyLines, fontFileName: fontFile, fontSizePx,
startX: mmToPx(textLeftMm), startY: baseline0, lineHeightPx, realisticHandwriting: realistic, startX: mmToPx(textLeftMm), startY: baseline0, lineHeightPx, realisticHandwriting: realistic,
@@ -523,14 +527,26 @@ function generatePostcardSVG(text, format, options = {}) {
})); }));
} }
// Empfänger im sicheren Adressfeld (rechts unten). // Empfänger im sicheren Adressfeld (rechts unten). Passt der Block nicht in die
// 46 mm hohe Zone, wird die Schrift automatisch verkleinert – so bleibt die
// Codierzone (unten) IMMER frei und es gibt keinen „Adresse zu lang"-Fehler.
if (recipient) { if (recipient) {
const recLines = wrapTextToLinesByWidth({ text: recipient, maxWidthPx: mmToPx(addrRightMm - addrLeftMm), fontFileName: fontFile, fontSizePx }); const feldOben = mmToPx(addrTopMm);
const recBaseline0 = mmToPx(addrTopMm) + fontSizePx; const feldUnten = mmToPx(maxYmm);
if (recBaseline0 + Math.max(0, recLines.length - 1) * lineHeightPx > mmToPx(maxYmm)) overflow = true; const feldBreite = mmToPx(addrRightMm - addrLeftMm);
let recSize = fontSizePx;
let recLH = lineHeightPx;
let recLines = [];
for (const scale of [1, 0.9, 0.8, 0.72, 0.65, 0.6]) {
recSize = fontSizePx * scale;
recLH = lineHeightPx * scale;
recLines = wrapTextToLinesByWidth({ text: recipient, maxWidthPx: feldBreite, fontFileName: fontFile, fontSizePx: recSize });
const blockUnten = feldOben + recSize + Math.max(0, recLines.length - 1) * recLH + recSize * 0.3;
if (blockUnten <= feldUnten) break;
}
paths.push(...layoutTextToPaths({ paths.push(...layoutTextToPaths({
lines: recLines, fontFileName: fontFile, fontSizePx, lines: recLines, fontFileName: fontFile, fontSizePx: recSize,
startX: mmToPx(addrLeftMm), startY: recBaseline0, lineHeightPx, realisticHandwriting: realistic, startX: mmToPx(addrLeftMm), startY: feldOben + recSize, lineHeightPx: recLH, realisticHandwriting: realistic,
})); }));
} }
@@ -546,8 +562,9 @@ function generatePostcardSVG(text, format, options = {}) {
/>`) />`)
.join('\n '); .join('\n ');
// Trennstrich (solide Linie, 1,2 mm breit) zwischen Text und Adressfeld. // Trennstrich: einfache Kugelschreiber-Linie (Single-Stroke, keine Füllung) –
const trennstrich = `<path d="M ${mmToPx(trennXmm).toFixed(1)} ${mmToPx(addrTopMm).toFixed(1)} L ${mmToPx(trennXmm).toFixed(1)} ${mmToPx(maxYmm).toFixed(1)}" stroke="#000000" stroke-width="${mmToPx(1.2).toFixed(1)}" stroke-linecap="butt" fill="none"/>`; // gleiche Strichstärke wie die Handschrift, damit die Ballpoint-Optik greift.
const trennstrich = `<path d="M ${mmToPx(trennXmm).toFixed(1)} ${mmToPx(addrTopMm).toFixed(1)} L ${mmToPx(trennXmm).toFixed(1)} ${mmToPx(maxYmm).toFixed(1)}" stroke="#000000" stroke-width="0.6" fill="none" stroke-linecap="round" vector-effect="non-scaling-stroke"/>`;
const svg = `<svg xmlns="http://www.w3.org/2000/svg" const svg = `<svg xmlns="http://www.w3.org/2000/svg"
width="${W}mm" width="${W}mm"
@@ -558,7 +575,7 @@ function generatePostcardSVG(text, format, options = {}) {
${pathElements} ${pathElements}
</svg>`; </svg>`;
return { svg: svg.trim(), overflow, lineCount: 0, lineLimit: 0 }; return { svg: svg.trim(), overflow, lineCount: bodyLineCount, lineLimit: bodyLineLimit };
} }
/** /**