Update app.py

app.py

@@ -147,6 +147,82 @@ current_time_and_date = get_current_time_and_date()
 #     else:
 #         return "<p>Failed to fetch local events</p>"
 
+# def fetch_local_events():
+#     api_key = os.environ['SERP_API']
+#     url = f'https://serpapi.com/search.json?engine=google_events&q=Events+in+Omaha&hl=en&gl=us&api_key={api_key}'
+
+#     response = requests.get(url)
+#     if response.status_code == 200:
+#         events_results = response.json().get("events_results", [])
+#         events_html = """
+#         <h2 style="font-family: 'Georgia', serif; color: #ff0000; background-color: #f8f8f8; padding: 10px; border-radius: 10px;">Local Events</h2>
+#         <style>
+#             .event-item {
+#                 font-family: 'Verdana', sans-serif;
+#                 color: #333;
+#                 background-color: #f0f8ff;
+#                 margin-bottom: 15px;
+#                 padding: 10px;
+#                 border-radius: 5px;
+#                 transition: box-shadow 0.3s ease, background-color 0.3s ease;
+#                 font-weight: bold;
+#             }
+#             .event-item:hover {
+#                 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+#                 background-color: #e6f7ff;
+#             }
+#             .event-item a {
+#                 color: #1E90FF;
+#                 text-decoration: none;
+#                 font-weight: bold;
+#             }
+#             .event-item a:hover {
+#                 text-decoration: underline;
+#             }
+#             .event-preview {
+#                 position: absolute;
+#                 display: none;
+#                 border: 1px solid #ccc;
+#                 border-radius: 5px;
+#                 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+#                 background-color: white;
+#                 z-index: 1000;
+#                 max-width: 300px;
+#                 padding: 10px;
+#                 font-family: 'Verdana', sans-serif;
+#                 color: #333;
+#             }
+#         </style>
+#         <script>
+#             function showPreview(event, previewContent) {
+#                 var previewBox = document.getElementById('event-preview');
+#                 previewBox.innerHTML = previewContent;
+#                 previewBox.style.left = event.pageX + 'px';
+#                 previewBox.style.top = event.pageY + 'px';
+#                 previewBox.style.display = 'block';
+#             }
+#             function hidePreview() {
+#                 var previewBox = document.getElementById('event-preview');
+#                 previewBox.style.display = 'none';
+#             }
+#         </script>
+#         <div id="event-preview" class="event-preview"></div>
+#         """
+#         for index, event in enumerate(events_results):
+#             title = event.get("title", "No title")
+#             date = event.get("date", "No date")
+#             location = event.get("address", "No location")
+#             link = event.get("link", "#")
+#             events_html += f"""
+#             <div class="event-item" onmouseover="showPreview(event, 'Date: {date}<br>Location: {location}')" onmouseout="hidePreview()">
+#                 <a href='{link}' target='_blank'>{index + 1}. {title}</a>
+#                 <p>Date: {date}<br>Location: {location}</p>
+#             </div>
+#             """
+#         return events_html
+#     else:
+#         return "<p>Failed to fetch local events</p>"
+
 def fetch_local_events():
     api_key = os.environ['SERP_API']
     url = f'https://serpapi.com/search.json?engine=google_events&q=Events+in+Omaha&hl=en&gl=us&api_key={api_key}'
@@ -160,53 +236,18 @@ def fetch_local_events():
             .event-item {
                 font-family: 'Verdana', sans-serif;
                 color: #333;
-                background-color: #f0f8ff;
                 margin-bottom: 15px;
                 padding: 10px;
-                border-radius: 5px;
-                transition: box-shadow 0.3s ease, background-color 0.3s ease;
                 font-weight: bold;
             }
-            .event-item:hover {
-                box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-                background-color: #e6f7ff;
-            }
             .event-item a {
                 color: #1E90FF;
                 text-decoration: none;
-                font-weight: bold;
             }
             .event-item a:hover {
                 text-decoration: underline;
             }
-            .event-preview {
-                position: absolute;
-                display: none;
-                border: 1px solid #ccc;
-                border-radius: 5px;
-                box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-                background-color: white;
-                z-index: 1000;
-                max-width: 300px;
-                padding: 10px;
-                font-family: 'Verdana', sans-serif;
-                color: #333;
-            }
         </style>
-        <script>
-            function showPreview(event, previewContent) {
-                var previewBox = document.getElementById('event-preview');
-                previewBox.innerHTML = previewContent;
-                previewBox.style.left = event.pageX + 'px';
-                previewBox.style.top = event.pageY + 'px';
-                previewBox.style.display = 'block';
-            }
-            function hidePreview() {
-                var previewBox = document.getElementById('event-preview');
-                previewBox.style.display = 'none';
-            }
-        </script>
-        <div id="event-preview" class="event-preview"></div>
         """
         for index, event in enumerate(events_results):
             title = event.get("title", "No title")
@@ -214,7 +255,7 @@ def fetch_local_events():
             location = event.get("address", "No location")
             link = event.get("link", "#")
             events_html += f"""
-            <div class="event-item" onmouseover="showPreview(event, 'Date: {date}<br>Location: {location}')" onmouseout="hidePreview()">
+            <div class="event-item">
                 <a href='{link}' target='_blank'>{index + 1}. {title}</a>
                 <p>Date: {date}<br>Location: {location}</p>
             </div>