import os
import gradio as gr
import requests
import openai

# Load API keys
weather_api_key = os.getenv("openweather")
openai.api_key = os.getenv("OPENAI_API_KEY")

# ------------- WEATHER FETCH FUNCTION -------------
def get_weather(city_name):
    if not city_name.strip():
        city_name = "Dubai"
    try:
        url = f"https://api.openweathermap.org/data/2.5/weather?q={city_name}&appid={weather_api_key}&units=metric"
        data = requests.get(url).json()
        if data["cod"] == 200:
            rain = data.get("rain", {}).get("1h", 0)
            condition = data["weather"][0]["main"]
            emoji_map = {
                "Clear": "☀️", "Clouds": "☁️", "Rain": "🌧️",
                "Snow": "❄️", "Thunderstorm": "⛈️", "Drizzle": "🌦️",
                "Mist": "🌫️", "Haze": "🌁", "Fog": "🌫️"
            }
            emoji = emoji_map.get(condition, "🌈")
            return {
                "city": data["name"],
                "country": data["sys"]["country"],
                "temperature": int(data["main"]["temp"]),
                "feels_like": int(data["main"]["feels_like"]),
                "humidity": data["main"]["humidity"],
                "pressure": data["main"]["pressure"],
                "description": f"{data['weather'][0]['description'].title()} {emoji}",
                "wind_speed": data["wind"]["speed"],
                "visibility": data.get("visibility", 10000) // 1000,
                "rain_chance": f"{rain} mm"
            }
        else:
            return None
    except:
        return None

# ------------- WEATHER DISPLAY -------------
def format_weather_display(data):
    if not data:
        return "<div style='text-align:center; color: #e74c3c; font-size: 18px; padding: 40px;'>❌ City not found. Please try again.</div>"

    font_color = "#2d3436"
    card_bg = "#e8f5e9"
    main_bg = "#ffffff"

    return f"""
    <div style="background: {main_bg}; border-radius: 16px; padding: 25px; box-shadow: 0 10px 30px rgba(0,0,0,0.1);">
        <div style="text-align: center; margin-bottom: 25px;">
            <h2 style="margin: 0; color: {font_color}; font-size: 24px; font-weight: 600;">📍 {data['city']}, {data['country']}</h2>
            <h1 style="margin: 10px 0; font-size: 64px; color: {font_color}; font-weight: 300;">{data['temperature']}°C</h1>
            <p style="margin: 5px 0; color: {font_color}; font-size: 18px; font-weight: 500;">{data['description']}</p>
        </div>
        <div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 25px;">
            <div style="background: {card_bg}; border-radius: 12px; padding: 16px; text-align: center; color: {font_color};">
                💧<br><strong>{data['rain_chance']}</strong><br><span>Precipitation</span>
            </div>
            <div style="background: {card_bg}; border-radius: 12px; padding: 16px; text-align: center; color: {font_color};">
                📊<br><strong>{data['pressure']} mb</strong><br><span>Pressure</span>
            </div>
            <div style="background: {card_bg}; border-radius: 12px; padding: 16px; text-align: center; color: {font_color};">
                💨<br><strong>{data['wind_speed']} km/h</strong><br><span>Wind Speed</span>
            </div>
            <div style="background: {card_bg}; border-radius: 12px; padding: 16px; text-align: center; color: {font_color};">
                🌡️<br><strong>{data['feels_like']}°C</strong><br><span>Feels Like</span>
            </div>
            <div style="background: {card_bg}; border-radius: 12px; padding: 16px; text-align: center; color: {font_color};">
                👁️<br><strong>{data['visibility']} km</strong><br><span>Visibility</span>
            </div>
            <div style="background: {card_bg}; border-radius: 12px; padding: 16px; text-align: center; color: {font_color};">
                💦<br><strong>{data['humidity']}%</strong><br><span>Humidity</span>
            </div>
        </div>
    </div>
    """

# ------------- CHATBOT FUNCTION (OpenAI) -------------
def travel_chat(user_input, history):
    try:
        messages = [{"role": "system", "content": "You are TripMate AI, a helpful travel assistant. Provide travel tips, cultural insights, and activity suggestions."}]
        for h in history:
            messages.append({"role": "user", "content": h["role"] == "user" and h["content"] or ""})
            messages.append({"role": "assistant", "content": h["role"] == "assistant" and h["content"] or ""})
        messages.append({"role": "user", "content": user_input})

        response = openai.chat.completions.create(
            model="gpt-4o-mini",
            messages=messages
        )
        reply = response.choices[0].message.content
    except:
        reply = "⚠️ Unable to get a response. Try again."
    history.append({"role": "user", "content": user_input})
    history.append({"role": "assistant", "content": reply})
    return history, history

