Skip to content

Instantly share code, notes, and snippets.

Nora Brown nabrown

Block or report user

Report or block nabrown

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@nabrown
nabrown / setNextInvoiceNumber.js
Last active Apr 1, 2019
Fetch the highest record from an Airtable base called 'Invoices', add 1
View setNextInvoiceNumber.js
setNextInvoiceNumber(){
base('Invoices').select({
maxRecords: 1,
sort: [{field: "Number", direction: "desc"}]
}).firstPage((err, records) => {
records.forEach((record) => {
this.invoiceNumber = record.get('Number') + 1
});
}, function done(err) {
if (err) { console.error(err); return; }
@nabrown
nabrown / html-vue-boilerplate.json
Last active Jan 25, 2019
HTML Boilerplate w/ Vue Snippet for VS Code
View html-vue-boilerplate.json
{
"HTML/Vue Boilerplate": {
"prefix": "bpv",
"body": [
"<!DOCTYPE html>",
"<html lang=\"en\">",
"$BLOCK_COMMENT_START",
" $CURRENT_MONTH/$CURRENT_DATE/$CURRENT_YEAR",
" ${1:Description}",
"$BLOCK_COMMENT_END",
@nabrown
nabrown / unveil.js
Created Nov 30, 2018
Complete Unveil plugin, rewritten without jQuery
View unveil.js
;(function() {
this.unveil = function(threshold, callback){
var w = window,
th = threshold || 0,
images = [].slice.call(document.querySelectorAll("img.unveil"));
// test for browser support of `once` option for events
// https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Safely_detecting_option_support
var onceSupported = false;
@nabrown
nabrown / jquery.unveil.js
Last active Nov 30, 2018
Complete jQuery Unveil plugin
View jquery.unveil.js
/**
* jQuery Unveil
* A very lightweight jQuery plugin to lazy load images
* http://luis-almeida.github.com/unveil
*
* Licensed under the MIT license.
* Copyright 2013 Luís Almeida
* https://github.com/luis-almeida
*
* Updated by Nora Brown to include `srcset`
@nabrown
nabrown / unveil-func-vanilla.js
Last active Nov 30, 2018
Unveil() function rewritten without jQuery
View unveil-func-vanilla.js
function unveil() {
// create an array of images that are in view
// by filtering the intial array
var inview = images.filter(function(img) {
// if the image is set to display: none
if (img.style.display === "none") return;
var rect = img.getBoundingClientRect(),
wt = window.scrollY, // window vertical scroll distance
wb = wt + w.innerHeight, // last point of document visible in browser window
@nabrown
nabrown / unveil-func-jquery.js
Last active Nov 30, 2018
Unveil() function from jQuery.unveil.js
View unveil-func-jquery.js
function unveil() {
// create an array of images that are in view
// by filtering the intial array
var inview = images.filter(function() {
var $img = $(this);
// if the image is hidden, don't bother
if ($img.is(":hidden")) return;
var wt = $w.scrollTop(), // window vertical scroll distance
wb = wt + $w.height(), // last point of document visible in browser window
@nabrown
nabrown / MutationObserver-attributes.js
Created Sep 12, 2018
Using a mutation observer to watch for attribute changes
View MutationObserver-attributes.js
(function() {
// Select the node to observe
var targetNode = document.querySelector('.sqs-add-to-cart-button');
// The class we'll watch for
var className = 'cart-added';
// If the targetNode exists on our page
if(targetNode){
@nabrown
nabrown / MutationObserver-childList.js
Last active Sep 12, 2018
Using a mutation observer to watch for added child nodes
View MutationObserver-childList.js
(function() {
// Select the node to observe
var targetNode = document.querySelector('#sqs-cart-root');
// If the targetNode exists on our page
if(targetNode){
// Watch when nodes are added to targetNode, or its descendants
var config = {
@nabrown
nabrown / FigureFunctionalSFC.vue
Created Jul 28, 2018
A functional, single-file component
View FigureFunctionalSFC.vue
<template functional>
<figure :class="props.type" v-on:click="listeners.click">
<img :src="props.src" />
<figcaption v-if="slots().default">
<span><slot></slot></span>
</figcaption>
<div class="tags" v-if="props.tags && props.type != 'framed'">
<span v-for="tag in props.tags"> {{ tag }}</span>
</div>
</figure>
@nabrown
nabrown / FigureFunctionalRF.js
Created Jul 27, 2018
A functional component using a render function
View FigureFunctionalRF.js
export default {
functional: true,
props: {
src: {
required: true,
type: String
},
type: {
required: true,
type: String
You can’t perform that action at this time.