« Back

Mobile Device Recognition beyond the UI

Company Blogs June 27, 2013 By Milen Dyankov Staff

As you probably know in version 6.1 Liferay introduced the mobile device rules feature. However if you haven't followed the discussions and presentations about it, you may be under the wrong impression that is't very limited. Some people even claim it doesn't work. Judging by the number and type of questions I still get asked now days, I think I know where most of the confusion comes from - the user interface.

The first problem is that the UI will let you create rules even if there is no plug-in capable of actually detecting the device. Yes, you do need a plug-in for that. The API, data model and the UI are provided with the portal, but similarly to workflow and search (just to name a few) functionalities, the actual work of detecting the device is delegated to an external plugin. At the time of writing there is only one such plugin in Marketplace - Device Recognition Provider which internally uses WURFL. However if other providers become available in the future (or you create your own one), you will still be able to seamlessly hook them in.

Now, as I mentioned earlier, the UI will not warn you if the plugin is not installed. It will let you create a rule and the rule of course will never match as long as the plugin is missing! Of course all this is explained in the documentation but for those very few people who don't have the time to read it, in Liferay 6.2 we added a very visible warning message!

The second problem is about answering the "how much is not too much?" question properly. I guess we can have an endless discussion on this one but the fact is that at some point of time a decision was made that the only criterias that need to be available in the UI are operating system and whether the device is a tablet. In Liferay 6.2 you will be also able to specify ranges of screen resolutions and display sizes. I understand this still may be too limited for some of you, but the truth is, everyone has his needs and there is no way to make an user friendly interface that will cover all WURFL capabilities! Well, may be there is - a DSL (Domain Specific Language) on top of some rule engine will actually fit nice in here. Unfortunately there were more important things in the 6.2 road map so you'll have to wait a bit longer for this one or help us implement it!

The good news is you can use all of the capabilities in your custom portlets. You can use DeviceDetectionUtil to get the current user's Device. Once you get the Device object you can get the value of any WURFL capability by calling getCapability(java.lang.String) method. Actually you can do the same even from web content templates. Here is a simple example that will render some phone numbers as links if the device is capable of doing phone calls or sending text messages.


<?xml version="1.0"?> 
  <dynamic-element name="phone_number" type="text" index-type="" repeatable="false"/>   
  <dynamic-element name="sms_number" type="text" index-type="" repeatable="false"/>  
  <dynamic-element name="email" type="text" index-type="" repeatable="false"/>

Template in Velocity:

#set( $callPrefix = $device.getCapability("xhtml_make_phone_call_string") )
#set( $smsPrefix = $device.getCapability("xhtml_send_sms_string") )
#set( $canDoPhoneCalls = $callPrefix != "none" )
#set( $canSendSMS = $smsPrefix != "none")

<h3>Contact us!</h3>

You can
  <li>call us at  
    #if( $canDoPhoneCalls )
      <a href="$callPrefix$phone_number.getData()">$phone_number.getData()</a> 
  <li>or send an SMS message to 
    #if( $canSendSMS )  
      <a href="$smsPrefix$sms_number.getData()">$sms_number.getData()</a> 
    and we'll call you back  
  <li>or <a href="mailto:$email.getData()">e-mail us </li>

Template in Freemarker:

<#assign callPrefix = device.getCapability("xhtml_make_phone_call_string")>
<#assign smsPrefix = device.getCapability("xhtml_send_sms_string")>
<#assign canDoPhoneCalls = (callPrefix != "none")>
<#assign canSendSMS = (smsPrefix != "none")> 

<h3>Contact us!</h3>

You can
  <li>call us at
    <#if canDoPhoneCalls >
      <a href="${callPrefix + phone_number.getData()}">${phone_number.getData()}</a>
  <li>or send an SMS message to
    <#if canSendSMS >
      <a href="${smsPrefix + sms_number.getData()}">${sms_number.getData()}</a>
   and we'll call you back
  <li>or <a href="mailto:${email.getData()}">e-mail us </li>

