XPages for iPhone

Well kinda….

Developing a web application for the
iPhone or any mobile browser is a bit different from developing for a desktop
browser. You need to take into account the size of the screen, the amount
of css file external JavaScript files that are downloaded and, in the case
of the iPhone, you may even want to get your application to conform to
the Apple
iPhone Web User Interface guidelines
.

If your developing an XPages application
you could just leave it as is and quite a lot of your application will
work on the iPhone. It will look exactly like it does on the desktop web
browser but a lot smaller. The dojo stuff seems to work ok so far, even
partial refreshes seem to work but there is a lot more you could do for
your iPhone users.

Lets start by redirecting your iPhone
users to a different page that might be customized for the iPhone. This
is actually pretty simple. In the beforePageLoads event for the page you
want to redirect FROM you can put in the following serverside JavaScript
:

var uAgent = context.getUserAgent().getUserAgent();

if (uAgent.match("iPhone") != null){
       context.redirectToPage("/iPhone.xsp");
}

By looking at the userAgent string provided
by the users browser we can quickly redirect to a different page. Nice
and simple.

If your application is using a theme
document then you could also make sure that a special iPhone CSS file is
loaded, for example

<resource rendered="#{javascript:context.getUserAgent().getUserAgent().match("iPhone")}">
<content-type>text/css</content-type>
<href>iPhone.css</href>
</resource>

Adding a similar but reversed rendering
command to the rest of your css files in the theme document would make
sure that those css files are not loaded when using the iPhone.

Obviously the same concepts will work
for any browser, mobile or desktop. So who knows maybe soon we’ll start
seeing Xpage applications that contain multiple interfaces based on the
browser that is accessing them.  I know I’m going to work on an iPhone
interface for the XPages Phonebook, who knows maybe there will be another
short tutorial on how I build it.

Advertisements
Tagged with: ,
Posted in None
One comment on “XPages for iPhone
  1. Apollo Entice says:

    Very good example. I’m very thankful for all your post. It’s a GIANT help. More power to you.How about Blackberry (uAgent.match(“?”)? What will I replace with “iPhone”?

    Like

Comments are closed.

Archives
%d bloggers like this: