Andrej Tozon's blog

In the Attic

NAVIGATION - SEARCH

photoSuru install experience

Realizing that i don’t have any decent photo slideshow player installed on my machine I thought I’d install photoSuru and see what it can do for me.

photoSuru

While it’s a beautiful subscription-based WPF photo viewer, built on a Syndicated Client Experiences (SCE) Starter Kit , it was something else that caught my eye:

install

What kind of installer is this? Looks like the application itself… did I already install it and it’s now updating itself?

Yes, photoSuru is a ClickOnce application. Deployment-wise, it uses a hybrid MSI/ClickOnce installer, providing a consistent look, matching the appearance of the application itself. If you’ve deployed any ClickOnce application before, you know that you had no power to change that dull install dialog in any way.

.NET 3.5 SP1 changed this. With SP1 installed, you now do have the power to customize and brand your application’s progress dialog, including optional end-user license agreement page, localization, etc., you just have to do it all by putting together a bunch of Xml files, describing what you want it to look like.  Yup, there is no visual support for this yet (as in Visual Studio 2008 SP1). The future looks bright, though. Client Profile Configuration Designer is currently a part of WPF Futures, a taste of what is about to come. You can download and play with it - it’s certainly going to be of some help to you, at least to get you started and set up the basic dialogs and progress flow, but you might still have to get into the Xml files to fine-tune some details.

I’ve tried the CPC Designer with one of my WPF apps some time ago and I did manage to put together a quite decent looking installer, it just took me more time as it would if I went with the default ClickOnce option. But that goes without saying, doesn’t it?

Silverlight TreeView: MVVM and editing [5 – Add]

In the previous post, we enabled editing for our TreeView. The last operation we need to implement is adding a new item to the hierarchy. With our tree item editor in place, there’s not so much left to do…

The only change we need to make with the View is add an Add button, right next to the Edit button. We’ll wire it to the Add command, which already exists.

The next stop is the ViewModel. We need to change the existing OnAddTopicExecuted handler to add a new child to the HelpTopic, passed into the method through CommandParameter:

private void OnAddTopicExecuted(object sender, ExecutedEventArgs e)
{
    HelpTopic topic = new HelpTopic();
    HelpTopic parent = e.Parameter as HelpTopic;
    if (parent == null)
    {
        HelpTopics.Add(topic);
    }
    else
    {
        parent.SubTopics.Add(topic);
    }
    topic.BeginEdit();
}

Note: when CommandParameter is not set to a valid HelpTopic (when it’s null), we’re adding a child to the root.

There is something wrong with the code above. I’m assuming that the SubTopics collection was already initialized when I created a new HelpTopic class instance. I this case, I assumed wrong and the above code would throw a nasty error.

I need to assure that SubTopics property is never null as this puts the HelpTopic in an invalid state. I’ll do that by inserting the collection initialization code in its constructor:

public HelpTopic()
{
    SubTopics = new ObservableCollection<HelpTopic>();
}

Better. But we’re not done yet. There is no way for user to cancel the newly added item. Sure, she can press the Cancel button when editing, but the node will not be removed from the tree.

This is the time to provide the HelpTopic class with an unique identificator field. When working with the database, the type of this field would align with whatever your database table primary key type is. For simplicity, I’ll use Guids here, just because their generation results in more unique results than a number randomization would.

The logic behind is this: when a new HelpTopic is being added, its Id is set to null. If the item is confirmed, the new Id is set, otherwise the item is removed from the hierarchy. Here’s how modified OnEndEditTopic and OnCancelEditTopic now look like:

private void OnEndEditTopic(object sender, ExecutedEventArgs e)
{
    HelpTopic topic = e.Parameter as HelpTopic;
    if (!topic.Id.HasValue)
    {
        topic.Id = Guid.NewGuid();
    }
    topic.EndEdit();
}

private void OnCancelEditTopic(object sender, ExecutedEventArgs e)
{
    HelpTopic topic = e.Parameter as HelpTopic;
    if (!topic.Id.HasValue)
    {
        topic.RemoveFromStructure(HelpTopics, item => { return item.SubTopics; });
    }
    topic.CancelEdit();
}

Wait! Before we end this, let me just put another button in a TreeView to enable user to add a new HelpTopic to the root of the tree. This is the modified template with a new button in place (added lines in bold italic):

