Come Get Some...Thoughts On Software Technology

IE 9 pinned mode and else demo page

Alex Strauss — Fri, 04 Mar 2011 11:53:56 GMT

Short revival of my blog with sharing a site I created to play a bit with the new taskbar features of Internet Explorer 9. After I realized that the site actually shows a good overview of most of the features described on the MSDN pinned site documentation with working samples I thought this might also be of interest to some other people. In addition it shows a bit about geo location (Thanks to Dariusz for his sample) and the new performance/navigation timing api which is currently being specified by a newly formed W3C Working Group.

Please remember however that most of the buttons only do what they are supposed to do when the site is actually in site mode (but you get informed about that anyway).

So have fun with it! http://www.level70.de/ie9demos/IE9Demos.html

The site was created by using the brand new web development tool from Microsoft called Web Matrix.

Do Enterprises Need An Independent Browser Strategy?

Alex Strauss — Tue, 25 May 2010 06:57:59 GMT

Microsoft Australia is currently driving a campaign where using Internet Explorer 6 is compared to drinking 9 year old milk. The by far biggest share of IE6 still used is in large enterprises. There are certainly many reasons why this is the case but in my opinion most of those reasons in one or another way are a direct result of specific circumstance which is

That Enterprises as well as small and medium businesses for the largest part do not have a browser strategy.

At least none that is independent from their client OS strategy. And the reason why most companies do not have an independent strategy is because Internet Explorer was shipped with Windows since Windows 98 with Internet Explorer 4 which is more than 12 years ago which again is centuries in IT terms. In addition, the importance of the browser as a productivity tool increased during those years with exponential rise over the last 5 or 6 years. Because of those circumstances many companies probably didn’t feel the urge to implement such an independent strategy. But because of not treating the browser as an independent part of the operating system most companies are still relying on Internet Explorer 6 which is already nine years old. In those 9 years however there were three different evolutionary streams. The first to name is the trend to implement more and more business applications as web applications which led to a huge amount of web applications within companies. And those were often optimized for the currently used browser (IE6). The second stream was the evolution of web technologies and web standards. The third stream was the growing number of attacks through web sites and also the growing numbers of attacking techniques including social engineering attacks. All three streams were heavily influenced and driven by the growing popularity and the rise of the web. So if you take this into account you could say that with the increase of the duration of usage of a specific browser version the ability to adapt and migrate decreases. This correlation is shown in the diagram below.

Critics now may say that this is all the fault of Microsoft because Microsoft is shipping IE together with Windows and Microsoft shipped IE6 flawed and forced the creation of web applications that introduced dependencies to those flaws. However those are reasons to from owns own complacency and indifference about treating the browser as an important productivity tool which needs to be treated like other mission critical applications or technologies in an enterprise. If Companies would have spent the browser the attention it deserved then there would have been plenty of opportunity to avoid the current situation because even Microsoft released two new browser versions which introduced great improvements in many browser relevant areas like security, standards, productivity features and performance compared to IE6. Those were released as stand-alone installers as well as part of Windows Vista or Windows 7. My theory is that they were simply neglected by enterprises because of a lacking independent browser strategy and omission. Although it seems like it I don’t want to scare anyone here because to be honest I think that the picture one my draw from the above would be way to negative because the ability to migrate will never be impossible and the efforts related to migration may be less than one would expect. I will elaborate about what I mean by that further down in this post.

Bottom line however is that the trends outlined above are some indicators that the browser is one of the most important tools in today's enterprise application landscape. This is not only my personal opinion but is also expressed by many respectable institutions and individuals. Forrester analyst Sheri McLeish for example said:

“Enterprises need to think about the browser as a productivity tool, not as a transparent application. They need to look at browsers more strategically.”

Another example is a citation of Andy Armagost, Birmingham Gas & Oil who said:

“The browser is one of the most important pieces of software we have right now”

And last but not least with ongoing increase of web applications, web services and especially now slowly starting move to cloud based services, the browser may become the single most important piece of software in the future. Which is a hypothesis that is also backed by Sheri McLeish:

“That IE6 is by far the most widely used browser among enterprises reflects most IT departments’ lack of interest in browsers. However, this laissez-faire approach toward browsers wouldn’t last long, he said. “The rise of software-as-a-service [SaaS] will force enterprises to at least come up with a browser strategy for their workforce”

With that all said it becomes obvious that - the time to act is now – it is time to do essentially two things:

Start realizing the importance of the browser for the own company and define a independent strategy for it
Start migrating to a current version of preferably Internet Explorer as it is still the best choice for deployment in corporate environments

I did not number these two tasks on purpose as they are probably almost equally important and because it is recommended to start doing both in parallel. As for the migration part still many companies, even those that may already have some kind of browser strategy discussion, are still in fear about the efforts and try to avoid the migration part. So I will try to give some, hopefully helpful, information on how one can get started, what else, apart from the above are the benefits of migration and about some determining factors relevant in the migration context.

Compatibility

I will not reiterate what has been said many times about compatibility and its various facets with respect to Internet Explorer 8. Although it is super important there are enough sources, including this blog, where you can find information about it. As a starting point you can go to my respective article or the compatibility center on MSDN. Here however I want to point out that there are different kinds of compatibility of which some are important to reflect about when planning a migration process and its accompanying decisions and some that may be less or maybe even useless when deciding about what’s important to solve one’s personal or corporate compatibility question:
1. Backward Compatibility or “Stand in for your heritage”
  
  Especially with an Internet Explorer focus I would define backwards compatibility as “Enabling correct functional execution and visualization of web applications created for previous versions of Internet Explorer and web standards”. Especially because of the fact that most companies are still sitting on back level browsers this is extremely important. And because this is so important Internet Explorer in particular lives up to the promise to provide a great deal of backwards compatibility by shipping with two rendering engines and compatibility modes. While probably still not the 100% solution to the compatibility questions it is a great relief for companies preparing for migration as this reliefs them from really touching applications and make real changes to the application assets (markup, styles and code)
2. Forward Compatibility
  
  I would define forward compatibility as “The Support of evolution of the web by endorsing and supporting current and upcoming specifications and actively participate in the definition of those standards”. Now this one is a bit tricky as we all don’t own a crystal orb to look trough into the future. However alone by the statements and the involved actions one can get at least some ideas about how friction free and smooth future migrations will become. Supportive for a positive perception with respect to forward compatibility I would count active participating in the standardization bodies, recommending new standards, early adoption of not yet settled standards, providing guidance on usage of standards, etc.
3. Artificial Compatibility
  
  Artificial compatibility or a compatibility that has been created and made popular as an benchmark thus creating a de-facto requirement of passing taking the benchmark in order to gain a positive perception. The problem with such an compatibility understanding is that they sometimes are not very helpful in or simply useless when taking the compatibility debate. One good example is the current ACID 3 test. There are many people out there thinking that the browser passing the test to 100% is the most standards compliant browser but this is not really the case as it only tests a subset of standards and it tests it upon the author’s interpretation of the specifications. And that there is much room for interpretation shows a simple example made by Ian Hickson, who is one of the editors of the HTML 5 specs at the W3C and maintainer of the Acid 3 test suite.
  
  “HTML 4 has an input element, which has a type="" attribute, which takes values like "text" and "checkbox." What should happen when you have an HTML input element with type="text" in a document is reasonably well defined: You display a text field.
  What should happen with input type="checkbox" is relatively well defined. However, with script, you can take the type="text" attribute, and change its value dynamically, while the user is editing the control, so that it is type="checkbox." This is not a common thing to do, and the HTML 4 and DOM2 HTML specs are completely silent on what should happen when this case is hit.
  
  The result is that different browsers do different things; IE will throw an exception, if I recall correctly, while Firefox will change the text field to a checkbox”
  
  There are other indications and statements that are quite a bit reserved to pay to much attention to those tests which I will spare here. For those interested just check out this or that. To sum it up I want to point out that I don’t say that tests such as Acid 3 are generally a bad thing but I think that just striving for the goal to pass a certain test and even optimize a product just to hit that target is a non goal and doesn’t help the web community in deciding which are the real important attributes are to solve the compatibility questions.
Some common misconceptions
1. Micro-Benchmark results are the key criteria to make browser choice decisions
  
  Micro-Benchmarks are without a doubt very popular at the moment. Especially those measuring JavaScript performance like the V8 Benchmark, Sunspider, Dromaeo or Peacekeeper are extremely popular nowadays. The only problem with them is that they are measuring only one tiny aspect of the whole browsing experience and therefore may be not sufficient to make an impartial browser decision. An attitude by the way that I’m not alone with. Jim Rapoza, Chief Technology Analyst at eWeek for example said:
  “Face it, right now all browsers are more than fast enough. And if you're running into slow performance on the Web, you should probably check about 100 other things (ISP performance, site problems, etc.) before you start wondering about browser speed.
  So why is every single browser maker spending so much time and resources trying to gain the mantle of fastest Web browser? I think it's because performance is the only non-subjective criteria that they can hang their hat on”
  
  Don’t get me wrong, Micro-Benchmark are important and give a good insight about the current state of a browsers script or rendering engines especially with more and more applications making heavy use of JavaScript however they shouldn’t be the only criteria to base one’s browser decisions on. I mean even we at Microsoft now are riding this horse with the latest announcements about the rework of the JavaScript engine in Internet Explorer IE9 and the performance shown already in the current technology previews of IE9. But still there is the belief that there is a superset of of criteria that need to be taken into account when thinking about browsers and the usage of web applications.
2. Specifications leave no room for interpretations
  
  I already gave an example about this further up in the compatibility section so here’s some more about that. A international standardization process is a complex beast. There are many parties involved (which is basically a good thing) but the more parties the more opinions and discussions. This is the reason that it takes a long time before standards are finally released and their specifications are complete and signed-off. So sometimes you need to rely and base your work (e.g. a browser) on unfinished specifications which may be unclear in certain aspects or may change over time. Think about CSS. There is still no final specification for CSS 2.1 available. And probably not only because of this Derek Featherstone, Group Lead Web Standards Project comes to the conclusion that:
  
  ”We don't even have a perfect implementation of CSS 2.1 yet”
  
  So its easy to say that one or the other browser is not implementing the specs correctly but with some insight it becomes obvious that there is not the one correct way and it is difficult for a browser provider to hit a moving target (unsettled specs).
3. Browser migration is different from other application migrations
  
  To be honest I have no real clue about were this misconception comes from but I know it is all around. In many cases I hear or feel a lack of comprehension about browser migration and the related efforts to assess the applications if they are still working as designed. However I think this is something that is quite common in today’s IT environments. Think about migrations of JDK’s, Application Server upgrades or Windows Client upgrades not to speak of upgrade of a large SAP installation. Those don’t come without migration efforts either and they are huge in many cases. Of course IT responsible complain about those efforts as well but there still is an acceptance or an understanding that this is something that needs to be done. In the context of browser there is a total lack of such an acceptance and often this then leads to not migrating at all up to the time where there is no other chance anymore. However not only the efforts necessary will increase over time as I already pointed out but also those company will miss some great opportunity as we will see in the next section.
Application classification

Let’s get a away from the philosophic and sometimes religious questions and get a bit more practical. If you plan a migration you are probably think about the right process or which are the right tasks. One important task within the process is to do some kind of application classification. As this also can give great insight into what the overall migration efforts actually will be it should happen very early in the process. Of course there are many different ways to classify applications and there may also be quite some company specific, internal classification factors. Nevertheless I will try to give a generic views on how to classify and estimate the efforts. Base for this classification is the source of the application or in other words the producer and how much it has been customized. As seen in the following figure the complexity and efforts of a migration increases with the customization level in combination with the sources moving from internal to external.

Important to note is that this not only considers technical factors but also includes organizational and feasibility factors. For example an application from an external source may be harder to migrate because the VAR/VAP or ISV may not even exist anymore. This is especially important for application including binary components such as ActiveX controls. On the other hand if a web application is based on an ISV product that has not been customized the effort may be near to nothing because the ISV already has official support for current browsers.
After doing this classification there is then the chance to prioritize which applications to migrate first and which can be eliminated completely. So a quadrant model for this prioritization could look like the one I depict in the following figure.

The most important take away from this in my opinion is that you shouldn’t look at browser migration in the context of cost only but also in the context of opportunity to create a comprehensive web application inventory which many enterprises still lack today, streamline the web application landscape and increase value and productivity through innovation by using new features and standards not available or supported with older browsers.
Migration Guidance & generic process

So now I can get to the final guidance and outline a generic process for a browser migration. As it is quite generic and of course doesn’t touch any specifics of a certain vertical or even individual enterprise it looks quite simple but yet it is a good starting point to refine it and adapt it to the individual company.

A lot of text now simply to explain why I think that companies should

treat the browser as a mission critical application
define an independent strategy for it
realize that its time to migrate to a current browser
start migrating to Internet Explorer 8 today as it is probably still the best choice for enterprise IT-Environments because of its
- Standards compliance
- Compatibility features
- Deployment options (IEAK, Slipstreaming, WSUS, AD, SCCM)
- Group Policy customizability
- Unique security features (protected mode, domain model, etc.)

So hopefully I created some awareness and the thoughts I tried to express about this, certainly very complex, topic was understandable, a bit helpful and created a sense of urgency to ACT NOW then I reached my goal for this post. And finally the answer to the question if enterprises need an independent browser strategy is definitely “YES”.

As always feel free to comment and start a discussion.

A Few IE8 Tips for Developers And IT-Professionals

Alex Strauss — Tue, 25 May 2010 06:55:53 GMT

