Update app.py

app.py

@@ -35,9 +35,28 @@ class WeatherApp:
         try:
             self.selected_lat = float(lat)
             self.selected_lon = float(lon)
-            return self.create_map()
+            return self.create_map(), lat, lon
         except:
-            return self.create_map()
+            return self.create_map(), self.selected_lat, self.selected_lon
+    
+    def set_city_coordinates(self, city_name):
+        """Set coordinates for major cities"""
+        cities = {
+            "New York City": (40.7128, -74.0060),
+            "Los Angeles": (34.0522, -118.2437),
+            "Chicago": (41.8781, -87.6298),
+            "Miami": (25.7617, -80.1918),
+            "Denver": (39.7392, -104.9903),
+            "Seattle": (47.6062, -122.3321),
+            "Bozeman, MT": (45.6770, -111.0429)
+        }
+        
+        if city_name in cities:
+            lat, lon = cities[city_name]
+            self.selected_lat = lat
+            self.selected_lon = lon
+            return self.create_map(), lat, lon
+        return self.create_map(), self.selected_lat, self.selected_lon
     
     def get_weather_data(self):
         """Fetch weather data from NOAA API"""
@@ -87,22 +106,23 @@ class WeatherApp:
         for i in range(24):
             current_hour = (hour + i) % 24
             
-            # Determine weather condition (simplified model)
+            # Determine weather condition (more realistic distribution - less sunny)
             import random
-            random.seed(int(lat * lon * i))  # Deterministic randomness
+            random.seed(int(lat * lon * i + 42))  # Deterministic randomness
             condition_rand = random.random()
             
-            if condition_rand < 0.6:
-                condition = "☀️ Sunny"
+            # Reduced sunny probability to make it more realistic
+            if condition_rand < 0.35:  # Reduced from 0.6 to 0.35
+                condition = "Sunny"
                 cloud_factor = 1.0
-            elif condition_rand < 0.8:
-                condition = "⛅ Partly Cloudy" 
+            elif condition_rand < 0.60:  # Increased partly cloudy
+                condition = "Partly Cloudy" 
                 cloud_factor = 0.7
-            elif condition_rand < 0.95:
-                condition = "☁️ Cloudy"
+            elif condition_rand < 0.85:  # Increased cloudy
+                condition = "Cloudy"
                 cloud_factor = 0.4
             else:
-                condition = "🌧️ Rainy"
+                condition = "Rainy"
                 cloud_factor = 0.2
             
             weather_conditions.append(condition)
@@ -202,10 +222,10 @@ class WeatherApp:
             time_labels.append(start_time.strftime('%m/%d\n%H:%M'))
             temps.append(period['temperature'])
         
-        # Get UV index and weather conditions
+        # Get UV index and weather conditions - USE SAME LENGTH AS TEMPERATURE DATA
         uv_values, weather_conditions = self.get_uv_index(self.selected_lat, self.selected_lon)
-        uv_values = uv_values[:len(times)]
-        weather_conditions = weather_conditions[:len(times)]
+        uv_values = uv_values[:len(times)]  # Ensure same length
+        weather_conditions = weather_conditions[:len(times)]  # Ensure same length
         
         # Create combined temperature and UV plot
         fig = go.Figure()
@@ -245,13 +265,13 @@ class WeatherApp:
             yaxis='y2'
         ))
         
