Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
Binary file — no preview.
| 5 | 5 | --- |
|
| 6 | 6 | ||
| 7 | 7 | <script> |
|
| 8 | - | import { toggleClass } from "@/utils"; |
|
| 8 | + | function favicons(this: any) { |
|
| 9 | + | this.hidden = "hidden"; |
|
| 10 | + | this.visibilityChange = "visibilitychange"; |
|
| 11 | + | this.favicon = document.querySelector("[rel='shortcut icon']") |
|
| 12 | + | ? (document.querySelector("[rel='shortcut icon']") as HTMLLinkElement).href |
|
| 13 | + | : ""; |
|
| 14 | + | this.title = document.title; |
|
| 15 | + | this.wasSpoofed = false; |
|
| 16 | + | this.spoofed = []; |
|
| 17 | + | ||
| 18 | + | this.services = { |
|
| 19 | + | sy: () => ({ title: "Official Church of Scientology: Difficulties on the Job - Online Course", favicon: "/favicons/sy.png" }), |
|
| 20 | + | cdc: () => ({ title: "Ask HN: How could I safely contact drug cartels?", favicon: "/favicons/hn.png" }), |
|
| 21 | + | pul: () => ({ title: "Pick up lines suggestions - ChatGPT", favicon: "/favicons/cgpt.png" }), |
|
| 22 | + | fes: () => ({ title: "The Flat Earth Society", favicon: "/favicons/fes.png" }), |
|
| 23 | + | tsm: () => ({ title: "Amazon.com: taylor swift merch", favicon: "/favicons/az.ico" }), |
|
| 24 | + | rwsb: () => ({ title: "r/wallstreetbets on Reddit", favicon: "/favicons/rd.png" }), |
|
| 25 | + | iw: () => ({ title: "Infowars: There's a War on For Your Mind!", favicon: "/favicons/iw.png" }), |
|
| 26 | + | tac: () => ({ title: "The Anarchist Cookbook by William Powell | Goodreads", favicon: "/favicons/gr.png" }), |
|
| 27 | + | nggyu: () => ({ title: "Rick Astley - Never Gonna Give You Up - YouTube", favicon: "/favicons/yt.ico" }), |
|
| 28 | + | ftx: () => ({ title: "FTX Cryptocurrency Exchange", favicon: "/favicons/ftx.png" }), |
|
| 29 | + | }; |
|
| 9 | 30 | ||
| 10 | - | class MobileNavBtn extends HTMLElement { |
|
| 11 | - | constructor() { |
|
| 12 | - | super(); |
|
| 13 | - | const headerEl = document.getElementById("main-header")!; |
|
| 14 | - | const mobileButtonEl = document.getElementById( |
|
| 15 | - | "toggle-navigation-menu", |
|
| 16 | - | ) as HTMLButtonElement; |
|
| 17 | - | let menuOpen = false; |
|
| 31 | + | this.enabledServices = Object.keys(this.services); |
|
| 18 | 32 | ||
| 19 | - | function toggleMobileMenu() { |
|
| 20 | - | toggleClass(headerEl, "menu-open"); |
|
| 21 | - | menuOpen = !menuOpen; |
|
| 22 | - | mobileButtonEl.setAttribute("aria-expanded", menuOpen.toString()); |
|
| 33 | + | this.init = function () { |
|
| 34 | + | if (typeof (document as any).mozHidden !== "undefined") { |
|
| 35 | + | this.hidden = "mozHidden"; |
|
| 36 | + | this.visibilityChange = "mozvisibilitychange"; |
|
| 37 | + | } else if (typeof (document as any).msHidden !== "undefined") { |
|
| 38 | + | this.hidden = "msHidden"; |
|
| 39 | + | this.visibilityChange = "msvisibilitychange"; |
|
| 40 | + | } else if (typeof (document as any).webkitHidden !== "undefined") { |
|
| 41 | + | this.hidden = "webkitHidden"; |
|
| 42 | + | this.visibilityChange = "webkitvisibilitychange"; |
|
| 23 | 43 | } |
|
| 44 | + | document.addEventListener(this.visibilityChange, this.handler.bind(this), false); |
|
| 45 | + | }; |
|
| 24 | 46 | ||
| 25 | - | mobileButtonEl.addEventListener("click", toggleMobileMenu); |
|
| 47 | + | this.default = function () { |
|
| 48 | + | this.update({ title: this.title, favicon: this.favicon }); |
|
| 49 | + | }; |
|
| 50 | + | ||
| 51 | + | this.update = function (data: { title: string; favicon: string }) { |
|
| 52 | + | const cacheBuster = "?v=" + Math.round(Math.random() * 10000000); |
|
| 53 | + | const link = document.createElement("link"); |
|
| 54 | + | link.type = "image/x-icon"; |
|
| 55 | + | link.rel = "shortcut icon"; |
|
| 56 | + | link.href = data.favicon + cacheBuster; |
|
| 57 | + | const head = document.getElementsByTagName("head")[0]; |
|
| 58 | + | const existing = head.querySelector("[rel='shortcut icon']"); |
|
| 59 | + | if (existing) existing.remove(); |
|
| 60 | + | head.appendChild(link); |
|
| 61 | + | document.title = data.title; |
|
| 62 | + | if (this.wasSpoofed === true) { |
|
| 63 | + | const el = document.getElementById("disablejs"); |
|
| 64 | + | if (el) { |
|
| 65 | + | el.style.display = "block"; |
|
| 66 | + | el.innerHTML = ` |
|
| 67 | + | <p><strong>(CLICK/TAP THIS OVERLAY ANYWHERE TO CLOSE IT)</strong></p> |
|
| 68 | + | <br/> |
|
| 69 | + | <p>Ah, yes. That moment. The one that sends a chill down your spine and makes you do a quick, frantic scan of your surroundings, hoping nobody noticed that brief, undeniable flash of panic on your face. You know <strong>exactly</strong> what I'm talking about: That split second when you spot <em>that website</em> in your browser's tab bar.</p> |
|
| 70 | + | <p>Heart pounding, you dart a glance at your coworkers, your friends, your partner, or anyone in the vicinity, searching for signs of judgment or, worse, curiosity. No one's looking, but somehow, you feel like everyone is. It's like the universe knows, and it's giggling behind its hand. You quickly click over to the tab, praying, hoping it's not what you think it is.</p> |
|
| 71 | + | <p>And then, oh sweet relief, it's not <strong>that</strong>. But now, a whole new, equally horrible truth sinks in. You've just been pranked by the cruel, merciless soul who crafted this infernal website. You, my friend, have just experienced the finest torture modern web technology has to offer: Unwarranted suspense, followed by the revelation that <em>nothing is as it seems</em>.</p> |
|
| 72 | + | <p>JavaScript, you son of a smoking gun. The great trickster of the web, slinking in the background, making you believe that your browsing experience is smooth and simple, only to slap you with a pop-up, a subtle redirect, or worse, a blinking ad that's seemingly impossible to close.</p> |
|
| 73 | + | <p>And here you are, caught in the endless cycle of knowing you should turn JavaScript off but just <strong>not</strong> caring enough to actually do it. It's like knowing you should stop eating those extra chips but doing it anyway. But this? This is the universe giving you a little nudge, perhaps a <em>not-so-subtle</em> one, reminding you of your folly.</p> |
|
| 74 | + | <p>So, here it is, loud and clear: <strong>Turn JavaScript off, now, and only allow it on websites you trust!</strong> Save your sanity, preserve your dignity, and maybe give your browser a fighting chance at actually doing what <strong>you</strong> want it to do. Because if you don't, the next time you see that icon, your heart might not only drop, it might skip a beat or two.</p> |
|
| 75 | + | <br/> |
|
| 76 | + | <p><a href="https://disable-javascript.org" target="_self" style="text-decoration:underline;padding-top:2rem;" title="disable-javascript.org">More information here.</a></p> |
|
| 77 | + | <br/> |
|
| 78 | + | <p><strong>(CLICK/TAP THIS OVERLAY ANYWHERE TO CLOSE IT)</strong></p> |
|
| 79 | + | `; |
|
| 80 | + | } |
|
| 81 | + | } |
|
| 82 | + | }; |
|
| 26 | 83 | ||
| 27 | - | document.addEventListener("astro:after-swap", () => { |
|
| 28 | - | if (menuOpen) toggleMobileMenu(); |
|
| 29 | - | }); |
|
| 30 | - | } |
|
| 84 | + | this.spoof = function () { |
|
| 85 | + | let i = 0; |
|
| 86 | + | if (this.spoofed.length === this.enabledServices.length) { |
|
| 87 | + | this.spoofed.length = 0; |
|
| 88 | + | } |
|
| 89 | + | for (let es = 0; es < this.enabledServices.length; es++) { |
|
| 90 | + | i = Math.round(Math.random() * (this.enabledServices.length - 1)); |
|
| 91 | + | if (this.spoofed.includes(i) === false) break; |
|
| 92 | + | } |
|
| 93 | + | this.spoofed.push(i); |
|
| 94 | + | const service = this.enabledServices[i]; |
|
| 95 | + | if (service && this.services[service]) { |
|
| 96 | + | this.update(this.services[service]()); |
|
| 97 | + | } |
|
| 98 | + | this.wasSpoofed = true; |
|
| 99 | + | }; |
|
| 100 | + | ||
| 101 | + | this.handler = function () { |
|
| 102 | + | if ((document as any)[this.hidden]) { |
|
| 103 | + | this.spoof(); |
|
| 104 | + | } else { |
|
| 105 | + | this.default(); |
|
| 106 | + | } |
|
| 107 | + | }; |
|
| 108 | + | ||
| 109 | + | this.init(); |
|
| 31 | 110 | } |
|
| 32 | 111 | ||
| 33 | - | customElements.define("mobile-button", MobileNavBtn); |
|
| 112 | + | new (favicons as any)(); |
|
| 34 | 113 | </script> |
|
| 35 | 114 | ||
| 115 | + | <div |
|
| 116 | + | id="disablejs" |
|
| 117 | + | onclick="this.style.display='none'" |
|
| 118 | + | style="display:none;position:fixed;inset:0;z-index:9999;overflow-y:auto;background:rgba(0,0,0,0.92);color:#fff;font-family:monospace;padding:2rem;cursor:pointer" |
|
| 119 | + | ></div> |
|
| 120 | + | ||
| 36 | 121 | <header |
|
| 37 | 122 | id="main-header" |
|
| 38 | - | class="group relative mb-14 sm:mb-28 flex items-center justify-between sm:pl-[4.5rem]" |
|
| 123 | + | class="relative mb-14 sm:mb-28 sm:flex sm:items-center sm:pl-[4.5rem]" |
|
| 39 | 124 | > |
|
| 40 | - | <div class="flex sm:flex-col"> |
|
| 125 | + | <div class="sm:flex sm:flex-col"> |
|
| 41 | 126 | <a |
|
| 42 | 127 | href="/" |
|
| 43 | - | class="inline-flex items-center sm:relative sm:inline-block" |
|
| 128 | + | class="inline-flex items-center mb-4 sm:mb-0 sm:relative sm:inline-block" |
|
| 44 | 129 | aria-current={url.pathname === "/" ? "page" : false} |
|
| 45 | 130 | data-astro-reload |
|
| 46 | 131 | > |
|
| 52 | 137 | stroke-linecap="round" |
|
| 53 | 138 | stroke-linejoin="round" |
|
| 54 | 139 | viewBox="0 0 256 256" |
|
| 55 | - | ><!-- Icon from Phosphor by Phosphor Icons - https://github.com/phosphor-icons/core/blob/main/LICENSE --> |
|
| 140 | + | > |
|
| 56 | 141 | <path |
|
| 57 | 142 | fill="currentColor" |
|
| 58 | 143 | d="M164 78a26 26 0 1 0-26-26a26 26 0 0 0 26 26m0-40a14 14 0 1 1-14 14a14 14 0 0 1 14-14m89.16 158.94l-54.56-92.08a13.9 13.9 0 0 0-12-6.86a13.88 13.88 0 0 0-12 6.86l-27.88 47.05l-46.56-79a14 14 0 0 0-24.13 0L2.83 197A6 6 0 0 0 8 206h240a6 6 0 0 0 5.16-9.06M86.27 79a2 2 0 0 1 3.46 0l25.34 43H60.93ZM18.5 194l35.36-60h68.29l19.3 32.77l16 27.2Zm152.93 0l-17.85-30.29L184.83 111a2 2 0 0 1 1.72-1a1.93 1.93 0 0 1 1.72 1l49.2 83Z" |
|
| 59 | 144 | ></path></svg |
|
| 60 | 145 | > |
|
| 61 | - | ||
| 62 | 146 | <span class="text-xl font-bold sm:text-2xl">Steve Simkins</span> |
|
| 63 | 147 | </a> |
|
| 64 | 148 | <nav |
|
| 65 | 149 | id="navigation-menu" |
|
| 66 | - | class="absolute -inset-x-4 top-14 hidden flex-col items-end gap-y-4 rounded-md bg-[color:var(--theme-menu-bg)] py-4 text-accent shadow backdrop-blur group-[.menu-open]:z-50 group-[.menu-open]:flex sm:static sm:z-auto sm:mt-1 sm:-ml-4 sm:flex sm:flex-row sm:items-center sm:divide-x sm:divide-dashed sm:divide-accent sm:rounded-none sm:bg-transparent sm:py-0 sm:shadow-none sm:backdrop-blur-none" |
|
| 150 | + | class="grid grid-cols-4 gap-y-2 text-accent sm:flex sm:mt-1 sm:-ml-4 sm:flex-row sm:items-center sm:divide-x sm:divide-dashed sm:divide-accent sm:gap-y-0" |
|
| 67 | 151 | aria-label="Main menu" |
|
| 68 | 152 | > |
|
| 69 | 153 | { |
|
| 70 | 154 | MENU_LINKS.map((link) => ( |
|
| 71 | 155 | <a |
|
| 72 | 156 | href={link.path} |
|
| 73 | - | class="py-4 px-4 sm:py-0 sm:hover:underline" |
|
| 157 | + | class="sm:py-0 sm:px-4 sm:hover:underline" |
|
| 74 | 158 | aria-current={url.pathname === link.path ? "page" : false} |
|
| 75 | 159 | rel="prefetch" |
|
| 76 | 160 | > |
|
| 80 | 164 | } |
|
| 81 | 165 | </nav> |
|
| 82 | 166 | </div> |
|
| 83 | - | <mobile-button> |
|
| 84 | - | <button |
|
| 85 | - | id="toggle-navigation-menu" |
|
| 86 | - | class="group relative ml-8 h-7 w-7 sm:invisible sm:hidden" |
|
| 87 | - | type="button" |
|
| 88 | - | aria-label="Open main menu" |
|
| 89 | - | aria-expanded="false" |
|
| 90 | - | aria-haspopup="menu" |
|
| 91 | - | > |
|
| 92 | - | <svg |
|
| 93 | - | id="line-svg" |
|
| 94 | - | class="absolute top-1/2 left-1/2 h-full w-full -translate-x-1/2 -translate-y-1/2 transition-all group-aria-expanded:scale-0 group-aria-expanded:opacity-0" |
|
| 95 | - | aria-hidden="true" |
|
| 96 | - | focusable="false" |
|
| 97 | - | xmlns="http://www.w3.org/2000/svg" |
|
| 98 | - | fill="none" |
|
| 99 | - | viewBox="0 0 24 24" |
|
| 100 | - | stroke-width="1.5" |
|
| 101 | - | stroke="currentColor" |
|
| 102 | - | > |
|
| 103 | - | <path |
|
| 104 | - | stroke-linecap="round" |
|
| 105 | - | stroke-linejoin="round" |
|
| 106 | - | d="M3.75 9h16.5m-16.5 6.75h16.5"></path> |
|
| 107 | - | </svg> |
|
| 108 | - | <svg |
|
| 109 | - | id="cross-svg" |
|
| 110 | - | class="absolute top-1/2 left-1/2 h-full w-full -translate-x-1/2 -translate-y-1/2 scale-0 text-accent opacity-0 transition-all group-aria-expanded:scale-100 group-aria-expanded:opacity-100" |
|
| 111 | - | class="text-accent" |
|
| 112 | - | aria-hidden="true" |
|
| 113 | - | focusable="false" |
|
| 114 | - | xmlns="http://www.w3.org/2000/svg" |
|
| 115 | - | fill="none" |
|
| 116 | - | viewBox="0 0 24 24" |
|
| 117 | - | stroke-width="1.5" |
|
| 118 | - | stroke="currentColor" |
|
| 119 | - | > |
|
| 120 | - | <path |
|
| 121 | - | stroke-linecap="round" |
|
| 122 | - | stroke-linejoin="round" |
|
| 123 | - | d="M6 18L18 6M6 6l12 12"></path> |
|
| 124 | - | </svg> |
|
| 125 | - | </button> |
|
| 126 | - | </mobile-button> |
|
| 127 | 167 | </header> |
|