- Consolidated CSS and JS assets by moving them to local files (app.css, gsap.min.js, marked.min.js) - Removed livekit-client CDN dependency as it appears unused - Moved navbar logic to separate layout.js file for better organization - Changed navigation links to use hash-based routing (#chat, #drive, etc) - Removed redundant navbar template fetching in favor of static inclusion - Simplified HTML structure by removing commented code and redundant elements These changes improve maintainability and performance by reducing external dependencies and better organizing frontend assets.
56 lines
1.5 KiB
JavaScript
56 lines
1.5 KiB
JavaScript
class Layout {
|
|
static currentPage = 'chat';
|
|
|
|
static init() {
|
|
this.setCurrentPage();
|
|
this.loadNavbar();
|
|
this.setupNavigation();
|
|
}
|
|
|
|
static setCurrentPage() {
|
|
const hash = window.location.hash.substring(1) || 'chat';
|
|
this.currentPage = hash;
|
|
this.updateContent();
|
|
}
|
|
|
|
static async loadNavbar() {
|
|
try {
|
|
const response = await fetch('shared/navbar.html');
|
|
const html = await response.text();
|
|
|
|
if (!document.querySelector('.navbar')) {
|
|
document.body.insertAdjacentHTML('afterbegin', html);
|
|
}
|
|
|
|
document.querySelectorAll('.nav-link').forEach(link => {
|
|
link.classList.toggle('active', link.dataset.target === this.currentPage);
|
|
});
|
|
} catch (error) {
|
|
console.error('Failed to load navbar:', error);
|
|
}
|
|
}
|
|
|
|
static updateContent() {
|
|
// Add your content loading logic here
|
|
// For example: fetch(`pages/${this.currentPage}.html`)
|
|
// and update the main content area
|
|
}
|
|
|
|
static setupNavigation() {
|
|
document.addEventListener('click', (e) => {
|
|
const navLink = e.target.closest('.nav-link');
|
|
if (navLink) {
|
|
e.preventDefault();
|
|
const target = navLink.dataset.target;
|
|
window.location.hash = target;
|
|
this.currentPage = target;
|
|
this.loadNavbar();
|
|
this.updateContent();
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
// Initialize on load and also on navigation
|
|
Layout.init();
|
|
window.addEventListener('popstate', () => Layout.init());
|