Add narration to "can't think" page

.gitignore

@@ -11,3 +11,6 @@ node_modules
 # User configuration
 /db
 /config/config.js
+
+# Narration
+/html/static/media/cant_think_suricrasia_online.mp3

pug/cant-think.pug

@@ -19,6 +19,13 @@ mixin leave(index, prefix="No more?", final)
 
 block content
   main.cant-think-page
+    - let src = constants.server_setup.cant_think_narration_url
+    if src
+      aside.encouraging-message.page-narration
+        div You can listen to this page narrated by #[a(href="https://suricrasia.online") Suricrasia Online].
+        .page-narration__audio-container
+          audio(controls src=src preload="metadata").page-narration__audio
+      .narration-divider
     .encouraging-message
       p Oh?
       p You can't think of anything to watch, yet you're still here?
@@ -59,7 +66,7 @@ block content
       p Pieces of your brain twist and fall apart as you shake off the identity that the billion-dollar distraction manufacturers have handed to you, the identity that you once willingly accepted without even realising that it was there.
       p I beg of you, find something.
       p Create. Discover. Seek. Learn.
-      p You see it now, don't know?
+      p You see it now, don't you?
       p You understand.
       p You know what you must do.
       p.ultimatum: a(href="#i-understand").border-look I know what I must do.

sass/includes/cant-think-page.sass

@@ -1,4 +1,5 @@
 @use "sass:list"
+@use "colors.sass" as c
 
 .cant-think-page
   .main-nav
@@ -6,9 +7,24 @@
 
   .encouraging-message
     text-align: left
-    max-width: 540px
+    max-width: 572px
     padding-top: 40px
     border-radius: 0px 0px 16px 16px
+    box-sizing: border-box
+
+  .page-narration
+    background-color: c.$bg-accent
+    border: 1px solid #aaa
+    color: #fff
+    border-radius: 0
+    padding: 16px
+    margin: 40px auto 60px
+
+    &__audio-container
+      margin-top: 20px
+
+    &__audio
+      width: 100%
 
   .leave
     margin: 26px 32px !important
@@ -22,6 +38,7 @@
     &.leave__final
       font-weight: bold
       color: #f2f2f2
+      text-align: center
 
       .leave__actions
         display: block

server.js

@@ -1,5 +1,6 @@
 const {Pinski} = require("pinski")
 const {setInstance} = require("pinski/plugins")
+const constants = require("./utils/constants")
 
 ;(async () => {
 	await require("./utils/upgradedb")()
@@ -11,6 +12,7 @@ const {setInstance} = require("pinski/plugins")
 	})
 
 	setInstance(server)
+	server.pugDefaultLocals.constants = constants
 
 	server.muteLogsStartingWith("/vi/")
 	server.muteLogsStartingWith("/favicon")

utils/constants.js

@@ -32,7 +32,9 @@ let constants = {
 		// The URL of the local NewLeaf instance, which is always used for subscription updates.
 		local_instance_origin: "http://localhost:3000",
 		// Whether users may filter videos by regular expressions. Unlike square patterns, regular expressions are _not_ bounded in complexity, so this can be used for denial of service attacks. Only enable if this is a private instance and you trust all the members.
-		allow_regexp_filters: false
+		allow_regexp_filters: false,
+		// Audio narration on the "can't think" page. `null` to disable narration, or a URL to enable with that audio file.
+		cant_think_narration_url: null
 	},
 
 	// ***                                                 ***