Use the WebSlice title for dynamic user related content

The only information of a WebSlice that is visible while normal usage of the browser is the caption of the button in the favorites pane. This caption is provided by an HTML portion which is annotated with the keyword entry-title in the WebSlice's update source. So this is a valuable piece of information present all time in the Internet Explorer Chrome. So it is recommended to use it more wisely than to only display static text. So rather update the title with meaningful information. One good example could be to display the current points balance of a loyalty program.

Simply add a dynamic <span>-Element which may even be hidden to a personalized web page template, mark this dynamic piece as the entry-title and your done. It doesn’t matter if this is the main webpage of the respective provider or a specially created one as alternative display source for the web slice. Whenever the account balance changes this data is then automatically promoted into this page dynamically. With the next update check of IE the current balance is then shown in the caption of the WebSlice button in bold letters.

WebSlice Tracking

Usage tracking of WebSlices is actually quite easy however there is a thing to remember. Internet Explorer checks for new WebSlice content in certain intervals. This interval is either defined by the WebSlice provider in the WebSlice content using the ttl-property or the user trough the WebSlice properties dialog or it defaults to 24 hours. Now when this interval passes the Internet Explorer 8 sends a request to the update source of the WebSlice through the Windows RSS Platform subsystem. This means that in the case of update checks for WebSlices is not Internet Explorer and thus also the user-agent string differs from the one for regular IE website requests. The user-agent string for those requests is:

User-Agent: Windows-RSS-Platform/2.0 (MSIE 8.0; Windows NT 6.1)

So you could use this user-agent string for tracking WebSlice usage however you need to know that simply checking for updates doesn’t imply really that the content is also recognized by the user. If you want to have real usage tracking you probably should use the commonly used website tracking scripts or tracking pixels methods and integrate them into the entry-content portion of your WebSlice and in addition if you have the possibility to alter the Headers of your HTTP-Response you should disable client side caching. If you implement it like that and know the update frequency you can easily calculate the real usage of the slice.

All Requests – Update checks in analyzing timeframe = Real usage/Real WebSlice impressions

Even better would be to include all that in an alternative display source. This will give you the right usage numbers instantly as the display source is not requested when Internet Explorer checks for updated content. So this alternative content is only requested (and this time by IE with the original IE8 user-agent string) when the user clicks on the WebSlice button and opens the fly out.

Text fields in Accelerator Previews and WebSlice display sources

As you may already know you can use an accelerator preview window and and WebSlice fly out to display rich and/or interactive content. So you can for example use Silverlight based applications to deliver great user experiences through those IE features and increase value and stickiness of your content. There is however at least one area where the WebSlice fly out behaves differently from the accelerator preview window and this is the use of text fields or textboxes. While you can use those as usual in WebSlices you shouldn’t in accelerator previews as the keyboard inputs are captured by the context menu where you chose the accelerator from and are not forwarded to the accelerator preview and thus the user is unable to type text into the text field. This behavior is technology agnostic and will occur in plain HTML as well as in Silverlight or Flash applications. So it needs a little bit of intelligent information design for accelerators to allow a user to provide feedback via meaningful and clickable elements (e.g. instead of letting the user type a location let him choose from a list or make some guesses based on the present context).

Identifying IE8 when compatibility mode is active

It is already commonly known that Internet Explorer 8 ships with two rendering engines and allows website owners and users to enable a compatibility mode. So Internet Explorer 8 can be forced to behave like an Internet Explorer 7 by switching to the IE7 browser mode. As this needs to be a complete back level switch IE8 then also identifies as IE7 in its user-agent string. This is also true for querying the Window.navigator.appName, Window.navigator.appVersion and Window.navigator.userAgent properties using JavaScript. So if you rely on correctly identifying IE8 although the browser is currently operating in compatibility mode (for example you want to offer a customized IE8 download to users using older browsers) you need to change your identifying code a little bit and query the Document.documentMode Property which is only available in Internet Explorer 8 (and probably in IE9). This will report the current document mode the browser is currently operating in if the user uses Internet Explorer 8 and is also available when the browser is in a back level browser mode.

If the user however really uses a older version of IE or no IE at all the property is not available and the browser should return a “undefined” as result of your query for this object and you can handle the result accordingly.

Application Partitioning with MEF, Silverlight and Windows Azure – Part II

Alex Strauss — Wed, 28 Apr 2010 11:44:00 GMT

Welcome back to the partitioned blog post about application partitioning with Silverlight MEF and Windows Azure. In this second and last post I will talk about how you can retrieve the information about the deployed parts of the application and retrieve the actual XAP files from the Azure Blob Storage.

Still we only have one Silverlight project where we added just one interface as the contract for the import and lazy initialization and an attribute class to flag our parts in the Silverlight projects to come as user controls to be exported as parts of the application meeting the specified contract.

Now we can extend the class corresponding to our shell to handle the imports of those attributed parts. This is also straight forward and follows the standard MEF procedures.

First thing to do would be to define a property attributed with the ImportMany attribute to tell MEF that it should populate this property with all (not just one) exports meeting the requirements of the importing application. This requirement is actually the contract I were talking about before.

[ImportMany(AllowRecomposition = true)]

public IEnumerable<Lazy<UserControl, IPartAttributes>> Parts { get; set; }

Important to note is the AllowRecomposition property for the ImportMany attribute which tells CompositionContainer to repopulate (recompose) when exports change. Now that we have this we still need to tell MEF to actually populate this property and this is as easy as calling the SatisfyImports method on the of CompositionInitializer class. For real world projects you should however be aware of the limitations of CompositionInitializer.

public partial class MainPage : UserControl, IPartImportsSatisfiedNotification

    public MainPage()

        InitializeComponent();

        CompositionInitializer.SatisfyImports(this);

In order to recognize when all imports have been finished (or satisfied) the class also implements an interface which lets MEF automatically call the OnImportsSatisfied method when recomposition occurs. As a side note it would make sense to follow implement the Model View ViewModel pattern for this application as well then you would factor out this code into a ViewModel class and mark that exportable and then again import it as a part into the main applications shell class printed above. How this can be done is described in a blog post by Glen Block. Continuing with this sample however there is one last thing to do which is to filter and add the UserControls imported by MEF to the items collections of the respective ItemsControl. That involves two steps actually:

Clear the items collections of the ItemsControls
Filter and add the new imports

Here’s the simplistic implementation for the shell areas in this sample application.

public void OnImportsSatisfied()

    ClearShellItemControls();

    PopulateShellAreas();

private void PopulateShellAreas()

    var headerParts = Parts.Where(p => p.Metadata.IsHeaderPart == true).Select(p => p.Value);

    foreach (var hPart in headerParts)

        header.Items.Add(hPart);

    var leftnavParts = Parts.Where(p => p.Metadata.IsLeftNavPart == true).Select(p => p.Value);

    foreach (var lnPart in leftnavParts)

        leftnav.Items.Add(lnPart);

    var workbenchParts = Parts.Where(p => p.Metadata.IsWorkbenchPart == true).Select(p => p.Value);

    foreach (var wbPart in workbenchParts)

        workbench.Items.Add(wbPart);

    var footerParts = Parts.Where(p => p.Metadata.IsFooterPart == true).Select(p => p.Value);

    foreach (var fPart in footerParts)

        footer.Items.Add(fPart);

private void ClearShellItemControls()

    header.Items.Clear();

    leftnav.Items.Clear();

    workbench.Items.Clear();

    footer.Items.Clear();

Next thing to do now is the handle the means on how the application gets to know which XAPs to retrieve in order to import the parts into the container. As already pointed out we need to keep the information about which XAP files belong to the application and their storing location outside of the original Windows Azure deployment package (.cspkg). Because if we would keep it internally we would need to redeploy the package whenever the list of XAP files changes which is something what we don’t want to do.

It would of course be possible to put this information into the configuration file of the cloud service which is exposed through the Windows Azure management portal or the Management API. However this is does only really help for the task of changing the information about the application parts easily. It does however introduce some difficulties in retrieving those values from the Silverlight client which does not have any direct means to get to the configuration settings of the service. So we would need this information through some mechanics embedded into the hosting ASP.Net page or surface it through an respective web service. For simplicity I tool another approach and put a simple XML file also into the blob storage which I then can retrieve easily from my Silverlight application and I can also easily change and redeploy it by simply downloading, changing and uploading it again using my preferred tools. The file itself was already shown in the previous post of this series so now I will focus on how to retrieve it which is absolutely straight forward by using a standard Silverlight WebClient class in the Application_Startup method of the main application to get the file.

private void Application_Startup(object sender, StartupEventArgs e)

    WebClient wClient = new WebClient();

    wClient.DownloadStringCompleted += new DownloadStringCompletedEventHandler(wClient_DownloadStringCompleted);

    wClient.DownloadStringAsync(new Uri("http://<storageaccount>.blob.core.windows.net/mefparts/DeploymentCatalog.xml"));

    CompositionHost.Initialize(new DeploymentCatalog(), catalogs);

    this.RootVisual = new MainPage();

Then we can parse the file and for each part start an asynchronous download of the XAP files into an AggregateCatalog which is the type of the catalogs object in the code below.

void wClient_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)

    if (e.Error == null)

        string deploymentCatalogDefinition = e.Result;

        XDocument doc = XDocument.Parse(deploymentCatalogDefinition);

        var v = doc.Descendants("PartFile");

        foreach (XElement xe in v)

            catalogs.Catalogs.Add(CreateCatalog(xe.Attribute("name").Value));

private DeploymentCatalog CreateCatalog(string partName)

    Uri uri = new Uri("http://<storageaccount>.blob.core.windows.net/" + partName);

    var catalog = new DeploymentCatalog(uri);

    catalog.DownloadCompleted += new EventHandler<System.ComponentModel.AsyncCompletedEventArgs>(catalog_DownloadCompleted);

    catalog.DownloadAsync();

    return catalog;

For this to work however there is one prerequisite to be met on the blob storage side and this is to allow public access for retrieving blobs from the container holding the XAP files and the DeploymentCatalog.xml file. This can of course be done with one of the various tools for managing the Azure Storage Service or if you created the container using the StorageClient class library you can create the container and set the permissions respectively. This also gives you two other advantages which are:

The Silverlight application does not need to carry the shared key of your storage account to retrieve blobs which would impose a security risk
You do not need to create REST calls to the storage service including the authorization and other headers as there is no StorageClient library available for Silverlight

This completes main application and it’s now time to create the parts that comprise the meat of the current applications. For this sample there is actually not much more to do than:

To add another Silverlight project to the solution. It is recommended to make sure that you uncheck the option to host the Silverlight application in the existing web project. It actually does no harm if it is added however it bloats the cloud service package with the XAPs which are not needed there.

Create the UI for the part

<Border x:Name="LayoutRoot" Background="LightBlue" Height="50" VerticalAlignment="Top">

    <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="Footer" FontSize="16" FontWeight="Bold" />

</Border>

And then add the MetadataAttribute and the contract interface to the project like it was done in the main application

Mark the UserControl exportable using the MetadataAttribute just added to the project

[ExportPart(IsFooterPart=true)]

public partial class MainPage : UserControl

    public MainPage()

        InitializeComponent();

This is then usually repeated for all other parts of the application until all areas have a populating part located in an external XAP. For this sample the complete Solution structure looks lie this.

The main project (here “DynamicCloudRIA”) is deployed via the WebRole project (here “DynMefWebRole1”) as a standard cloud solution project and the XAPs of the other Silverlight projects can be uploaded to the respective container in the Windows Azure Blob Storage. For this sample the container contents look like shown below.

After this has been done the application should already run and show the shell and the dynamically loaded application parts. Hopefully this helps to understand how MEF can help to create partitioned applications with loosely coupled application parts even when the application and its parts is deployed on a cloud platform such as Windows Azure. The source code for the sample is attached for download below.

Application Partitioning with MEF, Silverlight and Windows Azure – Part I

Alex Strauss — Tue, 27 Apr 2010 18:31:56 GMT

The Managed Extensibility Framework (MEF) supports you in creating loosely coupled and partitioned applications. To embrace those paradigms makes sense for many reasons. Some of the various benefits are:

Share work across multiple developers or development team and have a well defined boundaries for the work items of the teams based on MEF components
Dynamic extension or updates of application parts or components without a complete redeployment and long downtimes

MEF has been around in the .Net Framework for quite some time and since the current release of Silverlight 4 it is also available for use in Silverlight applications.

Especially for the use in Silverlight and to introduce application partitioning on with having application XAP files as physical component boundaries it was necessary to alter the capabilities of the DirectoryCatalog class as now the the application parts are not sitting in a local file system directory as assemblies but as XAP archives on a remote web server.

Therefore the DirectoryCatalog was replaced by the DeploymentCatalog in Silverlight. However as far as I understand this comes with one shortcoming which is that you need to specify an direct URL to the XAP files that you want to include into your application. As long as you do not externalize a component that provides those URLs you won not much in terms of loose coupling. But if you do externalize the URL “injection” you have all possibilities MEF offers with respect to dynamically compose applications. Even more you then also have better possibilities to use Windows Azure as the hosting environment for your Silverlight Application. In this Blog post I will demonstrate how this can work in an easy example.

The sample application is partitioned based on UI components to make the concept as obvious as possible. First the main application simply defines some UI areas with an ItemsControl as placeholder for the actual partial UI coming from the external XAPs. So you can more or less say that we define a shell and content modules. From the UI point of view this feels quite a bit like the Composite Application Library (CAL) for Silverlight however the CAL still goes a little bit beyond what we want to accomplish here. The overall application structure looks like the following.

