The first step is to reference the Bing Maps Token Service:

1. In the Visual Studio Solution Explorer window, right click on the VEMobile project and select Add Web Reference.
   
   
2. Set the Url to https://staging.common.virtualearth.net/find-30/common.asmx and press the Go button.
   
   
3. Enter your Bing Maps Developer Account credentials into the security window that appears.
   
   
4. Change the web reference name to VEStagingToken as shown below.
   
   
5. Press Add Reference.
   
   
6. Enter your Bing Maps account credentials into the security window that appears.
   
   

In order to acquire a token, you need to prepare a TokenSpecification which contains:

• Your Bing Maps Developer Account credentials – These consist of the 4 to 6 digit user ID and the password of your Bing Maps developer account.
  
  
• Client IP address – This field is used for tracking purposes. Ideally you want to use the IP address of the user that is running your web application.
  
  
• The expiration length in minutes – Each token has a built in expiration time ranging from 15 minutes to 8 hours.
  
  

To create a method to request a token:

1. Open Default.aspx.cs.
   
   
2. Add a reference to the VEStagingToken web service by putting the following line at the top of the file:
   
   
   using VEStagingToken;

3. Now retrieve the IP address of the user of the web application. Using sample code from the Implementing Customer Identification article, add the following code:
   
   
   private string GetClientToken()
   {   VEStagingToken.CommonService commonService = new VEStagingToken.CommonService();
       commonService.Url = "https://staging.common.virtualearth.net/find-30/common.asmx";
       commonService.Credentials = 
          new System.Net.NetworkCredential("VE Account id", "VE password");
   
       // Create the TokenSpecification object to pass to GetClientToken.
       TokenSpecification tokenSpec = new TokenSpecification();
   
       //Use the currently exposed public IP for the page.
       tokenSpec.ClientIPAddress = Page.Request.UserHostAddress;
   
       // The maximum allowable token duration is 480 minutes (8 hours).
       // The minimum allowable duration is 15 minutes.
       tokenSpec.TokenValidityDurationMinutes = 480;
   
       // Now get a token from the Bing Maps Token Service.
       return commonService.GetClientToken(tokenSpec);
   }

You now have the ability to generate a client token. For simplicity sake this article shows the credentials embedded directly in the Default.aspx.cs file in clear text. For security reasons, you should move these string values to a protected data store. For example, you can put the values in your configuration file using protected configuration, as described here: http://msdn.microsoft.com/en-us/library/53tyfkaw.aspx.

The next task is to create the client token and attach it to the session. Add the following code to the Page_Load() method of Default.aspx.cs:

Session.Add("VEToken", GetClientToken());

The method that geocodes an address takes a client token and an address string, and returns a Location object. If no results are found, is returned. You will also add a confidence filter so that only results with a high confidence are returned.

To create the GeocodeAddress method:

1. Open Default.aspx.cs.
   
   
2. Copy the following method into the file:
   
   
   private VEGeocodingService.Location GeocodeAddress(string address)
   {
       GeocodeRequest geocodeRequest = new GeocodeRequest();
   
       // Set the credentials using a valid Bing Maps token
       geocodeRequest.Credentials = new VEGeocodingService.Credentials();
       geocodeRequest.Credentials.Token = (String)Session["VEToken"];
   
       // Set the full address query
       geocodeRequest.Query = address;
   
       // Set the options to only return high confidence results 
       ConfidenceFilter[] filters = new ConfidenceFilter[1];
       filters[0] = new ConfidenceFilter();
       filters[0].MinimumConfidence = VEGeocodingService.Confidence.High;
   
       GeocodeOptions geocodeOptions = new GeocodeOptions();
       geocodeOptions.Filters = filters;
   
       geocodeRequest.Options = geocodeOptions;
   
       // Make the geocode request
       GeocodeServiceClient geocodeService = new GeocodeServiceClient();
   
       GeocodeResponse geocodeResponse = geocodeService.Geocode(geocodeRequest);
   
       if (geocodeResponse.Results.Length > 0)
           if (geocodeResponse.Results[0].Locations.Length > 0)
               return geocodeResponse.Results[0].Locations[0];
   
       return null;
   }

The second method returns a map URI. This method takes a client token, latitude and longitude coordinates, a zoom level, and the width and height of the image to be returned. This method also places a pushpin on the latitude, longitude coordinate that is specified. And to make this method more dynamic, it takes a map style in the form of a string, which specifies the type of map to return. The map styles that can be used are “Road”, “Aerial”, and “Hybrid”.

To create the GetMapUri method:

