Enhance library management system with new features and improvements
- Updated `docker-compose.yml` to include `ADMIN_PASSWORD` environment variable for enhanced security. - Modified `index.js` to allow checkout requests to capture user names and improved email notifications with detailed information. - Added a new endpoint to fetch books currently on loan, providing better tracking of borrowed items. - Implemented a `list_books_on_loan` function in `libraryManager.py` to display books on loan in a formatted table. - Updated `models.js` to include an `approved` column in the `Checkout` model for tracking approval status. - Enhanced the user interface in `public/index.html` with a dark mode toggle and improved checkout request handling. - Updated styles in `public/styles.css` to support dark mode and improve overall aesthetics.
This commit is contained in:
@@ -7,6 +7,7 @@
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
</head>
|
||||
<body>
|
||||
<button id="dark-mode-toggle">🌙</button>
|
||||
<h1>Ramsey Library</h1>
|
||||
<input type="text" id="search-bar" placeholder="Search by title, author, publisher, etc.">
|
||||
|
||||
@@ -90,8 +91,12 @@ function setCookie(name, value, days) {
|
||||
|
||||
// Client-side function to request checkout
|
||||
function requestCheckout(isbn) {
|
||||
let email = getCookie('lastEmail') || prompt('Please enter your email:');
|
||||
let name = getCookie('lastName') || prompt('Please enter your name:');
|
||||
let email = getCookie('lastEmail') || '';
|
||||
let name = getCookie('lastName') || '';
|
||||
|
||||
// Prompt the user for email and name, pre-filling with existing values if available
|
||||
email = prompt('Please enter your email:', email);
|
||||
name = prompt('Please enter your name:', name);
|
||||
|
||||
if (!email || !name) {
|
||||
alert('Email and name are required to proceed with checkout.');
|
||||
@@ -142,6 +147,28 @@ function requestCheckout(isbn) {
|
||||
rows.forEach(row => table.tBodies[0].appendChild(row));
|
||||
table.setAttribute('data-sort-order', isAscending ? 'desc' : 'asc');
|
||||
}
|
||||
|
||||
// Dark mode toggle functionality
|
||||
const darkModeToggle = document.getElementById('dark-mode-toggle');
|
||||
const body = document.body;
|
||||
|
||||
// Check for saved user preference, if any, on load
|
||||
if (localStorage.getItem('darkMode') === 'enabled') {
|
||||
body.classList.add('dark-mode');
|
||||
darkModeToggle.textContent = '☀️'; // Set to sun icon if dark mode is enabled
|
||||
}
|
||||
|
||||
darkModeToggle.addEventListener('click', () => {
|
||||
body.classList.toggle('dark-mode');
|
||||
// Toggle icon
|
||||
if (body.classList.contains('dark-mode')) {
|
||||
darkModeToggle.textContent = '☀️'; // Sun icon
|
||||
localStorage.setItem('darkMode', 'enabled');
|
||||
} else {
|
||||
darkModeToggle.textContent = '🌙'; // Moon icon
|
||||
localStorage.setItem('darkMode', 'disabled');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user