Contemporary optimizations plugin for local connected displays

Hi @2aCD, great job! Your mod is really nice and seems made for my custom media player. I use the latest version of Volumio. I followed the instructions provided with the install.zip file, but nothing has changed. Seems I’m doing something wrong, but I cannot understand what…
It would be great if you would provide an apt auto-installing file…
I will keep trying…

Do you see the additional option to select the modified contemporary profile?

Yep! now it works! two options: contemporary 1 and 2 but they look the same.
I have not the circular progress bar and I have very small fonts.

There is a way to have bigger (font size) title & artist?

Anyway this is exactly what I was looking for! Great job!

Hello,
This looks so nice. Could you please give us some details in a new post pls : material of the front plate and a picture on how you place the display inside, did you have used a extender cable for the fein sd card?
Thanks and Sory for tbe off topic.

@Lintbf I will do in a specific post asap! thank you for your interest!

1 Like

The difference between the two versions are:
the first is for displays with lower resolutions <= 800. Have you a display with a resolution grater then 900, this mod switch to standard PC View.
The second mod prevent the switching to PC View for greater resolutions. So you can use the mobile view also with grater resolutions. For small resolutions both mods do the same.

In the top area of css files that you have copied, placed some variables with comments. With this variables you can change the size of fonts and some other values. Change the _1.css for the first mod and the _2.css for the second mod with winscp and select it again in VOLUMIO settings, that restart chromium to re-read your css, without reboot

The best way to find the right size of title and artist and other values is to use a browser (edge, chrome) on PC.
Do the follow:

  • open your Volumio.local site
  • press F12 to debug
  • use the tab elements in debug window
  • scale your browser window exact to your raspberry resolution (800x400 or so) with F12 you see the resolution in the right top corner of browser
  • in your debug window now you find all variables thats defined (starts with --) in :root section
  • the comments for it you find in the ccs file
  • now you can change the variables live and you see the result in browser. Do not remove the extensions px or vh, change only the values. You can play a little bit with this variables, the changes are only for this session on your PC never write back to css.
  • have you find the right sizing options, write that to your css file manually and select the mod again in VOLUMIO settings

Now you have the same settings also on your connected display
:grin:
and have fun

Absolutely love what you’ve done here. I’ve using it here on the official RPi screen, and was wondering if its easy to implement having the Album Title on a separate line under the Artist Name, rather than trying to cram them both in on one? Thank you!

this is a little bit tricky. The only way to do that without changing of html-code is this:
seach this section:

#trackInfo-compact #trackInfo-artist-album #trackInfo-album {
    color: #c1c1c1;
}

and add this section after:

#trackInfo-compact #trackInfo-artist-album #trackInfo-album:before {
    content: "\A";
    white-space: pre;
}

This insert a new line command. But you can’t remove the hyphen, the first character of album.

Thank you for this. I’ll check it out!

Works a treat - thank you so much. Such a shame about the errant hyphen, but small potatoes now I can display the info without truncation.

Hello,
Thanks for the great works. I have followed all the step and install the mod successfully. However, every modification i made in .css was not appear in the browser. I can still select the mod even i delete one of the _x.css.
*I edit the .css via OSX Transmit. reboot the volumio and re-select the mod after I modified .css
Would you give me some suggestion what I have missed? Thanks.

Hi and thanks for the interest on this mod.
I don’t know exactly, have you also installed the UI Integration, or have you replace the css direct.
With the UI Integration you made the change on the file with _1.css or _2.css and then select again the mod 1 or mod 2 in Volumio settings. You don’t need a reboot. The UI copied the _1.css or _2.css to the original css without _1 or _2. and restart chromium to activate the settings.

Hello 2aCD,
Could you please help me on next issue :
I have update to buster version v3.068. The oled files were retained during the udpate process but now I cannot switch to con_mod_1 layout . I have this :slight_smile:
image .
I have added again the index.json etc files . in sources I have the drop down list but when I select the mod_1 , the original contemporary remains active . I have deleted also the file from last step.

Many thanks

Hi Lintbf,
what is the original css file in buster. Is it this:
app-3a6d55fad7.css

Then it have a new ID and the replace procedure from UI not more works.

Can you upload the original css, I’ll compare it and create a new package for 3.068 buster version.

Hi 2aCD,

The new file in Volumio buster started with V3.068 I guess is the attached one . On volumio 2.x I do not have this file.

Many thanks app-3a6d55fad7.zip (32.8 KB)

Hi Lintbf,
can you give me a link, where can I find the 3.068 download, I can’t find it.

Hi 2aCD,
I have asked one of moderators. I have updated via Ota. I also could not find it. As soon as he respinds I will give you the link.

Or install it from here then activate test mode and do the Ota updates until mod will give the curent download link

https://updates.volumio.org/pi/volumiobuster/3.051/Volumiobuster-3.051-2021-03-06-pi.zip

@2acd mod said to install above version then enter in test mode and update via Ota.

Ok I’ll try it with update.
I have compare now the old and the new original css file and have find some differences. So it’s necessary to patch the new file instead to use the old with a simple rename.
I’ll do this, but spend me a little bit time, to do this without mistakes. I’ll install at first a fresh buster and make an update to 3.068, to have a test environment.

I guess the latest is 3.061. Not 3.068. I have 3.061. And no update foujd on Ota check.
Take your time :slight_smile:
Mnay thanks again for your support.

v3.061 is latest … link now updated at top of Buster beta thread.