@jjlmoya/utils-home 1.29.0 → 1.30.0

package/src/tool/applianceCostCalculator/component.astro

@@ -0,0 +1,322 @@
+---
+import type { ApplianceCostCalculatorUI } from './ui';
+import { calculateCycleCost, fmt2 } from './logic';
+
+interface Props {
+  ui?: Record<string, unknown>;
+}
+
+const { ui = {} } = Astro.props;
+const aUI = ui as ApplianceCostCalculatorUI;
+
+const DEF_APP = 'washer';
+const DEF_CYCLE = 'normal';
+const DEF_ELEC = 0.18;
+const DEF_WATER = 0.003;
+const DEF_DET = true;
+const DEF_HOUR = 12;
+const DEF_CYCLES = 3;
+
+const initial = calculateCycleCost(DEF_APP, DEF_CYCLE, DEF_ELEC, DEF_WATER, DEF_DET, DEF_HOUR, DEF_CYCLES);
+const HOURS = Array.from({ length: 24 }, (_, i) => i);
+const PEAK = new Set([8, 9, 10, 11, 18, 19, 20, 21]);
+---
+
+<div class="apc-root">
+  <div class="apc-card"
+    data-cs={aUI.currencySign}
+    data-curr-usd={aUI.btnCurrUSD}
+    data-curr-eur={aUI.btnCurrEUR}
+    data-curr-gbp={aUI.btnCurrGBP}
+    data-curr-jpy={aUI.btnCurrJPY}
+    data-pb={aUI.peakBadge}
+    data-op={aUI.offPeakBadge}
+    data-rpy={aUI.receiptPerYear}
+    data-ct={aUI.comparisonText}
+    data-csav={aUI.comparisonSavings}
+    data-uc={aUI.unitCycles}
+  >
+    <div class="apc-stage">
+      <div class="apc-stage-glow"></div>
+      <div class="apc-carousel" id="apc-carousel">
+        <button class="apc-appliance apc-active" data-app="washer" type="button">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="16" rx="2"/><path d="M3 10h18M12 14v-2"/></svg>
+          <span>{aUI.applianceWasher}</span>
+        </button>
+        <button class="apc-appliance" data-app="dishwasher" type="button">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="16" rx="2"/><path d="M3 10h18M8 14h.01M16 14h.01"/></svg>
+          <span>{aUI.applianceDishwasher}</span>
+        </button>
+        <button class="apc-appliance" data-app="dryer" type="button">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M12 8v4l2 2"/></svg>
+          <span>{aUI.applianceDryer}</span>
+        </button>
+      </div>
+      <div class="apc-hero-num">
+        <p class="apc-hero-label">{aUI.receiptTotal}</p>
+        <p class="apc-hero-value">
+          <span id="apc-total-num">{fmt2(initial.totalCost)}</span>
+          <span id="apc-total-unit" class="apc-hero-unit">{aUI.currencySign}</span>
+        </p>
+      </div>
+      <div class="apc-currency-row">
+        <span class="apc-currency-label">{aUI.labelCurrency}</span>
+        <div class="apc-currency-btns">
+          <button class="apc-currency-btn apc-currency-active" data-currency="usd" type="button">{aUI.btnCurrUSD}</button>
+          <button class="apc-currency-btn" data-currency="eur" type="button">{aUI.btnCurrEUR}</button>
+          <button class="apc-currency-btn" data-currency="gbp" type="button">{aUI.btnCurrGBP}</button>
+          <button class="apc-currency-btn" data-currency="jpy" type="button">{aUI.btnCurrJPY}</button>
+        </div>
+      </div>
+    </div>
+
+    <div class="apc-body">
+      <p class="apc-section-label">{aUI.labelCycle}</p>
+      <div class="apc-pill-track" id="apc-pill-track">
+        <div class="apc-pill-indicator" id="apc-pill-indicator"></div>
+        <button class="apc-pill-btn" data-cycle="eco" type="button">{aUI.cycleEco}</button>
+        <button class="apc-pill-btn apc-active" data-cycle="normal" type="button">{aUI.cycleNormal}</button>
+        <button class="apc-pill-btn" data-cycle="intensive" type="button">{aUI.cycleIntensive}</button>
+      </div>
+
+      <div class="apc-fields">
+        <div class="apc-field">
+          <label class="apc-field-label" for="apc-elec">{aUI.labelElectricityPrice}</label>
+          <div style="display:flex;align-items:baseline;gap:0.4rem">
+            <input type="number" id="apc-elec" class="apc-field-input" value={DEF_ELEC} min="0" step="0.01" />
+            <span class="apc-field-unit">{aUI.unitPriceKwh}</span>
+          </div>
+        </div>
+        <div class="apc-field">
+          <label class="apc-field-label" for="apc-water">{aUI.labelWaterPrice}</label>
+          <div style="display:flex;align-items:baseline;gap:0.4rem">
+            <input type="number" id="apc-water" class="apc-field-input" value={DEF_WATER} min="0" step="0.001" />
+            <span class="apc-field-unit">{aUI.unitPriceLiter}</span>
+          </div>
+        </div>
+      </div>
+
+      <div class="apc-field">
+        <label class="apc-field-label" for="apc-cycles">{aUI.labelCyclesPerWeek}</label>
+        <input type="number" id="apc-cycles" class="apc-field-input" value={DEF_CYCLES} min="1" max="50" step="1" style="width:80px" />
+      </div>
+
+      <label class="apc-toggle">
+        <input type="checkbox" id="apc-det" checked={DEF_DET} />
+        <span class="apc-toggle-track"></span>
+        <span class="apc-toggle-text">{aUI.labelDetergentToggle}</span>
+      </label>
+
+      <p class="apc-section-label">{aUI.labelHour}</p>
+      <div class="apc-clock">
+        <div class="apc-clock-dial">
+          <div class="apc-clock-hand" id="apc-hand"></div>
+          <div class="apc-clock-center"></div>
+        </div>
+        <div class="apc-clock-hours" id="apc-hours">
+          {HOURS.map((h) => (
+            <button
+              class={`apc-hour-chip ${h === DEF_HOUR ? 'apc-active' : ''} ${PEAK.has(h) ? 'apc-peak' : ''}`}
+              data-hour={h}
+              type="button"
+            >
+              {String(h).padStart(2, '0')}
+            </button>
+          ))}
+        </div>
+      </div>
+
+      <div class="apc-receipt" id="apc-receipt">
+        <p class="apc-receipt-title">{aUI.receiptTitle}</p>
+        <div class="apc-receipt-row">
+          <span class="apc-receipt-name">{aUI.receiptElectricity}</span>
+          <span class="apc-receipt-price" id="apc-r-elec">{fmt2(initial.electricityCost)} {aUI.currencySign}</span>
+        </div>
+        <div class="apc-receipt-row">
+          <span class="apc-receipt-name">{aUI.receiptWater}</span>
+          <span class="apc-receipt-price" id="apc-r-water">{fmt2(initial.waterCost)} {aUI.currencySign}</span>
+        </div>
+        <div class="apc-receipt-row" id="apc-r-det-row">
+          <span class="apc-receipt-name">{aUI.receiptDetergent}</span>
+          <span class="apc-receipt-price" id="apc-r-det">{fmt2(initial.detergentCost)} {aUI.currencySign}</span>
+        </div>
+        <div class="apc-receipt-total">
+          <span class="apc-receipt-total-name">{aUI.receiptTotal}</span>
+          <span class="apc-receipt-total-price" id="apc-r-total">{fmt2(initial.totalCost)} {aUI.currencySign}</span>
+        </div>
+        <p class="apc-receipt-year" id="apc-r-year">{aUI.receiptPerYear}: {fmt2(initial.annualCost)} {aUI.currencySign}</p>
+      </div>
+    </div>
+
+    <div class="apc-tip">
+      <div class="apc-tip-card">
+        <p class="apc-tip-title">{aUI.comparisonTitle}</p>
+        <p class="apc-tip-text" id="apc-tip-text">{aUI.comparisonText}</p>
+        <span class="apc-tip-badge" id="apc-tip-badge">
+          {aUI.comparisonSavings}: {fmt2(initial.ecoSavingsPerYear)} {aUI.currencySign} / {aUI.unitCycles}
+        </span>
+      </div>
+    </div>
+  </div>
+</div>
+
+<script>
+  import { calculateCycleCost, fmt2 } from './logic';
+
+  const RATES: Record<string, number> = { eur: 1, usd: 1.08, gbp: 0.85, jpy: 160 };
+  const LS_KEY_CURRENCY = 'appliance-cost-currency';
+  let currency: 'usd' | 'eur' | 'gbp' | 'jpy' = 'eur';
+  let baseElec = 0.18;
+  let baseWater = 0.003;
+
+  function el(id: string) { return document.getElementById(id); }
+  function setTxt(id: string, val: string) { const e = el(id); if (e) e.textContent = val; }
+  function getNum(id: string): number { const e = el(id) as HTMLInputElement | null; return e ? parseFloat(e.value) || 0 : 0; }
+  function setVal(id: string, val: number) { const e = el(id) as HTMLInputElement | null; if (e) e.value = String(val); }
+  function getChk(id: string): boolean { const e = el(id) as HTMLInputElement | null; return e ? e.checked : false; }
+  function ds(card: HTMLElement, k: string): string { return card.dataset[k] ?? ''; }
+
+  function getCS(card: HTMLElement): string {
+    const key = `curr${currency.charAt(0).toUpperCase()}${currency.slice(1)}`;
+    return ds(card, key) || ds(card, 'cs') || '€';
+  }
+
+  function toBase(val: number) { return val / RATES[currency]; }
+  function fromBase(val: number) { return val * RATES[currency]; }
+
+  function readState(card: HTMLElement) {
+    const a = card.querySelector('.apc-appliance.apc-active') as HTMLElement | null;
+    const c = card.querySelector('.apc-pill-btn.apc-active') as HTMLElement | null;
+    const ah = card.querySelector('.apc-hour-chip.apc-active') as HTMLElement | null;
+    return {
+      applianceId: a?.dataset.app || 'washer',
+      cycle: (c?.dataset.cycle || 'normal') as 'eco' | 'normal' | 'intensive',
+      electricityPrice: getNum('apc-elec'),
+      waterPrice: getNum('apc-water'),
+      detergentEnabled: getChk('apc-det'),
+      hour: parseInt(ah?.dataset.hour || '12', 10),
+      cyclesPerWeek: getNum('apc-cycles'),
+    };
+  }
+
+  function setHand(hour: number) {
+    const hand = el('apc-hand') as HTMLElement | null;
+    if (!hand) return;
+    hand.style.transform = `translate(-50%, -100%) rotate(${(hour % 12) * 30}deg)`;
+  }
+
+  function moveIndicator(track: HTMLElement, activeBtn: HTMLElement) {
+    const ind = el('apc-pill-indicator') as HTMLElement | null;
+    if (!ind || !track || !activeBtn) return;
+    const tRect = track.getBoundingClientRect();
+    const bRect = activeBtn.getBoundingClientRect();
+    ind.style.width = `${bRect.width}px`;
+    ind.style.transform = `translateX(${bRect.left - tRect.left}px)`;
+  }
+
+  function renderReceipt(card: HTMLElement, r: ReturnType<typeof calculateCycleCost>, cs: string, det: boolean) {
+    setTxt('apc-total-num', fmt2(r.totalCost));
+    setTxt('apc-total-unit', cs);
+    setTxt('apc-r-elec', `${fmt2(r.electricityCost)} ${cs}`);
+    setTxt('apc-r-water', `${fmt2(r.waterCost)} ${cs}`);
+    setTxt('apc-r-det', `${fmt2(r.detergentCost)} ${cs}`);
+    setTxt('apc-r-total', `${fmt2(r.totalCost)} ${cs}`);
+    setTxt('apc-r-year', `${ds(card, 'rpy') || 'Per year'}: ${fmt2(r.annualCost)} ${cs}`);
+    const dRow = el('apc-r-det-row') as HTMLElement | null;
+    if (dRow) dRow.style.display = det ? 'flex' : 'none';
+  }
+
+  function renderTip(card: HTMLElement, r: ReturnType<typeof calculateCycleCost>, cs: string) {
+    const tipT = el('apc-tip-text') as HTMLElement | null;
+    if (tipT) tipT.textContent = (ds(card, 'ct') || 'Switch to Eco to save') + ` (${fmt2(r.ecoSavingsPerYear)} ${cs}/${ds(card, 'uc') || 'year'})`;
+    const tipB = el('apc-tip-badge') as HTMLElement | null;
+    if (tipB) tipB.textContent = `${ds(card, 'csav') || 'Savings'}: ${fmt2(r.ecoSavingsPerYear)} ${cs} / ${ds(card, 'uc') || 'year'}`;
+  }
+
+  function update(card: HTMLElement) {
+    const s = readState(card);
+    const r = calculateCycleCost(s);
+    const cs = getCS(card);
+    renderReceipt(card, r, cs, s.detergentEnabled);
+    renderTip(card, r, cs);
+  }
+
+  function applyCurrency(curr: 'usd' | 'eur' | 'gbp' | 'jpy', card: HTMLElement) {
+    baseElec = toBase(getNum('apc-elec'));
+    baseWater = toBase(getNum('apc-water'));
+    currency = curr;
+    localStorage.setItem(LS_KEY_CURRENCY, curr);
+    document.querySelectorAll('.apc-currency-btn').forEach((b) => b.classList.toggle('apc-currency-active', (b as HTMLElement).dataset.currency === curr));
+    setVal('apc-elec', fromBase(baseElec));
+    setVal('apc-water', fromBase(baseWater));
+    update(card);
+  }
+
+  function toggle(container: HTMLElement, sel: string, target: HTMLElement, cls: string) {
+    container.querySelectorAll(sel).forEach((b) => b.classList.toggle(cls, b === target));
+  }
+
+  function bindInputs(card: HTMLElement) {
+    ['apc-elec', 'apc-water', 'apc-cycles'].forEach((id) => { const i = el(id) as HTMLInputElement | null; if (i) i.addEventListener('input', () => update(card)); });
+    const det = el('apc-det') as HTMLInputElement | null;
+    if (det) det.addEventListener('change', () => update(card));
+  }
+
+  function bindCarousel(card: HTMLElement) {
+    const car = el('apc-carousel');
+    if (car) car.querySelectorAll('.apc-appliance').forEach((b) => b.addEventListener('click', () => { toggle(car, '.apc-appliance', b as HTMLElement, 'apc-active'); update(card); }));
+  }
+
+  function bindPills(card: HTMLElement) {
+    const track = el('apc-pill-track') as HTMLElement | null;
+    if (!track) return;
+    const normalBtn = track.querySelector('[data-cycle="normal"]') as HTMLElement | null;
+    if (normalBtn) moveIndicator(track, normalBtn);
+    track.querySelectorAll('.apc-pill-btn').forEach((b) => b.addEventListener('click', () => {
+      toggle(track, '.apc-pill-btn', b as HTMLElement, 'apc-active');
+      moveIndicator(track, b as HTMLElement);
+      update(card);
+    }));
+  }
+
+  function bindHours(card: HTMLElement) {
+    const hrs = el('apc-hours');
+    if (hrs) hrs.querySelectorAll('.apc-hour-chip').forEach((b) => b.addEventListener('click', () => {
+      toggle(hrs, '.apc-hour-chip', b as HTMLElement, 'apc-active');
+      setHand(parseInt((b as HTMLElement).dataset.hour || '12', 10));
+      update(card);
+    }));
+  }
+
+  function bindCurrency(card: HTMLElement) {
+    document.querySelectorAll('.apc-currency-btn').forEach((b) => b.addEventListener('click', () => {
+      const c = (b as HTMLElement).dataset.currency as 'usd' | 'eur' | 'gbp' | 'jpy';
+      if (c) applyCurrency(c, card);
+    }));
+  }
+
+  function init() {
+    const card = document.querySelector('.apc-card') as HTMLElement | null;
+    if (!card) return;
+
+    const saved = localStorage.getItem(LS_KEY_CURRENCY) as 'usd' | 'eur' | 'gbp' | 'jpy' | null;
+    if (saved) {
+      currency = saved;
+      setVal('apc-elec', fromBase(baseElec));
+      setVal('apc-water', fromBase(baseWater));
+    }
+    document.querySelectorAll('.apc-currency-btn').forEach((b) => b.classList.toggle('apc-currency-active', (b as HTMLElement).dataset.currency === currency));
+
+    bindCarousel(card);
+    bindPills(card);
+    bindHours(card);
+    bindCurrency(card);
+    bindInputs(card);
+
+    setHand(DEF_HOUR);
+    update(card);
+  }
+
+  document.addEventListener('astro:page-load', init);
+  init();
+</script>

