The JSONObject class: For reading and writing JSON in ActionScript

Back in February while working on an AIR application, I found myself dealing with a lot of JSON data in ActionScript. I was using the corelib library for parsing and generating JSON objects. It was all good until I realized I could improve it even further.

While the JSON class does its job perfectly well, it has one small drawback: it’s not object-oriented.

The static methods encode and decode take the data object as input and return a converted data object as output. The objects themselves have no knowledge of the conversion from JSON to ActionScript and back; they’re just dumb objects. Every time you want to generate a JSON string out of an ActionScript object, you have to invoke the encode method; every time you want to parse a JSON string into an ActionScript object, you have to invoke the decode method. That’s procedural programming. How about if the objects themselves knew how to do this conversion?

Enter the JSONObject class.

Instances of the JSONObject class can read and write JSON strings while at the same time serving up their data as ActionScript properties.

Let’s look at an example:

var data:String = "{\"name\":\"John Doe\",\"age\":28}";

var person:JSONObject = new JSONObject(data);

trace(person.name); // John Doe
trace(person.age); // 28

person.age++;

var newData:String = String(person);

trace(newData); // {"name":"John Doe","age":29}

A few things to notice:

  1. A JSONObject instance can be created by passing the JSON string to the constructor. If the JSON string is not available at the time of construction, the object can be populated later using the populate method.
  2. You can access the properties of the JSON object directly as properties of the JSONObject object.
  3. A JSONObject object can be converted to a JSON string by simply casting it to the String type.
...

My favourite new features in Flash Player 10 (beta)

In a recent article on Adobe Developer Center, Justin Everett-Church explains some of the new features in Flash Player 10 “Astro” (beta). If you have any investment in the Flash platform, you should definitely check out the videos.

Here are my favourite features from this release:

  • 3D effects
  • Custom filters and effects (Pixel Bender)
  • GPU mode
  • Enhanced sound APIs
  • unloadAndStop
  • Limited full-screen keyboard access
  • Large bitmap support

These are features I can put to use immediately. The new unloadAndStop API in particular is the most welcome of the lot.

Disabling site-specific zoom in Firefox 3

Firefox 3 added a new feature called Full Page Zoom. You can now zoom the entire page (as opposed to zooming just the text), and the browser remembers the zoom level for each website. i.e. if you visit en.wikipedia.org and increase the zoom level to 150%, the next time you visit the site, it’ll be opened to a zoom level of 150%. This is really useful. Some sites do use very small font sizes (including perhaps mine), and every time you visit them you have to increase the zoom level. It’s extremely cool that Firefox 3 does this automatically for you.

That said, I’ve found this feature to be annoying at times. Not every page on a site uses the same font, and not every page is structured the same way, with the same kind of content. Some pages may have photos, some long articles full of text. While browsing a site, if you open one of its pages in a new tab, or a new window, and adjust the zoom level, it also changes the zoom level for the other page you were viewing from the same site (now in the background). If you switch back and forth between the two pages, you end up having to adjust the zoom level each time you switch. I don’t know if this is a common use case, but I found myself doing this a few times, and so I finally decided to turn off this site-specific zoom feature altogether.

Here’s how you do it:

  1. Open a new browser window, type about:config in the address bar, and hit Enter.
  2. Click OK on the warning page.
  3. On the configuration page, type “zoom” in the filter box.
  4. Find the preference called browser.zoom.siteSpecific, and turn it to false (double-click on it).

Now Firefox shouldn’t use the same zoom level for every page on a site. It won’t remember the zoom levels either — that’s the tradeoff.

An ideal solution would be if Firefox just didn’t change the zoom level of a page once the page had been opened, unless the user changed it manually. Site-specific zoom by itself is nice, but this “trying to keep up with the current zoom level” behaviour is annoying. Applications on the desktop also try to remember their window sizes, but they don’t resize other windows when you resize one. The same policy should apply for site-specific zoom, in my opinion.

