From 9674986e100cd323dd04873f0c23a4a8b12ac937 Mon Sep 17 00:00:00 2001 From: Shaun Date: Wed, 1 May 2019 16:20:33 +0100 Subject: [PATCH 01/19] lesson-9 --- index.html | 1 + js/app.js | 5 +++++ pages/about.html | 1 + pages/contact.html | 1 + sw.js | 4 ++++ 5 files changed, 12 insertions(+) create mode 100644 js/app.js create mode 100644 sw.js diff --git a/index.html b/index.html index f41437f..2a1d46a 100644 --- a/index.html +++ b/index.html @@ -106,6 +106,7 @@
New Recipe
+ \ No newline at end of file diff --git a/js/app.js b/js/app.js new file mode 100644 index 0000000..8ee05ed --- /dev/null +++ b/js/app.js @@ -0,0 +1,5 @@ +if('serviceWorker' in navigator){ + navigator.serviceWorker.register('/sw.js') + .then(reg => console.log('service worker registered', reg)) + .catch(err => console.log('service worker not registered', err)); +} \ No newline at end of file diff --git a/pages/about.html b/pages/about.html index b3345f3..4538707 100644 --- a/pages/about.html +++ b/pages/about.html @@ -43,6 +43,7 @@
About Food Ninja

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatibus omnis, ea doloremque exercitationem id necessitatibus. Voluptatem officiis cupiditate commodi totam, hic laborum est ducimus amet iure, non dignissimos illo.

