Restructure i18n.js: English is base, keys are English text

This commit is contained in:
Richard Zink committed 2026-10-07 13:02:29 +02:00
1 parent ecc3156652
commit 66ca03ade4
2 files changed
+47 -47

No files matched your search

+33 -33
View File
@@ -1,51 +1,51 @@
/* Internationalization dictionary /* Internationalization dictionary
* *
* Each key maps to an array of translations indexed by language code. * Each key is the ENGLISH text. To add a new language, just add
* To add a new language, add an entry with the language code as the key * a translation under the language's two-letter code (e.g. de, it, fr).
* and translations for each existing key.
* *
* Example: * Example:
* TRANSLATIONS.title = { de: 'Titel', en: 'Title' }; * TRANSLATIONS['Sunrise'] = { en: 'Sunrise', de: 'Aufgang', it: 'Alba' };
* *
* The current language is taken from window.CONFIG.language. * The current language is taken from window.CONFIG.language.
* Fallback order: requested language → 'en' → first available → key.
*/ */
window.TRANSLATIONS = { window.TRANSLATIONS = {
'Aufgang': { de: 'Aufgang', en: 'Sunrise' }, 'Sunrise': { en: 'Sunrise', de: 'Aufgang' },
'Untergang': { de: 'Untergang', en: 'Sunset' }, 'Sunset': { en: 'Sunset', de: 'Untergang' },
'Zenit Sonne': { de: 'Zenit Sonne', en: 'Sun Zenith' }, 'Sun Zenith': { en: 'Sun Zenith', de: 'Zenit Sonne' },
'Mondphase': { de: 'Mondphase', en: 'Moon Phase' }, 'Moon Phase': { en: 'Moon Phase', de: 'Mondphase' },
'Mond auf': { de: 'Mond auf', en: 'Moonrise' }, 'Moonrise': { en: 'Moonrise', de: 'Mond auf' },
'Mond unter': { de: 'Mond unter', en: 'Moonset' }, 'Moonset': { en: 'Moonset', de: 'Mond unter' },
'heute': { de: 'heute', en: 'today' }, 'today': { en: 'today', de: 'heute' },
'morgen': { de: 'morgen', en: 'tomorrow' }, 'tomorrow': { en: 'tomorrow', de: 'morgen' },
'Neumond': { de: 'Neumond', en: 'New Moon' }, 'New Moon': { en: 'New Moon', de: 'Neumond' },
'Zunehm. Sichel': { de: 'Zunehm. Sichel', en: 'Waxing Crescent' }, 'Waxing Crescent': { en: 'Waxing Crescent', de: 'Zunehm. Sichel' },
'Erstes Viertel': { de: 'Erstes Viertel', en: 'First Quarter' }, 'First Quarter': { en: 'First Quarter', de: 'Erstes Viertel' },
'Zunehm. Gibbous': { de: 'Zunehm. Gibbous', en: 'Waxing Gibbous' }, 'Waxing Gibbous': { en: 'Waxing Gibbous', de: 'Zunehm. Gibbous' },
'Vollmond': { de: 'Vollmond', en: 'Full Moon' }, 'Full Moon': { en: 'Full Moon', de: 'Vollmond' },
'Abnehm. Gibbous': { de: 'Abnehm. Gibbous', en: 'Waning Gibbous' }, 'Waning Gibbous': { en: 'Waning Gibbous', de: 'Abnehm. Gibbous' },
'Letztes Viertel': { de: 'Letztes Viertel', en: 'Last Quarter' }, 'Last Quarter': { en: 'Last Quarter', de: 'Letztes Viertel' },
'Abnehm. Sichel': { de: 'Abnehm. Sichel', en: 'Waning Crescent' }, 'Waning Crescent': { en: 'Waning Crescent', de: 'Abnehm. Sichel' },
'Mo.': { de: 'Mo.', en: 'Mo.' }, 'Mo.': { en: 'Mo.', de: 'Mo.' },
'Di.': { de: 'Di.', en: 'Tu.' }, 'Tu.': { en: 'Tu.', de: 'Di.' },
'Mi.': { de: 'Mi.', en: 'We.' }, 'We.': { en: 'We.', de: 'Mi.' },
'Do.': { de: 'Do.', en: 'Th.' }, 'Th.': { en: 'Th.', de: 'Do.' },
'Fr.': { de: 'Fr.', en: 'Fr.' }, 'Fr.': { en: 'Fr.', de: 'Fr.' },
'Sa.': { de: 'Sa.', en: 'Sa.' }, 'Sa.': { en: 'Sa.', de: 'Sa.' },
'So.': { de: 'So.', en: 'Su.' }, 'Su.': { en: 'Su.', de: 'So.' },
'Feuchte': { de: 'Feuchte', en: 'Humidity' }, 'Humidity': { en: 'Humidity', de: 'Feuchte' },
'Wind': { de: 'Wind', en: 'Wind' }, 'Wind': { en: 'Wind', de: 'Wind' },
// 2-letter time-of-day labels // 2-letter time-of-day labels
'Morgen': { de: 'Mo', en: 'Mo' }, 'Morning': { en: 'Mo', de: 'Mo' },
'Mittag': { de: 'Mi', en: 'No' }, 'Noon': { en: 'No', de: 'Mi' },
'Abend': { de: 'Ab', en: 'Ev' }, 'Evening': { en: 'Ev', de: 'Ab' },
'Nacht': { de: 'Na', en: 'Ni' } 'Night': { en: 'Ni', de: 'Na' }
}; };
window.getTranslation = function(key) { window.getTranslation = function(key) {
+14 -14
View File
@@ -412,37 +412,37 @@
<div class="info-icon"> <div class="info-icon">
<svg viewBox="0 0 24 24" fill="var(--orange)"><circle cx="12" cy="12" r="4"/><g stroke="var(--orange)" stroke-width="2" stroke-linecap="round"><line x1="12" y1="2" x2="12" y2="5"/><line x1="12" y1="19" x2="12" y2="22"/><line x1="2" y1="12" x2="5" y2="12"/><line x1="19" y1="12" x2="22" y2="12"/><line x1="4.9" y1="4.9" x2="6.9" y2="6.9"/><line x1="17.1" y1="17.1" x2="19.1" y2="19.1"/><line x1="4.9" y1="19.1" x2="6.9" y2="17.1"/><line x1="17.1" y1="6.9" x2="19.1" y2="4.9"/></g></svg> <svg viewBox="0 0 24 24" fill="var(--orange)"><circle cx="12" cy="12" r="4"/><g stroke="var(--orange)" stroke-width="2" stroke-linecap="round"><line x1="12" y1="2" x2="12" y2="5"/><line x1="12" y1="19" x2="12" y2="22"/><line x1="2" y1="12" x2="5" y2="12"/><line x1="19" y1="12" x2="22" y2="12"/><line x1="4.9" y1="4.9" x2="6.9" y2="6.9"/><line x1="17.1" y1="17.1" x2="19.1" y2="19.1"/><line x1="4.9" y1="19.1" x2="6.9" y2="17.1"/><line x1="17.1" y1="6.9" x2="19.1" y2="4.9"/></g></svg>
</div> </div>
<div class="info-content"><span class="info-label" data-i18n="Aufgang">Aufgang</span><span><span class="info-value" id="sunrise-value">--:--</span><span class="info-sub" id="sunrise-when"></span></span></div> <div class="info-content"><span class="info-label" data-i18n="Sunrise">Sunrise</span><span><span class="info-value" id="sunrise-value">--:--</span><span class="info-sub" id="sunrise-when"></span></span></div>
</div> </div>
<div class="info-row"> <div class="info-row">
<div class="info-icon"> <div class="info-icon">
<svg viewBox="0 0 24 24" fill="var(--orange)"><circle cx="12" cy="12" r="4"/><line x1="12" y1="12" x2="12" y2="3" stroke="var(--orange)" stroke-width="2"/></svg> <svg viewBox="0 0 24 24" fill="var(--orange)"><circle cx="12" cy="12" r="4"/><line x1="12" y1="12" x2="12" y2="3" stroke="var(--orange)" stroke-width="2"/></svg>
</div> </div>
<div class="info-content"><span class="info-label" data-i18n="Zenit Sonne">Zenit Sonne</span><span><span class="info-value" id="sun-zenith-value">--:--</span><span class="info-sub" id="sun-zenith-when"></span></span></div> <div class="info-content"><span class="info-label" data-i18n="Sun Zenith">Sun Zenith</span><span><span class="info-value" id="sun-zenith-value">--:--</span><span class="info-sub" id="sun-zenith-when"></span></span></div>
</div> </div>
<div class="info-row"> <div class="info-row">
<div class="info-icon"> <div class="info-icon">
<svg viewBox="0 0 24 24" fill="none" stroke="var(--orange)" stroke-width="2"><path d="M3 12 A9 9 0 0 1 21 12 Z"/></svg> <svg viewBox="0 0 24 24" fill="none" stroke="var(--orange)" stroke-width="2"><path d="M3 12 A9 9 0 0 1 21 12 Z"/></svg>
</div> </div>
<div class="info-content"><span class="info-label" data-i18n="Untergang">Untergang</span><span><span class="info-value" id="sunset-value">--:--</span><span class="info-sub" id="sunset-when"></span></span></div> <div class="info-content"><span class="info-label" data-i18n="Sunset">Sunset</span><span><span class="info-value" id="sunset-value">--:--</span><span class="info-sub" id="sunset-when"></span></span></div>
</div> </div>
<div class="info-row"> <div class="info-row">
<div class="info-icon"> <div class="info-icon">
<svg id="moon-phase-icon" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9" fill="var(--dark)"/></svg> <svg id="moon-phase-icon" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9" fill="var(--dark)"/></svg>
</div> </div>
<div class="info-content"><span class="info-label" data-i18n="Mondphase">Mondphase</span><span class="info-value" id="moon-phase-text">--</span></div> <div class="info-content"><span class="info-label" data-i18n="Moon Phase">Moon Phase</span><span class="info-value" id="moon-phase-text">--</span></div>
</div> </div>
<div class="info-row"> <div class="info-row">
<div class="info-icon"> <div class="info-icon">
<svg viewBox="0 0 24 24" fill="var(--icon)"><path d="M12 2 a10 10 0 1 0 0 20 a8 8 0 1 1 0 -16 a6 6 0 1 1 0 8"/></svg> <svg viewBox="0 0 24 24" fill="var(--icon)"><path d="M12 2 a10 10 0 1 0 0 20 a8 8 0 1 1 0 -16 a6 6 0 1 1 0 8"/></svg>
</div> </div>
<div class="info-content"><span class="info-label" data-i18n="Mond auf">Mond auf</span><span><span class="info-value" id="moonrise-value">--:--</span><span class="info-sub" id="moonrise-when"></span></span></div> <div class="info-content"><span class="info-label" data-i18n="Moonrise">Moonrise</span><span><span class="info-value" id="moonrise-value">--:--</span><span class="info-sub" id="moonrise-when"></span></span></div>
</div> </div>
<div class="info-row"> <div class="info-row">
<div class="info-icon"> <div class="info-icon">
<svg viewBox="0 0 24 24" fill="none" stroke="var(--icon)" stroke-width="2"><path d="M3 12 A9 9 0 0 1 21 22 Z"/></svg> <svg viewBox="0 0 24 24" fill="none" stroke="var(--icon)" stroke-width="2"><path d="M3 12 A9 9 0 0 1 21 22 Z"/></svg>
</div> </div>
<div class="info-content"><span class="info-label" data-i18n="Mond unter">Mond unter</span><span><span class="info-value" id="moonset-value">--:--</span><span class="info-sub" id="moonset-when"></span></span></div> <div class="info-content"><span class="info-label" data-i18n="Moonset">Moonset</span><span><span class="info-value" id="moonset-value">--:--</span><span class="info-sub" id="moonset-when"></span></span></div>
</div> </div>
<div id="weather-divider" class="weather-divider"></div> <div id="weather-divider" class="weather-divider"></div>
<div id="weather-current" class="weather-current"></div> <div id="weather-current" class="weather-current"></div>
@@ -834,7 +834,7 @@ var effect = (VANTA.CLOUDS2 || VANTA.CLOUDS)({
var times = type.indexOf('moon') === 0 ? SunCalc.getMoonTimes(nextDate, lat, lon) : SunCalc.getTimes(nextDate, lat, lon); var times = type.indexOf('moon') === 0 ? SunCalc.getMoonTimes(nextDate, lat, lon) : SunCalc.getTimes(nextDate, lat, lon);
var ev = type === 'moonrise' ? times.rise : type === 'moonset' ? times.set : times[type]; var ev = type === 'moonrise' ? times.rise : type === 'moonset' ? times.set : times[type];
if (ev && !isNaN(ev.getTime())) { if (ev && !isNaN(ev.getTime())) {
var dayLabel = d === 1 ? t('morgen') : formatDateLong(nextDate); var dayLabel = d === 1 ? t('tomorrow') : formatDateLong(nextDate);
return { date: ev, label: dayLabel }; return { date: ev, label: dayLabel };
} }
} }
@@ -843,8 +843,8 @@ var effect = (VANTA.CLOUDS2 || VANTA.CLOUDS)({
function getMoonPhaseText(phase) { function getMoonPhaseText(phase) {
var p = phase; var p = phase;
var keys = ['Neumond', 'Zunehm. Sichel', 'Erstes Viertel', 'Zunehm. Gibbous', var keys = ['New Moon', 'Waxing Crescent', 'First Quarter', 'Waxing Gibbous',
'Vollmond', 'Abnehm. Gibbous', 'Letztes Viertel', 'Abnehm. Sichel']; 'Full Moon', 'Waning Gibbous', 'Last Quarter', 'Waning Crescent'];
var idx; var idx;
if (p < 0.0625 || p >= 0.9375) idx = 0; if (p < 0.0625 || p >= 0.9375) idx = 0;
else if (p < 0.1875) idx = 1; else if (p < 0.1875) idx = 1;
@@ -1042,7 +1042,7 @@ var effect = (VANTA.CLOUDS2 || VANTA.CLOUDS)({
// Sun zenith (solar noon) - find next occurrence // Sun zenith (solar noon) - find next occurrence
var sunZenith = sunTimes.solarNoon; var sunZenith = sunTimes.solarNoon;
var sunZenithWhen = sunZenith > now ? t('heute') : t('morgen'); var sunZenithWhen = sunZenith > now ? t('today') : t('tomorrow');
if (sunZenith <= now) { if (sunZenith <= now) {
var tomorrow = new Date(now); var tomorrow = new Date(now);
tomorrow.setDate(tomorrow.getDate() + 1); tomorrow.setDate(tomorrow.getDate() + 1);
@@ -1590,16 +1590,16 @@ window.weatherThemes = {
var currentHtml = '<div class="weather-current-icon">' + weatherSVG(current.weather_code) + '</div>' + var currentHtml = '<div class="weather-current-icon">' + weatherSVG(current.weather_code) + '</div>' +
'<div><div class="weather-current-temp">' + Math.round(current.temperature_2m) + '°C</div>' + '<div><div class="weather-current-temp">' + Math.round(current.temperature_2m) + '°C</div>' +
'<div class="weather-current-detail">' + '<div class="weather-current-detail">' +
t('Feuchte') + ' ' + Math.round(current.relative_humidity_2m) + '% · ' + t('Wind') + ' ' + Math.round(current.wind_speed_10m) + ' km/h</div></div>'; t('Humidity') + ' ' + Math.round(current.relative_humidity_2m) + '% · ' + t('Wind') + ' ' + Math.round(current.wind_speed_10m) + ' km/h</div></div>';
document.getElementById('weather-current').innerHTML = currentHtml; document.getElementById('weather-current').innerHTML = currentHtml;
// Forecast // Forecast
var forecastHtml = ''; var forecastHtml = '';
for (var d = 0; d < 4; d++) { for (var d = 0; d < 4; d++) {
var dayDate = new Date(daily.time[d]); var dayDate = new Date(daily.time[d]);
var dayLabel = d === 0 ? t('heute') : t('morgen'); var dayLabel = d === 0 ? t('today') : t('tomorrow');
if (d > 1) { if (d > 1) {
var weekdayKey = ['So.', 'Mo.', 'Di.', 'Mi.', 'Do.', 'Fr.', 'Sa.'][dayDate.getDay()]; var weekdayKey = ['Su.', 'Mo.', 'Tu.', 'We.', 'Th.', 'Fr.', 'Sa.'][dayDate.getDay()];
dayLabel = t(weekdayKey) + ' ' + dayLabel = t(weekdayKey) + ' ' +
(dayDate.getDate() < 10 ? '0' : '') + dayDate.getDate() + '.' + (dayDate.getDate() < 10 ? '0' : '') + dayDate.getDate() + '.' +
(dayDate.getMonth() + 1 < 10 ? '0' : '') + (dayDate.getMonth() + 1) + '.'; (dayDate.getMonth() + 1 < 10 ? '0' : '') + (dayDate.getMonth() + 1) + '.';
@@ -1619,7 +1619,7 @@ window.weatherThemes = {
var slotIdx = findHourlyIndex(slotDate, hourly.time); var slotIdx = findHourlyIndex(slotDate, hourly.time);
var slotCode = hourly.weather_code[slotIdx]; var slotCode = hourly.weather_code[slotIdx];
var slotTemp = hourly.temperature_2m[slotIdx]; var slotTemp = hourly.temperature_2m[slotIdx];
var slotLabels = [t('Morgen'), t('Mittag'), t('Abend'), t('Nacht')]; var slotLabels = [t('Morning'), t('Noon'), t('Evening'), t('Night')];
slotsHtml += '<div class="weather-slot">' + slotsHtml += '<div class="weather-slot">' +
'<div class="weather-slot-icon">' + weatherSVG(slotCode) + '</div>' + '<div class="weather-slot-icon">' + weatherSVG(slotCode) + '</div>' +
'<div class="weather-slot-label">' + slotLabels[i] + '</div>' + '<div class="weather-slot-label">' + slotLabels[i] + '</div>' +