Skip to content

Instantly share code, notes, and snippets.

@gt3
gt3 / customevent-polyfill.js
Last active March 1, 2022 11:50
custom event polyfill for IE 11 (>= 9 really)
// source: https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent
;(function() {
if (typeof window.CustomEvent === "function") return false
function CustomEvent(event, params) {
params = params || { bubbles: false, cancelable: false, detail: undefined }
var evt = document.createEvent("CustomEvent")
evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail)
return evt
}
function pipe(...fns) {
function invoke(v) {
return fns.reduce((acc, fn) => (fn ? fn.call(this, acc) : acc), v)
}
return invoke
}
let i=1, fn = m => console.log(i++,m)
let piped = pipe.bind(null, fn)
piped = piped.bind(null, fn)
let a1 = Array(3).map(x => 42) // => [undefined,undefined,undefined]
let a2 = Array.from(Array(3), x => 42) // => [42, 42, 42]
@gt3
gt3 / shieldProps.js
Last active June 1, 2017 00:20
shieldProps writeable prop error
const flattenToObj = (arr, base = {}) => Object.assign(base, ...arr)
function shieldProps(t, ...keys) {
let keep = flattenToObj(Object.keys(t).filter(k => !keys.includes(k)).map(k => ({ [k]: t[k] })))
return Object.setPrototypeOf(keep, t)
}
let o = { s: 'xxx'}
Object.defineProperty(o, 't', { value: {v: 'yyy'}, writable: false, enumerable: true })
let a = shieldProps(o, 't')
function findPath(specs, pathKey) {
let result
specs.find(spec => !!(result = spec.find(pathKey)))
return result
}
function addPrefix(prefix, path) {
return isStr(prefix) && path.indexOf(prefix) !== 0 ? `${prefix}${path}` : path
}
@gt3
gt3 / future.js
Created June 25, 2017 14:42
future/deferred with promise api
let promise = ctx => new Promise((resolve, reject) => Object.assign(ctx, {resolve, reject}))
function future(o = {}) {
let p = promise(o)
return Object.assign(o, { onValue: p.then.bind(p) })
}
function fn() {
let f = future()
f.onValue(n => console.log(n))
@gt3
gt3 / replaceAt.js
Last active June 20, 2019 04:23
replace array element at specified index
function replace<T>(arr: Array<T>, i: number, val: T) {
const end = i >= (arr.length-1) ? arr.length : i+1;
return [...arr.slice(0, i < 0 ? 0 : i), val, ...arr.slice(-(arr.length-end)||arr.length)];
}
console.log(replace([],0,99))
console.log(replace([1,2,3],0,99))
console.log(replace([1,2,3],1,99))
console.log(replace([1,2,3],-1,99))
@gt3
gt3 / index.js
Last active July 25, 2017 18:26
eslint-config
module.exports = exports = {
"env": {
"es6": true,
"node": true,
"browser": true
},
"parserOptions": {
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
/* Use flexible layout with flexbox */
/* source: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes */
#main {
display: flex;
}
#main > article {
flex: 3 1 54%;
order: 2;
@gt3
gt3 / reset.min.css
Created July 9, 2017 03:26
reset css
/* reset.css by @rich_clark */
article,aside,details,figcaption,figure,footer,header,hgroup,hr,menu,nav,section{display:block}a,hr{padding:0}abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}ins,mark{background-color:#ff9;color:#000}body{line-height:1}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{margin:0;font-size:100%;vertical-align:baseline;background:0 0}ins{text-decoration:none}mark{font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;bo