Created
September 1, 2017 13:35
-
-
Save formatkaka/e9a854c104089f01b6c8251b3b0fc330 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-social/5.1.1/bootstrap-social.min.css" /> | |
| <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" /> | |
| <meta charset="utf-8"> | |
| </head> | |
| <body> | |
| <button onclick="save()">Save</button> | |
| <button onclick="loadImageUsingJquery()">jquery</button> | |
| <button onclick="loadImageUsingPreload()">Preload</button> | |
| <img id="image"> | |
| <!-- <div my-directive some-attr="theirUrl" my-link-text="Go to google.com"></div> --> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/PreloadJS/0.6.0/preloadjs.min.js"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> | |
| <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script> --> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.min.js"></script> | |
| <script> | |
| var preload = new createjs.LoadQueue(); | |
| navigator.serviceWorker.register('/sw.js').then(function() { | |
| if (!navigator.serviceWorker.controller) return; | |
| console.log('registered worker'); | |
| }) | |
| var imgUrl = 'https://www.w3schools.com/css/paris.jpg'; | |
| function save() { | |
| caches.open('staticCache').then(function(cache) { | |
| var request = new Request(imgUrl); | |
| var url = new URL(request.url); | |
| if (url.origin != location.origin) { | |
| request = new Request(imgUrl, { mode: 'no-cors' }); | |
| } | |
| return fetch(request).then(function(response) { | |
| var cachedCopy = response.clone(); | |
| return cache.put(request, cachedCopy); | |
| }); | |
| }).catch(function(err) { | |
| console.log("err", err); | |
| }) | |
| }; | |
| function loadImageUsingJquery() { | |
| jQuery("#image").attr('src', imgUrl); | |
| }; | |
| function loadImageUsingPreload() { | |
| preload.on('complete', completed); | |
| preload.loadFile({ id: 'someid', src: imgUrl, crossOrigin: "Anonymous" }) | |
| }; | |
| function completed() { | |
| var image = preload.getResult("someid"); | |
| document.body.append(image); | |
| }; | |
| </script> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| * @Author: siddhant | |
| * @Date: 2017-08-28 16:20:30 | |
| * @Last Modified by: siddhant | |
| * @Last Modified time: 2017-08-28 18:49:48 | |
| */ | |
| self.addEventListener('fetch', function(event) { | |
| // var event = JSON.parse(JSON.stringify(event)); | |
| event.respondWith( | |
| caches.match(event.request).then(function(response) { | |
| console.log(event.request); | |
| if (!response) { | |
| return fetch(event.request); | |
| }; | |
| console.log(response); | |
| return response; | |
| })); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment