[update: source included
I have included the source. The source code works with the asp.net developer webserver instead of IIS. That will make it easier for you to run the sample!]

The autocomplete box is a control that will popup a combobox based on what the user is typing. You see a lot of these on the web, and for good reason: they really help make your enduser more productive!
In this post I will walk you through building a (WCF) webservice and connecting it up to the box. As you will see, it's really easy.

If you are unable to visualize it, this picture from our codeplex pages demonstrates a simple example:

Step 1: create the webservice

We start of by creating a new project and choosing to create a new asp.net project for us. It will hold our webservice. Let's add one by choosing the 'Silverlight enabled WCF Service' template that should be when you add a new item.

So, add a service called 'NamesService.svc'.
After you have made a list of your friends, return them in a similar fashion as I do:

(Actually, after watching the PDC keynotes, don't you really want to use livemesh to do this kinds of stuff?? Or could we get this from Bluehoo? )

Step 2: connecting from silverlight

In your silverlight application, add a service reference. Because you are working from one big happy solution, you will be able to press the discover button and get your service. Add it and give it a nice name.

This will add a proxy to your Silverlight client.

Step 2.1: test it out, man!

Let's just quickly see if we can get our service to work! Add these lines of code in your page.xaml.cs file and run.

This should print out the number 7 in your output.

We are first setting up a callback that will be called when the webservice returns with information. The args.Result property is a strongly typed property which holds your result.
We kick of the call to the webservice with our proxy.GetFriendsAsync() call.

Step 3: bring in the autocomplete textbox

It is time to add the autocomplete textbox in the mix.

Add a reference to the silverlight toolkit to your project, and (do) use the 'controls' prefix as the xmlns namespace. Then, just add it to the page xaml.

I have added the box and have added an eventhandler to the Populating event. This will allow me intercept and call our webservice. Dropping back to code, we'll hook everything up:

On line 33, I'm cancelling the population. Populating should really be done synchronously and fast. Since we can't do it fast, we will be doing the populating ourselves.
On line 50, we make the call to our webservice. When it is finished, it will execute the anonymous delegate on lines 39 to 46.
Our args.Result is a string[] with friends from the server. I will combine that with a list of friends we might keep in a different source.

The result:

Check out the LiveSearch scenario sample that comes with the toolkit. It connects to livesearch and fetches search suggestions on the fly.

When you are browsing the charting samples here, you will notice a scenario that is currently called 'Zoom'.

I think it's pretty clear that you are supposed to drag the zoom slider :)

When you do, the chart is resized and to look like this:

Charts do not have this capability built-in at the moment, so this gives us the opportunity to dig into the charts a bit.

All charts are of the same type (Chart) and you can create a line series by adding an instance of LineSeries to the chart. This is quite flexible, because you can add as many as you want. It our case, two are added. Let's take a look at the different controls that make up this sample:

As you can see, two LineSeries have been added, their ItemsSource pointing to a static resource defined somewhere else.

The slider is hooked up to a method in my codebehind which executes this one line of code:

            ChartArea.Width = ScrollArea.ViewportWidth + (ScrollArea.ViewportWidth * zoom / 100.0);

I am not setting the width of the complete chart. If I were to do that, the legend and title would scroll away as well, which is not what I want. Besides, there is no ScrollViewer around to handle the scrolling. Lets take a look at the custom template that does have a ScrollViewer in it:

I have retemplated the chart to include a ScrollViewer.

You can clearly see that the legend is not in the ChartArea. So, setting the width of the ChartArea will give you the zoom you are aiming for. The axis get notified of the change and (if set to 'Auto'), will update to show more or less information.

Since Chart is a sealed class, I had to walk the visual tree to get to both the ChartArea component and the ScrollViewer.

Today, Scott Guthrie announced our teams product: the Silverlight Toolkit. My boss, Shawn Burke just posted a blog that lists all the different controls that are included and gives out information about the quality levels of the controls. It's a must-read.

The components included in this release are:

Components in the Preview Quality Band

• AutoCompleteBox
• NumericUpDown
• Viewbox
• Expander
• ImplicitStyleManager
• Charting

Components in the Stable Quality Band

• TreeView
• DockPanel
• WrapPanel
• Label
• HeaderedContentControl
• HeaderedItemsControl

I joined only a few weeks ago and have been looking at the controls. What is most impressive, is the incredible amount of unittests that are included with this release. On the team is Jeff Wilcox who heads the Silverlight Unit Test Framework.

I have been playing around with the controls and will probably be blogging some short blobs about my findings. I've spend quite some time with charting.

David Anson (Delay) heads up the charting control, which is the biggest feature that we are including. He has just announced it with a very detailed introduction post. He is also announcing the ChartBuilder application, that will make it easy for you to play around with the settings.

Go download and play, let us know what you think!

I’m very excited that Silverlight 2 has been released. I’m too new to Microsoft to claim even the slightest involvement, but it’s wonderful to see the excitement both within Microsoft as outside.
It will be interesting to see what will happen with the (already great) uptake of Silverlight by the market.

As I am spending most of my days knee-deep in Xaml nowadays, I always try to find things that will help me be more productive. It happens quite often that I want to select a complete xaml tag. It’s way too much effort to use the mouse to select it, so I often use the control-m-m shortcut to collapse a tag and then select it. However, a few days ago I took 5 minutes to automate this.

When you put your mouse somewhere in the Grid tag, and use my macro, you end up with this:

You can even put your mouse in the endtag. I bound it to Control-Q and it has made my life that much better!

The macro is as simple as this:

    Sub SelectXMLTagContents()

        DTE.ActiveDocument.Selection.StartOfLine(VsStartOfLineOptions.VsStartOfLineOptionsFirstColumn)

        DTE.ExecuteCommand("Edit.ToggleOutliningExpansion")

        DTE.ActiveDocument.Selection.StartOfLine(VsStartOfLineOptions.VsStartOfLineOptionsFirstColumn)

        DTE.ActiveDocument.Selection.EndOfLine(True)

        DTE.ExecuteCommand("Edit.ToggleOutliningExpansion")

    End Sub

It collapses a tag, jumps to the first column, selects the line and then does an uncollapse.

For those using a tool like Karl’s ‘Xaml Power Toys’, it might also be a worthwile addition to their shortcuts.

I’ll slowly try to start blogging again :)  It’s been extremely hectic, and I am slowly ramping up. Lately I’ve not been blogging or been just scribbling non-technical jibberish here. Let’s get back on the train!

