diff options
| author | Marvin Borner | 2023-07-06 22:03:08 +0200 |
|---|---|---|
| committer | Marvin Borner | 2023-07-06 22:31:46 +0200 |
| commit | 6afe0a6961a959454d08f89fcfbb8a545902aa17 (patch) | |
| tree | cdd4abe3b22addd31e2cd1b2fa727824267c1d30 /append.html | |
Initial commit
Diffstat (limited to 'append.html')
| -rw-r--r-- | append.html | 74 |
1 files changed, 74 insertions, 0 deletions
diff --git a/append.html b/append.html new file mode 100644 index 0000000..51c8e97 --- /dev/null +++ b/append.html @@ -0,0 +1,74 @@ +<div class="buttons"> + <button title="toggle theme"><svg><use href="res/feather.svg#moon"/></svg></button> + <button title="remove distractions"><svg><use href="res/feather.svg#eye-off"/></svg></button> + <button title="share on twitter or mastodon"><svg><use href="res/feather.svg#share-2"/></svg></button> + <button title="open print dialog"><svg><use href="res/feather.svg#printer"/></svg></button> + <button title="go to index"><svg><use href="res/feather.svg#home"/></svg></button> +</div> + +<div id="share" class="popover"> + <div> + <ul> + <li><a href="https://twitter.com" id="twitter">Share on Twitter</a></li> + <li><a href="https://joinmastodon.org" id="mastodon">Share on Mastodon</a></li> + </ul> + </div> +</div> + +<script> + // haha i love this + // thanks, me too + const toggleScheme = () => { + for (const rule of document.styleSheets[1].rules) { + if (!rule.media || !rule.media.mediaText.includes("prefers-color-scheme")) + continue + if (rule.media.mediaText.includes("dark")) { + rule.media.deleteMedium("(prefers-color-scheme: dark)"); + rule.media.appendMedium("(prefers-color-scheme: light)"); + } else { + rule.media.deleteMedium("(prefers-color-scheme: light)"); + rule.media.appendMedium("(prefers-color-scheme: dark)"); + } + } + } + + let text = "V2tWa1YwNUhVa1pSYmxKYVYwVnZlVmxXWXpGaFYwbDZVMjVXWVZkRmJERlhhMlJXVUZFOVBRPT0="; + + (() => { + const sharePopover = document.querySelector(".popover#share"); + + const funcs = [ + () => toggleScheme(), + () => document.querySelectorAll("nav, .buttons").forEach(e => e.remove()), + () => sharePopover.style.display = "block", + () => window.print(), + () => window.location.href = "/", + ] + + sharePopover.addEventListener("click", e => { + sharePopover.style.display = "none"; + }); + + document.querySelector("#twitter").href = `https://twitter.com/intent/tweet?text=${document.title}%0A${window.location.href}`; + document.querySelector("#mastodon").onclick = e => { + window.location.href = `https://${prompt("Enter your mastodon instance:", "mastodon.social")}/share?text=${document.title}%0A${window.location.href}`; + e.preventDefault(); + } + + const buttons = document.querySelectorAll(".buttons button"); + for (let i = 0; i < buttons.length; i++) + buttons[i].addEventListener("click", funcs[i]); + + setTimeout(() => { + const links = document.querySelectorAll("a"); + for (let i = 0; i < links.length; i++) { + if (links[i].getAttribute("href") == "mail") { + for (let j = 0; j < 4; j++) + text = atob(text); + links[i].href = `mailto:${text}`; + } + } + }, 1000); + })(); +</script> + |