jQuery Mobile: uses, tips, and discussion

Date: 
Wednesday, October 10, 2012

ANNOUNCEMENTS

Scan Your Sites!
Before the presentation, Gil Salazar spoke briefly about the need to scan your web applications, especially in light of the recent hack attack:
http://azstarnet.com/news/local/education/college/hackers-hit-computers-...
Gil explained that the attack was accomplished using a blind SQL injection attack. The compromised sites had not been scanned, and scanning your sites should turn up any SQL injection vulnerabilities. Gil also expressed the hope that security aspects of SQL be included in next month's SQL 101 presentation. Mike H. chimed in and pointed out that a good reason to use a framework such as Drupal is that most frameworks are designed from the get-go to prevent any SQL injection.

Git pilot
Ben Emmons of UITS announced that the Git pilot will remain within UITS for now, but that Atlassian has a product called BitBucket with unlimited Git repositories, both public and private, for educational accounts.
https://bitbucket.org/

Responsive Design Working Group
Ben also announced the Oct. 23, 3pm, Computer Center 303 meeting of the UA Responsive Design Working Group.

PRESENTATION

Presenters:
Brett Bendickson, UITS - UAccess Student
Alex Ganz, UITS - Web & Mobile
Ben Emmons, UITS - Web & Mobile

Brett Bendickson
jQuery Mobile
http://jquerymobile.com/
From their website:
"jQuery Mobile: Touch-Optimized Web Framework for Smartphones & Tablets
A unified, HTML5-based user interface system for all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation. Its lightweight code is built with progressive enhancement, and has a flexible, easily themeable design."
Brett built a mobile website using jQuery Mobile for students to interact with their UAccess Student Peoplesoft data. Check out the beta at:
http://m.student.uaccess.arizona.edu
Used a Chrome plugin called Ripple that lets you test to simulate devices.
All underlying data is built out live from the beginning, then hidden behind the scenes by jQuery mobile. So if the user selects "Grades" it doesn't have to go out and look up the info, it's already there.
(also uses a PHP script written by Gary Windham that does an EDS lookup and returns the info as JSON.)

Alex Ganz
Alex's role was to theme the interface. He discussed various ways of doing this (such as manual styling, ThemeRoller, codiqa prototyping, etc.)
(Drupalistas: surprise! there's a module and theme for that! http://drupal.org/project/jquerymobile  and  http://drupal.org/project/mobile_jquery)
Q. Does Firebug work & recognize the style sheets?
A. Yes. Take note of <meta name="format_detection" content="telephone=no" /> so the phone doesn't try to convert everything to its own format.

Ben Emmons - Choices and Lessons Learned
Ben presented a number of options for "going mobile" arranged along a continuum from "fast dev time, cheap dev costs, OK user experience" to "long dev time, expensive, fantasics user experience"
Just to summarize, the most cheap/fast/OK is mobile/responsive website, and the most expensive/slow/fantastic is designing a native mobile app. If you're using a CMS it's going to be responsive web.