@model BTCPayServer.Models.ServerViewModels.DynamicDnsViewModel
@{
    ViewData.SetActivePage(ServerNavPages.Services, "Dynamic DNS Service");
}

@section PageFootContent {
    <script>
        delegate('click', '.serviceSettings', e => {
            document.getElementById('ServiceUrl').value = e.target.dataset.url;
        });
    </script>
}
<form method="post">
    <div class="sticky-header">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item">
                    <a asp-action="Services">Services</a>
                </li>
                <li class="breadcrumb-item">
                    <a asp-action="DynamicDnsService">Dynamic DNS Settings</a>
                </li>
                <li class="breadcrumb-item active" aria-current="page">@ViewData["Title"]</li>
            </ol>
            <h2>
                <span>@ViewData["Title"]</span>
                <small>
                    <a href="https://docs.btcpayserver.org/Apps/" target="_blank" rel="noreferrer noopener" title="More information...">
                        <vc:icon symbol="info" />
                    </a>
                </small>
            </h2>
        </nav>
		<button id="page-primary" name="command" class="btn btn-primary" type="submit" value="Save">Save</button>
    </div>
    <partial name="_StatusMessage" />

    <div class="row">
        <div class="col-md-8">
            @if (!ViewContext.ModelState.IsValid)
            {
                <div asp-validation-summary="All"></div>
            }
            <div class="form-group">
                <input type="hidden" asp-for="Modify"/>
                <div class="form-group">
                    <label asp-for="Settings.ServiceUrl" class="form-label"></label>
                    <input id="ServiceUrl" asp-for="Settings.ServiceUrl" class="form-control" placeholder="Url"/>
                    <div class="form-text">
                        Well-known Dynamic DNS providers are:
                        @for (var i = 0; i < Model.KnownServices.Length; i++)
                        {
                            <a href="#" class="serviceSettings" data-url="@Model.KnownServices[i].Url">@Model.KnownServices[i].Name</a>
                            <span>@(i == Model.KnownServices.Length - 1 ? "" : ",")</span>
                        }
                    </div>
                </div>
                <div class="form-group">
                    <label asp-for="Settings.Hostname" class="form-label"></label>
                    @if (Model.Modify)
                    {
                        <input asp-for="Settings.Hostname" class="form-control" readonly placeholder="Hostname"/>
                        <div class="form-text">
                            <span>The DNS record has been refreshed: </span>
                            @if (Model.LastUpdated != null)
                            {
                                <span>@Model.LastUpdated</span>
                            }
                        </div>
                    }
                    else
                    {
                        <input asp-for="Settings.Hostname" class="form-control" placeholder="Hostname"/>
                        <span asp-validation-for="Settings.Hostname" class="text-danger"></span>
                    }
                </div>
                <div class="form-group">
                    <label asp-for="Settings.Login" class="form-label"></label>
                    <input asp-for="Settings.Login" class="form-control" placeholder="Login"/>
                </div>
                <div class="form-group">
                    <label asp-for="Settings.Password" class="form-label"></label>
                    <input asp-for="Settings.Password" class="form-control" placeholder="Password"/>
                </div>
                @if (Model.Modify)
                {
                    <div class="form-group">
                        <label asp-for="Settings.Enabled" class="form-label"></label>
                        <input asp-for="Settings.Enabled" disabled type="checkbox" class="btcpay-toggle ms-2" />
                    </div>
                }
            </div>
        </div>
    </div>
</form>