Skip to content

Instantly share code, notes, and snippets.

View luke-denton-aligent's full-sized avatar
⌨️
Writing code for humans

Luke Denton luke-denton-aligent

⌨️
Writing code for humans
  • Aligent Consulting
  • Adelaide, Australia
View GitHub Profile
@luke-denton-aligent
luke-denton-aligent / serve-skeleton-page.js
Last active July 6, 2019 18:20
This snippet shows how to cache and serve a skeleton page
// Offline Web Applications course on Udacity https://classroom.udacity.com/courses/ud899
//When a browser runs a service worker for the first time, an event is fired within it, 'install'. This can be used
//to trigger functions to download assets and save them to the cache, using the Cache API
//Started with snippet from https://gist.github.com/luke-denton/ef791e5150470814a7a155cd85b1bf80
var staticCacheName = "my-cache-v2"; //Update the cache version
self.addEventListener('install', function(event) {
var urlsToCache = [
@luke-denton-aligent
luke-denton-aligent / create-object-store-indexeddb.js
Last active November 16, 2016 04:01
This snippet shows how to use IndexedDB
// Offline Web Applications course on Udacity https://classroom.udacity.com/courses/ud899
//idb is a plugin that's available to make it easier to work with IndexedDB
//This should all go in a new file, called index.js, in a sub-directory called index-db, or something of the like
//Open a new database, giving it a name, version number and a callback function
var dbPromise = idb.open('test-db', 1, function(upgradeDb) {
var keyValStore = upgradeDb.createObjectStore('keyval');
keyValStore.put('world', 'hello'); //Put the value 'world' into key 'hello' (key/value is seeminlgy back-to-front)
@luke-denton-aligent
luke-denton-aligent / read-from-object-store-indexeddb.js
Last active November 16, 2016 04:01
This snippet shows how to read from an object store in IndexedDB
// Offline Web Applications course on Udacity https://classroom.udacity.com/courses/ud899
//Following on from https://gist.github.com/luke-denton/55be283cbddf6f0c0d362fd95fc9280a
dbPromise.then(function(db) {
var tx = db.transaction('keyval');
var keyValStore = tx.objectStore('keyval');
return keyValStore.get('hello');
}).then(function(val) {
console.log(val); //Log the value of the key 'hello'
@luke-denton-aligent
luke-denton-aligent / add-to-object-store-indexeddb.js
Last active November 16, 2016 04:01
This snippet shows how to add another value to the object store in IndexedDB
// Offline Web Applications course on Udacity https://classroom.udacity.com/courses/ud899
//Again, following on from https://gist.github.com/luke-denton/55be283cbddf6f0c0d362fd95fc9280a
dbPromise.then(function(db) {
var tx = db.transaction('keyval', 'readwrite');
var keyValStore = tx.objectStore('keyval');
keyValStore.put('bar', 'foo');
return tx.complete;
}).then(function() {
@luke-denton-aligent
luke-denton-aligent / indexeddb-objects-in-object-store.js
Last active November 16, 2016 04:01
These snippets show how to work with putting objects into the IndexedDB database, not just simple string key/values
// Offline Web Applications course on Udacity https://classroom.udacity.com/courses/ud899
//This should all go into an indexed-db index.js file
//Again, idb is a plugin used to make working with IndexedDB easier
//Difference between this and https://gist.github.com/luke-denton/55be283cbddf6f0c0d362fd95fc9280a, version has been upgraded
var dbPromise = idb.open('test-db', 2, function() {
switch(upgradeDb.oldVersion)
case 0:
var keyValStore = upgradeDb.createObjectStore('keyval');
@luke-denton-aligent
luke-denton-aligent / cursors-indexeddb.js
Last active November 16, 2016 04:00
This snippet shows how to user cursors with IndexedDB to loop through results
// Offline Web Applications course on Udacity https://classroom.udacity.com/courses/ud899
//Starting with "Group data together using indexes" snippet in https://gist.github.com/luke-denton/193fd42e9fcfe6e2f1e8b6c4de58dc4e
//Basically a complicated way of calling getAll()
dbPromise.then(function(db) {
var tx = db.transaction('people');
var peopleStore = tx.objectStore('people');
var superheroIndex = peopleStore.index('superhero');
@luke-denton-aligent
luke-denton-aligent / caching-images.js
Created November 16, 2016 05:46
This snippet shows how to cache images and serve them from the cache, if available
var contentImgsCache = 'my-content-imgs'; //Set up the name of the cache for the images. This will be different to the normal cache, as images will likely be persisted for longer
self.addEventListener('fetch', function(event) {
var requestUrl = new URL(event.request.url);
//See previous snippets for explanation of this
if (requestUrl.origin === location.origin) {
if (requestUrl.pathname.startsWith('/photos/')) {
event.respondWith(servePhoto(event.request));
return;
@luke-denton-aligent
luke-denton-aligent / isValidAsset Snippet
Created October 12, 2017 04:31
A snippet of code to be added to the \Magento\Framework\View\Asset\Bundle\Manager::isValidAsset function, to create a list of JS files associated with an M2 storefront
$destinationFile = "assets/js.txt";
$name = $asset->getPath();
$nameParts = explode('.', $name);
$extension = array_pop($nameParts);
if ($extension == 'js') {
file_put_contents($destinationFile, $name.PHP_EOL , FILE_APPEND | LOCK_EX);
}
@luke-denton-aligent
luke-denton-aligent / checkout_files.txt
Last active December 14, 2018 21:06
A list of JS files that are loaded for the checkout of an M2 storefront
Magento_Checkout/js/discount-codes
Magento_Checkout/js/shopping-cart
Magento_Checkout/js/region-updater
Magento_Checkout/js/sidebar
Magento_Checkout/js/checkout-loader
Magento_Checkout/js/checkout-data
Magento_Checkout/js/proceed-to-checkout
Magento_Checkout/js/action/place-order
Magento_Checkout/js/action/set-payment-information
Magento_Checkout/js/model/shipping-rate-service
@luke-denton-aligent
luke-denton-aligent / processCheckoutJs.php
Created October 12, 2017 04:33
A file to process 2 lists, removing the entries from the first list that occur in the second list, and creating a txt file with the resultant list
<?php
$listOfFiles = 'assets_js.txt';
$listOfCheckoutFiles = 'assets_checkout_files.txt';
$outputOfNonCheckoutFiles = 'assets_non-checkout_files.txt';
$files = file($listOfFiles, FILE_IGNORE_NEW_LINES);
$checkoutFiles = file($listOfCheckoutFiles , FILE_IGNORE_NEW_LINES);
$nonCheckoutFiles = [];