Wednesday, March 9, 2011

AJAX Powered Photography Tab

Photography tab is now powered by AJAX.I’ve been wanting to add some AJAX functionality to the Photography (Photostream) Section of this blog for some time now. The browsing of photos seems like a perfect fit to be done this way to speed up the process and not have to reload the same stylesheets, javascripts and static images over and over again.

I used jQuery (comes bundled with WordPress) to implement the functionality. I created an XML output based on the same very template that is used to display the normal photo page and the generation of the dynamic XML itself is handled natively by WordPress. I’ve ran into some conflicts with Prototype (used to power Lightbox feature), but was able to sort all of them out.

Of course even jQuery doesn’t save you from all the quirks that each browser has. No exceptions — Chrome, Firefox, IE and Safari on Mac OS X, Windows XP, Windows 7 and iOS — each has its own glitch. I think I sorted all of these out, but if you do notice some oddness or plain out screw ups on my part — do let me know!

Things to do: support for back and forward browser buttons and bookmarking. It’s working for Chrome, Safari and Firefox 4, but one day I should add support for older browsers.

Overall the browsing experience should be better. It dynamically loads the title, permalink, photograph, description, EXIF and comments. It also auto-aligns the page to get the best use of the screen real-estate and there should not be any awkward jumping of the page at all.

That’s all. Check out the Photography Section and see it in action.

P.S. I started it over a month ago and finished it over several weekends. Overall the whole project would take about 2 full days of work, not more. Good learning experience though.
In: Software   Tags: , , , ,
Time: 13:18   Comments: No Comments   Post a Comment  

Leave a comment

O.o teeth mrgreen neutral -) roll twisted evil crycry cry oops razz mad lol cool -? shock eek sad smile grin