Postavte si tento dashboard pro Home Assistant zhruba za hodinu

• AVR Maestro je propojen s Home Assistant a synchronizace proběhla. Průvodce nastavením to popisuje. Než na svých ovládacích prvcích začnete cokoli stavět, měli byste je v Home Assistant vidět.
• Váš přijímač je přidán do Home Assistant. Nastavení › Zařízení & služby › Přidat integraci › Denon AVR a poté jeho místní IP adresa. Právě to dává dashboardu živý stav.
• Váš přijímač je během stavby zapnutý. Polovina toho, co budete psát, čte živé hodnoty, a přijímač v pohotovostním režimu nepublikuje téměř nic.

Dashboard je napájen dvěma zdroji a rozdíl mezi nimi je důležitý v každém z kroků níže.

Všechny čtyři jsou ve výchozím obchodě HACS. V Home Assistantu: HACS › Frontend › Prozkoumat & stáhnout repozitáře, vyhledejte název, klikněte na Stáhnout a poté znovu načtěte prohlížeč.

Každý úryvek na této stránce používá dva zástupné symboly. Najděte ty své jednou a zbytek je jen kopírování a vkládání.

• media_player.your_receiver → Nastavení › Zařízení & služby › váš přijímač › entita přehrávače médií. Něco jako media_player.marantz_cinema_30.
• script.avr_maestro_MAC_... → Nástroje pro vývojáře › Stavy a do filtru entit zadejte avr_maestro. Zobrazí se celý seznam vašich ovládacích prvků.

Prostřední část každého ID skriptu je MAC adresa vašeho přijímače, dvanáct malých písmen, u všech stejná. Zkopírujte si ji jednou. Všude, kde tato stránka píše MAC, dosaďte své.

1. 1. Nastavení › Dashboardy › Přidat dashboard › Nový dashboard od nuly. Pojmenujte ho, jak chcete.
2. 2. Otevřete ho a vpravo nahoře klikněte na ikonu tužky pro úpravy.
3. 3. Přidejte zobrazení a zvolte rozvržení Sekce. Ne Zdivo. Právě Sekce zajistí, že se na telefonu správně přeskupí.
4. 4. V nastavení zobrazení nastavte Maximální počet sloupců na 3 a zapněte Husté umístění sekcí.

Od teď je každý krok stejný: přidejte sekci a vložte do ní karty. YAML vložíte přes nabídku se třemi tečkami na kartě a volbu Upravit v YAML nebo přes nabídku se třemi tečkami na dashboardu a Editor surové konfigurace, kam vložíte všechno najednou.

# The view's own settings, if you prefer to type them
type: sections
title: AVR Maestro
icon: mdi:audio-video
max_columns: 3
dense_section_placement: true

Začněte tím nejjednodušším, co na ploše je, abyste věděli, že jsou vaše ID entit správně, dřív než začnete stavět něco složitého. Přidejte sekci, přidejte kartu, Upravit v YAML, vložte:

type: button
name: Pure Direct
icon: mdi:speaker
tap_action:
  action: perform-action
  perform_action: script.turn_on
  target:
    entity_id: script.avr_maestro_MAC_mode_pure_direct

Běžný Home Assistant. HACS není potřeba.

Klepněte na něj. Pokud se přijímač změní, vaše ID jsou správná a vše níže bude fungovat. Pokud se nic nestane, vraťte se ke kroku 2.

Tohle je vzor, který stojí za to se naučit, a každá dlaždice zdroje a surroundu na ploše je jeho kopií. Karta odešle skript a barvu si bere z entity přijímače, takže vstup, na kterém skutečně jste, svítí a ostatní ne.

type: custom:mushroom-template-card
entity: script.avr_maestro_MAC_input_cd
icon: mdi:disc
primary: CD
icon_color: >-
  {{ 'orange' if (state_attr('media_player.your_receiver','source') or '')|lower
     == 'cd' else 'grey' }}
layout: vertical
fill_container: true
tap_action:
  action: perform-action
  perform_action: script.turn_on
  target:
    entity_id: script.avr_maestro_MAC_input_cd
