Add locations

This commit is contained in:
BlipRanger
2024-08-31 11:44:20 -04:00
parent 691448fab3
commit 63dfe85832
5 changed files with 306 additions and 85 deletions

97
public/library.html Normal file
View File

@@ -0,0 +1,97 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Book Library</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
th, td {
padding: 10px;
text-align: left;
border-bottom: 1px solid #ddd;
}
th {
background-color: #f2f2f2;
}
#search-bar {
width: 100%;
padding: 10px;
font-size: 16px;
margin-top: 20px;
border: 1px solid #ddd;
}
</style>
</head>
<body>
<h1>Book Library</h1>
<input type="text" id="search-bar" placeholder="Search by title, author, publisher, etc.">
<table id="book-table">
<thead>
<tr>
<th>Title</th>
<th>Authors</th>
<th>Publisher</th>
<th>Published Date</th>
<th>ISBN</th>
</tr>
</thead>
<tbody id="book-table-body">
<!-- Book rows will be inserted here -->
</tbody>
</table>
<script>
// Fetch all books when the page loads
window.onload = fetchBooks;
document.getElementById('search-bar').addEventListener('input', function() {
fetchBooks(this.value);
});
function fetchBooks(query = '') {
let url = '/search-title';
if (query) {
url += `?title=${encodeURIComponent(query)}&internalOnly=true`;
}
fetch(url)
.then(response => response.json())
.then(data => {
if (data.results) {
displayBooks(data.results);
} else {
document.getElementById('book-table-body').innerHTML = '<tr><td colspan="5">No books found</td></tr>';
}
})
.catch(error => console.error('Error fetching books:', error));
}
function displayBooks(books) {
console.debug('Books:', books);
const tbody = document.getElementById('book-table-body');
tbody.innerHTML = '';
books.forEach(book => {
const row = document.createElement('tr');
row.innerHTML = `
<td>${book.title || ''}</td>
<td>${book.authors ? book.authors : ''}</td>
<td>${book.publisher || ''}</td>
<td>${book.publish_date || ''}</td>
<td>${book.isbn || ''}</td>
`;
tbody.appendChild(row);
});
}
</script>
</body>
</html>

View File

@@ -46,7 +46,7 @@ function startScanner() {
alert('No camera selected or available.');
return;
}
// TODO: Limit the field of view to a smaller area for faster detection
Quagga.init({
inputStream: {
name: "Live",
@@ -68,7 +68,11 @@ function startScanner() {
}
console.log("Initialization finished. Ready to start");
Quagga.start();
// TODO: Add a button to enable/disable torch
Quagga.CameraAccess.enableTorch();
// TODO: Add a button to enable/disable the "locate" functionality
});
Quagga.onDetected(async function (data) {
@@ -79,6 +83,9 @@ function startScanner() {
console.log("Detected ISBN:", isbn);
Quagga.stop(); // Stop the scanner once an ISBN is detected
// TODO: Validate the ISBN before fetching book details
// Use a library like barcode-validator to validate the ISBN
// Fetch book details
await fetchBookInfo(isbn);
@@ -91,6 +98,10 @@ async function fetchBookInfo(isbn) {
const response = await fetch(`/book/${isbn}`);
const bookData = await response.json();
// TODO: If bookData value of "source" is "local", then the book data is already in the database
// TODO: Display the book info and ask if they would like to checkout the book
// TODO: Store scanned ISBN in a different field to check against the one we get from the API
if (bookData.title) {
bookData.isbn2 = isbn; // Add the ISBN to the book data
promptUserWithBook(bookData);
@@ -125,6 +136,9 @@ function promptUserWithBook(bookData) {
}
}
// TODO: Function to prompt user for physical location of the book
// Should pull from the database and allow the user to select or add a location
// Add an event listener for the search button
document.getElementById('search-title').addEventListener('click', searchByTitle);