Update app.py

app.py

@@ -5,6 +5,7 @@ import pandas as pd
 # OpenWeather API details
 BASE_URL = "http://api.openweathermap.org/data/2.5/forecast?"
 API_KEY = "2682f6801720ebeb43c93ad55c826c5c"
+ICON_URL = "http://openweathermap.org/img/wn/"
 
 def get_weather(city):
     url = f"{BASE_URL}q={city}&appid={API_KEY}&units=metric"
@@ -17,22 +18,21 @@ def get_weather(city):
 
     # Organizing data by date
     for entry in response["list"]:
-        date = entry["dt_txt"].split(" ")[0]  # Extract only the date
-        time = entry["dt_txt"].split(" ")[1]  # Extract only the time
+        date = entry["dt_txt"].split(" ")[0]
+        time = entry["dt_txt"].split(" ")[1]
+        temp = f"{entry['main']['temp']}°C"
+        humidity = f"{entry['main']['humidity']}%"
+        pressure = f"{entry['main']['pressure']} hPa"
+        wind_speed = f"{entry['wind']['speed']} m/s"
+        rain = f"{entry['rain']['3h']} mm" if "rain" in entry and "3h" in entry["rain"] else "0 mm"
+        cloud_cover = f"{entry['clouds']['all']}%"
+        icon = f"{ICON_URL}{entry['weather'][0]['icon']}@2x.png"  # Fetch weather icon
+
         if date not in weather_info:
             weather_info[date] = []
         
-        weather_info[date].append([
-            time,
-            f"{entry['main']['temp']}°C",
-            f"{entry['main']['humidity']}%",
-            f"{entry['main']['pressure']} hPa",
-            f"{entry['wind']['speed']} m/s",
-            f"{entry['rain']['3h']} mm" if "rain" in entry and "3h" in entry["rain"] else "0 mm",
-            f"{entry['clouds']['all']}%"
-        ])
+        weather_info[date].append([time, temp, humidity, pressure, wind_speed, rain, cloud_cover, icon])
 
-    # Formatting output as tables inside boxes
     markdown_output = """
     <h2 style="text-align:center; color: #fff; background: linear-gradient(to right, #667eea, #764ba2); padding: 10px; border-radius: 10px;">
         📅 5-Day Weather Forecast
@@ -40,19 +40,22 @@ def get_weather(city):
     """
 
     for date, details in weather_info.items():
-        df = pd.DataFrame(details, columns=["Time", "Temperature", "Humidity", "Pressure", "Wind Speed", "Rain", "Cloud Cover"])
-        table_html = df.to_html(index=False, classes="styled-table")
+        df = pd.DataFrame(details, columns=["Time", "Temperature", "Humidity", "Pressure", "Wind Speed", "Rain", "Cloud Cover", "Icon"])
+        df_html = df.to_html(index=False, escape=False)  # Disable escaping for images
+
+        # Convert "Icon" column to actual images
+        df_html = df_html.replace("&lt;img", "<img").replace("&gt;", ">")  # Fix HTML escaping for images
 
         markdown_output += f"""
         <div class='weather-box'>
             <h3 class="date-header">📆 {date}</h3>
-            {table_html}
+            {df_html}
         </div>
         """
 
     return markdown_output
 
-# **Beautiful CSS with Hover Effects, Shadows & Rounded Corners**
+# **CSS for styling**
 custom_css = """
 body {
     background: #0f172a;
@@ -101,6 +104,10 @@ h1, h2, h3 {
 .styled-table tbody tr:hover {
     background: rgba(255, 255, 255, 0.1);
 }
+.styled-table img {
+    width: 50px;  /* Weather icons size */
+    height: 50px;
+}
 """
 
 # **Gradio Interface**