Hello,
I have started doing some tinkering with Roon in order to try to create a browser based display which displays a slideshow of album artwork from the folder of the currently playing track and also includes a variety of tags.
At the moment my tinkering has been limited to making changes to the display_ui.html and display_ui.js files that generate the default browser display, as described in this topic.
But here I am limited to using what is available in the Zone API, which is just three lines (Title/Artist/Album) and the main cover image (image_key).
The only way I can think of achieving what I’d like to achieve is to create a database of all the tracks in my Roon library and then use this to match a particular track based on the three lines from the Zone API - I would then be able to pull in other tags from the database and the path to the album folder to build the slideshow.
I am however a newbie when it comes to all this. I am comfortable in HTML and CSS and can tinker with JS and PHP (so have created a browser based slideshow dynamically built from images in a specific folder), but I have no idea how best to pull in the variables from the Zone API. Specifically I am wondering:
-
Do I need to create a Roon extension or can this be done in some other way - somehow pulling in the Roon variables into the javascript that builds the browser slideshow I have already created? I would be happy to create an extension so that others could benefit from my work as well, but if there is a steep learning curve here, it may be beyond me. Also the slideshow page that I have already created depends on PHP to pull in the images from the folder, and not sure if this would work in an extension or if there would be another way of pulling in all the images for the slideshow?
-
If this can’t be done through an extension or by pulling the variables into the script I already have, then I suppose there may be a way of further adapting the display_ui.html and display_ui.js files to connect to the database I create and then build the slideshow/tag page from there. I’d rather not use this method, as it means recreating these files after each Roon update, but if it’s the only way I will do so.
I would be grateful for any advice as to the best way of proceeding, and any tips as to the next steps I need to take.
Thanks,
Nick
I have been able to do some more work on this and have discovered a few things:
-
As my scripts depend on php (for pulling files from the album folder and for running mysql queries) - which I have running on my local apache server - it doesn’t seem possible to include them in an adapted version of display_ui.html in the Roon app webroot folder, meaning that I will have to use the Roon API from within my server document root. I have created a rule in my .htaccess file in my the root folder for the apache server which allows rendering of php in html files, but this doesn’t work with the page generated by the display_ui.html/display_ui.js files in the Roon app directly, presumably because this page is not served by apache. I don’t know if there is a way around this. If there was then adapting the display_ui.html/display_ui.js files would be the simplest route for me. As it is it looks like I need to find a way of pulling the Roon API into pages within my server document root.
-
Roon only has a limited export of file information/tags in the excel export feature and there doesn’t seem to be a way of customising this - some of the tags I want are not included in the export (record label, year of initial release), so I have opted instead to use a mySQL database which I have built from the default Mac Music app Library export (as I have all of my music collection listed in the Music app as well as Roon) - I have a script which parses the xml file generated by the Library export and inserts it into a MySQL database. In the xml export/database are all the tags I need and also the path to the album folder. So now I have a way of both pulling in images from the album folder and creating a slideshow using a js script and displaying all of the tags that I want on the php display page.
-
Given that I am using PHP, which only runs within my server document root, and my own custom database built from the Music app, it seems like the chances of building this as a Roon extension are dwindling (maybe I could purely use js to build the slideshow and to query the database, but I am not currently sure if this is possible).
-
I have now installed a couple of Roon extensions and have started to look at how these work with the Roon API (Roon Web Conrtoller, Roon Extension http API). The three js variables that I need to pull in to my page are:
zone.now_playing.three_line.line1
zone.now_playing.three_line.line2
zone.now_playing.three_line.line3
From these I could build everything I need to (by matching three columns in the mysql database). But I am not sure how to do this and would be grateful for any advice as to the simplest way of doing so. What would be the simplest way of pulling these variables into my script/page?
Thanks
Nick
Having experimented a good deal with the http extension, I now have a better understanding of how to pull the three variables I need into a page, and have created a stripped down page to just display these. But the main purpose of using the API is to be able to use these variables to query my MySQL database - and as far as I am aware I need PHP to do that. However, when pages are served within the extension (i.e. using the URL localhost:3001/…) PHP scripts no longer work - presumably because this is a different port to apache where I have php installed. When I use the full URL from my apache document root the php scripts work fine and I can query my MySQL database, but then I can’t access the Roon API in order to pull in the three variables!
So, I am definitely stuck now, and wondering if there is a way of achieving what I’d like to do. Specifically I am wondering:
- is there a way of getting PHP working on the port that the extension is running on?
- is there a way of querying my MySQL database without using PHP?
Thanks
Nick
hi.
Although I do not know what you describe, I have a similar problem.
Currently, I have a roon bridge for sound transmission on rasp-os and a url-to-display roon browser for the screen. I think maybe that’s what you think would be easier to build on the volumio. There is a brdige for the roon and there is also a now playing plugin. From what I think, this plugin needs to be modernized to download data from roon api.
do you think it’s a good direction?
@Pawel_Majcherek unfortunately the metadata returned from the roon SDK is pretty limited. For now Playing information you get the 3 lines of info that @nickharambee mentioned. Mapping that data back to something like the full album information using the roon SDK is tricky at best. You could sort of do it by calling browse() with a search for some of the info you got from now playing but you’re going to then need to grovel over the search results using more browse() and load() calls to piece together all of the album info. It doesn’t look to be possible to get other metadata like favorites or tags as the roon SDK simply never returns this data.