Browse Source

Add manifest.json; add some meta for iOS to index.html; add iOS icons for testing

pull/1/head
Erik Römmelt 5 years ago
parent
commit
9b8fe37cc6

BIN
public/img/ios-icon/th_ohmicon_152x152.png View File


BIN
public/img/ios-icon/th_ohmicon_167x167.png View File


BIN
public/img/ios-icon/th_ohmicon_180x180.png View File


BIN
public/img/ios-icon/th_ohmicon_192x192.png View File


+ 24
- 5
public/index.html View File

<meta name="keywords" content=""> <meta name="keywords" content="">
<meta name="author" content=""> <meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <meta http-equiv="refresh" content="30"> --

<!-- <meta http-equiv="refresh" content="30"> -->

<!-- NOTE: iOS - Add to Homescreen -->
<!-- Icon: No transparency allowed -->
<link rel="apple-touch-icon" href="img/ios-icon/th_ohmicon_192x192.png"> <!-- iphone -->
<link rel="apple-touch-icon" sizes="152x152" href="img/ios-icon/th_ohmicon_152x152.png"><!-- ipad -->
<link rel="apple-touch-icon" sizes="180x180" href="img/ios-icon/th_ohmicon_180x180.png"><!-- iphone-retina -->
<link rel="apple-touch-icon" sizes="167x167" href="img/ios-icon/th_ohmicon_167x167.png"><!-- ipad-retina -->
<!-- Splash screen: If not set, will be white screen -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<link rel="apple-touch-startup-image" sizes="2048x2732" href="/ios-splash/apple_splash_2048.png" /><!-- Tablet -->
<link rel="apple-touch-startup-image" sizes="1668x2224"href="/ios-splash/apple_splash_1668.png" /><!-- Tablet -->
<link rel="apple-touch-startup-image" sizes="1536x2048" href="/ios-splash/apple_splash_1536.png" /><!-- Tablet -->
<link rel="apple-touch-startup-image" sizes="1125x2436" href="/ios-splash/apple_splash_1125.png" /><!-- Tablet ? Phone -->
<link rel="apple-touch-startup-image" sizes="1242x2208" href="/ios-splash/apple_splash_1242.png" /><!-- Tablet ? Phone -->
<link rel="apple-touch-startup-image" sizes="750x1334" href="/ios-splash/apple_splash_750.png" /><!-- Phone -->
<link rel="apple-touch-startup-image" sizes="640x1136" href="/ios-splash/apple_splash_640.png" /><!-- Phone -->

<!-- NOTE: CSS -->
<!-- CSS_Material Design for Bootstrap fonts and icons --> <!-- CSS_Material Design for Bootstrap fonts and icons -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons"> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons">

<!-- CSS_Material Design for Bootstrap minified CSS --> <!-- CSS_Material Design for Bootstrap minified CSS -->
<link rel="stylesheet" href="https://unpkg.com/bootstrap-material-design@4.1.1/dist/css/bootstrap-material-design.min.css" integrity="sha384-wXznGJNEXNG1NFsbm0ugrLFMQPWswR3lds2VeinahP8N0zJw9VWSopbjv2x7WCvX" crossorigin="anonymous"> <link rel="stylesheet" href="https://unpkg.com/bootstrap-material-design@4.1.1/dist/css/bootstrap-material-design.min.css" integrity="sha384-wXznGJNEXNG1NFsbm0ugrLFMQPWswR3lds2VeinahP8N0zJw9VWSopbjv2x7WCvX" crossorigin="anonymous">
<!-- CSS_Custom Design -->
<link rel="stylesheet" type="text/css" href="style/style.css">

<!-- NOTE: Call manifest.json -->
<link rel="manifest" href="manifest.json">


<!-- NOTE: VUE.js und VueRouter --> <!-- NOTE: VUE.js und VueRouter -->
<script src=lib/jquery-3.3.1.min.js></script> <script src=lib/jquery-3.3.1.min.js></script>
<script src=lib/vue.js></script> <script src=lib/vue.js></script>
<script src=lib/vue-router.js></script> <script src=lib/vue-router.js></script>


<!-- CSS_Custom Design -->
<link rel="stylesheet" type="text/css" href="style/style.css">
<!-- NOTE: Call Vue Components --> <!-- NOTE: Call Vue Components -->
<script src="home.js"></script> <script src="home.js"></script>
<!-- <script src="files.js"></script> --> <!-- <script src="files.js"></script> -->

+ 15
- 0
public/manifest.json View File

{
"short_name": "OMapp",
"name": "OMapp",
"icons": [
{
"src":"img/th_nbg_ohmicon_amp.png",
"sizes": "200x200",
"type": "image/png"
}
],
"start_url": "/?utm_source=homescreen",
"background_color": "#FFF",
"theme_color": "#0046a0",
"display": "standalone"
}

