ASP.NET Futures: Intro to the Xaml and Media Controls

Still relatively unknown, ASP.NET Futures is a nice little add-on to ASP.NET and ASP.NET AJAX that contains some features we want public feedback on. It's a playground in which technology gets to frolic in front of the public's (your) eyes. So why not seize the opportunity to play with the bits and submit your thumbs up, thumbs down?

I thought I'd give an introduction to two of the controls in ASP.NET Futures that I'm most fond of (I've worked on them, so I'm a little bit partial). If you already know about them, excellent, please log in some feedback.

<asp:Xaml runat="server" />

The Xaml control is an integration story between Silverlight and ASP.NET. If you are writing ASP.NET pages that contain Silverlight content, especially if you are also using AJAX features, it's definitely worth a look. Because it's not only an integration of Silverlight and ASP.NET, but between Silverlight and ASP.NET AJAX. It defines a new client-side ajax type, Sys.Preview.UI.Xaml.Control. So, if you are familiar with ASP.NET and with ASP.NET AJAX, this control gives you a logical extension. Just point the control at a XAML resource, and it wraps an ajax type around Silverlight, giving you a familiar and object-oriented asp.net ajax programming model to work with the surface area between the HTML page and the Silverlight plugin instance.

Take a look at a Calculator implemented using the Xaml control.

<asp:Media runat="server" />

I said it is object oriented, and it is. The media control defines another client-side ajax type which derives from the first: Sys.Preview.UI.Xaml.Media.Player. When this type wraps a Silverlight plug-in, it does a lot of work to it, searching within the Xaml document for elements of certain predetermined names like "PlayButton", and makes them more than just a pretty Canvas by adding behavior to them implied by their name. It may seem trivial, but there are a lot of subtle things that must happen to make what is essentially static markup (the xaml) behave like a full-blown media player. Silverlight makes it look pretty. The Media control brings it to life.

Not just a black box

When you watch video on a web page, you probably don't expect much in the way of interaction between the video and the page. The video is like a rich island in the middle of boring HTML, and never the twain shall meet. Even the orientation of the video is pretty much fixed -- ever seen a movie playing on a webpage at at 15 degree angle? I haven't. I'm not sure I want to, but I sure haven't!

But it doesn't have to be that way... The media control exposes some pretty cool client-side APIs in the form of properties and events that allow for some really interesting interaction between the media and the rest of the page. asp:Media... Tearing down walls!

Take a look at some of the cool things you can do with it.

Not just for fun, either

The Media control can work with any Xaml. It's very forgiving with which Xaml elements it requires, too. What? Your Xaml doesn't have a MuteButton? Ok, no problem. But it does have a WizzyWigDoSomethingButton -- well, it doesn't know what that is, but a client-side type you create that derives from the media player's client side type knows what to do with it.

The only element required is the MediaElement. Yeah you kind of need that one...

You get the picture. But what most people don't know, even those who use it, is that the client-side code that drives the Media control has already appeared in many places. So many, in fact, that if you've seen video playing in Silverlight, you've probably executed the code. The code was joint developed and is shared by the Expression Encoder product, which allows you to export videos to html for execution in Silverlight. It too creates nice media player functionality in Silverlight... and it does it using the exact same code the Media control uses. Well, the namespace is different. But that's it.

Here are some examples of sites using the Media control's client-side ajax type. Note how vastly different they look and behave -- a testament to Silverlight and this control.

So there you have it. If you want to play video or audio on your site using Silverlight, and you don't want to implement an entire media player UI from scratch, have a look-see.

EDIT: Hey, my first post tagged "Silverlight". Expect more in the future.

10 Comments

  • So when is 'Futures' going to be released, because the whole ASP.NET Ajax story is getting ridiculous imho. It's been months since the 1.0 release and Microsoft is telling us that CSS selectors are 'early experimental features being considered for future versions'.

  • When I try to run the Microsoft ASP.NET Futures Calculator example, I just get a button to download Silverlight.1.0.exe which will not install because I have the newer version of Silverlight.

    I've had a lot of problems deploying and running Silverlight applications outside of the development environment.

  • Mike -- this entry is a good read on the topic:

    http://weblogs.asp.net/joestagner/archive/2007/11/09/is-microsoft-committed-to-ajax.aspx

    Also don't forget about the ajax control toolkit, which is constantly evolving.

  • rrobbins -- are you sure you have the public 1.1 alpha refresh that was released after silverlight 1.0 rtm? What version does it say if you go to the about screen (right click menu)?

  • "weblogs.asp.net/.../is-microsoft-committed-to-ajax.aspx

    Also don't forget about the ajax control toolkit, which is constantly evolving."

    That link highlights exactly what I think is the problem. That page lists stuff like video's, Visual Studio Intellisense (it's about time, it's nearly 2008!) and support for WCF. That's means nothing to me, you know why? 6+ months and still no drag and drop or gridview extender, that's why.

    Seriously, it's about the actual code/components, not all the stuff around it. I need to program, not watch movies or figure out how to use WCF because that's the latest new kid on the block from Microsoft (same goes for Silverlight). And I'll just repeat that Futures is not even beta. Come on, .NET 3.5 around the corner and no sign of the Futures even nearing completion.

    And don't get me started on the Toolkit, the latest releases were bugfixes and they have a new testing framework. Wow, exciting stuff...

    I'm just ranting here, so take it with a grain of salt if you like. But the fact is, after the first release I was very excited. Now, I'm very disappointed and actively learning jQuery and Extjs. Microsoft must look to the future. When they release the ASP.NET MVC framework, we no longer need webcontrols, we can just as easy render an unordered list and turn it into a tree with drag and drop + callback support using our favorite non-stagnant JavaScript library.

    So until I see firm commitment in the form of a _release_ I will stay with my conclusion, Microsoft Ajax is not going to cut it.

    Sorry for the rant, but if others feel the same way as I do, you can't ignore it.

  • I'm getting in the bad habit of leaving comments that have nothing to do with the blog post, so I'm going to make my AJAX coments on that other blog entry you linked to.

    But I will make this off-topic remark, because you seem to appreciate WebForms. The reason I mention this is that my memory was jogged by Mike's comment, as I saw a similar comment on Hanselman's blog a few days ago when I tried to defend WebForms in the face of all the MVC fanboys.

    Here's my question - is anyone standing up and defending component-oriented web frameworks these days? I'm just getting tired of everyone hating on WebForms and gushing over the MVC approach, with very little balanced conversation of the pros/cons/areas for improvement of the two architectures. Is a reasonable dialog happening anywhere? I figured you might know.

  • Winston -- you have a refreshing viewpoint I must say. I don't have much to add I'm afraid :) Anyone else?

  • hello.

    well, i must say that when those controls were released i wasn't really into them. why? well simply because the controls inserted object tags on my page instead of using JS to do that kind of thing (like the js helpers available with silverlight sdk). now that I know that the "click to activate" is saying goodbye, I'm thinking on giving them a second chance :)

  • Luis -- the current bits do not have click to activate, so you don't need to wait for IE to remove it.

  • The future of web will certainly pass by this type of interaction a rich media content. I will give it a try.

Comments have been disabled for this content.