Update app.py

app.py

@@ -1,5 +1,5 @@
 import dash
-from dash import dcc, html, Input, Output, State
+from dash import dcc, html, Input, Output, State, clientside_callback
 import dash_bootstrap_components as dbc
 import plotly.graph_objs as go
 import requests
@@ -8,6 +8,7 @@ from datetime import datetime
 import os
 from dotenv import load_dotenv
 import threading
+import json
 
 # Load environment variables
 load_dotenv()
@@ -22,10 +23,41 @@ API_KEY = os.getenv('ACCUWEATHER_API_KEY')
 # Base URL for AccuWeather API
 BASE_URL = "http://dataservice.accuweather.com"
 
-# API functions remain the same
-# ...
-
-# Updated App layout
+# Define all the necessary functions
+def get_location_key(lat, lon):
+    url = f"{BASE_URL}/locations/v1/cities/geoposition/search"
+    params = {
+        "apikey": API_KEY,
+        "q": f"{lat},{lon}",
+    }
+    try:
+        response = requests.get(url, params=params)
+        response.raise_for_status()
+        data = response.json()
+        if "Key" not in data:
+            raise ValueError("Location key not found in API response")
+        return data["Key"]
+    except requests.RequestException as e:
+        print(f"Error in get_location_key: {e}")
+        return None
+
+def get_current_conditions(location_key):
+    # Implementation as before
+    ...
+
+def get_forecast(location_key):
+    # Implementation as before
+    ...
+
+def get_indices(location_key):
+    # Implementation as before
+    ...
+
+def get_alerts(location_key):
+    # Implementation as before
+    ...
+
+# App layout
 app.layout = dbc.Container([
     dbc.Row([
         dbc.Col([
@@ -47,12 +79,32 @@ app.layout = dbc.Container([
     dcc.Interval(id="location-interval", interval=1000, max_intervals=1),
 ], fluid=True, className="mt-4")
 
-@app.callback(
+# Clientside callback to get user's location
+clientside_callback(
+    """
+    function(n_intervals) {
+        return new Promise((resolve, reject) => {
+            if (navigator.geolocation) {
+                navigator.geolocation.getCurrentPosition(
+                    (position) => {
+                        resolve({
+                            latitude: position.coords.latitude,
+                            longitude: position.coords.longitude
+                        });
+                    },
+                    (error) => {
+                        resolve({error: error.message});
+                    }
+                );
+            } else {
+                resolve({error: "Geolocation is not supported by this browser."});
+            }
+        });
+    }
+    """,
     Output("location-store", "data"),
-    Input("location-interval", "n_intervals")
+    Input("location-interval", "n_intervals"),
 )
-def update_location(n):
-    return {"latitude": 0, "longitude": 0}  # Replace with actual browser location data
 
 @app.callback(
     [Output("loading-output", "children"),
@@ -63,57 +115,14 @@ def update_location(n):
     Input("location-store", "data")
 )
 def update_weather(location):
-    if not location:
-        return "Waiting for location data...", "", "", "", ""
+    if not location or 'error' in location:
+        error_message = location.get('error', 'Waiting for location data...') if location else 'Waiting for location data...'
+        return error_message, "", "", "", ""
 
     lat, lon = location["latitude"], location["longitude"]
     
-    loading_output = html.Div([
-        html.P("Loading weather data...", className="text-center"),
-        dbc.Spinner(color="primary", type="grow"),
-    ])
-
-    def fetch_weather_data():
-        nonlocal loading_output
-        try:
-            location_key = get_location_key(lat, lon)
-            if location_key is None:
-                raise ValueError("Failed to get location key")
-
-            current = get_current_conditions(location_key)
-            forecast = get_forecast(location_key)
-            indices = get_indices(location_key)
-            alerts = get_alerts(location_key)
-
-            if current is None or forecast is None or indices is None:
-                raise ValueError("Failed to fetch weather data")
-
-            current_weather = create_current_weather_card(current)
-            forecast_output = create_forecast_card(forecast)
-            indices_output = create_indices_card(indices)
-            alert_output = create_alert_card(alerts)
-
-            loading_output = ""
-            
-            return current_weather, forecast_output, indices_output, alert_output
-
-        except Exception as e:
-            error_message = f"Error fetching weather data: {str(e)}"
-            print(error_message)  # Log the error
-            loading_output = html.Div(error_message, className="text-danger")
-            return "", "", "", ""
-
-    # Use threading to fetch data asynchronously
-    thread = threading.Thread(target=fetch_weather_data)
-    thread.start()
-    thread.join(timeout=10)  # Wait for up to 10 seconds
-
-    if thread.is_alive():
-        loading_output = html.Div("Weather data fetch timed out. Please try again.", className="text-warning")
-        return loading_output, "", "", "", ""
-
-    current_weather, forecast_output, indices_output, alert_output = fetch_weather_data()
-    return loading_output, current_weather, forecast_output, indices_output, alert_output
+    # Rest of the function remains the same
+    ...
 
 # The rest of the code (create_current_weather_card, create_forecast_card, etc.) remains the same