You are browsing the "Programming" archives.

Widerbug 1.3.3 Available

After a long wait, Widerbug 1.3.3 is now available! Thanks to an excellent tutorial, it includes automatic update abilities to keep up with widescreen revisions, as well as the latest Firebug changes. Install it now, or visit the Widerbug page.

Widerbug 1.3.0 for Firefox 3

The Firebug team has been hard at work squashing bugs and making Firefox 3 related improvements, culminating in the release of Firebug 1.3.0 yesterday. Some of the notable changes include:

  • Better debugging performance when dealing with large JavaScript files
  • More reliable ‘console’ object for logging
  • Alphabetized DOM properties
  • Added localizations
  • Over 50 bug fixes

After some minor modifications, Widerbug 1.3.0 is ready for use on your widescreen display in its signature 2-up layout, complete with all the changes from above. As usual, head over to the Widerbug page to grab the latest version (please leave comments and note any bugs on that page).

Learning Cocoa for the iPhone

These last few weeks, I’ve been teaching myself Cocoa to learn what makes Mac OS X and iPhone OS apps tick (not just for Flicks, but other software, too). While Objective-C is quite a departure from my usual web development world, Cocoa has quickly become one of my favorite languages, as it takes care of much of the drudgery of pure C and has plenty of useful frameworks to get your application up and running quickly. Here are some of the best resources I’ve found so far:

  • Cocoa Dev Central and Become an Xcoder are both excellent tutorials for beginners, written in a clear, straightforward manner. They also explain the ins and outs of memory management, which is critical on platforms like the iPhone and iPod touch.
  • Stanford’s CS193P lecture notes and examples have proven to be one of the best resources for learning Cocoa, particularly for the iPhone. These notes and tests offer Cocoa Touch in bite-size chunks, with a little bit of “on your own” work to ensure you know your stuff before moving on.
  • Google Code Search is a good last resort for examples of how others are using a small bit of code or a particular class. For more accurate results, append “lang:objectivec” to your search string to narrow results to only Objective-C code.

If you already know Cocoa, feel free to share your go-to places for information in the comments!

Consolas Cursor Fix

If you’ve attempted to use Consolas as your choice programming font on the Mac, you may have noticed (as I did) an odd issue with the font, where your blinking cursor hangs much lower than the current line. Oddly enough, this little issue only seems to affect Mac OS X. Even the Consolas set that ships with Microsoft Office 2008 has the same problem! Yet, when the same exact font file is used under Windows, the cursor position is correct.

John Gruber mentioned yesterday that BBEdit 9.1 now ships with Consolas as its default font, so I decided to see if it had the same cursor problem I had experienced in the past. As it turns out, BBEdit’s version of Consolas works just fine, as seen in the image above. However, it doesn’t include the other styles like Consolas Bold, Italic, and Bold Italic.

Through one way or another, the copy of Consolas that ships with BBEdit 9.1 is different than the one that ships with Microsoft Office 2008. To make system-wide use of the working version, download BBEdit 9.1, mount and open the .dmg, and navigate to:

(Control-click BBEdit, and choose “Show Package Contents” to get inside the application bundle)
BBEdit.app/Contents/Resources/Fonts/consola.ttf

Copy consola.ttf from BBEdit’s “Fonts” folder to your own Fonts folder at /Users/you/Library/Fonts, or /Library/Fonts if you want to make it available to everyone who has an account on your computer. Then, fire up your favorite editor, set Consolas as your preferred fixed-width font, and get coding!

jQuery Fling

Fling is a simple but powerful jQuery plugin for dealing with multiple events using a publisher/subscriber model. jQuery handles the browser-native events, Fling manages them, and you write the code that’s left.

Why Fling?
To understand the purpose of Fling, imagine a standard three-pane email client (to borrow an example from Seth Dillingham, whose work inspired Fling): When you click on a message you just received, several things happen:

  • The mailbox unread count gets decremented
  • The message’s unread indicator goes away
  • The message row text goes from bold to plain
  • The message content appears in the viewer pane

These actions happen with little, if any interaction between each other. All each needs to know is that you clicked on a given unread message. Using jQuery, it’s quite easy to put all four actions inside the same click handler function and be done in minutes. However, when your code base starts to grow, having all that code inside one event handler can make multiple triggers and cascading events cumbersome. There’s a better way to make things happen — Fling your events around.

A Basic Example
Start by including Fling on your page, along with jQuery:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.fling.js"></script>

Then, use jQuery’s handy document ready to set up new Fling subscribers, and finally, publish the event:

// jQuery Document Ready
$(function() {
	// Subscribe to some_event_name
	$.fling('subscribe', 'some_event_name', function() {
		alert('Hello from Fling 1');
	});

	// Subscribe to some_event_name
	$.fling('subscribe', 'some_event_name', function() {
		alert('Hello from Fling 2');
	});

	// Publish some_event_name
	$.fling('publish', 'some_event_name');
});

When run, you should see two alerts pop up in sequence. The only relationship the subscribers have is that they both care about “some_event_name” happening. When publish was called, both did their jobs.

In Depth
$.fling() has four main functions:

  • Create sets up an event without publishing it or subscribing any events. This isn’t used too often, as Create happens automatically when Publish or Subscribe is called.
    $.fling('create', 'myEvent');
  • Destroy frees the memory occupied by the event and it’s subscribers when you’re done with an event for good.
    $.fling('destroy', 'myEvent');
  • Publish notifies all subscribers that a given event happened. It can also pass data to subscribers through a second parameter. Publish can be called at any time, with zero or more subscribers, meaning your event can happen even if no subscribers care about that event.
    $.fling('publish', 'myEvent');
    $.fling('publish', 'myEvent', {my: "data"});
  • Subscribe gets called when an event is Published. You can Subscribe to events that have not been Created or Published yet, as the publisher can arrive later via another script, if needed.
    $.fling('subscribe', 'myEvent', function() {
    	/* ...your code... */
    });
    $.fling('subscribe', 'myEvent', someNamedFunction);
    $.fling('subscribe', 'myEvent', function(event, passedData) {
    	alert(passedData);
    });

Give Fling a Try!
So, that’s it to Fling. There’s not a whole lot to it — you might even be surprised to see just how short the code is. Give it a shot, and see how your jQuery code can be better organized, called from multiple places, and even cascade on down the line.

Download Fling Now

Release History

Released under the MIT License. Fling is short, sweet, and yours to hack. Improvements are welcomed!