@using CarCareTracker.Helper
@model SettingsViewModel
@inject ITranslationHelper translator
@{
    var userLanguage = Model.UserConfig.UserLanguage;
}

<div class="row">
    <div class="d-flex justify-content-center">
        <h6 class="display-6 mt-2">@translator.Translate(userLanguage, "Settings")</h6>
    </div>
    <hr />
    <div class="col-12 col-md-6">
        <input id="preferredGasUnit" style="display:none;" value="@Model.UserConfig.PreferredGasUnit" />
        <input id="preferredFuelMileageUnit" style="display:none;" value="@Model.UserConfig.PreferredGasMileageUnit" />
        <div class="form-check form-switch form-check-inline">
            <input class="form-check-input" onChange="updateColorModeSettings(this)" type="checkbox" role="switch" id="enableDarkMode" checked="@Model.UserConfig.UseDarkMode">
            <label class="form-check-label" for="enableDarkMode">@translator.Translate(userLanguage, "Dark Mode")</label>
        </div>
        <div class="form-check form-switch form-check-inline">
            <input class="form-check-input" onChange="updateColorModeSettings(this)" type="checkbox" role="switch" id="useSystemColorMode" checked="@Model.UserConfig.UseSystemColorMode">
            <label class="form-check-label" for="useSystemColorMode">@translator.Translate(userLanguage, "Adaptive Color Mode")</label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="enableCsvImports" checked="@Model.UserConfig.EnableCsvImports">
            <label class="form-check-label" for="enableCsvImports">@translator.Translate(userLanguage, "Enable CSV Imports")</label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="useMPG" checked="@Model.UserConfig.UseMPG">
            <label class="form-check-label" for="useMPG">@translator.Translate(userLanguage, "Use Imperial Calculation for Fuel Economy Calculations(MPG)")<br /><small class="text-body-secondary">@translator.Translate(userLanguage, "This Will Also Change Units to Miles and Gallons")</small></label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="useUKMPG" checked="@Model.UserConfig.UseUKMPG">
            <label class="form-check-label" for="useUKMPG">@translator.Translate(userLanguage, "Use UK MPG Calculation")<br /><small class="text-body-secondary">@translator.Translate(userLanguage, "Input Gas Consumption in Liters, it will be converted to UK Gals for MPG Calculation")</small></label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="useDescending" checked="@Model.UserConfig.UseDescending">
            <label class="form-check-label" for="useDescending">@translator.Translate(userLanguage, "Sort lists in Descending Order(Newest to Oldest)")</label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="hideZero" checked="@Model.UserConfig.HideZero">
            <label class="form-check-label" for="hideZero">@translator.Translate(userLanguage, "Replace $0.00 Costs with ---")</label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="useThreeDecimal" checked="@Model.UserConfig.UseThreeDecimalGasCost">
            <label class="form-check-label" for="useThreeDecimal">@translator.Translate(userLanguage, "Use Three Decimals For Fuel Cost")</label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="useMarkDownOnSavedNotes" checked="@Model.UserConfig.UseMarkDownOnSavedNotes">
            <label class="form-check-label" for="useMarkDownOnSavedNotes">@translator.Translate(userLanguage, "Display Saved Notes in Markdown")</label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="enableAutoReminderRefresh" checked="@Model.UserConfig.EnableAutoReminderRefresh">
            <label class="form-check-label" for="enableAutoReminderRefresh">@translator.Translate(userLanguage, "Auto Refresh Lapsed Recurring Reminders")</label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="enableAutoOdometerInsert" checked="@Model.UserConfig.EnableAutoOdometerInsert">
            <label class="form-check-label" for="enableAutoOdometerInsert">@translator.Translate(userLanguage, "Auto Insert Odometer Records")<br /><small class="text-body-secondary">@translator.Translate(userLanguage, "Only when Adding Service/Repair/Upgrade/Fuel Record or Completing a Plan")</small></label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="enableExtraFieldColumns" checked="@Model.UserConfig.EnableExtraFieldColumns">
            <label class="form-check-label" for="enableExtraFieldColumns">@translator.Translate(userLanguage, "Show Extra Field Columns")<br /><small class="text-body-secondary">@translator.Translate(userLanguage, "Enabling this may cause performance issues")</small></label>
        </div>
        <div class="form-check form-switch">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="hideSoldVehicles" checked="@Model.UserConfig.HideSoldVehicles">
            <label class="form-check-label" for="hideSoldVehicles">@translator.Translate(userLanguage, "Hide Sold Vehicles")</label>
        </div>
        <div class="form-check form-switch @(User.IsInRole(nameof(UserData.IsRootUser)) ? "" : "d-none")">
            <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="enableShopSupplies" checked="@Model.UserConfig.EnableShopSupplies">
            <label class="form-check-label" for="enableShopSupplies">@translator.Translate(userLanguage, "Shop Supplies")</label>
        </div>
        @if (User.IsInRole(nameof(UserData.IsRootUser)))
        {
            <div class="form-check form-switch form-check-inline">
                <input class="form-check-input" onChange="enableAuthCheckChanged()" type="checkbox" role="switch" id="enableAuth" checked="@Model.UserConfig.EnableAuth">
                <label class="form-check-label" for="enableAuth">@translator.Translate(userLanguage, "Enable Authentication")</label>
            </div>
            @if (Model.UserConfig.EnableAuth)
            {
                <div class="form-check form-switch form-check-inline">
                    <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="disableRegistration" checked="@Model.UserConfig.DisableRegistration">
                    <label class="form-check-label" for="disableRegistration">@translator.Translate(userLanguage, "Disable Registration")</label>
                </div>
                <div class="form-check form-switch">
                    <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="enableRootUserOIDC" checked="@Model.UserConfig.EnableRootUserOIDC">
                    <label class="form-check-label" for="enableRootUserOIDC">@translator.Translate(userLanguage, "Enable OIDC for Root User")<br /><small class="text-body-secondary">@translator.Translate(userLanguage, "Uses the Default Reminder Email for OIDC Auth")</small></label>
                </div>
            }
        }
    </div>
    <div class="col-12 col-md-6">
        <div class="row" id="visibleTabs">
            <div class="col-12">
                <span class="lead">@translator.Translate(userLanguage, "Visible Tabs")</span>
            </div>
            <div class="col-12 col-md-6">
                <ul class="list-group">
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="ServiceRecord" id="serviceRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.ServiceRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="serviceRecordTab">@translator.Translate(userLanguage, "Service Records")</label>
                    </li>
                    <li class="list-group-item d-none">
                        <input onChange="updateSettings()" disabled class="form-check-input me-1" type="checkbox" value="Dashboard" id="dashboardTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.Dashboard) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="dashboardTab">@translator.Translate(userLanguage, "Dashboard")</label>
                    </li>
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="RepairRecord" id="repairRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.RepairRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="repairRecordTab">@translator.Translate(userLanguage, "Repairs")</label>
                    </li>
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="UpgradeRecord" id="upgradeRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.UpgradeRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="upgradeRecordTab">@translator.Translate(userLanguage, "Upgrades")</label>
                    </li>
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="GasRecord" id="gasRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.GasRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="gasRecordTab">@translator.Translate(userLanguage, "Fuel")</label>
                    </li>
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="OdometerRecord" id="odometerRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.OdometerRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="odometerRecordTab">@translator.Translate(userLanguage, "Odometer")</label>
                    </li>
                </ul>
            </div>
            <div class="col-12 col-md-6">
                <ul class="list-group">
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="TaxRecord" id="taxRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.TaxRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="taxRecordTab">@translator.Translate(userLanguage, "Taxes")</label>
                    </li>
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="NoteRecord" id="noteRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.NoteRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="noteRecordTab">@translator.Translate(userLanguage, "Notes")</label>
                    </li>
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="ReminderRecord" id="reminderRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.ReminderRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="reminderRecordTab">@translator.Translate(userLanguage, "Reminder")</label>
                    </li>
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="SupplyRecord" id="supplyRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.SupplyRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="supplyRecordTab">@translator.Translate(userLanguage, "Supplies")</label>
                    </li>
                    <li class="list-group-item">
                        <input onChange="updateSettings()" class="form-check-input me-1" type="checkbox" value="PlanRecord" id="planRecordTab" @(Model.UserConfig.VisibleTabs.Contains(ImportMode.PlanRecord) ? "checked" : "")>
                        <label class="form-check-label stretched-link" for="planRecordTab">@translator.Translate(userLanguage, "Planner")</label>
                    </li>
                </ul>
            </div>
        </div>
        <div class="row">
            <div class="col-12 col-md-6">
                <span class="lead">@translator.Translate(userLanguage, "Default Tab")</span>
                <select class="form-select" onchange="updateSettings()" id="defaultTab">
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.Dashboard)) value="Dashboard">@translator.Translate(userLanguage, "Dashboard")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.ServiceRecord)) value="ServiceRecord">@translator.Translate(userLanguage, "Service Record")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.RepairRecord)) value="RepairRecord">@translator.Translate(userLanguage, "Repairs")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.UpgradeRecord)) value="UpgradeRecord">@translator.Translate(userLanguage, "Upgrades")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.GasRecord)) value="GasRecord">@translator.Translate(userLanguage, "Fuel")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.TaxRecord)) value="TaxRecord">@translator.Translate(userLanguage, "Tax")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.NoteRecord)) value="NoteRecord">@translator.Translate(userLanguage, "Notes")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.ReminderRecord)) value="ReminderRecord">@translator.Translate(userLanguage, "Reminders")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.SupplyRecord)) value="SupplyRecord">@translator.Translate(userLanguage, "Supplies")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.PlanRecord)) value="PlanRecord">@translator.Translate(userLanguage, "Planner")</!option>
                    <!option @(StaticHelper.DefaultTabSelected(Model.UserConfig, ImportMode.OdometerRecord)) value="OdometerRecord">@translator.Translate(userLanguage, "Odometer")</!option>
                </select>
            </div>
            <div class="col-12 col-md-6">
                <span class="lead">@translator.Translate(userLanguage, "Language")</span>
                <select class="form-select" onchange="updateSettings()" id="defaultLanguage">
                    @foreach (string uiLanguage in Model.UILanguages)
                    {
                        <!option @(Model.UserConfig.UserLanguage == uiLanguage ? "selected" : "")>@uiLanguage</!option>
                    }
                </select>
            </div>
        </div>
        @if (User.IsInRole(nameof(UserData.IsRootUser)))
        {
            <div class="row">
                <div class="col-12 col-md-6">
                    <span class="lead">@translator.Translate(userLanguage, "Backups")</span>
                    <div class="row">
                        <div class="col-6 d-grid">
                            <button onclick="makeBackup()" class="btn btn-primary btn-md">@translator.Translate(userLanguage, "Create")</button>
                        </div>
                        <div class="col-6 d-grid">
                            <input onChange="restoreBackup(this)" type="file" accept=".zip" class="d-none" id="inputBackup">
                            <button onclick="openRestoreBackup()" class="btn btn-secondary btn-md">@translator.Translate(userLanguage, "Restore")</button>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-md-6">
                    <span class="lead">@translator.Translate(userLanguage, "Manage Languages")</span>
                    <div class="row">
                        <div class="col-6 d-grid">
                            <input onChange="uploadLanguage(this)" type="file" accept=".json" class="d-none" id="inputLanguage">
                            <button onclick="openUploadLanguage()" class="btn btn-primary btn-md">@translator.Translate(userLanguage, "Upload")</button>
                        </div>
                        <div class="col-6 d-grid">
                            <button onclick="deleteLanguage()" @(Model.UserConfig.UserLanguage == "en_US" ? "disabled" : "") class="btn btn-danger btn-md">@translator.Translate(userLanguage, "Delete")</button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-12 col-md-6">
                    <span class="lead">@translator.Translate(userLanguage, "Server-wide Settings")</span>
                    <div class="row">
                        <div class="col-6 d-grid">
                            <button onclick="showExtraFieldModal()" class="btn btn-primary btn-md">@translator.Translate(userLanguage, "Extra Fields")</button>
                        </div>
                        <div class="col-6 d-grid">
                            <button onclick="showReminderUrgencyThresholdModal()" class="btn btn-primary btn-md">@translator.Translate(userLanguage, "Reminders")</button>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-md-6">
                    <span class="lead">@translator.Translate(userLanguage, "Default Reminder Email")</span>
                    <div class="row">
                        <div class="col-12 d-grid">
                            <div class="input-group">
                                <input id="inputDefaultEmail" class="form-control" placeholder="@translator.Translate(userLanguage,"Default Email for Reminder")" value="@Model.UserConfig.DefaultReminderEmail" onkeydown="handleDefaultReminderInputKeyDown()">
                                 <div class="input-group-text">
                                    <button type="button" class="btn btn-sm btn-primary zero-y-padding" onclick="updateSettings()"><i class="bi bi-floppy"></i></button>
                                 </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        }
    </div>
