quartznet/quartznet-info
2
0
Fork 0
Code Issues Pull Requests Actions Packages Activity

Add status/error message display

Browse Source
This commit is contained in:
Chris Dill 2023-08-17 07:35:23 +01:00
parent 4b0d471754
commit 8fc90db6a2
2 changed files with 61 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

121
src/routes/+error.svelte
View File

@ -1,13 +1,12 @@
<script lang="ts">
import { onMount } from "svelte";
import Banner from "../components/Banner.svelte";
import { page } from "$app/stores";
import { onMount } from "svelte";
import Banner from "../components/Banner.svelte";
export let status: string;
export let error: Error;
const status = $page.status?.toString() ?? "";
const dev = process.env.NODE_ENV === "development";
const dev = process.env.NODE_ENV === "development";
var appa = ` .,-:;//;:=,
var appa = ` .,-:;//;:=,
. :H@@@MM@M#H/.,+%;,
,/X+ +M@@M@MM%=,-%HMMM@X/,
-+@MM; $M@@MH+-,;XMMMM@MMMM@+-
@ -28,7 +27,7 @@
,:+$+-,/H#MMMMMMM@- -,
=++%%%%+/:-.`;
var nuke = ` =+$HM####@H%;,
var nuke = ` =+$HM####@H%;,
/H###############M$,
,@################+
.H##############+
@ -49,7 +48,7 @@ X##############%, ,+##############X
.+M###@, ,@###M+.
:XH. .HX:`;
var atom = ` =/;;/-
var atom = ` =/;;/-
+: //
/; /;
-X H.
@ -70,7 +69,7 @@ M- ,=;;;#:, ,:#;;:=, ,@
// +;
,////,`;
var heart = ` .,---.
var heart = ` .,---.
,/XM#MMMX;,
-%##########M%,
-@######% $###@=
@ -91,7 +90,7 @@ X################, -$=X#######@:
.,/X$; .::,
., ..`;
var fire = ` -$-
var fire = ` -$-
.H##H,
+######+
.+#########H.
@ -112,7 +111,7 @@ X################, -$=X#######@:
/XHX%:#####MH%= ,---:;;;;/&&XHM,:###$
$@#MX %+;- .`;
var tick = ` :X-
var tick = ` :X-
:X###
;@####@
;M######X
@ -133,7 +132,7 @@ $@#MX %+;- .`;
+####:
,$M-`;
var bang = ` .+
var bang = ` .+
/M;
H#@: ;,
-###H- -@/
@ -154,7 +153,7 @@ $@#MX %+;- .`;
.#H, :XH,
+ .;-`;
var mesa = ` .-;+$XHHHHHHX$+;-.
var mesa = ` .-;+$XHHHHHHX$+;-.
,;X@@X%/;=----=:/%X@@X/,
=$@@%=. .=+H@X:
-XMX: =XMX=
@ -175,7 +174,7 @@ H@: :HHHHHHHHHHHHHHHHHHX, =@H
,;$@@@@@@@@@@@@@@@@@@X/-
.-;+$XXHHHHHX$+;-.`;
var cube = ` #+ @ # # M#@
var cube = ` #+ @ # # M#@
. .X X.%##@;# # +@#######X. @H%
,==. ,######M+ -#####%M####M- #
:H##M%:=##+ .M##M,;#####/+#######% ,M#
@ -196,7 +195,7 @@ H@: :HHHHHHHHHHHHHHHHHHX, =@H
H#M /@####/ ,++. / ==-,
,=/:, .+X@MMH@#H #####$=`;
var cake = ` ,:/+/-
var cake = ` ,:/+/-
/M/ .,-=;//;-
.:/= ;MH/, ,=/+%$XH@MM#@:
-$##@+$###@H@MMM#######H:. -/H#
@ -217,41 +216,39 @@ H@: :HHHHHHHHHHHHHHHHHHX, =@H
,:/%XM####H/.
,.:=-.`;
// appa, atom, nuke
var options = [cake, heart, fire, tick, bang, mesa, cube];
let active = cake;
// appa, atom, nuke
var options = [cake, heart, fire, tick, bang, mesa, cube];
let active = cake;
function updateView() {
active = options[Math.floor(Math.random() * options.length)];
setTimeout(updateView, 5000);
}
function updateView() {
active = options[Math.floor(Math.random() * options.length)];
setTimeout(updateView, 5000);
}
onMount(() => updateView());
onMount(() => updateView());
</script>
<svelte:head>
<title>Quartnzet -</title>
<title>Quartznet - {status}</title>
</svelte:head>
<Banner title={status} />
<main class="container">
<!-- <p>{error.message}</p> -->
<!-- {#if dev && error.stack} -->
<!-- <pre>{error.stack}</pre> -->
<!-- {:else} -->
<audio controls autoplay>
<track kind="captions" />
<source src="http://quartznet.info/alive.ogg" type="audio/wav" />
</audio>
<div class="ascii">
<div>
<pre><br />{active}</pre>
</div>
</div>
<br />
<p class="info">This was a triumph! I'm making a note here: Huge success!
<section>
<h2>{status} {$page.error?.message ?? ""}</h2>
<audio controls autoplay>
<track kind="captions" />
<source src="http://quartznet.info/alive.ogg" type="audio/wav" />
</audio>
<div class="ascii">
<div>
<pre><br />{active}</pre>
</div>
</div>
<br />
<p class="info">
This was a triumph! I'm making a note here: Huge success!
It's hard to overstate my satisfaction.
Aperture Science: We do what we must because we can.
@ -289,31 +286,31 @@ And when you're dead I will be still alive.
Still alive.
Still alive.</p>
<!-- {/if} -->
</section>
</main>
<style>
* {
color: white !important;
font-family: monospace;
white-space: pre;
}
* {
color: white !important;
font-family: monospace;
white-space: pre;
}
.ascii {
text-align: left;
width: 100%;
}
.ascii {
text-align: left;
width: 100%;
}
.info {
margin-bottom: 30px;
position: relative;
white-space: pre;
text-align: left;
}
.info {
margin-bottom: 30px;
position: relative;
white-space: pre;
text-align: left;
}
pre {
margin: 0 auto;
font-family: monospace;
white-space: pre;
}
pre {
margin: 0 auto;
font-family: monospace;
white-space: pre;
}
</style>

3
static/css/global.css
View File

@ -94,7 +94,7 @@ a:hover {
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
}
@media (min-width: 576px) {
.container {
width: 540px;
@ -143,6 +143,7 @@ footer {
color: var(--font-color);
font-family: var(--font1);
margin-top: 30px;
margin-bottom: 30px;
}
/* Responsive layout - when the screen is less than 700px wide, make the two columns stack on top of each other instead of next to each other */