Submitted My Windows 8 App for their Contest

This afternoon I have finally completed my Metro style Windows 8 application.  I’m still entering data into the database, but the app itself is completed.  When the app is launched it pulls that data and displays it to the users.

Here are a few screen shots of my application:

My application is based on the House of Representatives.  It allows you to quickly discover your congress person and provides you with contact information including Twitter, Facebook and other links they’ve shared on their websites.

The contest started here:  https://buildwindowscontest.com/

If I win, I will be included in the first round of apps added to the new Microsoft App store… very exciting!

Wish me luck!

Windows 8 Metro Application–Bing Maps

I’ve entered myself into a new Windows 8 application contest.  I’ve come up with a wonderful idea which includes utilizing Bing Maps.  After an awful lot of research I’ve come up with something that works… Perfectly!!!

Since this is a Windows 8 application, I’m writing this in Visual Studio 11 express which utilizes an awesome multi-threading feature called async/await.  So I’ll be taking advantage of that here.

First thing I needed to do was acquire my Bing Map Developers key… Acquire yours free from:  https://www.bingmapsportal.com

Let’s start coding!!!

I followed the following MSDN article to setup my app for access to the Bing SOAP API’s.  http://msdn.microsoft.com/en-us/library/cc966738.aspx

Then added the following to the top of my code:

using HouseofRepresentatives.GeocodeService;
using HouseofRepresentatives.SearchService;
using HouseofRepresentatives.ImageryService;
using HouseofRepresentatives.RouteService;


private ImageSource _map = null;
public String Latitude = "";
public String Longitude = "";


public ImageSource Map
{
    get
    {
        if (this._map == null) UpdateMap();
        return this._map;
    }

    set
    {
        if (this._map != value)
        {
            this._map = value;
            this.OnPropertyChanged("Map");
        }
    }
}

I had two situations for my locations… in one case I knew the exact Lat/Lon, and in others I only knew an address… in my case a state name.  First I needed to turn that address into a Lat/Lon for passing onto the get map function.

private async Task<string> getLocationPoint(string address)
{
    if (address != null && address != "")
    {
        GeocodeRequest request = new GeocodeRequest();
        request.ExecutionOptions = new HouseofRepresentatives.GeocodeService.ExecutionOptions();
        request.ExecutionOptions.SuppressFaults = true;
        GeocodeServiceClient geocodeClient = 
            new GeocodeServiceClient(GeocodeServiceClient.EndpointConfiguration.BasicHttpBinding_IGeocodeService);
        HouseofRepresentatives.GeocodeService.Credentials t = 
            new HouseofRepresentatives.GeocodeService.Credentials();
        t.Token = "[[put your Bing Maps Key Here]]";

        request.Query = address;
        request.Credentials = t;

        GeocodeResponse response = await geocodeClient.GeocodeAsync(request);
        if (response.Results.Count() > 0)
        {
            return response.Results[0].Locations[0].Latitude.ToString() + 
                "," + response.Results[0].Locations[0].Longitude.ToString();
        }
    }
    return "";
}

Next I needed to actually get the Image from Bing.  Now let’s do that using the following function:

private async Task<string> GetImagery(string locationString)
{  //http://msdn.microsoft.com/en-us/library/dd221354.aspx
    string key = "[[insert your Bing Maps Key here]]";
    MapUriRequest mapUriRequest = new MapUriRequest();

    // Set credentials using a valid Bing Maps key
    mapUriRequest.Credentials = 
        new HouseofRepresentatives.ImageryService.Credentials();
    mapUriRequest.Credentials.ApplicationId = key;
                      

    // Set the location of the requested image
    mapUriRequest.Center = new HouseofRepresentatives.ImageryService.Location();
    string[] digits = locationString.Split(',');
            
    mapUriRequest.Center.Latitude = double.Parse(digits[0].Trim());
    mapUriRequest.Center.Longitude = double.Parse(digits[1].Trim());

    // Set the map style and zoom level
    MapUriOptions mapUriOptions = new MapUriOptions();
    mapUriOptions.Style = MapStyle.AerialWithLabels;
    mapUriOptions.ZoomLevel = 17;

    // Set the size of the requested image in pixels
    mapUriOptions.ImageSize = new HouseofRepresentatives.ImageryService.SizeOfint();
    mapUriOptions.ImageSize.Height = 240;
    mapUriOptions.ImageSize.Width = 480;

    mapUriRequest.Options = mapUriOptions;

    //Make the request and return the URI
    ImageryServiceClient imageryService = 
        new ImageryServiceClient(ImageryServiceClient.EndpointConfiguration.BasicHttpBinding_IImageryService);
            
    try
    {
        MapUriResponse mapUriResponse = await imageryService.GetMapUriAsync(mapUriRequest);

        if (mapUriResponse.Uri != null)
        {
            return mapUriResponse.Uri;
        }
        else { return ""; }
    }
    catch (Exception ex)
    {
        return "";
    }
}

Ok… now that I have my image Uri, it’s time to use it to load a picture:

public async Task<bool> UpdateMap(string address = "")
{
    if (address != "")
    {
        //then user is specifying an address instead of a specific long/lat.  
        //We need to get that info in order to proceed...
        string point = await getLocationPoint(address);
        if (point != "")
        {
            string[] p = point.Split(',');
            Latitude = p[0];
            Longitude = p[1];
        }
    }

    if (Longitude != "" && Latitude != "")
    {
        string uripath = await GetImagery(Longitude + "," + Latitude);
        if (uripath != "")
        {
            this.Map = new BitmapImage(new Uri(uripath));
            return true;
        }
        else
        {
            this.Map = new BitmapImage(new Uri(imageBaseUri, "Data/blank.png"));
            return false;
        }
    }
    else
    {
        this.Map = new BitmapImage(new Uri(imageBaseUri, "Data/blank.png"));
        return false;
    }
}

If you’ve stuck with me this far… you are a programmer… LOL.

In each of my functions I utilized the new async/await features.  This means when I call either of the two functions as below, it will load the image once the OS has downloaded and cached it.  The image will automatically appear when ready…

//calling the get-map function with an address
UpdateMap("Arkansas");

//or
UpdateMap("1 Microsoft Way, Redmond, Washington");

//or i can configure my lat/lon then update
Latitude = "39.450000762939453";
Longitude = "-98.907997131347656";
UpdateMap();

If you guys have any questions or comments, be sure to post them below!