From 6b81d004d5946d2140368a84fc91a6bab2c55d68 Mon Sep 17 00:00:00 2001
From: Dannii Willis <curiousdannii@gmail.com>
Date: Thu, 23 Jun 2022 21:05:16 +1000
Subject: [PATCH] Add a dark theme (#91)

---
 package.json           |  1 +
 src/common/launcher.js | 11 +++++++++++
 src/common/options.js  |  2 ++
 src/upstream/asyncglk  |  2 +-
 src/web/parchment.css  |  3 ++-
 src/web/web.css        |  3 ++-
 6 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index cd60ad25..03dc71f4 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
   "dependencies": {
     "emglken": "^0.4.0",
     "jquery": "^3.6.0",
+    "js-cookie": "^3.0.1",
     "lodash-es": "^4.17.21"
   },
   "devDependencies": {
diff --git a/src/common/launcher.js b/src/common/launcher.js
index 981c1ab4..a926c36e 100644
--- a/src/common/launcher.js
+++ b/src/common/launcher.js
@@ -9,6 +9,8 @@ https://github.com/curiousdannii/parchment
 
 */
 
+import Cookies from 'js-cookie'
+
 import Blorb from '../upstream/asyncglk/src/blorb/blorb.ts'
 import get_default_options from './options.js'
 import {FileView} from '../upstream/asyncglk/src/blorb/iff.ts'
@@ -36,6 +38,15 @@ class ParchmentLauncher
 
     launch() {
         try {
+            // Apply the dark theme if set
+            const theme = this.options.theme
+                || Cookies.get(this.options.theme_cookie)
+                // Or if the browser tells us to prefer dark
+                || (matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : '')
+            if (theme) {
+                document.documentElement.setAttribute('data-theme', theme)
+            }
+
             const storyfile_path = this.get_storyfile_path()
             if (!storyfile_path) {
                 // Set up all the ways we can load a story
diff --git a/src/common/options.js b/src/common/options.js
index 8b654d43..41be0ef2 100644
--- a/src/common/options.js
+++ b/src/common/options.js
@@ -23,5 +23,7 @@ export default function get_default_options() {
         proxy_url: 'https://proxy.iplayif.com/proxy/',
         //single_file: 0
         //story: PATH_TO_STORY
+        //theme: can be set to 'dark'
+        theme_cookie: 'parchment_theme',
     }
 }
\ No newline at end of file
diff --git a/src/upstream/asyncglk b/src/upstream/asyncglk
index 974c8b04..af0686d5 160000
--- a/src/upstream/asyncglk
+++ b/src/upstream/asyncglk
@@ -1 +1 @@
-Subproject commit 974c8b0433afd666da4acd7fa297b5845a7383bc
+Subproject commit af0686d59b517455ccd10091d4e407381b2fc0e9
diff --git a/src/web/parchment.css b/src/web/parchment.css
index ccc169ef..24515419 100644
--- a/src/web/parchment.css
+++ b/src/web/parchment.css
@@ -10,13 +10,14 @@ https://github.com/curiousdannii/parchment
 */
 
 body {
+  background: var(--glkote-page-bg);
+  color: var(--glkote-buffer-fg);
   height: 100%;
   margin: 0px;
 }
 
 /* Essential styles for GlkOte */
 #gameport {
-  background: var(--glkote-page-bg);
   bottom: 0px;
   left: 0px;
   margin: 0 auto;
diff --git a/src/web/web.css b/src/web/web.css
index ab2622f8..3e5faaa2 100644
--- a/src/web/web.css
+++ b/src/web/web.css
@@ -4,4 +4,5 @@
 @import url('../upstream/asyncglk/src/glkote/web/glkote.css');
 @import url('../fonts/fonts.css');
 @import url('../upstream/glkote/dialog.css');
-@import url('../upstream/asyncglk/src/glkote/web/light.css');
\ No newline at end of file
+@import url('../upstream/asyncglk/src/glkote/web/light.css');
+@import url('../upstream/asyncglk/src/glkote/web/dark.css');
\ No newline at end of file