<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>sillywordz</title>
    <link rel="stylesheet" href="/assets/style.css"/>
    <meta name="description" content="your friends' writing updates">
    <style>
        body {
            background-color: azure;
            font-family: Verdana;
        }
    </style>
</head>
<body>
<main>
    {{ if .form.Error }}
    <p>{{ .form.Error }}</p>
    {{ end }}
    {{ if .flash }}
    <p>{{ .flash }}</p>
    {{ end }}
    <form action="/add?silent=1" method="post" name="update-status">
        {{ .csrfField }}
        {{ template "status_form" .status }}
    </form>
</main>
</div>
<script>
    document.forms["update-status"].onsubmit = function (event) {
        event.preventDefault();
        fetch("/add?silent=1", {
            method: "POST",
            body: new FormData(document.forms["update-status"])
        })
            .then(response => response.ok)
            .then(submitted => {
                if (submitted) {
                    window.close()
                    window.location = "/"
                }
            })
    }
</script>
</body>
</html>
