Hi Benny,
Sorry that this took a little longer; time in Thailand goes slower than the rest of the world
I have posted examples below of how I easily got this look and feel; but I think it’s also important to point out why I did it this way. It is clear to me from your question that you understand all the principles very well so I thought I would give both a short and long answer in case that also helps others
So the easy and simple answer for you is – the way in which the Light items (Point_Control) belonging to a piece of Equipment (Equipment_Lightbulb) are displayed by default is specified via Metadata / using the Metadata option at the Equipment level.
If nothing is specified, which is the default, then effectively you end up with a simple list of lights.
So from the Model, select the Equipment like:
The Snug Room (location) has Snug Lights (the Equipment)
If you click on Add Metadata, you get these options:
And then to achieve your goal of showing a Single / Summary / Group line on a list of Equipment items – you want to select the Default List Item Widget
Which then gives you this configuration page:
The Long answer is I wanted the best of all worlds.
In the example below, like your multiple Lamp requirement, I didn’t want the Room (Location Card) to show every single Point in ‘list fashion’ but to show the Equipment in summary form , HOWEVER I did want to take advantage of the built-in at-a-glance modules - there is an excellent write up on these here - these are the fabulous icons automatically generated on the Location card indicating Windows open, Blinds open, Lights on etc.
Also, in the case of my Sonos devices I wanted to show the device; but once selected I wanted an accordion list providing two sub-options - the first option being the brilliant Sonos Multi Room widget from @buschif4 and the 2nd option being a list of all the Sonos points should a user want to play around with an individual Point/Channel of the Sonos thing.
And then finally I also wanted on the same Equipment tab on the Location Card to also display an individual Point (the Sonos Volume) as I guessed that one of the reasons the users would come here would be to control the volume quickly.
I know – best of all worlds – super greedy of me
I achieved this by adding an intermediate, ‘dummy’ piece of equipment, in this case a Sonos Speaker within another Speaker Group.
The Default List Item metadata on the holding / dummy equipment speaker is configured like this.
Here is the UI for the metadata.
All I actually changed / added was to specify
- that my 2 option accordion (widget below) would pop up rather than a list of all items
- the state of the holding / dummy group should show the state of the real speaker
And here is the YAML for the default list item widget
value: " "
config:
action: popup
actionModal: widget:widget_sonoslist
actionModalConfig:
item: SonosSnug
zone: Snug
item: SonosSnug_State
So, when you click on the Location (Room) card; it looks like this
When you click on the dummy equipment group, you are then calling the accordion widget below
Again; thank you again @buschif4 for your wonderful Sonos Multi Room widget; which I just slightly adapted
The YAML for the accordion list is:
uid: widget_sonoslist
tags: []
props:
parameters:
- context: item
description: An item to control
label: Item
name: item
required: false
type: TEXT
- label: Zone
name: zone
required: false
type: TEXT
timestamp: Dec 15, 2020, 10:13:06 AM
component: f7-block
config:
padding: 0px
margin: 0px
slots:
default:
- component: oh-grid-row
config:
padding: 0px
margin: 0px
slots:
default:
- component: oh-grid-col
config:
padding: 0px
margin: 0px
slots:
default:
- component: oh-list
config:
padding: 0px
margin: 0px
accordionList: true
slots:
default:
- component: oh-list-item
config:
padding: 0px
margin: 0px
title: Sonos Music System
icon: oh:speaker
badge: OK
badgeColor: green
slots:
accordion:
- component: oh-list
config:
accordionList: true
slots:
default:
- component: oh-list-item
config:
title: Sonos Multi Room
action: popup
actionModal: widget:widget_SonosPlayer
actionModalConfig:
itemTitle: =props.item + '_MediaTitle'
itemAlbum: =props.item + '_CurrentAlbum'
itemArtist: =props.item + '_MediaArtist'
itemCover: =props.item + '_CurrentAlbumCoverArt'
itemPlayer: =props.item + '_MediaControl'
itemVolume: =props.item + '_Volume'
itemShuffle: =props.item + '_Shuffle'
itemRepeat: =props.item + '_Repeat'
propZoneName: =props.zone
itemMaster: =props.item
propZoneArray: '["Snug", "SonosSnug_MediaControl", "SonosSnug_Volume", "SonosSnug_Coordinator"]["Office", "SonosOffice_MediaControl", "SonosOffice_Volume", "SonosOffice_Coordinator"]["Kitchen", "SonosKitchen_MediaControl", "SonosKitchen_Volume", "SonosKitchen_Coordinator"]["Guest Chillout", "SonosGEChillout_MediaControl", "SonosGEChillout_Volume", "SonosGEChillout_Coordinator"]["F2 Chillout", "SonosF2Chillout_MediaControl", "SonosF2Chillout_Volume", "SonosF2Chillout_Coordinator"]["Gym", "SonosGym_MediaControl", "SonosGym_Volume", "SonosGym_Coordinator"]["Master Bedroom", "SonosMasterBedroom_MediaControl", "SonosMasterBedroom_Volume", "SonosMasterBedroom_Coordinator"]["Bedroom3", "SonosFFBedroom3_MediaControl", "SonosFFBedroom3_Volume", "SonosFFBedroom3_Coordinator"]["Kennel", "SonosKennel_MediaControl", "SonosFFBedroom3_Volume", "SonosKennel_Coordinator"]'
propWidgetTitle: =props.zone
itemCoordinator: =props.item + '_Coordinator'
itemSonosRule: Sonos_Multiroom_Control
- component: oh-list-item
config:
title: Sonos Single Room
action: popup
actionModal: widget:widget_SonosPlaySingleRoom
actionModalConfig:
item: =props.item
Which then gives the multi room function
The 2nd option on my two option accordion list (It felt good at the time ) then provides the Sonos Points – this is what we/I didn’t want showing on the initial Location card for the Room
And here is the Yaml for that
uid: widget_SonosPlaySingleRoom
tags:
- LG TV
- TV
props:
parameters:
- context: item
description: An item to control
label: Item
name: item
required: false
type: TEXT
parameterGroups: []
timestamp: Dec 15, 2020, 10:46:30 AM
component: f7-block
config:
padding: 0px
margin: 0px
slots:
default:
- component: oh-grid-row
config:
padding: 0px
margin: 0px
slots:
default:
- component: oh-grid-col
config:
padding: 0px
margin: 0px
slots:
default:
- component: oh-list
config:
padding: 0px
margin: 0px
accordionList: true
slots:
default:
- component: oh-label-item
config:
item: =props.item + '_CurrentAlbum'
title: Current Album
icon: oh:album
- component: oh-label-item
config:
item: =props.item + '_CurrentTrack'
title: Current Track
icon: oh:song_name
- component: oh-label-item
config:
item: =props.item + '_MediaArtist'
title: Media Artist
icon: oh:artist
- component: oh-label-item
config:
action: options
actionItem: =props.item + '_Repeat'
item: =props.item + '_Repeat'
title: Repeat
icon: oh:repeat
- component: oh-toggle-item
config:
item: =props.item + '_Shuffle'
title: Shuffle
icon: oh:shuffle
iconUseState: true
- component: oh-player-item
config:
item: =props.item + '_MediaControl'
title: Sonos Media Control
icon: oh:MediaControl
- component: oh-slider-item
config:
scale: true
label: true
scaleSubSteps: 5
min: 0
max: 100
item: =props.item + '_Volume'
title: Sonos Volume
icon: oh:SoundVolume
iconUseState: true
- component: oh-list-item
config:
title: Playlist Favorites 1
icon: f7:heart
- component: oh-list-item
config:
title: Playlist Favorites 2
icon: f7:heart
Hoping the short one answers your question, and the longer explanation comes in handy for others