From d8e45694bd1413a7ef3ecedc7eacb947a7eefb5d Mon Sep 17 00:00:00 2001 From: Cotes Chung <11371340+cotes2020@users.noreply.github.com> Date: Sun, 10 May 2020 00:28:18 +0800 Subject: [PATCH] New feature: PWA --- _includes/head.html | 3 + _includes/panel.html | 22 +++--- _includes/trending-tags.html | 20 +++--- _includes/update_list.html | 21 ++++++ app.js | 12 ++++ assets/data/cache-list.js | 112 ++++++++++++++++++++++++++++++ assets/data/pv-data.json | 1 - assets/data/search.json | 1 - assets/img/favicons/manifest.json | 91 +++++++++++++----------- sw.js | 49 +++++++++++++ 10 files changed, 266 insertions(+), 66 deletions(-) create mode 100644 _includes/update_list.html create mode 100644 app.js create mode 100644 assets/data/cache-list.js create mode 100644 sw.js diff --git a/_includes/head.html b/_includes/head.html index aff9e1f..7866b53 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -144,4 +144,7 @@ + + + \ No newline at end of file diff --git a/_includes/panel.html b/_includes/panel.html index 6e4e85f..e8502dd 100644 --- a/_includes/panel.html +++ b/_includes/panel.html @@ -11,20 +11,10 @@
{% if site.data.updates %} - {% assign MAX_SIZE = 5 %} - {% assign sum = 0 %} - {% assign sort_list = "" | split: "" %} - {% for entry in site.data.updates %} - {% capture elem %} - {{- entry.lastmod -}}::{{- entry.filename -}} - {% endcapture %} - {% assign sort_list = sort_list | push: elem %} - {% endfor %} + {% include update_list.html %} - {% assign sort_list = sort_list | sort | reverse %} - - {% if sort_list.size > 0 %} + {% if update_list.size > 0 %}

@@ -32,7 +22,7 @@

    - {% for item in sort_list %} + {% for item in update_list %} {% assign post_url = item | split: "::" | last | prepend: "/posts/" | append: "/" %} {% assign post = site.posts | where: "url", post_url | first %} @@ -60,7 +50,11 @@ {{- site.data.label.panel.trending_tags -}}
    - {% include trending-tags.html %} + {% include trending-tags.html %} + {% for tag in trending_tags %} + {% capture url %}/tags/{{ tag | downcase | url_encode }}/{% endcapture %} + {{ tag | replace: '-', ' ' }} + {% endfor %}
