plugin for PWA
This commit is contained in:
sakrecoer
parent
ec5f87cbeb
commit
a120fc8181
1
Gemfile
1
Gemfile
|
|
@ -5,4 +5,5 @@ gem 'jekyll', '4.0.0'
|
||||||
group :jekyll_plugins do
|
group :jekyll_plugins do
|
||||||
gem 'jekyll-sitemap', '1.4.0'
|
gem 'jekyll-sitemap', '1.4.0'
|
||||||
gem 'jekyll-last-modified-at','1.1.0'
|
gem 'jekyll-last-modified-at','1.1.0'
|
||||||
|
gem 'jekyll-pwa-plugin'
|
||||||
end
|
end
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@ GEM
|
||||||
ffi (1.13.1)
|
ffi (1.13.1)
|
||||||
forwardable-extended (2.6.0)
|
forwardable-extended (2.6.0)
|
||||||
http_parser.rb (0.6.0)
|
http_parser.rb (0.6.0)
|
||||||
i18n (1.8.4)
|
i18n (1.8.5)
|
||||||
concurrent-ruby (~> 1.0)
|
concurrent-ruby (~> 1.0)
|
||||||
jekyll (4.0.0)
|
jekyll (4.0.0)
|
||||||
addressable (~> 2.4)
|
addressable (~> 2.4)
|
||||||
|
|
@ -32,6 +32,7 @@ GEM
|
||||||
jekyll-last-modified-at (1.1.0)
|
jekyll-last-modified-at (1.1.0)
|
||||||
jekyll (>= 3.7, < 5.0)
|
jekyll (>= 3.7, < 5.0)
|
||||||
posix-spawn (~> 0.3.9)
|
posix-spawn (~> 0.3.9)
|
||||||
|
jekyll-pwa-plugin (2.2.3)
|
||||||
jekyll-sass-converter (2.1.0)
|
jekyll-sass-converter (2.1.0)
|
||||||
sassc (> 2.0.1, < 3.0)
|
sassc (> 2.0.1, < 3.0)
|
||||||
jekyll-sitemap (1.4.0)
|
jekyll-sitemap (1.4.0)
|
||||||
|
|
@ -69,6 +70,7 @@ PLATFORMS
|
||||||
DEPENDENCIES
|
DEPENDENCIES
|
||||||
jekyll (= 4.0.0)
|
jekyll (= 4.0.0)
|
||||||
jekyll-last-modified-at (= 1.1.0)
|
jekyll-last-modified-at (= 1.1.0)
|
||||||
|
jekyll-pwa-plugin
|
||||||
jekyll-sitemap (= 1.4.0)
|
jekyll-sitemap (= 1.4.0)
|
||||||
|
|
||||||
BUNDLED WITH
|
BUNDLED WITH
|
||||||
|
|
|
||||||
18
_config.yml
18
_config.yml
|
|
@ -142,3 +142,21 @@ accent1: '#38ff59'
|
||||||
accent1-alt: 'rgba(56, 255, 89, 0.75)'
|
accent1-alt: 'rgba(56, 255, 89, 0.75)'
|
||||||
accent2: '#8d3ed8'
|
accent2: '#8d3ed8'
|
||||||
accent2-alt: 'rgba(141, 62, 216, 0.75)'
|
accent2-alt: 'rgba(141, 62, 216, 0.75)'
|
||||||
|
|
||||||
|
plugins:
|
||||||
|
- jekyll-pwa-plugin
|
||||||
|
|
||||||
|
pwa:
|
||||||
|
enabled: false # Optional
|
||||||
|
sw_src_filepath: service-worker.js # Optional
|
||||||
|
sw_dest_filename: service-worker.js # Optional
|
||||||
|
dest_js_directory: assets/js # Required
|
||||||
|
precache_recent_posts_num: 5 # Optional
|
||||||
|
precache_glob_directory: / # Optional
|
||||||
|
precache_glob_patterns: # Optional
|
||||||
|
- "{js,css,fonts,albums}/**/*.{js,css,eot,svg,ttf,woff}"
|
||||||
|
- "*.{mp3,jpeg,mp4,webm}"
|
||||||
|
- index.html
|
||||||
|
precache_glob_ignores: # Optional
|
||||||
|
- sw-register.js
|
||||||
|
- "fonts/**/*"
|
||||||
|
|
@ -16,46 +16,9 @@
|
||||||
<link rel="icon" type="image/png" href="{{ site.url }}/touch-icon.png" sizes="192x192">
|
<link rel="icon" type="image/png" href="{{ site.url }}/touch-icon.png" sizes="192x192">
|
||||||
<link rel="shortcut icon" href="{{ site.url }}{{ site.icon }}" type="image/png" />
|
<link rel="shortcut icon" href="{{ site.url }}{{ site.icon }}" type="image/png" />
|
||||||
<noscript><link rel="stylesheet" href="{{ relBase }}/assets/css/noscripts-20200805.css" /></noscript>
|
<noscript><link rel="stylesheet" href="{{ relBase }}/assets/css/noscripts-20200805.css" /></noscript>
|
||||||
<link rel="manifest" href="manifest.json" />
|
<link rel="manifest" href="{{ site.url }}/manifest.json" />
|
||||||
<meta name="theme-color" content="{{ site.bg }}"/>
|
<meta name="theme-color" content="{{ site.bg }}"/>
|
||||||
<script type="text/javascript">
|
|
||||||
// Registration of service worker
|
|
||||||
if ('serviceWorker' in navigator) {
|
|
||||||
window.addEventListener('load', function() {
|
|
||||||
navigator.serviceWorker.register("/service-worker.js").then(function(registration) {
|
|
||||||
// Registration was successful
|
|
||||||
console.log('ServiceWorker registration successful with scope: ', registration.scope);
|
|
||||||
}, function(err) {
|
|
||||||
// registration failed :(
|
|
||||||
console.log('ServiceWorker registration failed: ', err);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
console.log('Service Workers not supported');
|
|
||||||
}
|
|
||||||
|
|
||||||
// Installation of service worker
|
|
||||||
self.addEventListener('install', function(event) {
|
|
||||||
// Perform install steps
|
|
||||||
event.waitUntil(
|
|
||||||
caches.open(CACHE_NAME)
|
|
||||||
.then(function(cache) {
|
|
||||||
return cache.addAll(urlsToCache);
|
|
||||||
})
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
self.addEventListener('fetch', event => {
|
|
||||||
event.respondWith(
|
|
||||||
caches.match(event.request, {ignoreSearch:true}).then(response => {
|
|
||||||
return response || fetch(event.request);
|
|
||||||
})
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
|
||||||
|
|
@ -1,36 +1,41 @@
|
||||||
---
|
// service-worker.js
|
||||||
layout: nil
|
|
||||||
---
|
|
||||||
var urlsToCache = [];
|
|
||||||
|
|
||||||
var CACHE_NAME = 'Setto-cache-v1';
|
// set names for both precache & runtime cache
|
||||||
|
workbox.core.setCacheNameDetails({
|
||||||
|
prefix: 'SettoPWA',
|
||||||
|
suffix: 'v1',
|
||||||
|
precache: 'precache',
|
||||||
|
runtime: 'runtime-cache'
|
||||||
|
});
|
||||||
|
|
||||||
// Cache posts
|
// let Service Worker take control of pages ASAP
|
||||||
// Limits the number of posts that gets cached to 3
|
workbox.skipWaiting();
|
||||||
// Reads a piece of front-matter in each post that directs the second loop to the folder where the assets are held
|
workbox.clientsClaim();
|
||||||
{% for post in site.posts %}
|
|
||||||
urlsToCache.push("{{ post.url }}index.html")
|
|
||||||
{% endfor %}
|
|
||||||
|
|
||||||
// Cache pages
|
// let Workbox handle our precache list
|
||||||
// Do nothing if it's either an AMP page (as these are served via Googles cache) or the blog page
|
workbox.precaching.precacheAndRoute(self.__precacheManifest);
|
||||||
// Fallback to the offline pages for these
|
|
||||||
{% for page in site.html_pages %}{% unless page.sitemap == false %}
|
|
||||||
urlsToCache.push("{{ page.url }}index.html")
|
|
||||||
{% endunless %}{% endfor %}
|
|
||||||
|
|
||||||
// Cache assets
|
// use `networkFirst` strategy for `*.html`, like all my posts
|
||||||
// Removed assets/posts because I only want assets from the most recent posts getting cached
|
workbox.routing.registerRoute(
|
||||||
{% for file in site.static_files %}{% unless file.path contains 'albums' %}
|
/\.html$/,
|
||||||
urlsToCache.push("{{ file.path }}")
|
workbox.strategies.networkFirst()
|
||||||
{% endunless %}{% endfor %}
|
);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Cache mp3 and cover art
|
|
||||||
{% for track in site.tracks %}
|
|
||||||
urlsToCache.push("{{ track.url }}")
|
|
||||||
urlsToCache.push("{{ site.mediaurl }}/{{ track.slug }}.mp3")
|
|
||||||
urlsToCache.push("{{ site.mediaurl }}/{{ track.slug }}.jpeg")
|
|
||||||
{% endfor %}
|
|
||||||
|
|
||||||
|
// use `cacheFirst` strategy for images
|
||||||
|
workbox.routing.registerRoute(
|
||||||
|
/assets\/(img|icons|css)/,
|
||||||
|
workbox.strategies.cacheFirst()
|
||||||
|
);
|
||||||
|
workbox.routing.registerRoute(
|
||||||
|
/videos/,
|
||||||
|
workbox.strategies.cacheFirst()
|
||||||
|
);
|
||||||
|
workbox.routing.registerRoute(
|
||||||
|
/images\/(posts|pages)/,
|
||||||
|
workbox.strategies.cacheFirst()
|
||||||
|
);
|
||||||
|
// third party files
|
||||||
|
workbox.routing.registerRoute(
|
||||||
|
/^https?:\/\/media.basspistol.com/,
|
||||||
|
workbox.strategies.staleWhileRevalidate()
|
||||||
|
);
|
||||||
Loading…
Reference in a new issue