Skip to content

Instantly share code, notes, and snippets.

View brookjordan's full-sized avatar

Brook Jordan brookjordan

View GitHub Profile
@brookjordan
brookjordan / paint-timing.js
Created May 6, 2020 03:56
Print paint performance metrics
console.log(` ‾‾‾‾
Paint time for ${location}:${
performance.getEntriesByType("paint").map(({ name, startTime }) => `
• ${name}: ${startTime}ms`)}
____`);
@brookjordan
brookjordan / base-64-numbers.js
Last active December 28, 2019 08:48
Convert numbers to base 64
(function() {
const BASE_64_CHARS = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz+/'.split('');
Number.prototype._toString = Number.prototype.toString;
window._parseInt = window.parseInt;
Number.prototype.toString = function(base) {
if (base < 37 && base >= 2) {
return Number.prototype._toString.call(this, ...arguments);
@brookjordan
brookjordan / pointerLockElement-test.js
Last active November 18, 2019 09:32
Trying out pointerLockElement
let cursorWidth = 14;
let cursorHeight = 20;
let pointerOffsetX = 2;
let pointerOffsetY = 3;
let c = document.createElement('div');
c.style.cssText = `
width: ${cursorWidth}px;
height: ${cursorHeight}px;
position: fixed;
@brookjordan
brookjordan / add-find-translation-file.notmin.js
Last active September 2, 2019 05:04
Find the path to a TradeGecko i18n translation
const mode = process.env.MODE || 'STRICT';
const isCaseInsensitive = mode.includes('i');
const isSubstring = mode.includes('s');
const isVerbose = mode.includes('v');
console.log(`Searching for string '${process.env.FIND}'${
mode === 'STRICT'
? ''
: isSubstring
? ' in substring mode'
@brookjordan
brookjordan / deal-with-promises-as-they-resolve.js
Created March 7, 2019 06:36
Callback a list of promises in the order in which they complete.
/**
* Used like:
* dealWithPromisesAsTheyResolve([
* new Promise((res, rej) => setTimeout(res, 2000, 2000)),
* new Promise((res, rej) => setTimeout(res, 1000, 1000)),
* new Promise((res, rej) => setTimeout(res, 4000, 4000)),
* new Promise((res, rej) => setTimeout(res, 0, 0)),
* new Promise((res, rej) => setTimeout(rej, 3000, 3000)),
* ], num => console.log(num), err => console.log(`error: ${err}`));
*
@brookjordan
brookjordan / accounting.js
Last active March 2, 2019 16:03
Functions that deal with numbers when accuracy is more important than speed
class Accounting {
static largestNumber = 10e9; // America's annual budget is ~4tn
static accuracy = (function() {
let accuracy = 1;
while (Accounting.largestNumber * accuracy < Number.MAX_SAFE_INTEGER) {
accuracy *= 10;
}
return accuracy;
}()); // to change to #accuracy when support rises
@brookjordan
brookjordan / contain-in-proportion.scss
Created February 23, 2019 08:03
SCSS Mixins to help create a container than stays as full-screen as possible while maintaining given proportions
$aspect-y: 16;
$aspect-x: 9;
$min-height: 80px;
$min-width: 160px;
$max-height: 900px;
$max-width: 1700px;
@mixin contain($aspect-y, $aspect-x) {
@brookjordan
brookjordan / rgb-2-hsl.css
Created February 23, 2019 07:56
Convert rgb colours to hsl colours in pure css
:root {
--r: 200;
--g: 100;
--b: 50;
--r1: calc(var(--r) / 255);
--r2: calc(var(--r1) * 100%);
--g1: calc(var(--g) / 255);
--g2: calc(var(--g1) * 100%);
--b1: calc(var(--b) / 255);
@brookjordan
brookjordan / number-date-extensions.js
Last active August 6, 2019 05:47
Appends the Number prototype with date related functions
/*
* let a = 1;
* let an = 1;
* let some = 2;
*
* Currently supports:
* - a.day.ago
* - some.days.ago
* - a.week.ago
* - some.weeks.ago
import Component from '@ember/component';
export default Component.extend({
classNames: [
'notification-center-item',
],
});