Last year we took Silverlight from a simple plugin & a brand name to a complete platform powered by .NET.

With a tough economy, the pressure is on to actually deliver value and make sound investments, and the open source work that we’re doing at Microsoft on the Silverlight Toolkit definitely is a good value.

I’d also like to take a minute to thank the thousands of subscribers and site visitors. I always welcome your feedback and post suggestions.

Jeff Wilcox’s RSS feeds

Last year I delivered a large set of tutorials, Silverlight guides, and overall I’m very happy with the content. I’d like to take this chance to present three key RSS feeds for my blog, in case you’re doing some RSS reader housekeeping.

Recent posts RSS: http://feeds.feedburner.com/JeffWilcox/ 

Silverlight-only RSS:  http://feeds.feedburner.com/JeffWilcox/Silverlight/ 
This is the RSS feed that is syndicated on the http://www.silverlight.net/ homepage and this Microsoft feed. This is a good subscription choice if you’re less interested in other technologies and topics (Apache, PHP, Seattle weather, you name it)

Recent comments RSS:  http://www.jeff.wilcox.name/comments/feed/ 

Silverlight Toolkit team RSS:  http://feeds.feedburner.com/SilverlightToolkitTeamMembersBlogFeeds/ 

Site updates

If you visit my web site, http://www.jeff.wilcox.name/, or click through to individual blog posts, you’ll notice that I spent some time in the month of December to refresh the visual design, styles, and functionality of my site and blog.

The pages have a true #fff white background now, archive pages and other pages list more topics, have excerpts, and the blog remains advertising-free.

Best way to deliver code snippets in blog postings?

Back in May, I announced that I was moving from screen captured code to JavaScript-enhanced post <pre /> content.

I’d appreciate it if you could share any comments on the format, I’m open to spending some time changing the process again. The experience today is a simple <pre /> text block for RSS readers, and when viewing the actual post web page, JavaScript powers value add (syntax highlighting, additional options, clipboard features).

Disclaimer reminder

Just a reminder to those that subscribe to these feed: as reproduced on all blog and site pages: "The content on this site represents my own personal opinions and thoughts at the time of posting, and does not reflect those of my employer in any way."

Powered by…

Finally, thanks go to WordPress, the best web publishing platform out there. The recent upgrade to WordPress 2.7 went great, and the product just continues to improve.

This blog is powered by:

• WordPress 2.7
• LAMP stack; PHP 5, MySql, dedicated Linux server hosting by ServerBeach

And produced using:

• Microsoft Windows Live Writer
• Adobe Creative Suite 4 Web Premium

Since my blog’s filled with some fairly technical resources, I should point out that the book is not the right reference for anyone that has an extensive knowledge of WPF or that has been an early adopter of Silverlight 2.

Laurent’s book instead targets everyone else: the millions of web developers that are new to .NET, looking to expand their working knowledge, or just wanting to learn something about the new exciting Silverlight platform. Much like Adam Nathan’s WPF Unleashed book, the full color examples and screen captures really add life and will help you connect to the tools and examples.

The book is organized into many vignettes almost, each covering a concept, walkthrough of a task, and showing screen captures, code, and helpful tips along the way. As a former client- server- Flash- everything- guy, I’m confident in saying that this is a great overview of what you’d expect if you were wanting to get all the key, above-the-fold info on this new platform.

In Chapter 1, the book begins covering where Silverlight has come from, other plug-ins, and demos. Chapter 2 moves on to XAML, and then the book moves on to basic transforms, colors, paths, JavaScript basics, and finally, chapter 9, an intro to .NET.

The middle of the book moves to C# programming, isolated storage, and animations. There’s then coverage on Expression, videos, and events. It then progresses to details on the rich Microsoft presentation platform basics, and will be familiar to WPF developers. This includes layout basics, the built-in controls, simple interaction and interoperability features.

The rest of Silverlight 2 Unleashed book covers a few neat topics that people may not be as familiar with: loading media metadata, quick WCF basics, cross-domain requests, exception handling, and then a bunch of odds-and-ends that will whet your appetite for learning more about working in a Silverlight world, working with binding converters, unit testing, and resources for finding controls and resources.

And, yes, you read that right: a Silverlight unit testing walkthrough is on pages 541-549. For full disclosure, I should note that I did work with Laurent to review that part of Chapter 24.

Anyway, if you’re looking to move to the Microsoft web platform, expand your skills, and see what Silverlight is all about – do check it out! Oh, and if you’re looking for even more controls resources, do check out the Silverlight Toolkit.

When you do not need to configure the MIME type:

• If your .Xap files and web pages are on the same domain and do not need to be embedded elsewhere
• If you use a service like Silverlight Streaming and just embed <iframe /> tags in your web site

But, if you want to share or enable embedding for others, you need to add the “application/x-silverlight-app” MIME type for your .Xap files.

This will allow:

• You to host your application binaries with a CDN
• Others to embed your applications in their pages and sites
• Bloggers to embed Silverlight <object /> tags right in their content and let syndication services and news readers embed the content

Equally important, if you don’t want others to directly link to and reference your .Xap from their domains, then make sure to not send this mime type.

Apache
For global configuration, in your central mime.types file, add:

# Enable Silverlight support for our apps to be embedded anywhere
application/x-silverlight-app        xap

Then restart Apache:

$ sudo ./apachectl restart

If you’re just configuring at the directory level, edit or add the .htaccess file in the directory you want to serve anywhere, and add the line:

AddType application/x-silverlight-app xap

IIS 6 & 7
Here’s a nice step-by-step guide to adding the MIME type on Windows web servers.

Amazon S3
Maybe not a true CDN, I do use Amazon’s Simple Storage Service (S3) for most of my Silverlight application hosting.

Amazon S3 records the MIME type that your S3 client sends with each file upload. This means that you must configure your system with the appropriate “application/x-silverlight-app” MIME type when you upload, or when clients download your .Xap, they will get an unknown MIME type and be greeted with blank space where you’d expect your app to be working.

Your CDN
I do not know the current Limelight or Akamai stories, sorry! Feel free to post a comment if you know.

Use Fiddler to check

I’d highly recommend that you download and use Fiddler2 on your Windows system. Using it, you can make sure and see what the content type is when it comes back in an HTTP response.

Note: This post contains live Silverlight content that your news reader may not be able to display.

The auto complete pattern is well-known, useful, time-tested. There’s been one in IE for ages. You expect that your e-mail client auto completes. Auto complete functionality can be found in controls in Winforms, WPF, AJAX, Flex. And now, Silverlight.

