Idle Time

Christopher Bowns pointed out (thanks!) that Jonathan Rentzsch released ClickToFlash 1.2 yesterday.

This is the first version that incorporates any significant features from my fork. Specifically:

• It now loads the Flash movie on mouse-up, not mouse-down.
• It now draws the ClickToFlash view as concave when the mouse is down and within its bounds.
• It now has a separator item in the contextual menu.

The first two of these came from my tree, a fact that I am very happy about. The last one he pulled from Troy Gaul's tree instead, but it makes no difference, as it's just an element in a xib document.

If you're using 1.1+boredzo, you don't need to upgrade. My version of 1.1 has all the features of his 1.2, plus the “Copy Address” contextual menu item and, of course, my own click-to-play symbol.

My fork of Jonathan Rentzsch's adopted WebKit plug-in lives on, as I release my version of ClickToFlash 1.1.

So far, he has not pulled any of my changes into his tree, so the list of features unique to my version has only grown:

• It loads the Flash movie on mouse-up, not mouse-down, giving you a chance to back out by moving your mouse cursor off of the movie placeholder.

• It changes to a concave appearance when you press the mouse on the placeholder, making it look, as well as act, more like a button.

• It has a better (IMO) click-to-play image. (Screenshots on the other post.)

• It adds a separator menu item to the contextual menu. (New in 1.1+boredzo, and the menu itself is new in 1.1)

• It adds a “Copy address” menu item to the contextual menu (along with another separator). (New in 1.1+boredzo)

• It incorporates Jason Foreman's fix for websites such as thedailyshow.com. According to him, that simple change fixes ClickToFlash on a lot of websites; I can vouch for it on thedailyshow.com, at least. (New in 1.1+boredzo)

Speaking of everybody's favorite WebKit plug-in, here's how it works. This should help you understand how it fails on some sites, and maybe aid you in contributing to its development.

First off, it is a WebKit plug-in; it's written in Cocoa and uses WebKit's own plug-in API. It does not use the Netscape plug-in API.

A WebKit plug-in declares a list of MIME media types in its Info.plist bundle. It does this by way of a dictionary of dictionaries:

<key>WebPluginMIMETypes</key>
<dict>
    <key>application/x-shockwave-flash</key>
    <dict>
        <key>WebPluginTypeDescription</key>
        <string>ClickToFlash</string>
    </dict>
</dict>

WebKit only loads a WebKit plug-in when it first encounters some content that it needs the plug-in for. It uses these Info.plist dictionaries to know which plug-in it needs to load. So, in the case of ClickToFlash, it only loads ClickToFlash when it encounters something that is of type application/x-shockwave-flash.

Here's the brilliant part. Adobe's Flash Player plug-in actually declares* two MIME media types: application/x-shockwave-flash and application/futuresplash.

You will notice that ClickToFlash only declares one of these.

As it turns out, everybody only uses application/x-shockwave-flash. ClickToFlash exploits this.

When you click on the ClickToFlash view, it modifies the object or embed element that the view represents, changing its type attribute to the other type—the one ClickToFlash doesn't declare; the one no webpages actually use. WebKit notices this change and looks again for a plug-in to handle the movie. This time, it comes up with only one handler: the real Flash Player plug-in.

There are several reasons why a site may not work with ClickToFlash. I suspect one reason is that they try to interact with the movie via JavaScript; ClickToFlash doesn't export a script object and wouldn't be able to communicate with the real Flash Player anyway. The script finds itself talking to a wall, and breakage happens.

So now that you know how ClickToFlash works, maybe you can help fix its bugs?

* Flash Player doesn't declare its MIME types in its Info.plist; it declares them in a resource file, in 'STR#' resource 128. Thanks to WebKit developer Mark Rowe for reminding me to look for a resource. ↶

I normally hate the advertisement apps that several companies have created for the iPhone, but in this case, I'll make an exception.

The newest advertisement app is the one for Death Cab for Cutie. As you can guess, it's free.

The reason I like this one is because it actually includes ten (as of 1.0—eight as of 1.1) DCfC songs at medium quality (AAC, 96 kbps). Good enough for me—certainly good enough for free.

You don't need an iPhone to use this app. You can easily extract the music from the app bundle and then dispose of what's left.

After downloading the app, here's what you have to do.

1. Switch to the Applications section of iTunes.

2. Right-click on the DCfC app and click Show in Finder.

   

3. You'll see the .ipa file. Open this in an unzipper application such as Archive Utility, StuffIt Expander, or BetterZip. (BetterZip will let you go straight to the .app bundle, so you should use that if you have it.)

   

4. In the unzipped folder, find the actual app bundle. (It'll have a prohibitory sign on it because it's an iPhone app.)

   

   Right-click on it, then choose Show Package Contents.