</div>
<div class="row">
    <div class="d-flex justify-content-center">
        <h6 class="display-6 mt-2">@translator.Translate(userLanguage, "About")</h6>
    </div>
    <hr />
    <div class="col-12 col-md-6">
        <div class="d-flex justify-content-center">
            <img src="/defaults/lubelogger_logo.png" />
        </div>
        <div class="d-flex justify-content-center">
            <small class="text-body-secondary">@($"{translator.Translate(userLanguage, "Version")} {StaticHelper.VersionNumber}")</small>
        </div>
        <p class="lead">
            Proudly developed in the rural town of Price, Utah by Hargata Softworks.
        </p>
        <p class="lead">
            If you enjoyed using this app, please consider spreading the good word.<br />
            If you want to support the development of this project, consider subscribing to <a class="link-body-emphasis link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover" href="https://www.patreon.com/LubeLogger" target="_blank">our Patreon</a> or make a <a class="link-body-emphasis link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover" href="https://buy.stripe.com/aEU9Egc8DdMc9bO144" target="_blank">donation</a>
        </p>
        <div class="d-flex justify-content-center">
            <h6 class="display-7 mt-2">Hometown Shoutout</h6>
        </div>
        <p class="lead">
            Do you work remotely and are looking for a new place to call home? Consider looking into the rural Eastern Utah town of Price. Price and Carbon County
            has experienced pronounced decline in both population and economic activity within the past decade whereas the rest of the state experienced exponential growth.
            It is conveniently located in between Salt Lake City and Moab Utah. Amenities are relatively complete in terms of big box stores and high speed fiber Internet.
            Price and its surrounding towns as a whole could really benefit from in-migration. Thank you!
        </p>
    </div>
    <div class="col-12 col-md-6">
        <div class="d-flex justify-content-center">
            <h6 class="display-7 mt-2">Open Source Dependencies</h6>
        </div>
        <p class="lead">
            LubeLogger utilizes open-source dependencies to serve you the best possible user experience, those dependencies are:
        </p>
        <ul class="list-group">
            <li class="list-group-item">Bootstrap</li>
            <li class="list-group-item">Bootstrap-DatePicker</li>
            <li class="list-group-item">LiteDB</li>
            <li class="list-group-item">Npgsql</li>
            <li class="list-group-item">SweetAlert2</li>
            <li class="list-group-item">CsvHelper</li>
            <li class="list-group-item">Chart.js</li>
            <li class="list-group-item">Drawdown</li>
            <li class="list-group-item">MailKit</li>
        </ul>
    </div>
