How the Surface RT became the most reliable Server in our house (Co-starring: Azure and Windows Phone)

I loved my Surface RT from the beginning. The reason why I preferred the Surface RT over the Surface Pro was that the Surface Pro was too small for me as a Notebook, and too heavy as a tablet. So I was always the Notebook+tablet-guy, and not the one-device-for-all-guy. But you know, this might change with the Surface 3.

Ok, now to this story. When I bought the Surface 2 (RT) last year, my Surface RT was a bit unused, as the new version was more light-weight and faster. But I haven’t sold my Surface RT, cause I think it’s still an awesome device. My wife and our kids also loved that device, especially for viewing family-pictures, but they also preferred my new Surface 2. So the Surface RT was a bit unused these days. But since 3 months the Surface RT is again the new superstar in our house.

It all started in early spring this year when we had a lot of break-ins in South Germany, and so in the street I’m living with my family. We already had the issue before the break-ins started that we were not able to see who’s on the other side of the front door. So with that break-in-wave I decided to put some cameras around our house, and I had some requirements:

  • Everyone should be able to see who’s behind the front door
  • Everyone should be able to see around the whole house from inside
  • Cameras should have infra-red-support for night vision.
  • I want to access the cameras from everywhere around the world

I asked an electrician for an offer. But it was just too expensive, and additionally he said he needs to slit some walls, which would cause even more costs as additional work is needed to fix all that. Beside those points my “Nerd”-adrenalin was increasing with every day while I was thinking about my requirements. And so I came up that this project is a totally great project for me – just for me (and you, my faithful blog-reader). So I planned to do the whole stuff on my own.

The whole project can be split up into four parts I want to show you now:

  • Installing the IP-Cameras
  • Surface RT as a Central Point
  • Surface RT connected to Microsoft Azure
  • Windows Phone as a Client

So let’s start with Part I

Part 1/4 – Installing the IP-Cameras

After I looked at the footprint of our house intensively, I planned to install 7 IP Cameras. That number of cameras is necessary to see every area around our house. I drilled holes, crimped RJ45 network cables (yes, I didn’t want to use WiFi for that project. Reason is just to keep electric smog as low as possible), branched off additional plug sockets etc. In the end I had the seven cameras connected to my home network via ethernet-switch. The picture below shows this.


After a lot of research I decided to buy IP Cameras from Vivotek, I took the model IP8332. I tested quite a few, and those where in my point of view really good ones and worth the price. They have a 1280×800 resolution, infrared and they support Power-over-Ethernet. Below a picture of two cameras under the roof framework in 4m height (yes, this project also required to buy a new ladder. :-))


Part 2/4 – Surface RT as a Central Point

After I had installed all cameras, I wanted to have a central point in our house where anyone could view them all. Especially the camera at the front door. And that’s where my Surface RT came into the game. I connected the Surface RT also to the same network the IP cameras are in, like shown below.


It took me about 3 hours to build an app that grabs the Video-Streams of my seven cameras, that never closes and that is always running. I placed the Surface RT on a sideboard that stands at a central point in our house. Every time you go to the front door, you’ll pass that point and you can see who’s outside. Here’s a picture what it looks like:


Clicking on one Camera-image will zoom it up to 100% of the screen (of course with a nice animation). In addition I added a USB-to-Ethernet-Adapter to the Surface RT, as we’re turning off our WiFi during the night. But of course the device should still run.

So now I already met three requirements:

  • Everyone should be able to see who’s behind the front door
  • Everyone should be able to see around the whole house from inside
  • Cameras should have infra-red-support for night vision.

Only one requirement is missing

  • I want to access the cameras from everywhere around the world

I thought that’s an easy one, but there was a problem. Let’s look at that problem in an excursion

Excursion: IPv6 and IPv4

My provider gives my only a physical IPv6-address, but no physical IPv4-address. This is called Dual-Stack-Lite (more here on Wikipedia). When I call an IPv4-server, that call goes in the first step via IPv6 to a proxy of my provider, and from there with a physical IPv4-address to the target host. Unfortunately that IPv4-address is shared with many other users. I never noticed that while I was using the web as a client. But now I wanted to serve the camera-images from my Home-Network.

First trial was to do a Port-forwarding on my Router to the IP-Addresses of my cameras. But the problem is, I don’t have a physical public IPv4-address. My IPv4-address is shared with many other users, and it’s the address of the proxy. I’m not able to reach my home-network with IPv4, the call will end at the proxy!

Ok, so only IPv6 will work.

