hopfma
/
om
Watch 4
Star 1
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Update Tab Icon; Organize ServiceWorker

pull/1/head
Erik Römmelt 5 years ago
parent
63e1363dd2
commit
07a2480e19
3 changed files with 109 additions and 110 deletions
Unified View Show Diff Stats
  1. 1
    1
      public/index.html
  2. 9
    9
      public/main.js
  3. 99
    100
      public/serviceWorker.js

+ 1
- 1
public/index.html View File



<!-- NOTE: Icon for tab recognition --> <!-- NOTE: Icon for tab recognition -->
<!-- highest resolution for Chrome & Opera --> <!-- highest resolution for Chrome & Opera -->
<link rel="icon" sizes="192x192" href="/public/img/app_icon.png">
<link rel="icon" sizes="192x192" href="favicon.ico">
<!-- icons for Safari -> iOS Icons --> <!-- icons for Safari -> iOS Icons -->
<!-- icons for IE & Windows phone --> <!-- icons for IE & Windows phone -->
<meta name="msapplication-square70x70logo" content="icon_smalltile.png"> <meta name="msapplication-square70x70logo" content="icon_smalltile.png">

+ 9
- 9
public/main.js View File

* Main JavaScript file - Entry point of all JS files * * Main JavaScript file - Entry point of all JS files *
******************************************************/ ******************************************************/


// NOTE: ServiceWorker Registration
if ('serviceWorker' in navigator) {
window.addEventListener('load', function () {
// Register a service worker hosted at the root of the
// site using the default scope ('/').
// Wait until page loaded
window.addEventListener('load', () => {
if ('serviceWorker' in navigator) {
// NOTE: ServiceWorker Registration
return navigator.serviceWorker.register('serviceWorker.js', { return navigator.serviceWorker.register('serviceWorker.js', {
scope: '/' scope: '/'
}).then(function (registration) { }).then(function (registration) {
}).catch(function (error) { }).catch(function (error) {
return console.log('[Service worker] Registration failed: ', error); return console.log('[Service worker] Registration failed: ', error);
}); });
});
} else {
console.log('[ServiceWorker] are not supported.');
}
} else {
console.log('[ServiceWorker] are not supported.');
return;
}
});


