Add open/closed notification

content/_index.md

@@ -3,6 +3,21 @@ title: Welcome to Leigh Hackspace!
 subtitle: Leigh Hackspace is an accessible workspace, where members come together to learn new skills, share ideas and build awesome things!
 layout: home
 ---
+
 Leigh Hackspace is a maker community and makerspace open to all creatives, programmers and hackers in the North West. Simply put, it’s a social workspace where you are free to use the tools and facilities we provide to build, make, and create whatever you like.
 
-We also host a number of events and workshops, as well as offering private artist studios and a shared co-working area.
+We also host a number of events and workshops, as well as offering private artist studios and a shared co-working area.
+
+{{< open >}}
+
+| Day       | Opening Times |
+| --------- | ------------- |
+| Monday    | Closed        |
+| Tuesday   | 14:00 - 20:00 |
+| Wednesday | 14:00 - 20:00 |
+| Thursday  | Closed        |
+| Friday    | Closed        |
+| Saturday  | 12:00 - 17:00 |
+| Sunday    | Closed        |
+
+We currently operate a reduced opening hours due to member availability. The hackspace can be open outside of these hours and a banner above will appear when it is open, otherwise please check on [Slack]().

themes/lhs/layouts/partials/head.html

@@ -3,6 +3,7 @@
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <script src="https://kit.fontawesome.com/589b48ea08.js"></script>
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
 
 <link rel="stylesheet" href="/css/bulma.min.css">
 <link rel="stylesheet" href="/css/leighhack.css" type="text/css">

themes/lhs/layouts/shortcodes/open.html

@@ -0,0 +1,15 @@
+<div class="notification has-text-centered" id="hackspace-open">
+Leigh Hackspace is currently <span id="hackspace_status">Closed</span>
+</div>
+<script>
+    $.getJSON("https://api.leighhack.org/space.json", function (data) {
+        var date = new Date(data.state.lastchange * 1000);
+        
+        if (data.state.open) {
+            $('span#hackspace_status').html('<b>Open</b>');
+            $('div#hackspace-open').addClass('is-success');
+        } else {
+            $('span#hackspace_status').html('<b>Closed</b>');
+        }
+    });
+</script>