package/src/tool/applianceCostCalculator/entry.ts

@@ -0,0 +1,29 @@
+import type { HomeToolEntry, ToolLocaleContent } from '../../types';
+import type { ApplianceCostCalculatorUI } from './ui';
+
+export type ApplianceCostCalculatorLocaleContent = ToolLocaleContent<ApplianceCostCalculatorUI>;
+
+export const applianceCostCalculator: HomeToolEntry<ApplianceCostCalculatorUI> = {
+  id: 'appliance-cost-calculator',
+  icons: {
+    bg: 'mdi:washing-machine',
+    fg: 'mdi:lightning-bolt',
+  },
+  i18n: {
+    en: async () => (await import('./i18n/en')).content,
+    es: async () => (await import('./i18n/es')).content,
+    de: async () => (await import('./i18n/de')).content,
+    fr: async () => (await import('./i18n/fr')).content,
+    it: async () => (await import('./i18n/it')).content,
+    pt: async () => (await import('./i18n/pt')).content,
+    nl: async () => (await import('./i18n/nl')).content,
+    pl: async () => (await import('./i18n/pl')).content,
+    sv: async () => (await import('./i18n/sv')).content,
+    ru: async () => (await import('./i18n/ru')).content,
+    tr: async () => (await import('./i18n/tr')).content,
+    zh: async () => (await import('./i18n/zh')).content,
+    ja: async () => (await import('./i18n/ja')).content,
+    ko: async () => (await import('./i18n/ko')).content,
+    id: async () => (await import('./i18n/id')).content,
+  },
+};

