By linulo on

I found a little time to play around with Silverlight. I am still new to SL and only got to use the 1.0 version, but I would like to share my impressions nonetheless.

SL is kind of cool. It is pushed by MS, so it is bound to become quite widespread (if not popular). The plugin installs like a charm - if you're using Windows or MacOS that is, if not, you're out of luck (kindof, an opensource clone called Moonlight is under development). On the downside, the plugin is not opensource and MS glues SL to other proprietary technologies like the WMV video format or .NET (which is part standardized, part proprietary).

SL works similar to Adobe Flex.

A plugin runs in your browser, that plugin loads data and can generate graphics, sound, animations and interactive elements based on the input data. In Flex, the format for describing the graphics is an XML dialect called MXML and the logic is programmed in a language called ActionScript which is similar to JavaScript. In SL the graphic description is in an XML dialect called XAML and the logic is coded in a JavaScript dialect in SL 1.0 or in (a subset of) .NET from version 1.1 on.

So how can you get Drupal to produce output suitable for SL? Here some simple steps I tried and recommend although there are definitely different approaches.

  • Create a new Drupal site.
  • Create a new input filter that uses the HTML filter but without any HTML tags allowed.
  • Create a few pages in Drupal for testing using your new plaintext filter.
  • Go to http://silverlight.net and take a look at some examples. Go to the Getting Started page of the SL site and download the Silverlight 1.0 Software Development Kit. This SDK is an MSI install file that contains SL documentation in chm format.
  • Copy the HTML that invokes the SL plugin from a SL example somewhere to your (local) web server. In the corresponding JS you should find code like this:
    function createSilverlight()
{
	var scene = new OurFirstSilverlight.Scene();
	Silverlight.createObjectEx({
		source: "Scene.xaml",

    Change the source value to the address of a page on your Drupal site, like http://localhost/silverlight/node/1.

  • Copy the XAML file from a simple SL example and strip it of any unecessary content and insert the following line at the top of the file:
    <?php header('content-type: text/xml') ?>
  • Make a new directory under sites/all/themes, copy the XAML file to it and rename it to node.tpl.php.
  • Take precautions to not lock yourself out of your site by a currupted theme, e.g. use admin theme, Masquerade module and/or open a second browser window with the theme selection sceen open. Then activate your new Siverlight theme and test.
  • Read in the SDK help so you know about TextBlock, Run, mouse events and JavaScript interaction.
  • Insert page variables enclosed in Canvas or TextBlock tags as needed. Only change one section at a time, then test. Make sure you do not use any default theme functions like theme('links', $primary_links). A simple call to l() will invalidate your XAML.
  • Elaborate from there towards the site you are trying to build.

As a sidenote: Silverlight does not have any notion of hyperlinks. Instead you just use normal text and attach mouse event handlers to it, i.e. a LeftMouseButton function that clears the current Canvas, downloads a new XAML file/drupal page with the Downloader, build an object tree from the XAML and attach it to the root element.

Good luck and please remember to share what you find out about Drupal-SL-integration.

⋅ Categories: Drupal 5.x