Skip to content

Instantly share code, notes, and snippets.

View pinkhominid's full-sized avatar

John Ericson pinkhominid

44 followers · 260 following
View GitHub Profile
@pinkhominid
pinkhominid / index.html
Last active May 14, 2020 13:15
Small index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title></title>
</head>
<body>
</body>
</html>
@pinkhominid
pinkhominid / index.html
Created March 13, 2020 20:11
Is your site/app iframeable?
<style>
body {
margin: 0;
min-height: 100vh;
display: flex;
flex-direction: column;
}
iframe { flex-grow: 1 }
</style>
<script type=module>
@pinkhominid
pinkhominid / url-utils.js
Created March 29, 2020 14:51
Are URL Origins Equal?
export function areUrlOriginsEqual(url1, url2) {
const u1 = new URL(url1);
const u2 = new URL(url2);
return u1.origin === u2.origin;
}
@pinkhominid
pinkhominid / index.js
Last active April 22, 2020 03:16
findSpliceUndo()
// Find, Splice, Undo
function findSpliceUndo(arr, findCallback) {
const idx = arr.findIndex(findCallback)
if (idx < 0) return
const removedArr = arr.splice(idx, 1)
return () => arr.splice(idx, 0, removedArr[0])
}
@pinkhominid
pinkhominid / index.html
Last active May 22, 2020 21:34
Minimal Lit Element Starter
<!--
mkdir hello-world
cd hello-world
npm init -y
npm i es-module-shims lit-element
curl -O https://gist.githubusercontent.com/pinkhominid/301007797a306c949770f24f2a74c9a8/raw/b963f6205c2436f994b7e32182247d9a1cf1aba5/index.html
npm i -D http-server
npx http-server -o
-->
<script defer src="./node_modules/es-module-shims/dist/es-module-shims.js"></script>
@pinkhominid
pinkhominid / dedent.js
Created August 22, 2020 02:58
Dedent code block
export function dedent(code) {
let spacesToTrim;
return code.split('\n').reduce((acc, line) => {
if (line.trim().length) {
if (spacesToTrim === undefined) {
spacesToTrim = /^\s*/.exec(line)[0].length;
}
acc += line.substring(spacesToTrim) + '\n';
} else acc += '\n';
return acc;
@pinkhominid
pinkhominid / attributeToggleBehavior.js
Created August 22, 2020 03:05
Simple attribute toggle behavior
import { eventPathTargetMatch } from 'https://gist.githubusercontent.com/pinkhominid/8bd98fa6741fb7327ef91724dc9e5590/raw/8c09c01ea7836f9dcdc0867e5a51851430b703b4/eventPathTargetMatch.js';
document.addEventListener('click', e => {
const target = eventPathTargetMatch(e, 'button[aria-controls]');
if (!target) return;
document
.querySelector(`#${target.getAttribute('aria-controls')}`)
.toggleAttribute(target.value);
});
@pinkhominid
pinkhominid / node-env-hack.js
Last active October 8, 2022 11:13
Browser workaround for missing process.env.NODE_ENV
// Hack for immer esm (see https://github.com/immerjs/immer/issues/557)
// and others that suffer the same
window.process = { ...window.process, env: { ...window?.process?.env, NODE_ENV: 'production' } };
@pinkhominid
pinkhominid / memoize.js
Last active December 1, 2020 02:55
General use memoize
// derived from https://www.30secondsofcode.org/blog/s/javascript-memoization
export function memoize(fn) {
new Proxy(fn, {
cache: new Map(),
apply(target, thisArg, argsList) {
let cacheKey = JSON.stringify(argsList);
if (!this.cache.has(cacheKey)) this.cache.set(cacheKey, target.apply(thisArg, argsList));
return this.cache.get(cacheKey);
},
});
@pinkhominid
pinkhominid / is-elem-overflown.js
Created November 19, 2020 03:49
Is Element Overflown?
export function isElemOverflown({ clientWidth, scrollWidth }) { return scrollWidth > clientWidth; }