language switch functionality added
This commit is contained in:
ben7sys
@@ -145,36 +145,5 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Scroll behavior - only enable on index page
|
||||
if (window.location.pathname === '/' || window.location.pathname === '/index.html') {
|
||||
let lastScrollTop = 0;
|
||||
let scrollTimeout;
|
||||
|
||||
window.addEventListener('scroll', () => {
|
||||
if (scrollTimeout) {
|
||||
window.cancelAnimationFrame(scrollTimeout);
|
||||
}
|
||||
|
||||
scrollTimeout = window.requestAnimationFrame(() => {
|
||||
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
||||
|
||||
// Don't hide header when near top of page
|
||||
if (scrollTop < 100) {
|
||||
header.style.transform = 'translateY(0)';
|
||||
return;
|
||||
}
|
||||
|
||||
// Hide header on scroll down, show on scroll up
|
||||
if (scrollTop > lastScrollTop) {
|
||||
header.style.transform = 'translateY(-100%)';
|
||||
} else {
|
||||
header.style.transform = 'translateY(0)';
|
||||
}
|
||||
|
||||
lastScrollTop = scrollTop;
|
||||
});
|
||||
}, { passive: true });
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
80
public/js/language.js
Normal file
80
public/js/language.js
Normal file
@@ -0,0 +1,80 @@
|
||||
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;
|
||||
}
|
||||
});
|
||||
158
public/js/translations.js
Normal file
158
public/js/translations.js
Normal file
@@ -0,0 +1,158 @@
|
||||
const translations = {
|
||||
de: {
|
||||
meta: {
|
||||
description: "7SYS - Ihr Partner für maßgeschneiderte IT-Lösungen, Systemarchitekturen und digitale Souveränität. Persönliche Betreuung für nachhaltige IT-Infrastruktur.",
|
||||
title: "7SYS - Persönliche IT-Lösungen"
|
||||
},
|
||||
intro: {
|
||||
hero: "Ihr Partner für Digitale Souveränität",
|
||||
welcome: "Als Ihr persönlicher IT-Experte entwickle ich maßgeschneiderte und zukunftssichere Systemarchitekturen. Mit Expertise und Leidenschaft gestalte ich IT-Lösungen, die Ihr Unternehmen nachhaltig stärken und schützen.",
|
||||
quote: "Simplicity is a great virtue but it requires hard work to achieve it and education to appreciate it. And to make matters worse: complexity sells better. - Edsger Wybe Dijkstra (1930–2002)"
|
||||
},
|
||||
vision: {
|
||||
title: "Meine Vision",
|
||||
subtitle: "Digitale Souveränität",
|
||||
content: "Ich strebe eine Zukunft an, in der jedes Individuum die volle Kontrolle über ihre digitalen Ressourcen hat. Digitale Souveränität bedeutet für mich, eine sichere, unabhängige und datenschutzkonforme Nutzung moderner Technologien zu ermöglichen, bei der jede Person die Kontrolle über ihre Daten, Zugriffe und IT-Systeme behält, ohne von externen Anbietern oder unsicheren Lösungen abhängig zu sein."
|
||||
},
|
||||
mission: {
|
||||
title: "Meine Mission",
|
||||
subtitle: "Sichere und nachhaltige IT-Lösungen",
|
||||
content: "Meine Mission ist es, Sie auf dem Weg zur digitalen Souveränität kompetent zu begleiten."
|
||||
},
|
||||
services: {
|
||||
title: "Meine Expertise",
|
||||
consulting: {
|
||||
title: "Strategische IT-Beratung",
|
||||
intro: "Ich begleite Sie persönlich bei der Entwicklung und Umsetzung Ihrer IT-Strategien",
|
||||
items: [
|
||||
"Analyse Ihrer bestehenden Systeme und Situation mit Blick auf die Zukunft",
|
||||
"Individuelle Lösungen für Ihre Bedürfnisse",
|
||||
"Zukunftsorientierte Technologieberatung"
|
||||
]
|
||||
},
|
||||
administration: {
|
||||
title: "Systemadministration",
|
||||
intro: "Professionelle Verwaltung und Wartung Ihrer IT-Systeme",
|
||||
items: [
|
||||
"Server-Management",
|
||||
"Netzwerkadministration",
|
||||
"Backup-Konzepte",
|
||||
"Security-Lösungen"
|
||||
]
|
||||
},
|
||||
automation: {
|
||||
title: "Automatisierung",
|
||||
intro: "Automatisierte Lösungen für ausgewählte Prozesse, die Sie in Ihrer Organisation nutzen können, um Arbeiten sicher, effizient und konsistent zu gestalten.",
|
||||
items: [
|
||||
"Ansible, PowerShell, Bash",
|
||||
"N8N Workflows, Microsoft Power Automate"
|
||||
]
|
||||
},
|
||||
cloud: {
|
||||
title: "Self-Hosted & Cloud Solutions",
|
||||
items: [
|
||||
"Wartung von Cloud- oder Self-Hosted-Infrastrukturen",
|
||||
"Planung, Migration und Administration"
|
||||
]
|
||||
},
|
||||
core: {
|
||||
title: "Kernkompetenzen",
|
||||
items: [
|
||||
"Microsoft Infrastrukturen (M365, Azure, AD, Windows Server, DNS, DHCP)",
|
||||
"Linux-Server (RedHat or Debian based distributions)",
|
||||
"Virtualisierung (Proxmox, vSphere, Xen Server)",
|
||||
"Netzwerktechnik (Secure Point, Cisco, Mikrotik)",
|
||||
"Sicherheit (Firewalls, VPN, Antivirus, Backup)",
|
||||
"Automatisierung (Ansible, PowerShell, Bash)."
|
||||
]
|
||||
}
|
||||
},
|
||||
contact: {
|
||||
title: "Kontakt",
|
||||
message: "Ich freue mich darauf, Ihr Projekt kennenzulernen und mit Ihnen gemeinsam, an Ihrer digitalen Souveränität zu arbeiten."
|
||||
},
|
||||
footer: {
|
||||
signal: "Signal",
|
||||
imprint: "Impressum",
|
||||
privacy: "Datenschutz"
|
||||
}
|
||||
},
|
||||
en: {
|
||||
meta: {
|
||||
description: "7SYS - Your partner for customized IT solutions, system architectures, and digital sovereignty. Personal support for sustainable IT infrastructure.",
|
||||
title: "7SYS - Personal IT Solutions"
|
||||
},
|
||||
intro: {
|
||||
hero: "Your Partner for Digital Sovereignty",
|
||||
welcome: "As your personal IT expert, I develop customized and future-proof system architectures. With expertise and passion, I create IT solutions that sustainably strengthen and protect your business.",
|
||||
quote: "Simplicity is a great virtue but it requires hard work to achieve it and education to appreciate it. And to make matters worse: complexity sells better. - Edsger Wybe Dijkstra (1930–2002)"
|
||||
},
|
||||
vision: {
|
||||
title: "My Vision",
|
||||
subtitle: "Digital Sovereignty",
|
||||
content: "I envision a future where every individual has full control over their digital resources. For me, digital sovereignty means enabling secure, independent, and privacy-compliant use of modern technologies, where each person maintains control over their data, access, and IT systems without depending on external providers or insecure solutions."
|
||||
},
|
||||
mission: {
|
||||
title: "My Mission",
|
||||
subtitle: "Secure and Sustainable IT Solutions",
|
||||
content: "My mission is to competently guide you on your path to digital sovereignty."
|
||||
},
|
||||
services: {
|
||||
title: "My Expertise",
|
||||
consulting: {
|
||||
title: "Strategic IT Consulting",
|
||||
intro: "I personally accompany you in developing and implementing your IT strategies",
|
||||
items: [
|
||||
"Analysis of your existing systems and situation with a view to the future",
|
||||
"Individual solutions for your needs",
|
||||
"Future-oriented technology consulting"
|
||||
]
|
||||
},
|
||||
administration: {
|
||||
title: "System Administration",
|
||||
intro: "Professional management and maintenance of your IT systems",
|
||||
items: [
|
||||
"Server Management",
|
||||
"Network Administration",
|
||||
"Backup Concepts",
|
||||
"Security Solutions"
|
||||
]
|
||||
},
|
||||
automation: {
|
||||
title: "Automation",
|
||||
intro: "Automated solutions for selected processes that you can use in your organization to make work secure, efficient, and consistent.",
|
||||
items: [
|
||||
"Ansible, PowerShell, Bash",
|
||||
"N8N Workflows, Microsoft Power Automate"
|
||||
]
|
||||
},
|
||||
cloud: {
|
||||
title: "Self-Hosted & Cloud Solutions",
|
||||
items: [
|
||||
"Maintenance of cloud or self-hosted infrastructures",
|
||||
"Planning, migration, and administration"
|
||||
]
|
||||
},
|
||||
core: {
|
||||
title: "Core Competencies",
|
||||
items: [
|
||||
"Microsoft Infrastructures (M365, Azure, AD, Windows Server, DNS, DHCP)",
|
||||
"Linux Servers (RedHat or Debian based distributions)",
|
||||
"Virtualization (Proxmox, vSphere, Xen Server)",
|
||||
"Network Technology (Secure Point, Cisco, Mikrotik)",
|
||||
"Security (Firewalls, VPN, Antivirus, Backup)",
|
||||
"Automation (Ansible, PowerShell, Bash)."
|
||||
]
|
||||
}
|
||||
},
|
||||
contact: {
|
||||
title: "Contact",
|
||||
message: "I look forward to learning about your project and working with you together on your digital sovereignty."
|
||||
},
|
||||
footer: {
|
||||
signal: "Signal",
|
||||
imprint: "Legal Notice",
|
||||
privacy: "Privacy Policy"
|
||||
}
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user