added overlay function for tarot cards

2026-03-08 03:52:25 -07:00
parent 84b340d7d1
commit 78abb582dd
17 changed files with 4050 additions and 1175 deletions
--- a/app/stellarium-now-wrapper.html
+++ b/app/stellarium-now-wrapper.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">
+  <title>Stellarium NOW Wrapper</title>
+  <style>
+    html,
+    body {
+      width: 100%;
+      height: 100%;
+      margin: 0;
+      overflow: hidden;
+      background: #000;
+    }
+
+    body {
+      position: relative;
+      font-family: sans-serif;
+    }
+
+    #sky-shell {
+      position: relative;
+      width: 100%;
+      height: 100%;
+      overflow: hidden;
+      background:
+        radial-gradient(circle at 50% 18%, rgba(255, 255, 255, 0.08), transparent 36%),
+        radial-gradient(circle at 20% 12%, rgba(120, 160, 255, 0.12), transparent 28%),
+        #000;
+    }
+
+    #sky-embed {
+      position: absolute;
+      inset: 0;
+      width: 100%;
+      height: 106%;
+      top: -2%;
+      border: 0;
+      background: #000;
+    }
+
+    #sky-shell::before {
+      content: "";
+      position: absolute;
+      inset: 0;
+      pointer-events: none;
+      background:
+        radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.08), transparent 42%),
+        linear-gradient(to bottom, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.38));
+      z-index: 1;
+    }
+
+    #sky-shell::after {
+      content: "";
+      position: absolute;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      height: 30%;
+      pointer-events: none;
+      background:
+        linear-gradient(
+          to top,
+          rgba(0, 0, 0, 1) 0%,
+          rgba(0, 0, 0, 1) 14%,
+          rgba(0, 0, 0, 0.94) 34%,
+          rgba(0, 0, 0, 0.74) 56%,
+          rgba(0, 0, 0, 0.24) 80%,
+          rgba(0, 0, 0, 0) 100%
+        );
+      z-index: 2;
+    }
+  </style>
+</head>
+<body>
+  <div id="sky-shell">
+    <iframe id="sky-embed" title="Decorative sky background" scrolling="no" allow="geolocation"></iframe>
+  </div>
+  <script>
+    (function () {
+      "use strict";
+
+      const HOSTED_STELLARIUM_URL = "https://stellarium-web.org/";
+      const FORWARDED_PARAMS = ["lat", "lng", "elev", "date", "az", "alt", "fov"];
+      const wrapperParams = new URLSearchParams(window.location.search);
+      const hostedUrl = new URL(HOSTED_STELLARIUM_URL);
+
+      FORWARDED_PARAMS.forEach((key) => {
+        const value = wrapperParams.get(key);
+        if (value !== null && value !== "") {
+          hostedUrl.searchParams.set(key, value);
+        }
+      });
+
+      document.getElementById("sky-embed").src = hostedUrl.toString();
+    })();
+  </script>
+</body>
+</html>