@page "/editquiz"
@using BlazorQuiz.Common.Models
@inject HttpClient Http

<h1>Edit Blazor quiz!</h1>

@{
    if (quiz == null)
    {
    <p><em>Loading...</em></p>
    }
    else
    {
        int quizIndex = 0;
        foreach (var quizItem in quiz)
        {
            <section>
                    <h3>@quizItem.Question</h3>
                    <button class="btn-remove" @onclick="() => RemoveQuestion(quizItem)">X</button>
                    <div class="form-check">
                        @{
                        int choiceIndex = 0;
                        }
                        @foreach (var choice in quizItem.Options)
                    {
                            <input class="form-check-input" type="radio" name="@quizIndex" value="@choiceIndex" />
                            @choice
                            <br>
                        choiceIndex++;
                    }
                    </div>
            </section>
            quizIndex++;
    <br/>
        }
    }
}

<h3>Add New</h3>
<div class="add-new-question">
<p class="add-new-question-row">
    <label class="add-new-question-cell">Question:</label>
    <input class="add-new-question-cell" type="text" name="question" @bind="_new.Question" size="120" />
</p>
<p class="add-new-question-row">
    <label class="add-new-question-cell">Option: </label>
    <input class="add-new-question-cell" type="text" name="option" @bind-value="UserInput" @bind-value:event="oninput" @onkeydown="CheckInput" size="60" />
</p>
@if (_new.Options is not null)
{
    foreach (var item in _new.Options)
    {
        <h5>@item</h5>
    }
}
<p class="add-new-question-row">
    <label class="add-new-question-cell">IndexCorrectAnswer: </label>
    <input class="add-new-question-cell" type="number" name="indexAnswer" @bind="_new.IndexCorrectAnswer" />
</p>
<p class="add-new-question-row">
        <label class="add-new-question-cell">Score: </label>
        <input class="add-new-question-cell" type="number" name="score" @bind="_new.Score" />
</p>
<button name="AddQuestion" @onclick="AddQuestion" type="submit">Add</button>
<br />
<br />
</div>

<br /><br/>

@code {
    private Quiz[] quiz;
    private Quiz _new=new Quiz();
    private bool _loaded = false;
    private string UserInput = string.Empty;
    bool _isTaskRunning = false;

    protected override async Task OnInitializedAsync()
    {
        await LoadQuiz();
        _loaded = true;
    }

    private async Task LoadQuiz()
    {
        quiz = await Http.GetFromJsonAsync<Quiz[]>("https://blazorquizfunctionapp20221013002852.azurewebsites.net/api/BlazorQuiz");
    }

    private void CheckInput(KeyboardEventArgs keyEvent)
    {
        if (keyEvent.Key == "Enter")
        {
            AddToList(UserInput);
            UserInput = string.Empty;
        }
    }

    private void AddToList(string str)
    {
        _new.Options.Add(str);
    }

    public async Task AddQuestion(){
        _isTaskRunning = true;
        _new.id = (quiz.Count() + 3).ToString();
        await Http.PostAsJsonAsync("https://blazorquizfunctionapp20221013002852.azurewebsites.net/api/PostQuestion", _new);
        await LoadQuiz();
        _isTaskRunning = false;
        _new = new Quiz();
    }

    public async Task RemoveQuestion(Quiz question)
    {
        _isTaskRunning = true;
        quiz = quiz.Where(q => q != question).ToArray();
        // Also tried _cards.RemoveAll(i => i.TitleElementId == card.TitleElementId);
        await Http.PutAsJsonAsync("https://blazorquizfunctionapp20221013002852.azurewebsites.net/api/DeleteQuestion", question);
        await LoadQuiz();
        _isTaskRunning = false;
    }
}