Roon Extension: Roon Web Controller v1.0.0 (on GitHub)

Thanks for helping me nail this one down!

1 Like

Your welcome :smiley:
Testing dev now! :slight_smile:

Not sure how to get a screenshot from kiosk mode without keyboard etc., so took a photo ā€¦ the back, forward and play buttons are ever so slightly oval.

Maybe a slight difference in aspect ratio between 800x480 and 1900x1080?

I see.
As you stated is just slightly stretchedā€¦
Mine does not look like that:

Maybe? Not sureā€¦ I am running 1920x1080

That is a pixel aspect ratio issue.

The Raspberry Pi touchscreen has a 16:9 pixel aspect ratio. Most desktop monitors have a 1:1 pixel aspect ratio.

Theoretically, the CSS sizes for those icons (/public/css/site.css, the classes called svgSmall, svgMedium, svgLarge) could be changed to account for this. But then they wouldnā€™t look right on computer monitors.

I honestly didnā€™t even notice it until it was pointed out!

One thing I could do to make it less noticeable is to use SVG icons that do not have circles around them. For example, the play button would look like this:

I have a full set of these too, and it would be a pretty simple taskā€¦

I like the circles :disappointed_relieved:
lol

Sounds like I have a new configuration option in addition to themes then!

Mocking it up right nowā€¦

1 Like

New version now available at https://github.com/pluggemi/roon-web-controller

For new installs, please see the instructions on the link above.

Note: you should not have to run ā€œnpm installā€ after this update, but it doesnā€™t hurt either.

Change Log:
Version 1.0.1

  • Resolved bug that could result in repeated listings in Zone Listings
  • Changed all icons to utilize SVGs from Material Design Icons (https://materialdesignicons.com/)
  • Dramatically reduced the number of times the icons were being called and redrawn
  • Changed default theme to ā€œCover Darkā€
  • Set default icon theme to ā€œCirclesā€
  • Added configuration option to select icons between icons with or without circles
  • Miscellaneous aesthetic changes
1 Like

@Mike_Plugge Thanks for this commit!
Looking good! :smile::+1:

@Mike_Plugge Today I got no cover image showing for one of my zones.
The is the stable branch so no debug on this oneā€¦

Edit: After several minutes the image loaded.

@Mike_Plugge Sorry to have troubled you! :slight_smile:

Discovered a post that suggests the display has non-square pixels. https://www.raspberrypi.org/forums/viewtopic.php?t=120710&p=817889

Still looking for a solution within Raspbian.

@Martin_Webster it is no worries at all.

It inspired me to include a new icon theme which does not have circles around it. The newest version of this app at https://github.com/pluggemi/roon-web-controller has the new icons and a way to select them.

1 Like

Thanks @Mike_Plugge that looks pretty good.

@Mike_Plugge Heads up, I just did a pull of your dev and it has been cleaned all outā€¦ No interface (Very basic one).
Just thought Ill let u know.

There are quite a few updates I am working on in dev, so this does not surprise me. I will do a full quality check as I come closer to finishing my todo list for this release.

Because of the number of changes, you may need to re-enable this extension in the Roon Extensions settings on an official client.

1 Like

@Mike_Plugge Thanks for the update,
I think I found somethingā€¦ :stuck_out_tongue:
Maybe not a bugā€¦

When I change to another zone and nothing is playing on that zone, It actually does not changeā€¦ Even though the zone icon say it did change it stays on your previous zone, If I hit play it plays my previous zone even though it displayā€™s the current zone I just changedā€¦
I hope that makes sense :blush:

It does make sense.

The page updates when it receives a ā€œzone_changedā€ message. If a zone is not playing, it does not send ā€œzone_changedā€ messages.

It is one of many annoyances that is on my todo list to address in the new GUI that I am working on.

1 Like

This is really awesome, and it was super easy to get up and running.

Is there any chance of moving the port it runs on to a config file, though? I already have something else running on 8080, so I edited app.js, but that doesnā€™t seem like a great long-term way to go.

Do you mean a config file within the same directory or do you mean a config file at the system level?

Would a run time command line option to over ride the default port be acceptable?