I hope the above proved to you the device recognition functionality in Liferay is not as limited as it may seem on the first look! And I certainly hope more will come in upcoming versions.

Threaded Replies Author Date
Looks pretty cool. Thanks for some interesting... Bart Simpson June 28, 2013 12:20 AM
Are you trying this with real device or a... Milen Dyankov June 28, 2013 4:29 AM
[...] 1 Jul 2013 Posted in: Liferay, Tips,... Anonymous July 1, 2013 2:30 AM
Hi. I'm customizing a portal with Liferay 6.1... Lucas Fragomeni October 20, 2014 5:37 AM
Device Recognition should work in both 61 and... Milen Dyankov October 20, 2014 6:45 AM
Thanks. When I changed my location on the... Lucas Fragomeni October 20, 2014 6:48 AM
The link to plugin in Marketplace - Device... George Cojocaru November 5, 2014 5:49 AM
Hey... i found the WURFL plugin WAR on this... Lucas Fragomeni November 5, 2014 7:30 AM
It is not working properly for Windows Mobiles,... siddhant jain November 10, 2014 4:30 AM
That depends on how accurate the WURFL database... Milen Dyankov November 10, 2014 5:01 AM
how can i update it?? siddhant jain November 10, 2014 5:58 AM

Looks pretty cool. Thanks for some interesting insight.
Tried the " DeviceDetectionUtil" in my custom portlet works great.
However when trying the in the velocity template that you suggested it's unable to detect device. Haven't done much digging into the code to check where $device is being injected, but may be you can shed some light into it.
Posted on 6/28/13 12:20 AM.
Are you trying this with real device or a browser with changed user-agent string? If the former, keep in mind the recognized device is stored in the session. This if you access the portal with your normal browser it will remember the device in the session and later on even if you change the user-agent it will not get recognized as mobile device. To work around this you need to log out or simply delete the browser cookies.

If this is not the case then check if there are any errors in log file.
Posted on 6/28/13 4:29 AM in reply to Bart Simpson.
[...] 1 Jul 2013 Posted in: Liferay, Tips, Tutorials By wasimshaikh No Comments Liferay Roundup : version control, most visited page count in liferay 6.1, mobile device detection in liferay Liferay... [...] Read More
Posted on 7/1/13 2:30 AM.
Hi. I'm customizing a portal with Liferay 6.1 EE. If the Device Recognition Plugin doesn't support that version, do I need to implement one myself?

Posted on 10/20/14 5:37 AM.
Device Recognition should work in both 61 and 6.2. See: https://www.liferay.com/marketplace/-/mp/application/35419014
Posted on 10/20/14 6:45 AM in reply to Lucas Fragomeni.
Thanks. When I changed my location on the marketplace to US I was able to visualize it. ;)
Posted on 10/20/14 6:48 AM in reply to Milen Dyankov.
The link to plugin in Marketplace - Device Recognition Provider ( http://www.liferay.com/marketplace/-/mp/application/15193341 ) is no more valid and it seems there is no more Device Recognition Provider free plugin in Marketplace.
Do you know from where to get this free plugin?
Posted on 11/5/14 5:49 AM.
Hey... i found the WURFL plugin WAR on this blog post and it works well: http://liferaytrends.blogspot.com.br/2013/05/mobile-theme-in-liferay.html

PS: When I asked the liferay support about it they sent me a newer version.
Posted on 11/5/14 7:30 AM in reply to George Cojocaru.
It is not working properly for Windows Mobiles, it gives the save values for Windows Mobile as for desktop.
But WURFL does supports windows Mobiles.
How can we differentiate between windows mobile and windows desktop??
Posted on 11/10/14 4:30 AM.
That depends on how accurate the WURFL database is. The one bundled with the plugin is somewhat old. You probably need to update it to the latest one.
Posted on 11/10/14 5:01 AM in reply to siddhant jain.
how can i update it??
Posted on 11/10/14 5:58 AM in reply to Milen Dyankov.