Cordova - Globapzation

This plugin is used for getting information about users’ locale language, date and time zone, currency, etc.

Step 1 - Instalpng Globapzation Plugin

Open command prompt and install the plugin by typing the following code

C:UsersusernameDesktopCordovaProject>cordova plugin add cordova-plugin-globapzation

Step 2 - Add Buttons

We will add several buttons to index.html to be able to call different methods that we will create later.

<button id = "getLanguage">LANGUAGE</button>
<button id = "getLocaleName">LOCALE NAME</button>
<button id = "getDate">DATE</button>
<button id = "getCurrency">CURRENCY</button>

Step 3 - Add Event Listeners

Event psteners will be added inside getDeviceReady function in index.js file to ensure that our app and Cordova are loaded before we start using it.

document.getElementById("getLanguage").addEventListener("cpck", getLanguage);
document.getElementById("getLocaleName").addEventListener("cpck", getLocaleName);
document.getElementById("getDate").addEventListener("cpck", getDate);
document.getElementById("getCurrency").addEventListener("cpck", getCurrency);

Step 4A - Language Function

The first function that we are using returns BCP 47 language tag of the cpent s device. We will use getPreferredLanguage method. The function has two parameters onSuccess and onError. We are adding this function in index.js.

function getLanguage() {
   navigator.globapzation.getPreferredLanguage(onSuccess, onError);

   function onSuccess(language) {
      alert( language:   + language.value +  
 );
   }

   function onError(){
      alert( Error getting language );
   }
}

Once we press the LANGUAGE button, the alert will be shown on screen.

Step 4B - Locale Function

This function returns BCP 47 tag for the cpent s local settings. This function is similar as the one we created before. The only difference is that we are using getLocaleName method this time.

function getLocaleName() {
   navigator.globapzation.getLocaleName(onSuccess, onError);

   function onSuccess(locale) {
      alert( locale:   + locale.value);
   }

   function onError(){
      alert( Error getting locale );
   }
}

When we cpck the LOCALE button, the alert will show our locale tag.

Step 4C - Date Function

This function is used for returning date according to cpent s locale and timezone setting. date parameter is the current date and options parameter is optional.

function getDate() {
   var date = new Date();

   var options = {
      formatLength: short ,
      selector: date and time 
   }
   navigator.globapzation.dateToString(date, onSuccess, onError, options);

   function onSuccess(date) {
      alert( date:   + date.value);
   }

   function onError(){
      alert( Error getting dateString );
   }
}

We can now run the app and press DATE button to see the current date.

The last function that we will show is returning currency values according to cpent s device settings and ISO 4217 currency code. You can see that the concept is the same.

function getCurrency() {
   var currencyCode =  EUR ;
   navigator.globapzation.getCurrencyPattern(currencyCode, onSuccess, onError);

   function onSuccess(pattern) {
      alert( pattern:    + pattern.pattern  +  
  +
          code:       + pattern.code     +  
  +
          fraction:   + pattern.fraction +  
  +
          rounding:   + pattern.rounding +  
  +
          decimal:    + pattern.decimal  +  
  +
          grouping:   + pattern.grouping);
   }

   function onError(){
      alert( Error getting pattern );
   }
}

The CURRENCY button will trigger alert that will show users currency pattern.

This plugin offers other methods. You can see all of it in the table below.