// NOTE: Set Bootstrap materialdesign // NOTE: Set Bootstrap materialdesign
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {

+ 99
- 100
public/serviceWorker.js View File

const staticCacheKey = appPrefix + 'static-v' + version; const staticCacheKey = appPrefix + 'static-v' + version;
const dataCacheKey = appPrefix + 'content-data'; const dataCacheKey = appPrefix + 'content-data';
var allCacheKey = [ var allCacheKey = [
staticCacheKey,
dataCacheKey
staticCacheKey,
dataCacheKey
]; ];


/* ================================== */ /* ================================== */
// Install new service worker even when old version still in use. // Install new service worker even when old version still in use.
// Install happens only once a lifetime of a service worker. // Install happens only once a lifetime of a service worker.
const cacheResources = async () => { const cacheResources = async () => {
const staticFilesToCache = [
'./',
'favicon.ico',
'index.html',
'main.js',
'manifest.json',
'font/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2',
'font/KFOlCnqEu92Fr1MmEU9fBBc4.woff2',
'font/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2',
'font/KFOlCnqEu92Fr1MmSU5fBBc4.woff2',
'font/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2',
'font/KFOlCnqEu92Fr1MmWUlfBBc4.woff2',
'font/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2',
'font/KFOmCnqEu92Fr1Mu4mxK.woff2',
'font/KFOmCnqEu92Fr1Mu7GxKOzY.woff2',
'img/launcher/launcher_app_icon_152.png',
'img/launcher/launcher_app_icon_167.png',
'img/launcher/launcher_app_icon_180.png',
'img/launcher/launcher_app_icon_192.png',
'img/launcher/launcher_app_icon_512.png',
'img/app_icon.png',
'img/launcher_app_icon.png',
'img/profil_icon.png',
'lib/bootstrap-font-and-icons.css',
'lib/bootstrap-material-design.js',
'lib/bootstrap-material-design.min.css',
'lib/jquery-3.3.1.min.js',
'lib/popper-1.12.6.js',
'lib/vue-router.js',
'lib/vue.js',
'routes/bookmark.js',
'routes/createMessage.js',
'routes/files.js',
'routes/home.js',
'routes/messageData.js',
'routes/msgCard.js',
'routes/profil.js',
'routes/profilCard.js',
'routes/profilData.js',
'style/style.css',
];
const dataFilesToCache = [];
const staticFilesToCache = [
'./',
'favicon.ico',
'index.html',
'main.js',
'manifest.json',
'font/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2',
'font/KFOlCnqEu92Fr1MmEU9fBBc4.woff2',
'font/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2',
'font/KFOlCnqEu92Fr1MmSU5fBBc4.woff2',
'font/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2',
'font/KFOlCnqEu92Fr1MmWUlfBBc4.woff2',
'font/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2',
'font/KFOmCnqEu92Fr1Mu4mxK.woff2',
'font/KFOmCnqEu92Fr1Mu7GxKOzY.woff2',
'img/launcher/launcher_app_icon_152.png',
'img/launcher/launcher_app_icon_167.png',
'img/launcher/launcher_app_icon_180.png',
'img/launcher/launcher_app_icon_192.png',
'img/launcher/launcher_app_icon_512.png',
'img/app_icon.png',
'img/launcher_app_icon.png',
'img/profil_icon.png',
'lib/bootstrap-font-and-icons.css',
'lib/bootstrap-material-design.js',
'lib/bootstrap-material-design.min.css',
'lib/jquery-3.3.1.min.js',
'lib/popper-1.12.6.js',
'lib/vue-router.js',
'lib/vue.js',
'routes/bookmark.js',
'routes/createMessage.js',
'routes/files.js',
'routes/home.js',
'routes/messageData.js',
'routes/msgCard.js',
'routes/profil.js',
'routes/profilCard.js',
'routes/profilData.js',
'style/style.css',
];
const dataFilesToCache = [];


const cacheStatic = await caches.open(staticCacheKey);
cacheStatic.addAll(staticFilesToCache);
console.log('[ServiceWorker] Cache static files.');
const cacheStatic = await caches.open(staticCacheKey);
cacheStatic.addAll(staticFilesToCache);
console.log('[ServiceWorker] Cache static files.');


const cacheData = await caches.open(dataCacheKey);
cacheData.addAll(dataFilesToCache);
console.log('[ServiceWorker] Cache data files.');
return;
const cacheData = await caches.open(dataCacheKey);
cacheData.addAll(dataFilesToCache);
console.log('[ServiceWorker] Cache data files.');
return;
} }
self.addEventListener('install', event => { self.addEventListener('install', event => {
// don't wait
self.skipWaiting();
// cache static files
event.waitUntil(cacheResources())
console.log('[ServiceWorker] Install');
// don't wait
self.skipWaiting();
// cache static files
event.waitUntil(cacheResources())
console.log('[ServiceWorker] Install');
}); });


/* ================================================================ */ /* ================================================================ */
/* ================================================================ */ /* ================================================================ */
// No fetch or pull is called before succesfull activate event. // No fetch or pull is called before succesfull activate event.
const cacheCleanUp = async () => { const cacheCleanUp = async () => {
const cacheKeyList = await caches.keys();
const cacheKeyList = await caches.keys();
const deletions = cacheKeyList const deletions = cacheKeyList
.filter(key => key.startsWith(appPrefix) && !allCacheKey.includes(key)) .filter(key => key.startsWith(appPrefix) && !allCacheKey.includes(key))
.map(key => {
caches.delete(key)
console.log('[ServiceWorker] Removing old cache', key);
});
.map(key => {
caches.delete(key)
console.log('[ServiceWorker] Removing old cache', key);
});
for (const success of deletions) { for (const success of deletions) {
await success;
await success;
} }
return;
return;
} }
self.addEventListener('activate', event => { self.addEventListener('activate', event => {
event.waitUntil(cacheCleanUp());
clients.claim();
console.log('[ServiceWorker] Activate');
event.waitUntil(cacheCleanUp());
clients.claim();
console.log('[ServiceWorker] Activate');
}); });


/* ========================================= */ /* ========================================= */
/* NOTE: Fetch: Update logic for cache files */ /* NOTE: Fetch: Update logic for cache files */
/* ========================================= */ /* ========================================= */

self.addEventListener('fetch', event => { self.addEventListener('fetch', event => {
// Provide HTTPS URL for query data.
const dataUrl = 'https://me.efi.th-nuernberg.de/om/';
// Parse the URL:
const requestURL = new URL(event.request.url);
// Provide HTTPS URL for query data.
const dataUrl = 'https://me.efi.th-nuernberg.de/om/';
// Parse the URL:
const requestURL = new URL(event.request.url);




// Start the network request as soon as possible.
//const networkPromise = fetch('/data.json');
// Start the network request as soon as possible.
//const networkPromise = fetch('/data.json');


event.respondWith(
caches.match(event.request)
.then(cachedResponse => {
if (cachedResponse) {
return cachedResponse;
}
console.log('[ServiceWorker] Fetch', requestURL.href);
return fetch(event.request).then(response => {
// Check if we received a valid response
// - Ensure the response is valid.
// - Check the status is 200 on the response.
// - Make sure the response type is basic, which indicates that it's a request from our origin.
// This means that requests to third party assets aren't cached as well.
if (!response || response.status !== 200 || response.type !== 'basic') {
return response;
}
event.respondWith(
caches.match(event.request)
.then(cachedResponse => {
if (cachedResponse) {
return cachedResponse;
}
console.log('[ServiceWorker] Fetch', requestURL.href);
return fetch(event.request).then(response => {
// Check if we received a valid response
// - Ensure the response is valid.
// - Check the status is 200 on the response.
// - Make sure the response type is basic, which indicates that it's a request from our origin.
// This means that requests to third party assets aren't cached as well.
if (!response || response.status !== 200 || response.type !== 'basic') {
return response;
}


// We have to clone the response here because request bodies
// can only be read once. Placing a response in the cache
// counts as a read and so does the `res.json` call below.
var responseToCache = response.clone();
// We have to clone the response here because request bodies
// can only be read once. Placing a response in the cache
// counts as a read and so does the `res.json` call below.
var responseToCache = response.clone();


caches.open(staticCacheKey).then(cache => {
cache.put(event.request, responseToCache);
});
caches.open(staticCacheKey).then(cache => {
cache.put(event.request, responseToCache);
});


return response;
});
})
);
return response;
});
})
);
}); });

Write Preview
Loading…
Cancel
Save