First thing to mention is that we have actually two locations were application parts are stored and served from. As this might seem a bit odd it is however necessary due to the nature of how application packages are deployed on Windows Azure and due to the fact that you do not have direct access to the directories of the web server and the websites. So in order to be able to deploy and provide application parts after the initial deployment we need a place where we put the extending XAP files and were the main application can pick it up. In our case the XAPs are provided through the Windows Azure Blob Storage. This comes in handy as you can use your own or some third party tools to put your XAPs and the related artifacts into the Windows Azure storage.

There is however one thing to be aware of which is that now with having two different locations the cross domain restrictions of Silverlight will intercept and prevent Silverlight or to be more precise MEF from downloading the extending XAPs from blob storage.

Therefore we need to deploy a Silverlight policy file on the target server which in our case is the root of our blob storage account. The file needs to be named ClientAccess.xml. An excellent example how to deploy such kind of file can be found in this blog post by Steve Marx.

What you also need is some kind of external artifact to the application that tells the main application where and which XAPs to download and integrate as parts into the application. In my case I chose to define that in a simple XML file

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

<Deployment>

    <Catalog>

        <PartFile name="mefparts/DynamicCloudRIA.Header.xap" />

        <PartFile name="mefparts/DynamicCloudRIA.LeftNav.xap" />

        <PartFile name="mefparts/DynamicCloudRIA.Workbench.xap" />

        <PartFile name="mefparts/DynamicCloudRIA.Footer.xap" />

    </Catalog>

</Deployment>

So now that I have this prerequisites I can start creating the main application and the application parts. The following screenshot shows the result of this demonstration which is actually a very simple UI which is composed from 5 different XAP files. It is important to note that implementation of functionality does not matter for this sample but the structure and the coupling of the different UI parts through MEF.

To start off I created a new Cloud Project in Visual Studio 2010 with one WebRole and then added a Silverlight Project to the cloud solution which is referenced by the WebRole project. The main UI layout is defined in the main Silverlight application. In this sample a Grid is defined with three rows and two columns. Then a placeholder for each area is defined as an ItemsControl. The XAML for this simple main layout looks like this (I used a fixed size layout for simplicity):

<Grid x:Name="LayoutRoot" Background="White">

    <Grid.ColumnDefinitions>

        <ColumnDefinition Width="200" />

        <ColumnDefinition />

    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>

        <RowDefinition Height="50" />

        <RowDefinition />

        <RowDefinition Height="50" />

    </Grid.RowDefinitions>

    <ItemsControl x:Name="header" Grid.ColumnSpan="2" Grid.Row="0" />

    <ItemsControl x:Name="leftnav" Grid.ColumnSpan="1" Grid.Row="1" />

    <ItemsControl x:Name="workbench" Grid.ColumnSpan="1" Grid.Row="1" Grid.Column="1" />

    <ItemsControl x:Name="footer" Grid.ColumnSpan="2" Grid.Row="2" />

</Grid>

Next we have to implement some basic “infrastructure” for this sample in order to make it work. First is we have to define a MetadataAttribute in order to allow us to filter the UserControls inside the asynchronous downloaded XAPs for the area they want to attach to. To get to know more about that I recommend to watch the Silverlight TV Episode 5: Using Metadata with MEF. For my sample I added the following class to my main application project.

[MetadataAttribute]

[AttributeUsage(AttributeTargets.Class, AllowMultiple = false)]

public class ExportPart : ExportAttribute

    public ExportPart() : base(typeof(UserControl)) { }

    public bool IsHeaderPart { get; set; }

    public bool IsFooterPart { get; set; }

    public bool IsLeftNavPart { get; set; }

    public bool IsWorkbenchPart { get; set; }

As we want to access the metadata or better say filter for the metadata in a strongly typed fashion we need to define an interface with matching read only properties to those exposed in the MetadataAttribute. This allows us to import the application parts with such an ExportAttribute with lazy initialization using the Type System.Lazy<T, TMetadata>. This looks like the following in this sample:

public interface IPartAttributes

    bool IsHeaderPart { get; }

    bool IsFooterPart { get; }

    bool IsLeftNavPart { get; }

    bool IsWorkbenchPart { get; }

That’s it for the moment. In the next part I will discuss how to import parts handle the XAP retrieval and do the deployment. So stay tuned.

Tales About Working With The Azure Service Management API – Chapter III

Alex Strauss — Wed, 17 Feb 2010 10:29:00 GMT

After my last post I was a little bit dissatisfied with the fact that if you use the scripts frequently the blob storage container will fill up quite a bit. As already outlined this will affect the monthly charges billed to your account especially when you are deploying in a high frequency and have to deploy large packages. So I was looking for a solution to that.

So as we are already operating in a Windows Powershell environment I thought the best way to resolve this would be to provide a commandlet that does enable you to delete the deployment packages in the blob storage. So I created a small that of commandlets which enable you to interact with the Windows Azure blob storage based on the official StorageClient managed API. I packaged the commandlets into a SnapIn.

The available commandlets so far are:

Get-Storage	*This represents the base storage service with the elemental properties “SharedKey” and “StorageAccount” which are needed for almost every subsequent operation.*
*Get-Container*	*Lists the container currently available in the blob storage account. This commandlet is not needed for the task of removing the deployment packages.*
*Get-Bloblist*	This commandlet lists the blobs of a specific container and holds a property of “BlobList” which can be used as a piping parameter for the Remove-Blob commandlet. It allows for simple filtering based on extensions with the “ExtensionFilter” parameter. So for our task you could filter for the “cspkg” extension to target all deployment packages.
*Remove-Blob*	*This commandlet removes the blobs provided via the “BlobList” parameter or all blobs in the container if no list is provided. So be careful in using this commandlet.*

The code is attached to this blog post. I choose to provide it in a separate SnapIn package however you could also add it to the Windows Azure Service Management CmdLets project which is also provided as source code. If you use the package as is you need to install it once using the Installer Tool shipping with the .Net Framework. So you need to issue a command similar to this:

c:\Windows\Microsoft.NET\Framework\v2.0.50727\InstallUtil.exe AzureCommandletCollection.dll

After doing so you can check if the AzureCommandletCollectionSnapIn is listed as a registered SanpIn using the command

Get-PSSnapin –registered

The output should look something like this:

Then finally in order to use it you need to add the SnapIn to the snapin to the active powershell session. You need to do that no matter if you want to use the commandlets interactively or from script. Issue the to do so.

Add-PSSnapin AzureCommandletCollectionSnapIn

With respect to integrating the removal task to our scripts I have then altered my deployment script to get rid of the deployment package right after the deployment. So the list of blobs should usually always only consist of one entry.

The changes are minimal. There are only two changes. The first is the part where we need to add the SnapIn to the session:

if(!($mgmtsnapin = Get-PSSnapin AzureManagementToolsSnapIn -erroraction silentlycontinue))

    Write-Host "Adding ManagementTools SnapIn...please wait"

    Add-PSSnapin AzureManagementToolsSnapIn

    if(!($storagesnapin = Get-PSSnapin AzureCommandletCollectionSnapIn -erroraction silentlycontinue))

        Write-Host "Adding AzureCommandletCollection SnapIn...please wait"

        Add-PSSnapin AzureCommandletCollectionSnapIn

The second change is the the actual removal task:

$storagekeys = Get-StorageKeys -ServiceName $storageservicename -SubscriptionId $subscriptionid -Certificate $cert

Get-Storage -StorageAccount $storageservicename -SharedKey $storagekeys.Primary

| Get-Bloblist -ContainerName mydeployments -ExtensionFilter cspkg

| Remove-Blob

So then we can outline the final script which looks like the following:

<#    .Synopsis        Will deploy and start a Windows Azure Service    .Description        Will deploy and start a Windows Azure Service            .Parameter servicename        The name of the Azure service that will hold the deployment    .Parameter thumbprint        The thumbprint of a locally installed and valid certificate for accessing        the Windows Azure Management Service    .Parameter subscriptionid        The ID for the subscription of the Azure Account hosting the respective service    .Parameter slot        The deployment slot in which the package shall be deployed <Production | Staging>    .Parameter storageservicename        The storage account that can be used to upload the deployment package    .Parameter package        The full qualified path to the deployment package    .Parameter config        The full qualified path to the configuration file for this deployment    .Example        deployAzureService.ps1 -servicename "MyService" -thumbprint "5643060E8F0029FB8C6DB76AAE905C7FA697" -subscriptionid "00000000-0000-0000-0000-000000000000" -slot "Production" -storageservicename "StorageService" -package "C:\deployment\HelloWorld.cspkg" -config "C:\deployments\ServiceConfiguration.cscfg" -label "MyFirstDeployment"#> param([PARAMETER(Mandatory=$true)][string]$servicename, [PARAMETER(Mandatory=$true)][string]$thumbprint, [PARAMETER(Mandatory=$true)][string]$subscriptionid, [PARAMETER(Mandatory=$true)][string]$slot, [PARAMETER(Mandatory=$true)][string]$storageservicename, [PARAMETER(Mandatory=$true)][string]$package, [PARAMETER(Mandatory=$true)][string]$config, [PARAMETER(Mandatory=$true)][string]$label)if(!($mgmtsnapin = Get-PSSnapin AzureManagementToolsSnapIn -erroraction silentlycontinue)){    Write-Host "Adding ManagementTools SnapIn...please wait"    Add-PSSnapin AzureManagementToolsSnapIn    if(!($storagesnapin = Get-PSSnapin AzureCommandletCollectionSnapIn -erroraction silentlycontinue))    {        Write-Host "Adding AzureCommandletCollection SnapIn...please wait"        Add-PSSnapin AzureCommandletCollectionSnapIn    }}$cert = Get-Item cert:\CurrentUser\My\$thumbprint$service = Get-HostedService $servicename -Certificate $cert -SubscriptionId $subscriptionidif($service){    $deployment = Get-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert -erroraction silentlycontinue    $name = $deployment.Name    if(!$deployment.Name)    {        Write-Host "Creating new deployment...please wait"        New-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert -Package $package -Configuration $config -Label $label -StorageServiceName $storageservicename |        Get-OperationStatus -WaitToComplete                Write-Host "Starting the new deployment...please wait"        Get-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert |        Set-DeploymentStatus "Running" |        Get-OperationStatus -WaitToComplete        $storagekeys = Get-StorageKeys -ServiceName $storageservicename -SubscriptionId $subscriptionid -Certificate $cert        Get-Storage -StorageAccount $storageservicename -SharedKey $storagekeys.Primary | Get-Bloblist -ContainerName mydeployments -ExtensionFilter cspkg | Remove-Blob    } else    {        Write-Host "Service $servicename already has an active deployment with the name $name...please remove the active deployment first"    }} else{    Write-Host "No service found with the name $servicename"}

When running from the command line it should produce the following output:

Tales About Working With The Azure Service Management API – Chapter II

Alex Strauss — Mon, 15 Feb 2010 10:44:14 GMT

After I elaborated a bit on one of the base requirements to work with the Azure Service Management API at all which is enabling a valid certificate to authenticate your calls to the API I want today share some thoughts about how to automate tasks related with Azure deployments. As already pointed out in Chapter I you probably want to use Windows Powershell together with the Windows Azure Service Management CmdLets which will make your life in interacting with the Windows Azure Fabric from a shell environment much easier. The commandlets support most of the relevant tasks to do deployments and undeployments.

So in my example here I will show how those commandlets can be used in scripts to optimize the consumption of Windows Azure compute services. As you might know the compute service is billed based on service hours which basically means that as long as a service is deployed it will produce cost although the service may not be used at all during certain times. And as there may be quite some solutions where there are known time windows in which the service isn’t used (e.g. non busines hours) it may come in handy if there would be the possibility to undeploy and deploy the services based on their availability needs.

To have this work the only thing needed is two Windows Powershell scripts where on does the deployment and the other one the undeployment. The script for undeploying a service could look like the following:

     <#

        .Synopsis

            Will suspend and undeploy a Windows Azure Service

        .Description

            Will suspend and undeploy a Windows Azure Service        

        .Parameter servicename

            The name of the Azure service that holds the deployment

        .Parameter thumbprint

            The thumbprint of a locally installed and valid certificate for accessing

            the Windows Azure Management Service

        .Parameter subscriptionid

            The ID for the subscription of the Azure Account hosting the respective service

        .Parameter slot

            The deployment slot in which the package to be undeployed is physically situated

        .Example

            undeployAzureService.ps1 -thumbprint "5643060E8F0029FB8C6DB76AAE905C7FA697" -servicename "MyService" -subscriptionid "00000000-0000-0000-0000-000000000000" -slot "Production"

    #>

    param([PARAMETER(Mandatory=$true)][string]$servicename, [PARAMETER(Mandatory=$true)][string]$thumbprint, [PARAMETER(Mandatory=$true)][string]$subscriptionid, [PARAMETER(Mandatory=$true)][string]$slot)

    if(!($snapin = Get-PSSnapin AzureManagementToolsSnapIn -erroraction silentlycontinue))

    {

        Write-Host "Adding ManagementTools SnapIn...please wait"

        Add-PSSnapin AzureManagementToolsSnapIn

    }

    $cert = Get-Item cert:\CurrentUser\My\$thumbprint

    $service = Get-HostedService $servicename -Certificate $cert -SubscriptionId $subscriptionid

    if($service)

    {

        $deployment = Get-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert -erroraction silentlycontinue

        if($deployment.Name)

        {

            Write-Host "Suspending deployment...please wait"

            Get-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert |

            Set-DeploymentStatus 'Suspended' |

            Get-OperationStatus -WaitToComplete

            Write-Host "Removing deployment...please wait"

            Get-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert |

            Remove-Deployment |

            Get-OperationStatus -WaitToComplete

        } else

        {

            Write-Host "No deployment found for the service named $servicename"

        }

    } else

    {

        Write-Host "No service found with the name $servicename"

    }