1. Open VEService.svc.cs.
   
   
2. Copy the following method into the file:
   
   
   private string GetMapUri(double latitude, double longitude, int zoom, string mapStyle, int width, int height)
   {
       VEImageryService.Pushpin[] pins = new VEImageryService.Pushpin[1];
       VEImageryService.Pushpin pushpin = new VEImageryService.Pushpin();
       pushpin.Location = new VEImageryService.Location();
       pushpin.Location.Latitude = latitude;
       pushpin.Location.Longitude = longitude;
       pushpin.IconStyle = "2";
   
       pins[0] = pushpin;
   
       MapUriRequest mapUriRequest = new MapUriRequest();
   
       // Set credentials using a valid Bing Maps Token
       mapUriRequest.Credentials = new VEImageryService.Credentials();
       mapUriRequest.Credentials.Token = (String)Session["VEToken"];
   
       // Set the location of the requested image
       mapUriRequest.Pushpins = pins;
   
       // Set the map style and zoom level
       MapUriOptions mapUriOptions = new MapUriOptions();
   
       switch (mapStyle.ToUpper())
       {
           case "HYBRID":
               mapUriOptions.Style = VEImageryService.MapStyle.AerialWithLabels;
               break;
           case "ROAD":
               mapUriOptions.Style = VEImageryService.MapStyle.Road;
               break;
           case "AERIAL":
               mapUriOptions.Style = VEImageryService.MapStyle.Aerial;
               break;
           default:
               mapUriOptions.Style = VEImageryService.MapStyle.Road;
               break;
       }
   
       mapUriOptions.ZoomLevel = zoom;
   
       // Set the size of the requested image to match the size of the image control
       mapUriOptions.ImageSize = new VEImageryService.SizeOfint();
       mapUriOptions.ImageSize.Height = height;
       mapUriOptions.ImageSize.Width = width;
   
       mapUriRequest.Options = mapUriOptions;
   
       ImageryServiceClient imageryService = new ImageryServiceClient();
       MapUriResponse mapUriResponse = imageryService.GetMapUri(mapUriRequest);
   
       return mapUriResponse.Uri;
   }

In order for your default page to be able to return a map URI of an address you need to do the following:

• Generate a client token.
  
  
• Geocode the address.
  
  
• Request a map URI for the geocoded location.
  
  

Since this method generates a map, you need to get a zoom level, a map style, and the dimensions of the map image that will be returned.

To create the MapAddress method:

1. Open Default.aspx.cs.
   
   
2. Copy the following method into the file:
   
   
   private string MapAddress(string address, int zoom, string mapStyle, int width, int height)
   {
       string clientToken = GetClientToken();
   
       VEGeocodingService.Location latlong = GeocodeAddress(clientToken, address);
       double latitude = latlong.Latitude;
       double longitude = latlong.Longitude;
   
       return GetMapUri(clientToken, latitude, longitude, zoom, mapStyle, width, height);
   }

The next step is to create the form which allows the user to enter the address. This example assumes a screen resolution of 240x320, as it is one of the most popular resolutions. Therefore, all controls and result information must fit in a portrait area no more than 240 pixels wide and 320 pixels high.

1. Switch to the Design view of Default.aspx.
   
   
2. Add a Label.
   
   
3. Change the Text property of the label to “Enter Address:”.
   
   
4. Add a TextBox below the label.
   
   
5. Change the text box ID property to “TextAddress”.
   
   
6. Change the Width of the text box to 240 pixels.
   
   
7. Add a LinkButton below the text box.
   
   
8. Change the Name property of the link button to "LinkSearch".
   
   
9. Change the Text property of the link button to “Find Location”.
   
   

When you have created the form, it should look similar to this:

The last step is to wire up the link button to execute the methods required to generate the image.

1. Double click on the link button to open up the LinkSearch_Click method.
   
   
2. Add the following code to the method:
   
   

protected void LinkSearch_Click(object sender, EventArgs e)
{
  String result = MapAddress(TextAddress.Text, 17, "HYBRID", 240, 320);
  Response.Redirect(result);
}

Note that the map zoom (level 17), style and size are all specified in this method. If you wish to change any of these parameters, you can add more controls to the form or set different default settings here.

To set up your emulator:

1. Select Tools on the main menu of Visual Studio.
   
   
2. Select Device Emulator Manager.
   
   
3. Scroll down until you see the emulator you are using (Windows Mobile 6 Standard Emulator).
   
   
4. Right click on your emulator.
   
   
5. Select Connect. This opens an emulator window.
   
   
6. In the Device Emulator Manager, right click on your emulator.
   
   
7. Select Cradle.
   
   

Visual Studio is now able to sync with the Windows mobile device emulator.

In order for your emulator to connect to the Web, you have to use Windows Mobile Device Center (or ActiveSync if you are on Windows XP) to configure the connection mode.

1. Start the Windows Mobile Device Center from your control panel.
   
   
2. If your emulator is connected and cradled, you should see options for setting up your device:
   
   
3. Click Connect without setting up your device.
   
   
4. Click on Mobile Device Settings and then Connection Settings.
   
   
5. Make sure the following settings are configured:
   
   
   • Allow USB connections should be checked
     
     
   • Allow connections to one of the following: should be checked and set to DMA.
     
     
   • Allow data connections on device when connected to PC should be checked.
     
     
   
6. Click OK and then close Windows Mobile Device Center.
   
   
7. Test the device by using the built in Internet Explorer application to connect to a public site (for example, Windows Live).
   
   

Test your application in your mobile device emulator by opening up the browser and pointing to your local installation of the VEMobile web application.

1. From the home menu, select Start and then Internet Explorer.
   
   
2. Click on the Menu button and then select Address Bar.
   
   
3. Type in http://<your computer IP address>/vemobile. Unfortunately, you can’t simply point to localhost as that resolves to your mobile emulator rather than your local machine.
   
   
4. Press Go.
   
   
5. After the page loads, type a location into the address field of your mobile web page.
   
   
6. Click on the Find Location link.
   
   
7. You may see a security alert asking if you want to allow a post to the web. Click Yes.
   
   
8. Your results should appear similar to the following figure: