remove extra clear cache button and isolate cache code (#609)

* remove extra clear cache button

* isolate cache code

* changes
This commit is contained in:
Mridul97
2019-01-06 03:58:11 +05:30
committed by Jeffrey Warren
parent 6d9f656a1e
commit 595d66ecd5
4 changed files with 75 additions and 42 deletions

View File

@@ -200,41 +200,7 @@ window.onload = function() {
}
});
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('sw.js', { scope: '/examples/' })
.then(function(registration) {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
console.log(installingWorker)
if (installingWorker.state === 'installed') {
location.reload();
}
}
console.log('Registration successful, scope is:', registration.scope);
})
.catch(function(error) {
console.log('Service worker registration failed, error:', error);
});
}
if ('serviceWorker' in navigator) {
caches.keys().then(function(cacheNames) {
cacheNames.forEach(function(cacheName) {
$("#clear-cache").append(" " + cacheName);
});
});
}
$("#clear-cache").click(function() {
if ('serviceWorker' in navigator) {
caches.keys().then(function(cacheNames) {
cacheNames.forEach(function(cacheName) {
caches.delete(cacheName);
});
});
}
location.reload();
});
setupCache();
function updatePreviews(src) {
$('#addStep img').remove();

View File

@@ -21,6 +21,7 @@
<script src="lib/defaultHtmlStepUi.js" charset="utf-8"></script>
<script src="lib/defaultHtmlSequencerUi.js" charset="utf-8"></script>
<script src="lib/intermediateHtmlStepUi.js" charset="utf-8"></script>
<script src="lib/cache.js" charset="utf-8"></script>
<script src="demo.js" charset="utf-8"></script>
<!-- for crop module: -->
<script src="../node_modules/imgareaselect/jquery.imgareaselect.dev.js"></script>
@@ -185,12 +186,6 @@
<button><i class="fa fa-arrow-circle-o-up"></i></button>
</form>
<footer>
<hr style="margin:20px;"><center><a class="color:grey;" id="clear-cache">Clear offline cache</a></center>
</footer>
<script type="text/javascript">
$(function() {
var sequencer;

37
examples/lib/cache.js Normal file
View File

@@ -0,0 +1,37 @@
var setupCache = function() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('sw.js', { scope: '/examples/' })
.then(function(registration) {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
console.log(installingWorker)
if (installingWorker.state === 'installed') {
location.reload();
}
}
console.log('Registration successful, scope is:', registration.scope);
})
.catch(function(error) {
console.log('Service worker registration failed, error:', error);
});
}
if ('serviceWorker' in navigator) {
caches.keys().then(function(cacheNames) {
cacheNames.forEach(function(cacheName) {
$("#clear-cache").append(" " + cacheName);
});
});
}
$("#clear-cache").click(function() {
if ('serviceWorker' in navigator) {
caches.keys().then(function(cacheNames) {
cacheNames.forEach(function(cacheName) {
caches.delete(cacheName);
});
});
}
location.reload();
});
}

35
examples/lib/sw.js Normal file
View File

@@ -0,0 +1,35 @@
const staticCacheName = 'image-sequencer-static-v3';
self.addEventListener('install', event => {
console.log('Attempting to install service worker');
});
self.addEventListener('activate', function(e) {
console.log('[ServiceWorker] Activate');
e.waitUntil(
caches.keys().then(function(cacheNames) {
return Promise.all(
cacheNames.filter(function(cacheName){
return cacheName.startsWith('image-sequencer-') &&
cacheName != staticCacheName;
}).map(function(cacheName){
return caches.delete(cacheName);
})
);
})
);
});
self.addEventListener('fetch', function(event) {
event.respondWith(
caches.open(staticCacheName).then(function(cache) {
return cache.match(event.request).then(function (response) {
return response || fetch(event.request).then(function(response) {
if(event.request.method == "GET")
cache.put(event.request, response.clone());
return response;
});
});
})
);
});