website/assets/offline.html

29 lines
2.3 KiB
HTML

---
title: You Are Probably Offline
comments: off
---
<p>If you're seeing this page and this message, then:
<ul>
<li>you are offline.</li>
<li>this site is offline.</li>
<li>the "internet" connection on your end or this site's is limited somehow and so you can't connect.</li>
<li>you decided to look at the source or something and found this page.</li>
<li>the Earth has been destroyed or nuclear war has occured, threatening the integrity of the DNS system.</li>
<li>Contingency Iota has been initiated.</li>
<li>your browser is being weird.</li>
<li>I broke something somewhere quite badly.</li>
<li>your internet connection is too high-latency - the timeout on requests is 5 seconds.</li>
<li>???</li>
</ul>
This site uses a service worker to provide a limited offline mode, but it doesn't work for everything (dynamic pages, ones requiring a bit of server logic, the comments system, pages which haven't been cached), so you are being shown this instead.
Please enjoy the below "flappy bird" game until your connection comes back, thanks to palaiologos and ubq323 (click or press space).
</p>
<!--experimental miniaturized bird (flappy) (contributed by palaiologos and tweaked by me inelegantly)-->
<canvas style="border: 1px solid black"></canvas>
<script defer>
const q = document.querySelector("canvas")
let canstart = true
J=q.width=q.height=Math.min(500, document.querySelector("p").clientWidth);Q='50px monospace';with(Math)with(C=q.getContext`2d`)with(X=Y=R=0,init=e=(e=>{w=f=Y=X=0,R=1,H=250,q.focus(),canstart=false,V=-10,P=[],(F=(e=>{e-w>1/60&&(Y&&(V=-10,Y=0),H+=V,V+=.8,P.forEach(e=>e.P-=3),f%50||P.push({P:J,L:150+(0|200*random()),C:'rgb('+255*random()+','+255*random()+','+255*random()+')'}),(P.some(e=>abs(e.L-H+2)>60&&0<e.P&&e.P<25)||H>J||H<0)&&(R=0,setTimeout(e=>{font=Q,fillStyle='red',fillText(':(',50,90),canstart=true},99)),clearRect(0,0,J,J),P.forEach(e=>{with(e){fillStyle=C,fillRect(P,0,20,L-60),fillRect(P,L+60,20,J-(L+60))}}),fillStyle='red',fillRect(20,H,10,10),font=Q,fillStyle='red',fillText(ceil(f/50-10/3),40,40),f++,w=e),R&&requestAnimationFrame(F)}))()}),document)onkeydown=(e=>{' '==e.key&&R?++Y:' '==e.key; if (canstart) {init()}}),onmousedown=(e=>{R&&++Y; if (canstart) {init()}});
window.addEventListener("load", function() { if ("points" in window) { points.then(points => points.unlockAchievement("offline")) }})
</script>