@model vassago.Models.Configuration
@using Newtonsoft.Json;
@using vassago.Behavior;
@using vassago.TwitchInterface;
@using System.Text;

<a href="/">home</a>/configuration
<form action="@Url.Action("submit", "Configuration")" method="post" id="theForm">
    <input type="hidden" name="Id" value="@Model.Id" />
  <table class="table">
    <tbody>
    <tr>
        <th colspan="2">Discord (@(Model?.DiscordTokens?.Count ?? 0) accounts)</th>
    </tr>
    @{
        if(Model.DiscordTokens != null) for(var i = 0; i < Model.DiscordTokens.Count; i++)
        {
            <tr>
                <th><label for="DiscordTokens[@i]"></label></th>
                <td>
                    <input type="text" class="form-control" name="DiscordTokens[@i]" value="@Model.DiscordTokens[i]"/>
                    <button type="button" onclick="removeDiscord(@i)" class="btn btn-danger">del</button>
                </td>
            </tr>
        }
    }
    <tr>
        <td></td>
        <td>
            <button type="button" onclick="addDiscord.showModal()">add</button>
        </td>
    </tr>
    <tr>
        <th><label class="form-check-label" for="SetupDiscordSlashCommands">Setup Discord Slash Commands</label>
        <td><input type="checkbox" class="form-check-input position-static" name="SetupDiscordSlashCommands" checked="@Model.SetupDiscordSlashCommands" value="true"/></td>
    </tr>
    <tr>
        <th colspan="2">Twitch (@(Model?.TwitchConfigs?.Count ?? 0) accounts)</th>
    </tr>
    @{
        if(Model.TwitchConfigs != null) for(var i = 0; i < Model.TwitchConfigs.Count; i++)
        {
            var tc = JsonConvert.DeserializeObject<TwitchConfig>(Model.TwitchConfigs[i]);

            <tr>
                <th><label for="TwitchConfigs[@i]"></label></th>
                <td>
                    <input type="hidden" name="TwitchConfigs[@i]" id="TwitchConfigs_@i" value="@Model.TwitchConfigs[i]" />
                    <input type="text" class="form-control" data-name="username" value="@tc.username"/>
                    <input type="text" class="form-control" data-name="oauth" value="@tc.oauth"/>
                    <button type="button" onclick="removeTwitch(@i);" class="btn btn-danger">del</button>
                </td>
            </tr>
        }
    }
    <tr>
        <td></td>
        <td>
            <button type="button" onclick="addTwitch.showModal()">add</button>
        </td>
    </tr>
    <tr class="form-text">
        <th><label for="ExchangePairsLocation">Exchange Pairs Location</label></th>
        <td><input type="text" class="form-control" name="ExchangePairsLocation" value="@Model.ExchangePairsLocation"/></td>
    </tr>
    <tr class="form-text">
        <th><label for="KafkaBootstrap">Kafka Bootstrap Server</label></th>
        <td><input type="text" class="form-control" name="KafkaBootstrap" value="@Model.KafkaBootstrap"/></td>
    </tr>
    <tr class="form-text">
        <th><label for="KafkaName">Kafka Name</label></th>
        <td><input type="text" class="form-control" name="KafkaName" value="@Model.KafkaName"/></td>
    </tr>
    <tr class="form-text">
        <th><label for="reportedApiUrl">reportedApiUrl</label></th>
        <td><input type="text" class="form-control" name="reportedApiUrl" value="@Model.reportedApiUrl"/></td>
    </tr>
    <tr class="form-text">
        <td colspan="2"><button class="btn btn-success" type="button" onclick="complexSubmit()">save</button></td>
    </tr>
    </tbody>
</table>
</form>
<dialog id="addDiscord">
    <form action="@Url.Action("AddDiscord", "Configuration")" method="post">
        <input type="text" class="form-control" name="newToken" />
        <button class="btn btn-secondary" type="button" onclick="addDiscord.close()">cancel</button>
        <button class="btn btn-success" type="submit">save</button>
    </form>
</dialog>
<dialog id="removeDiscordDialog">
    <form action="@Url.Action("RemoveDiscord", "Configuration")" method="post">
        Are you sure?
        <input type="hidden" name="index" id="removeDiscordTarget" />
        <button class="btn btn-secondary" type="button" onclick="removeDiscordDialog.close()">cancel</button>
        <button class="btn btn-danger" type="submit">delete</button>
    </form>
</dialog>
<dialog id="addTwitch">
    <form action="@Url.Action("AddTwitch", "Configuration")" method="post">
        username: <input type="text" class="form-control" name="newUsername" />
        oauth: <input type="text" class="form-control" name="newOauth" />
        <button class="btn btn-secondary" type="button" onclick="addTwitch.close()">cancel</button>
        <button class="btn btn-success" type="submit">save</button>
    </form>
</dialog>
<dialog id="removeTwitchDialog">
    <form action="@Url.Action("RemoveTwitch", "Configuration")" method="post">
        Are you sure?
        <input type="hidden" name="id" id="removeTwitchTarget" />
        <button class="btn btn-secondary" type="button" onclick="removeTwitchDialog.close()">cancel</button>
        <button class="btn btn-danger" type="submit">delete</button>
    </form>
</dialog>
@section scripts{
<script type="text/javascript">

function removeDiscord(idx){
    removeDiscordTarget.Value = idx;
    console.log("removeDiscordTarget is now " + idx);
    removeDiscordDialog.showModal();
}
function removeTwitch(idx){
    removeTwitchTarget.value = idx;
    removeTwitchDialog.showModal();
}
function complexSubmit()
{
    for (let i = 0; true; i++)
    {
        let thisCell = document.querySelector("td>#TwitchConfigs_" + i);
        if(thisCell !== null)
        {
            let usernameElem = thisCell.nextElementSibling;
            let oauthElem = usernameElem.nextElementSibling;
            let asObj = {username: usernameElem.value, oauth: oauthElem.value};
            thisCell.value = JSON.stringify(asObj);
        }
        else
        {
            break;
        }
    }
    theForm.submit();
}
</script>
}