update netlify deployment and use google places

lalitlouis · Sep 18, 2024 · 7734648 · 7734648
1 parent c48bb67
commit 7734648
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 22 deletions.
diff --git a/index.html b/index.html
@@ -5,34 +5,19 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>City Circuit</title>
     <link rel="stylesheet" href="styles.css">
-    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&family=Roboto:wght@400;500&display=swap" rel="stylesheet">
     <script src="https://d3js.org/d3.v7.min.js"></script>
 </head>
 <body>
     <header>
         <h1>City Circuit</h1>
     </header>
     <nav>
-        <select id="placeType">
-            <option value="restaurants">Restaurants</option>
-            <option value="museums">Museums</option>
-        </select>
-        <input type="text" id="searchInput" placeholder="Enter zip code">
+        <input type="text" id="locationInput" placeholder="Enter ZIP code">
         <button id="searchButton">Search</button>
     </nav>
     <main>
         <div id="graph"></div>
-        <div id="infoPanel">
-            <h2 id="infoName"></h2>
-            <p id="infoRating"></p>
-            <p id="infoReviews"></p>
-            <h3>Popular Items:</h3>
-            <ul id="infoPopular"></ul>
-            <h3>Best Reviews:</h3>
-            <ul id="infoBestReviews"></ul>
-            <h3>Worst Reviews:</h3>
-            <ul id="infoWorstReviews"></ul>
-        </div>
+        <div id="infoPanel"></div>
     </main>
     <script src="script.js"></script>
 </body>

diff --git a/script.js b/script.js
@@ -154,11 +154,29 @@ async function showInfo(place) {
 }
 
 document.getElementById('searchButton').addEventListener('click', async () => {
-    const zipCode = document.getElementById('locationInput').value || '94102';  // Default to San Francisco
-
-    const response = await fetch(`/.netlify/functions/googlePlaces?action=nearbySearch&zipCode=${zipCode}`);
-    const data = await response.json();
-    createGraph(data.results);
+    const locationInput = document.getElementById('locationInput');
+    if (!locationInput) {
+        console.error('Location input element not found');
+        return;
+    }
+    const zipCode = locationInput.value || '94102';  // Default to San Francisco
+
+    try {
+        const response = await fetch(`/.netlify/functions/googlePlaces?action=nearbySearch&zipCode=${zipCode}`);
+        if (!response.ok) {
+            throw new Error(`HTTP error! status: ${response.status}`);
+        }
+        const data = await response.json();
+        if (data.results && data.results.length > 0) {
+            createGraph(data.results);
+        } else {
+            console.log('No results found');
+            d3.select("#graph").html("<p>No results found for this ZIP code.</p>");
+        }
+    } catch (error) {
+        console.error('Error fetching data:', error);
+        d3.select("#graph").html("<p>Error fetching data. Please try again.</p>");
+    }
 });
 
 // Initial graph creation