Bug #419612 in the Mozilla bugbase specifically addresses this issue. The request is to make this a hidden preference, though I think it should be the default behaviour. If you agree, go vote for it.

The Milgram Experiment: Video and links

In 1961, psychologist Stanley Milgram conducted a series of experiments to measure the influence of authority on human behaviour, specifically on people’s willingness to perform acts that conflicted with their personal conscience. The results were to shock the entire world as they revealed, yet again, the dark side of human nature. This seminal work in social psychology came to be known as the Milgram Experiment.

Later Prof. Milgram would discuss his findings in his book Obedience to Authority: An Experimental View.

Here’s a video of one of the experiments.

There’s a longer length one on Google Video, though not quite the same quality.

A few links:

And here’s wishing all my Indian friends a Happy Independence Day. With freedom comes responsibility. Let’s do our best, today and every day.

A case against CSS variables

Bert Bos of the W3C in a recent essay on the subject makes a good case against the inclusion of variables and macros in the CSS language. I’m not sure I buy all of his points, but the overall argument for simplicity makes sense.

Incidentally we have something similar in Issuu’s layout language, although in a limited sense. They’re called anchors, and you define them thus:

<anchor name="outerMargin" x="50" />
<anchor name="controlBarCenterLine" y="60" />

Then you can align objects to these anchors. e.g.:

<image source="#Logo" left="#outerMargin"
  verticalCenter="#controlBarCenterLine" />

Unlike CSS “variables” though, IML anchors can be truly dynamic, as in the case of the predefined anchors in the viewer:

<pageNumber top="20" right="#droppContentRight" />

The above aligns the right edge of the page number control to the right edge of the document object, represented by the droppContentRight anchor. You can see this in action in the Basic Grey theme: as you resize the browser window, the document object gets resized too and the page number control shifts position accordingly.

The idea behind anchors of course is to decouple the positioning attributes from their intended values by adding a layer of abstraction. The designer can set up grid lines which can then be used for aligning objects. i.e. instead of setting all objects in the first column to a margin of 50, you can set those objects to a variable called outerMargin, which can then be adjusted independently without touching the objects. The anchors defined in an IML document should give you a sense of the overall layout of its content.

To that extent, we have here what is the equivalent of CSS variables. I wouldn’t venture to add variables of other types to the language though, for the very same reason cited by Bert, i.e. in the interest of simplicity.

Feed Statistics plugin

If you want to track the number of subscribers to your WordPress-powered blog, I recommend the Feed Statistics plugin by Christopher Finke. Not only does it give you a subscriber count for each feed, it also tells you what feed readers your subscribers are using, your most popular posts, and clickthrough counts for your outgoing links. If all you want is to get a sense of how well your blog’s doing, this plugin is perfect.

Since I installed it on my blog this evening, I’ve got 32 subscribers already. Super.

One-man ISV

There seems no dearth of inspiration in the micro-ISV world. Meet Giacomo “Peldi” Guilizzoni, former Adobe ConnectNow engineering lead and now owner and sole employee of Balsamiq Studios LLC. You might have known him for his work on the FLV player or his contributions to Breeze Live, but today he’s drawing attention for something entirely different: his income. I am not talking about his salary, of course, which, as he puts it, is “steady at $0”. Instead, I’m referring to his company’s earnings from the sales of its very first product. Three weeks into the launch of Balsamiq Mockups, a mockup creation tool for UI designers, the company was already making profits. Within 6 weeks it had grossed over $10,000 in revenue.

Everything in Peldi’s one-man company is handled entirely by him out of his home in Italy. The only thing he’s had to outsource is the legal stuff, which incidentally has accounted for 65% of his costs. If this isn’t inspiration, what is?

You can learn more about the Balsamiq story on the company’s blog.

As for the product, I’ve heard some very favourable reviews about it, and now I can hardly wait to take it for a spin.