aboutsummaryrefslogtreecommitdiff
path: root/layouts/partials
diff options
context:
space:
mode:
Diffstat (limited to 'layouts/partials')
-rw-r--r--layouts/partials/custom/above-footer.html8
-rw-r--r--layouts/partials/custom/above-header.html8
-rw-r--r--layouts/partials/custom/below-footer.html8
-rw-r--r--layouts/partials/custom/below-header.html8
-rw-r--r--layouts/partials/custom/meta.html8
-rw-r--r--layouts/partials/footer.html1
-rw-r--r--layouts/partials/header.html1
-rw-r--r--layouts/partials/js.html152
-rw-r--r--layouts/partials/meta.html40
9 files changed, 201 insertions, 33 deletions
diff --git a/layouts/partials/custom/above-footer.html b/layouts/partials/custom/above-footer.html
new file mode 100644
index 0000000..1dadab6
--- /dev/null
+++ b/layouts/partials/custom/above-footer.html
@@ -0,0 +1,8 @@
+<!--
+
+This file can be used to add custom HTML
+to your cState powered status page.
+
+https://github.com/mistermantas/cstate/wiki/Customization
+
+-->
diff --git a/layouts/partials/custom/above-header.html b/layouts/partials/custom/above-header.html
new file mode 100644
index 0000000..1dadab6
--- /dev/null
+++ b/layouts/partials/custom/above-header.html
@@ -0,0 +1,8 @@
+<!--
+
+This file can be used to add custom HTML
+to your cState powered status page.
+
+https://github.com/mistermantas/cstate/wiki/Customization
+
+-->
diff --git a/layouts/partials/custom/below-footer.html b/layouts/partials/custom/below-footer.html
new file mode 100644
index 0000000..1dadab6
--- /dev/null
+++ b/layouts/partials/custom/below-footer.html
@@ -0,0 +1,8 @@
+<!--
+
+This file can be used to add custom HTML
+to your cState powered status page.
+
+https://github.com/mistermantas/cstate/wiki/Customization
+
+-->
diff --git a/layouts/partials/custom/below-header.html b/layouts/partials/custom/below-header.html
new file mode 100644
index 0000000..1dadab6
--- /dev/null
+++ b/layouts/partials/custom/below-header.html
@@ -0,0 +1,8 @@
+<!--
+
+This file can be used to add custom HTML
+to your cState powered status page.
+
+https://github.com/mistermantas/cstate/wiki/Customization
+
+-->
diff --git a/layouts/partials/custom/meta.html b/layouts/partials/custom/meta.html
new file mode 100644
index 0000000..1dadab6
--- /dev/null
+++ b/layouts/partials/custom/meta.html
@@ -0,0 +1,8 @@
+<!--
+
+This file can be used to add custom HTML
+to your cState powered status page.
+
+https://github.com/mistermantas/cstate/wiki/Customization
+
+-->
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 085b814..d6b5486 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,3 +1,4 @@
+
<div class="footer">
<div class="contain">
<p><strong>{{ now.Year }} &copy; {{ .Site.Title }}</strong>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index c378998..94bef80 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,3 +1,4 @@
+
{{ if .Site.Params.useLargeHeaderDesign }}
<div class="header header--large">
<div class="contain contain--more center">
diff --git a/layouts/partials/js.html b/layouts/partials/js.html
index d47cd5d..a26d36c 100644
--- a/layouts/partials/js.html
+++ b/layouts/partials/js.html
@@ -18,48 +18,150 @@
} else {
document.querySelector('meta[name=theme-color]').setAttribute('content', themeNoticeColor);
}
+</script>
-
+<!--
+<script>
/**
* Check for internet
*/
- var lastUpdated = document.querySelector('.summary__date');
- var lastUpdate = new Date();
+ function hasClass(element, className) {
+ return (' ' + element.className + ' ').indexOf(' ' + className+ ' ') > -1;
+ }
+
+ if (hasClass(document.querySelector('body'), 'status-homepage')) {
+ var lastUpdated = document.querySelector('.summary__date');
+ var lastUpdate = new Date();
- function timeSince(date) {
- var seconds = Math.floor((new Date() - date) / 1000);
+ function timeSince(date) {
+ var seconds = Math.floor((new Date() - date) / 1000);
- var interval = Math.floor(seconds / 31536000);
+ var interval = Math.floor(seconds / 31536000);
- if (interval > 1) {
- return interval + ' years';
+ if (interval > 1) {
+ return interval + ' years';
+ }
+ interval = Math.floor(seconds / 2592000);
+ if (interval > 1) {
+ return interval + ' months';
+ }
+ interval = Math.floor(seconds / 86400);
+ if (interval > 1) {
+ return interval + 'd';
+ }
+ interval = Math.floor(seconds / 3600);
+ if (interval > 1) {
+ return interval + 'h';
+ }
+ interval = Math.floor(seconds / 60);
+ if (interval > 1) {
+ return interval + ' min';
+ }
+ return Math.floor(seconds) + 's';
}
- interval = Math.floor(seconds / 2592000);
- if (interval > 1) {
- return interval + ' months';
+ var aDay = 24*60*60*1000;
+ }
+
+ function checkCurrentStatus() {
+ // Check for each status
+ if (hasClass(document.querySelector('body'), 'status-ok')) {
+ window.currentState = 'Operational';
}
- interval = Math.floor(seconds / 86400);
- if (interval > 1) {
- return interval + 'd';
+ if (hasClass(document.querySelector('body'), 'status-disrupted')) {
+ window.currentState = 'Disrupted';
}
- interval = Math.floor(seconds / 3600);
- if (interval > 1) {
- return interval + 'h';
+ if (hasClass(document.querySelector('body'), 'status-down')) {
+ window.currentState = 'Down';
}
- interval = Math.floor(seconds / 60);
- if (interval > 1) {
- return interval + 'min';
+ if (hasClass(document.querySelector('body'), 'status-notice')) {
+ window.currentState = 'Maintenance';
}
- return Math.floor(seconds) + 's';
}
- var aDay = 24*60*60*1000;
+ checkCurrentStatus();
+
+ // Set for first time use
+ if (typeof(Storage) !== 'undefined') {
+ window.sessionStorage.setItem('priorState', currentState);
+ }
// Show second by second updates
window.setInterval(function() {
- lastUpdated.innerHTML = 'Last checked ' + timeSince(lastUpdate) + ' ago';
+ if (hasClass(document.querySelector('body'), 'status-homepage')) {
+ lastUpdated.innerHTML = 'Last checked ' + timeSince(lastUpdate) + ' ago';
+ }
+
+ checkCurrentStatus();
+
+ if (typeof(Storage) !== "undefined") {
+ if (window.sessionStorage.getItem('priorState') !== currentState) {
+ displayNotification('Status changed from ' + window.sessionStorage.getItem('priorState') + ' to ' + currentState);
+ }
+
+ window.sessionStorage.setItem('priorState', currentState);
+ } else {
+ console.log('UNSUPPORTED - SMART NOTIFICATIONS');
+ }
}, 1000);
+
+
+ /**
+ * Modern browser shiz
+ */
+
+ if (navigator.serviceWorker) {
+ console.log('Service Worker and Push is supported');
+
+ navigator.serviceWorker.register('sw.js')
+ .then(function(swReg) {
+ console.log('Service Worker is registered', swReg);
+
+ swRegistration = swReg;
+ })
+ .catch(function(error) {
+ console.error('Service Worker Error', error);
+ });
+ } else {
+ console.log('Push messaging is not supported');
+ }
+
+
+ Notification.requestPermission(function(status) {
+ console.log('Notification permission status:', status);
+ });
+
+
+ function displayNotification(title, body) {
+ if (Notification.permission == 'granted') {
+ navigator.serviceWorker.getRegistration().then(function(reg) {
+ var options = {
+ body: body,
+ icon: '/favicon.png',
+ vibrate: [100, 50, 100],
+ data: {
+ dateOfArrival: Date.now(),
+ primaryKey: 1
+ },
+ actions: [
+ {action: 'view', title: 'View incident'},
+ {action: 'close', title: 'Dismiss'},
+ ]
+ };
+ reg.showNotification(title, options);
+ });
+ }
+ }
</script>
-{{ with .Site.Params.customJS }}
-<script type="text/javascript" src="{{ . }}"></script>
+-->
+
+{{ if ne .Site.Params.googleAnalytics "UA-00000000-1" }}
+ <!-- Global site tag (gtag.js) - Google Analytics -->
+ <script type="text/javascript" defer src="https://www.googletagmanager.com/gtag/js?id=UA-109775664-1"></script>
+ <script type="text/javascript" defer>
+ window.dataLayer = window.dataLayer || [];
+ function gtag(){dataLayer.push(arguments);}
+ gtag('js', new Date());
+
+ gtag('config', '{{ .Site.Params.googleAnalytics }}');
+ </script>
{{ end }}
diff --git a/layouts/partials/meta.html b/layouts/partials/meta.html
index 2bef153..7b45778 100644
--- a/layouts/partials/meta.html
+++ b/layouts/partials/meta.html
@@ -132,7 +132,7 @@
}
.summary__date:hover {
- color: #{{ .Site.Params.faded }};
+ color: #ccc;
}
.summary__date:hover:after {
@@ -141,21 +141,47 @@
}
.components {
- border: 2px solid #{{ .Site.Params.border }};
+ border: 2px solid #ddd;
border-bottom: 0;
}
.component {
color: #000;
padding: 16px;
- border-bottom: 2px solid #{{ .Site.Params.border }};
+ border-bottom: 2px solid #ddd;
+ }
+
+ .description { cursor: pointer; position: relative; }
+ .description__text { display: none; }
+ .description:hover .description__text,
+ .description:active .description__text {
+ display: block;
+ position: absolute;
+ top: 0;
+ left: 32px;
+ background: #181818;
+ color: #fff;
+ z-index: 50;
+ padding: 8px;
+ border: 2px solid #242424;
+ font-size: 14px;
+ color: #ccc;
+ width: 1000%;
+ height: auto;
+ }
+
+ @media (max-width: 640px) {
+ .description:hover .description__text,
+ .description:active .description__text {
+ width: 50vw;
+ }
}
.ok { color: #{{ .Site.Params.ok }}; }
.error { color: #{{ .Site.Params.down }}; }
.footer {
- margin-top: 20px;
+ padding: 10px;
background: #f5f5f5;
}
@@ -230,7 +256,7 @@
.status-down .announcement-box { border: 2px solid #{{ .Site.Params.down }}; }
.status-notice .announcement-box { border: 2px solid #{{ .Site.Params.notice }}; }
- .status .announcement-box { border-bottom-width: 1px; }
+ .status-homepage .announcement-box { border-bottom-width: 1px; }
/**
@@ -254,7 +280,5 @@
}
}
</style>
- {{ with .Site.Params.customCSS }}
- <link href="{{ . }}" rel="stylesheet">
- {{ end }}
+
</head>