5. You haven't far to look, since iPhone apps are old-style flat bundles, not new-style hierarchical bundles.

   In version 1.0, the m4a files were right there. Since version 1.1, they're not; the app streams them on demand. Open the media.stream.xml file in your favorite text editor, copy each http://[…].m4a URL, and paste it into your browser's Downloads window.

6. If you don't want any of the other features of the app (e.g., its discography or tour dates), delete the app in iTunes.

If you enjoy filling out the Lyrics tab in iTunes and reading along in TuneTagger, you may also want to write a program to read the discography.xml file (also in the app bundle) and copy the lyrics into iTunes. If you write such a program, feel free to link to it in a comment.

UPDATE 2009-02-06: Updated instructions for version 1.1, wherein they stopped bundling the .m4a files in the application.

The WebKit plug-in ClickToFlash has been an instant hit over the past 24 hours. The original version was on a Google Code project, but that project is now closed to the public. Before the Google Code project went 0600, Jonathan Rentzsch set up a fork on GitHub to gather changes submitted by Gus Mueller and Jean-François Roy.

Unfortunately, both the original and Rentzsch's current version have one immediately-noticeable deficiency: In place of the Flash movie, the plug-in displays only a blank gray gradient background. It's easy to think that there's simply nothing there, or that the page is not done loading.

I decided to solve the problem myself. I forked the fork and posted my own version (along with a binary installer).

My interpretation of the plug-in adds three features:

1. Swap in the Flash movie on mouse-up, not mouse-down. This gives you a chance to back out by moving the mouse out of the view.
2. Invert the gradient when the mouse is down. This makes the view look (as well as act) more like a button.
3. Fixes the blank-background problem. A number of people have done this in other forks, but I think my solution is best:

My solution has two advantages:

• Its drawing is fully vector-based, which means that that it will scale to fit the would-be movie's area and will look good no matter how big the would-be movie is.
• I designed the implementation so that you can replace it with different drawing code if you'd prefer a different click-to-play symbol.

The original, Jonathan Rentzsch's fork, and my fork are all under the MIT license. And, of course, he is welcome to pull my changes upstream.

The most popular mix-and-match-music app, according to the completely objective score of how often I hear its name, is Pandora.

Most of this popularity came with their release of an iPhone app back in July 2008. The iPhone app makes the site portable: previously, you could only listen to Pandora while chained to a browser (or a SSB), but now you can listen to it anywhere that's in cell range.

Pandora now has competition.

It first appeared in AppShopper's free iPhone apps feed on 2008-11-08, but I didn't see it then (I probably scrolled past it). I did see it when they released their 1.1.3 update back on 2008-11-31.

Its name is Finetune. Like Pandora, it's free.

The differences:

• Unlike Pandora, Finetune doesn't require an account.
• Pandora has an option to jump over to the iTunes Store to buy a song; Finetune has no such feature.
• Finetune only creates stations based on artists; Pandora lets you name an artist, song, album, or composer.

I think Finetune does a slightly better job of selecting songs that are similar to the work of the requested artist. (Sometimes this is hard, as in the case of the Beatles, who produced very diverse work.)