card_mod:
  style: |
    ha-card {
      border-radius: 14px;
    {% if (state_attr('media_player.your_receiver','source') or '')|lower == 'cd' %}
      background: linear-gradient(160deg, rgba(226,86,10,0.34), rgba(15,15,17,0.88));
      border: 1px solid rgba(255,122,24,0.80);
    {% else %}
      background: rgba(15,15,17,0.72);
      border: 1px solid rgba(255,122,24,0.14);
    {% endif %}
    }

U každého vstupu změníte tři věci: skript, ikonu a řetězec, se kterým se porovnává.

Dvě věci musí sedět, jinak se dlaždice nikdy nerozsvítí:

• Porovnávejte s tím, co váš přijímač skutečně hlásí. Nástroje pro vývojáře › Stavy, vaše entita přehrávače médií, přečtěte si atributy source_list a sound_mode_list. To jsou přesné řetězce. Porovnávejte malými písmeny, jako výše.
• Přejmenovaný vstup hlásí své nové jméno. Přejmenujte GAME1 na „Xbox“ na přijímači a ten bude hlásit Xbox, zatímco ovládací prvek AVR Maestro se pořád jmenuje input_game1. Porovnávejte s tím, co hlásí přijímač, ne s názvem skriptu.

Surroundové režimy jsou stejná karta s sound_mode místo source.

Obyčejný nadpis je mrtvé místo. Dejte pod něj živou hodnotu a z „Zdroje“ se stane „Zdroje / Právě na Nvidia Shield“.

type: custom:button-card
name: Sources
icon: mdi:video-input-hdmi
color_type: label-card
entity: media_player.your_receiver
show_label: true
label: >-
  [[[ var v = states["media_player.your_receiver"].attributes.source;
      return v ? ("Now on " + v) : "Receiver in standby"; ]]]
tap_action:
  action: none
styles:
  grid:
    - grid-template-areas: '"i n" "i l"'
    - grid-template-columns: min-content auto
  name:
    - font-size: 13px
    - letter-spacing: 3px
    - text-transform: uppercase
    - justify-self: start
  label:
    - font-size: 11px
    - justify-self: start

Právě dvouřádková mřížka dá popisek pod nadpis místo vedle něj.

U záhlaví Surround vyměňte attributes.source za attributes.sound_mode a podobně u dalších.

Home Assistant hlásí hlasitost jako zlomek. Nikdo nenastavuje přijímač na „0,67“. Jeden řádek matematiky to spraví a celá sekce začne vypadat jako přijímač.

# The readout
type: custom:mushroom-template-card
entity: media_player.your_receiver
icon: mdi:volume-high
primary: >-
  {% set v = state_attr('media_player.your_receiver','volume_level') %}
  {% if v is not none %}{{ (v * 100 - 80) | round(1) }} dB{% else %}Standby{% endif %}
secondary: Master volume
layout: vertical

# The slider. media_controls must be empty or the bar becomes a power button
type: custom:mushroom-media-player-card
entity: media_player.your_receiver
volume_controls:
  - volume_set
media_controls: []
show_volume_level: true

# A preset. 0.50 is master volume 50, which is -30 dB
type: custom:mushroom-template-card
entity: media_player.your_receiver
icon: mdi:weather-night
primary: Night
secondary: "-30 dB"
tap_action:
  action: perform-action
  perform_action: media_player.volume_set
  target:
    entity_id: media_player.your_receiver
  data:
    volume_level: 0.50

Název čtěte ze skriptu, místo abyste ho psali ručně, a přejmenování Scény v AVR Maestro přejmenuje dlaždici bez jakékoli úpravy dashboardu.

type: custom:mushroom-template-card
entity: script.avr_maestro_MAC_scene_1234567890123
icon: mdi:theater
primary: >-
  {{ state_attr('script.avr_maestro_MAC_scene_1234567890123','friendly_name')
     | replace('AVR Maestro - ', '') | replace(' (Your Receiver)', '') }}
secondary: >-
  {% set t = states.script['avr_maestro_MAC_scene_1234567890123'].attributes.last_triggered %}
  {{ 'recalled ' ~ relative_time(t) ~ ' ago' if t else 'not run yet' }}
multiline_secondary: true
tap_action:
  action: perform-action
  perform_action: script.turn_on
  target:
    entity_id: script.avr_maestro_MAC_scene_1234567890123