With the Silverlight Toolkit, we’ve decided to go beyond text-only suggestions. With basics in mind, we designed a flexible & extensible control that lets modern app developers use data binding, styling, data templates, and more.

Auto complete features you expect

• Bind to a list
• Override population
• Set a minimum length required to get results
• Set a delay before fetching suggestions

Silverlight AutoCompleteBox features

• Style and retemplate: style the control, the text box, the container; set a DataTemplate for items in the drop down; retemplate the control to look like a combo box; you name it.
• Built-in search modes. Provide your own custom text and item filter lambdas.
• Replace the ListBox with your own custom selection adapter

Using AutoComplete

To get started, just set the ItemsSource property to an IEnumerable. You’re then hooked up to the default filtering and are ready to go.

I’m going to walk you through some simple scenarios now using the control assemblies that we shipped in the toolkit. To follow along, you’ll need Visual Studio 2008 (SP1) with the Silverlight 2 Tools installed, plus the free Silverlight Toolkit.

First, create a new Silverlight application project: open Visual Studio, go to the File | New | Project menu option, and create a new C# ‘Silverlight Application’ project.

In the ‘Add Silverlight Application’ dialog, select the 2nd option to ‘Automatically generate a test page’, and click Ok.

To add a reference to the main toolkit control library, right-click on the project in the Solution Explorer and select ‘Add Reference’.

Now, click on the ‘Browse’ tab, locate the extracted toolkit folders, and move into the ‘Binaries’ directory. Select the ‘Microsoft.Windows.Controls.dll’ file and click Ok.

If you create a new Silverlight Application project and add a reference to the Microsoft.Windows.Controls.dll assembly that we shipped in the toolkit, you can follow along and learn about the control.

Inside Microsoft.Windows.Controls we included ObjectCollection. It makes it easy to create collections in SIlverlight XAML.

Inside Page.xaml:

• Add the XML namespace for the Silverlight Toolkit controls. I’m using the prefix "controls" here.
• Add mscorlib as a namespace, for strings.
• Add an ObjectCollection of months in the resources.
• Create an AutoCompleteBox control, setting the ItemsSource.

Here’s the Page.xaml file:

<UserControl x:Class="SilverlightApplication6.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:clr="clr-namespace:System;assembly=mscorlib"
    xmlns:controls="clr-namespace:Microsoft.Windows.Controls;assembly=Microsoft.Windows.Controls"
    Width="400" Height="300">
    <UserControl.Resources>
        <controls:ObjectCollection x:Key="Months">
            <clr:String>January</clr:String>
            <clr:String>February</clr:String>
            <clr:String>March</clr:String>
            <clr:String>April</clr:String>
            <clr:String>May</clr:String>
            <clr:String>June</clr:String>
            <clr:String>July</clr:String>
            <clr:String>August</clr:String>
            <clr:String>September</clr:String>
            <clr:String>October</clr:String>
            <clr:String>November</clr:String>
            <clr:String>December</clr:String>
        </controls:ObjectCollection>
    </UserControl.Resources>
    <StackPanel VerticalAlignment="Top" Margin="5">
        <controls:AutoCompleteBox ItemsSource="{StaticResource Months}" />
    </StackPanel>
</UserControl>

If you press F5 to run the project, you’ll get a text box that lets you type in a month.

Here is the application:

Do know that in the current release, this control does not respect the INotifyCollectionChanged interface. If you’re changing the underlying data, please reset the ItemsSource to a new list. We’ll address this in a future release.

Key AutoCompleteBox properties, methods and events

ItemsSource

Set your data here.

Text

Contains the current text that the user has entered or selected.

The TextChanged event is fired whenever the text is updated. Most classic auto complete applications function like text boxes, so those apps can use the Text and TextChanged events as they are.

You can also replace most simple TextBox instances in your applications with AutoCompleteBox.

IsTextCompletionEnabled

This property is true by default. It will perform a search on your items and look for the best match; if one is found, the text box is updated with the item’s string value, and the rest of the text will be highlighted.

SelectedItem

Is null if no item is currently selected.

If the user navigates through the drop down, selecting items, or clicks on an item, this will be updated to that item.

The SelectedItemChanged event fires when the item changes.

If you enter text into the control, such as "Steve Ballmer," the SelectedItem may not be updated to an item unless the list box item is selected or if you have text completion enabled.

SearchMode

Selects the built-in search filter to use. The default is "StartsWith," and checks that each item’s string value starts with the user’s search string. "Contains" is another very useful value, as is "None".

If you connect AutoCompleteBox to a web server that performs its own filtering, you’ll probably want to set the SearchMode to ‘None’.

MinimumPopulateDelay

This is an amount of time that elapses after the user types and the population event is fired.

The default value of 0 is very quick, so every time the user enters new character, the Populating event is fired. If you’re connected to a web service, you’ll want to step back and place a reasonable value in here so that not every keypress goes straight to the server.

MinimumPrefixLength

This is the minimum number of characters that must be entered before the control looks for suggestions. The default value is 1, but a lot of classic AJAX auto complete controls use 3 as the default value, so this is a common customization property.

Advanced scenarios might make use of:

TextFilter

Provide a lambda/delegate that takes two parameters: the search string, and the string that represents an item. The function needs to return bool true or false, indicating whether the item should be shown as a suggestion in the drop down list.

ItemFilter

The more fun version of TextFilter, this takes a lambda expression that has two inputs: the search string, and the item as an object. You are then free to use your own filtering logic with your rich data types to return true or false.

Populating event

Called whenever the control is ready to search for suggestions, this is your opportunity to intercept the standard filtering and manage the items source first.

If you have the data available immediately, before your handler returns, you can simply change the ItemsSource property of the AutoCompleteBox control right here, no other changes necessary.

But if you’re going to perform an asynchronous operation (background thread calculations; call a web service), you need to set the Cancel property of the event arguments to True. This will cancel the built-in AutoComplete filtering and effectively tell the control to hold off until you are ready.

To continue the suggestion process, you need to then call the PopulateComplete method. In your web service completion event, you’ll want to place this call.

Populated event

This is called once suggestions are found and ready to be displayed. The Data property of the event arguments gives you read-only access to the view that will be provided to the selection control.

DropDownOpening, DropDownOpened, DropDownClosing, DropDownClosed

A nice set of drop down events. The Opening and Closing events can be canceled.

AutoComplete items in the real world

