42 lines
1.2 KiB
JavaScript
42 lines
1.2 KiB
JavaScript
const pages = {
|
|
home: { title: "welcome" },
|
|
contact: { title: "contact" },
|
|
links: { title: "links" },
|
|
sitemap: { title: "sitemap" }
|
|
};
|
|
|
|
function switchPage(pageKey) {
|
|
const page = pages[pageKey];
|
|
const template = document.getElementById('page-' + pageKey);
|
|
if (!page || !template) return;
|
|
|
|
const contentDiv = document.getElementById('page-content');
|
|
const toolbarTitle = document.getElementById('toolbar-title');
|
|
|
|
location.hash = pageKey === 'home' ? '' : pageKey;
|
|
|
|
contentDiv.style.opacity = 0;
|
|
|
|
setTimeout(() => {
|
|
contentDiv.innerHTML = '';
|
|
contentDiv.appendChild(template.content.cloneNode(true));
|
|
if (toolbarTitle) {
|
|
toolbarTitle.textContent = page.title;
|
|
toolbarTitle.setAttribute('data-text', page.title);
|
|
}
|
|
|
|
contentDiv.style.transition = 'opacity 0.3s ease';
|
|
contentDiv.style.opacity = 1;
|
|
}, 150);
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const hash = location.hash.replace('#', '');
|
|
switchPage(pages[hash] ? hash : 'home');
|
|
});
|
|
|
|
window.addEventListener('hashchange', () => {
|
|
const hash = location.hash.replace('#', '');
|
|
switchPage(pages[hash] ? hash : 'home');
|
|
});
|