From b69a8ef1262acc3a522a36d6c4878058cd4735ef Mon Sep 17 00:00:00 2001
From: June McEnroe <june@causal.agency>
Date: Fri, 30 Sep 2022 10:46:20 -0400
Subject: Add alphabet ranking page

Did I need to spend even the small amount of time I spent on this?
No.
---
 www/causal.agency/.gitignore |  2 +-
 www/causal.agency/Makefile   |  2 +-
 www/causal.agency/alpha.html | 92 ++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 94 insertions(+), 2 deletions(-)
 create mode 100644 www/causal.agency/alpha.html
diff --git a/www/causal.agency/.gitignore b/www/causal.agency/.gitignore
index 7935a3c1..a2ca9b75 100644
--- a/www/causal.agency/.gitignore
+++ b/www/causal.agency/.gitignore
@@ -1,3 +1,3 @@
-*.html
+index.html
 scheme.css
 scheme.png
diff --git a/www/causal.agency/Makefile b/www/causal.agency/Makefile
index 75849db0..d406eb23 100644
--- a/www/causal.agency/Makefile
+++ b/www/causal.agency/Makefile
@@ -1,6 +1,6 @@
 WEBROOT = /var/www/causal.agency
 
-FILES = index.html style.css scheme.css scheme.png
+FILES = index.html style.css scheme.css scheme.png alpha.html
 
 all: ${FILES}
 
diff --git a/www/causal.agency/alpha.html b/www/causal.agency/alpha.html
new file mode 100644
index 00000000..0d83f530
--- /dev/null
+++ b/www/causal.agency/alpha.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>all 26 letters of the alphabet RANKED</title>
+<style>
+body, button { font-size: 200%; text-align: center; }
+button { margin: 1em; padding: 1ch; }
+button#shuffle { font-size: 100%; }
+</style>
+
+which letter do you like more?
+<p>
+<button id="a">A</button>
+<button id="b">B</button>
+<p>
+<details>
+<summary>current ranking</summary>
+<p>
+<span id="ranking">ABCDEFGHIJKLMNOPQRSTUVWXYZ</span>
+<p>
+<button id="shuffle">reshuffle</button>
+</details>
+
+<script>
+let buttonA = document.getElementById("a");
+let buttonB = document.getElementById("b");
+let ranking = document.getElementById("ranking");
+
+let alpha = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split("");
+let rand = (bound) => Math.floor(Math.random() * bound);
+function shuffle() {
+	for (let i = alpha.length - 1; i > 0; --i) {
+		let j = rand(i + 1);
+		let x = alpha[i];
+		alpha[i] = alpha[j];
+		alpha[j] = x;
+	}
+}
+if (localStorage.getItem("alpha")) {
+	alpha = localStorage.getItem("alpha").split("");
+} else {
+	shuffle();
+}
+
+let index = 0;
+let even = true;
+function choose(o) {
+	if (o == "b") {
+		let x = alpha[index];
+		alpha[index] = alpha[index + 1];
+		alpha[index + 1] = x;
+	}
+	index += 2;
+	if (index > alpha.length - 2) {
+		even = !even;
+		index = (even ? 0 : 1);
+	}
+	update();
+}
+
+document.onkeydown = function(event) {
+	if (event.key.toUpperCase() == alpha[index]) {
+		choose("a");
+	} else if (event.key.toUpperCase() == alpha[index + 1]) {
+		choose("b");
+	}
+}
+
+function update() {
+	localStorage.setItem("alpha", alpha.join(""));
+	ranking.innerText = alpha.join("");
+	let a = buttonA;
+	let b = buttonB;
+	if (rand(2)) {
+		a = buttonB;
+		b = buttonA;
+	}
+	let lc = (c) => c;
+	if (rand(2)) lc = (c) => c.toLowerCase();
+	a.innerText = lc(alpha[index]);
+	b.innerText = lc(alpha[index + 1]);
+	a.onclick = () => choose("a");
+	b.onclick = () => choose("b");
+}
+update();
+
+document.getElementById("shuffle").onclick = function() {
+	if (confirm("Are you SURE you want to throw away all your hard work?")) {
+		shuffle();
+		update();
+	}
+}
+</script>
-- 
cgit 1.4.1

d><span title='2019-07-11 17:44:39 -0400'>2019-07-11</span></td><td><a href='/src/commit/bin/shotty.c?id=c1c48e921cf416605f2b6e22e15a20a3b46df02e&amp;follow=1'>Interpret 256color-style SGRs</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-11 17:43:40 -0400'>2019-07-11</span></td><td><a href='/src/commit/bin/shotty.c?id=12f0a2b1c3a0817656ac8d7fd80335e260e90a4e&amp;follow=1'>Use inline style rather than &lt;b&gt;, &lt;i&gt;, &lt;u&gt;</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-11 17:37:31 -0400'>2019-07-11</span></td><td><a href='/src/commit/bin/shotty.c?id=9bc11116890bf5f33d3a32d5efe97167fa8056ce&amp;follow=1'>Factor out clear</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-11 17:25:10 -0400'>2019-07-11</span></td><td><a href='/src/commit/bin/shotty.c?id=3a87c6f209a1a197787e05d226f76106c11a063e&amp;follow=1'>Add bright option to shotty</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-11 17:11:39 -0400'>2019-07-11</span></td><td><a href='/src/commit/bin/shotty.c?id=744b05db5d0b665a7767e92cec432bd494bcff31&amp;follow=1'>Output &lt;b&gt;, &lt;i&gt;, &lt;u&gt; in shotty</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-10 00:24:15 -0400'>2019-07-10</span></td><td><a href='/src/commit/bin/shotty.c?id=967e6347b813947f3b06d723f862bd5bb52c26f1&amp;follow=1'>Ignore SM and RM</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-09 23:47:27 -0400'>2019-07-09</span></td><td><a href='/src/commit/bin/man1/shotty.1?id=a9c4586213c1d79394d76e3ad6fdb31885d26ccd&amp;follow=1'>Add shotty man page and build it</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-09 23:35:52 -0400'>2019-07-09</span></td><td><a href='/src/commit/bin/up.sh?id=539da9d430ffb5afbd1120eaa9987ad7fa8481ce&amp;follow=1'>Add up -c</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-09 23:18:51 -0400'>2019-07-09</span></td><td><a href='/src/commit/bin/shotty.c?id=f75cb431095abfa56e412b63ec17262e71b97039&amp;follow=1'>Add options for default colors to shotty</a></td><td>June McEnroe</td></tr>
<tr><td><span title='2019-07-08 22:48:04 -0400'>2019-07-08</span></td><td><a href='/src/commit/bin/shotty.c?id=5730b2edac38861c9aa0f768a692864417500958&amp;follow=1'>Use char literals consistently</a></td><td>June McEnroe