Setting the ItemsSource in XAML is not a real scenario. Enter web services, business object collections, XML files.

The ItemsSource property will take any IEnumerable. Linq fans rejoice. If you don’t have the data ahead of time, you can subscribe to the Populating event of AutoCompleteBox and update the ItemsSource with the appropriate results, synchronously or asynchronously.

Using ItemsSource with a collection

If your application already has a set of data available (list of names, parsed XML, set of static city and state names), you can just set the items source in code to your enumerable collection.

Here’s another quick app. The XAML is:

<UserControl x:Class="SilverlightApplication7.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="clr-namespace:Microsoft.Windows.Controls;assembly=Microsoft.Windows.Controls"
    Width="400" Height="100">
    <StackPanel VerticalAlignment="Top" Margin="5">
        <controls:AutoCompleteBox x:Name="AutoComplete1" />
    </StackPanel>
</UserControl>

And the code behind file:

using System.Windows;
using System.Windows.Controls;

namespace SilverlightApplication7
{
    public partial class Page : UserControl
    {
        public Page()
        {
            InitializeComponent();
            Loaded += OnLoaded;
        }

        private void OnLoaded(object sender, RoutedEventArgs e)
        {
            AutoComplete1.ItemsSource = new string[]
            {
                "Steve Ballmer",
                "Bill Gates",
            };
        }
    }
}

Connecting to a JSON web service

Most AJAX auto complete controls today use JSON. The transmit format is lightweight, able to transfer rich object data, and supported by just about everything out there. The System.Json assembly in Silverlight makes it easy to parse in VB and C#.

Here is a minimalistic example. I have this PHP page deployed:

<?php
header("Content-type: application/json");

$var = "prefix";
if (isset($_GET[$var]) and $_GET[$var] != "")
{
        // Shorten
        $prefix = substr($_GET[$var], 0, 40);

        // Strip
        $s = strip_tags($prefix);

        // Create suggestions
        $suggestions = array();

        for ($i = 0; $i < 11; $i++)
        {
                $suggestions[] = $s . $i;
        }

        print json_encode($suggestions);
}
?>

I’m using the same Page.xaml from before. To get ready to use JSON, I need to:

• Add a reference to the System.Json Silverlight assembly
• Add a using statement to the top of my file for ‘System.Json’, ‘Microsoft.Windows.Controls’, ‘System.Linq’, and ‘System.Windows.Browser’

The code behind file doesn’t need many changes to deal with a web service.

The basic idea is to intercept the Populating event, cancel it, and kick off a web client. In the completion event for the web client, we update the items source of the AutoCompleteBox and call the PopulateComplete method to display the suggestions.

In my app, I first subscribe to Population. I set some basic properties too:

        private void OnLoaded(object sender, RoutedEventArgs e)
        {
            AutoComplete1.IsTextCompletionEnabled = false;

            // Server does the filtering
            AutoComplete1.SearchMode = AutoCompleteSearchMode.None;

            AutoComplete1.Populating += (s, args) =>
                {
                    args.Cancel = true;
                    WebClient wc = new WebClient();
                    string prefix = HttpUtility.UrlEncode(args.Parameter);
                    Uri service = new Uri("http://www.jwpc.com/services/suggest/?prefix=" + prefix);
                    wc.DownloadStringCompleted += DownloadStringCompleted;
                    wc.DownloadStringAsync(service, s);
                };
        }

Then, in the DownloadStringCompleted handler, I parse the JSON response:

        private void DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
        {
            AutoCompleteBox acb = e.UserState as AutoCompleteBox;
            if (acb != null && e.Error == null && !e.Cancelled && !string.IsNullOrEmpty(e.Result))
            {
                List<string> suggestions = new List<string>();
                JsonArray ja = JsonArray.Parse(e.Result) as JsonArray;
                foreach (JsonPrimitive suggestion in ja)
                {
                    suggestions.Add(suggestion.ToString());
                }
                if (suggestions.Count > 0)
                {
                    acb.ItemsSource = suggestions;
                    acb.PopulateComplete();
                }
            }
        }

That’s all there is to it!

Real world AutoComplete example

Inside the Silverlight Toolkit samples project, I’ve included a similar example of connecting to a JSON web service. It uses the excellent Live search suggestions. In this sample, the MinimumPopulateDelay is set to 150 milliseconds.

Here’s the Live.com sample:

How we determine what text to display in the text box

For performance reasons, we haven’t exposed the ability for you to creating a binding expression linking your items and the text that should be used in comparisons.

When you bind to a list of objects, the string representation is evaluated in the following order:

• Attempting to use an IValueConverter instance (this is the Converter property, along with ConverterParameter and ConverterCulture)
• Calling ToString() on the item

So, if you own the data classes in your application, you’ll want to expose the most meaningful name (such as a person’s full name, or employee ID), since the default ToString operator is going to return the type name of your item instead.

You can also provide a value converter in all situations.

AutoCompleteBox data templates, styling, and templating

You can use the ItemTemplate property to provide a DataTemplate that is used for rendering items.

These dependency properties can be used for styling:

• ItemContainerStyle
• TextBoxStyle

In the Live search example, the text box style was:

    <UserControl.Resources>
        <Style x:Key="SearchTextBoxStyle" TargetType="TextBox">
            <Setter Property="Background" Value="#AAFFFFFF" />
            <Setter Property="FontFamily" Value="Verdana" />
            <Setter Property="FontSize" Value="18" />
            <Setter Property="Padding" Value="2" />
        </Style>
    </UserControl.Resources>

And the AutoCompleteBox XAML:

<controls:AutoCompleteBox
    SearchMode="None"
    x:Name="Search"
    TextBoxStyle="{StaticResource SearchTextBoxStyle}"
    IsTextCompletionEnabled="False"
    IsEnabled="False" />

The control defines four template parts, similar to ComboBox; however, the default control template only provides 3 of those parts, since it does not expose a toggle button. All 4 are:

• The text box; named ‘Text’
• The popup; named ‘Popup’
• The selection adapter (ListBox is the default); control type or wrapper implements the ISelectionAdapter interface; named ‘SelectionAdapter’
• The drop down toggle button; named ‘DropDownToggle’ and of type ToggleButton

What’s next?

I hope this gives you what you need to get started using AutoCompleteBox in your own applications. In the coming days I’ll be posting some details and fun examples of how you can really make your apps shine with this control.

If you’re looking for other posts about the control, I’d recommend checking out Jonas Follesø’s AutoCompleteBox post too. He’s a blogging machine!

