import dash
from dash import html, dcc
import pandas as pd
import plotly.graph_objects as go
import random

# Constants
AREAS = ['Hyderabad', 'Ballari', 'Gadwal', 'Kurnool']
POLES_PER_AREA = 4000
ALERT_THRESHOLDS = {
    "Red": {"tilt": 9, "vibration": 2.8, "solar": 3.0, "wind": 0.6},
    "Yellow": {"tilt": 7, "vibration": 2.4, "solar": 4.0, "wind": 0.8}
}

# Simulate large dataset
def simulate_pole_data():
    data = []
    for area in AREAS:
        for i in range(1, POLES_PER_AREA + 1):
            solar = round(random.uniform(2.5, 7.5), 2)
            wind = round(random.uniform(0.3, 2.5), 2)
            tilt = round(random.uniform(0, 12), 2)
            vibration = round(random.uniform(0, 3.5), 2)
            alert = "Green"

            if (
                solar < ALERT_THRESHOLDS["Red"]["solar"]
                or wind < ALERT_THRESHOLDS["Red"]["wind"]
                or tilt > ALERT_THRESHOLDS["Red"]["tilt"]
                or vibration > ALERT_THRESHOLDS["Red"]["vibration"]
            ):
                alert = "Red"
            elif (
                solar < ALERT_THRESHOLDS["Yellow"]["solar"]
                or wind < ALERT_THRESHOLDS["Yellow"]["wind"]
                or tilt > ALERT_THRESHOLDS["Yellow"]["tilt"]
                or vibration > ALERT_THRESHOLDS["Yellow"]["vibration"]
            ):
                alert = "Yellow"

            data.append({
                "Area": area,
                "Pole": f"P{i}",
                "Solar": solar,
                "Wind": wind,
                "Tilt": tilt,
                "Vibration": vibration,
                "AlertLevel": alert
            })
    return pd.DataFrame(data)

df = simulate_pole_data()

# Map alerts to values for heatmap coloring
alert_to_num = {'Green': 1, 'Yellow': 2, 'Red': 3}
num_to_color = {1: 'green', 2: 'yellow', 3: 'red'}
df["AlertNum"] = df["AlertLevel"].map(alert_to_num)

# Reduce for heatmap by showing average alert level by 100 pole blocks
df['PoleIndex'] = df.groupby('Area').cumcount() // 100  # 40 blocks per area
df_heatmap = df.groupby(['Area', 'PoleIndex'])['AlertNum'].mean().reset_index()
df_heatmap['PoleBlock'] = df_heatmap['PoleIndex'].apply(lambda x: f"Block {x+1}")
pivot = df_heatmap.pivot(index='Area', columns='PoleBlock', values='AlertNum')

# Create heatmap figure
def create_heatmap(data):
    fig = go.Figure(data=go.Heatmap(
        z=data.values,
        x=data.columns,
        y=data.index,
        colorscale=[[0, "green"], [0.5, "yellow"], [1.0, "red"]],
        zmin=1,
        zmax=3,
        colorbar=dict(title="Alert Level (1=Green, 2=Yellow, 3=Red)")
    ))
    fig.update_layout(title="Smart Pole Health Heatmap (Aggregated)", height=600)
    return fig

# Dash app
app = dash.Dash(__name__)
server = app.server  # for Hugging Face

# Blinking style (for red alerts)
blinking_style = {
    "animation": "blinker 1s linear infinite",
    "color": "red",
    "fontWeight": "bold",
    "fontSize": "16px",
    "margin": "5px",
    "display": "inline-block"
}

# Layout
app.layout = html.Div([
    html.H1("Vedavathi Smart Pole Monitoring - Heatmap", style={"textAlign": "center"}),

    dcc.Graph(figure=create_heatmap(pivot)),

    html.Div([
        html.H3("🚨 Red Alert Poles (Sample View)", style={"color": "red", "textAlign": "center"}),
        html.Div([
            html.Span(f"{row['Area']} - {row['Pole']}", style=blinking_style)
            for _, row in df[df["AlertLevel"] == "Red"].sample(n=20).iterrows()
        ], style={"textAlign": "center"})
    ]),

    dcc.Markdown('''
    <style>
    @keyframes blinker {
        50% { opacity: 0; }
    }
    </style>
    ''', dangerously_allow_html=True)
])

# Run the app
if __name__ == "__main__":
    app.run(debug=False, host="0.0.0.0", port=7860)