Skip to content

Instantly share code, notes, and snippets.

View PhilJ's full-sized avatar

Philipp Schächtele PhilJ

12 followers · 6 following
View GitHub Profile
@PhilJ
PhilJ / register-serviceworker.js
Last active March 31, 2016 10:49
Use the new cache API to make the browser cache assets for offline functionality and register service worker to return cached assets.
// register service worker
navigator.serviceWorker.register('service-worker-cache-images.js', { scope: './' })
.then(navigator.serviceWorker.ready)
.then(function () {
console.log('service worker registered')
})
.catch(function (error) {
console.log('error when registering service worker', error, arguments)
});
@PhilJ
PhilJ / cache-assets.js
Created March 31, 2016 10:48
Helper to write files to browser cache
// all urls will be added to cache
function cacheAssets( assets ) {
return new Promise( function (resolve, reject) {
// open cache
caches.open('assets')
.then(cache => {
// the API does all the magic for us
cache.addAll(assets)
.then(() => {
console.log('all assets added to cache')
@PhilJ
PhilJ / service-worker-cache-images.js
Last active September 7, 2021 07:35
// this is the service worker which intercepts all http requests
self.addEventListener('fetch', function fetcher (event) {
var request = event.request;
// check if request
if (request.url.indexOf('assets.contentful.com') > -1) {
// contentful asset detected
event.respondWith(
caches.match(event.request).then(function(response) {
// return from cache, otherwise fetch from network
return response || fetch(request);
@PhilJ
PhilJ / srcset-demo.html
Last active February 3, 2019 17:54
srcset Demo
<!DOCTYPE html>
<html>
<body>
<div style="margin: 0 auto; max-width: 960px">
<img src="https://via.placeholder.com/960"
srcset="https://via.placeholder.com/320 320w,
https://via.placeholder.com/640 640w,
https://via.placeholder.com/960 960w,
https://via.placeholder.com/1400 1400w"
sizes="(min-width: 960px) 960px, 100vw"
@PhilJ
PhilJ / getBucketColumns.js
Last active May 13, 2020 18:10
Copy Google Analytic Speed Data for Buckets
// Returns labels (column names) matching the result list of prepareSpreadsheetRow() below
function getBucketColumns () {
// select els of main bucket labels
var mainColumnEls = document.querySelectorAll('._GAOKb._GAznb ._GAlIb');
// select els of detail bucket labels
var detailColumnEls = document.querySelectorAll('.C_ADVANCEDHISTOGRAMTABLE_SUBBUCKET_GROUP ._GAlIb');
var columnNames = ["Start Date", "End Date", "Avg Load Time", "No of samples"];
mainColumnEls.forEach(function (e) {
columnNames.push(e.innerText);
});
@PhilJ
PhilJ / brello.scss
Created December 6, 2021 13:35
Trello Stylesheet for Breeze
.contain {
background-color: #668edb;
}
.project-actions a {
background: rgba(255,255,255,0.3);
padding: 5px 10px;
color: #fff
}