81 lines
2.6 KiB
JavaScript
81 lines
2.6 KiB
JavaScript
document.addEventListener('componentsLoaded', function() {
|
|
// Initialize language system
|
|
const defaultLang = 'de';
|
|
let currentLang = localStorage.getItem('preferredLanguage') || defaultLang;
|
|
|
|
// Initialize language switcher
|
|
initializeLanguageSwitcher();
|
|
updateContent();
|
|
updateHTMLLang(); // Ensure HTML lang attribute is set initially
|
|
|
|
function initializeLanguageSwitcher() {
|
|
const switcher = document.querySelector('.language-switcher');
|
|
if (!switcher) return;
|
|
|
|
// Set initial active state
|
|
updateButtonStates();
|
|
|
|
// Add click handlers
|
|
switcher.querySelectorAll('.lang-btn').forEach(btn => {
|
|
btn.addEventListener('click', () => {
|
|
const newLang = btn.dataset.lang;
|
|
if (newLang !== currentLang) {
|
|
currentLang = newLang;
|
|
localStorage.setItem('preferredLanguage', currentLang);
|
|
updateButtonStates();
|
|
updateContent();
|
|
updateHTMLLang();
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
function updateButtonStates() {
|
|
document.querySelectorAll('.lang-btn').forEach(btn => {
|
|
btn.classList.toggle('active', btn.dataset.lang === currentLang);
|
|
});
|
|
}
|
|
|
|
function updateHTMLLang() {
|
|
document.documentElement.setAttribute('lang', currentLang);
|
|
}
|
|
|
|
function updateContent() {
|
|
const elements = document.querySelectorAll('[data-i18n]');
|
|
elements.forEach(element => {
|
|
const key = element.dataset.i18n; // Fixed: using dataset.i18n instead of i18n
|
|
const translation = getTranslation(key);
|
|
if (translation !== undefined) {
|
|
if (element.tagName === 'META') {
|
|
element.setAttribute('content', translation);
|
|
} else {
|
|
element.innerHTML = translation;
|
|
}
|
|
}
|
|
});
|
|
|
|
// Update meta tags
|
|
updateMetaTags();
|
|
}
|
|
|
|
function updateMetaTags() {
|
|
document.title = translations[currentLang].meta.title;
|
|
const metaDescription = document.querySelector('meta[name="description"]');
|
|
if (metaDescription) {
|
|
metaDescription.setAttribute('content', translations[currentLang].meta.description);
|
|
}
|
|
}
|
|
|
|
function getTranslation(key) {
|
|
const keys = key.split('.');
|
|
let value = translations[currentLang];
|
|
|
|
for (const k of keys) {
|
|
if (value === undefined) return undefined;
|
|
value = value[k];
|
|
}
|
|
|
|
return value;
|
|
}
|
|
});
|