Fix language switcher to maintain clean URLs and dynamic logo links

Changes:
- Logo and title links now start with clean URLs (href="/")
- Track if URL originally had lang parameter (urlHadLangParam variable)
- If URL had lang param: update URL when switching languages, update logo/title links dynamically
- If URL was clean: keep it clean, don't add lang to URL, keep logo/title links clean
- Logo/title links now update dynamically when language changes (no more stale language issue)
- Initialize logo/title links properly on page load based on URL state

This fixes both issues:
1. Logo clicking with wrong language after language switch
2. Clean URLs stay clean unless explicitly using ?lang= parameter
This commit is contained in:
juanatsap
2025-11-09 15:10:13 +00:00
parent 69d9dcad79
commit 624b6acac8
+25 -5
View File
@@ -99,7 +99,7 @@
<div class="action-bar-content">
<!-- Left: Site Title + Hamburger Menu + Language -->
<div class="site-title">
<a href="/?lang={{.Lang}}" class="site-logo-link" aria-label="Home">
<a href="/" class="site-logo-link" id="logoLink" aria-label="Home">
<iconify-icon icon="mdi:file-account" width="24" height="24" class="site-icon"></iconify-icon>
</a>
@@ -108,7 +108,7 @@
<iconify-icon icon="mdi:menu" width="24" height="24"></iconify-icon>
</button>
<a href="/?lang={{.Lang}}" class="site-title-link">
<a href="/" class="site-title-link" id="titleLink">
<span class="site-title-text">CV JAMR - {{.CurrentYear}}</span>
</a>
@@ -375,6 +375,9 @@
}
});
// Track if URL originally had lang parameter
const urlHadLangParam = new URLSearchParams(window.location.search).has('lang');
function selectLanguage(lang) {
// Update button states
document.querySelectorAll('.language-selector .selector-btn').forEach(btn => {
@@ -389,10 +392,20 @@
indicator: '#loading'
});
// Update URL
// Update URL only if it originally had lang parameter
const url = new URL(window.location);
url.searchParams.set('lang', lang);
window.history.pushState({}, '', url);
if (urlHadLangParam) {
url.searchParams.set('lang', lang);
window.history.pushState({}, '', url);
// Update logo and title links to include current language
document.getElementById('logoLink').href = `/?lang=${lang}`;
document.getElementById('titleLink').href = `/?lang=${lang}`;
} else {
// Keep URL clean, but update logo/title links to stay clean too
document.getElementById('logoLink').href = '/';
document.getElementById('titleLink').href = '/';
}
// Update html lang attribute
document.documentElement.lang = lang;
@@ -480,6 +493,13 @@
document.addEventListener('DOMContentLoaded', function() {
const paper = document.querySelector('.cv-paper');
// Initialize logo/title links based on whether URL has lang parameter
if (urlHadLangParam) {
const currentLang = new URLSearchParams(window.location.search).get('lang') || 'en';
document.getElementById('logoLink').href = `/?lang=${currentLang}`;
document.getElementById('titleLink').href = `/?lang=${currentLang}`;
}
// Restore CV length preference
const savedLength = localStorage.getItem('cv-length') || 'short';
if (savedLength === 'long') {