mirror of
https://github.com/Brandon-Rozek/website-theme.git
synced 2024-12-22 16:42:24 +00:00
Cleaned up JS scripts and added service worker
This commit is contained in:
parent
1f1e07b4bf
commit
5214da544e
7 changed files with 125 additions and 16 deletions
12
assets/js/script.js
Normal file
12
assets/js/script.js
Normal file
|
@ -0,0 +1,12 @@
|
|||
if (navigator && navigator.serviceWorker) {
|
||||
navigator.serviceWorker.register('/serviceworker.js', {
|
||||
scope: '/'
|
||||
});
|
||||
|
||||
window.addEventListener("load", function() {
|
||||
if (navigator.serviceWorker.controller != null) {
|
||||
navigator.serviceWorker.controller.postMessage({"command":"trimCache"});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -22,7 +22,6 @@ hasCJKLanguage = true
|
|||
publicationYear = "2019"
|
||||
# listPageDateFormat = "January, 2006" # See https://gohugo.io/functions/format/
|
||||
# singlePageDateFormat = "January 2, 2006"
|
||||
# custom_css = ["/css/custom.css"]
|
||||
# custom_js = ["/js/custom.js"]
|
||||
|
||||
# Make sure setting a following option for search bar to work
|
||||
|
|
13
layouts/offline.html
Normal file
13
layouts/offline.html
Normal file
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
{{ partial "head.html" . }}
|
||||
<body>
|
||||
{{ partial "header.html" . }}
|
||||
<main>
|
||||
<div class="main">
|
||||
<p><a href="{{ .Site.BaseURL }}">Go Home</a></p>
|
||||
</div>
|
||||
</main>
|
||||
{{ partial "footer.html" . }}
|
||||
</body>
|
||||
</html>
|
|
@ -13,6 +13,7 @@
|
|||
<meta name="supported-color-schemes" content="light dark" />
|
||||
<meta name="author" content="{{ .Site.Params.Author }}" />
|
||||
<meta name="robots" content="index,follow" />
|
||||
<link rel="manifest" href="/manifest.json" />
|
||||
<link rel="shortcut icon" type="image/x-icon" href="{{ .Site.BaseURL }}{{ .Site.Params.favicon }}">
|
||||
|
||||
<!-- Identities -->
|
||||
|
@ -43,11 +44,11 @@
|
|||
{{- $syntaxHighlight := resources.Get "css/syntax-highlight.css" -}}
|
||||
{{ $css := slice $style $markdown $fontawesome $syntaxHighlight | resources.Concat "css/style.css" | resources.Minify | resources.Fingerprint }}
|
||||
<link rel="stylesheet" href="{{ $css.Permalink }}" integrity="{{ $css.Data.Integrity }}">
|
||||
|
||||
{{- $styleDark := resources.Get "css/style-dark.css" -}}
|
||||
{{- $markdownDark := resources.Get "css/markdown-dark.css" -}}
|
||||
{{ $cssDark := slice $styleDark $markdownDark | resources.Concat "css/style-dark.css" | resources.Minify | resources.Fingerprint }}
|
||||
<link rel="stylesheet" href="{{ $cssDark.Permalink }}" media="(prefers-color-scheme: dark)" integrity="{{ $cssDark.Data.Integrity }}">
|
||||
<!-- <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"> -->
|
||||
|
||||
<!-- custom css -->
|
||||
{{- range .Site.Params.custom_css -}}
|
||||
|
@ -60,15 +61,7 @@
|
|||
<!-- {{- template "_internal/twitter_cards.html" . -}} -->
|
||||
{{- partial "twitter_cards.html" . -}}
|
||||
|
||||
<!-- Polyfill for old browsers -->
|
||||
{{ `<!--[if lte IE 9]>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/classlist/1.1.20170427/classList.min.js"></script>
|
||||
<![endif]-->` | safeHTML }}
|
||||
|
||||
{{ `<!--[if lt IE 9]>
|
||||
<script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
|
||||
<![endif]-->` | safeHTML }}
|
||||
<script src="https://polyfill.io/v3/polyfill.js"></script>
|
||||
|
||||
<!-- MathJax -->
|
||||
{{- if or .Params.math .Site.Params.math -}}
|
||||
|
@ -76,4 +69,7 @@
|
|||
{{- end -}}
|
||||
|
||||
{{ partial "citation.html" . }}
|
||||
|
||||
{{- $script := resources.Get "js/script.js" -}}
|
||||
<script src="{{ $script.Permalink }}" async></script>
|
||||
</head>
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
|
||||
<script id="MathJax-script" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML">
|
||||
MathJax.Hub.Config({
|
||||
tex2jax: {
|
||||
|
|
|
@ -10,7 +10,6 @@
|
|||
{{ $mark := resources.Get "js/jquery.mark.es6.min.js" }}
|
||||
{{ $lunr := resources.Get "js/lunr.js" }}
|
||||
{{ $search := resources.Get "js/search.js" }}
|
||||
<script src="{{ $jquery.Permalink }}"></script>
|
||||
<script src="{{ $mark.Permalink }}"></script>
|
||||
<script src="{{ $lunr.Permalink }}"></script>
|
||||
<script src="{{ $search.Permalink }}"></script>
|
||||
{{ $lunrPackage := slice $jquery $mark $lunr | resources.Concat "js/lunrPackage.js" | resources.Minify | resources.Fingerprint }}
|
||||
<script src="{{ $lunrPackage.Permalink }}"></script>
|
||||
<script src="{{ $search.Permalink }}" async></script>
|
||||
|
|
91
static/serviceworker.js
Normal file
91
static/serviceworker.js
Normal file
|
@ -0,0 +1,91 @@
|
|||
let version = 'v1::';
|
||||
let cacheName = 'website';
|
||||
let offlinePage = '/offline';
|
||||
let offlineFundamentals = [offlinePage, '/'];
|
||||
let maxItems = 100;
|
||||
|
||||
self.addEventListener('install', function (event) {
|
||||
// Cache offline fundamentals
|
||||
event.waitUntil(caches.open(version + cacheName).then(function (cache) {
|
||||
return cache.addAll(offlineFundamentals);
|
||||
}));
|
||||
});
|
||||
|
||||
function trimCache(name, maxItems) {
|
||||
caches.open(name).then(function(cache) {
|
||||
cache.keys().then(function(keys) {
|
||||
if (keys.length > maxItems) {
|
||||
cache.delete(keys[0]).then(trimCache(name, maxItems));
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Listens for trimCache command which occurs on page load
|
||||
self.addEventListener('message', event => {
|
||||
if (event.data.command == 'trimCache') {
|
||||
trimCache(version + cacheName, maxItems);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// If the version changes, invalidate the cache
|
||||
self.addEventListener('activate', function (event) {
|
||||
event.waitUntil(
|
||||
caches.keys()
|
||||
.then(function (keys) {
|
||||
// Remove caches whose name is no longer valid
|
||||
return Promise.all(keys
|
||||
.filter(function (key) {
|
||||
return key.indexOf(version) !== 0;
|
||||
})
|
||||
.map(function (key) {
|
||||
return caches.delete(key);
|
||||
})
|
||||
);
|
||||
})
|
||||
);
|
||||
});
|
||||
|
||||
// Listen for request events
|
||||
self.addEventListener('fetch', function (event) {
|
||||
let request = event.request;
|
||||
|
||||
// Always fetch non-GET requests from the network
|
||||
if (request.method !== 'GET') {
|
||||
event.respondWith(
|
||||
fetch(request)
|
||||
.catch(function () {
|
||||
return caches.match(offlinePage);
|
||||
})
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
let isRequestType = function(name) { return request.headers.get('Accept').includes(name); }
|
||||
|
||||
// Network-first Approach
|
||||
event.respondWith(
|
||||
// Attepmt to grab the latest copy from the network
|
||||
fetch(request).then(function (response) {
|
||||
// If successful, create a copy of the response
|
||||
// and save it to the cache
|
||||
let cacheCopy = response.clone();
|
||||
event.waitUntil(caches.open(version + cacheName).then(function (cache) {
|
||||
return cache.put(request, cacheCopy);
|
||||
}));
|
||||
return response;
|
||||
|
||||
}).catch(function (error) {
|
||||
// Otherwise, check the cache.
|
||||
return caches.match(request).then(function (response) {
|
||||
// Show offline page if cache misses for HTML pages.
|
||||
if (isRequestType('text/html')) {
|
||||
return response || caches.match(offlinePage);
|
||||
}
|
||||
return response;
|
||||
|
||||
});
|
||||
})
|
||||
);
|
||||
});
|
Loading…
Reference in a new issue