Sunil's Notes: android

Showing posts with label android. Show all posts

Reading data stored in localStroage by Android Device or Google Chrome Browser

While working on my Using localStorage/sessionStorage in PhoneGap application example i was trying to debug a issue on the Android device where the data was not getting stored properly (Due to my programming mistake) and i wanted to figure out what data is actually getting stored so i used these steps.

First i used the DDMS view in Eclipse to get access to the local file system on Andorid. All the data for an application is stored in andorid in data/data/<apppackage> folder, In my case application package name is com.HelloLocalStorage

Whatever you store in window.localStorage object is actually stored in the data/data/<apppackage>/app_database/file_0.localstorage file, first download it to your computer. This file is actually SQLLite database, so if you open it in normal notepad you wont be able to read it. When you store data in localStroage object in the Google chrome it gets stored in C:\Users\<username>\AppData\Local\Google\Chrome\User Data\Default\Local Storage directory.
If you want to open SQLLite database you will have to use one of the admin tools, i used the MikeTS SQLLite Management tool to open the file_0.localstorage file and it seems that Google Chrome stores the localStorage data in ItemTable, that table has 2 columns one is key and other is value, when i queried the ItemTable i could see the data stored in local preferences like this

Consuming REST service from PhoneGap/Cordova

In the Using JPA in REST web application deployed in Jetty entry i blogged about how to build a ManageContact JPA service which will allow me to perform CRUD operations on CONTACT table using a REST service. I wanted to figure out how i can consume this service from PhoneGap/Cordova application so i built this sample application which will call http://localhost:9000/ManageContact/rest/contact rest service, read the contact list returned in XML format, parse it and display contact list to the user, you can download the sample application from here This screen shot displays the list of contacts that i got from the REST service

I followed these steps to build the CordovaManageContact application

I followed the instructions in Getting Started with Android to build application that points to index.html inside the application, i tried it once to make sure that it works

Then i changed the index.html file for my application to look like this


<!DOCTYPE html>
<html>
<head>
<title>Device Properties Example</title>
<script type="text/javascript" charset="utf-8" 
src="cordova-1.7.0.js"></script>
<script src="js/jquery.js"></script>

<script type="text/javascript" charset="utf-8">
  $(document).ready(function(){
    $("#getContactBtn").click(getContactList);
  });
  function onDeviceReady() {
    console.log("Entering index.html.onDeviceReady");
    getContactList();
    console.log("Exiting index.html.onDeviceReady");
  }
  function getContactList(){ 
    console.log("Entering getContactList()");
    $.ajax({
      url : "http://192.168.1.101:9000/ManageContact/rest/contact",
      dataType:"xml",
      cache: false,
      error:function (xhr, ajaxOptions, thrownError){
        debugger;
                alert(xhr.statusText);
                alert(thrownError);
            },
      success : function(xml) {
        console.log("Entering getContactList.success()");
      
        $(xml).find("contact").each(function() {
          var html = '<li>' + $(this).find("firstName").text() 
          + ' ' + $(this).find("lastName").text() +'</li>';
          $('#contactList').append(html);
        });
        console.log("Exiting getContactList.success()");
      } 
    });
    console.log("Exiting getContactList()");
  }
</script>
</head>
<body>
  <h3>Contact List</h3>
  <button id="getContactBtn">Get Contact</button>
  <ul id="contactList"></ul>
</body>
</html>

When i click on the Get Contact button the getContactList() method gets called, it uses the jquery $.ajax() method to make a call and once the result is returned, it uses logic in the success method to parse the xml and get all the contact records and adds each one of them as list item in the contactList list. I have the REST service running on my machine along with the Android emulator which has the PhoneGap application but when i tried to access the service at http://localhost/ManageContact/rest/contact,http://127.0.0.1/ManageContact/rest/contact it did not work. I tried to map the ip address 192.168.1.101 to demohost.com in my host file but Android did not understand that mapping either. I had to use ipconfig command to figure out the ip address of the machine and then use it.

Using Geolocation API in Android Emulator

In the Getting address of the current location using GeoLocation API and Google MAP api entry i talked about how to use the GeoLocation API provided as part of HTML 5 to get the current address of the user. Now Phone Gap also provides support for geolocation which means it checks if the browser on the device has support for geolocation if yes it lets it work if not it will call the native API of the underlying browser to get the the location and return it to browser. I wanted to try that so i took the content of geolocation.html and copied it in the index.html file that my phonegap application for android is using, you can download that app from here I followed these steps to build Android PhoneGap application

I followed the instructions in Getting Started with Android to build application that points to index.html inside the application, i tried it once to make sure that it works
Then i copied the content of Geolocation.html in the index.html page

Change the AndroidManifest.xml file to allow application to use the mock location


<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.webspherenotes.phonegap"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk android:minSdkVersion="8" />
    <uses-permission android:name="android.permission.CAMERA" />
  <uses-permission android:name="android.permission.VIBRATE" />
  
  <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
  <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
  <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
  <uses-permission android:name="android.permission.ACCESS_MOCK_LOCATION" />
 
 <uses-permission android:name="android.permission.READ_PHONE_STATE" />
  <uses-permission android:name="android.permission.INTERNET" />
  <uses-permission android:name="android.permission.RECEIVE_SMS" />
  <uses-permission android:name="android.permission.RECORD_AUDIO" />
  <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
  <uses-permission android:name="android.permission.READ_CONTACTS" />
  <uses-permission android:name="android.permission.WRITE_CONTACTS" />
  <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> 
  <uses-permission android:name="android.permission.GET_ACCOUNTS" />
  <uses-permission android:name="android.permission.BROADCAST_STICKY" />
    <application
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name" >
        <activity
            android:name=".HelloPhoneGapActivity"
            android:label="@string/app_name" 
            android:configChanges="orientation|keyboardHidden" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

The android emulator does not know how to find out current location of the user, so we have to setup mock location i.e. hard code a location for the user. For that you have two options either use the DDMS perspective in your Eclipse and after your emulator is started select it and enter value of longitude and latitude and click on send like this.
Or open a Telnet session to the emulator by executing telnet localhost 5554 (you can get port number 5554 from the emulator window it would be in title bar) and then in the telnet window use geo fix -121.9754144 37.5669038 command to set the longitude and latitude like this

Now when i run this application in the Android emulator i can see it displaying the address for location that i sent to the emulator like this