During Apple’s keynote yesterday in which they announced a new iMac, iLife 08, iWork 08, Airport Extreme and a new Mac mini, they also announced an update for .Mac.
The .Mac update included personal domains, increased storage and transfer limit and a Web Gallary.
The web gallery which can be published with one button from iPhoto gives a rich Web 2.0 experience and even works on IE on a PC. Developed using the Prototype and Scriptaculous JavaScript libraries, it introduces some really innovative ideas for displaying a large number of albums and photos.
The main page is a collection of album thumbnails that change as the user hovers over them. The powerful effect allows the user to quickly scan through the album’s photos without the need for a single click.
Once within an album, the photos are displayed in either a grid, mosaic, carousel or a slideshow. The user can quickly change the background colour, resize the photo thumbnails and subscribe to the galleries RSS feed. The carousel view is the same as the cover-flow album art display that iTunes and the new iPhone uses. Once the photo’s are fully loaded, its performance is really slick.
Congrats must go to the Apple developers that worked on the site. As a JavaScript developer, I’m really inspired by the quality of the work. My only criticism is that the main gallery JavaScript file weights in at an whopping 404 kb. A minor issue thou if you consider the prevalence of broadband connections.
Link to a sample Web Gallery
Update:
Steve Brewer has posted a great analysis of the JavaScript Code. He details how Apple left 128 lines of comments and how the images are used inefficiently. By combining the images into batches of 20 each being 160px by 3200px and then by using them as a positioned backgrounds, Steve’s test results show speed improvements of over 400%. Pretty Impressive!
Update:
Adam Houghton has done the seeminly impossible by creating a JavaScript version of coverflow. He has done great job using GWT.
Link to demo
Link to Adam’s blog announcing GWT Flow