Dvě volání replace() ořezávají z popisného názvu předponu a název přijímače.

Druhý řádek stojí za tu minutu navíc. Zeď efektně pojmenovaných tlačítek vám ve 11 večer nic neřekne; řádek s popisem, co každé obnoví, vám řekne, které zmáčknout.

Entitu přehrávače médií přijímače zaznamenává Home Assistant jako každou jinou, takže historii poslechu máte zadarmo. Všechno níže pochází z té jediné entity: žádné další senzory, žádní pomocníci, nic, co by bylo třeba předem nastavovat.

Prostá časová osa stavů nepotřebuje žádné vlastní karty a je to ta, kterou stojí za to mít především:

type: history-graph
hours_to_show: 168
entities:
  - entity: media_player.your_receiver
    name: Receiver

Zapnuto, vypnuto a co přijímač dělal, v průběhu týdne.

Hlasitost v dB používá stejný převod jako krok 7:

type: custom:apexcharts-card
graph_span: 7d
header:
  show: true
  title: Master volume, last 7 days
series:
  - entity: media_player.your_receiver
    attribute: volume_level
    name: Master volume
    type: line
    curve: smooth
    unit: dB
    float_precision: 1
    transform: "return x == null ? null : Number(x) * 100 - 80;"
    extend_to: now
    group_by:
      duration: 1h
      func: last
      fill: last
apex_config:
  chart:
    height: 240
  yaxis:
    min: -60
    max: 0

group_by s fill: last promění řídké události ve spojitou čáru. Osa y musí být v apex_config, aby se projevila.

Denní průměr a špička promění zubatou čáru v něco s tvarem:

type: custom:apexcharts-card
graph_span: 7d
span:
  end: day
header:
  show: true
  title: Master volume by day in dB, average and peak
series:
  - entity: media_player.your_receiver
    attribute: volume_level
    name: Day average
    type: column
    float_precision: 1
    transform: "return x == null ? null : Number(x) * 100;"
    group_by: {duration: 1d, func: avg, fill: 'null'}
  - entity: media_player.your_receiver
    attribute: volume_level
    name: Day peak
    type: line
    curve: smooth
    float_precision: 1
    transform: "return x == null ? null : Number(x) * 100;"
    group_by: {duration: 1d, func: max, fill: 'null'}
apex_config:
  yaxis:
    min: 0
    max: 80
    labels:
      formatter: "EVAL:function (v) { return (v - 80).toFixed(0); }"
  tooltip:
    y:
      formatter: "EVAL:function (v) { return v == null ? '' : (v - 80).toFixed(1) + ' dB'; }"

Dvě řady ze stejného atributu, seskupené podle dne.

A dva grafy, které odpovídají na otázku „na čem se skutečně dívám a v jakém režimu“: zdroj a surroundový režim, vykreslené jako časová osa toho, co bylo zvoleno.

type: custom:apexcharts-card
graph_span: 7d
span:
  end: day
header:
  show: true
  title: Source in use, last 7 days
series:
  - entity: media_player.your_receiver
    attribute: source
    name: Source
    type: line
    curve: stepline
    stroke_width: 3
    extend_to: now
    float_precision: 0
    transform: |
      if (x == null) return null;
      var m = ["Phono", "NET", "Xbox", "Nvidia Shield"];
      var i = m.indexOf(x);
      return i < 0 ? 0 : i + 1;
apex_config:
  yaxis:
    min: 0
    max: 4
    tickAmount: 4
    labels:
      formatter: >-
        EVAL:function (v) { return ["Other", "Phono", "HEOS Net", "Xbox",
        "Shield"][Math.round(v)] || ''; }
  tooltip:
    y:
      formatter: >-
        EVAL:function (v) { return v == null ? 'off' : ["Other", "Phono",
        "HEOS Net", "Xbox", "Shield"][Math.round(v)] || 'Other'; }

Své vlastní zdroje vložte do pole transform i do obou polí formátovačů. Index 0 ponechte jako „Other“.

