feat: Add downtime notification
All checks were successful
Build Docker / Build Image (push) Successful in 27s

This commit is contained in:
Nathan Woodburn 2023-11-03 14:11:34 +11:00
parent 6efcb43d23
commit 21bcb0464b
Signed by: nathanwoodburn
GPG Key ID: 203B000478AD0EF1
5 changed files with 72 additions and 8 deletions

View File

@ -86,15 +86,26 @@ def index():
repo_name=git['repo']['name']
repo_name=repo_name.lower()
repo_description=git['repo']['description']
custom = ""
# Check for downtime
uptime = requests.get('https://uptime.woodburn.au/api/status-page/main/badge')
uptime = uptime.content.count(b'Up') > 1
if uptime:
custom += "<style>#downtime{display:none !important;}</style>"
else:
custom += "<style>#downtime{opacity:1;}</style>"
# Special names
if repo_name == "nathanwoodburn.github.io":
repo_name = "Nathan.Woodburn/"
html_url=git['repo']['html_url']
repo = "<a href=\"" + html_url + "\" target=\"_blank\">" + repo_name + "</a>"
handshake_scripts = "<script src=\"https://nathan.woodburn/handshake.js\" domain=\"nathan.woodburn\"></script><script src=\"https://nathan.woodburn/https.js\"></script>"
# If localhost, don't load handshake
if request.host == "localhost:5000" or request.host == "127.0.0.1:5000" or os.getenv('dev') == "true" or request.host == "test.nathan.woodburn.au":
@ -102,14 +113,14 @@ def index():
if request.cookies.get('HNS'):
return render_template('index.html', handshake_scripts=handshake_scripts, HNS=request.cookies.get('HNS'), repo=repo, repo_description=repo_description)
return render_template('index.html', handshake_scripts=handshake_scripts, HNS=request.cookies.get('HNS'), repo=repo, repo_description=repo_description, custom=custom)
if handshake_scripts == "":
address = "hs1............example"
else:
address = requests.get('http://hip02-server:3000').text
# Set cookie
resp = make_response(render_template('index.html', handshake_scripts=handshake_scripts, HNS=address, repo=repo, repo_description=repo_description), 200, {'Content-Type': 'text/html'})
resp = make_response(render_template('index.html', handshake_scripts=handshake_scripts, HNS=address, repo=repo, repo_description=repo_description, custom=custom), 200, {'Content-Type': 'text/html'})
# Cookie should last 1 week
resp.set_cookie('HNS', address, max_age=604800)
return resp

View File

@ -1 +1 @@
img.no-drag{pointer-events:none}img.fog{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%}
img.no-drag{pointer-events:none}img.fog{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%}#downtime{z-index:2;position:fixed;right:0;bottom:0;width:20%;transition:opacity .5s;opacity:0}blockquote.speech{position:absolute;display:inline-block;right:14vw;bottom:23vh;width:17vw;background:url(/assets/img/speech-bubble.svg) center;color:#fff;padding-top:3%;padding-bottom:20%;background-repeat:no-repeat!important;margin:0 auto;text-align:center;box-sizing:content-box;line-height:1;font-family:SequentialistBB,cursive;font-size:1.2vw}

View File

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
preserveAspectRatio="none"
viewBox="0 0 132 136"
version="1.1"
id="svg71"
sodipodi:docname="speech-bubble.svg"
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview73"
pagecolor="#505050"
bordercolor="#ffffff"
borderopacity="1"
inkscape:pageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="1"
showgrid="false"
inkscape:zoom="5.9117647"
inkscape:cx="35.437811"
inkscape:cy="68"
inkscape:window-width="1920"
inkscape:window-height="1008"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg71" />
<defs
id="defs67">
<style
id="style65">
path {
fill: white;
stroke: #000;
stroke-width: 4;
stroke-linejoin: bevel;
vector-effect: non-scaling-stroke;
}
</style>
</defs>
<path
d="m 66.1,1.5 c 35.7,0 64.6,21.4 64.6,44.5 0,18.1 -17.9,33.5 -42.8,39.3 -1.5,14.8 1.3,39 8.5,48.1 C 85.6,120.9 74,99.8 69.8,87.7 c -1.2,0 -2.5,0.1 -3.7,0.1 C 30.4,87.8 1.5,69.1 1.5,46 1.5,22.9 30.4,1.5 66.1,1.5 Z m 30.3,131.9 c 0.3,0.4 0.7,0.8 1,1.1 -0.4,-0.3 -0.7,-0.7 -1,-1.1 z"
id="path69"
style="fill:#000000;fill-opacity:0.80691564" />
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

1
templates/assets/js/downtime.min.js vendored Normal file
View File

@ -0,0 +1 @@
document.addEventListener("DOMContentLoaded",(function(){var n=document.getElementById("downtime");n&&n.addEventListener("click",(function(){"0"!==n.style.opacity&&window.open("https://uptime.woodburn.au","_blank")}))})),window.addEventListener("scroll",(function(){const n=document.getElementById("downtime"),t=window.scrollY;n.style.opacity=t>200?"0":"1"}));

View File

@ -72,6 +72,9 @@ height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
</div>
</div>
</nav>
<div class="text-end d-none d-md-block d-lg-block d-xl-block d-xxl-block" id="downtime"><blockquote class="speech bubble"><em>G'day!</em><br>
Some services are down.<br>
Check them out here!</blockquote><img class="img-fluid" src="/assets/img/pfront.webp"></div>
<header class="masthead main" style="background: url(&quot;/assets/img/bg/background.webp&quot;) bottom / cover;position: relative;">
<div class="intro-body text parallax" style="color: rgb(0,0,0);">
<h1 class="d-none d-print-inline-block d-sm-inline-block d-md-inline-block d-lg-inline-block d-xl-inline-block d-xxl-inline-block inner-text" style="font-size: 70px;">G'day, Welcome to<br>my Personal Site</h1>
@ -79,7 +82,7 @@ height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<h2 class="inner-text">Nathan Woodburn</h2>
</div><img class="fog" src="/assets/img/bg/fog_1.webp" alt="">
</header>
<section class="text-center content-section" id="about" style="padding-bottom: 0px;">
<section class="text-center content-section" id="about" style="padding-bottom: 0px;background: black;">
<div class="container">
<div class="row">
<div class="col-lg-8 mx-auto">
@ -147,7 +150,7 @@ height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
</div>
</div>
</section><img class="no-drag" src="/assets/img/tilt.svg" style="width: 100%;background: #363636;transform: rotate(180deg);" alt="">
<section class="text-center content-section" id="contact" style="padding-top: 0px;padding-bottom: 3em;">
<section class="text-center content-section" id="contact" style="padding-top: 0px;padding-bottom: 3em;background: black;">
<div class="container">
<div class="row">
<div class="col-lg-8 mx-auto">
@ -229,10 +232,11 @@ height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
hns.addEventListener('click', () => {
copyToClipboard(hns);
});
</script>
</script>{{custom | safe}}
<script src="/assets/bootstrap/js/bootstrap.min.js"></script>
<script src="/assets/js/script.min.js"></script>
<script src="/assets/js/hacker.min.js"></script>
<script src="/assets/js/downtime.min.js"></script>
</body>
</html>