# ------------- PLACE SUGGESTIONS (OpenAI) -------------
def get_places_to_visit(city, country, temp, description):
    prompt = f"""
    Suggest 6-9 must-visit attractions or experiences in {city}, {country} considering that the weather is {description}, temperature is {temp}°C.
    Return the results as Python tuples in this format:
    ("Place Name", "Short description of the place and why it’s worth visiting")
    """
    try:
        response = openai.chat.completions.create(
            model="gpt-4o-mini",
            messages=[{"role": "user", "content": prompt}]
        )
        content = response.choices[0].message.content.strip()
        places = []
        for line in content.split('\n'):
            line = line.strip().rstrip(',')
            if line.startswith('(') and line.endswith(')'):
                try:
                    place_tuple = eval(line)
                    if isinstance(place_tuple, tuple) and len(place_tuple) == 2:
                        places.append(place_tuple)
                except:
                    continue
        return places
    except Exception as e:
        return [("Error", str(e))]

# Format place card
def format_place_card(name, details):
    return f"""
    <div class='crop-card'>
        <div class='crop-name'>{name}</div>
        <div class='crop-description'>{details}</div>
    </div>
    """

# Generate place cards
def generate_place_cards(city):
    weather = get_weather(city)
    if not weather:
        return "<div style='padding:20px; color:red;'>⚠️ Couldn't fetch places due to missing weather data.</div>"
    places = get_places_to_visit(
        city=weather["city"],
        country=weather["country"],
        temp=weather["temperature"],
        description=weather["description"]
    )
    return "<div class='card-grid'>" + "".join(format_place_card(name, details) for name, details in places) + "</div>"

# ------------- CSS -------------
custom_css = """
body, .gradio-container {
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%) !important;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    min-height: 100vh;
}
#main-title {
    text-align: center;
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: #2e7d32;
}
.section-header {
    background: linear-gradient(135deg, #43a047 0%, #388e3c 100%);
    color: white;
    padding: 12px 20px;
    border-radius: 12px 12px 0 0;
    text-align: center;
}
.content-box {
    background-color: #ffffff;
    border-radius: 0 0 16px 16px;
    padding: 25px;
    min-height: 520px;
}
.card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 25px;
}
.crop-card {
    background: #ffffff;
    border: 1px solid #c8e6c9;
    border-radius: 16px;
    padding: 20px;
}
.crop-name {
    font-size: 20px;
    font-weight: 600;
    color: #2e7d32;
    margin-bottom: 12px;
    text-align: center;
}
.crop-description {
    font-size: 15px;
    color: #444;
    line-height: 1.5;
    text-align: center;
}
.footer {
    background: linear-gradient(135deg, #2e7d32 0%, #1b5e20 100%);
    color: white;
    padding: 30px;
    border-radius: 16px;
    margin-top: 30px;
    text-align: center;
    font-size: 14px;
}
"""

# ------------- UI -------------
def launch_ui():
    with gr.Blocks(css=custom_css, title="TripMate AI") as demo:
        gr.Markdown("<div id='main-title'>🌍 TripMate AI</div>")

        with gr.Row(equal_height=True):
            # Weather
            with gr.Column(scale=1):
                gr.Markdown("<div class='section-header'>🌤️ Weather</div>")
                with gr.Group(elem_classes="content-box"):
                    city_input = gr.Textbox(label="City", value="Dubai", placeholder="Enter city name")
                    update_btn = gr.Button("Get Weather")
                    weather_html = gr.HTML()

            # Chat
            with gr.Column(scale=1):
                gr.Markdown("<div class='section-header'>🤖 Travel Assistant</div>")
                with gr.Group(elem_classes="content-box"):
                    chat = gr.Chatbot(height=350, type="messages")
                    with gr.Row():
                        message = gr.Textbox(placeholder="Ask about travel tips...", show_label=False, scale=4)
                        ask_btn = gr.Button("Send", scale=1)
                    state = gr.State([])

        gr.Markdown("<div class='section-header'>🗺️ Places to Visit</div>")
        place_cards_html = gr.HTML()

        gr.HTML("""
        <div class='footer'>
            💚 Built by Shafaq Mandha | Powered by OpenWeather & OpenAI | TripMate AI © 2025
        </div>
        """)

        update_btn.click(
            fn=lambda city: (format_weather_display(get_weather(city)), generate_place_cards(city)),
            inputs=city_input,
            outputs=[weather_html, place_cards_html]
        )
        city_input.submit(
            fn=lambda city: (format_weather_display(get_weather(city)), generate_place_cards(city)),
            inputs=city_input,
            outputs=[weather_html, place_cards_html]
        )
        ask_btn.click(fn=travel_chat, inputs=[message, state], outputs=[chat, state])
        message.submit(fn=travel_chat, inputs=[message, state], outputs=[chat, state])

        demo.load(fn=lambda: (format_weather_display(get_weather("Dubai")), generate_place_cards("Dubai")),
                  inputs=None,
                  outputs=[weather_html, place_cards_html])

    demo.launch()

launch_ui()