diff --git a/.gitignore b/.gitignore
index 8ff1605..37cd3c4 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,3 +4,6 @@ cmd/ingest/gutingest
cmd/phraser/phraser
cmd/gutcontent/gutcontent
*.swp
+node_modules
+package.json
+package-lock.json
diff --git a/assets/bg_dark.gif b/assets/bg_dark.gif
new file mode 100644
index 0000000..d89c674
Binary files /dev/null and b/assets/bg_dark.gif differ
diff --git a/assets/bg_light.gif b/assets/bg_light.gif
new file mode 100644
index 0000000..4142118
Binary files /dev/null and b/assets/bg_light.gif differ
diff --git a/assets/main.js b/assets/main.js
index 3ece74d..fc8eae9 100644
--- a/assets/main.js
+++ b/assets/main.js
@@ -191,7 +191,6 @@ class PoemLine extends HTMLDivElement {
}
get source() {
- console.log(this.querySelector("span.linetext"));
return this.querySelector("span.linetext").dataset.source;
}
@@ -284,7 +283,6 @@ class SourceText extends HTMLParagraphElement {
const fullGutID = source.Name.split(" ", 2)[0];
const sourceName = source.Name.slice(source.Name.indexOf(' '));
const gutID = fullGutID.match(/^pg(.+).txt$/)[1];
- console.log(fullGutID, sourceName, gutID);
const url = `https://www.gutenberg.org/cache/epub/${gutID}/pg${gutID}.txt`;
this.innerHTML = `
${sourceName} (${fullGutID})`
@@ -298,7 +296,7 @@ class ThemeToggler extends HTMLAnchorElement {
constructor() {
super();
this.addEventListener("click", this.click);
- this.theme = "light";
+ this.theme = "dark";
this.innerText = "◑";
this.setAttribute("aria-hidden", "true");
this.style.cursor = "pointer";
@@ -306,14 +304,18 @@ class ThemeToggler extends HTMLAnchorElement {
click() {
if (this.theme == "light") {
this.theme = "dark";
- $("body").style.background = "black";
+ $("body").style.backgroundColor = "black";
+ $("body").style.backgroundImage = 'url("/bg_dark.gif")';
$("body").style.color = "white";
$$("a").forEach((e) => { e.style.color = "white" });
+ $$("span.linetext").forEach((e) => { e.style.backgroundColor = "black" });
} else {
this.theme = "light";
- $("body").style.background = "white";
+ $("body").style.backgroundColor = "white";
+ $("body").style.backgroundImage = 'url("/bg_light.gif")';
$("body").style.color = "black";
$$("a").forEach((e) => { e.style.color = "black" });
+ $$("span.linetext").forEach((e) => { e.style.backgroundColor = "white" });
}
}
}
diff --git a/main.go b/main.go
index 911c0b8..9ca2ab1 100644
--- a/main.go
+++ b/main.go
@@ -48,6 +48,8 @@ func main() {
r.LoadHTMLFiles("templates/index.tmpl")
r.StaticFile("/cutive.ttf", "./assets/cutive.ttf")
r.StaticFile("/favicon.ico", "./assets/favicon.ico")
+ r.StaticFile("/bg_light.gif", "./assets/bg_light.gif")
+ r.StaticFile("/bg_dark.gif", "./assets/bg_dark.gif")
r.StaticFile("/main.js", "./assets/main.js")
randMax := big.NewInt(maxID)
diff --git a/templates/index.tmpl b/templates/index.tmpl
index 16bf5e9..57852ab 100644
--- a/templates/index.tmpl
+++ b/templates/index.tmpl
@@ -11,15 +11,22 @@
body {
font-family: "cutive", monospace;
font-size:125%;
+ background-color: black;
+ color: white;
+ background-image: url("/bg_dark.gif");
}
a {
- color: black;
+ color: white;
}
div.line:not(.unpinned) > .linetext {
font-weight: bold;
}
+
+span.linetext {
+ background-color: black;
+}