Using Cordova Network API in gwt phonegap

The Network API provides access to the network connectivity information of the device, including wifi and cellular connection status.

Configuration

For using this API, you need to add Network Information plugin to your project.

cordova plugin add cordova-plugin-network-information

The network API can be accessed in gwt phonegap project as described below.



final PhoneGap phoneGap = GWT.create(PhoneGap.class);
Connection connection = phoneGap.getConnection();

The Network API is a very simple API and provides only 1 property/method and 2 events.



Usage

connection.type

Description

This provides the type of active network connection available. The possible connection types are :

• Connection.UNKNOWN
• Connection.ETHERNET
• Connection.WIFI
• Connection.CELL_2G
• Connection.CELL_3G
• Connection.CELL_4G
• Connection.CELL
• Connection.NONE

If the device doesn’t have a active network connection, then the connection type returned is NONE.

If the device has a active Wifi connection and a active 3G/2G/4G connection, then the connection type returned will be Wifi. The devices are designed to use the most efficient network when multiple active networks are available. Since the wifi is more efficient(more reliable, stable and cost effective), the devices normally use wifi even if other cellular connection types are available. If wifi is not available, then the device will check for the next efficient cellular connection type which normally will be in the sequence 4G,3G ,2G and CELL.

Sometimes, it is just not enough to known whether the device has active network connection or not. The application needs to know what is the connection type. You may have a user preference where user decides if the app can work on Cellular network or not. In this case, you need to check the connection type to match the user preference and allow the app to work in offline or not allow the user to launch if the connection type doesn’t match the user preference.

Code

String connectionType = connection.getType();

Supported Platforms

• iOS
• Android
• Windows : When running on a emulator, the connection type is ETHERNET.

offline

Description

This event is fired when the device connected to the network is disconnected.

Code

The code for registering the offline event is below.
phoneGap.getEvent().getOffLineHandler().addOfflineHandler(new OffLineHandler() {
               
                @Override
                public void onOffLine(OffLineEvent event) {
               //Add your code here.
                }
            });

online

Description

This event is fired when the device is connected to the network.

Code

The code for registering the online event is below.
phoneGap.getEvent().getOnlineHandler().addOnlineHandler(new OnlineHandler() {
           
            @Override
            public void onOnlineEvent(OnlineEvent event) {
            //Add your code here.
            }
        });

Demo

The below example demonstrates usage of the Network API.

public class ConnectionDemo implements EntryPoint {
     private Logger log = Logger.getLogger(getClass().getName());
     private ScrollPanel scrollPanel = null;
     private LinkedList<String> list = null;
     private CellList<String> cellList = null;
     private Connection connection = null;
    
    /**
     * This is the entry point method.
     */
    public void onModuleLoad() {
         GWT.setUncaughtExceptionHandler(new GWT.UncaughtExceptionHandler() {
              @Override
              public void onUncaughtException(Throwable e) {
                Window.alert("uncaught: " + e.getLocalizedMessage());
                Window.alert(e.getMessage());
                log.log(Level.SEVERE, "uncaught exception", e);
              }
            });
            final PhoneGap phoneGap = GWT.create(PhoneGap.class);
            phoneGap.addHandler(new PhoneGapAvailableHandler() {
              @Override
              public void onPhoneGapAvailable(PhoneGapAvailableEvent event) {
                    createUI(phoneGap);
              }
            });
            phoneGap.addHandler(new PhoneGapTimeoutHandler() {
              @Override
              public void onPhoneGapTimeout(PhoneGapTimeoutEvent event) {
                Window.alert("can not load phonegap");
              }
            });
            phoneGap.initializePhoneGap();
    }
    private void createUI(final PhoneGap phoneGap) {
        try {
            scrollPanel =  new ScrollPanel();
            list = new LinkedList<String>();
            BasicCell<String> cell = new BasicCell<String>() {
                @Override
                public String getDisplayString(String model) {
                    return model;
                }
            };
             cellList = new CellList<String>(cell);
            scrollPanel.add(cellList);
             connection = phoneGap.getConnection();
            addInfo("Connection Type : ");
            phoneGap.getEvent().getOnlineHandler().addOnlineHandler(new OnlineHandler() {
               
                @Override
                public void onOnlineEvent(OnlineEvent event) {
                    addInfo("online and connection Type : ");
                }
            });
            phoneGap.getEvent().getOffLineHandler().addOfflineHandler(new OffLineHandler() {
               
                @Override
                public void onOffLine(OffLineEvent event) {
                    addInfo("Offline and connection Type : ");
                }
            });
            RootPanel.get("ConnectionDemo").add(scrollPanel);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
   
    private void addInfo(String type) {
        list.add(type+connection.getType());
        cellList.render(list);
        scrollPanel.refresh();
    }
}

Test

For testing, I will run this app in both iPhone 6 and Nexus 6P devices. The test steps are below.

1. The app is launched when the device is connected to wifi and there is no cellular connectivity.
2. Then the wifi is disabled and since there is no cellular connectivity, the device is in offline mode.
3. The wifi is enabled.
4. The wifi is again disabled.
5. The cellular connectivity is enabled.
6. The cellular connectivity is disabled.

Android Device

iOS Device

The code is available on the github.