Hope this helps.

See also:

AutoCompleteBox: The 5 things you need to know

AutoCompleteBox Video Introduction

In all seriousness, Shawn Burke is the man behind open source in the developer division. And my boss. And we’ve been planning this major source release for a while now. He’s the person to thank for having the vision and the passion to challenge us to get this out there for you all.

All of our work is out there now with the Microsoft Public License (Ms-PL), an Open Source Initiative-approved license, so there’s a lot of opportunity for developers to reuse our hard work.

Delivering source code is easy. So we’re raising the bar, and shipping sample apps, sample source, plus the thousands of unit and functional tests that we used for testing these controls on all the supported platforms. Download the November ’08 release now!

We also deliver a complete data visualization stack, and David Anson has more details on that.

AutoCompleteBox

I was the developer for the AutoCompleteBox control and will be sharing a lot of the fun scenarios that the control enables on this blog in the coming days. This control is a lot like other AutoComplete AJAX controls that are out there, but shaken up and served with a twist of extensibility.

One small example for the true geeks out there: I love that we were able to deliver a searching/filtering story that lets you provide a lambda function to perform your own advanced filtering on the items.

Click to open the live sample project shown above. Then navigate to "AutoCompleteBox > Scenarios > Search Suggestions".

The "Search Suggestions" scenario sample inside the live control samples application actually connects to the Live Search web service, just like Live.com and IE8 do. The requests come back in JSON. And the sample features the AutoCompleteBox control for Silverlight. Clicking through the filenames at the top of the frame you’ll see that the whole thing was done in about a page of code.

The proverbial Microsoft blog storm is off to a good start. I’ll contribute my own wave of posts here soon enough. In the meantime, there’s already plenty of coverage out there.

Enjoy the source. Learn from it. Tell us what you would like us to focus on and do better and we continue to iterate on this toolkit.

Stay tuned.

Last week I was really bunkered down with Silverlight. That and upgrading to the 64-bit Photoshop. That’s nice, but I’m always pressing Alt-Tab to use Expression Blend. You really can build expressive apps with Silverlight.

I know for a fact that there’s some neat work happening in the community, and do apologize for being silent on the blogging front. Here’s some of what’s going on.

Built-in controls

The controls that ship with the Silverlight 2 runtime and SDK are slick. They received crisp, refined styles this time around, and the experience for application and interface developers is feeling similar to WPF now. There’s also a progress bar and password box built-in now.

If you’re not using the DataGrid in your apps, you’re missing out: Scott Morrison has been busy updating all of the great DataGrid tutorials for the final release version. Key messages: Performance, customizable, and new features too, like multi-selection.

Silverlight Toolkit

With the final Silverlight 2 release a little over a week ago, Shawn Burke blogged about the progress that we’re making on the Silverlight Toolkit. There are neat controls in the pic that he posted: Expander, a TreeView, NumericUpDown, and an AutoComplete text box.

Oops. I hit the wrong button, and Windows Live Writer seems to have posted a screenshot of a sample that I had up on my desktop… hmm… It sort of looks like a text box. And a drop down. Yet it has a DataGrid, too. Interesting…

So, stay tuned. Reiterating the cool things Shawn’s talked about:

• MS-PL, open source from Microsoft
• Things you’ve been missing: WrapPanel. DockPanel.
• Accompanying unit & integration tests built with the Silverlight Unit Test Framework

Watermarked TextBox Control

Yesterday Tim Heuer posted some Watermarked TextBox goodness on his blog, in case you were looking for that one.

SilverlightContrib

A few days ago a friend pointed me to the SilverlightContrib project. I’ll admit I don’t know a lot about it, other than the bullet points I saw on the homepage. I’m not associated with this project in any way, but want to give it props. Just look at some of the things it has:

• Zip compression
• Utilities galore: byte utilities. string utilities. animation stuff
• Some selection controls and gauges.

Check it out! There is a live demo page out there, too.

Here comes PDC

If you’re looking for something to do next weekend, it sounds like all the Microsoft geeks will be converging on the Los Angeles Convention Center for PDC 2008. There is even a nice convincing letter you can send your boss. Let me know if that works for you.

Stay tuned!

I’ve been involved in Silverlight for a few years now, in one capacity or another – and the trip has been awesome.

I won’t reminisce much, other than to say that I do have vivid memories of the weeks that debugging didn’t work… the weeks that the wrong clicks in a sequence could cause problems… What was released last week is solid.

Major kudos to everyone that made the release happen, it has been a pleasure working with you all. Now we’re going to see just how fun this gets. There’s more to come.

A week ago, I posted "If you can do it in JavaScript, you can do it in managed Silverlight .NET code." Here’s proof that the HTML interoperability capabilities in Silverlight are not only world-class, but also amazingly powerful.

This "managed HTML controls" concept is a neat idea: something that might whet your appetite to explore the interoperability features and consider using the feature to build sophisticated applications. However, key hurdles leave this as a conversation piece more than a new application platform. At the end of the day, the Silverlight presentation framework as it stands if going to be your best bet for a majority of your applications.

Exploring and thinking about changing the boundaries and status quo of web apps is something that’s fun and challenging. A client-side implementation of ASP.NET, enabling rich browser apps written in C#, was totally my dream a few years ago. Nikhil’s Script# actually can get you some of the way by letting you write client apps in .NET.

Today, a client-side ASP.NET HtmlControl is interesting, but not a game-changer, given the maturity of JavaScript platform and the richer app platforms out there like Silverlight (that is based on WPF) and Flex.

What’s the HtmlControls concept look like?

Here’s a look at a few of the types.

By exposing strongly typed properties, methods, and events, your .NET HTML application code will be cleaner, easier to maintain, enable you to use static analysis tools, and even perform unit testing.

Although the HtmlControlBase exposes a lot of the sample string-based properties as the standard Silverlight HtmlElement, it adds overloads with enumeration-based parameters (cut down on spelling errors), and stop having to duplicate strings through your app:

You can set Font properties like you would in ASP.NET, without worrying so much about CSS at the end of the day:

The same goes for standard HTML properties defined by the W3C – helpful HtmlProperty enum:

Thinking about the pros and cons

Some of what you can do with managed HTML controls:

• Create strongly typed custom controls: be more efficient, create simpler code, less spaghetti code
• Develop rich web applications using Visual Studio, including built-in FxCop, code refactoring, the object browser, XML documentation support, and more
• Create sophisticated AJAX-like applications with IntelliSense support
• No need for your controls to POST-back to the server or worry about ViewState ~ these are stateful, since they are in memory
• Integrate with Silverlight 2 applications, and all the richness it provides in its framework and class libraries
• You could move an application like 37signals’ Backpack out of a server farm, store the .Xap on a CDN, and use occassional cross-domain web service calls to store and retrieve data… imagine, some types of apps could serve a billion application users with only 1 billion .Xap downloads from your CDN, instead of generating tens of billions of web pages on an expensive web farm

What’s so great about it?

• Replace loosely typed string property setters (spaghetti code) with strongly typed code
• Like Script#… but with the live .NET Silverlight 2 CLR!
• Kind of like a cheap ASP.NET implementation, on the client side, that works on Windows and Mac (IE, Firefox, Safari)
• Proves how powerful Silverlight can be, even for out-of-the-box projects
• Fun!

What are the drawbacks?

• Silverlight has a much richer presentation story: really rich controls, animations, design tools like Blend, and WPF goodness. Videos. Audio. Full-screen.
• Why build effectively an HTML-based AJAX app using Silverlight, and yet require your users to have the Silverlight 2 runtime on their machines?
• The memory performance of this concept is probably quite bad: each element is already in the browser; there’s a pointer to that from the native platform in Silverlight; there’s the Silverlight HtmlElement object instance; and then there’s the HtmlControl type. That’s a lot of duplicated stuff!
• The performance of the concept in general isn’t going to be too awesome: there’s a lot of interop here between the web browser, JavaScript, the browser’s plugin APIs (NPAPI or ActiveX), the managed CLR, and back again
• All the points made here to NOT use the HTML DOM bridge

What does it give you that you don’t get with JavaScript?

• C#, VB, or DLR languages like Ruby running in the browser, client-side, interacting with the HTML page
• The ability to use Visual Studio for client web development

And, at the end of the day, Script# might get you these things, without the Silverlight dependency.

What does it give you that you don’t get with Silverlight today?

• Add managed code to existing AJAX applications and HTML elements by hooking up events and altering properties
• Easier way to work with HTML pages than using the functional but basic HTML interop
• Create rich HTML text editing controls and web forms; create elements for the browser’s built-in printing system

Using the HTML control framework

Example: Setting the width and height

Without this framework, to set the width of an HtmlElement in Silverlight, you’d need to write this code (assumes you have a regular Silverlight HtmlElement instance called "element"):

// Setting the height and width - notice the typo you wouldn't know
// about until runtime:
element.SetStyleAttribute("width", "50px");
element.SetStyleAttribute("height", "450ppx");

There’s no type checking: you won’t know about spelling errors or other problems until runtime, and if you do any CSS manipulation, your code will get very difficult to maintain. Here’s the same code, with a managed HTML control (using a few different ways of setting the value):

// Set the width and height of the control
control.Width = 50;
control.Height = new Unit(450, UnitType.Pixel);

Same # of lines of code, but a little more "attractive" API.

You can also wrap existing HtmlElements with a managed control in some cases: either standard parts of your web page, existing AJAX applications. This is possible when the constructor exposes a HtmlElement parameter.

Creating a composite control

Here’s a simple "user control" that has a link and a button inside of it:

using System;
using WebPage = System.Windows.Browser.HtmlPage;
using Microsoft.Silverlight.Testing.Html;

namespace HtmlControlSample
{
    /// <summary>
    /// A simple managed HTML control.
    /// </summary>
    public class MyUserControl : HtmlDiv
    {
        /// <summary>
        /// A simple link that is hooked up to the app.
        /// </summary>
        private HtmlAnchor _appLink;

        /// <summary>
        /// A simple button.
        /// </summary>
        private HtmlButton _button;

        /// <summary>
        /// Initializes a new instance of the MyUserControl control.
        /// </summary>
        public MyUserControl()
        {
            InitializeComponent();
        }

        /// <summary>
        /// Initialize composite controls and add them as children.
        /// </summary>
        private void InitializeComponent()
        {
            // A link that will display the current time
            _appLink = new HtmlAnchor(
                "Click me for the time!",
                (sender, e) => Alert(DateTime.Now.ToLongTimeString()));

            _button = new HtmlButton();
            _button.InnerText = "Toggle my boldness";
            _button.Click += (sender, e) => _button.Font.Bold = !_button.Font.Bold;

            Controls.Add(_appLink);
            Controls.Add(_button);
        }

        /// <summary>
        /// Uses the Alert method of the HTML interoperability feature to
        /// display text.
        /// </summary>
        /// <param name="text">The text to display.</param>
        private static void Alert(string text)
        {
            WebPage.Window.Alert(text);
        }
    }
}

To hook it up to the application, here is a simple class that shrinks the Silverlight plugin to not occupy any space on the page, that creates a new instance of the MyUserControl type and appends it to the web page body.

The HideSilverlightPlugin function is important because it lets you press F5 while working in a standard Silverlight application project.

using System;
using Microsoft.Silverlight.Testing.Html;
using WebPage = System.Windows.Browser.HtmlPage;

namespace HtmlControlSample
{
    /// <summary>
    /// A sample HTML application.
    /// </summary>
    public class SampleHtmlApp
    {
        /// <summary>
        /// The application's user interface control.
        /// </summary>
        private MyUserControl _myUserInterface;

        /// <summary>
        /// Initialize and run the application.
        /// </summary>
        public static void Run()
        {
            new SampleHtmlApp();
        }

        /// <summary>
        /// Initializes a new instance of the SampleHtmlApp class.
        /// </summary>
        private SampleHtmlApp()
        {
            HideSilverlightPlugin();

            // Creates a new managed HTML control
            _myUserInterface = new MyUserControl();

            // Appends the control to the web page body
            WebPage.Document.Body.AppendChild(_myUserInterface);
        }

        /// <summary>
        /// Takes the current Silverlight plugin instance and changes its size
        /// to be 0x0 pixels. Makes the same change to the hosting div element.
        /// This enables F5 testing of a managed HTML control app inside Visual
        /// Studio when using the standard TestPage.html in a Silverlight app.
        /// </summary>
        private void HideSilverlightPlugin()
        {
            HtmlControl plugin = new HtmlControl(WebPage.Plugin);
            HtmlControl host = new HtmlControl(WebPage.Plugin.Parent);
            plugin.Width = 0;
            plugin.Height = 0;
            host.Width = 0;
            host.Height = 0;
        }
    }
}

