Wednesday, December 5, 2012

Add New Devices to a Mobile Provisioning Profile


On my previous post I wrote on how to create an iOS relase build for ad-hoc distribution. But soon after I created and published a release build for a cliente, I was confronted with an aditional challenge. What if I want to add additional devices to the distribution package?
If you do a small search on the web and forums the news you’ll get is that you have to go through the complete packaging process again and again for each new device.
The news I have is: YOU DON’T!! What you have to do is update the existing mobile provisioning profile with the new device’s ID and distribute it along side with the original application's package. 

Here’s a step by step.

Get the device’s Unique Identifier

The first step is to get the unique identifier of the device
  1. Connect the device to the computer via USB
  2. Start iTunes
  3. In iTunes select, in the right column, the device
  4. On the Summary tab press on the text of Serial Number


  1. After pressing the text displays the identifier (UDID)
  2. Press Ctrl + C (Windows) Cmd + C (Mac)


Add the new device to your company’s Apple account

  1. Go to https://developer.apple.com/membercenter and log in
  1. Press iOS Provision Portal
  1. On the left column select Devices
  2. At right press the Add Devices button
  1. In Device Name field assign a intuitive  name to the device.
  2. Fill the the device’s ID field with UDID you copied earlier
  1. If you need to add more equipment press the + button to the right
  1. At the end press Submit and the new equipment is added

Associate the new device to the application’s distribution license

  1. In the left column press Provisioning
  2. Select the Distribution tab
  1. In the row that corresponds to the distribution license press Edit on the right and then select Modify
  1. In the Devices Section you should see the newly added. Select it, and all the devices you wish to assign to the license
  2. Submit Press when finished
  1. After you press Submit the license status may be in Process. If this happens press the F5 key to refresh the page. The status should switch to Active.
  1. Press the Download button to download the license file. The file name is [LicenceFileName].mobileprovision

Distribute your licence and app files

There are two ways you can send the application and licence files to your users.
  1. One is by email. Then the user can install both files with iTunes. First the licence file and then synchronize the application file.
  1. The other way is to publish both files on a web server just like on this previous post.
In order to go with the second option, follow these steps.
  1. Go to this previous post and follow the same last steps on how to configure the webpage
  2. Then on the index.html file you must add also a link to the licence. The complete code is as follows
<body style="height: 100%;">
  <ul>
    <li>
<a href="http://[ServerName]/[LicenceFileName].mobileprovision">
Download Licence</a>
    </li>
    <li>
       <a href="itms-services://?action=download-manifest&url=
               http://[ServerName]/[AppFileName].plist">
           Download Application</a>
    </li>
  </ul>        
</body>
  1. You also must add a new MIME type for the licence file
.mobileprovision application/octet-stream
This web page will have two links. One for the licence file and the other for the application installation package.
The application package is the same that was generated on this previous post.
Installing the application in new devices
To install the application, you must first install the licence and then the application. Send the link of the webpage by email.
  1. To install the licence you must click on the Download Licence link
  2. Install the licence clicking on Install
  1. After the licence is installed. Press OK.
note: If when downloading the certificate an error message appears, this can mean that the device is not authorized to use this application, that is, the UDID of this device is not associated with the licence
  1. Return to the web page and click Download Application. This will initiate the download and installation of the application.
And you’re done. If you need to add more devices, just repeat the process. At the end, on the webpage, replace only the licence file (.mobileprovisioning file).

Wednesday, October 24, 2012

Making a Release Build for Ad-Hoc Distribution of an iOS App


Making a release build for the app store or for distributing an app in your company is always a pain in the neck. Apple insists on changing the process for each version of XCode, changing the rules,  changing licences, once or twice a year. There are numerous articles and blog post on the web that will try to help you build a release version of your app. I say try because it’s hard to find an up-to-date article that will fit your XCode and Mac OS version.
So, this is my contribution to the confusion of articles on making a release build for an iOS App.

On the 29th of August of 2012 with XCode 4.4, Mac OS Lion 10.7.4 and iOS 5 these are the steps on making a release build for Ad-Hoc distribution of an iOS app.


First go to https://developer.apple.com and log in. The page will look like this




Register Devices

The devices to which you intent to install your app need to be registered in your account.

Click on iOS Provisioning Portal


Click on Devices and the on Add Devices


