The document discusses the benefits and current state of JQuery Mobile, a JavaScript mobile development framework. It notes that JQuery Mobile is built on web standards, has a talented team, and avoids having to learn multiple frameworks/languages. However, it is still in alpha with a heavy footprint, no finalized customization API, and limited theming options. The document encourages using PhoneGap to package JQuery Mobile sites into native mobile apps for app stores.

1. JQuery Mobile

2. Hi!
www.enlightsolutions.com
on the InterWeb
dpickett
on the
Twitterz

4. OMG, That’s a lot of devices!

5. • Blackberry == Horrible Java
• Android == Tolerable Java
• IPhone == Foreign Obj-C
• Windows Mobile == Sepaku!!!

6. • Blackberry == Horrible Java
• Android == Tolerable Java
• IPhone == Foreign Obj-C
• Windows Mobile == Sepaku!!!

7. How’s about some Semantic
• Blackberry == Horrible Java
Web?
• Android == Tolerable Java
• IPhone == Completely foreign Obj-C
• Windows Mobile == Sepaku!!!

8. HTML5 Is Awesome

9. JQuery is Awesome
I
Happy Valentine’s Day

10. JQuery Mobile
Awesome^2

11. mobile-fu
app/controllers/application_controller.rb
def set_mobile
if request.format && request.format.html?
session[:mobile_view] = true
end
if session[:mobile_view] == true
request.format = :mobile
end
end

12. mobile-fu
app/controllers/application_controller.rb
def set_mobile
if request.format && request.format.html?
session[:mobile_view] = true
end
if session[:mobile_view] == true
request.format = :mobile
endhttps://github.com/brendanlim/mobile-fu
end

13. mobile-fu
config/initializers/mime_types.rb
Mime::Type.register_alias "text/html", :mobile

14. app/views/layouts/application.mobile.erb
<%= stylesheet_link_tag("jquery.mobile.min.css", "mobile_frontend")
%>
<%= csrf_meta_tag %>
<%= javascript_include_tag "jquery-1.4.4.min.js" %>
<script type="text/javascript">
$(document).bind("mobileinit", function(){
$.extend( $.mobile , {
ajaxLinksEnabled: false,
ajaxFormsEnabled: false
});
});
</script>
<%= javascript_include_tag "jquery.mobile.min.js" %>

15. app/views/layouts/application.mobile.erb
<%= stylesheet_link_tag("jquery.mobile.min.css", "mobile_frontend")
%>
<%= csrf_meta_tag %>
<%= javascript_include_tag "jquery-1.4.4.min.js" %>
<script type="text/javascript">
$(document).bind("mobileinit", function(){
$.extend( $.mobile , {
ajaxLinksEnabled: false,
ajaxFormsEnabled: false
});
});
</script>
<%= javascript_include_tag "jquery.mobile.min.js" %>
https://github.com/jquery/jquery-mobile

16. app/views/layouts/application.mobile.erb
<div data-role="page" id="page">
<div data-role="header" data-backbtn="true" id="header">
<h1>
<%= image_tag "/images/css/textaurant-logo-small.png", :alt =>
"Textaurant" %>
<%- if yield(:title).present? -%>
<%= yield(:title) %>
<%- end -%>
</h1>
<%= yield(:title_button) %>
</div>
<%= render :partial => "shared/flashes" %>
<div data-role="content">
<%= yield %>
</div>
</div>

17. app/views/restaurants/index.mobile.erb
<%= content_for :title do -%>
<h1>Restaurants</h1>
<%- end -%>
<ul data-role="listview">
<li data-role="list-divider">
Please select a restaurant
</li>
<%- @locations.each do |i| -%>
<li class="arrow">
<%= link_to i.name, new_restaurant_visit_path(i) %>
</li>
<%- end -%>
</ul>

20. JQueryMobile Is
Awesome
• Built on web standards
• Built by a talented and capable team
• It’s JQuery-based
• It’s not having to learn 5 different
frameworks and languages

21. Currently In Alpha

23. JQuery Mobile is Young
• Heavy footprint
• No final API for customization
• Limited theme extensibility

24. For App Store Love

25. For App Store Love
https://github.com/phonegap/phonegap

26. Thanks!