Todd Huss » WAP and WML http://gabrito.com Anecdotes on Technology Leadership, Ruby, Java, Scala, Cloud Computing, Open-Source, SEO, and Design Thu, 08 Dec 2011 00:21:55 +0000 en hourly 1 http://wordpress.org/?v=3.3 Making your Rails app mobile with WAP and WML http://gabrito.com/post/making-your-rails-app-mobile-with-wap-and-wml http://gabrito.com/post/making-your-rails-app-mobile-with-wap-and-wml#comments Thu, 31 Aug 2006 10:02:45 +0000 Todd Huss http://gabrito.com/post/making-your-rails-app-mobile-with-wap-and-wml Continue reading →]]> I’d been wanting to make my Ruby on Rails based San Francisco Sailing Weather site available for mobile / cell phones. Now that I’m on vacation in Germany I had a stretch on a train ride where I was able to crank out a simple working version. Here are the steps I took:

1. Set the WAP WML content type. You can do this on each controller method, or by using a controller specific before_filter, or an application wide before_filter as I did that applies to all actions with the name wap in app/controllers/application.rb:

<small>
before_filter :set_wap_content_type, <span>:</span>only => :wap
</small>
<small>
def set_wap_content_type
&#160;&#160;@headers["Content-Type"] = "text/vnd.wap.wml; charset=iso-8859-1"
end
</small>

2. Next I created an app/views/layouts/wap.rhtml decorator to wrap all of my WML documents with:

<small>
&lt;?xml version="1.0"?&gt;
&lt;!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"&gt;
&lt;wml&gt;
&lt;card title="&lt;%= @title %&gt;"&gt;
&lt;p align="center"&gt;
&lt;%= @content_for_layout %&gt;
&lt;/p&gt;
&lt;/card&gt;
&lt;/wml&gt;
</small>

3. Then I added a wap method to my index controller so that users can access the mobile version of the site via http://windandtides.com/wap

<small>
def wap
&#160;&#160;@title = "San Francisco Sailing Weather"
&#160;&#160;render(:layout => "wml")
end
</small>

4. Finally I created a app/views/index/wap.rhtml to provide the content for the home page:

<small>
&lt;%= link_to 'NOAA Marine Forecast', { :controller => '/marine/forecast', :action => 'wap' } %&gt;&lt;br/&gt;
&lt;%= link_to 'Wind Readings', { :controller => '/marine/wind', :action => 'wap' } %>&lt;br/&gt;
&lt;%= link_to 'Current Predictions', { :controller => '/marine/tide', :action => 'wap' } %&gt;
</small>

Here is a demo of the result. You could probably also use your regular actions and adjust the content-type and view you serve based on the accepts header which you can access via the respond_to method. WAP/WML enabling the sub pages turned out to be a snap as I’d already broken out the content into partials from when I added RSS support so I was able to re-use those partials without any additional changes.

Some helpful web tools and references that I used were:

W3schools WAP tutorial
W3schools WML reference
Web based WAP Emulator

]]> http://gabrito.com/post/making-your-rails-app-mobile-with-wap-and-wml/feed 5