Files
deepstock/cloudflare-buildEmailTemplate-replacement.js
2026-06-07 06:52:22 +01:00

132 lines
9.2 KiB
JavaScript

function buildEmailTemplate(bodyText, data, isDE) {
const esc = (v) => String(v ?? "")
.replace(/&/g, "&")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
const fullName = [data.first_name, data.last_name].filter(Boolean).join(" ") || "";
const greeting = fullName ? isDE ? `Liebe/Lieber ${esc(fullName)}` : `Hello ${esc(fullName)}` : isDE ? "Hallo" : "Hello";
const risk = data.risk_level || "ASSESSED";
const scenarios = (data.scenarios || "").split(",").map((s) => s.trim()).filter(Boolean);
const scenarioLabels = {
total_collapse: isDE ? "Totaler Kollaps" : "Total Collapse",
partial_collapse: isDE ? "Partieller Kollaps" : "Partial Collapse",
hyperinflation: isDE ? "Hyperinflation" : "Hyperinflation",
supply_shock: isDE ? "Versorgungsengpass" : "Supply Side Shock",
food_crisis: isDE ? "Lebensmittelkrise" : "Food Crisis",
bank_crisis: isDE ? "Banken- / Finanzkrise" : "Bank / Financial Crisis",
power_outage: isDE ? "Laengerer Stromausfall" : "Extended Power Outage",
water_failure: isDE ? "Wasserversorgungsausfall" : "Water Supply Failure",
war: isDE ? "Krieg / Bewaffneter Konflikt" : "War / Armed Conflict"
};
const scenarioBadges = scenarios.map((s) =>
`<span style="display:inline-block;background:#F2F2F0;border:1px solid #E4E4E0;padding:5px 9px;font-size:11px;line-height:1.3;color:#5A5A54;margin:3px 4px 3px 0">${esc(scenarioLabels[s] || s)}</span>`
).join("");
const formatText = (text) => {
return esc(text).split(/\n\n+/).filter((p) => p.trim()).map((p) => {
if (p.startsWith("* ") || p.startsWith("- ") || p.startsWith("•") || p.includes("\n•")) {
const items = p.split("\n").filter((l) => l.trim()).map((l) => {
const clean = l.trim().replace(/^(\*|-|•)\s*/, "");
const linked = clean.replace(/(https?:\/\/[^\s<]+)/g, `<a href="$1" style="color:#4A8A68;font-weight:700;text-decoration:underline">${isDE ? "Ansehen" : "View"}</a>`);
const bolded = linked.replace(/\*\*(.+?)\*\*/g, '<strong style="color:#1A1A18">$1</strong>');
return `<li style="margin:0 0 10px;line-height:1.7">${bolded}</li>`;
}).join("");
return `<ul style="margin:12px 0 18px;padding-left:20px;color:#5A5A54">${items}</ul>`;
}
const linked = p.replace(/(https?:\/\/[^\s<]+)/g, `<a href="$1" style="color:#4A8A68;font-weight:700;text-decoration:underline">${isDE ? "Ansehen" : "View"}</a>`);
const bolded = linked.replace(/\*\*(.+?)\*\*/g, '<strong style="color:#1A1A18">$1</strong>');
return `<p style="margin:0 0 17px;line-height:1.72">${bolded}</p>`;
}).join("");
};
const body = formatText(bodyText);
const restoreQuery = data.report_id && data.report_token
? `?r=${encodeURIComponent(data.report_id)}&t=${encodeURIComponent(data.report_token)}`
: "";
const reportUrl = `https://plan-b.now/${restoreQuery}#results-section`;
const analysisUrl = `https://plan-b.now/${restoreQuery}#narrative-section`;
const recommendationsUrl = `https://plan-b.now/${restoreQuery}#recs-anchor`;
const budgetUrl = `https://plan-b.now/${restoreQuery}#panel-budget`;
const timelineUrl = `https://plan-b.now/${restoreQuery}#panel-timeline`;
const proteinUrl = `https://plan-b.now/${restoreQuery}#protein-offer-section`;
return `<!doctype html>
<html lang="${isDE ? "de" : "en"}">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<title>${isDE ? "Dein Plan-B Notfallplan" : "Your Plan-B Preparedness Plan"}</title>
</head>
<body style="margin:0;padding:0;background:#FAFAFA;font-family:Arial,Helvetica,sans-serif;color:#5A5A54;">
<div style="max-width:680px;margin:0 auto;padding:30px 12px;">
<div style="background:#FAFAFA;border:1px solid #E4E4E0;overflow:hidden;">
<div style="padding:34px 32px 28px;border-bottom:1px solid #E4E4E0;">
<div style="font-family:Georgia,'Times New Roman',serif;font-size:42px;line-height:1;letter-spacing:.04em;color:#1A1A18;">Plan<span style="color:#5A9A78">-B</span></div>
<div style="margin-top:22px;font-size:11px;line-height:1.4;letter-spacing:3px;text-transform:uppercase;color:#5A9A78;font-weight:700;">${isDE ? "Persoenlicher Vorsorgeplan" : "Personal Preparedness Plan"}</div>
<h1 style="margin:14px 0 0;font-size:28px;line-height:1.14;letter-spacing:2px;text-transform:uppercase;color:#1A1A18;font-weight:800;">${esc(getRiskLabel(risk, isDE))} ${isDE ? "Bericht" : "Readiness Report"}</h1>
</div>
<div style="padding:30px 32px;">
<p style="margin:0 0 22px;font-size:16px;line-height:1.7;color:#3A3A34;">${greeting},</p>
<div style="background:#E8F2EC;border-left:4px solid #5A9A78;padding:18px 18px 18px 20px;margin-bottom:18px;">
<div style="font-size:10px;line-height:1.4;letter-spacing:2px;text-transform:uppercase;color:#8A8A84;font-weight:700;">${isDE ? "Risikoprofil" : "Risk Profile"}</div>
<div style="margin-top:7px;font-size:20px;line-height:1.2;color:#1A1A18;font-weight:800;">${esc(getRiskLabel(risk, isDE))}</div>
${scenarioBadges ? `<div style="margin-top:12px">${scenarioBadges}</div>` : ""}
</div>
<div style="font-size:15px;line-height:1.72;color:#5A5A54;">${body}</div>
<div style="margin-top:32px;">
<a href="${reportUrl}" style="display:inline-block;background:#1A1A18;color:#FAFAFA;text-decoration:none;padding:16px 24px;border-radius:0;font-size:12px;font-weight:700;letter-spacing:2.4px;text-transform:uppercase">${isDE ? "Meinen Bericht oeffnen" : "Open My Report"}</a>
</div>
</div>
<div style="margin:0 32px 28px;background:#FAFAFA;border:1px solid #E4E4E0;padding:18px;">
<div style="font-size:10px;color:#8A8A84;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;font-weight:700;">${isDE ? "Direkt zu deinem Bericht" : "Jump back to your report"}</div>
<table style="width:100%;border-collapse:collapse;">
<tr>
<td style="width:50%;padding:0 6px 8px 0;">
<a href="${analysisUrl}" style="display:block;background:#F2F2F0;border:1px solid #E4E4E0;color:#1A1A18;text-decoration:none;padding:13px 14px;font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;">${isDE ? "Analyse" : "Analysis"}</a>
</td>
<td style="width:50%;padding:0 0 8px 6px;">
<a href="${recommendationsUrl}" style="display:block;background:#F2F2F0;border:1px solid #E4E4E0;color:#1A1A18;text-decoration:none;padding:13px 14px;font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;">${isDE ? "Empfehlungen" : "Recommendations"}</a>
</td>
</tr>
<tr>
<td style="width:50%;padding:0 6px 0 0;">
<a href="${budgetUrl}" style="display:block;background:#F2F2F0;border:1px solid #E4E4E0;color:#1A1A18;text-decoration:none;padding:13px 14px;font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;">${isDE ? "Budget" : "Budget"}</a>
</td>
<td style="width:50%;padding:0 0 0 6px;">
<a href="${timelineUrl}" style="display:block;background:#F2F2F0;border:1px solid #E4E4E0;color:#1A1A18;text-decoration:none;padding:13px 14px;font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;">${isDE ? "Zeitplan" : "Timeline"}</a>
</td>
</tr>
</table>
${data.protein_security === "uncertain" ? `<div style="margin-top:10px;"><a href="${proteinUrl}" style="display:block;background:#E8F2EC;border:1px solid #C7DDCE;color:#1A1A18;text-decoration:none;padding:13px 14px;font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;">${isDE ? "Proteinquelle sichern" : "Secure protein source"}</a></div>` : ""}
</div>
<div style="margin:0 32px 28px;background:#F2F2F0;border:1px solid #E4E4E0;padding:18px;">
<div style="font-size:10px;color:#8A8A84;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px;font-weight:700;">${isDE ? "Dein Profil" : "Your Profile"}</div>
<table style="width:100%;border-collapse:collapse;font-size:13px;line-height:1.5">
${erow(isDE ? "Name" : "Name", esc(fullName))}
${erow(isDE ? "Wohnort" : "Location", esc([data.city, data.country].filter(Boolean).join(", ")))}
${erow(isDE ? "Haushalt" : "Household", esc(householdLabel(data.household_size, isDE)))}
${erow(isDE ? "Budget" : "Budget", data.budget_eur ? `EUR ${esc(data.budget_eur)}` : "")}
${erow(isDE ? "Szenarien" : "Scenarios", esc(scenarios.map((s) => scenarioLabels[s] || s).join(", ")))}
</table>
</div>
<div style="padding:20px 32px 26px;background:#F2F2F0;border-top:1px solid #E4E4E0;">
<p style="margin:0;color:#8A8A84;font-size:12px;line-height:1.7;">${isDE ? 'Du erhaeltst diese E-Mail, weil du das Plan-B Assessment abgeschlossen hast.' : 'You are receiving this because you completed the Plan-B assessment.'} <a href="mailto:hello@plan-b.now?subject=unsubscribe" style="color:#4A8A68;">${isDE ? "Abmelden" : "Unsubscribe"}</a>. ${isDE ? "Deine Daten werden nie verkauft." : "Your data is never sold."}</p>
</div>
</div>
</div>
</body>
</html>`;
}