After creating this script you then can create a scheduled job using the Windows Scheduler. When creating the command line for the scheduled task you have to be carefull about two things:

Set the execution policy for powershell so that it allows to run scripts. Depending on your environment and security policies you should set the execution policy to either “AllSigned”, “RemoteSigned” or “Unrestricted”. For more information consult the powershell documentation. Example: Set-ExecutionPolicy Unrestricted
If your path to the powershell script which you need to pass over to powershell as an argument does contain blanks you need to use double quotes surrounding the whole argument including the ampersand (which is the call operator in Windows Powershell) and inside enclose the path information with single quotes. So a correct statement would look like this: powershell.exe -command "& 'C:\My Scripts\undeployAzureService.ps1'" …

To create the scheduled task using the wizard or use a XML template like the one below, insert your data and import it into the scheduler.

<?xml version="1.0" encoding="utf-16"?>
<Task version="1.3" xmlns="http://schemas.microsoft.com/windows/2004/02/mit/task">
  <RegistrationInfo>
    <Date>2010-02-12T13:44:02.910461</Date>
    <Author>[userid]</Author>
    <Description>Timed undeployment of Azure Service during non business hours to optimize Azure consumption of service compute hours.</Description>
  </RegistrationInfo>
  <Triggers>
    <CalendarTrigger>
      <StartBoundary>2010-02-12T19:00:00Z</StartBoundary>
      <Enabled>true</Enabled>
      <ScheduleByDay>
        <DaysInterval>1</DaysInterval>
      </ScheduleByDay>
    </CalendarTrigger>
  </Triggers>
  <Principals>
    <Principal id="Author">
      <UserId>[userid</UserId>
      <LogonType>Password</LogonType>
      <RunLevel>LeastPrivilege</RunLevel>
    </Principal>
  </Principals>
  <Settings>
    <MultipleInstancesPolicy>IgnoreNew</MultipleInstancesPolicy>
    <DisallowStartIfOnBatteries>false</DisallowStartIfOnBatteries>
    <StopIfGoingOnBatteries>true</StopIfGoingOnBatteries>
    <AllowHardTerminate>true</AllowHardTerminate>
    <StartWhenAvailable>true</StartWhenAvailable>
    <RunOnlyIfNetworkAvailable>false</RunOnlyIfNetworkAvailable>
    <IdleSettings>
      <StopOnIdleEnd>true</StopOnIdleEnd>
      <RestartOnIdle>false</RestartOnIdle>
    </IdleSettings>
    <AllowStartOnDemand>true</AllowStartOnDemand>
    <Enabled>false</Enabled>
    <Hidden>false</Hidden>
    <RunOnlyIfIdle>false</RunOnlyIfIdle>
    <DisallowStartOnRemoteAppSession>false</DisallowStartOnRemoteAppSession>
    <UseUnifiedSchedulingEngine>false</UseUnifiedSchedulingEngine>
    <WakeToRun>false</WakeToRun>
    <ExecutionTimeLimit>P3D</ExecutionTimeLimit>
    <Priority>7</Priority>
  </Settings>
  <Actions Context="Author">
    <Exec>
      <Command>powershell</Command>
      <Arguments>-command "&amp; 'C:\my scripts\undeployAzureService.ps1'" -servicename "MyService" -thumbprint "5643060E8F0029FB8C6DB76AAE905C7FA697" -subscriptionid "00000000-0000-0000-0000-000000000000" -slot "Production" &gt; log.txt</Arguments>
      <WorkingDirectory>C:\deployments\logs</WorkingDirectory>
    </Exec>
  </Actions>
</Task>

Then do the same for the deployment process. A respective Windows Powershell script could look like this:

    <#

        .Synopsis

            Will deploy and start a Windows Azure Service

        .Description

            Will deploy and start a Windows Azure Service        

        .Parameter servicename

            The name of the Azure service that will hold the deployment

        .Parameter thumbprint

            The thumbprint of a locally installed and valid certificate for accessing

            the Windows Azure Management Service

        .Parameter subscriptionid

            The ID for the subscription of the Azure Account hosting the respective service

        .Parameter slot

            The deployment slot in which the package shall be deployed <Production | Staging>

        .Parameter storageservicename

            The storage account that can be used to upload the deployment package

        .Parameter package

            The full qualified path to the deployment package

        .Parameter config

            The full qualified path to the configuration file for this deployment

        .Example

            deployAzureService.ps1 -servicename "MyService" -thumbprint "5643060E8F0029FB8C6DB76AAE905C7FA697" -subscriptionid "00000000-0000-0000-0000-000000000000" -slot "Production" -storageservicename "StorageService" -package "C:\deployment\HelloWorld.cspkg" -config "C:\deployments\ServiceConfiguration.cscfg" -label "MyFirstDeployment"

    #>

    param([PARAMETER(Mandatory=$true)][string]$servicename, [PARAMETER(Mandatory=$true)][string]$thumbprint, [PARAMETER(Mandatory=$true)][string]$subscriptionid, [PARAMETER(Mandatory=$true)][string]$slot, [PARAMETER(Mandatory=$true)][string]$storageservicename, [PARAMETER(Mandatory=$true)][string]$package, [PARAMETER(Mandatory=$true)][string]$config, [PARAMETER(Mandatory=$true)][string]$label)

    if(!($snapin = Get-PSSnapin AzureManagementToolsSnapIn -erroraction silentlycontinue))

    {

        Write-Host "Adding ManagementTools SnapIn...please wait"

        Add-PSSnapin AzureManagementToolsSnapIn

    }

    $cert = Get-Item cert:\CurrentUser\My\$thumbprint

    $service = Get-HostedService $servicename -Certificate $cert -SubscriptionId $subscriptionid

    if($service)

    {

        $deployment = Get-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert -erroraction silentlycontinue

        $name = $deployment.Name

        if(!$deployment.Name)

        {

            Write-Host "Creating new deployment...please wait"

            New-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert -Package $package -Configuration $config -Label $label -StorageServiceName $storageservicename |

            Get-OperationStatus -WaitToComplete

            Write-Host "Starting the new deployment...please wait"

            Get-Deployment -Slot $slot -ServiceName $servicename -SubscriptionId $subscriptionid -Certificate $cert |

            Set-DeploymentStatus "Running" |

            Get-OperationStatus -WaitToComplete

        } else

        {

            Write-Host "Service $servicename already has an active deployment with the name $name...please remove the active deployment first"

        }

    } else

    {

        Write-Host "No service found with the name $servicename"

    }

And the template for the scheduler could look like this:

<?xml version="1.0" encoding="UTF-16"?>
<Task version="1.2" xmlns="http://schemas.microsoft.com/windows/2004/02/mit/task">
  <RegistrationInfo>
    <Date>2010-02-15T09:50:14.2255756</Date>
    <Author>[userid]</Author>
  </RegistrationInfo>
  <Triggers>
    <CalendarTrigger>
      <StartBoundary>2010-02-15T07:00:00</StartBoundary>
      <Enabled>true</Enabled>
      <ScheduleByDay>
        <DaysInterval>1</DaysInterval>
      </ScheduleByDay>
    </CalendarTrigger>
  </Triggers>
  <Principals>
    <Principal id="Author">
      <UserId>[userid]</UserId>
      <LogonType>Password</LogonType>
      <RunLevel>HighestAvailable</RunLevel>
    </Principal>
  </Principals>
  <Settings>
    <MultipleInstancesPolicy>IgnoreNew</MultipleInstancesPolicy>
    <DisallowStartIfOnBatteries>false</DisallowStartIfOnBatteries>
    <StopIfGoingOnBatteries>true</StopIfGoingOnBatteries>
    <AllowHardTerminate>true</AllowHardTerminate>
    <StartWhenAvailable>false</StartWhenAvailable>
    <RunOnlyIfNetworkAvailable>false</RunOnlyIfNetworkAvailable>
    <IdleSettings>
      <StopOnIdleEnd>true</StopOnIdleEnd>
      <RestartOnIdle>false</RestartOnIdle>
    </IdleSettings>
    <AllowStartOnDemand>true</AllowStartOnDemand>
    <Enabled>true</Enabled>
    <Hidden>false</Hidden>
    <RunOnlyIfIdle>false</RunOnlyIfIdle>
    <WakeToRun>false</WakeToRun>
    <ExecutionTimeLimit>P3D</ExecutionTimeLimit>
    <Priority>7</Priority>
  </Settings>
  <Actions Context="Author">
    <Exec>
      <Command>powershell</Command>
      <Arguments>-command "&amp; 'C:\My Scripts\deployAzureService.ps1'" -servicename "MyService" -thumbprint "5643060E8F0029FB8C6DB76AAE905C7FA697" -subscriptionid "00000000-0000-0000-0000-000000000000" -slot "Production" -storageservicename "mystorageservice" -package "'C:\deployments\packages\HelloWorld.cspkg'" -config "'C:\deployments\packages\ServiceConfiguration.cscfg'" -label "MyFirstDeployment" &gt; deployment.log</Arguments>
      <WorkingDirectory>C:\deployments\packages\logs</WorkingDirectory>
    </Exec>
  </Actions>
</Task>

This is all to automate your deployment tasks. One thing however is to remember here. As the New-Deployment commandlet uploads your deployment package into the blob storage of the specified Azure Storage account you should check your blob storage from time and do a clean up otherwise this will also produce unnecessary cost.

Tales About Working With The Azure Service Management API – Chapter I

Alex Strauss — Thu, 28 Jan 2010 19:03:00 GMT

For enterprises, power users and people who simply don’t like the Azure administration portal but do use Windows Azure as an deployment option for their applications or services it may be desirable to integrate deployment and administration tasks into automatic processes and/or customized tools. To support that Microsoft provides a REST based Service Management API. This API is quite comprehensive and allows you to view and alter your deployments, services and storage accounts. In order to secure access to those resources via the API mutual authentication of certificate over a SSL connection is required. In addition also the Subscription-ID of your account is needed as part of the rest URLs to correctly address your resources. While this is by no means a security feature it is recommended to keep this ID a secret, though. But back to the Certificates now. In order to use the service API you need to have a certificate that you associate with your service API. You can do that by using the developer portal and go to the “Account” page and then use the link “Manage My API Certificates”. Then you are able on import A DER encoded binary representation of your certificate (use certmgr.msc on Windows to do so).

In order to get a certificate for use with the Windows Azure Service Management API there are several possibilities:

Create one using the makecert.exe tool which comes with the Windows SDK and also with Visual Studio. How to create a suitable self signed certificate with makecert.exe refer to this blog post
Create a self signed certificate using the IIS Management console. Refer to this Technet article to see how this can be done.
Get a certificate from a Certificate Authority (CA) such as Verisign, GoDaddy, CACert.org, etc.

It is to note that:

The certificate doesn’t need to be a server certificate (enhanced key usage: server authentication). A client certificate is necessary (and probably also easier/cheaper to get from your CA). However please be aware that this cannot be used as a SSL certificate for one of your services (which wouldn’t probably be a good idea anyway)
The certificate needs to have at least a 2048 bit key

Refer to the API documentation for further information.

No you might ask why do I write all this when this is mostly already documented. Because I got my certificate via the automated process of CAcert.org. And in my first try I run into an error that I was not able to get my Service Management API requests authenticated. The service always returned:

Error 403 (Forbidden): The HTTP request was forbidden with client authentication scheme 'Anonymous'

I didn’t really understand why this was happening as I was creating the certificate in my code using one of the above mentioned DER encoded binary .cer files which I exported from the management console. Here is the code which is really not that complicated.

try
{
    X509Certificate cert = X509Certificate.CreateFromCertFile("AzureCert.cer");
    HttpWebRequest req = (HttpWebRequest)WebRequest.Create("https://management.core.windows.net/<subscription-id>/services/storageservices");
    req.ClientCertificates.Add(cert);
    req.UserAgent = "Azure Cloud Management Studio";
    req.Method = "GET";
    req.ProtocolVersion = HttpVersion.Version11;
    req.Headers.Add("x-ms-version", "2009-10-01");
    req.ContentType = "text/xml";
    HttpWebResponse response = (HttpWebResponse)req.GetResponse();
    ...
}
catch (Exception ex)
{
    ...
}

After a while of investigating I realized that as I created the .cer file from a certificate string shown outlined in the picture below.

However I did not realize that I’m then missing the private key generation process that included by clicking on the install button and uses ActiveX in Internet Explorer.

“Your private key is generated by your browser, *IN* your browser when you request a new cert from CAcert. That way CAcert never has your private key in its possession. The implication for you is that you must be on the same machine using the same browser that you used to request the cert initially, when needing to access your private key. So don't forget if it was your "work" machine vs. your "home" machine.”

Unfortunately I couldn’t get that to work with IE8 and Windows 7 what brought me to use the certificate string in the first place. But if you walk down this road and copy that string into a text file, change the file extension to .cer and then install the certificate you will not have a private key associated with this certificate and that’s why the request is failing. In order to have the requests working you need to meet two prerequisites for your certificate:

The certificate needs to be installed in the certificate store of the client machine from where you send the requests to the Service Management API.
The certificate must have an associated private key.

For me this meant:

Use Windows 7 XP Mode and IE6 ;) to issue a new certificate request to CACert.org
Install the certificate from the CAcert.org website using the same browser in the same XP Mode instance
Export the certificate as a Personal Information Exchange (PKCS#12) file including the private key (note that such file have an .pfx file extension)
Import the the certificate on the Windows 7 system used to work with the Service Management API
Make sure that the private key is available
Export the certificate again as a DER encoded binary .cer file (this time make sure that the private key is not exported 1. because you don’t need it on the Azure side and 2. you wouldn’t be able to create a .cer file)
Import the .cer file with the Azure Management Console

After all those steps I was able to issue successful requests with my own code as well as available tools to interact with the Windows Azure Service Management API such as csmanage.exe or the PowerShell Windows Azure Service Management CmdLets. However just to note it again this only works because the certificate is actually also installed in the certificate store where the .Net Cryptographic API does a lookup of the certificate and its corresponding private key. You can verify this if you import the certificate in step 4 above to prompt you if an application tries to use the private key of this certificate.

Bookmark this on Delicious

DHL Shipment Tracking Accelerator for IE8

Alex Strauss — Tue, 10 Nov 2009 13:41:00 GMT

Today it’s going to be a short and extremely non technical post however I thought this may be of interest to some of you. I had some spare time and was waiting for DHL to deliver my copy of Dragon Age: Origins. So I consulted the DHL tracking system quite a few times. And because I found it quite annoying to copy and paste the shipment number out of the Amazon UK webpage into the tracking system on the DHL website I decided to quickly create a DHL Shipment Tracking Accelerator. Although many ecommerce shops already provide links to the tracking system there are still quite a few that don’t. So I think this provides at least some value.

Here’s a little screenshot of the preview. Luckily DHL designed the page so that at least some relevant info is presented within the preview. To get full fidelity however you can hit the mouse button on the accelerator menu item to go to the full page.

If you want to add the accelerator yourself…here you go. I provide a English and a German version.

Bookmark this on Delicious

Installing IEAK IN A VPC without Disk Space Determination

Alex Strauss — Wed, 14 Oct 2009 10:48:17 GMT

If you try to install the Internet Explorer Administration Kit on a Virtual PC image you may have probably encountered the following situation

The box shown above appears and stays there forever. The only option you have is to click the “Return” button and cancel the installation process. But as you may still want to have this piece of software installed on your virtual pc you are pretty much stuck here. However there is at least still one possibility to install the .msi package. That is by using the msiexec.exe tool with the quiet or passive option. So after opening a Command Window (eventually as Administrator) you can use the following command line to silently install the IEAK install image:

msiexec /quiet /i <PATH>\ieak.msi

This will install the package and it will be available for use. However there is one problem with this approach. In the GUI you need to choose a license type from three options (Internet Service Provider (ISP), Internet Content Provider (ICP) and Corporate). With the above method you cannot do that and therefore the product is installed with the default license which obviously is the ISP license. Implication of this is that there are certain features enabled or disabled in IEAK depending on the license mode. So if you need the ICP or the Corporate mode you are stuck again. However as a quick hack you can modify one (or better) two registry key in order to adapt IEAK to your needs and requirements.

You need to go to:

HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\IEAK

And then there are the two string values which you can modify:

Mode: <0|1|2> where 0 is ISP, 1 is ICP and 2 is Corporate

Organization Name: Which is the name that gets inserted in certain UI areas of IE and which probably has also some legal meaning with respect to licensing.

So finally it will look something like this which is the correct setting for your requirements and you then are ready to start creating custom IE8 packages.

Win7 your Visual Search if it speaks RSS

Alex Strauss — Mon, 12 Oct 2009 08:34:00 GMT

I already blogged quite a bit about the new Visual Search feature in Internet Explorer 8. Since this needs some customizations on the server side in order to create search responses that correspond to the Visual Search standard and are either in JSON or XML format changes are good that your search already is able to provide the search results in RSS format.

And if this is the case you can easily add an entry to your existing OpenSearch descriptor file to include the URL template for the RSS search response. And then you could use exactly that same file in order to publish and distribute it as an Federated Search Connector for Windows 7.

To create a RSS template URL that can be used with Windows 7 the same parameters are valid as for the visual search or a standard web search provider and adhere to the OpenSearchDescription specification. So such a URL template could look like the following (with Bing search as an example).

http://api.search.live.com/rss.aspx?source=web&query={searchTerms}

Of course even if you do not already have a IE8 Visual Search but a RSS response mode for your search you still can use it with Windows 7. The minimal configuration that you provide a “ShortName” and the template URL. The rest is optional however it is recommended that you add also a standard web search template so that Windows 7 displays a button to let you start a standard web search eventually using different parameters.

So a valid and minimal open search configuration for use as a Windows 7 search provider that searches my blog would look something like this:

<?xml version="1.0" encoding="utf-8"?>
<OpenSearchDescription xmlns:ms-ose="http://schemas.microsoft.com/opensearchext/2009/" xmlns="http://a9.com/-/spec/opensearch/1.1/">
  <ShortName>Come Get Some...Search</ShortName>
  <Url type="application/rss+xml" template="http://api.search.live.com/rss.aspx?source=web&amp;query={searchTerms}+site:http://blogs.msdn.com/astrauss" />
  <Url type="text/html" template="http://www.bing.com/search?q={searchTerms}+site:http://blogs.msdn.com/astrauss&amp;go=&amp;form=QBRE&amp;scope=web" />
  <Description>Windows 7 Search Connector for the Blog of Alex Strauss</Description>
</OpenSearchDescription>

As you may realize it is quite simple to create such a configuration. Then you can provide it as a file using the .osdx extension. If you provide as a URL the Mime-Type is already registered and the user can directly install the provider from a simple link.

So if you want to add the search provider for my blog then click the link below.

Come Get Some...Search

And to make it even easier for you to create your own configuration file I created a little Silverlight application that creates a configuration XML from the parameters you provide. Unfortunately as I’m not able to host ASP.Net applications you have to copy&paste the XML string to a text editor. However I hope you like it anyway.

Update: Enterprise RIA Project Now Running on Silverlight 3 Release Version

Alex Strauss — Tue, 08 Sep 2009 11:59:00 GMT

As the release schedule of our Enterprise RIA template and sample application was a little bit unfortunate we now had the time to update the project. We needed to do some changes to the code which we couldn’t do before now due to some time constraints. For example the way ton include application services into the app changed quite a bit. The way to declare the service in XAML was using the attached property

<Application.Services>

a full example of the “old” way is posted here. The new way to declare an application service is to use the

<Application.ApplicationLifetimeObjects> attached property. But not only the name of the property changed there are more changes to that concept including the mechanisms to obtain an instance of such a service. Now you can simply query the ApplicationLifetimeObjects collection e.g. using extension methods.

public static IUnityService GetUnityService(this Application application)
{    
    return application.ApplicationLifetimeObjects.OfType<IUnityService>().Single();
}

Another full example is posted here.

However now the updated version finally does run on the release version of the Silverlight 3 Runtime.

In addition I attach the code here as the push out onto the mymsdn site may take some time.

Please remember that you may need to update some references to assemblies which are not included in the project such as the Unity or the Silverlight Toolkit.

The Music Industry – Your Dear Pals

Alex Strauss — Thu, 20 Aug 2009 10:51:15 GMT

Due to some recent changes in licensing for LyricWiki to provide song lyrics via web service calls my famous Radio GaGa Silverlight application does no more show lyrics of the selected songs. As said this is due to some restrictions made by the music publishers and is neither my nor the fault of LyricWiki. While this is just a sample application it is not too much of a problem at all however I just wanted to make you aware of this. I’m reflecting now how I can change the application to still add some value. For example the web service still returns discographies and other artist/song related information.

So if you have any ideas on how to pimp Radio GaGa I would appreciate if you’d leave a comment. Until then stay tuned and at least leave out one purchase of music to show the publishers that consumers still have a voice. Or better send them a note and tell them that they still don’t know how the internet works.

Silverlight 3 Business Applications Made Easy

Alex Strauss — Thu, 20 Aug 2009 10:39:05 GMT

Jörg an I created a new RIA Template and sample application for enterprise applications based on Silverlight 3 and the Silverlight Toolkit.

This Visual Studio template and sample application provides a basic structure with sample code for an Enterprise RIA. The intention of providing this was to show how Microsoft Silverlight 3 can be used to create Rich Internet Applications (RIAs) in an enterprise environment. This means e.g. to effectively visualize enterprise data and provide functionalities which may allow to better work with and manipulate such data in comparison to traditional web applications. The focus when designing this template and sample was on the following two main subjects:

Make use of the latest Silverlight technology and Silverlight extensions such as the Silverlight Toolkit or the Silverlight port of the Unity container in order to get to working results as fast as possible while preserving a high level of quality.
Design and implementation of the application following some proven architectural patterns and software development techniques in order to provide code that meets usual requirements in enterprise application development in order to provide a baseline that can be used to create own custom enterprise RIAs on top of it.

The sample application deals with financial data and stock trades. It exemplary implements certain aspects of visualizing of data which can be relevant and helpful while buying or selling stocks and managing accounts.

The functionality of the sample application is best described using a screenshot of the application itself.

RSS ticker with detail view using visual effects which are rendered with GPU hardware support
Possibility to filter the available data via ComboBox (timeframes) and textbox (ticker symbol)
Accounts are displayed and selectable in a TreeView control
Scatter graph for clear display of transactions and transaction cluster (resolution is per day)
Transaction nodes in the scatter diagram show the value of the transactions (or sum if its a transaction cluster) via mouse hover effect. A detail view is also available and is shown after clicking a node in the graph
Line graph that shows all stocks in the account evaluated with the respective stock price at that day in order to visualize the overall account value which is explicitly shown when hovering over the line graph nodes
Tabular view of the transactions in a certain timeframe or of a certain stock with detail view
Tabular view of a stock ranking for the selected timeframe regarding their performance showing performance figures, highs and lows with the respective dates

This template and sample application is based on

and was developed using

The architecture of the application is, besides others based on the following patterns and techniques

The ViewModel pattern (a MVC variant) to decouple the UI and the application logic as much as possible
Comprehensive data binding via collections implementing the observer pattern. Therefore we were able to implement the sample without any references to UI components in the C# code
Almost no use of custom events for notification
Use of Unity a dependency injection container infrastructure which manages certain application components and services during their lifecycles and provides concrete instances of those artifacts when those are needed during runtime

More in depth and technical details to this implementation and techniques can probably found soon in theses blogs:

· Blog of the Microsoft Technology Center Munich

· Blog of Jörg Joos

· Blog of Alexander Strauß

The template and sample application can be found here on MyMSDN or just drop me a note. Due to some time constraints it is still based on Silverlight 3 Beta however we will provide a SL 3 release version pretty soon.

Radio GaGa New Version And Live On Windows Azure

Alex Strauss — Mon, 13 Jul 2009 14:19:54 GMT

I took some more time to enhance Radio GaGa, the sample application from my last post. It now supports search, has a home button, artist paging functionality and an updated layout and was updated to work with the final Silverlight 3 runtime.

And as I was evaluating the current Windows Azure SDK I thought it might be an interesting idea to deploy Radio GaGa onto the Azure Fabric as is. My guess was that it must be a straight forward process as this is a Silverlight only application that uses no Azure Services or resources besides the basic hosting. So I tried it and unlike some other tries where I thought everything should be quite easy and straight forward this time it really worked well. So here it is. Remember to get the Silverlight 3 runtime in order to use the application.

And as always if you would like to get the Source Code for this sample application feel free to contact me.

The ViewModel Pattern in Silverlight – An Example

Alex Strauss — Tue, 09 Jun 2009 18:25:03 GMT

During the last few weeks I was working with Silverlight again quite a bit. This meant I had to write some code for several showcase projects, too. Of course no real production code (beware) but nevertheless in the end the applications were doing what they were supposed to do. However as it usually happens in those cases you have to decide between a quick and dirty fire and forget kind of stumble into the programming of the app or to put some basic effort in planning and designing to have at least the basic rudiment of an application architecture. And although I’m in the role of architect evangelist I’m always tempted to start coding without big thinking right away. This time however we took some time and designed our applications so that we would have a nice separation between UI and application logic. In particular we chose a ViewModel approach which is quite common in the world of WPF and Silverlight. ViewModel stands for Model-View-ViewModel (MVV) and is a variation of the widely known Model-View-Controller (MVC) pattern. I won’t dig deep into the explanation of this patterns as they have been described in depth at many places already including John Gossman’s or David Hill’s Blog for MVV or the Portland Pattern Repository for MVC. This said I want to focus on a short example driven walkthrough on how to create an Silverlight Application implementing the MVV pattern.

The example application allows to view songs and song lyrics of the current top artists listed on LastFM. In order to aggregate the data this small sample application already is a mash up of two different web services.

LastFM REST web service provides the list of top artists
The LiyricsWiki REST web service provides the lyrics for a particular song

So in order to give you a high level impression of the application here is a simple architecture sketch.

The Visual Studio 2008 project is organized accordingly. To maintain the highest level of simplicity a service access layer has been omitted although this would be something you would probably want to consider in a real application development project.

The folders contain the following:

Icons contains the icons for the Silverlight 3 out-of-browser feature as I enabled OOB for this sample app however it is obviously not relevant for the ViewModel part
Model contains, well, the ViewModel class and any other class necessary to build the object model for this application. In this case those are classes like Artist and Track which mainly consist of private fields and the related public properties.
Views contains the UI which in this sample is a single XAML page with it’s code behind
Servicedata contains some constant REST URIs for the services I call

As this baseline structure could be already called something like a best practice for ViewModel projects one could use such a structure as a base template for such applications.

Now let’s start with the meat of the application. The best way to start off with would probably be to create an empty ViewModel class stub which basically is a standard C# class stub. Next step could be to create something like a ViewModel Base class which enables change notification for properties of the ViewModel. This is absolutely helpful in order to have your views automatically updated when the properties change to which any UI Element is bound to.

This would look something like this:

public abstract class ViewModelBase : INotifyPropertyChanged

    protected void OnPropertyChanged(string propertyName)

        PropertyChangedEventHandler handler = PropertyChanged;

        if (handler != null)

            handler(this, new PropertyChangedEventArgs(propertyName));

    public event PropertyChangedEventHandler PropertyChanged;

So the ViewModel then extents this ViewModelBase class and instantly gains those notification capabilities when the OnPropertyChanged method is called in the setter of a property.

The same requirement also exists for collections which are data bound however this is almost even easier as Silverlight (as well as WPF) comes with a special collection class which implements the Observer pattern which of course is tightly related with any MVC pattern. This class is a generic collection class and is called ObservableCollection<T>. So with this knowledge we can start filling our ViewModel with life. For this sample this would look like the following up until now:

public class RadioGaGaViewModel : RadioGaGa.Model.ViewModelBase

        #region Fields

        private ObservableCollection<Artist> topArtists;

        private ObservableCollection<Track> topTracks;

        private string currentLyrics = string.Empty;

        #endregion

        #region C'tor

        public RadioGaGaViewModel()

            this.topTracks = new ObservableCollection<Track>();

            this.topArtists = new ObservableCollection<Artist>();

        #endregion

        #region Properties

        public string CurrentLyrics

            get { return this.currentLyrics; }

set

                this.currentLyrics = value;

                OnPropertyChanged("CurrentLyrics");

        public ObservableCollection<Track> TopTracks

            get { return this.topTracks; }

        public ObservableCollection<Artist> TopArtists

            get { return this.topArtists; }

        #endregion

Now what we have to do next is to make the ViewModel available to the UI for data binding. This can be easily done by following this little sequence of tasks:

<UserControl

...

    x:Class="RadioGaGa.MainPage"

    Loaded="OnMainPage_Loaded">

Create a handler method stub in the code behind file of the XAML page

private void OnMainPage_Loaded(object sender, RoutedEventArgs e)

Instantiate a new ViewModel object

private void OnMainPage_Loaded(object sender, RoutedEventArgs e)

            RadioGaGaViewModel model = new RadioGaGaViewModel();

Create a public property which sets the DataContext for the UserControl

public RadioGaGaViewModel ViewModel

            get { return DataContext as RadioGaGaViewModel; }

            set { DataContext = value; }

Set the property and assign the ViewModel instance you just created

private void OnMainPage_Loaded(object sender, RoutedEventArgs e)

            RadioGaGaViewModel model = new RadioGaGaViewModel();

            ViewModel = model;

After doing all this you can bind your the properties of your UI controls to the Properties of your ViewModel which are surfaced to the controls via the DataContext set on the top level FrameworkElement. For example you could create a DataTemplate for the items of a ListBox and could bind the respective properties like shown in the sample below.

<ListBox.ItemTemplate>

    <DataTemplate>

        <Border CornerRadius="5" BorderThickness="1" BorderBrush="Black" Margin="1,0,0,1" Padding="2" MinWidth="320">

            <Border.Background>

                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                    <GradientStop Color="#FFB2B2B2"/>

                    <GradientStop Color="#FFFFFFFF" Offset="1"/>

                </LinearGradientBrush>

            </Border.Background>

            <Grid Height="55" HorizontalAlignment="Left">

                <Grid.ColumnDefinitions>

                    <ColumnDefinition MaxWidth="40" />

                    <ColumnDefinition />

                </Grid.ColumnDefinitions>

                <StackPanel Orientation="Vertical" Grid.Column="0" MaxWidth="40" HorizontalAlignment="Left">

                    <TextBlock Text="{Binding Path=Rank}" FontSize="12" FontWeight="Bold" Foreground="Black" TextAlignment="Left" VerticalAlignment="Center" Padding="5,0,0,0" />

                    <Image Source="{Binding Path=Images[0]}" Height="30" Width="30" HorizontalAlignment="Left"/>

                </StackPanel>

                <StackPanel Orientation="Vertical" Grid.Column="1" HorizontalAlignment="Left">

                    <TextBlock Text="{Binding Path=Title}" FontSize="12" FontWeight="Bold" Foreground="Black" TextAlignment="Left" VerticalAlignment="Center" Padding="5,0,0,0" />

                    <StackPanel Orientation="Horizontal">

                        <TextBlock Text="Artist:" FontSize="12" Foreground="Black" TextAlignment="Left" VerticalAlignment="Center" Padding="5,0,0,0" />

                        <TextBlock Text="{Binding Path=Artist.ArtistName}" FontSize="12" Foreground="Black" TextAlignment="Left" VerticalAlignment="Center" Padding="5,0,0,0" />

                    </StackPanel>

                    <TextBlock Text="{Binding Path=Playcount}" FontSize="12" Foreground="Black" TextAlignment="Left" VerticalAlignment="Center" Padding="5,0,0,0" />

                </StackPanel>

            </Grid>

        </Border>

    </DataTemplate>

</ListBox.ItemTemplate>

And that’s basically all for creating a ViewModel pattern based architecture. Next step would be to implement the business logic that fills the ViewModel properties. In my case these are the calls to the different REST based web services, which of course are called asynchronously (also as Silverlight doesn’t support anything else) in order to still have an responsive UI while the services are accessed.

For our sample the final result can be tested here: http://www.level70.de/silverlight/RadioGaGa/RadioGaGa.html

As I already equipped my development machines with Silverlight 3 Beta this only works with the SL3 Beta runtime. So if you are still on 2 you have to be content with this screenshot (pretty, eh? ;))

