Tuesday 6 March 2012

yii mobile - Part 1

I'm working on a new project, Pressimus, which is built on the yii framework.

As a relatively young framework, yii documentation is a bit sparse, so I'm publishing this in hopes of helping others, and hopefully eliciting commentary to improve my design. So if you know better than me, please tell me!

Without further ado...

yii mobile strategy

There is a fair bit of planning and consideration in creating a mobile strategy for your site. I have done this for a mature website, which is a whole different ball of wax. Here we're going to start fresh, and if the question is "What should my mobile strategy be?", the answer is "it depends". Saying all websites are the same is like saying all houses are the same. They aren't.

The main consideration is: mobile web, or native app? I'm going to concentrate on building a web version of a site now, but this is the biggest question you'll face. Google it to find reams of discussion.

Taking a linear approach into the web app, you'll first want to know if your users are using a mobile device or not. A very simple regex-based approach is used by the yii extension detectmobilebrowser.

Simply add the following into the components array in public_html/protected/config/main.php file:

'detectMobileBrowser' => array(
'class' => 'application.extensions.yii-detectmobilebrowser.XDetectMobileBrowser',
),

Since I put the extension file XDetectMobileBrowser.php into the public_html/protected/extensions/ folder under its own folder, yii-detectmobilebrowser, I changed the classpath from the one listed on the extension's tutorial to application.extensions.yii-detectmobilebrowser.XDetectMobileBrowser.

Then, in controllers/SiteController.php, I have added the detection call in the init() method:

public function init(){
if (Yii::app()->detectMobileBrowser->showMobile) {
//$this->layout='//layouts/mobile';
Yii::app()->session['isMobile'] = 1;
} else {
Yii::app()->session['isMobile'] = 0;
}
}


Now, you can draw this from your session variable.    

Considerations at this point: 
  1. If you need to know more than a browser type (like screen size, resolution, camera support, etc.) then you can consider the WURFL library, which has recently and controversially become commercial. The incredible Apache Software Foundation (A has recently accepted an incubator called DeviceMap that will be a mobile browser capability detection library that will remain open source, and is probably the one you'll want to use and contribute to going forward, if you want to avoid the commercial licencing and associated fees. This one'll be done right, knowing the big brains behind the ASF.
  2. What should you do when a browser is mobile? Immediately connect to the mobile site? Go to a "choose preferred site version" screen? There are many permutations here: for example, what if a mobile site is a stripped-down version of the main site, and the user wants full-site functionality and you've forced them into the mobile site?  I won't go one here but each site will have to carefully consider it's use cases here.

Next time: we'll create a yii mobile theme!

1 comment: