Thursday, March 11, 2010

HTML5 Buckets

Buckets has been idle for many months and I still haven't gotten Shanelle using it. Something - I think it was Luke - got me thinking about finishing the iPhone version. In fact, starting and then finishing the iPhone version :) I feel the need for doing it in HTML5 - this app is a good candidate for a non-native application implementation.

I started looking around for demo apps that had the components I need and handily bonked into webkit.org/demos/sticky-notes/ I dream of a competitive WebOS device so it is nice that iPhone and WebOS should have very similar implementations. Here's the first bit of goodness.

$ curl --include http://webkit.org/demos/sticky-notes/StickyNotes.manifest
HTTP/1.1 200 OK
Date: Thu, 11 Mar 2010 06:01:37 GMT
Server: Apache/2.2.14 (Unix) mod_ssl/2.2.14 OpenSSL/0.9.8l DAV/2 mod_python/3.3.1 Python/2.5.4
Last-Modified: Sat, 13 Jun 2009 00:53:08 GMT
ETag: "38-46c303f980500"
Accept-Ranges: bytes
Content-Length: 56
Content-Type: text/cache-manifest

CACHE MANIFEST
deleteButton.png
deleteButtonPressed.png


There are some important rules going on - this bit is telling the browser exactly what resources to make available when the application is in offline mode. Sticky Notes is mostly CSS so the manifest is micro but it's still a good start. Some bits that I've picked up in other places: the page that includes the manifest= is automatically whitelisted; fallback is how you replace resources with an offline-specific image or resource; the content of the manifest has to change for the browser to recognize a difference - it isn't the timestamp or the filename / path.