has-it-happened-yet

commit 5f0d7c26a3d08977f2a14e0b8b7d30dfb9c58c66

tree

parent:
75cfee46acccd864180bc197caa9d747d46c5567

nmyk <nick@nmyk.io>

2025-10-12T10:24:23-04:00

Has it happened yet?

diff --git a/doc.css b/doc.css
new file mode 100644
index 0000000000000000000000000000000000000000..15d0539b35176daa4550dcefb2cf33356bfaa498
--- /dev/null
+++ b/doc.css
@@ -0,0 +1,39 @@
+a {
+    color: var(--accent-color);
+    text-decoration: underline;
+}
+
+a:hover {
+    color: var(--accent-color);
+    text-decoration: underline;
+}
+
+body {
+    color: var(--main-text-color);
+    max-width: 80ch;
+}
+
+.w {
+    color: var(--alt-text-color);
+}
+
+.F {
+    color: var(--header-color);
+}
+
+.j {
+    color: var(--contrast-color);
+}
+
+.c {
+    color: var(--unaccent-color);
+}
+
+p.c {
+    margin: 0;
+}
+
+pre {
+    overflow-x: auto;
+    padding-bottom: 10px;
+}
\ No newline at end of file
diff --git a/favicon.ico b/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..78cb28572c573238ce67c98c2b3204baecb7b025
Binary files /dev/null and b/favicon.ico differ
diff --git a/has-it-happened-yet.png b/has-it-happened-yet.png
new file mode 100644
index 0000000000000000000000000000000000000000..50a0a50675f982f3be5c950ae48b9b2a739c6e24
Binary files /dev/null and b/has-it-happened-yet.png differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..93e2adca989fdc967113cfc144b742f34fdc84fd
--- /dev/null
+++ b/index.html
@@ -0,0 +1,100 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Has it happened yet?</title>
+    <link href="style.css" rel="stylesheet">
+    <link href="doc.css" rel="stylesheet">
+    <link href="favicon.ico" rel="icon">
+    <meta name="description" content="Has it happened yet?" />
+    <meta property="og:title" content="Has it happened yet?" />
+    <meta property="og:description" content="Has it happened yet?" />
+    <meta property="og:image" content="has-it-happened-yet.png" />
+    <meta property="disclaimer"
+        content="This is a work of conceptual art. There is no 'it'. Your interpretation is the medium.">
+</head>
+
+<script>
+    const oracleOfDelphiURL = 'https://pythia.apollo.faith/api/v1/vision'
+    document.addEventListener('DOMContentLoaded', () => {
+        const answerE = document.getElementById('answer');
+        const timestampE = document.getElementById('timestamp');
+        const checkProphecy = async () => {
+            try {
+                const res = await fetch(oracleOfDelphiURL);
+                if (!res.ok) throw new Error(`HTTP ${res.status}`);
+                const { is_prophecy_fulfilled, updated_at } = await res.json();
+                const answer = is_prophecy_fulfilled ? 'Yes' : 'No';
+                answerE.textContent = answer;
+                timestampE.textContent = updated_at;
+            } catch (err) {
+                console.error('Failed to contact the oracle:', err);
+                answerE.textContent = '🤷';
+            }
+        };
+        checkProphecy();
+    });
+</script>
+
+<body>
+    <div id="answer" style="font-size: 200pt; text-align: center">🤷</div>
+    as of <span id="timestamp">now</span>
+    <hr>
+    <h1>FAQ</h1>
+    <h2>Has <i>what</i> happened yet?</h2>
+    <p>The thing that everyone wakes up hoping has finally happened.
+        The thing so many of us wish someone would just do.
+        That historical event we long to see in the news on some beautiful morning, hopefully soon:
+        that one or more clever and brave people finally took it upon themselves to do it, and were lucky, and
+        succeeded.
+    </p>
+    <p>
+        Still not sure?
+        Think about everything it could <i>possibly</i> be for a few seconds. Then stop thinking.
+    </p>
+    <p>Pretty obvious isn't it. We all know what we want.</p>
+
+    <h2>Should I attempt it?</h2>
+    <p>
+        Yes, you should. I strongly encourage you to, if you're considering it at all.
+        The cause could not be more just.
+        Even if you fail, you will be an inspiration to everyone else who is planning an attempt.
+    </p>
+    <p>
+        In fact, your failure would yield crucial knowledge to be utilized by those who eventually do
+        succeed.
+        Therefore you will not fail.
+    </p>
+    <p>
+    </p>
+
+    <h2>Is it worth the risk?</h2>
+    <p>
+        You are but a drop in the ocean.
+    </p>
+
+    <h2>Are you sure it will be good for everyone?</b></h2>
+    <p>
+        Some say it won't. But even they will ultimately be better off when it finally happens.
+        Everyone on Earth will, in some way.
+        Think about it.
+        In fact, some of the people who are most adamantly opposed to it are the ones who stand to benefit the most.
+        So, in that sense, yes.
+    </p>
+
+    <h2>Do you have any advice for how to do it?</h2>
+    <p>
+        Someone who could do it alone would have to be a rare individual.
+        Working as a team adds strength but also complexity.
+        My advice is to make the best of the resources you have, and to act at the right time.
+    </p>
+
+    <h2>Why don't <i>you</i> do it?</h2>
+    <p>
+        These are the resources I have.
+    </p>
+</body>
+
+</html>
diff --git a/style.css b/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..f74a94e6fb7e6962b37a89fef3294b0ed28f5761
--- /dev/null
+++ b/style.css
@@ -0,0 +1,167 @@
+@media (prefers-color-scheme: dark) {
+    :root {
+        --main-text-color: gainsboro;
+        --background-color: black;
+        --alt-text-color: lightskyblue;
+        --header-color: plum;
+        --accent-color: palegreen;
+        --unaccent-color: slategrey;
+        --contrast-color: lightcoral;
+        --selection-bg-color: navy;
+    }
+}
+
+@media (prefers-color-scheme: light) {
+    :root {
+        --main-text-color: black;
+        --background-color: gainsboro;
+        --alt-text-color: mediumblue;
+        --header-color: purple;
+        --accent-color: green;
+        --unaccent-color: slategrey;
+        --contrast-color: firebrick;
+        --selection-bg-color: skyblue;
+    }
+}
+
+body {
+    color: var(--main-text-color);
+    background: var(--background-color);
+    margin: auto;
+    font-size: 14px;
+    padding: 1em;
+    max-width: 69em;
+    font-family: monospace;
+    word-wrap: break-word;
+}
+
+h1,
+h2,
+h3 {
+    color: var(--header-color);
+}
+
+::selection {
+    background: var(--selection-bg-color);
+}
+
+div.vspace50px {
+    clear: both;
+    height: 50px;
+}
+
+.banner {
+    color: var(--main-text-color);
+    display: inline-block;
+    text-align: left;
+    font-weight: bold;
+    margin: auto;
+}
+@media  (min-width: 100px)  {  .banner  { font-size:0.12em;  } }
+@media  (min-width: 150px)  {  .banner  { font-size:0.18em;  } }
+@media  (min-width: 200px)  {  .banner  { font-size:0.24em;  } }
+@media  (min-width: 250px)  {  .banner  { font-size:0.32em;  } }
+@media  (min-width: 300px)  {  .banner  { font-size:0.40em;  } }
+@media  (min-width: 350px)  {  .banner  { font-size:0.48em;  } }
+@media  (min-width: 400px)  {  .banner  { font-size:0.56em;  } }
+@media  (min-width: 450px)  {  .banner  { font-size:0.60em;  } }
+@media  (min-width: 500px)  {  .banner  { font-size:0.68em;  } }
+@media  (min-width: 550px)  {  .banner  { font-size:0.76em;  } }
+@media  (min-width: 600px)  {  .banner  { font-size:0.84em;  } }
+@media  (min-width: 650px)  {  .banner  { font-size:0.92em;  } }
+@media  (min-width: 700px)  {  .banner  { font-size:1.00em;  } }
+
+.container {
+    display: table;
+    text-align: left;
+    margin-left: auto;
+    margin-right: auto;
+    padding-left: 20px;
+    padding-right: 20px;
+    min-width: 360px;
+    max-width: 440px;
+}
+
+.advisory {
+    background: var(--header-color);
+    color: var(--background-color);
+    font-weight: bold;
+    padding: 1em;
+    border-radius: 0.25em;
+}
+
+hr {
+    border-color: var(--header-color);
+}
+
+a {
+    color: var(--alt-text-color);
+    text-decoration: none;
+}
+
+a:hover {
+    color: var(--alt-text-color);
+    text-decoration: underline;
+}
+
+ul {
+    margin: 0px;
+    padding-left: 20px;
+}
+
+.slider {
+    -webkit-appearance: none;
+    width: 100%;
+    height: 25px;
+    background: var(--unaccent-color);
+    outline: none;
+    opacity: 0.7;
+    -webkit-transition: .2s;
+    transition: opacity .2s;
+    margin-top: 10px;
+}
+
+.slider:hover {
+    opacity: 1;
+}
+
+.slider::-webkit-slider-thumb {
+    -webkit-appearance: none;
+    appearance: none;
+    width: 25px;
+    height: 25px;
+    background: var(--header-color);
+    cursor: pointer;
+}
+
+.slider::-moz-range-thumb {
+    width: 25px;
+    height: 25px;
+    background: var(--header-color);
+    cursor: pointer;
+}
+
+ul {
+    list-style-type: " • ";
+}
+
+@media (min-width: 69em) {
+    .row {
+        display: flex;
+        flex-wrap: nowrap;
+    }
+
+    .col {
+        flex-grow: 1;
+    }
+}
+
+.grid {
+    border-collapse: collapse;
+}
+
+.col {
+    padding-left: 1em;
+    padding-right: 1em;
+    padding-bottom: 1em;
+}
\ No newline at end of file