Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Cordova (Formerly PhoneGap) Network Type and Status in Windows Phone

DZone's Guide to

Cordova (Formerly PhoneGap) Network Type and Status in Windows Phone

· Web Dev Zone ·
Free Resource

Jumpstart your Angular applications with Indigo.Design, a unified platform for visual design, UX prototyping, code generation, and app development.

In this article I will discuss how to detect Network availability and Network type in Windows Phone using PhoneGap.

If this is your first time use of Cordova or PhoneGap, I would recommend to read Getting Started with Cordova or PhoneGap in Windows Phone

Let's write some code to create contact:

Step 1: Open index.html under www folder and put below code.

<!DOCTYPE html>
<html>
   <head>
      <title>Getting Started Sample</title>
      <script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
      <script type="text/javascript" charset="utf-8">
         var init = function init() {
            // Wait for Cordova to load
            document.addEventListener("deviceready", onDeviceReady, false);
            // Cordova is ready
            function onDeviceReady() {
            }
         };

         window.onload = init;
      </script>
   </head>
   <body>
   </body>
</html>

Step 2: Now modify onDeviceReady method like below which will notify if network is available or not and if available it will notify network type.

There are two event listener in onDeviceReady method, online and offline. online event triggers when device is connected to internet otherwise offline event triggers.

function onDeviceReady() {
   if (navigator.network.connection.type != Connection.NONE) {
      NetworkType();
   }
   else {
      alert("You are not connected");
   }
   document.addEventListener("online", onOnline, false);
   document.addEventListener("offline", onOffline, false);
}

Step 3: Now add NetworkType method which will notify the connection type the device is connected to.

function NetworkType() {
   switch (navigator.network.connection.type) {
      case Connection.UNKNOWN:
         alert("Connection type is not known");
         break;
      case Connection.ETHERNET:
         alert("Connection type is Ethernet");
         break;
      case Connection.WIFI:
         alert("Connection type is WiFi");
         break;
      case Connection.CELL_2G:
         alert("Connection type is 2G");
         break;
      case Connection.CELL_3G:
         alert("Connection type is 3G");
         break;
      case Connection.CELL_4G:
         alert("Connection type is 4G");
         break;
      case Connection.NONE:
         alert('No Network Connection');
         break;
   }
}

Step 4: Now add onOnline and onOffline method where we can right certain action which can be taken based on the application connected to internet or not


 

function onOnline() {
   //Perform action in case of online
}

function onOffline() {
   //Perform action in case of offline
}

Step 5: Now run the application and you will get screen like below, in my case I am connected to WiFi.


Cordova PhoneGap - Network Status Windows Phone

This ends the article of detecting network status and type using Cordova or PhoneGap in Windows Phone.

 

Take a look at an Indigo.Design sample application to learn more about how apps are created with design to code software.

Topics:

Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}