flashii/misuzu
flashii/misuzu
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Redid HTTP error pages.

Browse source
This commit is contained in:
flash 2025-01-30 14:52:01 +00:00
parent 312be0e7fe
commit 3e14f63bdb
16 changed files with 261 additions and 92 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.gitignore vendored
View file

@ -42,6 +42,8 @@
/public/css
/public/webfonts
/assets/typescript/*.d.ts
/public/errors.css
/public/error-*.html
# Google
/public/robots.txt

146
assets/errors.css/main.css Normal file
View file

@ -0,0 +1,146 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
position: relative;
}
html,
body {
width: 100%;
height: 100%;
}
html {
scrollbar-color: #8559a5;
scrollbar-color: var(--error-colour, #8559a5) #111;
}
body {
color: #fff;
font-size: 16px;
line-height: 25px;
font-family: Verdana, Geneva, 'Dejavu Sans', Arial, Helvetica, sans-serif;
background-color: #8559a5;
background-color: var(--error-colour, #8559a5);
background-image: url('/images/clouds.png');
background-blend-mode: multiply;
position: static;
display: flex;
flex-direction: column;
}
.error {
display: flex;
flex-direction: column;
flex: 1 0 auto;
margin-bottom: 10px;
}
.error-wrapper {
display: flex;
flex: 1 0 auto;
padding: 10px;
width: 100%;
align-items: center;
justify-content: center;
}
.error-container {
max-width: 700px;
width: 100%;
margin: 0 auto;
padding: 4px;
background-color: #111;
box-shadow: 0 2px 4px #000;
overflow: hidden;
word-wrap: break-word;
}
.error-top {
display: flex;
align-items: center;
gap: 4px;
padding-bottom: 4px;
border-bottom: 1px solid #444;
}
.error-top a {
color: #fff;
text-decoration: none;
}
.error-top a:hover,
.error-top a:focus {
text-decoration: underline;
}
.error-logo {
width: 50px;
height: 50px;
}
.error-logo a {
color: inherit !important;
text-decoration: none !important;
}
.error-logo img {
width: 100%;
height: 100%;
vertical-align: middle;
border-width: 0;
object-fit: contain;
}
.error-home {
font-size: 1.5em;
line-height: 1.4em;
}
.error-nav {
margin-left: auto; /* lmao */
display: flex;
gap: 8px;
padding: 4px;
}
.error-body {
text-align: center;
height: 300px;
display: flex;
flex-direction: column;
justify-content: center;
}
.error-icon {
font-size: 4em;
line-height: 1.4em;
}
.error-blerb {
margin: 10px auto;
font-size: .9em;
line-height: 1.4em;
}
.error-footer {
text-align: center;
font-size: 12px;
line-height: 1.4em;
color: #888;
border-top: 1px solid #444;
padding-top: 4px;
}
.error-footer a {
color: #88a;
text-decoration: underline;
text-decoration-style: dotted;
}
.error-footer a:hover,
.error-footer a:focus {
text-decoration-style: solid;
}
.error-footer a:active {
color: #a88;
}

11
build.js
View file

@ -22,8 +22,19 @@ const fs = require('fs');
{ source: 'redir-fedi.js', target: '/assets', name: 'redir-fedi.{hash}.js', },
],
css: [
{ source: 'errors.css', target: '/', name: 'errors.css', },
{ source: 'misuzu.css', target: '/assets', name: 'misuzu.{hash}.css', },
],
twig: [
{ source: 'errors/400', target: '/', name: 'error-400.html', },
{ source: 'errors/401', target: '/', name: 'error-401.html', },
{ source: 'errors/403', target: '/', name: 'error-403.html', },
{ source: 'errors/404', target: '/', name: 'error-404.html', },
{ source: 'errors/405', target: '/', name: 'error-405.html', },
{ source: 'errors/500', target: '/', name: 'error-500.html', },
{ source: 'errors/502', target: '/', name: 'error-502.html', },
{ source: 'errors/503', target: '/', name: 'error-503.html', },
],
};
const files = await assproc.process(env, tasks);

6
public/index.php
View file

@ -22,7 +22,7 @@ else
ob_clean();
header('Content-Type: text/html; charset=utf-8');
echo file_get_contents(MSZ_TEMPLATES . '/500.html');
header('X-Accel-Redirect: /error-500.html');
exit;
});
@ -35,10 +35,8 @@ ob_start();
if(is_file(MSZ_ROOT . '/.migrating')) {
http_response_code(503);
if(!filter_has_var(INPUT_GET, '_check')) {
header('Content-Type: text/html; charset=utf-8');
echo file_get_contents(MSZ_TEMPLATES . '/503.html');
}
header('X-Accel-Redirect: /error-503.html');
exit;
}

11
src/Routing/RoutingErrorHandler.php
View file

@ -12,15 +12,10 @@ class RoutingErrorHandler extends HtmlHttpErrorHandler {
return;
}
if($code === 500 || $code === 503) {
$path = sprintf('/error-%03d.html', $code);
if(is_file(MSZ_PUBLIC . $path)) {
$response->setTypeHTML();
$response->content = file_get_contents(sprintf('%s/%03d.html', MSZ_TEMPLATES, $code));
return;
}
if($code === 401 || $code === 403 || $code === 404) {
$response->setTypeHTML();
$response->content = Template::renderRaw(sprintf('errors.%03d', $code));
$response->accelRedirect($path);
return;
}

16
templates/500.html
View file

@ -1,16 +0,0 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Error 500</title>
<style type="text/css">
body {
font: 12px/20px Verdana, Geneva, 'Dejavu Sans', Arial, Helvetica, sans-serif;
}
</style>
</head>
<body>
<h1>Error 500</h1>
<p>Something went very wrong. Please report what you were doing to a developer.</p>
</body>
</html>

29
templates/503.html
View file

@ -1,29 +0,0 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Error 503</title>
<style type="text/css">
body {
font: 12px/20px Verdana, Geneva, 'Dejavu Sans', Arial, Helvetica, sans-serif;
}
</style>
</head>
<body>
<h1>Error 503</h1>
<p>The site is currently unavailable due to ongoing updates. It should be back shortly!</p>
<p>The page will refresh when the site becomes available again.</p>
<p><a href="javascript:location.reload(true)">Retry</a></p>
<script type="text/javascript">
setInterval(function() {
var xhr = new XMLHttpRequest;
xhr.onreadystatechange = function() {
if(xhr.readyState === 4 && xhr.status !== 503)
document.links[0].click();
};
xhr.open('HEAD', location.pathname + '?_check=' + Date.now().toString());
xhr.send();
}, 10000);
</script>
</body>
</html>

7
templates/errors/400.twig
View file

@ -2,7 +2,6 @@
{% set error_code = 400 %}
{% set error_text = 'Bad Request' %}
{% block error_message %}
<p>Whatever you tried to do, you probably shouldn't.</p>
{% endblock %}
{% set error_icon = 'fas fa-ellipsis-h' %}
{% set error_blerb = "Make sure you're sending the right data." %}
{% set error_colour = '#b07200' %}

9
templates/errors/401.twig
View file

@ -1,8 +1,7 @@
{% extends 'errors/master.twig' %}
{% set error_code = 401 %}
{% set error_text = 'Unauthorised!' %}
{% block error_message %}
<p>You must log in to view this page.</p>
{% endblock %}
{% set error_text = 'Unauthorized' %}
{% set error_icon = 'fas fa-exclamation-circle' %}
{% set error_blerb = 'You must be logged in to view this page.' %}
{% set error_colour = '#be411e' %}

9
templates/errors/403.twig
View file

@ -1,8 +1,7 @@
{% extends 'errors/master.twig' %}
{% set error_code = 403 %}
{% set error_text = 'Access Denied!' %}
{% block error_message %}
<p>You aren't allowed to be here. Try logging in, if you haven't yet.</p>
{% endblock %}
{% set error_text = 'Forbidden' %}
{% set error_icon = 'fas fa-lock' %}
{% set error_blerb = 'You are not supposed to be here.' %}
{% set error_colour = '#83758d' %}

9
templates/errors/404.twig
View file

@ -1,8 +1,7 @@
{% extends 'errors/master.twig' %}
{% set error_code = 404 %}
{% set error_text = 'Not Found!' %}
{% block error_message %}
<p>Couldn't find what you were looking for. Check the spelling in the URL or go back to the previous page.</p>
{% endblock %}
{% set error_text = 'Not Found' %}
{% set error_icon = 'fas fa-question-circle' %}
{% set error_blerb = "What you're looking for is no longer here or might not have been here at all." %}
{% set error_colour = '#8559a5' %}

7
templates/errors/405.twig Normal file
View file

@ -0,0 +1,7 @@
{% extends 'errors/master.twig' %}
{% set error_code = 405 %}
{% set error_text = 'Method Not Allowed' %}
{% set error_icon = 'fas fa-question-circle' %}
{% set error_blerb = "What you're trying to do is not supported." %}
{% set error_colour = '#8f3417' %}

7
templates/errors/500.twig Normal file
View file

@ -0,0 +1,7 @@
{% extends 'errors/master.twig' %}
{% set error_code = 500 %}
{% set error_text = 'Server Error' %}
{% set error_icon = 'fas fa-dizzy' %}
{% set error_blerb = 'Something went very wrong. Please report what you were trying to do to a developer.' %}
{% set error_colour = '#99061d' %}

7
templates/errors/502.twig Normal file
View file

@ -0,0 +1,7 @@
{% extends 'errors/master.twig' %}
{% set error_code = 502 %}
{% set error_text = 'Bad Gateway' %}
{% set error_icon = 'fas fa-tired' %}
{% set error_blerb = 'Something went very wrong. Please report what you were trying to do to a developer.' %}
{% set error_colour = '#dd6427' %}

7
templates/errors/503.twig Normal file
View file

@ -0,0 +1,7 @@
{% extends 'errors/master.twig' %}
{% set error_code = 503 %}
{% set error_text = 'Temporarily Unavailable' %}
{% set error_icon = 'fas fa-tools' %}
{% set error_blerb = 'The website is currently unavailable, it will likely be back soon!' %}
{% set error_colour = '#354e97' %}

66
templates/errors/master.twig
View file

@ -1,22 +1,60 @@
{% extends 'master.twig' %}
{% extends 'html.twig' %}
{% from 'macros.twig' import container_title %}
{# fuck it #}
{% set http_code = http_code|default(error_code) %}
{% set error_string = '%03d %s'|format(error_code, error_text) %}
{% set html_title = error_string ~ ' :: ' ~ globals.site_info.name %}
{% block content %}
<div class="container">
{{ container_title((title|default(error_code|default(http_code) >= 400 ? '<i class="fas fa-exclamation-circle fa-fw"></i> Error' : '<i class="fas fa-info-circle fa-fw"></i> Information')) ~ ' ' ~ (error_code|default(http_code >= 400 ? http_code : '')) ~ (error_text is defined ? ' - ' ~ error_text : '')) }}
{% block html_head %}
<meta name="description" content="{{ error_blerb }}">
<link href="/vendor/fontawesome/css/all.min.css" type="text/css" rel="stylesheet">
<link href="{{ asset('errors.css') }}" rel="stylesheet">
<style>
:root {
--error-colour: {{ error_colour }};
}
</style>
{% endblock %}
<div class="container__content">
{% if message is defined %}
<p>{{ message }}</p>
{% else %}
{% block error_message %}
<p>Try again later, perhaps.</p>
{% endblock %}
{% block html_body %}
<div class="error">
<div class="error-wrapper">
<div class="error-container">
<nav class="error-top">
<div class="error-logo"><a href="{{ globals.site_info.url }}"><img src="/images/logos/imouto-default.png" alt=""></a></div>
<div class="error-home"><a href="{{ globals.site_info.url }}">{{ globals.site_info.name }}</a></div>
{% if error_code >= 500 %}
<div class="error-nav">
{% if globals.site_info.email is not empty %}
<a href="mailto:{{ globals.site_info.email }}" rel="noopener" target="_blank">E-mail</a>
{% endif %}
{% if globals.site_info.bsky is not empty %}
<a href="{{ globals.site_info.bsky }}" rel="noopener" target="_blank">Bluesky</a>
{% endif %}
</div>
{% endif %}
</nav>
<article class="error-body">
<div class="error-icon">
<i class="{{ error_icon }}"></i>
</div>
<h1 class="error-title">{{ error_string }}</h1>
<p class="error-blerb">{{ error_blerb }}</p>
</article>
<footer class="error-footer">
<p>
<a href="https://flash.moe" target="_blank" rel="noopener">flashwave</a>
2013-{{ ''|date('Y') }} /
{% set git_branch = git_branch() %}
{% if git_branch != 'HEAD' %}
<a href="https://patchii.net/flashii/misuzu/src/branch/{{ git_branch }}" target="_blank" rel="noopener">{{ git_branch }}</a>
{% else %}
{% set git_tag = git_tag() %}
<a href="https://patchii.net/flashii/misuzu/src/tag/{{ git_tag }}" target="_blank" rel="noopener">{{ git_tag }}</a>
{% endif %}
# <a href="https://patchii.net/flashii/misuzu/commit/{{ git_commit_hash(true) }}" target="_blank" rel="noopener">{{ git_commit_hash() }}</a>
</p>
</footer>
</div>
</div>
</div>
{% endblock %}