Ismael Canal basiclines

A timeline of the last four years of detecting good old window.localStorage.

Jan Lenhart, bless his heart contributed the first patch for support:

October 2009: 5059daa

Here's an example of how to embed a Gist on GitHub Pages:

{% gist 5555251 %}

All you need to do is copy and paste the Gist's ID from the URL (here 5555251), and add it to a gist tag surrounded by {% and %}.

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:

Share Counts

I have always struggled with getting all the various share buttons from Facebook, Twitter, Google Plus, Pinterest, etc to align correctly and to not look like a tacky explosion of buttons. Seeing a number of sites rolling their own share buttons with counts, for example The Next Web I decided to look into the various APIs on how to simply return the share count.

If you want to roll up all of these into a single jQuery plugin check out Sharrre

Many of these API calls and methods are undocumented, so anticipate that they will change in the future. Also, if you are planning on rolling these out across a site I would recommend creating a simple endpoint that periodically caches results from all of the APIs so that you are not overloading the services will requests.

Twitter

	brew update
	brew link yasm
	brew link x264
	brew link lame
	brew link xvid

	brew install ffmpeg

	ffmpeg wiki:
	https://trac.ffmpeg.org/wiki/Encode/MP3

	<svg preserveAspectRatio="xMinYMin" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
	viewBox="0 0 560 1388">
	<defs>
	<mask id="canTopMask">
	<image width="560" height="1388" xlink:href="img/can-top-alpha.png"></image>
	</mask>
	</defs>
	<image mask="url(#canTopMask)" id="canTop" width="560" height="1388" xlink:href="can-top.jpg"></image>
	</svg>

	var QcValueConverter = {
	tensionFromQcValue: function(qcValue) {
	return (qcValue - 30.0) * 3.62 + 194.0;
	},

	qcValueFromTension: function(tension) {
	return (tension - 194.0) / 3.62 + 30.0;
	},

	frictionFromQcValue: function(qcValue) {

	# a single method signature in AppKit
	initWithBitmapDataPlanes:pixelsWide:pixelsHigh:bitsPerSample:samplesPerPixel:hasAlpha:isPlanar:colorSpaceName:bitmapFormat:bytesPerRow:bitsPerPixel:

	# a JavaScript unit testing framework
	function(a,b,c,d,e,f){c=d=e=0;for(f in a)try{a[f](function(g,h){g?c++:(d++,b(f,'F',h))})}catch(i){e++;b(f,'E',i)}b(c+'A',d+'F',e+'E')}

	// CURL
	var util = require('util');
	var exec = require('child_process').exec;

	// API RESPONSE
	var http = require('http');
	var sys = require('sys');
	var server = http.createServer(function(req, res) {

	res.writeHead(200, {

	//Open the file directly in the browser and run this script from the console
	//Assumptions: The browser uses a <pre/> tag for showing the CSS code

	var file = document.querySelector("pre");
	var fileContent = file.innerHTML;


	var newContent = fileContent.replace(/([\d.]+)(rem)/g, function(m){
	var measure = parseFloat(m.split("rem")[0]);
	var newMeasure = measure / 1.6;