Copying the Silverlight community menu

I'm building out a website using Silverlight.  The more I learn about Silverlight the more I love it - I haven't had this much fun writing code in a long time.   This is seriously addicting stuff. 

One of the things that frustrated me is that many of the Silverlight 2 samples were not very useful.  How many people are really interested in writing a video game with Silverlight?   I needed an exciting (and easily implemented) menu effect for my web page.   I searched everywhere but didn't find much.   Many of the menus were simple block-style fly-out menus or were based upon the 1.1 (or older) release.   I finally found the effect I wanted on the silverlight.net community page.    The page features a menu that uses mouseenter/mouseleave highlighting and a little indicator that follows your mouse back an forth to illustrate which menu option you clicked.   A screenshot of the menu appears below:

I recreated this menu in Silverlight 2 by defining a simple XAML file for the menu and handling the animation in C# (instead of embedding it in the XAML):

         private void StackPanel_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)
        {
            this.Cursor = Cursors.Hand;
            
            // Create two DoubleAnimations and set their properties.
            DoubleAnimation myDoubleAnimation = new DoubleAnimation();

            // Create a duration of 2 seconds.
            Duration duration = new Duration(TimeSpan.FromSeconds(0.4));

            myDoubleAnimation.Duration = duration;
            
            Storyboard sb = new Storyboard();
            sb.Duration = duration;

            sb.Children.Add(myDoubleAnimation);

            Storyboard.SetTarget(myDoubleAnimation, selectionPointer);

            // Set the attached properties of Canvas.Left and Canvas.Top
            // to be the target properties of the two respective DoubleAnimations
            Storyboard.SetTargetProperty(myDoubleAnimation, "(Canvas.Left)");

            StackPanel sp = (StackPanel)sender;
            switch (sp.Name)
            {
                case "Home":
                    homeGlow.Visibility = Visibility.Visible;
                    myDoubleAnimation.To = 380;
                    break;
                case "Services":
                    servicesGlow.Visibility = Visibility.Visible;
                    myDoubleAnimation.To = 528;
                    break;
                case "HowTo":
                    howtoGlow.Visibility = Visibility.Visible;
                    myDoubleAnimation.To = 665;
                    break;
                case "Technology":
                    technologyGlow.Visibility = Visibility.Visible;
                    myDoubleAnimation.To = 810;
                    break;
                case "SignUp":
                    signupGlow.Visibility = Visibility.Visible;
                    myDoubleAnimation.To = 960;
                    break;
            }

            // Make the Storyboard a resource.
            LayoutRoot.Resources.Add(sb);
            // Begin the animation.
            sb.Begin();            

        }
        private void StackPanel_MouseLeave(object sender, System.Windows.Input.MouseEventArgs e)
        {

            this.Cursor = Cursors.Arrow;
            StackPanel sp = (StackPanel)sender;

            switch (sp.Name)
            {
                case "Home":
                    homeGlow.Visibility = Visibility.Collapsed;
                    break;
                case "Services":
                    servicesGlow.Visibility = Visibility.Collapsed;
                    break;
                case "HowTo":
                    howtoGlow.Visibility = Visibility.Collapsed;
                    break;
                case "Technology":
                    technologyGlow.Visibility = Visibility.Collapsed;
                    break;
                case "SignUp":
                    signupGlow.Visibility = Visibility.Collapsed;
                    break;
            }
        }

I used a graphic for the background glow because Silverlight doesn't (yet?) provide this option. Here is the final look and feel of my menu (without the glow):

I've attached the XAML I used for the menu (which includes the scrolling indicator).     Enjoy!

By popular demand, here is the graphic I used to make the menu glow.  Enjoy!

Update: After many promises, here is an update.   This zip below contains the XAML and code for the menu system described above.  Note that you will see some code in the xaml.cs file as follows:

                 IBasePage pageToUnload;
                pageToUnload = (IBasePage)p3.Spotlight.Children[0];
                pageToUnload.ActivatePageFadeOut();

This is because all of my pages inherit a common set of Storyboards for fading pages in and out when they get loaded or unloaded.   Comment out any and all references to base pages if you having a problem with the code.

One other thing: I'm not proud of the code - you'll see some hard-coded stuff that could have been avoided were we working with a dynamic language.   Ah well, at least it works.   Ping me if you have any questions.