import gradio as gr
import plotly.graph_objects as go
from weather_utils import get_weather_by_coordinates

# Hyderabad bounding box (lat/lon)
lat_range = [17.30, 17.55]
lon_range = [78.35, 78.60]

fig = go.Figure(go.Scattergeo(
    lon = [],
    lat = [],
    mode = 'markers',
    marker=dict(size=8, color='red'),
))

fig.update_geos(
    resolution=50,
    scope='asia',
    showcountries=False,
    showsubunits=False,
    lataxis_range=lat_range,
    lonaxis_range=lon_range,
    showland=True,
    landcolor="lightgray",
    fitbounds="locations"
)
fig.update_layout(
    title="🗺️ Click anywhere on the map of Hyderabad",
    geo=dict(bgcolor='white'),
    margin={"r":0,"t":30,"l":0,"b":0},
)

def handle_click(trace, points, state):
    if points.point_inds:
        i = points.point_inds[0]
        lat = points.lat[i]
        lon = points.lon[i]
        return get_weather_by_coordinates(lat, lon)
    return "Please click on the map."

def simulate_click_map():
    return fig

demo = gr.Interface(
    fn=None,
    inputs=[],
    outputs=gr.Markdown(label="Weather Info"),
    live=False,
    title="🌦️ Hyderabad Weather Map",
    description="Click on the map to get real-time weather",
)

demo = gr.Blocks()

with demo:
    gr.Markdown("## 🌦️ Hyderabad Weather Forecast Map")
    map_plot = gr.Plot(value=simulate_click_map)
    coords = gr.Textbox(label="Latitude, Longitude (Click the map below)")
    result = gr.Markdown()

    def get_weather_from_click(latlon):
        if not latlon:
            return "No coordinates clicked"
        lat, lon = map(float, latlon.split(","))
        return get_weather_by_coordinates(lat, lon)

    def update_coords(evt: gr.SelectData):
        lat = evt.value["points"][0]["lat"]
        lon = evt.value["points"][0]["lon"]
        return f"{lat}, {lon}"

    map_plot.select(update_coords, None, coords)
    coords.change(get_weather_from_click, coords, result)

demo.launch()