</div>
<div class="row" id="sponsorsContainer"></div>
<div class="modal fade" data-bs-focus="false" id="extraFieldModal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content" id="extraFieldModalContent">
        </div>
    </div>
</div>
<script>
    function showReminderUrgencyThresholdModal(){
        Swal.fire({
            title: decodeHTMLEntities('@translator.Translate(userLanguage, "Configure Reminder Urgency Thresholds")'),
            html: `
                        <form>
                                <div class='d-flex flex-row align-items-center'>
                        <label class='form-label me-auto'>${decodeHTMLEntities('@translator.Translate(userLanguage, "Urgent(Days)")')}</label>
                        <input type="text" id="inputUrgentDays" class="form-control" style='width:40%' placeholder="${decodeHTMLEntities('@translator.Translate(userLanguage, "Urgent")')}" value='@Model.UserConfig.ReminderUrgencyConfig.UrgentDays'>
                        </div>
                            <div class='d-flex flex-row align-items-center mt-2'>
                                <label class='form-label me-auto'>${decodeHTMLEntities('@translator.Translate(userLanguage, "Very Urgent(Days)")')}</label>
                                <input type="text" id="inputVeryUrgentDays" class="form-control" style='width:40%' placeholder="${decodeHTMLEntities('@translator.Translate(userLanguage, "Very Urgent")')}" value='@Model.UserConfig.ReminderUrgencyConfig.VeryUrgentDays'>
                            </div>
                            <div class='d-flex flex-row align-items-center mt-2'>
                                    <label class='form-label me-auto'>${decodeHTMLEntities('@translator.Translate(userLanguage, "Urgent(Distance)")')}</label>
                                <input type="text" id="inputUrgentDistance" class="form-control" style='width:40%' placeholder="${decodeHTMLEntities('@translator.Translate(userLanguage, "Urgent")')}" value='@Model.UserConfig.ReminderUrgencyConfig.UrgentDistance'>
                           </div>
                               <div class='d-flex flex-row align-items-center mt-2'>
                                <label class='form-label me-auto'>${decodeHTMLEntities('@translator.Translate(userLanguage, "Very Urgent(Distance)")')}</label>
                            <input type="text" id="inputVeryUrgentDistance" class="form-control" style='width:40%' placeholder="${decodeHTMLEntities('@translator.Translate(userLanguage, "Very Urgent")')}" value='@Model.UserConfig.ReminderUrgencyConfig.VeryUrgentDistance'>
                        </div>
                        </form>
                    `,
            confirmButtonText: decodeHTMLEntities('@translator.Translate(userLanguage, "Save")'),
            focusConfirm: false,
            preConfirm: () => {
                const urgentDays = $("#inputUrgentDays").val();
                const veryUrgentDays = $("#inputVeryUrgentDays").val();
                const urgentDistance = $("#inputUrgentDistance").val();
                const veryUrgentDistance = $("#inputVeryUrgentDistance").val();
                if (!urgentDays || isNaN(urgentDays) || !veryUrgentDays || isNaN(veryUrgentDays) || !urgentDistance || isNaN(urgentDistance) || !veryUrgentDistance || isNaN(veryUrgentDistance)) {
                    Swal.showValidationMessage(`Invalid parameters`)
                }
                return { urgentDays, veryUrgentDays, urgentDistance, veryUrgentDistance }
            },
        }).then(function (result) {
            if (result.isConfirmed) {
                $.post('/Home/SaveReminderUrgencyThreshold', { urgentDays: result.value.urgentDays, veryUrgentDays: result.value.veryUrgentDays, urgentDistance: result.value.urgentDistance, veryUrgentDistance: result.value.veryUrgentDistance }, function (data) {
                    if (data) {
                        setTimeout(function () { window.location.href = '/Home/Index?tab=settings' }, 500);
                    } else {
                        errorToast(genericErrorMessage());
                    }
                })
            }
        });
    }
    function enableAuthCheckChanged() {
        var enableAuth = $("#enableAuth").is(":checked");
        if (enableAuth) {
            //swal dialog to set up username and password.
            Swal.fire({
                title: 'Setup Credentials',
                html: `
                                    <input type="text" id="authUsername" class="swal2-input" placeholder="Username">
                                    <input type="password" id="authPassword" class="swal2-input" placeholder="Password" onkeydown="handleSwalEnter(event)">
                                    `,
                confirmButtonText: 'Setup',
                focusConfirm: false,
                preConfirm: () => {
                    const username = $("#authUsername").val();
                    const password = $("#authPassword").val();
                    if (!username || !password) {
                        Swal.showValidationMessage(`Please enter username and password`)
                    }
                    return { username, password }
                },
            }).then(function (result) {
                if (result.isConfirmed) {
                    $.post('/Login/CreateLoginCreds', { userName: result.value.username, password: result.value.password }, function (data) {
                        if (data) {
                            setTimeout(function () { window.location.href = '/Login' }, 500);
                        } else {
                            errorToast(genericErrorMessage());
                        }
                    })
                }
            });
        } else {
            $.post('/Login/DestroyLoginCreds', function (data) {
                if (data) {
                    setTimeout(function () { window.location.href = '/Home' }, 1000);
                } else {
                    errorToast(genericErrorMessage());
                }
            });
        }
    }
    loadSponsors();
</script>