Second trial was to use IPv6. But then the next problem popped up. The whole mobile communications network in Germany (and also in other/most parts of the world) runs still with IPv4. So to access IPv6-stuff from my mobile, I need to go through another proxy that does the translation from IPv4 to IPv6 and back.

Puh, what a mess. When you read in forums about private NAS (Network attached storage)-systems, you’ll find a lot of that IPv4/IPv6-stuff. But I didn’t like the existing workarounds, and I came up with another idea.

I had the idea of the Hollywood-principle that you might know from developing applications: “Don’t call us, we call you”

Part 3/4 – Surface RT connected to Microsoft Azure

Yes, due to the IPv6/IPv4-issue, I’m not able to access my Home-Network from the Internet in an easy way. But I can upload things from my Home-Network to the Internet. So I had the idea to upload compressed images from my 7 cameras every second. So I need a service that does that job.

As I already had a 24h/7days-running-Surface RT-device, I thought maybe the Surface RT could do that job in addition – beside displaying live-images of the 7 cameras.

But where shall I put those images? For me Microsoft Azure seems to be the perfect place. I could create a secure Azure Website or any other client.

Yeah, that sounds good. I decided to go that way down the road. I extended the Windows Store App running on my Surface RT to upload compressed camera images every second to Microsoft Azure. The connection is done via https. The picture below shows the architecture:


As the camera-images are very small, I thought Azure’s Blob Storage would be a bit overkill for that scenario. So I decided to use Table Storage on Microsoft Azure. I created a simple table that contains the current images of all seven cams. And my Surface RT uploads those images every second. And guess what: My Surface RT does this job without break since three months. And everytime we’ve a visit in our house, people say: “Wow, how crazy is that”. And they think the Surface RT is just displaying a live-view of the cams, but you know now, it’s doing more.

(Btw: The costs for Microsoft Azure are below 2€/Month. If you’ve a MSDN-Subscription, you’ll have 150$ for free)

Part 4/4 – Windows Phone as a Client

Now I’ve all my current camera-images available in Microsoft Azure. So I can do whatever I want with them. I decided to create a Windows Phone App just for me. So I can connect with my Windows Phone to the fresh data on Microsoft Azure that is provided by the most reliable server in our house, the Surface RT. The image below shows the final architecture.


The Windows Phone App does a polling on Microsoft Azure. That’s not the best battery-saving-way, but fine if you just want to view if everything is alright at home. Below is an image of my Lumia 920 that runs the application:



As you can see, the Surface RT, Microsoft Azure and Windows Phone are doing their job really really well. It was simple to build up that architecture, and I was able to fulfill all the requirements I had:

  • Everyone should be able to see who’s behind the front door
  • Everyone should be able to see around the whole house from inside
  • Cameras should have infra-red-support for night vision.
  • I want to access the cameras from everywhere around the world

Alright, after a break when I bought the Surface 2 my Surface RT is used again and more than ever before. And everyone in our house is loving it. Today even my youngest daughter (1,5yo) runs to the Surface RT when the doorbell rings to look who’s waiting behind the front door.

Thanks for reading,

BASTA! Spring 2014 – slides and demos

