{{ define "base" }} <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>dela</title> <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css"> <script src="/static/bootstrap/js/bootstrap.min.js"></script> <!-- <link rel="stylesheet" href="/static/stylesheet.css"> --> <link rel="shortcut icon" href="/static/images/favicon.png" type="image/x-icon"> </head> <body class="d-flex flex-column h-100"> <header class="d-flex flex-wrap align-items-center justify-content-center justify-content-md-between py-3 mb-4 border-bottom"> <div class="col-md-3 mb-2 mb-md-0"> <a href="/" class="d-inline-flex link-body-emphasis text-decoration-none"> <svg class="bi" width="40" height="32" role="img" aria-label="Bootstrap"><use xlink:href="#bootstrap"></use></svg> </a> </div> <!-- <ul class="nav col-12 col-md-auto mb-2 justify-content-center mb-md-0"> <li><a href="/" class="nav-link px-2">Home</a></li> <li><a href="/about" class="nav-link px-2">About</a></li> <li><span href="#" class="nav-link px-2" id="logged-in-as"></span></li> </ul> --> <div class="col-md-3 text-end" id="bar-auth"> <a href="/login" class="btn btn-outline-primary me-2">Log in</a> <a href="/register" class="btn btn-primary">Register</a> </div> </header> <div style="margin: auto; margin-top: 5ch; margin-bottom: 10ch; max-width: 120ch;"> {{ template "content" . }} </div> </body> </html> <script src="/scripts/auth.js"></script> <script src="/scripts/api.js"></script> <script> document.addEventListener('DOMContentLoaded', async function() { let username = getUsername(); let password = getUserPassword(); if (username == null | username == "" | password == null | password == "") { if (window.location.pathname != "/about" && window.location.pathname != "/login" && window.location.pathname != "/register") { window.location.replace("/about"); } return; } // Check if auth info is indeed valid let response = await get_user(username, password); if (response.ok) { let barAuth = document.getElementById("bar-auth"); barAuth.innerHTML = "<b>" + username + "</b>" + " | "; barAuth.innerHTML += '<button id="log-out-btn" class="btn btn-primary" type="button">Log out</button>'; document.getElementById("log-out-btn").addEventListener("click", (event) => { // Log out forgetAuthInfo(); window.location.replace("/about"); }); } else { forgetAuthInfo(); window.location.replace("/about"); } }, false) </script> {{ end }}