@page "/simulation"
@inject GameSimulationService SimService

<PageTitle>Ecology Simulation</PageTitle>

<div class="section-header d-flex align-items-center mb-4">
    <h1 class="mb-0">Ecology Simulation</h1>
    <div class="ms-3 flex-grow-1 border-bottom opacity-25"></div>
</div>

@if (!SimService.Data.IsInitialized)
{
    <div class="text-center py-5">
        <p class="lead mb-4">Simulate 20 turns of predator, prey, and flora ecology across the valley.</p>
        <button class="btn btn-primary btn-lg" @onclick="StartSimulation">Run Simulation</button>
    </div>
}
else
{
    <div class="simulation-layout">
        <div class="sim-controls d-flex align-items-center justify-content-between mb-3 flex-wrap gap-2">
            <div class="d-flex align-items-center gap-2">
                <button class="btn btn-outline-light btn-sm" @onclick="PrevTurn" disabled="@(SimService.Data.CurrentTurn <= 0)">
                    &#9664; Prev
                </button>
                <span class="turn-label">
                    @if (SimService.Data.CurrentTurn == 0)
                    {
                        <span>Initial Setup</span>
                    }
                    else
                    {
                        <span>After Turn <strong>@SimService.Data.CurrentTurn</strong> / 20</span>
                    }
                </span>
                <button class="btn btn-outline-light btn-sm" @onclick="NextTurn" disabled="@(SimService.Data.CurrentTurn >= 20)">
                    Next &#9654;
                </button>
            </div>
            <div class="d-flex align-items-center gap-2 flex-wrap">
                @if (CurrentEvent != null)
                {
                    @foreach (var act in CurrentEvent.Activations)
                    {
                        <span class="event-badge badge bg-@BadgeClass(act.MeepleType)">
                            @act.MeepleType in @act.RegionType
                        </span>
                    }
                }
                <button class="btn btn-secondary btn-sm" @onclick="RandomizeEvents">&#8635; Randomize Events</button>
            </div>
        </div>

        <div class="sim-map-container">
            <svg viewBox="0 0 700 461" class="sim-svg">
                <defs>
                    <radialGradient id="sg-Grass" cx="50%" cy="50%" r="50%">
                        <stop offset="0%" stop-color="#4caf50" stop-opacity="0.3"/>
                        <stop offset="100%" stop-color="#4caf50" stop-opacity="0"/>
                    </radialGradient>
                    <radialGradient id="sg-Forest" cx="50%" cy="50%" r="50%">
                        <stop offset="0%" stop-color="#2e7d32" stop-opacity="0.3"/>
                        <stop offset="100%" stop-color="#2e7d32" stop-opacity="0"/>
                    </radialGradient>
                    <radialGradient id="sg-Mountain" cx="50%" cy="50%" r="50%">
                        <stop offset="0%" stop-color="#78909c" stop-opacity="0.3"/>
                        <stop offset="100%" stop-color="#78909c" stop-opacity="0"/>
                    </radialGradient>
                    <radialGradient id="sg-Water" cx="50%" cy="50%" r="50%">
                        <stop offset="0%" stop-color="#42a5f5" stop-opacity="0.3"/>
                        <stop offset="100%" stop-color="#42a5f5" stop-opacity="0"/>
                    </radialGradient>
                    <radialGradient id="sg-Wasteland" cx="50%" cy="50%" r="50%">
                        <stop offset="0%" stop-color="#8d6e63" stop-opacity="0.3"/>
                        <stop offset="100%" stop-color="#8d6e63" stop-opacity="0"/>
                    </radialGradient>
                </defs>

                <image href="docs/Map.png" width="700" height="461" preserveAspectRatio="xMidYMid meet"/>

                @{
                    var currentRegions = SimService.GetCurrentState();
                    var prevRegions = SimService.GetPreviousState();
                    var prevLookup = prevRegions.ToDictionary(r => r.Name);
                    var activatedRegionNames = new HashSet<string>();
                    if (CurrentEvent != null)
                    {
                        var activatedTerrain = CurrentEvent.Activations.Select(a => a.RegionType).ToHashSet();
                        activatedRegionNames = currentRegions
                            .Where(r => activatedTerrain.Contains(r.Terrain))
                            .Select(r => r.Name)
                            .ToHashSet();
                    }
                }

                @foreach (var line in GetConnectionLines(currentRegions))
                {
                    <line x1="@line.X1" y1="@line.Y1" x2="@line.X2" y2="@line.Y2"
                          stroke="rgba(255,255,255,0.12)" stroke-width="2" stroke-linecap="round"/>
                }

                @foreach (var region in currentRegions)
                {
                    var isActivated = activatedRegionNames.Contains(region.Name);
                    var terrainColor = GetTerrainColor(region.Terrain);
                    var labelX = region.X + 24;
                    var prev = prevLookup.GetValueOrDefault(region.Name);
                    var dp = prev != null ? region.PredatorMeeples - prev.PredatorMeeples : 0;
                    var dr = prev != null ? region.PreyMeeples - prev.PreyMeeples : 0;
                    var df = prev != null ? region.FloraMeeples - prev.FloraMeeples : 0;
                    var hasDelta = dp != 0 || dr != 0 || df != 0;
                    <g class="sim-region @(isActivated ? "sim-active" : "")">
                        <circle cx="@region.X" cy="@region.Y" r="34" fill="url(#sg-@region.Terrain)"/>
                        <circle cx="@region.X" cy="@region.Y" r="18"
                                fill="@(terrainColor)cc"
                                stroke="@(isActivated ? "#ffd700" : "rgba(255,255,255,0.5)")"
                                stroke-width="@(isActivated ? 3 : 2)"/>
                        <text x="@labelX" y="@(region.Y + 4)" fill="rgba(255,255,255,0.9)"
                              font-family="system-ui,sans-serif" font-size="11" font-weight="600">
                            @region.Name
                        </text>
                        <text x="@labelX" y="@(region.Y + 20)" fill="rgba(255,255,255,0.7)"
                              font-family="system-ui,sans-serif" font-size="10">
                            P:@region.PredatorMeeples R:@region.PreyMeeples F:@region.FloraMeeples
                        </text>
                        @if (hasDelta && SimService.Data.CurrentTurn > 0)
                        {
                            var dy = region.Y + 34;
                            var parts = new List<string>();
                            if (dp != 0) parts.Add($"<tspan fill=\"{(dp > 0 ? "#4caf50" : "#e76f51")}\">{(dp > 0 ? "+" : "")}{dp}P</tspan>");
                            if (dr != 0) parts.Add($"<tspan fill=\"{(dr > 0 ? "#4caf50" : "#e76f51")}\">{(dr > 0 ? "+" : "")}{dr}R</tspan>");
                            if (df != 0) parts.Add($"<tspan fill=\"{(df > 0 ? "#4caf50" : "#e76f51")}\">{(df > 0 ? "+" : "")}{df}F</tspan>");
                            var deltaHtml = $"<text x=\"{labelX}\" y=\"{dy}\" font-family=\"system-ui,sans-serif\" font-size=\"9\">{string.Join(" ", parts)}</text>";
                            @((MarkupString)deltaHtml)
                        }
                    </g>
                }
            </svg>
        </div>

        @if (CurrentEvent != null && CurrentEvent.Details.Count > 0)
        {
            <div class="sim-details mt-3">
                <h5 class="text-muted mb-2">Turn @CurrentEvent.TurnNumber Details</h5>
                <div class="sim-details-scroll">
                    @foreach (var detail in CurrentEvent.Details)
                    {
                        <div class="sim-detail-item">@detail</div>
                    }
                </div>
            </div>
        }

        <div class="sim-totals mt-3 d-flex gap-4 justify-content-center">
            @{
                var totals = SimService.GetCurrentState();
            }
            <div class="total-pred"><span class="total-dot" style="background:#e76f51"></span> Predators: @totals.Sum(r => r.PredatorMeeples)</div>
            <div class="total-prey"><span class="total-dot" style="background:#e9c46a"></span> Prey: @totals.Sum(r => r.PreyMeeples)</div>
            <div class="total-flora"><span class="total-dot" style="background:#4caf50"></span> Flora: @totals.Sum(r => r.FloraMeeples)</div>
        </div>

        <div class="sim-chart mt-3">
            <h5 class="text-muted mb-2">Population Trend</h5>
            <svg viewBox="0 0 720 160" class="sim-chart-svg">
                @{
                    var history = SimService.GetPopulationHistory();
                    var maxPop = Math.Max(history.Max(h => h.predators + h.prey + h.flora), 10);
                    var chartW = 700d;
                    var chartH = 120d;
                    var chartY = 20d;
                    var stepX = history.Length > 1 ? chartW / (history.Length - 1) : chartW;

                    string MakePath(Func<int, int> getVal, string color)
                    {
                        var pts = history.Select((h, i) =>
                        {
                            var x = i * stepX;
                            var y = chartY + chartH - (getVal(i) / (double)maxPop) * chartH;
                            return $"{x:F1},{y:F1}";
                        });
                        var d = "M" + string.Join(" L", pts);
                        return $"<path d=\"{d}\" fill=\"none\" stroke=\"{color}\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>";
                    }

                    // Y axis labels
                    @((MarkupString)$"<text x=\"0\" y=\"{chartY + 10}\" fill=\"rgba(255,255,255,0.3)\" font-size=\"9\">{maxPop}</text>")
                    @((MarkupString)$"<text x=\"0\" y=\"{chartY + chartH}\" fill=\"rgba(255,255,255,0.3)\" font-size=\"9\">0</text>")

                    // Grid lines
                    <line x1="0" y1="@(chartY + chartH)" x2="@chartW" y2="@(chartY + chartH)" stroke="rgba(255,255,255,0.06)" stroke-width="1"/>
                    <line x1="0" y1="@chartY" x2="@chartW" y2="@chartY" stroke="rgba(255,255,255,0.06)" stroke-width="1"/>

                    // Current turn marker
                    var markerX = SimService.Data.CurrentTurn * stepX;
                    <line x1="@markerX" y1="@chartY" x2="@markerX" y2="@(chartY + chartH)" stroke="rgba(255,255,255,0.25)" stroke-width="1" stroke-dasharray="3,3"/>

                    @((MarkupString)MakePath(i => history[i].predators, "#e76f51"))
                    @((MarkupString)MakePath(i => history[i].prey, "#e9c46a"))
                    @((MarkupString)MakePath(i => history[i].flora, "#4caf50"))

                    // Turn markers on x-axis
                    @for (int i = 0; i < history.Length; i += 5)
                    {
                        var x = i * stepX;
                        @((MarkupString)$"<text x=\"{x}\" y=\"{chartY + chartH + 14}\" fill=\"rgba(255,255,255,0.25)\" font-size=\"8\" text-anchor=\"middle\">{i}</text>")
                    }
                }
            </svg>
            <div class="sim-chart-legend d-flex gap-3 justify-content-center mt-1">
                <span class="small"><span class="total-dot" style="background:#e76f51"></span> Predators</span>
                <span class="small"><span class="total-dot" style="background:#e9c46a"></span> Prey</span>
                <span class="small"><span class="total-dot" style="background:#4caf50"></span> Flora</span>
            </div>
        </div>
    </div>
}


@code {
    private TurnEvent? CurrentEvent => SimService.Data.CurrentTurn > 0 && SimService.Data.CurrentTurn <= SimService.Data.Events.Count
        ? SimService.Data.Events[SimService.Data.CurrentTurn - 1]
        : null;

    private static string BadgeClass(string meepleType) => meepleType switch
    {
        "Predator" => "danger",
        "Prey" => "warning",
        "Flora" => "success",
        _ => "secondary"
    };

    protected override void OnInitialized()
    {
        SimService.RunSimulation();
    }

    private void StartSimulation()
    {
        SimService.RunSimulation();
    }

    private void PrevTurn()
    {
        if (SimService.Data.CurrentTurn > 0)
            SimService.Data.CurrentTurn--;
    }

    private void NextTurn()
    {
        if (SimService.Data.CurrentTurn < 20)
            SimService.Data.CurrentTurn++;
    }

    private void RandomizeEvents()
    {
        SimService.RandomizeEvents();
    }

    private static string GetTerrainColor(string terrain)
    {
        return terrain switch
        {
            "Grass" => "#4caf50",
            "Forest" => "#2e7d32",
            "Mountain" => "#78909c",
            "Water" => "#42a5f5",
            "Wasteland" => "#8d6e63",
            _ => "#888"
        };
    }

    private record ConnectionLine(int X1, int Y1, int X2, int Y2);

    private List<ConnectionLine> GetConnectionLines(List<RegionState> regions)
    {
        var lookup = regions.ToDictionary(r => r.Name);
        var lines = new List<ConnectionLine>();
        var drawn = new HashSet<string>();

        foreach (var region in regions)
        {
            foreach (var conn in region.Connections)
            {
                var key = string.Compare(region.Name, conn, StringComparison.OrdinalIgnoreCase) < 0
                    ? $"{region.Name}|{conn}"
                    : $"{conn}|{region.Name}";

                if (!drawn.Add(key)) continue;
                if (!lookup.TryGetValue(conn, out var target)) continue;

                lines.Add(new ConnectionLine(region.X, region.Y, target.X, target.Y));
            }
        }

        return lines;
    }
}