Osa grafu potřebuje čísla, takže transform přiřadí každému názvu zdroje pozici a formátovače ji pro popisky a tooltip převedou zpět. Zajistěte, aby bylo mapování úplné: null (přijímač vypnutý) zůstane mezerou a cokoli, co není ve vašem seznamu, spadne do „Other“, takže se obojí nikdy nemůže splést. Stejná karta s sound_mode vám dá surroundový režim, s řetězci velkými písmeny přesně tak, jak je hlásí váš přijímač.

Kompletní zobrazení, každá sekce a každá karta, se zástupnými symboly místo ID entit.

1. 1. Stáhněte si YAML zobrazení.
2. 2. Otevřete ho v libovolném textovém editoru a nahraďte dva řetězce všude, kde se objevují: YOUR_RECEIVER názvem entity vašeho přehrávače médií a YOURMAC dvanácti znaky vašeho přijímače z kroku 2.
3. 3. V Home Assistantu otevřete svůj dashboard, ikonu tužky, nabídku se třemi tečkami, Editor surové konfigurace a vložte to jako zobrazení.

Než usoudíte, že jste to postavili špatně: některé se rozsvítit nemohou a stojí za to vědět které.

Dlaždice může zobrazit svůj stav, jen když ho Home Assistant dokáže přečíst, a váš přijímač čte ze dvou míst. Integrace Denon AVR publikuje základní údaje na entitě přehrávače médií. AVR Maestro publikuje zbytek: vytvoří senzor Status Bridge, sensor.avr_maestro_your_receiver, a zapisuje na něj jako atributy hodnoty, které už má.

Oba sloupce jsou nyní čitelné. Hodnotu přehrávače médií vezměte z states['media_player.your_receiver'].attributes a hodnotu Status Bridge pomocí state_attr('sensor.avr_maestro_your_receiver','dirac_slot'), aby se dlaždice rozsvítila pro nastavení, které je skutečně aktivní, a nejen spouštěla skript, který ho mění.

Změřeno na přijímači, na kterém to vzniklo: entita přehrávače médií nese asi dvacet ze šedesáti ovládacích prvků a senzor Status Bridge publikuje zhruba čtyřicet dalších. Dohromady může dashboard číst téměř vše, co umí měnit - rozdíl mezi zdí tlačítek a skutečným ovládacím panelem.

icon_color: >-
  {% set d = state_attr('media_player.your_receiver','dynamic_eq') %}
  {{ 'orange' if d is true else 'grey' }}
secondary: >-
  {% set d = state_attr('media_player.your_receiver','dynamic_eq') %}
  {% if d is none %}state not published{% elif d %}on{% else %}off{% endif %}

Tři stavy, ne dva.

• Dlaždice vycházejí o třetinu užší, než čekáte. V sekci přes 3 sloupce má vnitřní mřížka 36 sloupců, ne 12. Pro čtyři dlaždice vedle sebe nastavte grid_options: {columns: 9}. Pro šest vedle sebe 6.
• Posuvník hlasitosti ukazuje tlačítko napájení místo lišty. To je media_controls s on_off uvnitř. Nastavte media_controls: [].
• Popisky se ořezávají. „Volume Down“ se změní na „Volume Do...“. Zkraťte na „Vol Down“ nebo dlaždici rozšiřte.
• Popisy scén se ořezávají. Přidejte multiline_secondary: true.
• Rovná čára z grafu apexcharts zmizí. To způsobuje experimental.color_threshold. Čáru kreslí jako svislý přechod a dokonale vodorovný segment má nulovou výšku, přes kterou by se přechod táhl, takže se vykreslí neviditelně. 43hodinová relace na jedné hlasitosti zmizela úplně. Použijte plnou color.
• Na telefonu se přeskupí samo. Zobrazení Sekce se při úzké šířce poskládají do jednoho sloupce, aniž byste cokoli nastavovali.

Začínáme · Domovská obrazovka · Scény · Vlastní ikony · Zvuk · Grafický ekvalizér · Reproduktory · Proč je ovládací prvek uzamčen · Asistent · Domácí automatizace · Zóny · Dálkový ovladač · Rádio (FM/AM) · Zobrazení na obrazovce · Nastavení · Jazyky · Ovládání hlasitosti · Záloha & obnova · Právě se přehrává & HEOS