package/src/tool/applianceCostCalculator/i18n/de.ts

@@ -0,0 +1,229 @@
+import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
+import type { ToolLocaleContent } from '../../../types';
+import type { ApplianceCostCalculatorUI } from '../ui';
+import { bibliography } from '../bibliography';
+
+const slug = 'geraetekosten-rechner';
+const title = 'Kostenrechner für Wasser und Energie je Waschgang für Haushaltsgeräte';
+const description =
+  'Berechne die wahren Kosten pro Ladung deiner Waschmaschine, deines Geschirrspülers und deines Wäschetrockners. Sieh genau, wie viel Strom, Wasser und Waschmittel jeder Waschgang kostet und entdecke, wie viel du durch den Wechsel in den Eco Modus sparen kannst.';
+
+const faqData = [
+  {
+    question: 'Wie viel kostet ein Waschmaschinengang?',
+    answer:
+      'Ein typischer Eco 40C Gang verbraucht etwa 0,45 kWh Strom und 40 Liter Wasser. Bei durchschnittlichen europäischen Preisen kostet das etwa 0,10 bis 0,15 Euro pro Ladung. Ein intensiver 60C Gang kann über 1,2 kWh und 70 Liter verbrauchen und die Kosten auf über 0,30 Euro pro Ladung treiben.',
+  },
+  {
+    question: 'Ist es günstiger, den Geschirrspüler nachts laufen zu lassen?',
+    answer:
+      'Wenn dein Stromanbieter Tarife mit Zeitunterscheidung verwendet, kann das Laufenlassen des Geschirrspülers in Schwachlastzeiten die Energiekosten um 30 Prozent oder mehr senken. Spitzenzeiten sind typischerweise an Wochentagen morgens und abends. Prüfe deinen Vertrag oder Daten deines intelligenten Zählers, um dein genaues Schwachlastfenster zu bestätigen.',
+  },
+  {
+    question: 'Verbraucht der Trockner viel Strom?',
+    answer:
+      'Ja. Ein Wäschetrockner ist eines der energieintensivsten Haushaltsgeräte. Eine einzelne volle Ladung kann 2,5 bis 3,5 kWh verbrauchen und 0,50 bis 0,80 Euro pro Waschgang kosten. Die Verwendung eines Wärmepumpentrockners oder das Wäschetrocknen im Freien kann diese Kosten um 60 bis 80 Prozent senken.',
+  },
+  {
+    question: 'Wie viel Wasser verbraucht ein Geschirrspüler?',
+    answer:
+      'Moderne Geschirrspüler sind erstaunlich effizient. Ein standardmäßiger Eco Gang verwendet nur 8 bis 12 Liter Wasser pro Ladung, während ein Intensivprogramm 14 bis 16 Liter verwenden kann. Das ist viel weniger als das Abwaschen der gleichen Geschirrmenge von Hand unter fließendem Wasser, was typischerweise 40 bis 60 Liter verbraucht.',
+  },
+  {
+    question: 'Wann ist die günstigste Zeit, um Geräte zu benutzen?',
+    answer:
+      'Bei Tarifen mit Zeitunterscheidung sind die günstigsten Zeiträume normalerweise spät in der Nacht, sehr früh am Morgen und an Wochenenden. Diese Schwachlastzeiten können 30 bis 50 Prozent günstiger sein als Spitzenzeiten an Wochentagen. Einige Anbieter bieten auch kostenlose Stunden an Wochenenden an.',
+  },
+  {
+    question: 'Spart der Wechsel in den Eco Modus wirklich Geld?',
+    answer:
+      'Absolut. Eco Modi verwenden niedrigere Temperaturen, kürzere Heizphasen und weniger Wasser. Über ein ganzes Jahr gesehen kann der Wechsel von Normal zu Eco bei Waschmaschine und Geschirrspüler 50 bis 100 Euro an Strom und Wasser zusammen sparen, je nach Nutzungshäufigkeit und lokalen Preisen.',
+  },
+];
+
+const howToData = [
+  {
+    name: 'Wähle dein Gerät',
+    text: 'Tippe auf das Symbol der Waschmaschine, des Geschirrspülers oder des Wäschetrockners oben im Rechner. Jedes Gerät hat unterschiedliche Profile für Energie und Wasserverbrauch.',
+  },
+  {
+    name: 'Wähle einen Waschgang',
+    text: 'Verwende den Eco, Normal oder Intensiv Schieberegler, um das Waschprogramm einzustellen. Eco verwendet weniger Energie und Wasser. Intensiv verwendet am meisten.',
+  },
+  {
+    name: 'Gib deine lokalen Preise ein',
+    text: 'Tippe deinen Strompreis pro kWh und deinen Wasserpreis pro Liter ein. Du findest diese auf deiner Nebenkostenabrechnung oder der Webseite deines Anbieters.',
+  },
+  {
+    name: 'Lege die Nutzungshäufigkeit fest',
+    text: 'Gib an, wie viele Waschgänge du pro Woche machst. Damit kann der Rechner deine jährlichen Kosten und potenziellen Jahresersparnisse schätzen.',
+  },
+  {
+    name: 'Wähle die Nutzungsstunde',
+    text: 'Wähle die Stunde, in der du das Gerät laufen lassen möchtest. Spitzenzeiten sind rot markiert. Schwachlastzeiten sind grün und günstiger, wenn du einen Tarif mit Zeitunterscheidung hast.',
+  },
+  {
+    name: 'Schalte Waschmittelkosten zu',
+    text: 'Aktiviere den Waschmittel Schalter, wenn du möchtest, dass die Quittung einen Schätzwert für Pulver, Flüssigkeit oder Kapseln pro Waschgang enthält.',
+  },
+];
+
+const faqSchema: WithContext<FAQPage> = {
+  '@context': 'https://schema.org',
+  '@type': 'FAQPage',
+  mainEntity: faqData.map((item) => ({
+    '@type': 'Question',
+    name: item.question,
+    acceptedAnswer: { '@type': 'Answer', text: item.answer },
+  })),
+};
+
+const howToSchema: WithContext<HowTo> = {
+  '@context': 'https://schema.org',
+  '@type': 'HowTo',
+  name: title,
+  description,
+  step: howToData.map((step) => ({
+    '@type': 'HowToStep',
+    name: step.name,
+    text: step.text,
+  })),
+};
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilityApplication',
+  operatingSystem: 'All',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'de',
+};
+
+export const content: ToolLocaleContent<ApplianceCostCalculatorUI> = {
+  slug,
+  title,
+  description,
+  faq: faqData,
+  bibliography,
+  howTo: howToData,
+  schemas: [faqSchema, howToSchema, appSchema],
+  seo: [
+    {
+      type: 'title',
+      text: 'Die verborgenen Kosten jeder Ladung',
+      level: 2,
+    },
+    {
+      type: 'paragraph',
+      html: 'Die meisten Menschen haben keine Ahnung, wie viel ein einzelner Waschmaschinengang tatsächlich kostet. Sie sehen eine vierteljährliche Stromrechnung und nehmen an, dass Geräte billig im Betrieb sind. In Wirklichkeit kann eine Familie, die fünf Waschgänge pro Woche macht, über 200 Euro pro Jahr nur für Wäsche ausgeben. Addiere den Geschirrspüler drei Mal pro Woche und den Wäschetrockner zwei Mal pro Woche und die Summe steigt auf über 500 Euro jährlich. Dieser Rechner zerlegt jeden Cent, damit du deine Gewohnheiten optimieren kannst.',
+    },
+    {
+      type: 'stats',
+      items: [
+        { value: '0,45', label: 'kWh Eco Waschgang', icon: 'mdi:washing-machine' },
+        { value: '40L', label: 'Wasser Eco Waschgang', icon: 'mdi:water' },
+        { value: '30%', label: 'Spitzenaufschlag', icon: 'mdi:lightning-bolt' },
+      ],
+      columns: 3,
+    },
+    {
+      type: 'title',
+      text: 'Warum sich kleine Änderungen multiplizieren',
+      level: 3,
+    },
+    {
+      type: 'paragraph',
+      html: 'Ein einzelnes Grad Temperatur oder ein paar Liter Wasser erscheinen für einen Waschgang unwichtig. Aber über 250 Waschgänge pro Jahr summieren sich diese kleinen Unterschiede zu einem beträchtlichen Betrag. Das Senken von 60C auf 40C reduziert den Energieverbrauch um etwa 40 Prozent pro Ladung. Der Wechsel von Normal zu Eco bei einem Geschirrspüler spart jedes Mal etwa 3 Liter Wasser und 0,3 kWh. Das sind keine marginalen Gewinne. Das ist der schnellste Weg, deine Nebenkosten zu senken, ohne neue Geräte zu kaufen.',
+    },
+    {
+      type: 'comparative',
+      items: [
+        {
+          title: 'Intensiver Waschgang',
+          description: 'Maximale Hitze und Wasser für stark verschmutzte Ladungen.',
+          icon: 'mdi:alert',
+          points: ['1,2 bis 3,5 kWh pro Ladung', '70 Liter für Waschmaschinen', 'Spitzenzeitaufschlag gilt', 'Höchste Jahreskosten'],
+        },
+        {
+          title: 'Eco Waschgang',
+          description: 'Niedrigere Temperatur, optimierte Dauer, minimales Wasser.',
+          icon: 'mdi:check-circle',
+          points: ['0,45 bis 1,5 kWh pro Ladung', 'Nur 8 bis 40 Liter', 'Schwachlastzeiten nutzbar', 'Niedrigste Jahreskosten'],
+        },
+      ],
+      columns: 2,
+    },
+    {
+      type: 'diagnostic',
+      variant: 'info',
+      title: 'Schnelle Geräteprüfung',
+      icon: 'mdi:clipboard-check',
+      badge: 'Aktion',
+      html: '<p style="margin:0">Lass die Waschmaschine nur mit voller Ladung laufen. Verwende das Eco Programm für normale Verschmutzung. Stelle deinen Geschirrspüler auf verzögerten Start nach 22:00 Uhr ein, wenn du einen Tarif mit Zeitunterscheidung hast. Reinige das Flusensieb des Trockners nach jedem Waschgang, um die Effizienz zu erhalten. Trockne die Wäsche im Freien oder auf einem Wäscheständer, wann immer das Wetter es erlaubt.</p>',
+    },
+    {
+      type: 'title',
+      text: 'Zeitunterscheidung und Spitzenpreise',
+      level: 3,
+    },
+    {
+      type: 'paragraph',
+      html: 'Viele Stromanbieter berechnen unterschiedliche Tarife je nach Tageszeit. Spitzenperioden, normalerweise an Wochentagen morgens und abends, können 30 bis 50 Prozent mehr kosten als Schwachlastperioden. Eine Ladung, die um 20:00 Uhr läuft, kann 0,18 Euro kosten, während dieselbe Ladung um 02:00 Uhr nur 0,12 Euro kostet. Über ein Jahr richtig geplant kann das 50 bis 100 Euro sparen, ohne sonst etwas zu ändern. Dieser Rechner markiert Spitzenzeiten rot und Schwachlastzeiten grün, damit du im Voraus planen kannst.',
+    },
+    {
+      type: 'summary',
+      title: 'So senkst du Gerätekosten',
+      items: [
+        'Nutze diesen Rechner, um die wahren Kosten pro Waschgang für deine Geräte zu finden.',
+        'Wechsle wann immer möglich in den Eco Modus, um bis zu 40 Prozent Energie zu sparen.',
+        'Lass volle Ladungen laufen, anstatt Teilladungen, um die Effizienz zu maximieren.',
+        'Verschiebe Waschgänge in Schwachlastzeiten, wenn dein Tarif zeitabhängige Preise unterstützt.',
+        'Trockne die Wäsche im Freien, anstatt den Wäschetrockner zu nutzen, um seine Kosten ganz zu eliminieren.',
+        'Reinige Filter und entkalkte regelmäßig, damit die Geräte mit der angegebenen Effizienz laufen.',
+      ],
+    },
+  ],
+  ui: {
+    labelAppliance: 'Gerät',
+    applianceWasher: 'Waschmaschine',
+    applianceDishwasher: 'Geschirrspüler',
+    applianceDryer: 'Wäschetrockner',
+    labelCycle: 'Programm',
+    cycleEco: 'Eco',
+    cycleNormal: 'Normal',
+    cycleIntensive: 'Intensiv',
+    labelElectricityPrice: 'Strompreis',
+    unitPriceKwh: '€/kWh',
+    labelWaterPrice: 'Wasserpreis',
+    unitPriceLiter: '€/L',
+    labelDetergent: 'Waschmittel',
+    labelDetergentToggle: 'Waschmittelkosten einbeziehen',
+    labelHour: 'Geplante Stunde',
+    peakBadge: 'Spitzenzeit aktiv',
+    offPeakBadge: 'Schwachlastzeit',
+    receiptTitle: 'Kostenaufschlüsselung',
+    receiptElectricity: 'Strom',
+    receiptWater: 'Wasser',
+    receiptDetergent: 'Waschmittel',
+    receiptTotal: 'Gesamt pro Waschgang',
+    receiptPerYear: 'Geschätzt pro Jahr',
+    comparisonTitle: 'Intelligenter Wechsel',
+    comparisonText: 'Der Wechsel von Normal zu Eco spart bei jeder Ladung Geld.',
+    comparisonSavings: 'Jährliche Ersparnis',
+    comparisonMonths: 'Monate Waschmittel',
+    badgePeak: 'Spitze',
+    badgeOffPeak: 'Schwachlast',
+    unitKwh: 'kWh',
+    unitLiters: 'L',
+    unitCycles: 'Jahr',
+    labelCyclesPerWeek: 'Waschgänge pro Woche',
+    currencySign: '€',
+    labelCurrency: 'Währung',
+    btnCurrUSD: '$',
+    btnCurrEUR: '€',
+    btnCurrGBP: '£',
+    btnCurrJPY: '¥',
+  },
+};