Windows Azure Toolkit for Windows Phone 7

WinPhoneAzureThe Windows Azure Toolkit for Windows Phone 7 is a starter kit that was recently released out to CodePlex. Wade Wegner, one of my former team mates when both of us were in Central Region, is the master mind behind this fantastic starter. 

This starter kit is designed to make it easier for you to build mobile applications that leverage cloud services running in Windows Azure.

Screencast

In the screencast, you’ll get a great little walkthrough of the starter kit and how to get your first Windows Phone 7 application with a Windows Azure backend up and running. The toolkit includes a bunch of stuff including Visual Studio project templates that will create the Windows Phone 7 and Windows Azure projects, class libraries optimized for use on the phone, sample applications and documentation.

Why Windows Azure

Windows Azure is Microsoft’s Platform as a Service (PaaS) offering that allows you to build and scale your application in the cloud so that you don’t have to build out your local infrastructure. If you are selling an application in the Windows Phone 7 Marketplace and really don’t know how many customers you’ll end up with, you might need to scale the backend dramatically to meet the demand. 

 

What you’ll need

Hopefully obviously you’ll need an Azure account and the tools to build and deploy the solution. The tools include one of the versions of Visual Studio (either Express which is free or higher), the Windows Azure Toolkit and then obviously the starter kit itself. I also recommend looking at Expression Blend for doing your Windows Phone 7 design and the like.

Good Luck!

By looking through the resources on the Windows Azure Toolkit for Windows Phone 7 site, you’ll see lots of great little tutorials and getting started guides.

Let me know how you’re getting on with the toolkit and what you’ve done with it. I’d like to see and possibly blog about it all…

Site Pinning in IE9

IE9Internet Explorer 9 (IE9) launched last week at SxSW! I was bummed that I wasn’t there but I was one of the 2.3 Million downloads in the first day. There’s a bunch of new stuff in IE9. There’s a load of examples out on http://www.beautyoftheweb.com that show off all of the new HTML5 support to javascript performance to a ton more.

A simple one, however is site pinning. This allows you to pin a website as if it were an application on the Windows 7 taskbar. This blending and merging of the web and desktop is awesome.

Now, you can pin any website to the taskbar and get generic results but you as a website author have control to actually do something cool and customize what that pinning does. You can customize the way your site is added to the taskbar as well as add your own jump list items.

MSApplication Meta Tags

The first place to get started is customize the application name, tooltip and frame with a few meta tags:

<meta name="application-name" content="Josh Holmes" />
<meta name="msapplication-tooltip" content="Random Thoughts" />
<meta name="msapplication-window" content="width=1024;height=768" />
<meta name="msapplication-navbutton-color" content="#ff7900" />
<meta name="msapplication-starturl" content="http://www.joshholmes.com/blog/" />

That’s simple. The next step is to add in a custom task that will let people dive deeper into the site with the right click:

<meta name="msapplication-task" 
content="name=View Articles;action-uri=./articles/;icon-uri=./favicon.ico" /> <meta name="msapplication-task"
content="name=About Josh;action-uri=./aboutme/;icon-uri=./favicon.ico" />

By default, IE9 looks for your 32×32 sized version of your favicon but if it can’t find one, it it uses your 16×16 one in a 32×32 box so you should use a high-res favicon if possible…

JavaScript

If your site is pinned, you can, if you want, do more that just sit there on the taskbar. You can interact with the jumplist and more.

Checking For Pinned Mode

First thing to know is if your site is actually pinned or not:

if (window.external.msIsSiteMode()) {
 // in pinned mode
} else {
 // not in pinned mode
}

 

Activating the Taskbar Icon

Let’s say that you need your user to interact with the application to keep session alive, or need them to complete a form or for some reason you need their attention back on the site, simple activate the taskbar icon by making it glow (Win7 Users are used to this UI paradigm):

window.external.msSiteModeActivate();

If making it glow is not enough but you have actual info for the user, such as if you are running a bulletin board service and want to let the user know that 3 new messages have arrived for them or something else random like that:

// clear current overlays
window.external.msSiteModeClearIconOverlay();
// set new one
window.external.msSiteModeSetIconOverlay("./newmessage3.ico", "3 new messages match your search");

Customizing the JumpList

And if you really want to customize the jumplist like with the last few articles that your user looked at, or the last few searches that they did or something more than the static setting of tasks that we did above:

// clear current jump list
window.external.msSiteModeClearJumplist();
// name the jump list
window.external.msSiteModeCreateJumplist("Adding JumpLists");
// add tasks to list – notice that these can have custom icons as well
window.external.msSiteModeAddJumpListItem("Item 1", "page1.html", "./favicon.ico");
window.external.msSiteModeAddJumpListItem("Item 1", "page2.html", "./favicon.ico");
// display list
window.external.msSiteModeShowJumplist();

JQuery Way

Of course, if all that’s too complicated or two much typing, you can just use the JQuery plugin – http://ie9ify.codeplex.com/. 😀

Conclusion

Hopefully this has been a short and sweet glance at some of the new site pinning features and the like.