| function mapValues(obj, fn) { | |
| return Object.keys(obj).reduce((result, key) => { | |
| result[key] = fn(obj[key], key); | |
| return result; | |
| }, {}); | |
| } | |
| function pick(obj, fn) { | |
| return Object.keys(obj).reduce((result, key) => { | |
| if (fn(obj[key])) { |
I hereby propose this form of let usage as the next best option, since the clearly better let (foo = 42) { ... } let-block-statement syntax is dead and not coming to ES6:
/*let*/ { let foo = 42;
// your code that uses `foo`
}Every time I start a new project, I want to pull in a log function that allows the same functionality as the console.log, including the full functionality of the Console API.
There are a lot of ways to do this, but many are lacking. A common problem with wrapper functions is that the line number that shows up next to the log is the line number of the log function itself, not where log was invoked. There are also times where the arguments get logged in a way that isn't quite the same as the native function.
This is an attempt to once and for all document the function that I pull in to new projects. There are two different options:
| function whichTransitionEvent(){ | |
| var t; | |
| var el = document.createElement('fakeelement'); | |
| var transitions = { | |
| 'transition':'transitionend', | |
| 'MSTransition':'msTransitionEnd', | |
| 'MozTransition':'transitionend', | |
| 'WebkitTransition':'webkitTransitionEnd' | |
| } |
| @media only screen and (min-width: 320px) { | |
| /* Small screen, non-retina */ | |
| } | |
| @media | |
| only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px), | |
| only screen and ( min--moz-device-pixel-ratio: 2) and (min-width: 320px), | |
| only screen and ( -o-min-device-pixel-ratio: 2/1) and (min-width: 320px), |
| function inferInputModel() { | |
| if (window.navigator.msPointerEnabled) { | |
| return 'pointer'; | |
| } else if (window.ontouchstart !== undefined) { | |
| return 'touch'; | |
| } else { | |
| return 'unknown'; | |
| } | |
| } |
| @mixin whitespace($sizes: (5, 10, 20)){ //for now assume this list is always ascending | |
| if length($sizes = 1){ | |
| } @else if length($sizes = 2) { | |
| } | |
| $types: (p,m); | |
| $locations: (a, v, h, t, r, b, l); | |
| $key: (p padding, m margin, a, v -top -bottom, h -left -right, t -top, r -right, b -bottom, l -left); | |
| @each $location in $locations { |
| function showEms() { | |
| var windowWidth = $(window).width(); | |
| var bodyFontSize = $('body').css('font-size'); | |
| var bodyFontSizeWithoutPx = parseInt(bodyFontSize); | |
| var emValue = windowWidth/bodyFontSizeWithoutPx; | |
| $('.screen-width').text(' ' + emValue + 'em'); | |
| } | |
| // or you could do |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset=utf-8 /> | |
| <title>Hello</title> | |
| <link rel="stylesheet" href="styles.css"> | |
| </head> | |
| <body> | |
| Hello World | |
| </body> |