+ 26
- 24
public/serviceWorker.js View File

'/message.html', '/message.html',
'/bookmark.js', '/bookmark.js',
'/createMessage.js', '/createMessage.js',
'/files',
'/files.js',
'/home.js', '/home.js',
'/main.js', '/main.js',
'/profil.js', '/profil.js',
'/img/favicon.ico',
'/favicon.ico',
'/img/th_nbg_ohmicon_amp.png', '/img/th_nbg_ohmicon_amp.png',
'/lib/jquery-3.3.1.min.js', '/lib/jquery-3.3.1.min.js',
'/lib/vue.js', '/lib/vue.js',
]; ];
const logicFilesToCache = [ const logicFilesToCache = [
'', '',
'',
]; ];
const dataFilesToCache = [ const dataFilesToCache = [
'', '',
'',
]; ];


// NOTE: Registration done in main.js // NOTE: Registration done in main.js
caches.open(shellCacheKey).then(function (cache) { caches.open(shellCacheKey).then(function (cache) {
console.log('[ServiceWorker] Cache shell files.'); console.log('[ServiceWorker] Cache shell files.');
return cache.addAll(shellFilesToCache); return cache.addAll(shellFilesToCache);
}),
}).then(self.skipWaiting()),
caches.open(logicCasheKey).then(function (cache) { caches.open(logicCasheKey).then(function (cache) {
console.log('[ServiceWorker] Cache logic files.'); console.log('[ServiceWorker] Cache logic files.');
return cache.addAll(logicFilesToCache); return cache.addAll(logicFilesToCache);
}),
}).then(self.skipWaiting()),
caches.open(dataCacheKey).then(function (cache) { caches.open(dataCacheKey).then(function (cache) {
console.log('[ServiceWorker] Cache data files.'); console.log('[ServiceWorker] Cache data files.');
return cache.addAll(dataFilesToCache); return cache.addAll(dataFilesToCache);
})
}).then(self.skipWaiting())
); );
}); });


// NOTE: Activate structure and delete older cache versions // NOTE: Activate structure and delete older cache versions
self.addEventListener('activate', function (event) { self.addEventListener('activate', function (event) {
console.log('[ServiceWorker] Activate'); console.log('[ServiceWorker] Activate');
/*const cacheWhitelist = [staticCacheName];
event.waitUntil(
caches.keys().then(function (cacheNames) {
return Promise.all(
cacheNames.map(function (cacheName) {
if (cacheWhitelist.indexOf(cacheName) === -1) {
return caches.delete(cacheName);
}
})
);
})
);*/
event.waitUntil( event.waitUntil(
caches.keys().then(function (cacheKeyList) { caches.keys().then(function (cacheKeyList) {
return Promise.all( return Promise.all(
var dataUrl = 'localhost:8888'; // Provide HTTPS URL for query data. var dataUrl = 'localhost:8888'; // Provide HTTPS URL for query data.
console.log('[ServiceWorker] Fetch', event.request.url); console.log('[ServiceWorker] Fetch', event.request.url);


if (event.request.url.indexOf(dataUrl) > -1) {
//if (event.request.url.indexOf(dataUrl) > -1) {
/* /*
* When the request URL contains dataUrl, the app is asking for fresh * When the request URL contains dataUrl, the app is asking for fresh
* data. In this case, the service worker always goes to the network * data. In this case, the service worker always goes to the network
* https://jakearchibald.com/2014/offline-cookbook/#cache-then-network * https://jakearchibald.com/2014/offline-cookbook/#cache-then-network
*/ */


event.respondWith(
caches.open(dataCacheKey).then(function (cache) {
/*event.respondWith(
caches.open(shellCacheKey).then(function (cache) {
return fetch(event.request).then(function (response) { return fetch(event.request).then(function (response) {
cache.put(event.request.url, response.clone()); cache.put(event.request.url, response.clone());
return response; return response;
}) })
); );
} else { } else {
*/
/* /*
* The app is asking for app shell files. In this scenario the app uses the * The app is asking for app shell files. In this scenario the app uses the
* "Cache, falling back to the network" offline strategy: * "Cache, falling back to the network" offline strategy:
return response || fetch(event.request); return response || fetch(event.request);
}) })
); );
}
//}
/*
caches.match(event.request).then(cachedResponse => {
if (cachedResponse) {
return cachedResponse;
}

return caches.open(shellCacheKey).then(cache => {
return fetch(event.request).then(response => {
// Put a copy of the response in the runtime cache.
return cache.put(event.request, response.clone()).then(() => {
return response;
});
});
});

})*/
}); });



Loading…
Cancel
Save