One major drawback to Finetune is that, since it only lets you select based on artist (performer), not composer, it really sucks for classical music. (The service has it, but it's little better than shuffle-play.) If you want a customized classical station, Pandora is currently your only option.

(Note: I wrote this before Pandora 2.0 came out, but it's still accurate. If anything, Pandora 2.0 is even better for classical now, since you can now make stations by genre.)

On 2008-12-12, Tim Haines, the developer of BurnBall, contacted me on Twitter to offer me a free promo code. I accepted, and played the game on my first-generation iPod touch.

The game is basically Qix with a Sonic-the-Hedgehog-esque theme. Based on that, I give you this pull-quote:

If you like Qix, you'll like BurnBall.

As it happens, I don't like Qix. The main thing about Qix that frustrates me is that enemies can kill you just by touching your trail while you're cutting off another piece of the level. This makes some sense for the Tron-based theme of some of the other Qix work-alike games, but it has the effect on gameplay that you can't make any but incremental progress, especially after the first few levels, as the number of enemies goes above 2. Your only hope is that your enemies will see some shiny thing and leave you alone long enough to let you complete your wall; otherwise, you can only complete the level a little bit at a time.

One way in which somebody could improve Qix would be to let enemies go right through your wall, and compensate by making them more aggressively pursue you. Then, you'd stand a reasonable chance of completing the wall, if you can just dodge the enemies. Another way would be to have enemies bounce off the wall, which would provide you with a way to restrain them while you draw more wall—but that may make the game too easy.

BurnBall is graphically different enough from Qix that it could pull off either change, although it probably should be an alternate game mode.

So, basically, the only reason I dislike BurnBall is because I dislike Qix games in general.

That said, BurnBall is a very good Qix game, being both well-drawn and responsive to your control. (Since I originally drafted this post, there's been an update that tweaked the tilt response; I haven't tested it.)

BurnBall has an advantage over Qix work-alikes on other platforms, in that you can move in any direction—you're not limited to up, down, left, and right. You move by tilting the iPhone.

Another advantage of BurnBall over other Qix work-alikes is that Haines holds high-score competitions with monetary prizes on the app's Facebook page. He also posts a free promo code every time that page gets another 100 subscribers, so you may not even have to buy the game.

If you'd rather not wait for the next promo code, the app is 99¢ on iTunes.

One of the ongoing debates among users of iPhone OS devices is whether an app's settings belong in the app itself, or the Settings app.

I'm of the opinion that this wouldn't even be a debate if it weren't for Apple's prescription in the iPhone HIG that every iPhone app's settings should be in the Settings app. Mac apps don't come with prefpanes for their preferences (with the exception of faceless background apps like Growl). Windows apps don't, either, that I know of. GNOME and KDE apps don't pollute Ubuntu's Control Panel.

The iPhone is the only OS I know of whose developer recommends that app developers put their application settings in the system-wide Settings app.

As we've seen several times on every platform, it's OK to break one of the local Human Interface Guidelines if and only if the violation makes the interface better.

I think this guideline is one that iPhone developers should violate flagrantly.

But there's a problem. The iPhone doesn't really have an icon for a Settings button. Most developers seem to use the icon that one of the frameworks apparently provides, but this isn't the proper use of that icon. The means info, not application settings.

Another choice is the gear icon for Action buttons:

But, again, we have a conflation of functions. The button in question is not an Action button; it is a Settings button. This icon is not a Settings icon. (I suspect that most people who use the Action icon use it because it doesn't have any particular association with “action”, either, other than Apple's endorsement of it for that.)

The Iconfactory, wisely, chose differently in Twitterrific. I suspect that this was largely coincidence, as the Mac version of Twitterrific came first and already had a Settings icon; for the iPhone version, the developers simply used the same icon. It works well enough:

But it's not perfect. A wrench does not say “settings”. (I offer myself as evidence: When I first saw it in the Mac version, I didn't know it was the Preferences button.) Generally, a wrench means “edit this”, as in the context of a game.

What we need is an icon that says “settings”. Ideally, this icon should either convey the notion of a changeable state value (as the previously-favored light switch [Mac OS X through Tiger] and slider [Mac OS] did), or build on an existing association with the concept of settings.

Let's go with the latter. I nominate the Settings app's icon:

Familiar enough, wouldn't you say?

That's Apple's version. Here's my button-icon (a.k.a. template) version, in the 16-px size:

I tried it out in the iPhone version of Twitterrific on my iPod touch. Before and a mock-up of after:

After I created this icon, I wondered what it would look like in the Mac version of Twitterrific.

Here's the original:

… And right away we have a problem. These buttons are already framed; my white frame will glare here.

Fortunately, that's easy to solve. With ten seconds of work, I created a frameless version. Here's what that looks like:

I think we could all get used to this icon. This wouldn't have worked at all before Apple changed the icon of System Preferences to match the iPhone Settings app, but now it can.

I don't think it's perfect. Perhaps a real icon designer (I'm just a programmer) can refine it. But I think it's a good first draft. I'm curious to hear your opinions; please post constructive feedback in the comments.

If you want to use this icon, go ahead. Here's the original Opacity document , from which you can build all the many variations of the icon. (Click on Inspector, then Factories, then find the version you want in the list and click its Build button.)

One of the things that's been keeping me busy lately (too busy, in fact, to keep up Framework Friday and Manpage Monday—sorry about that, and I'll get back to them when I can) is preparing a video based on the presentation I gave at CocoaHeads last month.

I have now finished it. Its title is simply “Unit testing”.

The subject is unit testing for applications written in Cocoa to run on the Mac. I'm not an iPhone developer, so the video is only generally applicable to iPhone development (as much as it is to any other platform); for specific information about testing on the iPhone, see Colin's blog post.

I corrected a few things that I got wrong in the original live presentation, and added a few new slides. Other than that, it's basically the same.

The video is 13+½ minutes long (strangely, about half the length of the original live presentation), and is available in high-definition. You can even download the original file I uploaded, in case you're so inclined; it uses the lossless Animation codec for the video track, and is 720p and 135.7 MiB.

I used several Creative Commons photographs in the slides. Here are the links back to them:

• Crystal Ball
• 050507-04 Dunes Erg Chebbi
• Salt II

In other news, I love Keynote's Instant Alpha feature.