To add a Device you need any name and a Device ID. To get the Device ID you have to

  1. Connect your device to your Mac
  2. Open Itunes
  3. On the summary page
  4. In there you will see the Serial Number of your device
  5. Click on the Serial Number and you will see the Device ID
  6. Click command-c (Mac) or ctrl-c (Windows) to copy it to the clip board. You can then paste it on the iOS Provisioning Portal or send it by email to whoever is registering your device





Give a name to the device and the Device ID and click Submi. You can register up to 100 devices.





Create an App ID


Your app must have an AppID

Click App IDs. On the tab Manage click New App ID.



  1. Write a intuitive name for your App ID in the Description
  2. Select your Team ID. You should have one from your Apple Developer License
  3. The Bundle Identifier must be the same as in your Project. Go to XCode to get it
  4. Submit



Create the Distribution Provisioning Profile


On the same page click on Provisioning on the left, then the Distribution tab and then New Profile button



  1. Select Ad Hoc
  2. Choose a intuitive profile name
  3. Click New Profile button



After submitting the profile it will be available in the profiles page. Once it is active, should take a few seconds (must refresh the page), you can download it.


After downloading the profile you must install it on XCode. You can drag and drop the file to your XCode icon



After this the XCode’s Organizer will open and you can check for the profile




Create the Distribution Archive


Now back to  XCode. Select the Project and the info tab.


In the configuration Table add a new configuration. Click the plus sign to duplicate the Release configuration



Name the new configuration Ad-Hoc. It will look like this at the end.


Now, still in the Project view, go to Build Setting tab.
The Ad-Hoc configuration is in the Code Signing Identity table.
In the row named Ad-Hoc and sub-row named Any iOS SDK click on the AdHocTestApp row to select a profile


And select the profile you created on the Apple Developer Portal


Next, click on the Scheme selection button on the top left


and select Edit Scheme


Select Archive on the left.
Select the Ad-Hoc Build Configuration and click Ok



You are now all set up ( Finally!!! ) to create the distribuition package.

  1. Click on the Scheme selection button and select iOS Device
  2. Build you App
  3. After it finishes select Archive


The Organizer window will open after the archiving finishes

Now click on Distribute

Select Save for Enterprise or Ad-Hoc Deployment


On the next window choose your Ad-Hoc profile and click next.




Select where you want to save the .ipa package, I chose the desktop.


At this point you have two choices regarding Save for Enterprise Distribution check box

  1. Install the app through iTunes. Leave it uncheked
  2. Download and Install the app on the iPhone through a webpage.  Check it.

If you choose the first option the file AdHocTestApp.ipa will be created on the desktop and you can now drag and drop it to you iTunes and then synchronize the app. The Profile you created is embedded in .ipa package. And you're done! Congratulations!!


Or not... If you choose the second option there are still a few more steps. So keep reading.

  1. Choose a name for the package
  2. Check the Save for Enterprise Distribution option
  3. Type the URL of the location of the .ipa in your server
  4. Add a title

I haven’t tested the subtitle and image URLs yet.

Click save.

This will generate two files in your desktop

  • AdHocTestApp.ipa
  • AdHocTestApp.plist

You have to copy this files to your server to the location you specified above


The next step will be creating a web page form which you can donwload the app. This is the simplified version.



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>AdHoc Test App</title>
</head>
<body>
  <ul>
<li>
<a href="itms-services://?action=download-manifest&
Tap here to install AdHocTestApp
</a>
  </li>
  </ul>
</body>
</html>

Notice that the href link is not the .ipa but .plist


You are all done!

note: in my case I am using an Microsoft server and I had to add the corresponding MIME Types for the .ipa and .plist. (no screen shots, sorry)

  1. Go to IIS Manager
  2. Locate you web site folder
  3. Right click and select Properties
  4. Open HTTP Headers tab
  5. Click on MIME Types button at the bottom
  6. Click New... button and add these two
    1. .ipa application/octet-stream
    2. .plist text/xml

Now, on your device, navigate to the page and download and install the app.

          


Good Luck!!

Wednesday, September 26, 2012

ArcGIS and PhoneGap


Here is my first test with Adobe PhoneGap and with the ArcGIS SDK for Javascript. I’ve created this app to run on Android, but the same html code I’m creating here can also be used to create any other PhoneGap supported OS, like iOS or Windows Phone.


I will go through the configuration of PhoneGap on Eclipse, creating then a Hello World. Next I will create a map application using the ArcGIS SDK for Javascript inside Eclipse. At the end I have the code and the .apk so that you can install on your device.

