Have you seen the Silverlight? – More Silverlight

Where dynamic content really comes into its own is when it’s generated by the server. This can be done a number of ways, including using the Downloader to make requests from server-side handlers, or even by using parameterised queries. Here is a very simplified example of using the server to perform work for you. I’ve change the XAML for the scene so that the button’s brush is merely a template, as shown below:

...
<LinearGradientBrush.GradientStops>
    <GradientStop Offset=”0.005618”
    	Color=”$COLOR1$”/>
    <GradientStop Offset=”0.494382”
    	Color=”$COLOR2$”/>
    <GradientStop Offset=”1.000000”
    	Color=”$COLOR3$”/>
</LinearGradientBrush.GradientStops>
...

This is complemented by a custom ASP.NET handler that tweaks the XAML on the fly to reflect values passed in via the query string, as shown below:

public class TemplateHandler :
    IHttpHandler {
    public void ProcessRequest
    	(HttpContext context) {
    	context.Response.ContentType =
    		“text/xml”;
    	using( StreamReader sr =
    		new StreamReader(
    		context.Server.MapPath(
    		“scene.xaml” ) ) )
{
    		string color1 =
context.Request.QueryString[“Color1”];
    		string color2 =
context.Request.QueryString[“Color2”];
    		string color3 =
context.Request.QueryString[“Color3”];
    		string xamlContent =
    			sr.ReadToEnd();
    		xamlContent =
    			xamlContent.Replace(
    			“$COLOR1$”, color1 );
    		xamlContent =
    			xamlContent.Replace(
    			“$COLOR2$”, color2 );
    		xamlContent =
    			xamlContent.Replace(
    			“$COLOR3$”, color3 );
    		context.Response.Write(
    			xamlContent );
    	}
    }
    ...
}

The code is short and simple (and not wildly efficient or secure!), and it merely loads the XAML file and replaces the $COLORn$ markers with colours that are specified in the query string.

All that we need to do now is to change the default.html file to utilise the query strings, which I’ve chosen to do by changing it to an ASP.NET page and replacing the call to createSilverlight() with the code below:

...
<script type=”text/javascript”>
    var color1 = ‘<%=
    Request.QueryString(“Color1”) %>’;
    var color2 = ‘<%=
    Request.QueryString(“Color2”) %>’;
    var color3 = ‘<%=
    Request.QueryString(“Color3”) %>’;
    var scene = new
    	MediaCenter.Scene();
Sys.Silverlight.createObjectEx({source:
    	“http://localhost/MediaSite/
    		TemplateHandler.ashx?” +
    		“Color1=” + color1 + “&
    		Color2=” + color2 +
    		“&Color3=” + color3,
    	parentElement:
    		document.getElementById(
    		“SilverlightControlHost”),
    	id: “SilverlightControl”,
    	properties: {
    		width: “100%”,
    		height: “100%”,
    		version: “0.9”
    	},
    	events: {
    		onLoad:
    	Sys.Silverlight.createDelegate(
    		scene, scene.handleLoad)
...

The result of this code and of the user specifying some query string parameters is shown in Figure 4. Please also note the browser’s type!

Figure 4: The templated media centre in action

Clearly the capabilities of server-side scene generation go far beyond simple string replacement for specifying button colours; you can generate whole new scenes or build dynamically data-bound presentations.

Microsoft Expression Media Encoder

Whilst I didn’t use it for this article, it’s worth pointing out that Microsoft has developed a product to help facilitate the development of media-centric applications.

Microsoft Expression Media Encoder has built-in templates for creating your applications with support for playback and control of video, including all of the necessary UI elements. And remember, with Silverlight you don’t need Windows Media Player on the client.

Conclusion

Many .NET designers and developers will relish the rich media, animation and graphical support for creating the next generation of interactive applications that Silverlight offers. Although, as you can see from my efforts, powerful graphical capabilities in the hands of the artistically challenged can lead to some fairly ugly user interfaces!

Silverlight is clearly a work in progress, but it does mark an exciting dawn in the development of a new generation of RIAs using Microsoft technologies. It undoubtedly has the edge on Flash when it comes to exploiting the skills of existing ASP.NET and WPF developers, but in its current incarnation it suffers from a lack of released tool support and the many first- and third-party components that Flash enjoys today. However, vendors such as NETiKA, Telerik and Infragistics have also thrown their hats into the ring, and it is reasonable to expect that they will all deliver powerful control libraries prior to Silverlight 1.1 shipping.

The limited control and layout facilities, and the initial reliance on HTML controls for input (unless you want to roll your own, or use unsupported ad-hoc controls), will cause some initial disappointment. It is important to remember, though, that you can now create applications that use a combination of XAML, HTML, CSS and managed code that will support just about any UI scenario that can be imagined today.

In its sweet spot of media-centric, mini-game and graphical information applications, Silverlight promises much. What it delivers is likely to only be constrained by your imagination.

Coming next

So far we’ve looked at some of the core features of Silverlight, primarily from the perspective of Silverlight 1.0. In the next article we’ll examine how to exploit the new “CLR-on-the-client” features of Silverlight 1.1.”