-        # Update layout with dual y-axes
+        # Update layout with dual y-axes and better spacing
         fig.update_layout(
             title=dict(
                 text=f'24-Hour Weather Forecast: {self.selected_lat:.4f}°, {self.selected_lon:.4f}°',
                 font=dict(size=18, color='#2C3E50')
             ),
-            height=600,  # Increased height for more space
+            height=700,  # Increased height for more space
             xaxis=dict(
                 title="Time",
                 tickvals=times,
@@ -259,7 +279,9 @@ class WeatherApp:
                 tickangle=45,
                 showgrid=True,
                 gridwidth=1,
-                gridcolor='rgba(128,128,128,0.2)'
+                gridcolor='rgba(128,128,128,0.2)',
+                range=[-1.5, len(times) + 0.5],  # More padding on sides to prevent squishing
+                fixedrange=True  # Disable zooming/panning
             ),
             yaxis=dict(
                 title=dict(text="Temperature (°F)", font=dict(color='#FF6B6B')),
@@ -267,14 +289,16 @@ class WeatherApp:
                 tickfont=dict(color='#FF6B6B'),
                 showgrid=True,
                 gridwidth=1,
-                gridcolor='rgba(255,107,107,0.2)'
+                gridcolor='rgba(255,107,107,0.2)',
+                fixedrange=True  # Disable zooming/panning
             ),
             yaxis2=dict(
                 title=dict(text="UV Index", font=dict(color='#4A90E2')),
                 overlaying='y',
                 side='right',
                 tickfont=dict(color='#4A90E2'),
-                range=[0, max(12, max(uv_values) * 1.1)]
+                range=[0, max(12, max(uv_values) * 1.1) if uv_values else 12],
+                fixedrange=True  # Disable zooming/panning
             ),
             plot_bgcolor='rgba(248,249,250,0.8)',
             paper_bgcolor='white',
@@ -286,29 +310,34 @@ class WeatherApp:
                 xanchor="right",
                 x=1
             ),
-            margin=dict(l=60, r=60, t=80, b=150)  # More margin for conditions
+            margin=dict(l=100, r=100, t=100, b=220),  # Much larger margins, especially on sides
+            dragmode=False,  # Disable all dragging
         )
         
-        # Add weather conditions as annotations below x-axis
+        # Disable hover interactions
+        fig.update_traces(hoverinfo='none')
+        
+        # Add weather conditions as text annotations with better spacing and readability
         for i, (time_idx, condition) in enumerate(zip(times, weather_conditions)):
-            if i % 3 == 0:  # Show every 3rd condition to avoid crowding
+            if i % 2 == 0:  # Show every other condition to avoid crowding
                 fig.add_annotation(
                     x=time_idx,
-                    y=-0.15,  # Below x-axis
-                    text=condition,
+                    y=-0.28,  # Further below x-axis
+                    text=f"<b>{condition}</b>",
                     showarrow=False,
-                    font=dict(size=10),
+                    font=dict(size=12, color='#2C3E50'),
                     xref='x',
                     yref='paper',
                     xanchor='center'
                 )
         
         # Add UV risk zones as background colors
-        fig.add_hrect(y0=0, y1=2, fillcolor="rgba(76,175,80,0.1)", layer="below", line_width=0, yref='y2')
-        fig.add_hrect(y0=3, y1=5, fillcolor="rgba(255,193,7,0.1)", layer="below", line_width=0, yref='y2')
-        fig.add_hrect(y0=6, y1=7, fillcolor="rgba(255,152,0,0.1)", layer="below", line_width=0, yref='y2')
-        fig.add_hrect(y0=8, y1=10, fillcolor="rgba(244,67,54,0.1)", layer="below", line_width=0, yref='y2')
-        fig.add_hrect(y0=11, y1=15, fillcolor="rgba(156,39,176,0.1)", layer="below", line_width=0, yref='y2')
+        if uv_values:
+            fig.add_hrect(y0=0, y1=2, fillcolor="rgba(76,175,80,0.1)", layer="below", line_width=0, yref='y2')
+            fig.add_hrect(y0=3, y1=5, fillcolor="rgba(255,193,7,0.1)", layer="below", line_width=0, yref='y2')
+            fig.add_hrect(y0=6, y1=7, fillcolor="rgba(255,152,0,0.1)", layer="below", line_width=0, yref='y2')
+            fig.add_hrect(y0=8, y1=10, fillcolor="rgba(244,67,54,0.1)", layer="below", line_width=0, yref='y2')
+            fig.add_hrect(y0=11, y1=15, fillcolor="rgba(156,39,176,0.1)", layer="below", line_width=0, yref='y2')
         
         # Get comprehensive recommendations
         recommendations = self.get_comprehensive_sunscreen_recommendations(uv_values)