<ControlTemplate TargetType="slt:TreeView">
    <Grid x:Name="Root" >
        <Grid.Resources>
            <SolidColorBrush x:Key="BorderBrush" Color="#FF000000" />
        </Grid.Resources>
        <Border x:Name="Border" BorderBrush="{StaticResource BorderBrush}" 
            BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2"> <Border Padding="{TemplateBinding Padding}" Background="{TemplateBinding Background}" Margin="1"> <ScrollViewer x:Name="ScrollViewer" HorizontalScrollBarVisibility="Auto"
                    VerticalScrollBarVisibility="Auto" Background="{x:Null}" BorderBrush="Transparent"
                    BorderThickness="0" IsTabStop="False" TabNavigation="Once"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Button HorizontalAlignment="Left" ToolTipService.ToolTip="Add Topic" input:CommandService.Command="AddTopic"> <Image Source="/EditableTreeView;component/Resources/add.png" Stretch="None" /> </Button> <ItemsPresenter x:Name="TreeItems" Grid.Row="1" Margin="5" /> </Grid> </ScrollViewer> </Border> </Border> </Grid> </ControlTemplate>

Editable TreeView

OK, we’ve got our TreeView to allow basic inline editing now, but not in very realistic scenario and it lacks usability. I’m going to end this series with this post and spin off to more general topics posts, covering more MVVM, LOB scenarios and Silverlight in general. A taste of things to come: improving, extending and expanding on the current state of this sample, going over the wire, testing and user experience.

The source code for this sample is available:

I put a Tag on you…

This blog has been tagged.

Tag

Microsoft Tag Reader is available for a range of mobile devices, including iPhone. This is the second (I think) Microsoft app available in the iTunes Store - a way for Microsoft to introduce and promote their latest technologies to the Apple crowd.

I snapped a few tags I could find online. The results were at 100%, showing that the technology is quite stable and reliable... Just wondering how long until these “visual URLs” appear in the real life…

Sing a Songsmith

US_Prd_Bx_Tilt_L_Song_SmithBeen playing with a Songsmith a little today. It’s a music generation software, but with additional twist: you’re doing the vocals and Songsmith stands in as your backing band. It’s actually following your singing by choosing the right chords to match your voice in real time! Using it really gets as easy as pressing the record button and starting singing. There’s plenty of musical styles to choose from and even more can be downloaded. You can also fiddle with instruments, used in your song - e.g. replace acoustic guitar with a distorted electric one.

What can I say… it sounds great. It should provide countless of hours of fun with your young one, providing that she/he likes to sing of course… but which kid doesn’t. And if you really suck at singing, it may make you look… well, not so bad :) If it was also available for a mobile device, you could turn your life into a musical...

Guys from Microsoft Research made this a great app for a v1. More style, arrangement and instrument tweaking should make it into the next version to make it more interesting for non-beginners. And a MIDI support would be great.

Oh, did I mention it's a WPF application?

WLW: spell checker for your language

With the latest RC release, Windows Live Writer introduced a couple of new languages for spell checking, including Slovenian. But there’s a catch – you won’t get any of them when you install the English version of Windows Live Essentials(a fancy name for all Live products, available through the same installer). Installing the English version will only get you English dictionaries, namely Australia, Canada, UK & US.

To get your Writer’s spell check your posts against your preferred language dictionary file, you have two options:

1. Download and run the Live Essentials installer for the language you want, then browse to the c:\Program Files\Windows Live\Writer\Dictionaries\ folder and get the files for your language (mssp3SL.dll and mssp3SL.lex for Slovenian language or equivalents for other languages). I installed this on my testing laptop so I didn’t have to uninstall the current version on my working machine. If you don’t have a spare machine, you’ll have to do a bunch of installs/uninstalls on one single machine to get everything back to where it was, plus gain your new dictionary files.

