3 button interface with graphic feedback

[J V]

Workaround for displaying graphic status and having 3 input buttons.

Origin: I wanted to see status of my amplifier, important for me was to see information that is shown the display regarding the incoming signal - to check if e.g. bitstreaming works etc. (the display is not readable from the sitting position). Some limited controls (volume, surround mode, source) could be useful at the same time as well. The status block can show such information, but only provides a single line and then you need addiitonal controls for buttons.

Approach: door controller + ImageMagick
The door controller block can be used to display a jpg that is on a webserver, interestingly, it refreshes this image immediately when it changes. It also has 3 pushbuttons whose outputs can be linked to any block you want and whose description can be changed. The program ImageMagick ( https://imagemagick.org/ ) has a commandline interface that allows you to overlay text, basic geometric shaps and other images with onto given image.

I have an empty image, and each status is drawn on the image using ImageMagick. There are different ways to call ImageMagick, I use Eventghost which allows me to trigger actions on event changes, but I guess it can all be achieved with a webserver and appropriate scripting. So, I have a black image, created with

convert.exe -size 1000x1000 xc:black C:\test\screen.jpg

In Loxone Config, I defined a user defined intercom that points to this image via a webserver, and a door controller block that links to it.

For example for a Volume change I can call

convert.exe C:\test\screen.jpg -undercolor "#00000000" -fill white -pointsize 60 -draw "text +50,+700 Volume X " C:\test\screen.jpg

X is the volume level, which you have to pass somehow (in my case, it is an EventGhost variable). The statement draws "Volume X" at position 50,70 with font size 60 in white on a black background (undercolor). The background is important as otherwise the old value is not removed if you keep redrawing over the same image (undercolor has hex values for RGB + an alpha channel, hence the 8 zeros to get black).

In the door controller block, I use button 1 to trigger a sequencer block, and the other two buttons I use as up/down buttons, sufficient to have three "modes" to change volume, source and surroundmode (but more are possible of course).
I've just started with this, but test show that it works, so now I'm improving the graphics. The image can also be modified to reflect the state of the sequencer, as to have captions above to buttons that show their function.


I guess it is not a frequently asked question, but I hope the idea helps someone with visualisations or so.


Jörg

[Christian Fenzl]

Nice idea 🙂

If using an external server, it possibly is more convenient to grab the status externally, and push the ready processed text to a Virtual Text Input.

[J V]

Yes, I have the text inputs also via VTI, and for sure it is easier (I have both VTI and VI for some data, the VTI is a string for display, the VI a single byte for easier processing within the miniserver) but somehow the way it is shown in the app is quite limited. At best you can add a single icon using a status block, but a big part of the information is missing until you tap the text field, but then you lack inputs. The door controller approach gives me a quick overview of all settings, mainly things such as the number of input channels, dts bitstream or not, which input is used (e.g. if I select my pc input, audio could still go via hdmi, optical or analog). So to display it all gets got messy in statusblocks with limited formatting.

The three button control is perhaps a bit limited, but with the first button to selecct what the others do, it gives some options. And here I really only need the basic ones to set the input optimally. The only downside other from the 3 buttons is the fact that the doorcontroller has a bell icon in the app. But I could survive that


I also thought of using it for displaying the Squeezebox artwork, but it would need some extra processing as the url on LMS that gets the artwork ends with the mac-address of the player, so the door controller does not manage. But seeing how the development of the music server gateway is going, I doubt there is any point in using it for a Squeezebox.

But perhaps others have other usages?

I was even thinking of using VLC to stream a desktop or application from a computer to the Loxone app. It should be technically possible, and may be fun to try, but I have no real need for it and there are many other things that are higher on my priority list.

EDIT: I took a 1000x1000 image, but the values are rather arbitrary. In the app, the image gets scaled to full width, and displayed as high as necessary (it scrolls). I chose a square format as that one shows the buttons without scrolling on my different devices, and an chose 1000 as it is a round number... ok... I should have gone for 1024...

[J V]

Just some observations:

1. Updates of the screen can go quite slow (1-2 seconds)
2. Low powered clients (e.g. old Android phone) have some issues with refreshing and hang sometimes. At best you can still you use the back button, but at worst the Loxone App crashes.
3. Sometimes (haven't figured out when) you get http error 10053. This seems only to happen on slower clients.

So basically, it works, but not so well on older clients. In general, it may probably be more functional to consider a small dynamic website (after all: we are already running a webserver just to achieve this), where items can even be clickable (not limited to 3 buttons) and put a link in the Loxone App. But I wanted to try this as I got a bit stuck with putting it all on a website.