Get contacts from iphone using sencha touch 2.4.1

Question

I am trying to get contacts from iphone4s (ios 8.1.2) using the following code snippet.

 if (Ext.os.deviceType == 'Phone'){
        var contactsConfig = {            
            success: function( contacts){
                Ext.Msg.alert('Contacts?', contacts.length, Ext.emptyFn);
            },

            failure: function(context){
                 Ext.Msg.alert('Failure', 'It did not work.', Ext.emptyFn);
           },
            scope: this,                                    
            includeImages: false
        };
        Ext.device.Contacts.getContacts(contactsConfig);         
    }

My phonegap config.xml has permission to read contacts

 <feature name="Contacts">
    <param name="ios-package" value="CDVContacts" />
</feature>

But I always end up getting contacts hard-coded in Ext.device.contacts.Abstract

Has anyone able to get contacts working on sencha touch 2.4.x? Or even older versions ?

Any help would be much appreciated.

Answer 1

I was able to solve the problem after a lot of hacks.

Step 1: Phonegap can read iOS contacts.
Step 2: Calling Ext.device.contacts.getContacts(). Sencha touch 2.4 documentation is wrong.
Step 3: Passing correct parameter to navigator functions. Also Ext.browser.is.Cordova or .Sencha doesn't work. So replace them.
Step 4: Cordova.js is needed for navigator functions to work.

1. Making sure in phonegap project, config.xml at different locations( i.e. , /www, //) have following in it

    <feature name="Contacts">
   <param name="ios-package" value="CDVContacts" />
   

2. Calling get contacts() the correct way

var opts = new ContactFindOptions();
opts.filter = "";
opts.multiple = true;
var contactsConfig = {
  options: opts,
  fields: ["name", "phoneNumbers"],
  success: function(contacts) {
    Ext.Msg.alert('Simple contacts', contacts.length, Ext.emptyFn);

  },

  failure: function(context) {
    Ext.Msg.alert('Failure', 'It did not work.', Ext.emptyFn);
  },
  scope: this,
  includeImages: false
};

Ext.device.Contacts.getContacts(contactsConfig);

3. Inside your sencha project, go to touch/src/device and change Contacts.js and contacts/Cordova.js respectively

Ext.define('Ext.device.Contacts', {
  singleton: true,

  requires: [
    'Ext.device.Communicator',
    'Ext.device.contacts.Sencha',
    'Ext.device.contacts.Cordova'
  ],

  constructor: function() {

    return Ext.create('Ext.device.contacts.Cordova');
  }
});

Ext.define('Ext.device.contacts.Cordova', {
  alternateClassName: 'Ext.device.contacts.PhoneGap',
  extend: 'Ext.device.contacts.Abstract',

  getContacts: function(config) {
    if (!config) {
      Ext.Logger.warn('Ext.device.Contacts#getContacts: You must specify a `config` object.');
      return false;
    }

    if (!config.success) {
      Ext.Logger.warn('Ext.device.Contacts#getContacts: You must specify a `success` method.');
      return false;
    }

    if (!config.fields) {
      config.fields = ["*"];
    }

    if (!Ext.isArray(config.fields)) {
      config.fields = [config.fields];
    }

    if (Ext.isEmpty(config.multiple)) {
      config.multiple = true;
    }

    navigator.contacts.find(config.fields, config.success, config.failure, config.options);
  }
});

4. Include cordova.js in index.html

<script type="text/javascript" charset="utf-8" src="cordova.js"></script>