Silverlight Calling

Quite often when developers create an application, they will tend to do everything in one technology. It’s not an uncommon thing as developers move toward developing Single Page Applications (SPA). Writing using a singular technology has its advantages such as allowing your developers to work and think in one syntax. You don’t have to keep and maintain multiple tool sets as well.

Such is the case with Silverlight development. Once upon a time, Microsoft had encouraged through code samples, technical articles, etc. to encourage development of a complete business application using the Silverlight technology. Since Silverlight client applications are written in C# all of the client side code is written using a subset of the .NET API, this was a very easy sell. It was what Microsoft was pushing for all of the partners to work with at the time. Just look at this article Silverlight Development: Build Your Business Apps on Silverlight, published in September of 2010. The article talks about all of the benefits that you will get by moving to this technology. Since then the web browsers have grown as has the HTML standards and JavaScript has become the ubiquitous language of the web. Web browser manufactures have since deprecated or completely eliminated support for the Netscape Plug-in Application Programming Interface (NPAPI) architecture from their browsers citing security issues. Fortunately Microsoft will continue to support Microsoft Silverlight 5 until 10/12/2021. Please check the Microsoft Support Lifecycle page for full details. Here are the Silverlight 5 System Requirements that lists the compatible operating systems and web browsers.

This has left developers with a big job of repositioning their applications to be deployed in the new web frameworks. Quite often it will not provide your company with a good return on investment to maintain or develop new features in this deprecated framework. The solution is simple, you need to start making your older Silverlight portions of your application talk to the new JavaScript portions. Here is an example on how to accomplish this task.

Calling JavaScript from within your Silverlight code is pretty straightforward and most of us have already done this type of call, but I’m going to show it for completeness. Please note the error handler. This can be called if the given function is not found or has not been loaded yet.

private static void WriteToJavascript(string message)
{
  try { 
    // Call JavaScript function called "javascriptFunctionName" and 
    // pass the message parameter to the function.
    HtmlPage.Window.Invoke("javascriptFunctionName", message); 
  }
  catch { /* Error Thrown When Method Cannot Be Found */ }
}

 
The code example below we see some JavaScript that will send some information to the server and get a response. This response can then be processed by your JavaScript code first to satisfy any needs that code has with the response data. Then that information, or a transformed version, can be sent back into the Silverlight code to handle any legacy concerns. This demonstrates calling Silverlight from your JavaScript code.

function getInformationFromServer(url) {
  $.ajax(url)
    .done(function(response, status) {
      // JavaScript Code Here

      // Pass along the response data to your Silverlight code.
      var silverlightControl = $('#silverlightControlHost')[0].children[0];
      silverlightControl.content.SilverlightCodeBehind.SetResponse(response.data);
  });
}

 
In the call above we see JavaScript calling into the Silverlight application. It does this by calling a function decorated with the Scriptable Member Attribute. This attribute indicates that a specific property, method, or event is accessible to JavaScript callers. Below is an empty function that represents the call from the JavaScript code above.

[ScriptableMember]
public void SetResponse(object response)
{
  //  Do work inside of Silverlight
}

 
I know that this is a very basic overview of how to achieve these operations. For a more complete sample, please review Microsoft’s own example, Walkthrough: Calling Managed Code from JavaScript. As always, if you have any questions or comments please ask. Until next time.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s