@page "{handler?}"
@{
    Layout = null;
}
@using Volo.ClientSimulation
@using Volo.ClientSimulation.Clients
@using Volo.ClientSimulation.Pages.ClientSimulation
@model Volo.ClientSimulation.Pages.ClientSimulation.SimulationAreaModel
<abp-alert alert-type="Primary">
    <form class="d-inline" id="StartButtonForm" method="post" asp-page-handler="Start" data-ajaxForm="true">
        <abp-button button-type="Primary" type="submit" disabled="@(Model.Simulation.State != SimulationState.Stopped)">Start</abp-button>
    </form>
    <form class="d-inline" id="StopButtonForm" method="post" asp-page-handler="Stop" data-ajaxForm="true">
        <abp-button button-type="Primary" type="submit" disabled="@(Model.Simulation.State != SimulationState.Started)">Stop</abp-button>
    </form>
    <span class="ml-3">
        @Model.Simulation.State
    </span>
</abp-alert>
<abp-card class="mt-3">
    <abp-card-body>
        @foreach (var client in Model.Simulation.Clients)
        {
            <span class="simulation-client simulation-client-@client.State.ToString().ToLowerInvariant()">
                <span class="simulation-client-icon">
                    @if (client.State == ClientState.Running)
                    {
                        <i class="fa fa-play"></i>
                    }
                    else if (client.State == ClientState.Stopping)
                    {
                        <i class="fa fa-eject"></i>
                    }
                    else if (client.State == ClientState.Stopped)
                    {
                        <i class="fa fa-stop"></i>
                    }
                </span>
                <span class="simulation-client-scenario">
                    @client.Scenario.GetDisplayText()
                </span>
                <span class="simulation-client-scenario-current-step">
                @if (client.State != ClientState.Stopped)
                {
                    <text>| @client.Scenario.CurrentStep.GetDisplayText()</text>
                }
                </span>
            </span>
        }
    </abp-card-body>
</abp-card>