Skip to content

Instantly share code, notes, and snippets.

Adam Brewer adamcbrewer

Block or report user

Report or block adamcbrewer

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
@pizza-r0b
pizza-r0b / 01_DropZone.jsx
Last active Nov 14, 2017
HTML5 Drag and Drop File Upload React Component
View 01_DropZone.jsx
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
const ANIMATION_DURATION = 1000;
class BatchDropZone extends React.Component {
static propTypes = {
@paulirish
paulirish / what-forces-layout.md
Last active Jun 26, 2019
What forces layout/reflow. The comprehensive list.
View what-forces-layout.md

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()
View gulpfile.babel.js
/*
* Steps
* 1. Rename your gulpfile.js to gulpfile.babel.js
* 2. Add babel to your package.json (npm install -D babel)
* 3. Start writing ES6 in your gulpfile!
*/
import gulp from 'gulp'; // ES6 imports!
import sass from 'gulp-sass';
@lukes
lukes / rant.js
Created Dec 18, 2014
<rant> to actual rant
View rant.js
// <rant> to actual rant
// (requires modern browsers)
var rants = document.getElementsByTagName('rant');
for (i=0;i<rants.length;i++) {
var rant = new SpeechSynthesisUtterance(rants[i].innerHTML);
window.speechSynthesis.speak(rant);
}
@stugoo
stugoo / Gruntfile.js
Created Apr 1, 2014
Grunt, scss and hbs for turning svgs into icons and pngs,
View Gruntfile.js
// requires
/*
* https://github.com/filamentgroup/grunticon
* https://www.npmjs.org/package/grunt-text-replace
*/
'use strict';
module.exports = function (grunt) {
@apisandipas
apisandipas / _html_entities.scss
Created Jan 14, 2014
HTML Entities map - The pseudo-element 'content' property doesnt accept normal (&raquo;) style HTML entities. These variables below easy the pain of looking up the HEX codes...
View _html_entities.scss
/**
* The pseudo-element 'content' property doesnt accept normal (&raquo;) style
* HTML entities. These variables below easy the pain of looking up the HEX codes...
*
* Referenced from http://www.danshort.com/HTMLentities/
*
* TODO: Add all the other entities? Worth it? Some day? Maybe?
*/
// Punctuation
@sindresorhus
sindresorhus / post-merge
Last active Jun 15, 2019
git hook to run a command after `git pull` if a specified file was changed.In this example it's used to run `npm install` if package.json changed and `bower install` if `bower.json` changed.Run `chmod +x post-merge` to make it executable then put it into `.git/hooks/`.
View post-merge
#!/usr/bin/env bash
# MIT © Sindre Sorhus - sindresorhus.com
# git hook to run a command after `git pull` if a specified file was changed
# Run `chmod +x post-merge` to make it executable then put it into `.git/hooks/`.
changed_files="$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)"
check_run() {
echo "$changed_files" | grep --quiet "$1" && eval "$2"
@kerimdzhanov
kerimdzhanov / random.js
Last active Jun 26, 2019
JavaScript: get a random number from a specific range
View random.js
/**
* Get a random floating point number between `min` and `max`.
*
* @param {number} min - min number
* @param {number} max - max number
* @return {number} a random floating point number
*/
function getRandomFloat(min, max) {
return Math.random() * (max - min) + min;
}
View concat.js
module.exports = {
options: {
separator: ';'
},
dist: {
src: ['src/**/*.js'],
dest: 'dist/<%= pkg.name %>.js'
}
}
@stugoo
stugoo / jquery-test.js
Last active Dec 19, 2015
Modernizr Test for jQuery 2.0
View jquery-test.js
/* REQUIRES http://modernizr.com/download/#-addtest-json-script_defer-load */
(function(window, document, Modernizr, undefined) {
'use strict';
Modernizr.addTest('jQueryVersion', function() {
return (
Modernizr.json &&
Modernizr.scriptdefer &&
You can’t perform that action at this time.