Forum OpenACS Development: Mobile Theme?

I find that most issues don't deviate from plain browser issues, once one switches from pixel-based dimensions to resolution independent ones, such as inch or cm; and using minimal amount of graphics (and repeating image use when possible).

I'd be curious if you're finding other issues.

cheers,

Torben

I've been looking into this as well and it seems media queries in CSS work well. Content is adapted to different device widths using something like:

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
// css rules go here
}

You can exclude large images, for instance, with display:none.

Probably the best implementation I've seen of an adaptive mobile display is here: http://www.ecentricarts.com. After poking through their CSS it looks like they used a similar rule.

There are other ways of doing it, like server side detection, but this seems the most common. This allows you to develop one theme package for many devices.

Regards,
Ryan

I agree. Your complaints can be addressed with proper mobile design, for instance, the "zoom" feature can be controlled with the meta viewport tag.

With a media query solution, an optimized mobile version can be delivered. For example, CSS can reduce a multi-column listbuilder list to a single column for the mobile version, but show all columns in a large screen format. The single column could include links to detail pages.

In this way the structure and functionality remain the same but the presentation layer (CSS) adapts to the device dimensions.

jQuery has a mobile library which looks very slick, and provided some good ideas.

Regards,
Ryan

As well as the WebApp interactions, I'd also want OpenACS to be able to serve the same content in the conventional interface for non-iOS users. CSS @media or javascript feature detection client-side to determine would not be enough in this case, because I need to serve fundamentally different underlying markup as well.

Which of the following would be best?

1) iOS device requests include a parameter webapp='t' which gets passed from page to page?

2) iOS device is identified at the time the session cookie is created and the session cookie is flagged (obviously this would a core change)?

3) Write completely new set of adp 'pages' to drive the webapp?

How best to do this for Xowiki content?

a) Should the render method for ::xowiko::FormPages be adapted, or should I write a new render_4iOS method?

b) Subclass ::xowiki::FormPage to ::xowiki::iOSFormPage, but then what about serving content to normal browsers (problem in reverse)?

b) Should this be done as per 1, 2 & 3 above, by modifying the xowiki adp templates?

There's no correct answer I know, but I'd really appreciate some opinions.

Regards
Richard

The results with JQuery are "a lot like mobile", meaning that you have real buttons, drop-down menu and stuff which seems quite native on every platform.

The drawbacks of using JQuery or other rich js libs is that you will somehow throw away all the HTML gui features in OpenAcs, which are very solid... the css approach is more prone to reuse in this sense.

With JQuery you end up creating javascript applications running on the browser, which speak with RESTful webservices written in OpenAcs. The platform would become a "mere" interface to data, which could be queried in many ways other than from the smart webpage.

Speaking about different templates for each device, one of the many alternatives could be to query the user agent to detect a particular browser, then use a different adp for it by esplicitly telling the tcl to compile against it instead of the generic one. Data logic would be only one, with many dresses.