You can call the Run() method from anywhere in your Silverlight application – both can co-exist without issue. However, I’ve just replaced the RootVisual call in the Application_Startup method to demonstrate this example:

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

            InitializeComponent();
        }

        private void Application_Startup(object sender, StartupEventArgs e)
        {
            SampleHtmlApp.Run();
        }

Here is this simple HTML application (powered by Silverlight) running on OS X 10.5 in the Safari web browser:

Appending a managed control tree to HtmlElements

Thanks to an extension method, you can append a managed HTML control (that inherits from HtmlControlBase) to the standard HtmlElement inside Silverlight as if the control is an HtmlElement:

The managed control wrapper actually tracks any changes (styles, properties, child controls) to the control and waits until it is inserted into the live web page tree to apply the properties and create the child elements.

At the end of the day there are a lot of types involved here, bridging several layers of abstraction. This is definitely not a "lightweight" solution.

These bits are in use today

One of the key features of the in-browser Silverlight unit test framework is that it exposes an interactive log inside the browser, using the HTML interoperability feature.

If you’ve used the Silverlight unit test framework, then you’ve used this managed HTML controls implementation without knowing it: to move away from "spaghetti-code", we setup the log to use simple custom controls built on top of this framework.

Here’s a few screenshots of components, including a ProgressBar control:

Here’s the implementation of the ProgressBar:

using System;
using Microsoft.Silverlight.Testing.Html;

namespace Microsoft.Silverlight.Testing.UnitTesting.UI
{
    /// <summary>
    /// A control to visualize a test run's progress.
    /// </summary>
    public partial class TestRunProgress : HtmlDiv
    {
        /// <summary>
        /// The percent of the run that is complete.
        /// </summary>
        private double _percent;

        /// <summary>
        /// The progress bar.
        /// </summary>
        private HtmlDiv _progress;

        /// <summary>
        /// Initializes a new progress bar control.
        /// </summary>
        public TestRunProgress() : base()
        {
            InitializeComponent();
        }

        /// <summary>
        /// Gets or sets the percent complete on a scale from 0 to 100.
        /// </summary>
        public double PercentComplete
        {
            set
            {
                _percent = value;
                UpdateProgressBar();
            }

            get
            {
                return _percent;
            }
        }

        /// <summary>
        /// Sets the color of the progress bar.
        /// </summary>
        /// <param name="value">The color value.</param>
        public void SetProgressColor(string value)
        {
            _progress.BackgroundColor = value;
        }

        /// <summary>
        /// Updates the progress bar.
        /// </summary>
        private void UpdateProgressBar()
        {
            double width = (double)GetProperty(HtmlProperty.ClientWidth);
            if (width <= 0)
            {
                return;
            }
            int round = (int) Math.Round(_percent * (width / 100));
            _progress.Width = round;
        }

        /// <summary>
        /// Initializes the web control.
        /// </summary>
        private void InitializeComponent()
        {
            SetStyleAttribute(CssAttribute.Position, "relative");
            _progress = new HtmlDiv();
            _progress.SetStyleAttribute(CssAttribute.Position, "absolute");
            _progress.Position.Left = _progress.Position.Top = _progress.Position.Bottom = 0;
            SetProgressColor(Color.Black);
            MakeTransparent(_progress, 25);
            Controls.Add(_progress);
        }

        /// <summary>
        /// Makes a control transparent.  Works with several browsers.
        /// </summary>
        /// <param name="control">The control.</param>
        /// <param name="opacity">The opacity amount.</param>
        private static void MakeTransparent(HtmlControl control, int opacity)
        {
            control.SetStyleAttribute("filter", "alpha(opacity=" + opacity + ")");
            control.SetStyleAttribute("-moz-opacity", "." + opacity);
            control.SetStyleAttribute("opacity", "." + opacity);
        }
    }
}

Clicking on a test method name expands a details drill-down full of stats and information, including links that can be clicked to retry tests and display easy-to-copy details:

Download the bits

Since this is only a concept, and not something you would want to use in a production application, the bits are currently only available as part of the Silverlight unit test framework download for the Silverlight 2 Release Candidate 0.

The implementation is not a complete framework, but rather a minimal set that enables basic functionality: links, buttons, and displaying and creating HTML elements. It does not contain a rich web forms implementation, cool validation controls, or anything like that.

In the future I may make the concept available as a download separate from the test framework, but today I want to make it clear that it isn’t something that is ready to really be used in everyday web applications… so hopefully the total size of the test framework assembly will discourage that [81kb]!

It is totally unsupported, to be considered prototype code.

Here’s the set of types and enums in the namespace today. You’ll see that it is a minimal set, and isn’t including a lot of the typical HTML controls like check boxes, forms, or web form controls. There’s room to innovate, but the value may not be there:

Do let me know if you like it, or build anything noteworthy, in the comments, and I will post a follow up in the future.

Other ideas

There is potential for the concept in some apps, and I’m sure some really brilliant folks out there could do any of the following things that’ve come across my mind:

• Writing an ASP.NET-style XML parser using System.Xml.Linq, enabling you to embed .aspx-like pages inside your application to enable generating managed HTML control trees at runtime
• Integrating with XAML, so a XAML page could contain a managed HTML control tree
• Writing a compatibility layer that would allow custom ASP.NET controls to run inside Silverlight
• Integrating or porting popular AJAX functionality (animations, rich control behaviors)
• Writing applications that live as a .Xap file at your CDN or Amazon S3, and access cross-domain web services for any data needs, combined with isolated storage

I’ve built a number of fun applications using this framework and think it’s a neat concept, I will share those sometime…

Special thanks to Hao Kung, Huangli Wu, Stefan Schackow, and Wilco Bauwer for their excellent work in shipping the amazing HTML DOM feature inside Silverlight 2!

Hope you find this interesting,

-Jeff

Now that we’re clear on that one, this is the part where I show you that you can do a ton of stuff in Silverlight, through the JavaScript interoperability features.

Reaching out to the browser can help you improve the fit and finish of your Silverlight application and to integrate with existing services.

So, if you can do it in AJAX/JavaScript, you can totally do it in your Silverlight application when it is hosted in a web browser.

Reasons not to use the “HTML DOM bridge” (JavaScript interoperability features) in Silverlight:

