Jim Zimmerman

I had to solve an interesting problem the other day for our new Silverlight 2 chat app for our site.  People were closing the browser window and not clicking the leave chat button which clears out their chat session.  So we needed to find a way to close out their chat session.  There are several ways to solve this problem, write a windows service to clear out stale sessions among many others, but the real solution was to figure out a way to have a Silverlight function get called from JavaScript when they close the browser window.

So the first problem to solve is to catch the browser window close event in JavaScript.  Here is the the script you need to do just that on all 3 browsers, Firefox, IE and Safari.

<script type='text/javascript'>
        
        window.onbeforeunload = function() {
            var slCtl = document.getElementById("Xaml1"); 
            slCtl.Content.mySLapp.StopChatting();
            alert("You have been logged out");
        }

    </script>

The Xaml1 control is referencing the asp:Silverlight control that is on the page.  the slCtl.Content.mySLapp.StopChatting();  call is calling a method on my c# class in the silverlight project.  In order to make this work you will need to do two things in your silverlight project.  The first thing you need to do is to register managed code for client script access.  In the Application_Startup method in App.xaml.cs, call the RegisterScriptableObject() method on the HtmlPage object and pass in your type that you want to reference in your script.  Here is a sample of how to do it.

using System.Windows.Browser;

namespace Chat
{
    public partial class App : Application
    {

        public App()
        {
            this.Startup += this.Application_Startup;
            this.Exit += this.Application_Exit;
            this.UnhandledException += this.Application_UnhandledException;

            InitializeComponent();
        }

        private void Application_Startup(object sender, StartupEventArgs e)
        {
            // Load the main control
            this.RootVisual = new Page();

            //Setup some scriptable managed types for access from Javascript.
            ScriptableType st = new ScriptableType(); 
            HtmlPage.RegisterScriptableObject("mySLapp", st);

        }

        private void Application_Exit(object sender, EventArgs e)
        {

        }
        private void Application_UnhandledException(object sender, ApplicationUnhandledExceptionEventArgs e)
        {

        }
    }
}

Now we need to create the ScriptableType class and add the ScriptableMemberAttribute 
attribute, which is required in order to expose the members to client script.

using System.Windows.Browser;

namespace Chat
{
    public class ScriptableType
    {
        public ServiceHandler svc;

        [ScriptableMember()]
        public void StopChatting()
        {
            svc = ServiceHandler.Instance;
            svc.StopChatting();
        }
    }
}

You can also return a type string if you want and then alert that string that is returned in JavaScript.
It really is a very powerful feature and I am very excited to use this power in many other ways.  Happy coding!