2. If you’re using Microsoft Office and already have a spell-checking option for your wanted language (either you installed localized version of some Office product or you installed additional Office Language Packs), the chances are you already have the necessary dictionary files on your machine. Browse to the C:\Program Files\Common Files\Microsoft Shared\Proof\ and look for the dictionary files (mssp3SL.dll and mssp3SL.lex or equivalent for your language (last two letters of the filename represent the language code). Copy those to Writer’s Dictionaries folder (c:\Program Files\Windows Live\Writer\Dictionaries\), restart the Writer and you’re good to go.
Note: I’m not 100% certain this is the case for any language available, but I found that for Slovenian language, both Office and Writer’s dictionary files were exactly the same! I also tested this with a couple of other dictionary files from my Office Proof folder and had no problems using them.

Windows Live Writer 2009 is currently a RC; the final release will hopefully make the process of adding additional language dictionaries easier by either:

  • using Office dictionaries, if available
  • releasing separate language pack add-ons

UPDATE: Windows Live Essentials RC, released a month, became RTW/final yesterday. It's the same version, so no need to upgrade if you already installed RC.

ICEing the Nativity Scene

In my previous post I briefly described the process of creating a large Deep Zoom image with Microsoft Image Composite Editor. This post is going to present the steps I took with ICE in a little bit more detail, just to show its power.

As I mentioned in that post, I shot the scene with 24 (6x4) - kind of - detailed photos, which gave me the following set (arranged with the Deep Zoom Composer):

It doesn’t take a very detailed examination to notice how partial set photos are not distributed evenly, bear different lighting and some of them even being way out of focus. Now let’s see how ICE works it’s magic…

The ICE UI is simple as it is with Deep Zoom Composer. One thing I don’t get though is that I have to start it twice before the app actually appears on my desktop. Anyway, here’s how it looks when started:

image

The instructions couldn’t be simpler – I just had to drop all part photos onto editor’s main space and let it process them. After a minute or so, I got this:

image

Notice the perspective corrections? Camera motion setting was set to Rotating motion, which obviously hinted the processor that the scene was set from one single spot (like panorama). There is an option to adjust perspective and projection, which I simply didn’t need to do in this case.

Next were the crop settings – Automatic crop selects the optimal rectangle to exclude empty spaces:
 image

The Export sections offers a couple of options: your creation is exportable in a number formats, which selection varies depending on a scale setting. With the largest scale (100%), available formats are: TIFF Image, HD View Tileset and Deep Zoom Tileset. Smaller thumbnail creation is optional. Deep Zoom Tileset was the one I wanted, but before hitting the Export button, I took some more time to adjust the selection rectangle on the left to exclude an unimportant part of the scene:
 image

After clicking the Export Button, I was asked for a target directory and the project name. After that, the processor took over for a few minutes to render the output, which resulted in a ready-to-publish Deep Zoom folder.

Talking about publishing Deep Zoom/Silverlight content, here’s a little trick: if your hosting provider doesn’t have MIME types for Silverlight apps set up correctly, you can rename your XAP file to ZIP (including any references to it in accompanying files) and your app should still work.

The final result can be seen in the original post.

Deep Zoom Christmas Nativity Scene 2008

Setting up the nativity scene for the Christmas holidays has been my family tradition going back way before I was born. Most figures are dated back to my grandparents era, while the others (mostly sheep) were gathered over the years.

Each year, the scene setup is determined by a couple of factors, like the current inspiration/mood, the place to set it up and starting this this year – accessibility; we really don’t want our little munchkin do some redecoration on her own :) So this year I set it up on the less accessible place and made it a little bit smaller than usual.

At the same time, I wanted to try out the Microsoft ICE (Image Composite Editor), an amazing (free) piece of software, coming from Microsoft Research, which is doing a brilliant job at stitching your partial photos of the same subject into one really big photo, preserving the original resolution. The latest version has an option to export the final scene as a Silverlight Deep Zoom image, and this was the one that I was interested in trying out.

First, I tried to shoot a large number of really small and detailed photos (like 20 photos in one row by 10 rows), but soon realized that the place wasn’t getting enough light and/or my lenses were not up for the job. Also, this was an experiment rather than a professional job, so instead of bringing in more light, I decided to go smaller (6x4 photos only). Much less time consuming, I tell you… Anyway, I was very doubtful about the final result, because the exposure settings were not consistent throughout all photos and I left the autofocus on. I did try to keep the aperture small and constant for a decent DoF, but the shutter speed value kept going through the roof :)

Now, given the fact that I wasn’t really trying that hard, the final result looks very good for convincing me to give some more time and effort into my next panoramic photo projects.

And here it is – our Deep Zoom-ed Christmas Nativity Scene 2008:

Side note 1: with SeaDragon technology (the one behind Deep Zoom) coming to iPhone [Seadragon Mobile], I can now carry this image with me in my pocket :)

Side note 2: and how’s that for an original nativity scene? :)

Goodbye Community Server, hello BlogEngine.NET

I was thinking about switching this blog’s engine for some time now, mainly because I was stuck with Community Server 2007 (.NET 1.1!), not playing along with any further upgrades. Too much custom actions and customization, I guess. Meanwhile, Community Server went mainstream and developed into a really big and complete community solution (blogs, forums, wikis, galleries, …), while I only needed a simple blog engine.

I became more alert about the BlogEngine.NET after our local MS DPE’s set up their blogging site. Loving its simplicity and responsiveness, the idea of migrating to a new engine was becoming stronger by the day, until I gave in and gave it a try. Note: the root of all evil lied in the fact that my blog is hosted on my hosting provider servers with limited access and other options. 