• Feels “Hacky”
• Leads to spaghetti code – the calls are very procedural and you lose the nice strongly typed features of your .NET language of choice
• One line of JavaScript often takes 3 or 4 lines of managed code to accomplish the same thing via the interop syntax
• The rich presentation framework in Silverlight is pretty awesome – you should use it!
• Potential performance implications having JavaScript – native code – managed code all involved with timers, marshalling, etc.
• Can just use JavaScript without requiring the Silverlight 2 runtime

Reasons to use it:

• Interact with the web browser host: set the page title, alter the plugin, add dynamic HTML content on the fly
• Bridge classic web applications, AJAX apps, and rich Silverlight
• Can replicate the experience of a server-side application, with web forms, HTML elements, and more – all on the client-side, without having to go back to the server to run an ASP.NET or PHP application
• A lot of analytics and advertising systems are exposed great in JavaScript

What follows is a list of some previously covered articles and examples. They may be out of date; for instance, in the Release Candidate of Silverlight, you now use the ScriptObjectCollection instead of the HtmlElementCollection. Mike Snow has a nice list of the breaking changes.

Access and create JavaScript arrays from managed code

You can access JavaScript arrays, but because of the loosely-defined, “do anything you want in JavaScript” way that things work, it leaves you with pretty unattractive managed code.

VB samples are here. Some C# samples:

// Create an array
var array = (ScriptObject) HtmlPage.Window.Eval("[10, 9, 8, 7, 6 ];");

// Get the length of an array
int length = (int)((double)array.GetProperty("length"));

// Return a single element by index
var singleElement = array.GetProperty(index.ToString())

Resize the Silverlight plugin

You can change the size of the plugin and its host element. Here’s some Visual Basic that makes a “zero-pixel” plugin:

Imports System.Windows.Browser

