mvdwetering/huesyncbox

I kind of digged the media_player

akballow opened this issue · 11 comments

Since the code already exists, is it possible to include old media_player as a disabled option for people who like the old version?

xip0rt commented

honestly, it was kinda nice to have all of the controls right there.

will need to create a controller with another addon now.

I am not planning on bringing the mediaplayer back. All the weird mappings just make it unclear on how to use it and I don't want the additional maintenance.

Which parts of the mediaplayer approach did you specifically like over the multiple entity approach?
(I assume it is one card in the dashboards, but that is just my guess)

xip0rt commented

yes, one element to control most of the settings was nice, but there's definitely ways to bring all of that control back. my current quick and dirty fix is basically:

type: conditional
conditions:
  - entity: switch.sync_box_power
    state: 'off'
card:
  type: entities
  entities:
    - number.sync_box_brightness
    - select.sync_box_entertainment_area
    - select.sync_box_hdmi_input
    - select.sync_box_intensity
    - select.sync_box_sync_mode

obviously there are cleaner ways to implement this in lovelace but I haven't spent the time to do so yet

How I have implemented this is using a Button card with a tap action as a popup. Here is my code in case it is useful. Personally I prefer this to the media_player entity so glad I was forced to make it.

show_name: true
show_icon: false
type: button
tap_action:
  action: fire-dom-event
  browser_mod:
    service: browser_mod.popup
    browser_id: this
    data:
      content:
        type: entities
        entities:
          - entity: switch.sync_box_power
            name: Power
          - entity: switch.sync_box_light_sync
            name: Sync
          - entity: switch.sync_box_dolby_vision_compatibility
            name: Dolby Vision
          - entity: select.sync_box_led_indicator
            name: LED Indicator
          - entity: select.sync_box_intensity
            name: Light Intensity
          - entity: select.sync_box_hdmi_input
            name: HDMI Input
          - entity: select.sync_box_entertainment_area
            name: Entertainment Area
          - entity: select.sync_box_sync_mode
            name: Sync Mode
          - entity: number.sync_box_brightness
            name: Brightness
      show_header_toggle: false
entity: switch.sync_box_power
name: Sync Box

Yeah, ideally someone would make a dedicated card for this or a flexible "device card" where you can easily combine multiple entities of a single device in a good looking way. In theory it should not seem that complicated from looking at the code of some front end cards, but writing something is different from reading and I just don't have the time to pick this up myself for now.

For me personally the most important parts to control are power on/off the box and start/stop lightsync and to a lesser extend the brightness. I hardly ever change the other settings or they are changed automatically

For reference here are some layouts I experimented with and might give ideas on how to build something of your own.

Note that I am trying to mostly use the standard cards, but there is a lot of custom stuff out there which people use to build really fancy stuff, so this is definately not all that is possible.

Glances card

Pressing buttons toggle or cycle the entity. Cycling the select entities feels a bit janky because the updates are not instant, but otherwise works fine. It is missing brightness control

image

Code
show_name: true
show_icon: true
show_state: true
type: glance
entities:
  - entity: switch.sync_box_power
    name: Power
    tap_action:
      action: toggle
  - entity: switch.sync_box_light_sync
    name: Sync
    tap_action:
      action: toggle
  - entity: select.sync_box_hdmi_input
    name: Input
    tap_action:
      action: call-service
      service: select.select_next
      data:
        entity_id: select.sync_box_hdmi_input
        cycle: true
  - entity: select.sync_box_sync_mode
    name: Mode
    tap_action:
      action: call-service
      service: select.select_next
      data:
        entity_id: select.sync_box_sync_mode
        cycle: true
  - entity: select.sync_box_intensity
    name: Intensity
    tap_action:
      action: call-service
      service: select.select_next
      data:
        entity_id: select.sync_box_intensity
        cycle: true
state_color: true

Buttons in footer

This is a basic list of entities, but with the power and lightsync buttons in the footer which looks a bit nicer I think

image

Code
type: entities
entities:
  - entity: select.sync_box_hdmi_input
    name: HDMI Input
  - entity: select.sync_box_sync_mode
    name: Sync mode
  - entity: select.sync_box_intensity
    name: Intensity
  - entity: number.sync_box_brightness
    name: Brightness
footer:
  type: buttons
  entities:
    - entity: switch.sync_box_power
      name: Power
    - entity: switch.sync_box_light_sync
      name: Light Sync
