@using System.Text.Json
@inject Microsoft.AspNetCore.Http.IHttpContextAccessor _HttpContext
@{
    _HttpContext.HttpContext.Response.Headers["Cache-Control"] = "no-store";
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - LANCommander</title>
    <link href="~/css/tabler.min.css" rel="stylesheet" />
    <link href="~/lib/selectize.js/css/selectize.bootstrap5.min.css" rel="stylesheet" />
    <base href="~/"/>
</head>
<body>
    <header class="navbar navbar-expand-md navbar-light">
		<div class="container-xl">
			<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbar-menu">
				<span class="navbar-toggler-icon"></span>
			</button>
			<h1 class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3">
				<a href="/">
					<img src="~/static/logo.svg" height="32" />
				</a>
			</h1>
			<partial name="_LoginPartial" />
		</div>
    </header>
    <div class="navbar-expand-md">
		<div class="collapse navbar-collapse" id="navbar-menu">
			<div class="navbar navbar-light">
				<div class="container-xl">
					<ul class="navbar-nav">
						<li class="nav-item">
							<a class="nav-link" asp-action="Index" asp-controller="Home">
								<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
									<svg xmlns="http://www.w3.org/2000/svg" class="icon" 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"/><polyline points="5 12 3 12 12 3 21 12 19 12" /><path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7" /><path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6" /></svg>
								</span>
								<span class="nav-link-title">
									Home
								</span>
							</a>
						</li>
						<li class="nav-item">
							<a class="nav-link" asp-action="Index" asp-controller="Games">
								<span class="nav-link-icon d-md-none d-lg-inline-block"><!-- Download SVG icon from http://tabler-icons.io/i/home -->
									<svg xmlns="http://www.w3.org/2000/svg" class="icon" 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"/><rect x="2" y="6" width="20" height="12" rx="2" /><path d="M6 12h4m-2 -2v4" /><line x1="15" y1="11" x2="15" y2="11.01" /><line x1="18" y1="13" x2="18" y2="13.01" /></svg>
								</span>
								<span class="nav-link-title">
									Games
								</span>
							</a>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
    <div class="page-wrapper">
        @RenderBody()
    </div>

    <footer class="border-top footer text-muted">
        <div class="container">
            &copy; 2022 - LANCommander - <a asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
        </div>
    </footer>

    <div class="modal modal-blur fade" id="ErrorModal" tabindex="-1">
        <div class="modal-dialog modal-sm" role="document">
            <div class="modal-content">
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                <div class="modal-status bg-danger"></div>
                <div class="modal-body text-center py-4">
                    <!-- Download SVG icon from http://tabler-icons.io/i/alert-triangle -->
                    <svg xmlns="http://www.w3.org/2000/svg" class="icon mb-2 text-danger icon-lg" 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 d="M12 9v2m0 4v.01" /><path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75" /></svg>
                    <h3 id="ErrorModalHeader"></h3>
                    <div class="text-muted" id="ErrorModalMessage"></div>
                </div>
                <div class="modal-footer">
                    <div class="w-100">
                        <div class="row">
                            <div class="col">
                                <a href="#" class="btn btn-danger w-100" data-bs-dismiss="modal">
                                    Close
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="alert-container">
        @if (TempData["Alerts"] != null)
        {
            try
            {
                foreach (var alert in JsonSerializer.Deserialize<List<AlertViewModel>>((string)TempData["Alerts"]))
                {
                    <div class="alert alert-important alert-@alert.Type @(alert.Dismissable ? "alert-dismissable" : "")" role="alert">
                        <div class="d-flex">
                            <div>
                                @alert.Message
                            </div>
                        </div>

                        @if (alert.Dismissable)
                        {
                            <a class="btn-close btn-close-white" data-bs-dismiss="alert" aria-label="close"></a>
                        }
                    </div>
                }
            }
            catch { }
        }
    </div>

    <script src="~/lib/jquery/dist/jquery.min.js"></script>
    <script src="~/lib/selectize.js/js/selectize.min.js"></script>
    <script src="~/lib/tabler/core/dist/js/tabler.min.js"></script>
    <script src="~/js/Modal.js"></script>
    <script src="~/js/Select.js"></script>
    <script src="~/_framework/blazor.server.js"></script>

    <style>
        .alert-container {
            position: fixed;
            top: 2rem;
            left: 50%;
            transform: translateX(-50%);
            min-width: 400px;
            z-index: 2;
        }

        .alert-dismissable .btn-close {
            position: absolute;
            top: 0;
            right: 0;
            z-index: 2;
            padding: 1.25rem 1rem;
        }
    </style>

    @await RenderSectionAsync("Scripts", required: false)
</body>
</html>