Configure the PhoneGap development environment

First go to PhoneGap donwload page and download the latest PhoneGap available version. In this case 2.0.0



Then just follow the instructions on the Getting Started Guide for Android. This guide will help you on how to configure your Eclipse and build a Hello World application



While editing AndroidManifest.xml file I added only the following settings

<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.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

At the end if you want to run you Hello World App on a real device and do not succeed, try this instructions on Android Developer http://developer.android.com/tools/device.html


Create your First ArcGIS Map

Now that you have your Hello World let’s start to build an ArcGIS application.
In this example I want to make an app that will show me the real time earthquake location on  a map. Besides that I want my app to zoom into my current location.
Surfing a bit on www.arcgis.com I found some maps related to earthquake information like this one. This map has a layer that shows the most recent earthquakes above the magnitude of 2.5. The service url is


So to add a ArcGIS map to your PhoneGap app lets first get a sample from ArcGIS API for Javascript page.



Copy the code to your index.html file in you Eclipse project
After this add the PhoneGap’s JavaScript ibrary reference to the index.html file

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

Run the app on a device or emulator and... voila! You are in Paris! Magic!

If you get the error message “The connection to the server was unsuccessful. URL=file:///android_asset/www/index.html” try this.

Now let’s change the initial extent to the whole world. If you simply change this line with your new extent.
var initialExtent = new esri.geometry.Extent({
                             "xmin" : -14161000,
                             "ymin" : -477000,
                             "xmax" : 11669000,
                             "ymax" : 8094000,
                             "spatialReference" : {
                                   "wkid" : 102100
                             }
                       });


Add the Earthquake Map

Now add the earthquake map. For this you will add a FeatureLayer to the map and also the ability to identify the earthquake on tap. Replace the dojo.connect(map, "onLoad", function(evt) block with the following

dojo.connect(map, "onLoad", function(evt) {

//add a feature layer
var content = "<b>MAGNITUDE</b>: ${MAGNITUDE}<br /><b>DEPTH</b>: ${DEPTH} Km<br />${DATE_TIME}";

//create a Info Template
var infoTemplate = new esri.InfoTemplate("Details", content);
map.infoWindow.resize(150,80);

//create the FeatureLayer
var featureLayer = new esri.layers.FeatureLayer("http://ags.pdc.org/ArcGIS/rest/
services/global/pdc_active_hazards/MapServer/4", {
mode : esri.layers.FeatureLayer.MODE_ONDEMAND,
      outFields : ["MAGNITUDE", "DEPTH", "DATE_TIME"],
      infoTemplate : infoTemplate});

//add a click event to the FeaureLayer
dojo.connect(featureLayer, 'onClick', function(evt) {
//select the clicked feature
      var query = new esri.tasks.Query();
      query.geometry = evt.mapPoint;
      featureLayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW);});

//add the FeatureLayer to the map
map.addLayer(featureLayer);

});

You must add the dojo imports. After dojo.require("esri.map");

dojo.require("esri.layers.FeatureLayer");
dojo.require("esri.tasks.query");

Run the application and tap on some points





Get the Location and Zoom

To get your device location, both PhoneGap and ArcGIS API for JavaScript use the W3C’s GeoLocation API.

First you must make sure you have the following settings

  • in app/res/xml/config.xml you must have the following tag in the plugins section
<plugin name="Geolocation" value="org.apache.cordova.GeoBroker"/>

  • in app/AndroidManifest.xml you must have the following tags
<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_CO
MMANDS" />


Then in your index.xml file inside dojo.connect(map, "onLoad", function(evt){ after map.addLayer(featureLayer); add the following lines

if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(zoomToLocation, locationError);
navigator.geolocation.watchPosition(showLocation, locationError);
}


And then the corresponding listener methods

function locationError(error) {
switch (error.code) {
case error.PERMISSION_DENIED:
alert("Location not provided");
break;

case error.POSITION_UNAVAILABLE:
alert("Current location not available");
break;

case error.TIMEOUT:
alert("Timeout");
break;

default:
alert("unknown error");
break;
}
}

function zoomToLocation(location) {
var point = esri.geometry.geographicToWebMercator(
new esri.geometry.Point(
location.coords.longitude,
location.coords.latitude));
map.centerAndZoom(point, 5);
}


And there you have it! All is calm now around Portugal. But if you live in Puerto Rico or the Dominican Republic things are shaky over there.

  


Download Android apk
Download code