UWP app for the Aten HDMI matrix

In this tutorial we are going to create the possibility to control an Aten HDMI matrix with an UWP app. To make this possible we will be using the following components:

  • An API to be able to give a description to every port on the matrix
  • An AllJoyn Device Bridge which will allow us to control the matrix
  • An UWP app that uses ReactiveUI

The matrix

The Aten matrix contains a serial port, to which we can send commands and control the device that way. The version I have been working with has four input ports and four output ports. In a serial command you can specify output port 1 by putting ‘O1’ in the command. The reference for all the commands you can send to the matrix is available here.

API

To make the API we will be using ASP.NET (Core) MVC. Using this will allow us to also make a web application to assign the correct name to every port. This is a basic web application with a login screen and after that the controls to insert the data into the database.

For the API we want to make sure it returns everything we need to determine which port the user wants to switch. Since a port is identified by an “O” for Output and an “I” for input combined with the number of the port, we need to make sure the API returns that. We also want to display the name assigned to the port in the app, so the API must return that as well.

The API I have made could return the following JSON:

[
    {
        "id":1,
        "name":"Output 1",
        "portName":"O1"
    }
]

AllJoyn

To be able to control the matrix on other devices we need a way to connect to the device. We have done this by creating an AllJoyn Device Bridge. This allows us to discover the device as long as we are on the same network. For the AllJoyn bridge we have used this template. AllJoyn consists of a producer which makes the device discoverable and a consumer which can connect to the producer. The AllJoyn bridge is going to be the producer in the tutorial.

With this template we can create our own device. The device we have created contains ‘AdapterMethods’ for every aspect of the matrix we can control by sending serial commands. One problem that we got when creating the bridge like this is that there is no way to read values from the matrix. So our app could not get the current state of the matrix. To solve this problem we have stored the current state of every port in the bridge. When it gets changed it sends a signal and the other apps receive that signal so they can get the updated state from the bridge. So in addition to the methods to control the matrix it also contains a signal to make sure every app stays up-to-date.

To access the commands in other applications AllJoyn studio is available here which will create the necessary classes.

The AllJoyn bridge must also contain a part in which we can send serial commands to the device. For more details on how to create this part you can look it up here

UWP app

We have created a standard UWP app and added Reactive UI to it. This app needs to have an AllJoyn consumer, which will connect to the AllJoyn bridge. This will be the first part we are going to create for the app. Firstly we need to use AllJoyn Studio to create the necessary classes to be able to connect the device. After we have added the project created by AllJoyn Studio we need to make sure the that it starts looking for producers.

We have done this with the following piece of code:

AllJoynBusAttachment switchBusAttachment = new AllJoynBusAttachment();
DeviceWatcher m_watcher = AllJoynBusAttachment.GetWatcher(new List<string> { InterfaceName });
m_watcher.Added += Watcher_Added;
m_watcher.Start();

When the app can successfully connect to the producer we need the application to get de names we have stored in the API. To do this we can use the “HttpClient” class. The reference for this class is available here This allows us to link the name to the correct port.

Conclusion

When everything is created correctly, we can control the matrix via our UWP application. The AllJoyn Bridge establishes a serial connection with the matrix and makes the device discoverable by other devices. The description of every port is stored in an API and we can display it in our UWP application. The app can connect to the AllJoyn Bridge and gets the current state of every port and after that it can get the description of all the ports.

Comments