error.njk

---
title: Oh wow, this is awkward.
layout: layouts/default.njk
---

{% block styles %}
<style>
  .x {
    display: grid;
		min-height: 100dvh;
    place-items: center;
  }
</style>
{% endblock %}
<div class="x">
	<h1>{{ title }}</h1>
	<p><span id="message"></span>maybe try the <a href="/">home page</a>.</p>
</div>
{% block scripts %}
	<script>
		/**
		 * @var {HTMLElement | null} elMessage
		 */
		const elMessage = document.querySelector('#message');

		/**
		 * @var {URLSearchParams} params
		 */
		const params = (new URL(document.location)).searchParams;

		/**
		 * Set the message and applies it to the DOM
     *
		 * @return {void}
		 */
		const setErrorMessage = () => {
			if(!elMessage) {
				return;
			}

			let message = '';
			const error = params?.get("error");

			switch(error) {
				case '401':
				case '403':
					message = 'You are not authorised to see this content… ';
					break;
				case '500':
					message = 'An unexpected server error occurred… ';
					break;
				default:
				case '404':
					message = 'Whatever it was you were looking for, could not be found… ';
			}

			elMessage.innerText = message;
		}

		setErrorMessage();
	</script>
{% endblock %}