Phil Dokas pdokas

OS X Screencast to animated GIF

This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.

Instructions

To capture the video (filesize: 19MB), using the free "QuickTime Player" application:

This is a brain dump of my experience trying to get something going with Ember.js. My goal was to get to know the ins and outs of the framework by completing a pretty well defined task that I had lots of domain knowledge about. In this case reproducing a simple Yammer feed. As of this time, I have not been able to complete that task. So this is a subjective rundown of the things I think make it difficult to get a handle on Ember. NOTE: My comments are addressing the Ember team and giving suggestions on what they could do to improve the situation.

App setup

The new guides have pretty good explanation of the various parts of the framework; routers, models, templates, views. But it's not clear how they all get strapped together to make something that works. There are snippets of examples all over the place like:

App.Router.map(function() {
  match('/home').to('home');
});

1. Clone your fork:

git clone [email protected]:YOUR-USERNAME/YOUR-FORKED-REPO.git

2. Add remote from original repository in your forked repository:

cd into/cloned/fork-repo
git remote add upstream git://github.com/ORIGINAL-DEV-USERNAME/REPO-YOU-FORKED-FROM.git
git fetch upstream

Things to do when IE9 Beta comes out

Note significant features added since IE9 PP4

Implemented but not announced: box-shadow, hsla
Expecting: 2d transforms, css animation, css transitions, flexible box model
Maybe: gradients, columns, reflections, svg filters, uncrippling @font-face, 3d transforms
Maybe version auto-update functionality

Test Modernizr against it

Does it still throw an error checking elem.msTransform?

	"use strict";

	// `f` is assumed to sporadically fail with `TemporaryNetworkError` instances.
	// If one of those happens, we want to retry until it doesn't.
	// If `f` fails with something else, then we should re-throw: we don't know how to handle that, and it's a
	// sign something went wrong. Since `f` is a good promise-returning function, it only ever fulfills or rejects;
	// it has no synchronous behavior (e.g. throwing).
	function dontGiveUp(f) {
	return f().then(
	undefined, // pass through success

	// Media Queries in Sass 3.2
	//
	// These mixins make media queries a breeze with Sass.
	// The media queries from mobile up until desktop all
	// trigger at different points along the way
	//
	// And important point to remember is that and width
	// over the portrait width is considered to be part of the
	// landscape width. This allows us to capture widths of devices
	// that might not fit the dimensions exactly. This means the break

	__ __
	/.-' `-.\
	// \\
	/j_______________j\
	/o.-==-. .-. .-==-.o\
	\|\| )) (( \|\|
	\\____// \\____// hjw
	`-==-' `-==-'

	# Tips for jQuery Bug Patching

	# There are some assumptions made here, one being that you're
	# set up with some form of "localhost" http server and that it's running.
	# - http://www.mamp.info/en/mamp/
	# - sudo apt-get install apache2

	# Get it running:
	# On Mac:

	[user]
	name = Jamie Wilkinson
	email = [email protected]
	[github]
	user = jamiew
	token = <REDACTED>
	[apply]
	whitespace = nowarn
	[branch]
	autosetuprebase = always

	// converts milliseconds to '3:45' or if hours > 0, '2:01:23'
	var getTimeFromMillis = function( ms ) {
	var seconds = ~~( ( ms / 1000 ) % 60 ),
	minutes = ~~( ( ms / ( 1000 * 60 ) ) % 60 ),
	hours = ~~( ( ms / ( 1000 * 60 * 60 ) ) ),
	twoDigit = function ( n ) {
	return n < 10 ? '0' + n : n;
	},
	seconds = ':' + twoDigit( seconds );