@@ -377,14 +406,26 @@ with gr.Blocks(title="NOAA Weather & UV Index Map", theme=gr.themes.Soft()) as d
                 update_btn = gr.Button("🗺️ Update Location", variant="secondary", size="sm")
                 weather_btn = gr.Button("🧴 Get Sunscreen Report", variant="primary", size="lg")
                 
+            gr.Markdown("### 🏙️ Quick City Selection")
+            with gr.Row():
+                nyc_btn = gr.Button("🗽 NYC", size="sm")
+                la_btn = gr.Button("🌴 LA", size="sm")
+                chicago_btn = gr.Button("🏢 Chicago", size="sm")
+            with gr.Row():
+                miami_btn = gr.Button("🏖️ Miami", size="sm")
+                denver_btn = gr.Button("⛰️ Denver", size="sm")
+                seattle_btn = gr.Button("🌲 Seattle", size="sm")
+            bozeman_btn = gr.Button("🏔️ Bozeman, MT", size="sm", variant="secondary")
+                
             gr.Markdown("""
-            ### 📍 Popular Locations:
+            ### 📍 Manual Coordinates:
             - **NYC**: 40.7128, -74.0060  
             - **LA**: 34.0522, -118.2437
             - **Chicago**: 41.8781, -87.6298  
             - **Miami**: 25.7617, -80.1918
             - **Denver**: 39.7392, -104.9903
             - **Seattle**: 47.6062, -122.3321
+            - **Bozeman, MT**: 45.6770, -111.0429
             """)
         
         with gr.Column(scale=2):
@@ -436,7 +477,37 @@ with gr.Blocks(title="NOAA Weather & UV Index Map", theme=gr.themes.Soft()) as d
     update_btn.click(
         fn=weather_app.update_location,
         inputs=[lat_input, lon_input],
-        outputs=[map_html]
+        outputs=[map_html, lat_input, lon_input]
+    )
+    
+    # City button event handlers
+    nyc_btn.click(
+        fn=lambda: weather_app.set_city_coordinates("New York City"),
+        outputs=[map_html, lat_input, lon_input]
+    )
+    la_btn.click(
+        fn=lambda: weather_app.set_city_coordinates("Los Angeles"),
+        outputs=[map_html, lat_input, lon_input]
+    )
+    chicago_btn.click(
+        fn=lambda: weather_app.set_city_coordinates("Chicago"),
+        outputs=[map_html, lat_input, lon_input]
+    )
+    miami_btn.click(
+        fn=lambda: weather_app.set_city_coordinates("Miami"),
+        outputs=[map_html, lat_input, lon_input]
+    )
+    denver_btn.click(
+        fn=lambda: weather_app.set_city_coordinates("Denver"),
+        outputs=[map_html, lat_input, lon_input]
+    )
+    seattle_btn.click(
+        fn=lambda: weather_app.set_city_coordinates("Seattle"),
+        outputs=[map_html, lat_input, lon_input]
+    )
+    bozeman_btn.click(
+        fn=lambda: weather_app.set_city_coordinates("Bozeman, MT"),
+        outputs=[map_html, lat_input, lon_input]
     )
     
     weather_btn.click(
@@ -449,13 +520,13 @@ with gr.Blocks(title="NOAA Weather & UV Index Map", theme=gr.themes.Soft()) as d
     lat_input.change(
         fn=weather_app.update_location,
         inputs=[lat_input, lon_input],
-        outputs=[map_html]
+        outputs=[map_html, lat_input, lon_input]
     )
     
     lon_input.change(
         fn=weather_app.update_location,
         inputs=[lat_input, lon_input],
-        outputs=[map_html]
+        outputs=[map_html, lat_input, lon_input]
     )
 
 # Launch the app