title: Sync box
show_header_toggle: false

Alternative entities

This is also just an entities card but with using the custom hui-element card. That card allows you to use cards in places where usually entity rows are used.

I used it to put a horizontal stack with 2 select entities so it takes less space. This does not look as good with the borders still around the cards and because of that does not even gain that much vertical space. Those borders can be removed with the card-mod custom card, but I don't have the patience to figure that one out.

image

Code
type: entities
entities:
  - entity: switch.sync_box_power
    name: Power
  - entity: switch.sync_box_light_sync
    name: Light Sync
  - entity: number.sync_box_brightness
    name: Brightness
  - type: custom:hui-element
    card_type: horizontal-stack
    cards:
      - type: entities
        entities:
          - entity: select.sync_box_sync_mode
            name: Sync mode
      - type: entities
        entities:
          - entity: select.sync_box_intensity
            name: Intensity
  - entity: select.sync_box_hdmi_input
    name: HDMI Input
title: Sync box
show_header_toggle: false

Buttons with browermod popup

This is just a grid with a few buttons (not all filled yet) and one button to call up a "more info" dialog with all the entities. Requires the browser-mod custom integration to be installed.

image

Code
square: true
type: grid
cards:
  - show_name: false
    show_icon: true
    type: button
    show_state: false
    entity: switch.sync_box_power
    name: Power
    tap_action:
      action: toggle
  - type: button
    show_name: false
    show_state: false
    entity: switch.sync_box_light_sync
    name: Light Sync
    tap_action:
      action: toggle
  - type: markdown
    content: ' '
  - type: markdown
    content: ' '
  - show_name: false
    show_icon: true
    type: button
    entity: light.ventilator_3
    icon: mdi:dots-horizontal
    tap_action:
      action: fire-dom-event
      browser_mod:
        service: browser_mod.popup
        browser_id: this
        data:
          content:
            type: entities
            entities:
              - entity: switch.sync_box_power
                name: Power
              - entity: select.sync_box_hdmi_input
                name: HDMI Input
              - entity: select.sync_box_sync_mode
                name: Sync mode
              - entity: select.sync_box_intensity
                name: Intensity
              - entity: number.sync_box_brightness
                name: Brightness
              - entity: switch.sync_box_light_sync
                name: Light Sync
columns: 5

Any example on how to make a media card?

I use the media player entity to switch sources of the Hue Sync Box via Homekit. Therefore, I recreated the old media player functionality using the universal media player:

media_player:
  - platform: universal
    unique_id: hue_sync_box
    name: Hue Sync Box
    device_class: receiver
    attributes:
      state: switch.hue_sync_box_power
      source: select.hue_sync_box_hdmi_input
      source_list: select.hue_sync_box_hdmi_input|options
    commands:
      turn_on:
        service: switch.turn_on
        target:
          entity_id: switch.hue_sync_box_power
      turn_off:
        service: switch.turn_off
        target:
          entity_id: switch.hue_sync_box_power
      select_source:
        service: select.select_option
        target:
          entity_id: select.hue_sync_box_hdmi_input
        data:
          option: "{{ source }}"

I'm still kind of new to home assistant, but I'm having a hell of a time figuring out how to make a script for increasing/ decreasing brightness values. I want to make buttons for it. I could brute force it, and for each step, say, if the brightness is 1, make it 2, and so on, but, oof. Is there a simpler way to achieve this with the current available entities?

Hmm... I was certain that the number entity had increment/decrement services to do that, but it seems I confused it with input_number which does have them. Seems like a odd omission, I would suggest to request those services as a feature in Home Assistant.

Until that time you can probably do it with templates or something, but I am no expert on that. Probably better to ask on the Home Assistant forums/reddit as there probably have been people that wanted something similar (the increment/decrement of a number).

Alternatively you can install the Spook custom integration which is a "scary powerful toolbox for Home Assistant". Among a lot of other things it adds the missing increment/decrement services for the number entity (see https://spook.frenck.dev/number#decrease-value)

xip0rt commented

..I'm having a hell of a time figuring out how to make a script for increasing/ decreasing brightness values. I want to make buttons for it.

wait for 2023.12 release, there will be a new +/- for number entities via the tile card

281064552-05269372-241b-453c-80e8-4706bbf7582d

I am cleaning up issues and since this is not really an issue I am moving it to a discussion.