Loading assemblies in Silverlight can be a bit hard because everything is packaged up in a Xap file. If you want to get to all the assemblies and start instantiating types, you’ll quickly run into a wall.

However, Windows is about living without walls, and thus there is a workaround! :)

It appears there is a very nice class available: Deployment. It is a list of the deployment section of your App.Manifest. The manifest describes all the ‘DeploymentParts’ in the Xap file. It thus also describes the filenames of the dll’s that are included.

If you know the dll name, that is great, and you can easily load it; skip to line 4.
In my case, I just had the assembly name (which does not mean I have the dll name) and on line 2 you can see me running through the parts that are available to me. The x:Name in the deployment file is the name of my assembly, so I get to it by using the DependencyProperty system: querying for the FrameworkElement.NameProperty.

Once I have an assembly part, I have the actual filename: part.Source. So, on line 4, I can now setup a stream to it, and on line 5 I can easily load my assembly.

From this point on, I can do everything you would expect.

Happy sailing!

I’m kind of a tool freak, and when mouse gestures were added in some browsers, I really felt they added value.
I was interested in using gestures in more applications (like Visual Studio) and found the tool ‘StrokeIt’. It is a great tool, fast, accurate, highly configurable and when I introduce it to team members they tend to giggle. So that’s all cool.

However, it does not work well with UAC and X64, much to the dismay of many users on the strokeIt forums. The tool hasn’t been updated since 2005, so that does not bode well.

Now I have found gMote and it is everything I could ever ask for (well, except for a more fun name).
It works very well and has a very nice workflow for defining gestures and assigning tasks for it. I already setup gestures for navigating tabs, paging up and down, minimizing windows and closing tabs/windows.

One tip: I used to use the right mouse button to draw gestures, but that seems to work less reliable. Instead, I now use the middle mouse button.

Go and download gMote now! I couldn’t be happier.

I installed IE8 beta 2 yesterday and it rocks. It is much faster than IE7, seems rock stable (fingers crossed) and has all kind of nifty new features. It has taken away my need for Firefox at the moment.

In FF I had a button that allowed me to subscribe to a blog in google reader and it works in Internet explorer as well:

javascript:var%20b=document.body;var%20GR________bookmarklet_domain='http://www.google.com';if(b&&!document.xmlVersion){void(z=document.createElement('script'));void(z.src='http://www.google.com/reader/ui/subscribe-bookmarklet.js');void(b.appendChild(z));}else{location='http://www.google.com/reader/view/feed/'+encodeURIComponent(location.href)}

Basically, you can navigate to a page with a blog in it and just press this bookmark. It will open up reader and it will show you the feed it finds.

But, given those cool accelerators in IE8, I thought it would be a nice exercise to create an accelerator that I can click when I am on a blog.
Here it is:

<?xml version="1.0" encoding="UTF-8"?>

