From 494be92d7f1a0eb590035019d83083885d071969 Mon Sep 17 00:00:00 2001
From: Eunice Shobowale <hd5862@wayne.edu>
Date: Wed, 13 Nov 2024 14:58:43 -0500
Subject: [PATCH] Updating dashboard.html

---
 public/webpages/html/dashboard.html | 45 ++++++++++++-----------------
 1 file changed, 18 insertions(+), 27 deletions(-)

diff --git a/public/webpages/html/dashboard.html b/public/webpages/html/dashboard.html
index 27cb0a8..cdb7193 100644
--- a/public/webpages/html/dashboard.html
+++ b/public/webpages/html/dashboard.html
@@ -184,6 +184,7 @@ <h4>Crime</h4>
          <section class="featured-books">
   <div class="section-header">
     <h3>Featured Books</h3>
+  </div>
     
 
   <div class="books-grid" id="featured-books-container">
@@ -321,41 +322,37 @@ <h3>Top 3 Recommendations for You</h3>
           searchInput.style.display = "none";
         }
       }
-
-       async function fetchTopRecommendations() {
-  const API_KEY = 'AIzaSyDHChLI4vatYILeQOWr24nHr4kSap9dwAM';  // Replace with your Google API key
+async function fetchTopRecommendations() {
+  const API_KEY = 'AIzaSyDHChLI4vatYILeQOWr24nHr4kSap9dwAM';  // Replace with your actual API key
   const API_URL = `https://www.googleapis.com/books/v1/volumes?q=fiction&maxResults=3&key=${API_KEY}`;
 
   try {
-    
     const response = await fetch(API_URL);
     const data = await response.json();
 
-
     const recommendationsContainer = document.getElementById('recommendations-container');
     recommendationsContainer.innerHTML = ''; // Clear any previous content
 
-   
     if (data.items) {
-      
       data.items.slice(0, 3).forEach((book, index) => {
         const bookItem = document.createElement('div');
         bookItem.classList.add('recommendation-item');
 
-        
         const number = document.createElement('span');
         number.classList.add('number');
         number.textContent = index + 1;
 
+        const link = document.createElement('a');
+        link.href = `https://books.google.com/books?id=${book.id}`;
+        link.target = "_blank"; // Open in a new tab
+
         const image = document.createElement('img');
         image.src = book.volumeInfo.imageLinks ? book.volumeInfo.imageLinks.thumbnail : '../../images/placeholder.jpg';
         image.alt = book.volumeInfo.title;
 
-       
+        link.appendChild(image);
         bookItem.appendChild(number);
-        bookItem.appendChild(image);
-
-       
+        bookItem.appendChild(link);
         recommendationsContainer.appendChild(bookItem);
       });
     } else {
@@ -366,39 +363,32 @@ <h3>Top 3 Recommendations for You</h3>
   }
 }
 
-
-fetchTopRecommendations();
-
-
 async function fetchFeaturedBooks() {
   const API_KEY = 'AIzaSyDHChLI4vatYILeQOWr24nHr4kSap9dwAM';  // Replace with your actual API key
   const API_URL = `https://www.googleapis.com/books/v1/volumes?q=fiction&maxResults=10&key=${API_KEY}`;
 
   try {
-   
     const response = await fetch(API_URL);
     const data = await response.json();
 
-   
     const featuredBooksContainer = document.getElementById('featured-books-container');
     featuredBooksContainer.innerHTML = ''; // Clear any previous content
 
-   
     if (data.items) {
-      // Loop through the items and add them to the container
-      data.items.forEach((book, index) => {
+      data.items.forEach((book) => {
         const bookCard = document.createElement('div');
         bookCard.classList.add('book-card');
 
-        
+        const link = document.createElement('a');
+        link.href = `https://books.google.com/books?id=${book.id}`;
+        link.target = "_blank"; // Open in a new tab
+
         const image = document.createElement('img');
         image.src = book.volumeInfo.imageLinks ? book.volumeInfo.imageLinks.thumbnail : '../../images/placeholder.jpg';
         image.alt = book.volumeInfo.title;
 
-       
-        bookCard.appendChild(image);
-
-      
+        link.appendChild(image);
+        bookCard.appendChild(link);
         featuredBooksContainer.appendChild(bookCard);
       });
     } else {
@@ -409,8 +399,9 @@ <h3>Top 3 Recommendations for You</h3>
   }
 }
 
-
+fetchTopRecommendations();
 fetchFeaturedBooks();
+
     </script>
 
     <footer>