From 3dd5f21a2550f69bcef874d5dc1bf82841c05010 Mon Sep 17 00:00:00 2001 From: Meira Tompkins Date: Tue, 18 Feb 2020 14:47:03 -0500 Subject: [PATCH] started chat room files --- icon192.png | Bin 0 -> 852 bytes icon512.png | Bin 0 -> 1746 bytes index.html | 18 +++++ main.css | 5 ++ main.js | 15 ++++ manifest.json | 20 +++++ sw.js | 199 ++++++++++++++++++++++++++++++++++++++++++++++++++ 7 files changed, 257 insertions(+) create mode 100644 icon192.png create mode 100644 icon512.png create mode 100644 index.html create mode 100644 main.css create mode 100644 main.js create mode 100644 manifest.json create mode 100644 sw.js diff --git a/icon192.png b/icon192.png new file mode 100644 index 0000000000000000000000000000000000000000..674bb6d544670b6e548f83e5790f8adc08a481c0 GIT binary patch literal 852 zcmeAS@N?(olHy`uVBq!ia0vp^2SAvG8AvYpRA>UEqyv0HTm@$;O`A5Yby|DM^en|0 z2Eo%~N~TphP4_jLVIQ{Q?M0w6&H|6fVg?4jBOuH;Rhv(mfr071r;B4q#hkaZY>RI> z2(-m>at3-mI{lRM@r)pgGPS3Sa?3?U)~U8LPH#H%Kx~pyz4dOVLl$jEgpbbj*>s+# z`i0+{&EFNxjTAVVu%kcyH}ni%xya~!|9!lnwD8!&km*7*R5;$f+R!v}|9$xj0oojf zIjXCC{_%Hm@9y09OyKRVwNu?EcWCkQoi%FO_k7W<18R#5I?C^g_Oo=ZGu4b(Yt*#f zTYOoQU{SyUB`0_0t?W^Y_yV3k_-}Cd`~uqrN1AVVZkC+EyL|3f_Bk`U>K%4UZfKa^ z(RKdYf-v(?#RaO59-V&6$oCf9A?RGaFv@Iq-{a{#ecwWRiI8^waZZmdBi| zD;J%!&|)#R;MF;FU%}#_ti0;6%-Ow86V|Nm>I(d3!B|4emT_TJi^3f*f>!*(99x*V?&S5IuvhW)Y_huFvPsm(ZQKQa6-a{bhB@$}s12UvXx!3j)u+oQ%6z z8GUfotY=J%Io3Tq^7$~+ttV>?u6B#6Km5J3u-mra)>^|}6p5~#A z?QQu>f?Im!GAtbX^B+I^C~`26o#l3_Oy$wyf{+hPt6r}E_o-DU-g5uN>eNPsKb89! Y0}rKDY~v5e0H%KiPgg&ebxsLQ0ERw>MF0Q* literal 0 HcmV?d00001 diff --git a/icon512.png b/icon512.png new file mode 100644 index 0000000000000000000000000000000000000000..c6217c0dbe24c14e08a893e8c6609c3c2180e28d GIT binary patch literal 1746 zcmcIl|2Go~8{cNu6|BxGecr zc8%JGjV_yfTOvl-dfgbIMKZI-tN-DBpL0Iv^PJ~=&hz=Kw4aP{Lye6QBDy z+brb{vQ|SQ@YVjrdI8HB$&e5EqRF*6YlM8g~^~8MZnGcVbWyu zVj1sD>H=|y<9cX$IC=1Xv6m`Z?L6FI zx5jEy$+H8r3*~{AIVAkC#JY%wJ{|jLN1u+`ZV)gnaE~^eLeprP`*?PFZb@w7xtaBF zMw5cdA`fvKlLGuD!CeKRCvhjbl)oKLAC7rh=~J)KPctGsbx8NM|D`ImJE%A)yqxIKUDe$kH<}n4H-CBr4=Xv{a&eNaQPYB6 zTV2hWe@Z)F^r}}!DzWWWO8;3{_0t-S1NGg77#BT3+Wf$KQGi^lV4f7?6gQU41`C>*S3-ez7IJ=kr zed>xW>*xqE34&wVnVMhzn#HH98>tt+{kk^);_l`E=&e8*^F_Z{v?wL{k4i)~Ea#B6 zbO>&%NBp#2-Qc0cw|qm9sH*V2h>^=_2_nA3Z-HM>QT4-N)eS(=$_2)W=i@pRENkef zKxt9lE=@`cSX>a@_{xbM8H>fVrp`$N5dvj(Ov@+JtBi1LN^?TuV{H07>h@aQS3xH_ zq%9i~73na}&R*Dbw@3>=^fh)^c&X86R8K~~(r|6xgb(P_)REG->@%N8&iA08Kc+P* zEX5wt;ZC@D74g2}Z?iv#z6}?T$8;{Pl{>toIdnOcNxiAK7pprrYIa=sv#iy(E6I2HgYGin5rqY&>e}`8qJySa zt+1J`fyC1rI5+K;*X9|UQ6M!3KVwd7_`H**op0L2KWRTYl1&^{q;;5ljet|(oFM<> z`(X&4eGOaKVM&}+M)sAQ1Cl-lm{#efxZEIZ&{qzh+C5!`gugtSvmTW`58XrR#tPr+ znWjzQay0{ppD(RoxJW0T%-{Dvl6+%ufv(m%1+qIR-C6`UC40Z!-jA+wF`5QN$?j~r z&=PjWUp5!|09!1^y=2GPyHt_X%*Dap1PmB~n4Qm2!-N)}Q z1!=(`2Lgzw2i)8AKbtn1scNJab$d@cL*ufeWqCX5p4~EYMDB`6wDqg*;%v|%nrU0r z>g>5=-awG@XRXR{MV!7fH1pq`WbLQ}w8ugZ6H=0vL7wkaR(y)HlsmQvoR+?c(+{ip zWpDtQf(RHWi>ig8U~{F9G<|?KS^QZ8(qC)`I4V?MfCLvrTGoIyQP z)jghl6LD + + + + + + Mobile App Development Room Chat + + + + + +

Welcome to the Monile App Development Chat Room!

+ + + + \ No newline at end of file diff --git a/main.css b/main.css new file mode 100644 index 0000000..992642f --- /dev/null +++ b/main.css @@ -0,0 +1,5 @@ +body{ + background-color: aqua; + color:#eee; + font-family: Arial, Helvetica, sans-serif; +} \ No newline at end of file diff --git a/main.js b/main.js new file mode 100644 index 0000000..acc09bf --- /dev/null +++ b/main.js @@ -0,0 +1,15 @@ + +// Register a service worker, this one located in serviceworker.js +// A service worker is a piece of code the browser runs behind the scenes. +if ('serviceWorker' in navigator) { + console.log('CLIENT: service worker registration in progress.'); + navigator.serviceWorker.register('sw.js').then(function() { + console.log('CLIENT: service worker registration complete.'); + }, function() { + console.log('CLIENT: service worker registration failure.'); + }); + } else { + console.log('CLIENT: service workers are not supported.'); + } + + diff --git a/manifest.json b/manifest.json new file mode 100644 index 0000000..858cd7e --- /dev/null +++ b/manifest.json @@ -0,0 +1,20 @@ +{ + "short_name": "Turn Blue!", + "name": "Turn the page blue!", + "icons": [ + { + "src":"icon192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "icon512.png", + "type": "image/png", + "sizes": "512x512" + } + ], + "start_url": "index.html", + "background_color": "#f00", + "theme_color": "#f00", + "display": "fullscreen" + } \ No newline at end of file diff --git a/sw.js b/sw.js new file mode 100644 index 0000000..12df89d --- /dev/null +++ b/sw.js @@ -0,0 +1,199 @@ +console.log('SERVICE WORKER: executing.'); + +/* A version number is useful when updating the worker logic, + allowing you to remove outdated cache entries during the update. +*/ +var version = 'v1::'; + +/* These resources will be downloaded and cached by the service worker + during the installation process. If any resource fails to be downloaded, + then the service worker won't be installed either. +*/ +var offlineFiles = [ + '', + 'icon192.png', + 'icon512.png', + 'index.html', + 'main.css', + 'main.js' +]; + +/* The install event fires when the service worker is first installed. + You can use this event to prepare the service worker to be able to serve + files while visitors are offline. +*/ +self.addEventListener("install", function(event) { + console.log('WORKER: install event in progress.'); + /* Using event.waitUntil(p) blocks the installation process on the provided + promise. If the promise is rejected, the service worker won't be installed. + */ + event.waitUntil( + /* The caches built-in is a promise-based API that helps you cache responses, + as well as finding and deleting them. + */ + caches + /* You can open a cache by name, and this method returns a promise. We use + a versioned cache name here so that we can remove old cache entries in + one fell swoop later, when phasing out an older service worker. + */ + .open(version + 'fundamentals') + .then(function(cache) { + /* After the cache is opened, we can fill it with the offline fundamentals. + The method below will add all resources in `offlineFiles` to the + cache, after making requests for them. + */ + return cache.addAll(offlineFiles); + }) + .then(function() { + console.log('WORKER: install completed'); + }) + ); +}); + +/* The fetch event fires whenever a page controlled by this service worker requests + a resource. This isn't limited to `fetch` or even XMLHttpRequest. Instead, it + comprehends even the request for the HTML page on first load, as well as JS and + CSS resources, fonts, any images, etc. +*/ +self.addEventListener("fetch", function(event) { + console.log('WORKER: fetch event in progress.'); + + /* We should only cache GET requests, and deal with the rest of method in the + client-side, by handling failed POST,PUT,PATCH,etc. requests. + */ + if (event.request.method !== 'GET') { + /* If we don't block the event as shown below, then the request will go to + the network as usual. + */ + console.log('WORKER: fetch event ignored.', event.request.method, event.request.url); + return; + } + /* Similar to event.waitUntil in that it blocks the fetch event on a promise. + Fulfillment result will be used as the response, and rejection will end in a + HTTP response indicating failure. + */ + event.respondWith( + caches + /* This method returns a promise that resolves to a cache entry matching + the request. Once the promise is settled, we can then provide a response + to the fetch request. + */ + .match(event.request) + .then(function(cached) { + /* Even if the response is in our cache, we go to the network as well. + This pattern is known for producing "eventually fresh" responses, + where we return cached responses immediately, and meanwhile pull + a network response and store that in the cache. + Read more: + https://ponyfoo.com/articles/progressive-networking-serviceworker + */ + var networked = fetch(event.request) + // We handle the network request with success and failure scenarios. + .then(fetchedFromNetwork, unableToResolve) + // We should catch errors on the fetchedFromNetwork handler as well. + .catch(unableToResolve); + + /* We return the cached response immediately if there is one, and fall + back to waiting on the network as usual. + */ + console.log('WORKER: fetch event', cached ? '(cached)' : '(network)', event.request.url); + return cached || networked; + + function fetchedFromNetwork(response) { + /* We copy the response before replying to the network request. + This is the response that will be stored on the ServiceWorker cache. + */ + var cacheCopy = response.clone(); + + console.log('WORKER: fetch response from network.', event.request.url); + + caches + // We open a cache to store the response for this request. + .open(version + 'pages') + .then(function add(cache) { + /* We store the response for this request. It'll later become + available to caches.match(event.request) calls, when looking + for cached responses. + */ + return cache.put(event.request, cacheCopy); + }) + .then(function() { + console.log('WORKER: fetch response stored in cache.', event.request.url); + }); + + // Return the response so that the promise is settled in fulfillment. + return response; + } + + /* When this method is called, it means we were unable to produce a response + from either the cache or the network. This is our opportunity to produce + a meaningful response even when all else fails. It's the last chance, so + you probably want to display a "Service Unavailable" view or a generic + error response. + */ + function unableToResolve () { + /* There's a couple of things we can do here. + - Test the Accept header and then return one of the `offlineFiles` + e.g: `return caches.match('/some/cached/image.png')` + - You should also consider the origin. It's easier to decide what + "unavailable" means for requests against your origins than for requests + against a third party, such as an ad provider. + - Generate a Response programmaticaly, as shown below, and return that. + */ + + console.log('WORKER: fetch request failed in both cache and network.'); + + /* Here we're creating a response programmatically. The first parameter is the + response body, and the second one defines the options for the response. + */ + return new Response('

Service Unavailable

', { + status: 503, + statusText: 'Service Unavailable', + headers: new Headers({ + 'Content-Type': 'text/html' + }) + }); + } + }) + ); +}); + +/* The activate event fires after a service worker has been successfully installed. + It is most useful when phasing out an older version of a service worker, as at + this point you know that the new worker was installed correctly. In this example, + we delete old caches that don't match the version in the worker we just finished + installing. +*/ +self.addEventListener("activate", function(event) { + /* Just like with the install event, event.waitUntil blocks activate on a promise. + Activation will fail unless the promise is fulfilled. + */ + console.log('WORKER: activate event in progress.'); + + event.waitUntil( + caches + /* This method returns a promise which will resolve to an array of available + cache keys. + */ + .keys() + .then(function (keys) { + // We return a promise that settles when all outdated caches are deleted. + return Promise.all( + keys + .filter(function (key) { + // Filter by keys that don't start with the latest version prefix. + return !key.startsWith(version); + }) + .map(function (key) { + /* Return a promise that's fulfilled + when each outdated cache is deleted. + */ + return caches.delete(key); + }) + ); + }) + .then(function() { + console.log('WORKER: activate completed.'); + }) + ); +}); \ No newline at end of file