The setup couldn’t be easier – copy the files. The tricky part was migrating the data. Hopefully, others have been on the same path before me (here and here), so I just had to adapt those sql scripts a little and get rid of all the spam, which found its way into my database through all these years. The new database is currently 20x smaller than the old one, which sure sounds good too.

I’m not completely saying goodbye to Community Server though. SLODUG, SLOWUG and Spletomanija communities will continue to run on Community Server, which fits perfectly for the job.

Also of interest: BlogEngine.NET is a part of Sueetie.

And yes, I’ll do some work on this site’s visuals…

Developing for ASP.NET mobile

Visual Studio 2008 introduced a lot of new features to support new technologies, adding some cool new designers to developer’s tool belt. On the other hand, support for some technologies was simply left out, leaving a some developers very unhappy. One of those was support for SQL Server 2005 BI projects (including 2005 Reporting Services).

A (long) year after its release, I learned that there was another feature dropped in VS2008 – support for designing ASP.NET mobile web forms. This doesn’t mean you can’t develop, compile and publish ASP.NET mobile forms; it simply means they pulled out the designer and mobile forms item templates out of Visual Studio 2008. Getting item templates back is the easy part, you can get them here. For the design view support, I’m not currently aware of any plans to put it back in the future.  But really – with mobile browsers getting more powerful each day, capable of rendering rich(er) (x)html, do we still need the simplicity and extendibility of ASP.NET mobile forms? For the time being, the answer may still be yes, if you’re planning to support a wide range of mobile devices. Whatever the future, the current (un)support for ASP.NET mobile in Visual Studio works for me. It’s true that I’m unable to design mobile forms in design view, but I do that rarely even with their bigger brother - ASP.NET web forms.

ASP.NET? Mobile?

Strangely enough, I’m doing more web than client development lately. Go figure.

Speaking of webby/clienty things… Silverlight 2.0 RC0 was just made available. Downloads include Microsoft Silverlight Tools for Visual Studio 2008 SP1 and Microsoft Expression Blend 2 Service Pack 1 Preview. Note that Microsoft Expression Blend 2 SP1 is a replacement for Expression 2.5, which is no more.

Splash Screen in WPF 3.5 SP1

Besides improving application startup time, .NET Framework 3.5 SP1 also allows developers to add a splash screen to WPF applications. The splash screen is shown using native code, even before WPF application starts to load. In reality this means the splash screen would show immediately when application is started, and fade away a couple of seconds later, when application is fully loaded and main screen displayed.

WPF Splash screen is just and nothing more than a plain bitmap image. Common formats are supported, and if you use a PNG format with a specified alpha channel, transparent areas will be shown accordingly. Just remember to keep it small. Choosing a couple of megabytes large bitmap for your splash screen won’t reduce the loading time. Adding additional information to the image during runtime (title, version number) is also not possible; everything you want to show should be designed in advance and incorporated into a single image.

WPF splash screens can be added to an application in two ways:

Showing splash screen manually

1. Create a new PNG image, which will be your splash screen.

2. Start your Visual Studio 2008 SP1 and create a new WPF project. [make sure .NET 3.5 is specified as the target FX]

3. Choose Project | Add Existing Item… Find and select your splash screen image.

4. Open App.xaml file in design view and look in the properties window ;)

Events in VS2008 WPF designer

Yes, there’s an event panel in WPF designer! And properties/events sorting option buttons!

5. Create a Startup event handler:

   1: private void Application_Startup(object sender, StartupEventArgs e)
   2: {
   3:     SplashScreen screen = new SplashScreen("sp1splash.png");
   4:     screen.Show(true);
   5: }

6. Compile and run.

The SplashScreen constructor takes the name of the resource, which is a splash screen image. The boolean parameter in the Show() method specifies, whether the splash screen should fade out when application is fully loaded. False means you’ll have to hide the splash screen manually using the Close() method.

If you don’t like writing code, this gets even easier:

 

Showing splash screen declaratively

1. Create a new PNG image, which will be your splash screen.

2. Start your Visual Studio 2008 SP1 and create a new WPF project. [make sure .NET 3.5 is specified as the target FX]

3. Choose Project | Add Existing Item… Find and select your splash screen image.

4. Select the newly added image in the solution explorer and show its properties.

5. Change the Build Action to SplashScreen.

6. Compile and run.

The splash screen shows immediately upon the application startup and fades out when the main window is loaded and shown. How’s that for cool new user experience :)

 

Additional note: SplashScreen class works in WPF desktop apps only, XBAPs have their own mechanism for starting up.