Skip to content

Instantly share code, notes, and snippets.

View amcdnl's full-sized avatar

Austin amcdnl

View GitHub Profile
@amcdnl
amcdnl / pause-resumable.md
Created October 12, 2011 16:02
Pausable and Resumable Events

Pause-Resumable Events

Events play an important role in JavaScript development. Coupled with asynchronous behavior, the programming model for events is challenging. Event handlers often perform some asynchronous action (AJAX or animations) and subsequent event handlers should wait for this action to complete. Pause-resumable events are an improvement on jQuery's event system to handle this problem more elegantly.

Why

Pause-Resumable events, introduced in 3.2, are a mechanism that allows events to be paused and resumed later. This type of behavior is typically used when waiting for asynchronous or validation behavior to complete.

Previously, imagine when you were to create a tabs widget which requires the user click a checkbox in the content before switching tabs. Once the tab's click event fired, a parent widget would listen for this event and cancel it to stop the propagation. At this point, it would ensure validation met the requirements and if so re-trigger the event for the tabs to continue

@amcdnl
amcdnl / fingerprint.md
Created September 10, 2012 17:13
Steal and Cache Busting

Steal and Cache Busting

When using steal in production, you sometimes want to 'cache bust' your images in your CSS. Below is a script that you can add to your build script to accomplish this.

var window = (function() {
	return this;
}).call(null, 0);
	
var modifyCss = function(css, str) {

str = str || Date.now().toString();

@amcdnl
amcdnl / html5_facebook.md
Created September 12, 2012 02:41
HTML5 vs Native Mobile Apps and Facebook

HTML5 vs Native Mobile Apps and Facebook

Recently, Mark Zuckerberg made a comment saying that Facebook's mobile app based on HTML5 was "one of the biggest mistakes if not the biggest strategic mistakes we've ever made". I mean yes the application was TERRIBLE; it crashed all the time, was slow, and had a number of issues but I don't agree.

There is a number of other companies that have great HTML5 applications with just as much complexity ( if not more ) than the Facebook app. The first and best example I can think of is the LinkedIn application. This is a very nice application that performs fine with similar characteristics as the Facebook app.

Windows 8 is basing their whole marketplace around HTML5 applications. While you might argue that the computing power of a desktop is far greater than a phone, the complexity of the applications are going to be greater too.

I argue that making HTML5 applications are the way to go! Why is that?

@amcdnl
amcdnl / steal-grunt.md
Created September 18, 2012 14:48
Steal build via GruntJS

Steal build using GruntJS ( https://github.com/cowboy/grunt ).

Arguments: dir example: "todo/scripts/build.js"

grunt.registerHelper('steal', function (dir) {
	var done = this.async(),
		os = require('os');

	grunt.utils.spawn({    cmd: os.platform() == "win32" ? "js.bat" : "./js",

    args: [ dir ]  

@amcdnl
amcdnl / canjs-donts.md
Created September 18, 2012 14:53
CanJS Dont's

Things not to do in CanJS

List of common things that are done incorrectly but users. These things create memory leaks, cause odd issues, and are just plain ugly.

  • Remove html/controls by doing innerHTML = ""
  • Binding events manually e.g. this.element.bind('click', function() { ... });
@amcdnl
amcdnl / internal-external-docs.md
Created September 19, 2012 16:32
Inline vs. External Docs for your Code

Inline vs. External Docs for your Code

I'm pro external, heres why...

Pros of external

  • Make code messy
  • Not maintained well, example Bob adds a new argument but never updates the docs.
  • Often not useful, example: // returns monkey whereas if your actually writing docs you put more thought into it
  • Examples and usage code is easier to read
@amcdnl
amcdnl / naming-conventions.md
Created September 20, 2012 20:56
Naming Conventions and Organization for JavaScript

Naming Conventions and Organization for JavaScript

Naming Conventions

Below are basic naming conventions for namespaces versus constructors in JavaScript.

Namespaces are lowercased. For example:

mycompany.viewer
@amcdnl
amcdnl / localization.md
Created September 24, 2012 16:44
Localizing EJSes with CanJS

Localization with EJS and CanJS

This is a demo that will localize your application using jQuery's Globalize and CanJS's views.

The end result is a localization that updates the string's itself when the culture changes. The culture will change when the user selects a different language from a menu ( example not shown ).

*NOTE: You will need to setup your app for jQuery Globalize and include the files it requires in order for this demo to work correctly.

The Code

@amcdnl
amcdnl / gist:3822982
Created October 2, 2012 20:08 — forked from JeffreyWay/gist:1608901
Inline Web Workers
<!doctype html>
<html>
<head>
<title>Web Workers</title>
</head>
<body>
<script id="worker" type="app/worker">
addEventListener('message', function() {
postMessage('What up, sucka.');
@amcdnl
amcdnl / webworks_and_jquery.md
Created October 4, 2012 13:37
Web Workers and jQuery

Web workers and jQuery

Web workers are great; they provide a powerful way to run background threads on website.

I wanted to create a more convenient way to deal with them in a jQuery-esque way. This code allows you to create a web worker and returns a jQuery.Deferred extended with some of the web worker methods on the instance.

// Alias vendor prefixes to standard.
if (!window.BlobBuilder) {

window.BlobBuilder = window.WebKitBlobBuilder || window.MozBlobBuilder;