Virtual Music player/App for Sonos and all audio devices

It does not interact with Sonos groups, you have to faux the groups.

The app allows you to create a master, and then slaves. You can 'mirror' volumes or have them go up by the same relative amount (-+10 or what I move the slider not mirror it) more like the Sonos app does it. This brings a "Sonos like" interface into a HE dashboard. Normally with a HE tile you can only control one Sonos device volume, not many.

@Cobra has plan to make it parent/child, but not sure if that has been done/release yet. It's been a few days since I checked.

I use it to control the volume of all the my Sonos devices via the dash tile in HE. I also added in 2 (of 8) extra 'zones' that I like 'independent' controller over. The top slider "Virtual Sonos" controls all zones by relative increase and then the others you see.

EDIT: That video is old and does not show the relative increase like I thought it did. Play with it and you'll see what I mean.

Sorry for the noob question but I registered for Cobras website in an attempt to find/install this app. Does my account have to be approved to access Cobra Apps? When I go to log in it just says access is currently disabled.

On a somewhat separate note I am running Echo Speaks devices and while voice control works for selecting music most of the time sometimes Amazon doesn't do the best job of finding what I am looking for (I mostly use Apple Music but this is true regardless of the music service) Has anyone devised a way that is a text field that allows searching for music with some sort of rudimentary navigation?

1 Like

Yes the account needs to be approved. Did you just sign up? If so give it some time, and you should get an email welcoming you.

I use Sonos for music, so I cannot help with the second part of your question.

Is this app still available, I can't seem to find it on Cobra webpage?

1 Like

Yep, look under "New Stuff"

Wonder if there's anyone using this handy app who can explain two behaviors:

  1. What is the difference between the master speaker and the virtual device? I have 6 real speakers which I've added to my dashboard. I'd also like to add an "All Speakers" music player to the dashboard to control all of them as a group, as well. So I created an "All" virtual speaker in @Cobra's awesome app with "follow exactly" selected. Is this virtual speaker the master? Or does the master have to be one of the six actual speakers? Fundamentally I don't understand why there is a virtual device distinct from a master device. I must be missing something.

  2. If I adjust the volume or the mute/unmute status of the virtual, all the slaves change instantly. Great. But if I adjust the channel/source on the virtual, none of the slaves change--only the master does. Is this intended behavior?

Thanks in advance for any insight.

For the app to function most effectively the Sonos devices need to be in the same Sonos group.

The "Master speaker" refers to the Sonos apps master controller (the device that started the group and controls track functions)

Yes, again this is a Sonos grouping thing. The app changes the track on the master unit and that changes all the slaves because they are all in the same Sonos group.

I think I might understand now. My environment is a single Sonos, which acts as a source, and then a bunch of speakers managed by a HE-controlled audio matrix unit created by @martinez.mp3 (see this thread). I assumed the Virtual Music Player app worked for this setup because it says in multiple places "any speakers", not just Sonos. Without Sonos "groups", I don't suppose there is a way for this app to control source-select, not just volume?

@TechMedX, would you mind sharing the CSS for the combo audio tile?

1 Like

@mluck FYI - 17 is the main Sonos device 64&65 are the small sliders.

#tile-17{padding-bottom:8em}
#tile-17 .tile-contents{display:inline-flex}
#tile-17 .material-icons{font-size:43px!important;line-height:1em}
#tile-17 .vue-slider{margin-top:4em!important}
#tile-17 .trackDescription{overflow:hidden;white-space:nowrap;padding-bottom:1em;margin:0 .5em}
#tile-17 .music-player{margin-top:-3px}
#tile-17 .tile-primary,#tile-64 .tile-primary,#tile-65 .tile-primary{width:100%}
#tile-64,#tile-65{border:0 none;background-color:transparent!important}
#tile-65{margin-top:-1em}
#tile-64 .tile-title{padding-bottom:.5em}
#tile-64 .music-player,#tile-65 .music-player,#tile-64 .trackDescription,#tile-65 .trackDescription{display:none}
#tile-17 .music-player>div.previous,#tile-17 .music-player>div.play-pause,#tile-17 .music-player>div.next,#tile-17 .music-player>div.muteControl{margin-top:0;top:unset;width:unset;position:relative}
#tile-17 .music-player>div{top:4.75em;position:absolute;width:100%}
#tile-17 .trackDescription{position:absolute;left:0;top:2.75em;height:100%;width:auto;padding:0;animation:slideshow 10s linear infinite}
@keyframes slideshow {0%{left:100%}100%{left:-150%}}
#tile-17 .tile-primary>.music-player{margin-top:5px} 
1 Like

Thanks for the code -- got me close. I wonder if the differences (especially the vertical spacing of the play-title and the volume) are because I'm not using Smartly. I'll see if I can play around with the code to adjust the spacing. I'm also going to try to abstract the CSS code so that's it works for 4 or 5 speakers, rather than just 2. I'm not a CSS coder, so if you have any pointers on either of these issues, I'm all ears. Thanks again for this.

Screen Shot 2020-11-15 at 12.53.06 PM

use this section and add more tiles following the syntax.

Example...

#tile-64 .music-player,#tile-65 .music-player,#tile-99 .music player, #tile-64 .trackDescription,#tile-65 .trackDescription, #tile-99 .trackDescription{display:none}

ive just stumbled across this post during a couple of hours of head scratching.

would it be possible for me to use this to control via a volume slider on my dashboard the master volume control of my PC?

My PC is housed inside an arcade cabinet and runs all my home audio. would be great to be able to adjust the volume from the dashboard

1 Like

[Noob here] So is this a straight hubitat tile? I have (3) amps/devices within the Sonos Integration and would like to get the slide bars to show in my tile also. I have @Cobra's Sonos Dashboard Control working to adjust the volume & verified that the individual music player volume will update with the "speaker Group" volume but would love to have the slide. I noticed @TechMedX shared some code but I'm not sure where you would update this &/or its something else needed to make it work.

Any help would be appretiated!

You can use the Music/media player tile. My display is there tiles combined. To do that you add my code to your CSS. But for just one tile you can just use the built in template.

Thank you for your guidance, and I figured most of it out!
image

1 Like

Would you know what I need to adjust to enlarge the volume %? (I changed it up ever so slightly and would like the volume indicator a little larger! image

You cannot isolate just the % from what I can tell. You can only increase the font size for all text on the tile using.

#tile-17 .tile-contents{
  font-size:18px ; 
}

FYI - doing so messes up the layout, so it might not be worth it.

That worked, I added it to your second line to keep it clean!
#tile-6 .tile-contents{display:inline-flex;font-size:18px!important}

1 Like