I'm going mobile with Metakaolin.

This had always been the plan as I came up with its editor design, just ended up on the back burner for a while.

What got me off my duff was noticing that my Argyle Tiles preview map was fairly broken on SVG-supporting Android browsers. It showed up, and panning worked, but any pinch zoom caused the map to go blank until the page was refreshed. Some sort of bug in Polymaps' code, and since I was involved in getting its multitouch support landed I felt more than a tinge of responsibility.

Aaaaaand....also I'd been wanting to get a Nexus 7 anyway.

After the price dropped a few weeks ago, I picked up the 16GB model and got to work. (The Nexus 7 is an excellent piece of hardware, by the way, and I've been really impressed by how modern Android 4.1 feels.) Turns out that Chrome does provide W3C-standard touch events — and also includes pressure information! — but it does not add any additional scale/rotation gesture information as Safari does on iOS. So as soon as you tried to zoom, the code tried to adjust the map to zoom level undefined ± something which didst upset it surely.

Filling in for that has been a decent bit of work, especially since event handling on the Polymaps master branch was making some other incorrect touch tracking assumptions in addition to the gesture info. Chrome's remote debugging worked really well and fortunately everything carried over well to Firefox and iOS 5's Safari. I'm reasonably happy with this implementation; it's both somewhat simpler than my Magic Mouse gesture interpretation logic yet reacts to zooming with as many fingers as you've got.

Once that was working, it was time to hook in touch event tracking to my editing layer. It ended up being a fairly straightfoward process, the original logic stood up pretty well to some slight wrapping/refactoring. What didn't survive were some of the marginal hover-based affordances and the tiny control handles from desktop use! When you load it on a touch device, there's now generous finger room, at least on the node handles, and I've got some visual design ideas that should improve usability and discoverability for both direct and indirect (i.e. mouse) interaction once they're implemented.

So: now I have a completely non-modal vector graph editing interface that talks GeoJSON and can be used on a desktop, laptop, iPad, and even a $200 Android tablet.

I've posted a short demo video, you can fork the source code, or why not try the editor yourself and let me know what you think!

Coming up next? Well, Mozilla's Dev Derby theme for December is offline apps. Since I completely spaced on the geolocation one in September, I'm kind of determined to make up for it next month.