Ein Leben in wenigen Zeilen • Alexander Nevsky

22 DEC 1984 · BORN

Der 22. Dezember 1984 ist mein Geburtstag. Von diesem Datum an werden die gelebten Tage gezählt.

30 JUL 2022 · DUBAI

Am 30. Juli 2022 begann mein Leben in Dubai. Dieser Lebensabschnitt hat einen eigenen Zähler.

NOW

Das heutige Datum nach Dubai-Zeit, UTC+4. Es wechselt mit dem Kalender.

LIFE · DAY

Die Zahl der seit der Geburt vergangenen vollen Kalendertage. Der Geburtstag ist der Ausgangspunkt, Tag null.

DUBAI · DAY

Die Zahl der Tage seit dem Umzug nach Dubai.

OF LIFE · DUBAI

Die Tage in Dubai, geteilt durch alle gelebten Tage. So wird der Umzug im Maßstab des ganzen Lebens sichtbar.

Alle Tage ansehen

Der Code hinter diesen Zahlen

Diese Funktion zählt die gelebten Tage, die Tage in Dubai und ihren Anteil am Leben. Auch der Zähler oben verwendet sie. Kopiere dieses lauffähige Beispiel auf deine Seite und ersetze die beiden Datumsangaben durch deine eigenen. Kalendertage richten sich nach der Zeit in Dubai.

HTML + JavaScript

<output id="life-counter" aria-label="Zählercode"></output>
<script>
const lifeCounters = function lifeCounters(now, residency, birth, locale, units) {
	const parts = Object.fromEntries(new Intl.DateTimeFormat("en-CA", {
		timeZone: "Asia/Dubai",
		year: "numeric",
		month: "2-digit",
		day: "2-digit"
	}).formatToParts(now).map((p) => [p.type, p.value]));
	const day = Date.UTC(+parts.year, +parts.month - 1, +parts.day);
	const count = (date) => {
		if (!/^\d{4}-\d{2}-\d{2}$/.test(date || "")) throw new Error("Invalid counter date");
		return Math.floor((day - Date.parse(date + "T00:00:00Z")) / 864e5);
	};
	const dubai = count(residency), life = count(birth);
	if (!Number.isFinite(dubai) || !Number.isFinite(life) || dubai < 0 || life <= 0) throw new Error("Invalid counter range");
	const unit = (n) => units[new Intl.PluralRules(locale).select(n)] || units.other;
	const d = Object.fromEntries(new Intl.DateTimeFormat(locale, {
		timeZone: "Asia/Dubai",
		year: "numeric",
		month: "long",
		day: "numeric"
	}).formatToParts(now).map((p) => [p.type, p.value]));
	return {
		"data-current-date": ["ru", "en"].includes(locale.split("-")[0]) ? `${d.day} ${d.month} ${d.year}` : new Intl.DateTimeFormat(locale, {
			timeZone: "Asia/Dubai",
			dateStyle: "long"
		}).format(now),
		"data-dubai-day-counter": dubai.toLocaleString(locale),
		"data-life-day-counter": life.toLocaleString(locale),
		"data-dubai-day-unit": unit(dubai),
		"data-life-day-unit": unit(life),
		"data-dubai-life-share": (dubai / life * 100).toLocaleString(locale, {
			minimumFractionDigits: 2,
			maximumFractionDigits: 2
		}) + "%"
	};
};

function updateCounter() {
  const counters = lifeCounters(
    new Date(), '2022-07-30', '1984-12-22', 'en-US', {other: 'days'}
  );
  document.getElementById('life-counter').textContent = [
    'LIFE · DAY ' + counters['data-life-day-counter'],
    'DUBAI · DAY ' + counters['data-dubai-day-counter'],
    counters['data-dubai-life-share'] + ' OF LIFE · DUBAI'
  ].join(' / ');
}
updateCounter();
setInterval(updateCounter, 30000);
</script>