<os:openServiceDescription

    xmlns:os="http://www.microsoft.com/schemas/openservicedescription/1.0">

    <os:homepageUrl>http://www.google.com</os:homepageUrl>

    <os:display>

        <os:name>Subscribe to rss feed </os:name>

        <os:description>View the feed in google reader</os:description>

    </os:display>

    <os:activity category="Blog">

        <os:activityAction context="document">

            <os:execute action="http://www.google.com/reader/view/feed/{documentUrl}" method="get">

            </os:execute>

        </os:activityAction>

    </os:activity>

</os:openServiceDescription>  

Since the accelerator api will not recognize an url like this: http://www.sitechno.com/Blog/SyndicationService.asmx/GetRss as a ‘Link’, I had to use the document context. When you install this accelerator, you can navigate to the actual feed and then rightclick anywhere in the page. There should be an option to ‘subscribe to rss feed’ and hitting that will take you to google.

These accelerators have potential: it was very simple to write this and it is well integrated into IE. I hope they extend it so we can get accelerators to work on more ‘stuff’!

Install googlereader subscription accelerator

[intended public is not the silverlight guru’s, but rather my friends and others that do not understand the coming of a new web :) ]

As I am preparing for our adventure in Canada, I’m meeting up with loads of old friends to have ‘one last beer’. That always seems to take place in my local Irish Pub, where I have spent way too many nights drinking their lovely Irish Red beer. I prefer it to Guinness, although it was quite nice to visit the Guinness factory in Dublin…

But I digress.

The discussion of the evening always, at some point in time, touches on Silverlight and how I think the web will change because of it. It’s quite a good feeling for me to see that I get all jazzed up talking about it :)
The current reigning web technology is obviously html. It has been king ever since the first webbrowser was introduced and for good reason. It is multi-platform, fast, easy to deploy and well-understood. Most importantly, it is stateless.

However, it can not compete against a desktop application when judged on UI richness and interactivity. Now, I am not talking about a simple mail-client or an rss-reader, but I’m talking about a big client application where quite a bit of information is processed. Is a stateless architecture appropriate for such an application?
No, it is not.

To be more exact: a large part of the application would be best to run on the client, where it can cache data and do processing. That application could (should) still talk to a back-end in a stateless manner.

The html-world has been working hard to ‘fake’ interactivity and has done so remarkably well. However, they will always be fighting against a technology which just wasn’t created to support the scenario’s they are trying to accomplish.

With the introduction of AIR, Flex and Silverlight 2, the kind of scenario’s I am envisioning are becoming a real possibility. It is now possible to create an application that is as rich as a desktop application, without all the hassle of deployment.
But, and this is what amazes me most, many of my friends don’t ‘get’ it. Ouch!! They fail to see how a RIA could do much better than a html based application. It is curious to me how we now all have a powerful desktop computer, and are still using it as a terminal. And even liking it!!

There are things html is perfect for: bringing text and even images in a nice layout. But that’s about it. Asp.Net, Ruby, Php and the lot, are all trying to add programmability to html. Since that is not what html is designed for, they have to process on the server. This model is slow and wasteful.

The only way it seems to really show people how a different web could look like, take a look at the work of thirteen23. Here they show a few different designs of how facebook could look like. It only shows off some nice visuals, so take a look at the incredible photosynth application.
My all time favorite in showing people what the world could look like is still the microsoft health patient journey demonstrator. If that doesn’t make it ‘click’ for you, check out another demo of woodgrove financial or a different way of browsing amazon.

The next few months or years, html will still be king. But it is inevitable that the web will transition towards the richness the new technologies are able to offer. I’m looking forward to seeing that happen and I hope that the current batch of html/ruby/asp.net/jscript/whatever developers are not missing out on the incredible opportunities it presents.

I follow blogs about SL with quite some interest and found this site: http://riastats.com/ . It basically tracks browsers to see if Flash and Silverlight is installed. You can clearly see that SL has a long way to go, but I was still amazed to see that SL had almost 25% share already.

Looking at the line graph, you can see that in the last week, SL 2 market share has grown extremely rapidly. That makes this post by John Dowdell (from Adobe) outdated, since he was only seeing a 2% share at the moment of writing. The mere fact that he uses these numbers, lend some kind of credibility.

I’m very interested in seeing the statistics from some other sites. Keep in mind that riastats base these numbers on only 18,600 unique browsers and do not disclose which sites are used (for all we know, they are Silverlight blogs :) ).
When numbers seem too good to be true, they usually are.

In any case though, I will keep my eye on the statistics the next few weeks!

ps. if you know of other statistics sites that show SL reach, leave a comment.