spoike

// Needs RequireJS's `require` and mocha's `before`

/**
 * Works like mocha's `before` function but enables you to load in dependencies
 * as well.
 * 
 * @param deps [Array] the dependencies passed on to RequireJS
 * @param callback [Function] the callback with loaded dependencies as arguments
 */
requireBefore = function(deps, callback) {

spoike

Chai assert Cheatsheet

Note that the assert object is not chainable. Link to assert docs.

• assert(expression, message)

• assert.fail(actual, expected, [message], [operator])

• assert.ok(object, [message])

spoike

// Here is a quick tutorial on how to create a functor, an object that acts
// both as function and an object of functions (e.g. much like jQuery's globally 
// available $ object)

// This is a factory method that creates the functor for us:
function createFunctor() {
  
  // Declared variables are scoped within the createFunctor function
  // so they are practically private:
  var name = 'World';

spoike

@mixin keyframesteps($name, $steps, $startx, $endx) {
    @keyframes #{$name}
    {
        @for $i from 0 through $steps {
            $diff: ($endx - $startx) / $steps;
            #{($i/$steps*100)}% {
                $x: ($i * $diff) + $startx;
                background-position: $x 0;
            }
        }

spoike

ReactJS Component Cheatsheet

To create a ReactComponent:

ReactComponent React.createClass(object proto)

Basic JSX example:

var TitleComponent = React.createClass({

// REQUIRED

spoike

// Adds pluckRef method to lodash
// Example: _.(array, 'key1.key2.key3');
// Goes through each object of the array and attempts to pluck objects that are
// in the specified object chain path. It filters away undefined values.
_.mixin({
    'pluckRef': function(arr, keyPathRef) {
        var i, j, keys, key, ref, output = [];
        keys = keyPathRef.split('.');
        
        // for each object in the array

spoike

Flexbox Cheatsheet

Flex Container

• display: flex | inline-flex
• flex-direction: row | row-reverse | column | column-reverse
• flex-wrap: nowrap | wrap | wrap-reverse
• justify-content: flex-start | flex-end | center | space-between | space-around
• align-items: flex-start | flex-end | center | baseline | stretch
• align-content: flex-start | flex-end | center | space-between | space-around | stretch

spoike

<snippet>
    <content><![CDATA[define([${1}], function(${2}) {
    ${0}
});]]></content>
    <tabTrigger>def</tabTrigger>
    <scope>source.js</scope>
    <description>Adds an RequireJS/AMD define block</description>
</snippet>

spoike

{
  "d": [
    {
      "name": "Squishy",
      "url": "http://spoike.github.io/html5-game/"
    },
    {
      "name": "Minesweeper",
      "url": "http://spoike.github.io/minesweeper/"
    },

spoike

var toAsciiIndex = function(str) {
  var i, carr = [], curr;
  for(i = 0; i < str.length; i++) {
    curr = str.charCodeAt(i);
    carr.push([curr%32, Math.floor(curr/32)]);
  }
  return carr;
};

toAsciiIndex("Hah"); // -> [[8,2],[1,3],[8,3]]