jilo-web/public_html/static/sidebar.js

55 lines
1.9 KiB
JavaScript

document.addEventListener('DOMContentLoaded', function () {
var sidebar = document.getElementById('sidebar');
var mainContent = document.getElementById('mainContent');
var toggleButton = document.getElementById('toggleSidebarButton');
var timeNow = document.getElementById('time_now');
// update localStorage based on the current state
function updateStorage() {
var isSidebarCollapsed = sidebar.classList.contains('collapsed');
localStorage.setItem('sidebarState', isSidebarCollapsed ? 'collapsed' : 'expanded');
}
// apply saved state
function applySavedState() {
var savedState = localStorage.getItem('sidebarState');
if (savedState === 'collapsed') {
toggleButton.value = ">>";
toggleButton.textContent = ">>";
sidebar.classList.add('collapsed');
mainContent.classList.add('expanded');
timeNow.style.display = 'none';
} else {
toggleButton.value = "<<";
toggleButton.textContent = "<<";
sidebar.classList.remove('collapsed');
mainContent.classList.remove('expanded');
timeNow.style.display = 'block';
}
}
// Initialize
applySavedState();
toggleButton.addEventListener('click', function () {
// toggle sidebar and main content
sidebar.classList.toggle('collapsed');
document.documentElement.classList.toggle('sidebar-collapsed');
mainContent.classList.toggle('expanded');
// Toggle the value between ">>" and "<<"
if (toggleButton.value === ">>") {
toggleButton.value = "<<";
toggleButton.textContent = "<<";
timeNow.style.display = 'block';
} else {
toggleButton.value = ">>";
toggleButton.textContent = ">>";
timeNow.style.display = 'none';
}
// Update with the new state
updateStorage();
});
});