LANCommander/LANCommander/Components/ActionEditor.razor

@using LANCommander.Data.Models
@using LANCommander.Extensions

@{
    int i = 0;
}
<div class="table-responsive">
    <table class="table mb-0">
        <thead>
            <tr>
                <th>Name</th>
                <th>Path</th>
                <th>Arguments</th>
                <th>Working Dir</th>
                <th>Primary</th>
                <th></th>
            </tr>
        </thead>

        <tbody>
            @if (Actions == null || Actions.Count == 0)
            {
                <tr><td colspan="6">Actions are used to start the game or launch other executables. It is recommended to have at least one action to launch the game.</td></tr>
            }

            @foreach (var action in Actions.OrderBy(a => a.SortOrder))
            {
                var index = i;

                <tr>
                    <td><input @bind="action.Name" name="Game.Actions[@i].Name" class="form-control" placeholder="Play" /></td>
                    <td><input @bind="action.Path" name="Game.Actions[@i].Path" class="form-control" placeholder="Game.exe" /></td>
                    <td><input @bind="action.Arguments" name="Game.Actions[@i].Arguments" class="form-control" placeholder="Launch Arguments" /></td>
                    <td><input @bind="action.WorkingDirectory" name="Game.Actions[@i].WorkingDirectory" class="form-control" placeholder="Working Directory" /></td>
                    <td class="align-middle">
                        <div class="form-check form-check-inline mb-0">
                            <input name="Game.Actions[@i].PrimaryAction" class="form-check-input" type="checkbox" checked="@action.PrimaryAction" value="true" />
                        </div>
                    </td>
                    <td>
                        <input name="Game.Actions[@i].Id" type="hidden" value="@action.Id" />
                        <input name="Game.Actions[@i].GameId" type="hidden" value="@GameId" />
                        <input name="Game.Actions[@i].SortOrder" type="hidden" value="@i" />

                        <div class="btn-list flex-nowrap justify-content-end">
                            <button class="btn btn-ghost-secondary btn-icon" @onclick="() => MoveUp(index)" type="button">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-chevron-up" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                                   <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                                   <polyline points="6 15 12 9 18 15"></polyline>
                                </svg>
                            </button>

                            <button class="btn btn-ghost-secondary btn-icon" @onclick="() => MoveDown(index)" type="button">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-chevron-down" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                                    <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                                    <polyline points="6 9 12 15 18 9"></polyline>
                                </svg>
                            </button>

                            <button class="btn btn-ghost-danger btn-icon" @onclick="() => RemoveAction(index)" type="button">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-x" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                                    <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                                    <line x1="18" y1="6" x2="6" y2="18"></line>
                                    <line x1="6" y1="6" x2="18" y2="18"></line>
                                </svg>
                            </button>
                        </div>
                    </td>
                </tr>

                i++;
            }
            <tr>
                <td colspan="6">
                    <div class="btn-list flex-nowrap justify-content-end">

                        <button class="btn btn-ghost-primary" @onclick="AddAction" type="button">Add Action</button>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</div>

@code {
    [Parameter] public List<Data.Models.Action> Actions { get; set; }
    [Parameter] public Guid GameId { get; set; }

    protected override void OnInitialized()
    {
        Actions = Actions.OrderBy(a => a.SortOrder).ToList();

        FixSortOrders();

        base.OnInitialized();
    }

    private void AddAction()
    {
        if (Actions == null)
            Actions = new List<Data.Models.Action>();

        Actions.Add(new Data.Models.Action()
        {
            PrimaryAction = Actions.Count == 0,
            SortOrder = Actions.Count
        });
    }

    private void RemoveAction(int index)
    {
        Actions.Remove(Actions.ElementAt(index));

        FixSortOrders();
    }

    private void MoveUp(int index)
    {
        if (index == 0)
            return;

        Actions.Move(Actions.ElementAt(index), index - 1);
        FixSortOrders();
    }

    private void MoveDown(int index)
    {
        if (index == Actions.Count - 1)
            return;

        Actions.Move(Actions.ElementAt(index), index + 1);
        FixSortOrders();
    }

    private void FixSortOrders() {
        for (int i = 0; i < Actions.Count; i++)
        {
            Actions.ElementAt(i).SortOrder = i;
        }
    }
}