At this year’s spring edition of the BASTA! Conference ( I gave three talks:

  • Windows 8.1 – UI Neuerungen
  • All you need to know about XAML
  • Asynchronous Programming with C#

Thanks to all the people who joined my sessions. I hope you liked them. If you’ve any feedback to share with me, feel free to contact me via this link.

You can download all slides and demos here:

Thomas talks

It’s there: Windows Store Apps with XAML and C#– the ultimate handbook

Wow, it’s done. The ultimate handbook about Windows Store Apps with XAML and C# is printed and available. You can order your copy of the German-written 1146-pages-book on amazon: Windows Store Apps – das umfassende Handbuch

Find more information about the book on amazon, on my homepage and on the publisher’s website on

Training on Windows Store Apps

In Germany, Switzerland and Austria I’ll give a three-day-training on Windows Store Apps. If you or your company have interest on this professional training, directly contact me via It is possible to train you in the Trivadis-Trainings centers or onsite at your office.

So far so good, let’s look at the past and the future

The past

Puh, this was year was really instensive. Here the straight plan I had so far:

  • January: Buy new home
  • February: My second daughter Sara was born.
  • March: Finish the manuscript for the book
  • April:Renovate and improve new home (thanks to Makita Zwinkerndes Smiley)
  • May: Move
  • … in all months: Working as a consultant and trainer @Trivadis.

The future

So the future contains much more spare time, it’s necessary, because I say “Time is money is not true, time is unpayable”. I want to spend as much as I can with my kids, my wife, family and friends (See also this awesome post from Tim on that topic). So the future plan looks like this:

  • June: Finish a WPF-project as a consultant and enjoy the free weekends
  • July: Parental leave Smiley
  • August: Parental leave Smiley
  • September: Back to work, speaking at basta ( and at Trivadis-internal TechEvent

Keep on rockin’

Dragging Elements in Windows Store Apps

In Windows Store Apps there are three kinds of Touch-Events:

  • Gesture Events – those are high-level-events like Tapped or RightTapped.
  • Pointer-Events – low-level-events like PointerPressed, PointerMoved, PointerReleased.
  • Manipulation-Events – low-level-events for multi-touch actions like rotate, scale or transform an element.

Pointer-Events consolidate Touch-, Pen- and Mouse-Input. So on the UIElement-class from WinRT you wont find Mouse-Events known from WPF/Silverlight like MouseLeftButtonDown.

In my upcoming Windows Store Apps I want to show how Elements can be dragged/moved with Pointer-Events. You can download the code of the sample here:

MovingElements, or in German ElementeVerschieben-Sample

The app looks like below. By touching an empty space in the yellow area, an Image is inserted. The image can be grabbed with a finger or with the mouse-cursor and moved around. The app works also with multiple fingers. You can grab multiple images at once and move them around.


If you´ve feedback to the code, feel free to comment. Smiley 

As I´m really busy the next weeks/months with the writing of the Windows Store Apps-book, I´m not able to give you big support on the code. Use it or not.


Microsoft TechDays – WinRT-Controls Deep Dive: FlipView, ListView, GridView & SemanticZoom

Danke für die zahlreiche Teilnahme an meiner Session zu den WinRT-Controls zum Entwickeln von Windows Store Apps. Es war eine Level 3 (von 3) Session. Wie versprochen sind die Slides und Live-Demos unter folgendem Link verfügbar:

Bei Fragen, Feedback, Lob und Kritik einfach eine E-Mail an mich:
Mail an Thomas


Windows Store-apps: WinRT XAML vs. Silverlight XAML

This post is part of a series about creating Windows Store-apps with XAML and C#. Find the Content of the series here:
Windows Store-apps with XAML and C# blog-series

Last weekend I’ve finished the XAML-chapter of my upcoming book about developing Windows Store-apps with XAML and C#. I want to share the things that you should know about the WinRT XAML – the way I call it here – if you’re familiar with Silverlight or WPF.

The WinRT XAML is much like the XAML we know from Silverlight. But there are some differences in WinRT XAML:

  • the way you use your custom namespaces is different
  • there are some missing things (TypeConverters, Custom MarkupExtensions)

Let’s look at the two parts

Use custom namespaces

There are two ways in XAML to use a namespace:

  • 1:1-Namespace-Mapping
  • 1:n-Namespace-Mapping

Read the difference for both in Silverlight- and WinRT-XAML below.

The 1:1-Namespace-Mapping

Let’s assume you’ve the following class:

namespace UIRocker.Special
  public class WindowsEight
    public bool IsGreat { get; set; }

To use this class in Silverlight-XAML, you’ve to add an Namespace-Mapping like this


or like this if the CLR-Namespace is in another assembly than the XAML-file containing the Namespace-Mapping below: 


With the Namespace-Mapping the classes from that Namespaces can be used with the chosen alias. The alias is “rocker” in the snippets above, so the WindowsEight-class can be used as below:

<rocker:WindowsEight IsGreat="True"/>

In WinRT-XAML you’re using the class in the same way as above, but the way of creating the Namespace-Mapping is different. Instead of using the syntax with “clr-namespace…” you use:


You don’t care if the Namespace UIRocker.Special is in another assembly as the XAML-file or not. This works exactly the same way as the using-directive in C#, where you also don’t care if the Namespace is in another assembly than the .cs-File or not. So, great improvement, but creates a little incompability with Silverlight-XAML.

The 1:n-Namespace-Mapping with XmlnsDefinition-Attribute

The Namespace-Mappings above have been 1:1-Mappings. One XML-Namespace was mapped to one Silverlight/WinRT-Namespace.

In Silverlight-XAML you can create a 1:n-Namespace-Mapping by placing the XmlnsDefinitionAttribute (Namespace: System.Windows.Markup) on your assemblies like this:

[assembly: XmlnsDefinition(
[assembly: XmlnsDefinition(
  "", "UIRocker.Mvvm")]

Classes out of the Namespaces UIRocker.Special and UIRocker.Mvvm can be used in XAML with one alias by making a 1:n-Namespace-Mapping like this:


Unfortunately in WinRT-XAML there is no possibility for a 1:n-Mapping. The Namespace Windows.UI.Xaml.Markup contains a XmlnsDefinition, but it’s not an attribute, it’s a struct and therefore not usable.

Especially when you create a library with many Namespaces in it, it’s great to use just one alias for the library in XAML. Maybe the next Version of WinRT will contain such a mapping. By the way, first versions of Silverlight also didn’t support 1:n-Namespace-Mappings.

Missing things in WinRT-XAML

There are a few other things that are not in WinRT-XAML or behave differently. Let’s take a look at them.


As XAML is XML, every Attribute contains a string-value. This string-value needs to be converted into the value of the property-type the attribute represents. For primitive types like double, float, int, bool, char etc., the conversion automatically is done by the XAML-Parser (Silverlight and WinRT). Also for Properties of type enum, the XAML-Parser tries to convert the specified string-value into the enum-type of the property. There is also a conversion for some central types hardcoded in the XAML-Parser of Silverlight and WinRT, e.g. the Brush-Type. This conversion allows you to assign a string in XAML where a Brush-Instance is required:

<ListBox Background="Red">

The XAML-Parser takes the “Red”-string, creates a SolidColorBrush with the Color Red and assigns it to the Background-property of the ListBox.

(Excourse to WPF-XAML: In WPF-XAML this conversion is not done by the XAML-Parser, it is done by the BrushConverter-class)

Now if you have properties that are of your own type, let’s look at this works in Silverlight and WinRT. Let’s assume we have the classes below:

public class Person
  public Address Address { get; set; }
public class Address
  public string City { get; set; }
  public string Country { get; set; }

In Silverlight-XAML, it is possible to create a Person-instance as below if a TypeConverter for the Address-type exists:

<local:Person Address="Müllheim Germany"/>

The corresponding typeconverter could look like this:

public class AddressConverter : TypeConverter
  public override bool CanConvertFrom(...Type sourceType)
    if (sourceType == typeof(string))
      return true;
    return base.CanConvertFrom(context, sourceType);
  public override object ConvertFrom(...object value)
    if (value != null && value is string)
      var array = value.ToString().Split(' ');
      if (array.Length != 2)
        throw new ArgumentOutOfRangeException(
          "Invalid format for address");
      return new Address
        City = array[0],
        Country = array[0]
    return base.ConvertFrom(value);

The only thing that is additionally required is to tell the XAML-Parser where to find the AddressConverter. You do this by specifying the TypeConverterAttribute either on the Address-Property in the Person-class or on the Address-class itself. Below an example that specifies it on the Address-class.

public class Person
  public Address Address { get; set; }
public class Address
  public string City { get; set; }
  public string Country { get; set; }

So far to Silverlight-XAML, now let’s look at WinRT-XAML. As mentioned above, WinRT-XAML also supports conversion for

  • primitive Types like bool, char, double, int, float,…
  • enumeration-values
  • central types like e.g. the Brush-type.

If you’ve custom types like the Address-class, currently there’s no support. There’s no TypeConverter in WinRT. Dot.


In Silverlight-XAML it’s possible to create custom subclasses from MarkupExtension and use them in XAML with curly braces. WinRT doesn’t support custom Markup-Extensions. Dot.

Did you find out other bigger differences about XAML?

See you next week with the next post about WinRT and Windows Store-apps.


Windows Store-apps with XAML and C# – blog series

Since yesterday evening Winodws 8 RTM is out for developers. This blogpost is the start of a blog-series about developing Windows Store-apps with XAML and C#. The series consists of some informational and some “how-to” posts:

More topics will come. If you’ve topics not listed above you want to read about, write a comment on this post.

The first post about XAML will be written till saturday evening


What’s coming next? XAML, WinRT, HTML5,…

It has been really quiet for a long long time on this blog. I’ve had many amazing projects in the past half year. All about Windows Presentation Foundation. In my sparetime I focused on the HTML5-part, because I’m very interested in the development of mobile apps. I’ve also looked at the HTML5-part in WinRT. I’ve published an article about developing Metro-Apps with HTML5/JavaScript in a special edition JavaScript-magazine (German). You can order it here:

Later this year I had talks at conferences in Germany (BASTA!) and in Switzerland (Trivadis TechEvent) about Windows Phone, WinRT, Silverlight, HTML5.

What’s coming next:

  • series of blog-posts about Modern UI-Style Apps with XAML and C# (will start in about two weeks)
  • some WinRT-articles for the German Windows Developer magazine
  • some talks at BASTA! and TechEvent in September. And maybe on other conferences
  • Upgrading WPF-book to .NET 4.5
  • Writing a new book about developing Windows 8 Modern UI-Style Apps with XAML and C#. Will be available next year.

So stay tuned!