The Visual Studio 2008/SL 3 Beta Tools solution can be downloaded from my SkyDrive.

I hope this all is helpful and easy to understand. As always feel free to send comments or corrections, etc.

Two more Sidenotes:

LyricsWiki also offers a SOAP web service however I was not able to use it with Silverlight when letting Visual Studio generate the service proxy (with svcutil for Silverlight probably). So I switched to the REST based version
This project can quite easily be migrated to WPF and vice versa. I’ve done this two time due to the fact mentioned in <1> because I wasn’t aware of the REST interface in the beginning. This shows that WPF and Silverlight get closer and closer with their features and APIs so that a develop once run everywhere scenario will become more and more feasible.

Bookmark this on Delicious

Physics, Silverlight and Visualization…Update!

Alex Strauss — Mon, 08 Jun 2009 13:40:05 GMT

Due to quite some unexpected demand for the sources of the knowledge management showcase published in this blogpost even now almost 2 years after the initial post I took some short time and updated the solution. So now should at least rudimentary work with Silverlight 2 and 3 Beta.

Unfortunately I had to strip out dragging support because I was constantly experiencing System.Argument.Exceptions when calling the MouseEventArgs.GetPosition() method and didn’t want to invest to much time into debugging.

So for me the solution basically works including the HTML-Search Button that calls into the Silverlight application however there is still no optimized or well documented code. It was and still is a quick hack and only should demonstrate how to innovatively visualize dry business content. So use at your own risk and feel free to send me comments or optimized versions. ;)