Namespace System.Windows.Browser
    Public Class ZeroPixelPlugin
        ''' <summary>
        ''' Resizes the Silverlight plugin and its host element to be zero pixels
        ''' in width and height. Only really useful for HTML
        ''' </summary>
        ''' <remarks></remarks>
        Public Shared Sub HideSilverlightPlugin()
            Dim plugin As HtmlElement = HtmlPage.Plugin
            Dim host As HtmlElement = plugin.Parent
            plugin.SetStyleAttribute("width", "0")
            plugin.SetStyleAttribute("height", "0")
            host.SetStyleAttribute("width", "0")
            host.SetStyleAttribute("height", "0")
        End Sub
    End Class
End Namespace

Get information about the browser and physical screen

Wondering what the color depth is of your end users? Want to work with the available screen size? All this information is exposed by JavaScript and you can easily read the values in C#.

Here’s a simple static class that does the work for you. The class takes care of the differences between the NPAPI web browsers and Internet Explorer, so your application doesn’t need to worry about it so much.

 Store text in the clipboard

If you have information that you want your end users to be able to copy into the clipboard, you only have a few options:

• Place the text in a TextBox control, allowing a user to select and press Control + C or Command + C to copy it into their clipboard
• Use interop features to talk to the web browser, or other plugins

Here’s a solution that uses the browser APIs in IE, and another plugin if you’re on a non-IE browser. It isn’t perfect, but it’s an interesting hack.

Generate an entire HTML/AJAX-style user interface

You can write complete applications, just like an AJAX app, using managed code. Your business logic and other components benefit from strongly typed, easy-to-edit C#. Your application can be delivered through a .Xap, and doesn’t have any server side dependencies if it is written just right.

Here was a homepage “link cloud” app. It hasn’t been updated in a while, but most of the code should work without changes in the release candidate.

Some of the things the app and the post show:

• Creating and managing HTML elements in .NET
• Attaching and working with HTML DOM events
• Using IsolatedStorage for saving information on the local machine

Interface with web analytics software

A while back (yeah, Silverlight 1.1 days) I posted about interfacing with Google Analytics / Urchin. Although the information is still useful, Google did make some major updates to the APIs, so I’d recommend not using the Urchin implementation in the post.

Anything else cool?

If you’re using the DOM bridge to do some interesting stuff, feel free to post a link here – I’d like to post about the neat uses at some point in the near future.

Well, I hope that gets you started working with the interop features a little more. Done right, you can start wearing a T-shirt the says “I do it in JavaScript… AND in .NET!”

Today, I’m making an attempt to move back to raw <pre /> tags, populated with text, that should be formatted on the fly by modern web browsers.  This is great for folks that visit my blog, but does deliver a less-than-attractive experience for newsreaders.

This is accomplished using:

• Windows Live Writer
• Coskun Sunali’s Insert Tag Snippet plugin for Writer
• Alex Gorbatchev’s syntaxhighlighter

Scott Guthrie’s monster blog posts are amazing, and the look is consistent everywhere.  This is because they’re full of Visual Studio + code screen captures.  I’m sure the syntax highlighter screen caps set off the latest wave of .NET developer’s color customizing that’s on all the dev’s machines that I’ve seen.

Here’s what C# code used to look like on my blog:

On to samples of the new system:

C#

    [TemplatePart(Name = HyperlinkButton.StateDisabledName, Type = typeof(Storyboard))]
    public partial class HyperlinkButton : ButtonBase
    {
        #region NavigateUri
        /// <summary>
        /// Gets or sets a URI to navigate to when the link is clicked.
        /// </summary>
        [TypeConverter(typeof(UriTypeConverter))]
        public Uri NavigateUri
        {
            get { return GetValue(NavigateUriProperty) as Uri; }
            set { SetValue(NavigateUriProperty, value); }
        }

Visual Basic

Imports Microsoft.Silverlight.Testing
Imports Microsoft.VisualStudio.TestTools.UnitTesting

<TestClass()> _
Public Class Class1

    ' This is a super simple test
    Public Sub SimpleTest()
        Assert.IsTrue(True)
    End Sub

End Class

JavaScript

var cssNode = document.createElement('link');
cssNode.type = 'text/css';
cssNode.rel = 'stylesheet';
cssNode.href = ss;
cssNode.media = 'screen';

// Append the new node
head.appendChild(cssNode);

XML

<?xml version="1.0" encoding="utf-8"?>
<items>
  <item type="photoset" id="395" owner="12037949754@N01"
		primary="6521" secret="5a3cc65d72" server="2"
		commentsold="1" commentsnew="1"
		views="33" photos="7" more="0">
    <title>A set of photos</title>
    <activity>
      <event type="comment"
			user="12037949754@N01" username="Bees"
			dateadded="1144086424">yay</event>
    </activity>
  </item>
</items>

XAML

<ResourceDictionary
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <!-- Default style for System.Windows.Controls.Button -->
    <Style TargetType="Button">
        <Setter Property="IsEnabled" Value="true" />
        <Setter Property="IsTabStop" Value="true" />
        <Setter Property="Background" Value="#FF003255" />
        <Setter Property="Foreground" Value="#FF313131" />
        <Setter Property="MinWidth" Value="5" />
        <Setter Property="MinHeight" Value="5" />
        <Setter Property="Margin" Value="0" />
        <Setter Property="HorizontalContentAlignment" Value="Center" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="Cursor" Value="Arrow" />

I’ll probably do some customizing of the highlighting brushes in the future, or see about porting the library to C# + Silverlight 2.  Let me know what you think about this change as I begin posting some new content: a step in the right direction?

The app has some key features:

• No dependencies on a web server, web service, or database server
• Links are true HTML links that get larger the more often they’re clicked.  They can be added, removed, and rearranged
• Stores the link information locally, available to all browsers on the platform
• The data is yours: you can import/export the raw data to easily bring it to another of your computers

Special thanks to Chris Gansen for letting me borrow the specifics from his RoR implementation of this application, it translated nicely to a client app.

Experience this application live. 
Since the local isolated storage is used, the links are only on your machine, the first time you use the app it’ll have no links.  Click here for a text file you can paste in using the import/export feature to load a set of sample links.  I store my link cloud in GMail so that I can always setup another machine in seconds from my mail account.

The .Xap file that represents the app is a miniscule 10kb.  By comparison, a server-side version of this app can easily serve 40kb pages once the editing interface is included.  The only hard-coded dependency is the stylesheet link that I’m injecting at runtime.

This uses many of the less sexy Silverlight 2 Beta 1 features:

• HTML DOM interoperability: the bridge between managed code and the web browser, the entire underlying user interface is generated and managed by managed code
• Local isolated storage: By storing the data on the local machine, there’s no complex web service or database required
• ApplicationSettings: An easy-to-use way of storing data to the isolated storage area, there’s no need to deal with StringReaders and Stream manipulation code
• Zero pixel 0×0 plugin: By resizing the Silverlight plugin to occupy no space upon load, the application demonstrates the capabilities of managed code without the use of controls and the rich presentation framework
• .Xap package is easy to deploy and store on a content delivery network, file or web server

Although I’m using ApplicationSettings type to store the link cloud data, I just wanted to get this up and running, so I’m not following any best practices, and am actually serializing the cloud data myself into a single string.

Downloads
Live app (10k) – feel free to use this for your homepage
Sample data file (2k) – can import for sample data
Source code (39k) – Zip file with the Visual Studio project, just barebones code, no good code in here
LinkPage.cs (21k) – Primary source file

Briefly jumping into the code, you’ll find that everything’s really contained inside LinkPage.cs.  Some of the things inside the file that I’d like to call out:

Setting the page title

This updates the title displayed in the browser’s window.  It’s equivalent to the simple JavaScript call of setting document.title.  The HtmlDocument type, in the System.Windows.Browser namespace, maps directly.

Reading from ApplicationSettings and changing the <body /> element’s CSS class

The ApplicationSettings type is a nice shortcut to having to use Isolated Storage, and is used to store two settings for this link cloud application: the color used for the stylesheet (there’s a few themes available), and the actual link cloud data.  The data’s updated and saved whenever a change occurs to avoid having to write the changes at one time.

Injecting a Stylesheet element

Pretty standard document object model workflow here: the code’s nothing but spaghetti.  The new element is created, attributes set, and then appended.  There’s no need to keep a reference to the element unless you intend on interacting with it later.

There’s a built-in property HtmlPage.Document.Body that can be used to return the <body /> element on the web page, but not one for the <head /> element.  The code above successfully will add to the head of the page, assuming the head exists.

Prompting the user for confirmation

A lot of AJAX applications use ‘confirm(…)’ to get quick verification before deleting data permanently.  Both Alert and Confirm are available within the HtmlWindow type in the HTML DOM bridge, so it’s super easy to do the same in managed code:

Navigating to a new web page

The links in the link cloud have the href attribute set to point to the destination page – this enables the end user to open the links in a new tab or window easily.  However, the click count is only incremented when the link is clicked since the onclick event is used to track and increment the underlying hit data.

The Navigate method of HtmlWindow is used to go to the requested URI.

Creating an HTML button and hooking up to its Click event

The form that’s created on the page uses managed event handlers in C# to process events and read data:

The button above is used to add the form data into the cloud as a new link.  If you examine it you’ll also see use of SetProperty, SetStyleAttribute, GetProperty, and more – these are all at parity with traditional AJAX JavaScript coding, so it should be quite familiar. 

Wilco has a lot more information on the subject of the HTML DOM interoperability feature in Silverlight 2.

Hope you find this useful!

Looking at the spaghetti code, it’s clear that some kind of helpful “managed HTML object” library would make creating this style of application a lot easier in the future.

Using the Silverlight DataGrid
Scott Morrison gets you started using the DataGrid, autogenerating columns are great!  Also useful if you’re new to the data binding in Silverlight.

Isolated Storage
Wilco Bauwer is the developer on our team who’s done much of the isolated storage API work that’s new to Silverlight, he has a quick look at IsoStore in the beta.  Also check out his detailed interoperability post, all about the HTML DOM bridge feature that is much more powerful than that delivered last year in the v1.1 alpha.

Right-click
Peter Blois has a good Windows Internet Explorer and Firefox right-click bubbling implementation.  Above, his minesweeper implementation that lets you flag using a right-click.

HtmlTextBlock
David Anson revises his HtmlTextBlock control, now supporting Beta 1 of Silverlight 2.  Good stuff!  Above is his sample app, available for download as an attachment on his post.

Synchronous network stack
Although personally I’m a major fan of the asynchronous-only network stack exposed by Silverlight 2, some people are definitely in favor of synchronous calls, so this forum post on Silverlight.net by Jack Bond might get you where you’ll looking to go.

Related,
I’ll work to release my 100% asynchronous Flickr API implementation in the coming weeks, so look for that.

HttpUtility
I’ve had a few people ask recently how to URL encode strings in Silverlight.  Within the System.Windows.Browser namespace, there’s the HttpUtility type which is very similar to ASP.NET’s, so there you’ll find HtmlDecode, HtmlEncode, UrlDecode, & UrlEncode.

Using a production web server
Brad Abrams provides some hosting tips for making sure that .xap, .xaml, and other filetypes can be served with some server configuration tips.

Enjoy!