In expectation of Silverlight 2.0 I decided to do some experimenting with some of the Live API's.
I build a small app which shows my Live Messenger status. And can also show other peoples status if they gave permission.
For now, all you see is a big Messenger icon I created in XAML. I'm not a designer, but you can imagine it's possible to create some nice visuals and animations instead of just displaying a still, like I did.
How does it work?
The API Microsoft supplies for this is a JSON API. So the examples they supply are in javascript so I had to find a way to get the data that is returned from the API in javascript into my Silverlight control.
Getting acces to Silverlight functions from Javascript
- Make your class Scriptable so that it's possible for Javascript to access methods and properties in your class.
- Also make the properties and/or methods you want to use from JS Scriptable.
It should look something like this:
Next, we need to create the call to the API from Javascript.
Calling the API
This can also be reviewed at the Microsoft site (http://msdn2.microsoft.com/en-us/library/bb936688.aspx).
The API can be called using an URL of this format:
http://messenger.services.live.com/users/[ID]/[resource]/[?queryparameters]
To call this API, you can use a javascript "include" in a webpage. By using a callback function you can read out the information returned by the API.
The script Microsoft provides looks like this:
(be carefull, I added a return in the url otherwise it would be too long to fit on the screen)
Now, I wanted to set the id dynamically, so I added a literal to the page in which the script tag is generated from serverside code.
Place this Literal (or script) directly above the body closing tag.
The server side code I use to fill the Literal looks like this: 
Handle the callback
Next is the javascript with the functions to handle the callback and to set the properties in the silverlight object:
This goes in a separate javascript file I called "MessengerAPI.js" and should be referenced in the head of the html.
Calling the API after Silverlight object is loaded
After first running into some problems with calling the setStatus method, it turned out to be a timing problem. setStatus cannot be called before the Silverlight control is completely loaded.
So the trick is to create a onloaded eventhandler in the createSilverlight function and set the variable "control" in the handler so you're 100% sure the control is loaded, like this:
Finishing up
To be able to see the status of other people, Microsoft requires you to:
1. Have a privacy statement on your site, which they can refer to
2. Have a return URL where Microsoft can redirect to when the user has logged in and confirmed that your website can have access to their status information.
Conformation on Live site
Next, I created a separate aspx page as a landingpage for catching the visitor who clickec "I accept" (ReturnUrl.aspx). In this page you can do lots of stuff, set cookies or save userdata in db (change your privacy statement accordingly).
At this time I just do a redirect to the default.aspx with the ID as a querystring parameter.
This brings us back to where we started.
Posts
No comments:
Post a Comment