You can download the solution here.

Short Gotcha When Working With Extent Initialization In ‘M’

Alex Strauss — Tue, 07 Apr 2009 12:15:28 GMT

Not just in order to show that this Blog is still alive but also because it may be a little useful hint for all of you doing the first steps with M, the language of the Oslo Developer Center.

As you might already know you can create data models with M which are parsed and transformed into T-SQL Reference by the M-Parser.

Not only can you define Types & Values but can also assign a storage container for the defined types. Depending on the Grammar used to translate the M-File it is transformed in something that provides real storage e.g. a table in a relational database.

In the following snippet the extent definition is marked in red.

   1:  module MyModule {

   2:      type OrderItem {

   3:          Description : Text;

   4:          Quantity : Integer32;

   5:      }

   6:      OrderItems : OrderItem*;

   7:  }

In the sample above M does not care about how the storage is physically populated. In case of using the T-SQL variant this line would only create the table but wouldn’t insert any items (which is absolutely comprehensible behavior). However sometimes it could make sense to also initialize the storage with some values. And therefore M supports what is called extent initialization. And this works for all types supported by M and the respective data store.

So you could easily define an extent initalizer for the following type.

   1:  type Task

   2:  {

   3:          Id:Integer32 = AutoNumber();

   4:          Name:Text;

   5:          DueDate:DateTime?;

   6:          Owner:Text;

   7:  } where identity Id;

However if you wonder what format to use for the DueDate field and stumble across the example documented in this MSDN documentation you will probably end up with an error message like shown in the screenshot below.

The issue here is that DateTime is specified following the following lexical structures for Date & DateTime literals.

Date literals are used to write a date independent of a specific time of day.

DateLiteral:

Signopt DateYear - DateMonth - DateDay

The tokens of a DateLiteral must not have whitespace.

DateDay: one of

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15

16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

DateMonth: one of

01 02 03 04 05 06 07 08 09 10 11 12

DateYear:

DecimalDigit DecimalDigit DecimalDigit DecimalDigit

So the cause for the error is obvious as there is the sample only states a single digit for DateDay. So changing this to a double digit variant will resolve this issue. The complete lexical structure of M can be found in the MSDN library as well.

If you want to know more about ‘Oslo’ and ‘M’ check out the MSDN Developer Center and visit the blogs of Douglas Purdy and the Intellipad Team.

Building a Visual Search Service for IE8 with WCF - Part V

Alex Strauss — Thu, 15 Jan 2009 18:40:00 GMT

With some delay here is the final part of the series on how to implement a IE8 Visual Search Service using WCF. In this last part I will deal with the small bits which are still open in order to be able to deploy a full functioning Visual Search service and those are:

Simple caching mechanism
"Spambreak" to control the number of requests that are processed
WCF Configuration
Visual Search Configuration XML
Webpage for adding the service to the IE search provider list

Implementing a simple caching mechanism

As already mentioned quite a few times performance is critical for a Visual Search service in order to get acceptance by the users so it is opportune to use some kind of caching mechanism. In order to follow the K.I.S.S principle I didn't want to implement a highly sophisticated caching mechanism on my own so I simply use the caching application block which is one of the components of the Enterprise Library created and published by Microsoft Patterns & Practices. The caching block allows you to integrate very effective, configurable and extendable local cache into your application. Information about the features and how it can be used is documented in the MSDN documentation. For my Visual Search service I used the simplest approach on using the cache. So it is an in-memory cache that simply adds search results as cache entries with the query string as their key. The overall simple (cache)-flow ;-) in the service is outlined in the figure below.

The relevant code portions are minimal.

The initialization

ICacheManager searchResultCache = CacheFactory.GetCacheManager("Cache Manager");
The check

private bool CheckCache(string query)
{
return searchResultCache.Contains(query);
}
The retrieval

sI = (SearchItem)searchResultCache.GetData(query);
The addition

searchResultCache.Add(query, sI, CacheItemPriority.High, null, new SlidingTime(TimeSpan.FromMinutes(30)));

Of course you need to be aware of the concurrency mode in which the service performs when dealing with the cache. There are two categories to take care of:

Instancing

For a service like this the instancing behavior should be set to single as this ensures that there is only one instance of the service and thus for the cache which then ensures that all requests are validated against the same set of cached items. So I set the InstanceContextMode to single.
However if you are implementing a high scale service you need consider a slightly different approach and will probably have multiple instances that access an distributed cache or at least you will have a backing store ore some kind of replication mechanism that replicates the cache across multiple physical nodes.
Concurrency

For concurrency the most reasonable setting is probably to allow the single service instance to deal with multiple requests at a time because otherwise we would introduce significant performance constraints. This however requires that the service itself is thread safe which is not an easy task to acomplish. So for simplicity, rapid development and testing reasons I initially set the ConcurrencyMode also to single.

More about this topic can be found on MSDN.

"Spambreak" to control the number of requests that are processed

As unlimited resources in terms of scaling and workload are rarely available there may be the need to limit the number of incoming requests to a sensible amount. One good measure is to check the length of the search query. In many cases it doesn't make sense to retrieve results for a single letter or number. Therefore it could be useful to only cycle through the complete search process when the query string has passes a given threshold (e.g. 3 letters). If the length is below the threshold you can simply return a static default result which could significantly boost performance.

WCF Configuration

Every WCF service needs a configuration. Although configuration could completely happen in code it is handier most of the times to declaratively configure the service with an XML configuration. As we are using the Internet Information server as our service host we can include the service configuration details into the Web.config file and can edit it with the WCF Configuration Editor included in Visual Studio 2008 (see figure).

As we create a restful service we need to create an rest endpoint and use the respective binding. In my case I created the configuration with the endpoint and associated binding and behavior attributes completely myself however there is also the possibility to use the Factory attribute of the ServiceHost directive.

For the Visual Search service I need to define an endpoint which in my case defaults to the default adress. Then we need to configure this endpoint with an webHttpBinding so that the service is exposed via HTTP requests and not via SOAP messages. Finally in order to allow clients to communicate via HTTP request we must attach the WebHttpBehavior to the endpoint. So the complete service configuration for the REST endpoint looks as follows.