+ \ No newline at end of file diff --git a/pages/contact.html b/pages/contact.html index cd55b80..1b36a66 100644 --- a/pages/contact.html +++ b/pages/contact.html @@ -48,6 +48,7 @@
Find us at:
+ \ No newline at end of file diff --git a/sw.js b/sw.js new file mode 100644 index 0000000..6a52f32 --- /dev/null +++ b/sw.js @@ -0,0 +1,4 @@ +// install event +self.addEventListener('install', evt => { + console.log('service worker installed'); +}); \ No newline at end of file From 56c444f184e498fd3ce403daa1b02eef54ee229a Mon Sep 17 00:00:00 2001 From: Shaun Date: Wed, 1 May 2019 17:14:05 +0100 Subject: [PATCH 02/19] lesson-11 --- index.html | 1 + js/app.js | 2 +- pages/about.html | 1 + pages/contact.html | 1 + sw.js | 5 +++++ 5 files changed, 9 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index 2a1d46a..a1ef683 100644 --- a/index.html +++ b/index.html @@ -13,6 +13,7 @@ + diff --git a/js/app.js b/js/app.js index 8ee05ed..12ded7a 100644 --- a/js/app.js +++ b/js/app.js @@ -1,5 +1,5 @@ if('serviceWorker' in navigator){ navigator.serviceWorker.register('/sw.js') - .then(reg => console.log('service worker registered', reg)) + .then(reg => console.log('service worker registered')) .catch(err => console.log('service worker not registered', err)); } \ No newline at end of file diff --git a/pages/about.html b/pages/about.html index 4538707..acb262e 100644 --- a/pages/about.html +++ b/pages/about.html @@ -12,6 +12,7 @@ + diff --git a/pages/contact.html b/pages/contact.html index 1b36a66..d6f425e 100644 --- a/pages/contact.html +++ b/pages/contact.html @@ -12,6 +12,7 @@ + diff --git a/sw.js b/sw.js index 6a52f32..2286032 100644 --- a/sw.js +++ b/sw.js @@ -1,4 +1,9 @@ // install event self.addEventListener('install', evt => { console.log('service worker installed'); +}); + +// activate event +self.addEventListener('activate', evt => { + console.log('service worker activated'); }); \ No newline at end of file From 13798bbaffbc27b99d2aaa46995854e24b0ce50a Mon Sep 17 00:00:00 2001 From: Shaun Date: Wed, 1 May 2019 17:26:34 +0100 Subject: [PATCH 03/19] lesson-12 --- sw.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/sw.js b/sw.js index 2286032..b3d4c2d 100644 --- a/sw.js +++ b/sw.js @@ -6,4 +6,9 @@ self.addEventListener('install', evt => { // activate event self.addEventListener('activate', evt => { console.log('service worker activated'); +}); + +// fetch event +self.addEventListener('fetch', evt => { + console.log('fetch event', evt); }); \ No newline at end of file From 7872e21ec669899b0d695916f1d2da160fa1ae6b Mon Sep 17 00:00:00 2001 From: Shaun Date: Wed, 1 May 2019 18:12:07 +0100 Subject: [PATCH 04/19] lesson-15 --- sw.js | 23 ++++++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/sw.js b/sw.js index b3d4c2d..5993ba8 100644 --- a/sw.js +++ b/sw.js @@ -1,14 +1,31 @@ +const staticCacheName = 'site-static'; +const assets = [ + '/', + '/index.html', + '/js/app.js', + '/js/ui.js', + '/js/materialize.min.js', + '/css/styles.css', + '/css/materialize.min.css' +]; + // install event self.addEventListener('install', evt => { - console.log('service worker installed'); + //console.log('service worker installed'); + evt.waitUntil( + caches.open(staticCacheName).then((cache) => { + console.log('caching shell assets'); + cache.addAll(assets); + }) + ); }); // activate event self.addEventListener('activate', evt => { - console.log('service worker activated'); + //console.log('service worker activated'); }); // fetch event self.addEventListener('fetch', evt => { - console.log('fetch event', evt); + //console.log('fetch event', evt); }); \ No newline at end of file From 1f02758bac87902d16ceb3cb5776ed4caa379509 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 09:55:27 +0100 Subject: [PATCH 05/19] lesson-16a --- sw.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/sw.js b/sw.js index 5993ba8..a830332 100644 --- a/sw.js +++ b/sw.js @@ -28,4 +28,9 @@ self.addEventListener('activate', evt => { // fetch event self.addEventListener('fetch', evt => { //console.log('fetch event', evt); + evt.respondWith( + caches.match(evt.request).then(cacheRes => { + return cacheRes || fetch(evt.request); + }) + ); }); \ No newline at end of file From 99da081773948c653cfcb3e027f8ad98de8a1e04 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 10:12:43 +0100 Subject: [PATCH 06/19] lesson-16 --- sw.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/sw.js b/sw.js index a830332..7f7cfee 100644 --- a/sw.js +++ b/sw.js @@ -6,7 +6,10 @@ const assets = [ '/js/ui.js', '/js/materialize.min.js', '/css/styles.css', - '/css/materialize.min.css' + '/css/materialize.min.css', + '/img/dish.png', + 'https://fonts.googleapis.com/icon?family=Material+Icons', + 'https://fonts.gstatic.com/s/materialicons/v47/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2' ]; // install event From 40cc6dedf779003b94e94d699066e5f7413cf91e Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 10:34:35 +0100 Subject: [PATCH 07/19] lesson-18 --- index.html | 1 + sw.js | 11 ++++++++++- 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index a1ef683..d532af6 100644 --- a/index.html +++ b/index.html @@ -40,6 +40,7 @@
+
recipes
recipe thumb
diff --git a/sw.js b/sw.js index 7f7cfee..9d1d480 100644 --- a/sw.js +++ b/sw.js @@ -1,4 +1,4 @@ -const staticCacheName = 'site-static'; +const staticCacheName = 'site-static-v2'; const assets = [ '/', '/index.html', @@ -26,6 +26,15 @@ self.addEventListener('install', evt => { // activate event self.addEventListener('activate', evt => { //console.log('service worker activated'); + evt.waitUntil( + caches.keys().then(keys => { + //console.log(keys); + return Promise.all(keys + .filter(key => key !== staticCacheName) + .map(key => caches.delete(key)) + ); + }) + ); }); // fetch event From 4d77ca5d76de8c9a4a4f468587a3a389111b6c00 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 11:09:07 +0100 Subject: [PATCH 08/19] lesson-18 --- index.html | 1 - sw.js | 10 ++++++++-- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index d532af6..a1ef683 100644 --- a/index.html +++ b/index.html @@ -40,7 +40,6 @@
-
recipes
recipe thumb
diff --git a/sw.js b/sw.js index 9d1d480..6949107 100644 --- a/sw.js +++ b/sw.js @@ -1,4 +1,5 @@ const staticCacheName = 'site-static-v2'; +const dynamicCacheName = 'site-dynamic-v1'; const assets = [ '/', '/index.html', @@ -30,7 +31,7 @@ self.addEventListener('activate', evt => { caches.keys().then(keys => { //console.log(keys); return Promise.all(keys - .filter(key => key !== staticCacheName) + .filter(key => key !== staticCacheName && key !== dynamicCacheName) .map(key => caches.delete(key)) ); }) @@ -42,7 +43,12 @@ self.addEventListener('fetch', evt => { //console.log('fetch event', evt); evt.respondWith( caches.match(evt.request).then(cacheRes => { - return cacheRes || fetch(evt.request); + return cacheRes || fetch(evt.request).then(fetchRes => { + return caches.open(dynamicCacheName).then(cache => { + cache.put(evt.request.url, fetchRes.clone()); + return fetchRes; + }) + }); }) ); }); \ No newline at end of file From c3603e5d89a00d489b0388121ac0fd6c8708cc1c Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 11:30:19 +0100 Subject: [PATCH 09/19] lesson-19 --- pages/fallback.html | 50 +++++++++++++++++++++++++++++++++++++++++++++ sw.js | 5 +++-- 2 files changed, 53 insertions(+), 2 deletions(-) create mode 100644 pages/fallback.html diff --git a/pages/fallback.html b/pages/fallback.html new file mode 100644 index 0000000..079638b --- /dev/null +++ b/pages/fallback.html @@ -0,0 +1,50 @@ + + + + + + Food Ninja + + + + + + + + + + + + + + + + + + + +
+
OOPS!
+

Currently you can't view this page without a connection.

+ Go to the Homepage +
+ + + + + \ No newline at end of file diff --git a/sw.js b/sw.js index 6949107..e67a1a7 100644 --- a/sw.js +++ b/sw.js @@ -10,7 +10,8 @@ const assets = [ '/css/materialize.min.css', '/img/dish.png', 'https://fonts.googleapis.com/icon?family=Material+Icons', - 'https://fonts.gstatic.com/s/materialicons/v47/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2' + 'https://fonts.gstatic.com/s/materialicons/v47/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2', + '/pages/fallback.html' ]; // install event @@ -49,6 +50,6 @@ self.addEventListener('fetch', evt => { return fetchRes; }) }); - }) + }).catch(() => caches.match('/pages/fallback.html')) ); }); \ No newline at end of file From 59a05841235f5983f4e746e5ec9c1919be0f3508 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 11:41:33 +0100 Subject: [PATCH 10/19] lesson-20 --- sw.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/sw.js b/sw.js index e67a1a7..6510a56 100644 --- a/sw.js +++ b/sw.js @@ -50,6 +50,10 @@ self.addEventListener('fetch', evt => { return fetchRes; }) }); - }).catch(() => caches.match('/pages/fallback.html')) + }).catch(() => { + if(evt.request.url.indexOf('.html') > -1){ + return caches.match('/pages/fallback.html'); + } + }) ); }); \ No newline at end of file From c431325698f3d5f7cb2ff07718c72e0cb6bad107 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 11:52:07 +0100 Subject: [PATCH 11/19] lesson-21 --- sw.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/sw.js b/sw.js index 6510a56..f31de97 100644 --- a/sw.js +++ b/sw.js @@ -14,6 +14,17 @@ const assets = [ '/pages/fallback.html' ]; +// cache size limit function +const limitCacheSize = (name, size) => { + caches.open(name).then(cache => { + cache.keys().then(keys => { + if(keys.length > size){ + cache.delete(keys[0]).then(limitCacheSize(name, size)); + } + }); + }); +}; + // install event self.addEventListener('install', evt => { //console.log('service worker installed'); @@ -47,6 +58,8 @@ self.addEventListener('fetch', evt => { return cacheRes || fetch(evt.request).then(fetchRes => { return caches.open(dynamicCacheName).then(cache => { cache.put(evt.request.url, fetchRes.clone()); + // check cached items size + limitCacheSize(dynamicCacheName, 15); return fetchRes; }) }); From 135fd24c720dde831a2defa1af437d0f222d3d19 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 12:54:25 +0100 Subject: [PATCH 12/19] lesson-23 --- index.html | 17 +++++++++++++++++ js/db.js | 0 pages/about.html | 16 ++++++++++++++++ pages/contact.html | 16 ++++++++++++++++ 4 files changed, 49 insertions(+) create mode 100644 js/db.js diff --git a/index.html b/index.html index a1ef683..378fa98 100644 --- a/index.html +++ b/index.html @@ -107,7 +107,24 @@
New Recipe
+ + + + + \ No newline at end of file diff --git a/js/db.js b/js/db.js new file mode 100644 index 0000000..e69de29 diff --git a/pages/about.html b/pages/about.html index acb262e..2d9b0fb 100644 --- a/pages/about.html +++ b/pages/about.html @@ -44,7 +44,23 @@
About Food Ninja

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatibus omnis, ea doloremque exercitationem id necessitatibus. Voluptatem officiis cupiditate commodi totam, hic laborum est ducimus amet iure, non dignissimos illo.

+ + + + \ No newline at end of file diff --git a/pages/contact.html b/pages/contact.html index d6f425e..f351dbe 100644 --- a/pages/contact.html +++ b/pages/contact.html @@ -49,7 +49,23 @@
Find us at:
+ + + + \ No newline at end of file From 90b19238c9c8af07ea2a2d03e06bc95f874e6fdc Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 13:06:22 +0100 Subject: [PATCH 13/19] lesson-24 --- js/db.js | 13 +++++++++++++ sw.js | 32 ++++++++++++++++---------------- 2 files changed, 29 insertions(+), 16 deletions(-) diff --git a/js/db.js b/js/db.js index e69de29..2adc0d9 100644 --- a/js/db.js +++ b/js/db.js @@ -0,0 +1,13 @@ +// real-time listener +db.collection('recipes').onSnapshot(snapshot => { + //console.log(snapshot.docChanges()); + snapshot.docChanges().forEach(change => { + //console.log(change.type, change.doc.id, change.doc.data()); + if(change.type === 'added'){ + // add the document data to the web page + } + if(change.type === 'removed'){ + // remove the document data from the web page + } + }); +}); \ No newline at end of file diff --git a/sw.js b/sw.js index f31de97..7e601c4 100644 --- a/sw.js +++ b/sw.js @@ -53,20 +53,20 @@ self.addEventListener('activate', evt => { // fetch event self.addEventListener('fetch', evt => { //console.log('fetch event', evt); - evt.respondWith( - caches.match(evt.request).then(cacheRes => { - return cacheRes || fetch(evt.request).then(fetchRes => { - return caches.open(dynamicCacheName).then(cache => { - cache.put(evt.request.url, fetchRes.clone()); - // check cached items size - limitCacheSize(dynamicCacheName, 15); - return fetchRes; - }) - }); - }).catch(() => { - if(evt.request.url.indexOf('.html') > -1){ - return caches.match('/pages/fallback.html'); - } - }) - ); + // evt.respondWith( + // caches.match(evt.request).then(cacheRes => { + // return cacheRes || fetch(evt.request).then(fetchRes => { + // return caches.open(dynamicCacheName).then(cache => { + // cache.put(evt.request.url, fetchRes.clone()); + // // check cached items size + // limitCacheSize(dynamicCacheName, 15); + // return fetchRes; + // }) + // }); + // }).catch(() => { + // if(evt.request.url.indexOf('.html') > -1){ + // return caches.match('/pages/fallback.html'); + // } + // }) + // ); }); \ No newline at end of file From 73647ceb55806f16f0b2f376a5647226ea3b4bd4 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 14:26:09 +0100 Subject: [PATCH 14/19] lesson-25 --- js/db.js | 4 +--- js/ui.js | 23 ++++++++++++++++++++++- sw.js | 2 +- 3 files changed, 24 insertions(+), 5 deletions(-) diff --git a/js/db.js b/js/db.js index 2adc0d9..90a36cb 100644 --- a/js/db.js +++ b/js/db.js @@ -1,10 +1,8 @@ // real-time listener db.collection('recipes').onSnapshot(snapshot => { - //console.log(snapshot.docChanges()); snapshot.docChanges().forEach(change => { - //console.log(change.type, change.doc.id, change.doc.data()); if(change.type === 'added'){ - // add the document data to the web page + renderRecipe(change.doc.data(), change.doc.id); } if(change.type === 'removed'){ // remove the document data from the web page diff --git a/js/ui.js b/js/ui.js index 2f45663..0faaf50 100644 --- a/js/ui.js +++ b/js/ui.js @@ -1,3 +1,5 @@ +const recipes = document.querySelector('.recipes'); + document.addEventListener('DOMContentLoaded', function() { // nav menu const menus = document.querySelectorAll('.side-menu'); @@ -5,4 +7,23 @@ document.addEventListener('DOMContentLoaded', function() { // add recipe form const forms = document.querySelectorAll('.side-form'); M.Sidenav.init(forms, {edge: 'left'}); -}); \ No newline at end of file +}); + +// render recipe data +const renderRecipe = (data, id) => { + + const html = ` +
+ recipe thumb +
+
${data.name}
+
${data.ingredients}
+
+
+ delete_outline +
+
+ `; + recipes.innerHTML += html; + +}; \ No newline at end of file diff --git a/sw.js b/sw.js index 7e601c4..1fecbd8 100644 --- a/sw.js +++ b/sw.js @@ -50,7 +50,7 @@ self.addEventListener('activate', evt => { ); }); -// fetch event +// fetch events self.addEventListener('fetch', evt => { //console.log('fetch event', evt); // evt.respondWith( From 421c359db5a868799bbc7d821898897ee1f168e9 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 14:42:33 +0100 Subject: [PATCH 15/19] lesson-26 --- js/db.js | 12 ++++++++++++ pages/about.html | 16 ---------------- pages/contact.html | 16 ---------------- sw.js | 2 +- 4 files changed, 13 insertions(+), 33 deletions(-) diff --git a/js/db.js b/js/db.js index 90a36cb..58b8456 100644 --- a/js/db.js +++ b/js/db.js @@ -1,3 +1,15 @@ +// enable offline data +db.enablePersistence() + .catch(function(err) { + if (err.code == 'failed-precondition') { + // probably multible tabs open at once + console.log('persistance failed'); + } else if (err.code == 'unimplemented') { + // lack of browser support for the feature + console.log('persistance not available'); + } + }); + // real-time listener db.collection('recipes').onSnapshot(snapshot => { snapshot.docChanges().forEach(change => { diff --git a/pages/about.html b/pages/about.html index 2d9b0fb..acb262e 100644 --- a/pages/about.html +++ b/pages/about.html @@ -44,23 +44,7 @@
About Food Ninja

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam voluptatibus omnis, ea doloremque exercitationem id necessitatibus. Voluptatem officiis cupiditate commodi totam, hic laborum est ducimus amet iure, non dignissimos illo.

- - - - \ No newline at end of file diff --git a/pages/contact.html b/pages/contact.html index f351dbe..d6f425e 100644 --- a/pages/contact.html +++ b/pages/contact.html @@ -49,23 +49,7 @@
Find us at:
- - - - \ No newline at end of file diff --git a/sw.js b/sw.js index 1fecbd8..b6477d8 100644 --- a/sw.js +++ b/sw.js @@ -1,5 +1,5 @@ const staticCacheName = 'site-static-v2'; -const dynamicCacheName = 'site-dynamic-v1'; +const dynamicCacheName = 'site-dynamic-v2'; const assets = [ '/', '/index.html', From 422cf586ee58d4377bc7a48e0f3ec90952f94252 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 15:00:58 +0100 Subject: [PATCH 16/19] lesson-27a --- js/db.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/js/db.js b/js/db.js index 58b8456..19abbdb 100644 --- a/js/db.js +++ b/js/db.js @@ -20,4 +20,10 @@ db.collection('recipes').onSnapshot(snapshot => { // remove the document data from the web page } }); -}); \ No newline at end of file +}); + +// add new recipe +const form = document.querySelector('form'); +form.addEventListener('submit', evt => { + evt.preventDefault(); +}) \ No newline at end of file From 3ad1db5077438676bc4bc5912bd5e0d15ccbe962 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 15:25:57 +0100 Subject: [PATCH 17/19] lesson-27 --- index.html | 41 +---------------------------------------- js/db.js | 13 ++++++++++++- sw.js | 39 ++++++++++++++++++++------------------- 3 files changed, 33 insertions(+), 60 deletions(-) diff --git a/index.html b/index.html index 378fa98..acc00a9 100644 --- a/index.html +++ b/index.html @@ -40,46 +40,7 @@
-
- recipe thumb -
-
Edame Noodles
-
Edame Beans, Noodels, Garlic oil
-
-
- delete_outline -
-
-
- recipe thumb -
-
Edame Noodles
-
Edame Beans, Noodels, Garlic oil
-
-
- delete_outline -
-
-
- recipe thumb -
-
Edame Noodles
-
Edame Beans, Noodels, Garlic oil
-
-
- delete_outline -
-
-
- recipe thumb -
-
Edame Noodles
-
Edame Beans, Noodels, Garlic oil
-
-
- delete_outline -
-
+
diff --git a/js/db.js b/js/db.js index 19abbdb..06b13e1 100644 --- a/js/db.js +++ b/js/db.js @@ -26,4 +26,15 @@ db.collection('recipes').onSnapshot(snapshot => { const form = document.querySelector('form'); form.addEventListener('submit', evt => { evt.preventDefault(); -}) \ No newline at end of file + + const recipe = { + name: form.title.value, + ingredients: form.ingredients.value + }; + + db.collection('recipes').add(recipe) + .catch(err => console.log(err)); + + form.title.value = ''; + form.ingredients.value = ''; +}); \ No newline at end of file diff --git a/sw.js b/sw.js index b6477d8..8196bbb 100644 --- a/sw.js +++ b/sw.js @@ -1,5 +1,5 @@ -const staticCacheName = 'site-static-v2'; -const dynamicCacheName = 'site-dynamic-v2'; +const staticCacheName = 'site-static-v3'; +const dynamicCacheName = 'site-dynamic-v3'; const assets = [ '/', '/index.html', @@ -52,21 +52,22 @@ self.addEventListener('activate', evt => { // fetch events self.addEventListener('fetch', evt => { - //console.log('fetch event', evt); - // evt.respondWith( - // caches.match(evt.request).then(cacheRes => { - // return cacheRes || fetch(evt.request).then(fetchRes => { - // return caches.open(dynamicCacheName).then(cache => { - // cache.put(evt.request.url, fetchRes.clone()); - // // check cached items size - // limitCacheSize(dynamicCacheName, 15); - // return fetchRes; - // }) - // }); - // }).catch(() => { - // if(evt.request.url.indexOf('.html') > -1){ - // return caches.match('/pages/fallback.html'); - // } - // }) - // ); + if(evt.request.url.indexOf('firestore.googleapis.com') === -1){ + evt.respondWith( + caches.match(evt.request).then(cacheRes => { + return cacheRes || fetch(evt.request).then(fetchRes => { + return caches.open(dynamicCacheName).then(cache => { + cache.put(evt.request.url, fetchRes.clone()); + // check cached items size + limitCacheSize(dynamicCacheName, 15); + return fetchRes; + }) + }); + }).catch(() => { + if(evt.request.url.indexOf('.html') > -1){ + return caches.match('/pages/fallback.html'); + } + }) + ); + } }); \ No newline at end of file From 016676c89b1635274f117e00641790e1be2bc3fa Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 15:38:37 +0100 Subject: [PATCH 18/19] lesson-28 --- js/db.js | 14 ++++++++++++-- js/ui.js | 6 ++++++ sw.js | 4 ++-- 3 files changed, 20 insertions(+), 4 deletions(-) diff --git a/js/db.js b/js/db.js index 06b13e1..0ef13d2 100644 --- a/js/db.js +++ b/js/db.js @@ -17,7 +17,7 @@ db.collection('recipes').onSnapshot(snapshot => { renderRecipe(change.doc.data(), change.doc.id); } if(change.type === 'removed'){ - // remove the document data from the web page + removeRecipe(change.doc.id); } }); }); @@ -37,4 +37,14 @@ form.addEventListener('submit', evt => { form.title.value = ''; form.ingredients.value = ''; -}); \ No newline at end of file +}); + +// remove a recipe +const recipeContainer = document.querySelector('.recipes'); +recipeContainer.addEventListener('click', evt => { + if(evt.target.tagName === 'I'){ + const id = evt.target.getAttribute('data-id'); + //console.log(id); + db.collection('recipes').doc(id).delete(); + } +}) \ No newline at end of file diff --git a/js/ui.js b/js/ui.js index 0faaf50..dd9237f 100644 --- a/js/ui.js +++ b/js/ui.js @@ -26,4 +26,10 @@ const renderRecipe = (data, id) => { `; recipes.innerHTML += html; +}; + +// remove recipe +const removeRecipe = (id) => { + const recipe = document.querySelector(`.recipe[data-id=${id}]`); + recipe.remove(); }; \ No newline at end of file diff --git a/sw.js b/sw.js index 8196bbb..af30971 100644 --- a/sw.js +++ b/sw.js @@ -1,5 +1,5 @@ -const staticCacheName = 'site-static-v3'; -const dynamicCacheName = 'site-dynamic-v3'; +const staticCacheName = 'site-static-v4'; +const dynamicCacheName = 'site-dynamic-v4'; const assets = [ '/', '/index.html', From be06852e766c0364dd97791354f13064dcb802f7 Mon Sep 17 00:00:00 2001 From: Shaun Date: Thu, 2 May 2019 17:52:17 +0100 Subject: [PATCH 19/19] lesson-29 --- .firebaserc | 5 ++ .gitignore | 65 +++++++++++++++++++++ firebase.json | 10 ++++ public/404.html | 33 +++++++++++ {css => public/css}/materialize.min.css | 0 {css => public/css}/styles.css | 0 {img => public/img}/dish.png | Bin {img => public/img}/icons/icon-128x128.png | Bin {img => public/img}/icons/icon-144x144.png | Bin {img => public/img}/icons/icon-152x152.png | Bin {img => public/img}/icons/icon-192x192.png | Bin {img => public/img}/icons/icon-384x384.png | Bin {img => public/img}/icons/icon-512x512.png | Bin {img => public/img}/icons/icon-72x72.png | Bin {img => public/img}/icons/icon-96x96.png | Bin index.html => public/index.html | 2 +- {js => public/js}/app.js | 0 {js => public/js}/db.js | 0 {js => public/js}/materialize.min.js | 0 {js => public/js}/ui.js | 0 manifest.json => public/manifest.json | 0 {pages => public/pages}/about.html | 2 +- {pages => public/pages}/contact.html | 2 +- {pages => public/pages}/fallback.html | 2 +- sw.js => public/sw.js | 0 25 files changed, 117 insertions(+), 4 deletions(-) create mode 100644 .firebaserc create mode 100644 .gitignore create mode 100644 firebase.json create mode 100644 public/404.html rename {css => public/css}/materialize.min.css (100%) rename {css => public/css}/styles.css (100%) rename {img => public/img}/dish.png (100%) rename {img => public/img}/icons/icon-128x128.png (100%) rename {img => public/img}/icons/icon-144x144.png (100%) rename {img => public/img}/icons/icon-152x152.png (100%) rename {img => public/img}/icons/icon-192x192.png (100%) rename {img => public/img}/icons/icon-384x384.png (100%) rename {img => public/img}/icons/icon-512x512.png (100%) rename {img => public/img}/icons/icon-72x72.png (100%) rename {img => public/img}/icons/icon-96x96.png (100%) rename index.html => public/index.html (98%) rename {js => public/js}/app.js (100%) rename {js => public/js}/db.js (100%) rename {js => public/js}/materialize.min.js (100%) rename {js => public/js}/ui.js (100%) rename manifest.json => public/manifest.json (100%) rename {pages => public/pages}/about.html (97%) rename {pages => public/pages}/contact.html (96%) rename {pages => public/pages}/fallback.html (96%) rename sw.js => public/sw.js (100%) diff --git a/.firebaserc b/.firebaserc new file mode 100644 index 0000000..fa5b149 --- /dev/null +++ b/.firebaserc @@ -0,0 +1,5 @@ +{ + "projects": { + "default": "net-ninja-pwa" + } +} diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..f626852 --- /dev/null +++ b/.gitignore @@ -0,0 +1,65 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +firebase-debug.log* + +# Firebase cache +.firebase/ + +# Firebase config + +# Uncomment this if you'd like others to create their own Firebase project. +# For a team working on the same Firebase project(s), it is recommended to leave +# it commented so all members can deploy to the same project(s) in .firebaserc. +# .firebaserc + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage + +# nyc test coverage +.nyc_output + +# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) +.grunt + +# Bower dependency directory (https://bower.io/) +bower_components + +# node-waf configuration +.lock-wscript + +# Compiled binary addons (http://nodejs.org/api/addons.html) +build/Release + +# Dependency directories +node_modules/ + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# Yarn Integrity file +.yarn-integrity + +# dotenv environment variables file +.env diff --git a/firebase.json b/firebase.json new file mode 100644 index 0000000..e782939 --- /dev/null +++ b/firebase.json @@ -0,0 +1,10 @@ +{ + "hosting": { + "public": "public", + "ignore": [ + "firebase.json", + "**/.*", + "**/node_modules/**" + ] + } +} diff --git a/public/404.html b/public/404.html new file mode 100644 index 0000000..829eda8 --- /dev/null +++ b/public/404.html @@ -0,0 +1,33 @@ + + + + + + Page Not Found + + + + +
+

404

+

Page Not Found

+

The specified file was not found on this website. Please check the URL for mistakes and try again.

+

Why am I seeing this?

+

This page was generated by the Firebase Command-Line Interface. To modify it, edit the 404.html file in your project's configured public directory.

+
+ + diff --git a/css/materialize.min.css b/public/css/materialize.min.css similarity index 100% rename from css/materialize.min.css rename to public/css/materialize.min.css diff --git a/css/styles.css b/public/css/styles.css similarity index 100% rename from css/styles.css rename to public/css/styles.css diff --git a/img/dish.png b/public/img/dish.png similarity index 100% rename from img/dish.png rename to public/img/dish.png diff --git a/img/icons/icon-128x128.png b/public/img/icons/icon-128x128.png similarity index 100% rename from img/icons/icon-128x128.png rename to public/img/icons/icon-128x128.png diff --git a/img/icons/icon-144x144.png b/public/img/icons/icon-144x144.png similarity index 100% rename from img/icons/icon-144x144.png rename to public/img/icons/icon-144x144.png diff --git a/img/icons/icon-152x152.png b/public/img/icons/icon-152x152.png similarity index 100% rename from img/icons/icon-152x152.png rename to public/img/icons/icon-152x152.png diff --git a/img/icons/icon-192x192.png b/public/img/icons/icon-192x192.png similarity index 100% rename from img/icons/icon-192x192.png rename to public/img/icons/icon-192x192.png diff --git a/img/icons/icon-384x384.png b/public/img/icons/icon-384x384.png similarity index 100% rename from img/icons/icon-384x384.png rename to public/img/icons/icon-384x384.png diff --git a/img/icons/icon-512x512.png b/public/img/icons/icon-512x512.png similarity index 100% rename from img/icons/icon-512x512.png rename to public/img/icons/icon-512x512.png diff --git a/img/icons/icon-72x72.png b/public/img/icons/icon-72x72.png similarity index 100% rename from img/icons/icon-72x72.png rename to public/img/icons/icon-72x72.png diff --git a/img/icons/icon-96x96.png b/public/img/icons/icon-96x96.png similarity index 100% rename from img/icons/icon-96x96.png rename to public/img/icons/icon-96x96.png diff --git a/index.html b/public/index.html similarity index 98% rename from index.html rename to public/index.html index acc00a9..ce6c7ea 100644 --- a/index.html +++ b/public/index.html @@ -11,7 +11,7 @@ - + diff --git a/js/app.js b/public/js/app.js similarity index 100% rename from js/app.js rename to public/js/app.js diff --git a/js/db.js b/public/js/db.js similarity index 100% rename from js/db.js rename to public/js/db.js diff --git a/js/materialize.min.js b/public/js/materialize.min.js similarity index 100% rename from js/materialize.min.js rename to public/js/materialize.min.js diff --git a/js/ui.js b/public/js/ui.js similarity index 100% rename from js/ui.js rename to public/js/ui.js diff --git a/manifest.json b/public/manifest.json similarity index 100% rename from manifest.json rename to public/manifest.json diff --git a/pages/about.html b/public/pages/about.html similarity index 97% rename from pages/about.html rename to public/pages/about.html index acb262e..421973d 100644 --- a/pages/about.html +++ b/public/pages/about.html @@ -10,7 +10,7 @@ - + diff --git a/pages/contact.html b/public/pages/contact.html similarity index 96% rename from pages/contact.html rename to public/pages/contact.html index d6f425e..b6b232c 100644 --- a/pages/contact.html +++ b/public/pages/contact.html @@ -10,7 +10,7 @@ - + diff --git a/pages/fallback.html b/public/pages/fallback.html similarity index 96% rename from pages/fallback.html rename to public/pages/fallback.html index 079638b..ea7e057 100644 --- a/pages/fallback.html +++ b/public/pages/fallback.html @@ -10,7 +10,7 @@ - + diff --git a/sw.js b/public/sw.js similarity index 100% rename from sw.js rename to public/sw.js