Skip to content

Commit 1f0fe3e

Browse files
Shannon-ewingsudds-usaceShannon-ewingsudds-usace
committed
Added initial library system files
1 parent b69ef72 commit 1f0fe3e

3 files changed

Lines changed: 186 additions & 0 deletions

File tree

‎index.html‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Library Management</title>
7+
<link rel="stylesheet" href="styles.css">
8+
</head>
9+
<body>
10+
<header>
11+
<h1>Library Management System</h1>
12+
</header>
13+
<main>
14+
<section id="search-section">
15+
<input type="text" id="search-title" placeholder="Search by Title">
16+
<button id="search-button">Search</button>
17+
</section>
18+
<section id="filter-section">
19+
<select id="filter-status">
20+
<option value="">Filter by Status</option>
21+
<option value="Available">Available</option>
22+
<option value="Checked Out">Checked Out</option>
23+
</select>
24+
<input type="text" id="filter-user" placeholder="Filter by User">
25+
<button id="filter-button">Filter</button>
26+
</section>
27+
<section id="book-list">
28+
<h2>Books</h2>
29+
<ul id="books"></ul>
30+
</section>
31+
</main>
32+
<script src="script.js"></script>
33+
</body>
34+
</html>

‎library.css‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
/* styles.css */
2+
body {
3+
font-family: Arial, sans-serif;
4+
margin: 0;
5+
padding: 0;
6+
background-color: #f4f4f4;
7+
}
8+
9+
header {
10+
background-color: #0078d4;
11+
color: white;
12+
padding: 1rem;
13+
text-align: center;
14+
}
15+
16+
main {
17+
padding: 2rem;
18+
}
19+
20+
section {
21+
margin-bottom: 2rem;
22+
}
23+
24+
input, select, button {
25+
margin-right: 1rem;
26+
padding: 0.5rem;
27+
}
28+
29+
ul {
30+
list-style-type: none;
31+
padding: 0;
32+
}
33+
34+
li {
35+
background-color: white;
36+
margin-bottom: 1rem;
37+
padding: 1rem;
38+
border: 1px solid #ddd;
39+
}

‎script.js‎

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
// script.js
2+
3+
const siteUrl = "https://your-sharepoint-site-url";
4+
const listName = "YourListName";
5+
6+
// Fetch books from SharePoint
7+
async function fetchBooks() {
8+
const response = await fetch(`${siteUrl}/_api/web/lists/getbytitle('${listName}')/items`, {
9+
headers: {
10+
"Accept": "application/json;odata=verbose"
11+
}
12+
});
13+
const data = await response.json();
14+
return data.d.results;
15+
}
16+
17+
// Render books
18+
async function renderBooks() {
19+
const books = await fetchBooks();
20+
const bookList = document.getElementById("books");
21+
bookList.innerHTML = "";
22+
books.forEach(book => {
23+
const li = document.createElement("li");
24+
li.innerHTML = `
25+
<strong>${book.Book_Title}</strong> by ${book.Author} <br>
26+
Status: ${book.Status} <br>
27+
User: ${book.User || "N/A"} <br>
28+
<button onclick="checkOutBook(${book.ID})">Check Out</button>
29+
<button onclick="checkInBook(${book.ID})">Check In</button>
30+
`;
31+
bookList.appendChild(li);
32+
});
33+
}
34+
35+
// Check out a book
36+
async function checkOutBook(bookId) {
37+
const userName = prompt("Enter your name:");
38+
if (!userName) return alert("Name is required!");
39+
40+
await fetch(`${siteUrl}/_api/web/lists/getbytitle('${listName}')/items(${bookId})`, {
41+
method: "POST",
42+
headers: {
43+
"Accept": "application/json;odata=verbose",
44+
"Content-Type": "application/json;odata=verbose",
45+
"X-RequestDigest": document.getElementById("__REQUESTDIGEST").value
46+
},
47+
body: JSON.stringify({
48+
Status: "Checked Out",
49+
User: userName
50+
})
51+
});
52+
53+
alert("Book checked out successfully!");
54+
renderBooks();
55+
}
56+
57+
// Check in a book
58+
async function checkInBook(bookId) {
59+
await fetch(`${siteUrl}/_api/web/lists/getbytitle('${listName}')/items(${bookId})`, {
60+
method: "POST",
61+
headers: {
62+
"Accept": "application/json;odata=verbose",
63+
"Content-Type": "application/json;odata=verbose",
64+
"X-RequestDigest": document.getElementById("__REQUESTDIGEST").value
65+
},
66+
body: JSON.stringify({
67+
Status: "Available",
68+
User: ""
69+
})
70+
});
71+
72+
alert("Book checked in successfully!");
73+
renderBooks();
74+
}
75+
76+
// Search books
77+
document.getElementById("search-button").addEventListener("click", async () => {
78+
const title = document.getElementById("search-title").value.toLowerCase();
79+
const books = await fetchBooks();
80+
const filteredBooks = books.filter(book => book.Book_Title.toLowerCase().includes(title));
81+
renderFilteredBooks(filteredBooks);
82+
});
83+
84+
// Filter books
85+
document.getElementById("filter-button").addEventListener("click", async () => {
86+
const status = document.getElementById("filter-status").value;
87+
const user = document.getElementById("filter-user").value.toLowerCase();
88+
const books = await fetchBooks();
89+
const filteredBooks = books.filter(book => {
90+
return (!status || book.Status === status) && (!user || book.User.toLowerCase().includes(user));
91+
});
92+
renderFilteredBooks(filteredBooks);
93+
});
94+
95+
// Render filtered books
96+
function renderFilteredBooks(books) {
97+
const bookList = document.getElementById("books");
98+
bookList.innerHTML = "";
99+
books.forEach(book => {
100+
const li = document.createElement("li");
101+
li.innerHTML = `
102+
<strong>${book.Book_Title}</strong> by ${book.Author} <br>
103+
Status: ${book.Status} <br>
104+
User: ${book.User || "N/A"} <br>
105+
<button onclick="checkOutBook(${book.ID})">Check Out</button>
106+
<button onclick="checkInBook(${book.ID})">Check In</button>
107+
`;
108+
bookList.appendChild(li);
109+
});
110+
}
111+
112+
// Initial render
113+
renderBooks();

0 commit comments

Comments
 (0)