<system.serviceModel>
<bindings>
<webHttpBinding>
   <binding name="myRestfulBinding" />
</webHttpBinding>
</bindings>
<services>
<service behaviorConfiguration="VideoVSearchAggregator.VideoVisualSearchServiceBehavior"
             name="VideoVSearchAggregator.VideoVisualSearchService">
    <endpoint address=""
                   behaviorConfiguration="myRestfulBehaviour"
                   binding="webHttpBinding"
                   bindingConfiguration="myRestfulBinding"
                 name="VisualVSearchAggregatorRestEndpoint"
                   contract="VideoVSearchAggregator.IVideoVisualSearchService" />
</service>
</services>
<behaviors>
<endpointBehaviors>
   <behavior name="myRestfulBehaviour">
    <webHttp />
   </behavior>
</endpointBehaviors>
<serviceBehaviors>
   <behavior name="VideoVSearchAggregator.VideoVisualSearchServiceBehavior">
    <serviceMetadata httpGetEnabled="true" />
    <serviceDebug includeExceptionDetailInFaults="false" />
   </behavior>
</serviceBehaviors>
</behaviors>
</system.serviceModel>

One thing to be aware of is the fact that your service itself opens HTTP connections via the SearchControllers so therefore if you deploy the service in an environment that uses a proxy server for outgoing requests you need to configure your environment respectively. For an IIS hosted WCF Service you can add the following elements to the Web.config.

<system.net>
<defaultProxy enabled="true">
<proxy bypassonlocal="true" proxyaddress="<proxy>" />
</defaultProxy>
</system.net>

Visual Search Configuration XML

In order to let people register the Visual Search service with their Internet Explorer it is necessary to create a XML search configuration that is published via a simple link in a hosting webpage. To create the configuration for a service it's best to follow the documentation on MSDN. My configuration looks like this:

<?xml version="1.0" encoding="UTF-8"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
<ShortName>Video Meta Search</ShortName>
<Description>Online videos from many sources at on glance</Description>
<Url type="text/html" template="http://(host)/VSearch/VideoVisualSearchService.svc/Search?query={searchTerms}"/>
<Url type="application/x-suggestions+xml" template="http://(host)/VSearch/VideoVisualSearchService.svc/Search?query={searchTerms}"/>
<Image height="16" width="16" type="image/icon">http://(host)/VSearch/images/VideoMetaSearch.ico</Image>
</OpenSearchDescription>

Webpage for adding the service to the IE search provider list

Well and finally we need to add a link to a webpage that lets the user register the search service. This can be achieved by calling the IE8 AddSearchProvider function. The function takes the URL to the XML configuration as a parameter. So in my case the call would look something like this:

<input type="button" value="Add Search Provider" onclick='window.external.AddSearchProvider("http://<host>/VSearch/XML/VideoVSearchAggregator.xml");'/>

After that you are ready to go! Hope you enjoyed the series and found some of the information helpful. The code for my project is attached to this post.

Reference:

As I started early with this series and lost momentum and therefore needed almost 3 months to finish there was the change to finish with similar projects earlier than me. So I have to give some Kudos to Guy Burstein, who already posted a blogpost covering almost the same topic - Congrats ;).

Bookmark this on Delicious

Using IE8 Beta2 IEAK with RC1 Bits

Alex Strauss — Thu, 15 Jan 2009 12:29:29 GMT

The release of Internet Explorer 8 RC1 is just around the corner and fortunately there is a significant number of people and organization that want to release their own customized version of IE8. Luckily Microsoft publishes a tool that can let you easily customize IE8. The tool is called the Internet Explorer Administration Kit (IEAK) and its freely available. There are already quite a few blog posts about the tool itself so I don't want to rephrase all that if you are new to IEAK just go to the IEBlog and read the post by Jatinder Mann.

The current published version of the IEAK is the Beta 2 version that corresponds to the exact same version of IE8. So in order to prepare your customized IE8 package with RC1 bits for those that already have access to the IE8 builds > Beta2 there is no corresponding IEAK to those builds. However there is an easy workaround to use the Beta 2 IEAK with the newer bits. Just follow those 3 simple steps and you are done.

Rename the IE8 RC1 setup executable to IE-REDIST.EXE
Backup the original IE8 binaries used by the IEAK (usually in %ProgramFiles%\Microsoft IEAK8\Download\<Platform>\<Locale>\iebin\) and overwrite it with the newer file renamed in step 1. If you use IEAK for the first time the path and files may not exist so you need to start the IEAK wizard once and let it create the path and download the contents.
Start and use the IEAK wizard as usual and create your customized IE8

Building a Visual Search Service for IE8 with WCF - Part IV

Alex Strauss — Tue, 16 Dec 2008 18:15:00 GMT

Well I have to hurry up a bit as I initially planned to have this series finished even a while ago and now I'm even struggling to finish it until the end of the year. Anyway here is the next part and as promised this time I will focus on the search providers which feed the aggregator component with their content. As already mentioned since there are not many video portals that publish APIs I limited the search and implemented two providers which is however probably enough for demonstration purposes.

In order to live a bit of separation I first created a real simple interface which of course also describes the what the implementing search controllers can do. Since there is only one specific task the search controllers have to do is to fill a Section object which simply contains an array of objects. The interface itself is quite simple and contains only one method signature DoSearch(object obj) which takes an object as a parameter. Although in all cases the object that is filled is a Section object I needed to parameterize it with object because I use a threaded model for executing the searches with a ParameterizedThreadStart which unfortunately doesn't allow to pass on data to the thread procedure in a type-safe way. Alternatively I could have encapsulated the threaded calls to DoSearch() into a helper object which I would have initialized with the Section object to be filled by this thread however I didn't design the service in such a fine granular type-safe manner although it would have been relatively easy. If anybody follows the section and does his own implementation or variation the mentioned variant is described here. In any way here is the interface definition for the search controllers:

public interface ISearchController
{
void DoSearch(object obj);
}

And here is the Section class which contains the results of the search:

[System.Serializable]
public class Section
{
[XmlElement]
public object[] items { get; set; }
}

Now that I created the interface I was finally able to start with the implementation of the SearchControllers for the different providers.

YouTubeSearchController

For the YouTube search I used the .Net Client Library which is a library that exposes the YouTube data API through a handy .Net object model which of course makes it really easy to perform searches and retrieve relevant content. Above that the API allows for some tweaking. For example I set the YouTubeQuery.NumberToRetrieve property to 5 as we don't need more because the number of results displayed by the VisualSearch window is limited and we want to display results from the other sources as well. So in order to create as little overhead as possible it is probably very sensible to limit the number of results.
In order to be able to use the API you need a Google account need to register for a developer key and need to specify a name for your application in which you use the API.

The search specific code in my YouTubeSearchController is outlined here:

