Flickr’s photo page Ajax trick

Flickr recently started previewing their new photo pages. They’re quite nice but it does something that’s been driving me mad and I can’t work out how it’s doing it. It only happens in Google Chrome 5 and I’ve only seen it in a few places.

Take a look at this screen capture of Flickr’s new lightbox view. Note how the URL updates each time I click through to a new view. Nothing surprising there until you realise it’s not doing a full refresh of the page and is actually an Ajax call back to the server. (You may want to hit the full screen button, bottom right.)

Contrast that with what happens in Firefox – it’s still doing Ajax calls to make flicking between photos quick but the URL changes after the fragment

This technique is pretty common – Facebook have been using it for a couple of years and we even use it to give tabbed pages history on our site. It’s necessary because JavaScript isn’t allowed to set the full page URL without a page refresh, or at least that’s what I thought!

Google Maps has been doing the same as Flickr for a couple of months but I’ve still no idea how! Anyone care to read the Chromium source code or dig around Flickr’s JavaScript to see if there’s something different?

Update: also works in Safari, thanks Ross.

Web development with symfony

Enough of this wordy marketing/writing-for-the-web stuff that Steven is writing about – we all know that everyone just wants to know about programming! Okay… maybe not everyone wants to know about code but I thought some people might be interested to know a little bit more about how we’re developing web apps here at Edge Hill. I mentioned previously how we’re developing sites using symfony, a web development framework and I’ll go into what this offers us and some pointers to further information.

Symfony is a framework, written in PHP which assists developers in creating rich web applications. It provides a wide range of features that previously the developer has to write themselves or manually integrate several third party systems such as object models, MVC separation, caching, scaffolding, Ajax interactions and much more. By taking away overhead it leaves the developer able to concentrate on the functionality of the system and should lead to better applications.

Symfony takes influence from Ruby on Rails and other frameworks in its design and actively promotes well written, reusable code. The MVC separation allows you to maintain database (model), templates (view) and logic (controller) separately meaning parts of the site can be written by several members of the team. ORM means that writing SQL is a rarity. Adding Ajax to produce slicker user interactions is easy and done in a way that maintains standards compliant and accessible HTML.

Currently two major sites have been developed using symfony – Education Partnership and Hi – there’s a couple more smaller applications using it and a few bigger ones in development at the moment. For these sites symfony has allowed pretty rapid development – under a month in the case of Hi – of complex websites. Tools for handling technologies like RSS are integrated with symfony in the form of plugins which has allowed us to produce a couple of different feeds plus seamlessly merge the forum and blog tools with the rest of the Hi site.

One of the best features of symfony is the admin generator. This allows us to quickly create interfaces to allow other people to update websites. This is being used for a couple of questionnaires and much more complex systems too – if you work or study at Edge Hill the chances are you’ll come across the admin generator in action very soon without even realising it.

If you’re interested in finding out more about symfony then there’s a brand new tutorial available on SitePoint which gives a great introduction. The symfony community is really good too with an ever growing selection of plugins (including a couple released as a result of work done here at Edge Hill) and a supportive forum and mailing list.