UT Law on the Go: New iPhone Web App
Trying to keep up with the proverbial Joneses, today we launched an iPhone / iPod Touch mobile web app for the University of Texas School of Law. If you want to check it out on your iPhone right away, fire up the following link in Safari: http://www.utexas.edu/law/m/
I built it from the ground up with PHP, JavaScript, and a bit of elbow grease, pulling data from a handful of existing sources both on-campus and off. It makes use of the iUI JavaScript framework, which is a great resource for getting up and running quickly (but which also has some drawbacks — I’ll likely switch to pure jQuery for the next major version, but I’m also keeping an eye on the jQTouch project). A quick rundown of the features of the web app:
- Directory Search — if you’re affiliated with UT Law School you can search our internal phone and email directory by name or department, using the native iPhone apps to place calls and send emails directly,
- Event listings and Notices pulled from our existing calendar and Law Mail announcement systems,
- RSS feed view of our press releases,
- Recent Twitter posts from our Communications office (this will make more sense when/if we have more than one Twitter account posting official news, and can combine them into one stream here),
- Maps: detailed building maps, Google maps that use the iPhone location services to guide you to our building, KML-based maps of public parking, nearby hotels, and restaurants,
- and a psuedo-iPhone style photo gallery that’s pulled from our existing mini-gallery on the regular website, adding the ability to flick through the images (did you know that Mobile Safari adds nifty JavaScript events for multi-touch gesture support? I didn’t until this project…)
There are a lot of things already in the works for the next iteration. The number one goal is to support other popular devices, to live up to the ideal of “one web, any browser”. As a developer who has wrestled against the wide range of inconsistent desktop browsers and all of their HTML and CSS inconsistencies over the years, though, it was really, really, nice to work with a single browser that already supports HTML5 and CSS3 presentation out of the box. Now I’m spoiled.
Leave a comment
Please feel free to leave a response, I’d love to know what you think!
There’s also an RSS 2.0 feed for comments left
on this entry, if you’re into that sort of thing.
October 10th, 2009
1:59 pm
permalink
Great app for the iPhone. Have begun using JQTouch as well. Some of the mapping items are a great way to implement using the available resources. With so little documentation on the integration of Google Maps and JQTouch, would you be willing to share some of your insight on how you created this through your blog?
October 10th, 2009
8:20 pm
permalink
Glad you liked it! I haven’t made the switch to JQTouch yet, so I don’t know what its mapping features and limitations are (I used the iUI framework along with some custom JavaScript for this web app). All of the map features of the app that I made are simply links pointing to Google Maps via URL — so for example the ‘Restaurants’ map is just a link pointing to
http://maps.google.com/?q=food&near=727+E+Dean+Keeton+St+Austin+TX+78705 and similarly the ‘Hotel’ map just puts ‘hotel&near’ in the query string. As you probably already know, any time a user clicks on a http://maps.google.com/* link in Safari Mobile, the iPhone bounces the request across to the built-in Google Maps app, so it’s fairly seamless.
I’ve also found that you can use KML to draw custom points on a map using Google’s My Maps tool, but the trick to getting it to work on the iPhone is that you must urlencode the entire URL. KML links used to work natively on the iPhone, stopped working somewhere around iPhone 3.0 or so, but for some reason the urlencoding still does the trick. Kind of a hack, so definitely keep an eye on it…it might be ‘fixed’ in an upcoming iPhone OS release. You’re also limited to 10 ‘pushpins’, and the custom graphics that you get on the regular, non-mobile Google Maps site aren’t available on the iPhone.
Hope that helps! I’ll try to write up a more detailed blog post on the technology and undocumented hacks sometime soon.
October 11th, 2009
5:10 am
permalink
That’s excellent. Thanks for sharing some of your practices in getting this online. Really nice web app.
October 11th, 2009
9:36 am
permalink
You might also want to check out this not-yet-published book from O’Reilly: Building iPhone Apps with HTML, CSS, and JavaScript by Jonathan Stark. He’s posted the current working draft online as a CC-licensed work — I wish I had all of this info back at the start of the summer! The client-side data storage and application cache sections are especially useful, I haven’t seen much documentation about those features of Safari Mobile.
October 11th, 2009
5:08 pm
permalink
I saw that the other day, thanks. Looking into it. I have been playing with iui and jqtouch; weighing the benefits of both as I build a few web apps, in concert with regular iphone programming. Integration of mapping solutions is a big topic for me and my apps since I focus heavily on solutions for destination travel. Again, thanks for sharing your insight.
March 2nd, 2011
2:14 pm
permalink
I have seen your work and I’m impress.
Is it possible to have your source file of your work
many thanks
Tom
March 2nd, 2011
9:45 pm
permalink
Hi Tom,
Thanks for the compliment! I can’t share the source code for this iPhone web app, as it’s too heavily tied into our University-specific resources — but at this point it’s outdated and you probably wouldn’t want to use it as a good place to start anyways! I’d suggest looking at some of the newer frameworks for building these sort of apps, like jQuery Mobile or Sencha Touch (or for native apps, perhaps PhoneGap). Good luck!