diff --git a/_includes/trending-tags.html b/_includes/trending-tags.html index 5983ec9..2d9c971 100644 --- a/_includes/trending-tags.html +++ b/_includes/trending-tags.html @@ -1,27 +1,31 @@ - +{% endcomment %} {% assign MAX = 10 %} {% capture tags_array %} {% for tag in site.tags %} - {{ tag[1] | size }}:{{ tag[0] | replace: ' ', '-' }} + {{ tag[1] | size }}::{{ tag[0] | replace: ' ', '-' }} {% endfor %} {% endcapture %} -{% assign trends = tags_array | split: " " | sort | reverse %} +{% assign all_tags = tags_array | split: " " | sort | reverse %} {% assign count = 0 %} -{% for trend in trends %} +{% assign trending_tags = "" | split: "" %} + +{% for iter in all_tags %} {% assign count = count | plus: 1 %} - {% assign tag = trend | split: ":" | last %} - {{ tag | replace: '-', ' ' }} + {% assign tag = iter | split: "::" | last %} + + {% assign trending_tags = trending_tags | push: tag %} + {% if count >= MAX %} {% break %} {% endif %} -{% endfor %} \ No newline at end of file +{% endfor %} diff --git a/_includes/update_list.html b/_includes/update_list.html new file mode 100644 index 0000000..9500286 --- /dev/null +++ b/_includes/update_list.html @@ -0,0 +1,21 @@ +{% comment %} + Get the last 5 post from lastmod list. + v2.2 + https://github.com/cotes2020/jekyll-theme-chirpy + © 2020 Cotes Chung + MIT License +{% endcomment %} + +{% assign MAX_SIZE = 5 %} +{% assign sum = 0 %} +{% assign update_list = "" | split: "" %} + +{% for entry in site.data.updates %} + {% capture elem %} + {{- entry.lastmod -}}::{{- entry.filename -}} + {% endcapture %} + + {% assign update_list = update_list | push: elem %} +{% endfor %} + +{% assign update_list = update_list | sort | reverse %} diff --git a/app.js b/app.js new file mode 100644 index 0000000..9b80e00 --- /dev/null +++ b/app.js @@ -0,0 +1,12 @@ +--- +layout: compress +# Chirpy v2.2 +# https://github.com/cotes2020/jekyll-theme-chirpy +# © 2020 Cotes Chung +# MIT Licensed +--- + +/* Registering Service Worker */ +if('serviceWorker' in navigator) { + navigator.serviceWorker.register('{{ "/sw.js" | relative_url }}'); +}; \ No newline at end of file diff --git a/assets/data/cache-list.js b/assets/data/cache-list.js new file mode 100644 index 0000000..d06aaba --- /dev/null +++ b/assets/data/cache-list.js @@ -0,0 +1,112 @@ +--- +# The list to be cached by PWA +# Chirpy v2.2 +# https://github.com/cotes2020/jekyll-theme-chirpy +# © 2020 Cotes Chung +# MIT Licensed +--- + +var cacheList = [ + + /*--- CSS ---*/ + + '{{ "/assets/css/home.css" | relative_url }}', + '{{ "/assets/css/categories.css" | relative_url }}', + '{{ "/assets/css/tags.css" | relative_url }}', + '{{ "/assets/css/archives.css" | relative_url }}', + '{{ "/assets/css/page.css" | relative_url }}', + '{{ "/assets/css/post.css" | relative_url }}', + '{{ "/assets/css/category-tag.css" | relative_url }}', + '{{ "/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.css" | relative_url }}', + + /*--- Javascripts ---*/ + + '{{ "/assets/js/dist/commons.js" | relative_url }}', + '{{ "/assets/js/dist/timeago.min.js" | relative_url }}', + '{{ "/assets/js/dist/category-collapse.min.js" | relative_url }}', + '{{ "/assets/js/dist/toc.min.js" | relative_url }}', + '{{ "/assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.js" | relative_url }}', + + /*--- HTML ---*/ + + /* Tabs */ + {% for tab in site.data.tabs %} + {% capture item %} + {%- unless tab.name == 'Home' -%} + /tabs/{{ tab.name | downcase }} + {%- endunless -%} + {{- "/" -}} + {% endcapture %} + '{{ item | relative_url }}', + {% endfor %} + + /* The posts of first Home page and recent update list */ + {% assign post_list = "" | split: "" %} + {% assign sum = 0 %} + + {% for post in site.posts %} + {% assign post_list = post_list | push: post.url %} + {% assign sum = sum | plus: 1 %} + {% if sum >= site.paginate %} + {% break %} + {% endif %} + {% endfor %} + + {% include update_list.html %} + {% for item in update_list %} + {% assign url = item | split: "::" | last | prepend: "/posts/" | append: "/" %} + {% assign post_list = post_list | push: url %} + {% endfor %} + + {% assign post_list = post_list | uniq %} + + {% for url in post_list %} + '{{ url }}', + {% endfor %} + + /* Trending tags */ + {% include trending-tags.html %} + {% for tag in trending_tags %} + {% capture tag_url %}/tags/{{ tag | downcase | url_encode }}/{% endcapture %} + '{{ tag_url | relative_url }}', + {% endfor %} + + /*--- Icons ---*/ + + {%- capture icon_url -%} + {{ "/assets/img/favicons" | relative_url }} + {%- endcapture -%} + '{{ icon_url }}/favicon.ico', + '{{ icon_url }}/apple-icon.png', + '{{ icon_url }}/apple-icon-precomposed.png', + '{{ icon_url }}/apple-icon-57x57.png', + '{{ icon_url }}/apple-icon-60x60.png', + '{{ icon_url }}/apple-icon-72x72.png', + '{{ icon_url }}/apple-icon-76x76.png', + '{{ icon_url }}/apple-icon-114x114.png', + '{{ icon_url }}/apple-icon-120x120.png', + '{{ icon_url }}/apple-icon-144x144.png', + '{{ icon_url }}/apple-icon-152x152.png', + '{{ icon_url }}/apple-icon-180x180.png', + '{{ icon_url }}/android-icon-192x192.png', + '{{ icon_url }}/favicon-32x32.png', + '{{ icon_url }}/favicon-96x96.png', + '{{ icon_url }}/favicon-16x16.png', + '{{ icon_url }}/ms-icon-144x144.png', + '{{ icon_url }}/manifest.json', + '{{ icon_url }}/browserconfig.xml', + + /*--- Others ---*/ + + {% if site.google_analytics.pv.enabled %} + '{{ "/assets/data/pv-data.json" | relative_url }}', + '{{ "/assets/lib/countUp.min.js" | relative_url }}', + '{{ "/assets/js/dist/pageviews.min.js" | relative_url }}', + {% endif %} + + '{{ "/assets/data/search.json" | relative_url }}', + '{{ "/404.html" | relative_url }}', + + '{{ "/app.js" | relative_url }}', + '{{ "/sw.js" | relative_url }}' +]; diff --git a/assets/data/pv-data.json b/assets/data/pv-data.json index 13bc2dd..24265e8 100644 --- a/assets/data/pv-data.json +++ b/assets/data/pv-data.json @@ -1,5 +1,4 @@ --- -layout: compress --- const proxyData = '{"url": "{{ site.google_analytics.pv.proxy_endpoint }}"}'; diff --git a/assets/data/search.json b/assets/data/search.json index 93ef912..f2c49b6 100644 --- a/assets/data/search.json +++ b/assets/data/search.json @@ -1,5 +1,4 @@ --- -layout: compress --- [ diff --git a/assets/img/favicons/manifest.json b/assets/img/favicons/manifest.json index bfb3286..7041fb2 100644 --- a/assets/img/favicons/manifest.json +++ b/assets/img/favicons/manifest.json @@ -1,51 +1,58 @@ --- layout: compress - +# # A part of the Favicons -# v2.0 +# Chirpy v2.0 # https://github.com/cotes2020/jekyll-theme-chirpy # © 2019 Cotes Chung # MIT License --- +{% assign icon_url = "/assets/img/favicons/" | relative_url %} + { - "name": "App", - "icons": [ - { - "src": "{{ site.baseurl }}\/assets\/img\/favicons\/android-icon-36x36.png", - "sizes": "36x36", - "type": "image\/png", - "density": "0.75" - }, - { - "src": "{{ site.baseurl }}\/assets\/img\/favicons\/android-icon-48x48.png", - "sizes": "48x48", - "type": "image\/png", - "density": "1.0" - }, - { - "src": "{{ site.baseurl }}\/assets\/img\/favicons\/android-icon-72x72.png", - "sizes": "72x72", - "type": "image\/png", - "density": "1.5" - }, - { - "src": "{{ site.baseurl }}\/assets\/img\/favicons\/android-icon-96x96.png", - "sizes": "96x96", - "type": "image\/png", - "density": "2.0" - }, - { - "src": "{{ site.baseurl }}\/assets\/img\/favicons\/android-icon-144x144.png", - "sizes": "144x144", - "type": "image\/png", - "density": "3.0" - }, - { - "src": "{{ site.baseurl }}\/assets\/img\/favicons\/android-icon-192x192.png", - "sizes": "192x192", - "type": "image\/png", - "density": "4.0" - } - ] -} \ No newline at end of file + "name": "{{ site.title }}", + "short_name": "{{ site.title }}", + "description": "{{ site.description }}", + "icons": [ + { + "src": "{{ icon_url }}/android-icon-36x36.png", + "sizes": "36x36", + "type": "image/png", + "density": "0.75" + }, + { + "src": "{{ icon_url }}/android-icon-48x48.png", + "sizes": "48x48", + "type": "image/png", + "density": "1.0" + }, + { + "src": "{{ icon_url }}/android-icon-72x72.png", + "sizes": "72x72", + "type": "image/png", + "density": "1.5" + }, + { + "src": "{{ icon_url }}/android-icon-96x96.png", + "sizes": "96x96", + "type": "image/png", + "density": "2.0" + }, + { + "src": "{{ icon_url }}/android-icon-144x144.png", + "sizes": "144x144", + "type": "image/png", + "density": "3.0" + }, + { + "src": "{{ icon_url }}/android-icon-192x192.png", + "sizes": "192x192", + "type": "image/png", + "density": "4.0" + }], + "start_url": "{{ '/index.html' | relative_url }}", + "display": "fullscreen", + "theme_color": "#2a1e6b", + "background_color": "white" +} diff --git a/sw.js b/sw.js new file mode 100644 index 0000000..1ed7577 --- /dev/null +++ b/sw.js @@ -0,0 +1,49 @@ +--- +layout: compress +# Chirpy v2.2 +# https://github.com/cotes2020/jekyll-theme-chirpy +# © 2020 Cotes Chung +# MIT Licensed +--- + +self.importScripts('{{ "/assets/data/cache-list.js" | relative_url }}'); + +var cacheName = 'chirpy-{{ "now" | date: "%Y%m%d.%H%M" }}'; + +self.addEventListener('install', (e) => { + self.skipWaiting(); + e.waitUntil( + caches.open(cacheName).then((cache) => { + return cache.addAll(cacheList); + }) + ); +}); + + +self.addEventListener('fetch', (e) => { + e.respondWith( + caches.match(e.request).then((r) => { + /* console.log('[Service Worker] Fetching resource: ' + e.request.url); */ + return r || fetch(e.request).then((response) => { + return caches.open(cacheName).then((cache) => { + /* console.log('[Service Worker] Caching new resource: ' + e.request.url); */ + cache.put(e.request, response.clone()); + return response; + }); + }); + }) + ); +}); + + +self.addEventListener('activate', (e) => { + e.waitUntil( + caches.keys().then((keyList) => { + return Promise.all(keyList.map((key) => { + if(key !== cacheName) { + return caches.delete(key); + } + })); + }) + ); +});