determine if the device on which browser is running in gwt bootstrap

Question

Is their any way in gwt or gwt bootstrap to find the device on which the web app is running. Like if the device is iphone,tablet,desktop.ipad etc.,Please help.

Answer 1

You don't need bootstrap at all to know which browser your client is running on.

Just call...

Navigator.getUserAgent() 

...to get the user-agent of the browser.

A list of all user-ager avaiable is provided here:

http://www.useragentstring.com/pages/All/

For instance, check for "ipad" match in user-agent String.

Answer 2

Setup

GWT allows you to define properties which will be resolved during the execution of the deferred binding mechanism (part of the startup sequence of your app, see Elements of Deferred Binding here). For example, defining this in your app's gwt.xml file:

<define-property name="formfactor" values="desktop,tablet,mobile" />

And then supplying this in the same file:

<property-provider name="formfactor">
  <![CDATA[
    // my User Agent String-parsing JavaScript code 
  ]]>
</property-provider>

For a full example, see MobileWebApp, a GWT sample app. Specifically, take a look at FormFactor.gwt.xml.

Usage

Once you set up your property and program its provider, there are multiple places in your app where you can reach the value of the property:

• CSS:

   @if formfactor mobile {
     /* my mobile form factor-specific rules */
   }     
  

  (for more supported rules see CssResource)

• In the module XML definition (e.g. for ClientFactory selection):

  <replace-with class="com.my.client.ClientFactoryImplDesktop">
    <when-type-is class="com.my.client.ClientFactory" />
    <when-property-is name="formfactor" value="desktop" />
  </replace-with>
  

• Java code? Only via deferred binding.