public void DoSearch(object youTubeSection)
{
   try
   {
      ...
      this.youTubeSection = (Section)youTubeSection;
      YouTubeService service = new YouTubeService("<Your Application Name>");
      YouTubeQuery query = new YouTubeQuery(YouTubeQuery.DefaultVideoUri);
      query.OrderBy = "viewCount";
      query.Racy = "exclude";
      query.VQ = searchquery;
      query.NumberToRetrieve = 5;
      YouTubeFeed videoFeed = service.Query(query);
      this.youTubeSection.items = new object[videoFeed.Entries.Count + 1];
      Separator youtubeSeparator = new Separator();
      youtubeSeparator.title = "Videos On YouTube";
      this.youTubeSection.items[0] = youtubeSeparator;
      foreach (YouTubeEntry entry in videoFeed.Entries)
      {
         SectionItem secI = new SectionItem();
         if (!String.IsNullOrEmpty(entry.Title.Text))
         {
            secI.title = entry.Title.Text;
         }
         else
         {
            secI.title = "Title not available";
         }

         if (!String.IsNullOrEmpty(entry.Media.Description.Value))
         {
            if (entry.Media.Description.Value.Length > 50)
            {
               secI.description = entry.Media.Description.Value.Substring(0, 50);
            }
            else
            {
               secI.description = entry.Media.Description.Value;
            }
         }
         else
         {
            secI.description = "Description not available";
         }
         if (!String.IsNullOrEmpty(entry.AlternateUri.Content))
         {
            secI.url = entry.AlternateUri.Content;
         }
         else
         {
            secI.url = "Media URI not available";
         }

        ThumbnailCollection thumbs = entry.Media.Thumbnails;
        if (thumbs != null && thumbs.Count > 1)
        {
           Thumbnail thumb = new Thumbnail();
           thumb.source = thumbs[0].Url;
           thumb.alternateText = secI.title;
           thumb.height = "35";
           thumb.width = "35";
           secI.image = thumb;
         }
         else
         {
            secI.image = new Thumbnail();
         }
         this.youTubeSection.items[counter] = secI;
         ...
      }
      catch
      {
         throw new Exception();
      }
}
Metacafe

Metacafe also does provide an API however they offer a RSS API and return an XML feed for the search results. So the implementation for the MetaCafeSearchController looks a lot different.

public void DoSearch(object metaCafeSection)
{
   try
   {
      ...
      this.metaCafeSection = (Section)metaCafeSection;
      string uri = "http://www.metacafe.com/api/videos?vq=" + searchquery + "&max-results=5";
      Uri searchUri = new Uri(uri);
      WebRequest req = WebRequest.Create(searchUri);
      WebClient client = new WebClient();
      Stream resultData = client.OpenRead(searchUri);
      StreamReader sR = new StreamReader(resultData);
      XmlReader reader = XmlReader.Create(resultData);
      XmlDocument doc = new XmlDocument();
      doc.Load(reader);
      XmlNamespaceManager nSmgr = new XmlNamespaceManager(doc.NameTable);
      nSmgr.AddNamespace("media", http://search.yahoo.com/mrss/);
      XmlNodeList itemList = doc.SelectNodes("/rss/channel/item");
      this.metaCafeSection.items = new object[itemList.Count + 1];
      Separator metacafeSeparator = new Separator();
      metacafeSeparator.title = "Videos on metacafe";
      this.metaCafeSection.items[0] = metacafeSeparator;
      foreach (XmlNode node in itemList)
      {
         SectionItem item = new SectionItem();
         XmlNodeList childNodes = node.ChildNodes;
         foreach (XmlNode child in childNodes)
         {
            if (child.Name.Equals("title"))
            {
               if (!string.IsNullOrEmpty(child.InnerText))
               {
                  item.title = child.InnerText;
               }
               else
               {
                  item.title = "Title not available";
               }
            }
            else if (child.Name.Equals("media:description"))
            {
               if (!string.IsNullOrEmpty(child.InnerText))
               {
                  if (child.InnerText.Length > 50)
                  {
                     item.description = child.InnerText.Substring(0, 50);
                  }
                  else
                  {
                     item.description = child.InnerText;
                  }
               }
               else
               {
                  item.description = "Description not available";
               }
            }
            else if (child.Name.Equals("link"))
            {
               if (!string.IsNullOrEmpty(child.InnerText))
               {
                  item.url = child.InnerText;
               }
               else
               {
                  item.url = "Link not available";
               }
            }
            else if (child.Name.Equals("media:thumbnail"))
            {
               Thumbnail thumb = new Thumbnail();
               if (!String.IsNullOrEmpty(child.Attributes[0].Value))
               {
                  thumb.source = child.Attributes[0].Value;
                  thumb.alternateText = item.title;
                  thumb.height = "35";
                  thumb.width = "35";
                  item.image = thumb;
               }
               else
               {
                  item.image = new Thumbnail();
               }
            }
         }
        this.metaCafeSection.items[counter] = item;
        counter++;
        ...
    }
    catch
    {
       throw new ArgumentNullException("searchquery not set");
    }
}

So now with these two search implementations I get two Section objects which then again are aggregated into one single SearchItem object. Which then is serialized into the service response and feeds the VisualSearch client in Internet Explorer 8. This process was already mentioned in the last part.

So that's it for part four. The next part is probably going to be the last part and deals about the accompanying features of the service like threading, caching and configuration in a little bit more detail.

Reference:

Bookmark this on Delicious

Building A Visual Search Service For IE8 With WCF - Part III

Alex Strauss — Wed, 26 Nov 2008 16:15:00 GMT

It's definitely about time to publish the promised third part of this series. This time I will cover the class model which I used to let the .Net XmlSerializer generate the necessary XML structure. I want to utilize almost the full breadth of the capabilities the Visual Search component is offering with respect of information display. So in this case the features are:

Categories or sections
Descriptions/Abstracts
Urls
Images

So the XML structure needs to look like the following:

<SearchSuggestion version="2.0" xmlns="http://opensearch.org/searchsuggest2">
    <Query></Query>
    <Section>
        <Separator title=""/>
        <Item>
            <Text></Text>
            <Description></Description>
            <Url></Url>
            <Image source="" alt="" width="" height=""/>
        </Item>
        <Item>
            ...
        </Item>
        ...
        <Separator title="Videos on metacafe"/>
        <Item>
            ...
        </Item>
        ...
    </Section>
</SearchSuggestion>

As I already mentioned I'm using the XmlSerializer in the .Net framework to serialize the XML drafted above. XmlSerializer serializes objects into XML and probably most of the sources (responses from the video services APIs) are XML you might want to ask the question why doing the indirection via a .net object model and not simply use XML transformation with an XML Stylesheet and send it straight over the wire using an XmlWriter. This is a valid question and the main reason why I didn't do it that way is because I started off with the YouTube service which gave me a pretty nice .Net based client API and others probably will follow. Another reason is that I wanted to use WCF which gives you more flexibility in targetting other clients as well and some quality of service features and knobs to fine tune the service.

So the object model looks like outlined in the following class diagram.

The properties in the classes are all annotated with the necessary XmlSerializer Attributes. So for example the code for the SearchItem class looks like the following:

[System.Serializable]
[XmlRootAttribute(Namespace = "http://opensearch.org/searchsuggest2", ElementName="SearchSuggestion")]
public class SearchItem
{
        [XmlAttribute]
        public string version { get; set; }
        [XmlElement(ElementName = "Query")]
        public string query { get; set; }

        [XmlArrayItem(ElementName="Separator", Type=typeof(Separator))]
        [XmlArrayItem(ElementName="Item", Type=typeof(SectionItem))]
        public object[] Section { get; set; }
    }

The most important thing to mention here is that you need to define an array of type object in order to create the child elements of the section element as it needs to take two different types of objects (SectionItem and Separator). Another thing to mention is that the Section property is the aggregation of all results of the integrated video services and therefore I created a helper object (Section class). Every SearchController gets an instance of such a helper object to populate it with its own items and separator. In the end all helper objects of type Section are merged together to populate the SectionItem.Section property.

SearchItem sI = new SearchItem();

Section youTubeSection = new Section();

Section metacafeSection = new Section();

...

youTubeThread.Start(youTubeSection);

metacafeThread.Start(metacafeSection);

...

MergeSections();

...

youTubeSection.items.CopyTo(mergedSection, 0);
metacafeSection.items.CopyTo(mergedSection, youTubeSection.items.Length);

...

sI.Section = mergedSection;

The rest of the model is quite straight forward and I think it needs no further illustration. I will publish the complete code of the Video Visual Search with the last part of this series anyway.

The next part which hopefully doesn't take as long to publish as this one will deal with the Search Interface and the concrete implementations of it. Here's as usual a little teaser.

Reference:

Bookmark this on Delicious

Building a Visual Search Service for IE8 with WCF - Part II

Alex Strauss — Fri, 07 Nov 2008 19:00:00 GMT

Welcome to part two of this series on how to implement a visual search service for IE8 using the Windows Communication Foundation (WCF) and other .Net technologies or libraries. The first part described the overall scenario of the service and today I want to go into a little more details with respect to the service itself.

With respect to the service there are some determining factors which need to be taken into account when creating the service contract interface which are:

The client is determined (The IE8 Visual Search Component) and is a black box for us
The schema of the messages accepted by the client is determined and is POX and is outlined here.
The client queries the service using plain parameterizes URLs via HTTP GET requests

This translates straight into the following attributes for our service.

We have to create a restful service that returns plain XML (no full blown SOAP Services)
Since the scenario implies some sort of contract-first design it is not since there is no metadata that describes the service and its operation and this actually implies that there is no contract (if you want to know a little bit more about contract-first I can recommend this article on theserverside.net)
We need full control over the serialization of the resulting XML

No with having this knowledge we can start to create the service.

After creating the service project in Visual Studio 2008 the first thing we do is to create the service interface which is quite simple in the sense that it only defines one single service operation at this time. My service operation is named "Search" (which is kickass creative) and accepts a single string parameter which is the search query.

So in the simplest case our service interface would look like this:

[ServiceContract]
public interface IVideoVisualSearchService
{
[OperationContract]
SearchItem Search(string query);
}

However since we do have the attributes mentioned above we need to add some specific attribute.

First is the [WebGet] attribute in order to make the service accessible via HTTP GET requests.
We need to have full control over the structure of the resulting XML and therefore cannot use the DataContractSerializer which WCF uses by default to serialize the responses but need to specify the standard XMLSerializer in the .Net Framework. Therefore WCF introduces an XmlSerializerFormat attribute within the ServiceModel namespace which does exactly this.
In addition we need to configure the service so that it exposes itself as a restful service. Therefore we could use a ServiceFactory in order to skip the sometimes cumbersome configuration steps however for the sake of transparency I create a manual configuration and then we need to add an endpoint with an webHttpBinding.

Having done all those modifications our service contract looks like this:

[ServiceContract]
[XmlSerializerFormat]
public interface IVideoVisualSearchService
{
   [OperationContract]
   [WebGet]
   [XmlSerializerFormat]
   SearchItem Search(string query);
}

and the minimal endpoint configuration in the looks like this:

and the behavior configuration section is as well minimalistic and looks like this:

This also already marks the end of part II. In the next part I will give some more detailed information about the object model of the service which defines the content of the search results and how it is attributed to generate exactly the XML that the visual search component of IE8 expects. As a small teaser here is already the class class diagram of the object model to construct the response messages.

Reference:

Building a Visual Search Service for IE8 with WCF - Part I

Bookmark this on Delicious

Building a Visual Search Service for IE8 with WCF - Part I

Alex Strauss — Sat, 25 Oct 2008 23:54:00 GMT

Beta 2 of Internet Explorer has been out for a while now and as you already know one of the new functionalities of Beta 2 is the visual search feature. Since there is a really extensive introduction about visual search and the steps on the IE8 side in this article on the Internet Explorer Team Blog I do not want to go into detail about this but rather tell you how to implement a service that is consumed by the Internet Explorer 8 Visual Search feature by means of a quite comprehensive example.

I chose a scenario which might be quite popular and that is video search. However since a user must explicitly register a search provider into his Internet Explorer unless you provide a customized instance using the Internet Explorer Administration Kit (IEAK). So in order to get one of the rare slots on the users search provider list I wanted to create some kind of meta search that aggregates search results from multiple sources. Another reason was that this enabled me to include and write about topics like threading and caching as well. In order to access the entries of the relevant video assets of the video sites I used their public APIs. Unfortunately it is not yet very common for those sites to offer public APIs to access their content especially in Germany I found none except for MyVideo.de however the application for an API key still remains unanswered. However at least I found two suitable APIs which are the YouTube and the metacafe API. The architecture of the service would allow to include further video provider at a later stage through a simple interface which could even be made configurable with the service evolving.

The requirements I defined for the service are:

Retrieval of video asset information from multiple sources

In order to provide the most possible value to the end user the visual search should aggregate multiple sources and provide a categorized visual search XML document to Internet Explorer.

Sources should be accessed in a non-sequential non-blocking manner

The Visual Search functionality is very performance sensitive because its sole purpose is to provide a preview of search results or suggestions while you type. And as we are usually typing quite fast the service ideally needs to respond as fast as we type. However from my experience many people as they get used to the value of the preview take some more time to type and skim through the results. However performance is one of the crucial non functional requirements of such a service. So I split the search operations on the different video sites up into different threads which signal the main thread when they are finished and the final result message can be assembled and send back to the browser. As this already has some great impact on performance I also defined a timeout for the main thread to wait for the search workers to finish which ensures quality of service to the search users.

Source specific search controllers which translate the incoming feed information into the service specific data model

Since all of the APIs are different in the form how they issue data each one has to be handled separately. For the services used this means that there are two search controllers which prepare the incoming data in order to transform it into the XML structure needed by the visual search feature. The effort depends on the structure of the underlying APIs. In my example the YouTube API is a bit easier to use since they already offer .Net client libraries for easy consumption. In the case of metacafe we need to care about the network operations and the parsing of the response message from the service a little bit more.

Caching functionality to reduce costly network access and time-consuming processing of the incoming responses

Again this is something that is very much related to performance but also needs some careful considerations because caching one one hand greatly boosts the services ability to respond to the service requests that fire against the service as you type however it also introduces the risk of sending outdated results to the browser. Therefore the invalidation time needs to be carefully defined. Most important to cache are also probably the one or two letter searches which are rarely of relevance but would require a full roundtrip of the search service whenever a search is started being typed.

Robust and stable hosting environment

A service like this which could easily be used by millions of users needs to be very robust and stable. Since this is already a challenge for the service application itself this is also true for the hosting environment. As I didn't want to care to much about this for my example I chose to host the WCF Service in Internet Information Service 7 as this is a production proven high scale hosting environment for web services.

So the high level architecture of the service looks like the following:

Technologies used for the search service are as follows:

That's all for the introductory and overview part. In the next parts we dig a bit deeper into the into the architecture and the components.

And in order to give you a little preview of what you can expect here's a screenshot of the service in action.

Bookmark this on Delicious

Attaining IE8 Site Compatibility - Short Reference

Alex Strauss — Wed, 22 Oct 2008 17:01:00 GMT

Ok, once again some information regarding the new IE8. This product is occupying me quite a bit however I think it is important to tell the story about better W3C standards compliance and new compelling and easy to develop extensibility and what that means to users and site owners. Especially standards compliance unfortunately is something that may introduce the need to act for many site owners. What that means is that IE8 by default renders in the most standards compliant mode it supports however this may break the experience of existing sites if the site owner doesn't take actions since the markup and style information sent to browsers identified as Internet Explorer is not standards compliant or is optimized for older browsers. Luckily there is remedy for this issues and some of them are quite simple and can be implemented with a minimum of effort. Since those possibilities are already comprehensively documented on Microsoft websites I don't want to dig into the details of every aspect about how to attain site compatibility. But since I found that the resources are scattered across many different pages I want to summarize the possibilities and list them in a short, clear and easy to follow way in this blog post. There are two categories of changes that you can bring in in order to have your site rendered correctly. One is to tell Internet Explorer 8 to use a backwards compatibility mode to render the page or to alter the page markup and styles to reflect the latest W3C standards supported by IE8. So what is necessary to do so? Here are the compressed instructions.

Tell Internet Explorer explicitly which document mode to use

To do that you can place a meta-tag into the <head>-Section of your pages or page templates. The tag has the following name and format:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

The content attribute of the tag accepts the values IE=5, IE=EmulateIE7, IE=IE7, IE=8, IE=Edge (or anything else however this could lead to unexpected behaviors ;)). The values, except for the "Edge" mode are probably self explaining however if you want more information there is a good explanation about those modes on the MSDN page already mentioned.

You can instruct your webserver to add a custom header to the http-response when your pages are sent to the browser which has the advantage that you don't have to alter all your pages or templates but you are still able to control the rendering behavior in a very granular way since the header can be applied on an per application basis or for pages only that match a certain pattern.

For IIS such a header can be applied by inserting a <customHeaders> section into the web.config file for the application like outlined in the sample below.

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

<system.webServer>

<add name="X-UA-Compatible" value="IE=EmulateIE7" />

</customHeaders>

</httpProtocol>

</system.webServer>

</configuration>

For an Apache 2.x webserver you need to add a Header directive to the httpd.config after enabling the headers module by uncommenting the LoadModule directive for the mod_headers.so module. So the LoadModule and the Header directive looks like outlined below.

LoadModule headers_module modules/mod_headers.so

Header set X-UA-Compatible IE=7

If the you configure your webserver to set such a header and a page also includes a meta-tag already like described in 1.2.1 the tag in the markup takes precedence over the header set by the server.

Deliver W3C standards compliant web documents
1. Update your pages to reflect the latest W3C standards supported by Internet Explorer 8. The changes which were implemented in order to attain standards compliance are documented on MSDN.
2. Since option 2.1 means quite some implementation and testing effort there might be already a solution that reduces, at least the implementation efforts for quite a bit and that is to use a site version that may probably be already available, e.g. the pages that you send out to other standards compliant browsers like Firefox. So the solution is to use the user-agent string to identify Internet Explorer 8 and to send back the pages also used for other browsers. The technique to evaluate the user-agent string to identify certain browser versions is already commonly known and used however for those of you who want to have in depth information about that can consult the documentation about user-agents, the detection of browser versions and how to evaluate them using regular expressions. The relevant part of the IE8 user-agent string however looks like this:
  
  Mozilla/4.0 (compatible; MSIE 8.0…
But remember that Internet Explorer still is the released IE version with a significant market share and it will probably be around for another couple of years. So it would be not wise to follow a IE8 strategy only but keep a IE7 version as well. How strategies for versioning in conjunction with browser detection and conditional comments can be set up is briefly outlined in this whitepaper.

Of folks, I hope that this condensed reference is of some help to you and finally I will leave you with the call to action

Come Get Some...Thoughts On Software Technology

IE 9 pinned mode and else demo page

Do Enterprises Need An Independent Browser Strategy?

A Few IE8 Tips for Developers And IT-Professionals

Application Partitioning with MEF, Silverlight and Windows Azure – Part II

Application Partitioning with MEF, Silverlight and Windows Azure – Part I

Tales About Working With The Azure Service Management API – Chapter III

Tales About Working With The Azure Service Management API – Chapter II

Tales About Working With The Azure Service Management API – Chapter I

DHL Shipment Tracking Accelerator for IE8

Installing IEAK IN A VPC without Disk Space Determination

Win7 your Visual Search if it speaks RSS

Update: Enterprise RIA Project Now Running on Silverlight 3 Release Version

The Music Industry – Your Dear Pals

Silverlight 3 Business Applications Made Easy

Radio GaGa New Version And Live On Windows Azure

The ViewModel Pattern in Silverlight – An Example

Physics, Silverlight and Visualization…Update!

Short Gotcha When Working With Extent Initialization In ‘M’

Building a Visual Search Service for IE8 with WCF - Part V

Using IE8 Beta2 IEAK with RC1 Bits

Building a Visual Search Service for IE8 with WCF - Part IV

Building A Visual Search Service For IE8 With WCF - Part III

Building a Visual Search Service for IE8 with WCF - Part II

Building a Visual Search Service for IE8 with WCF - Part I

Attaining IE8 Site Compatibility - Short Reference

To get compliant today to guarantee a seamless experience when users come to your site with IE8!