Φτιάξτε αυτό το dashboard του Home Assistant σε περίπου μία ώρα

• Το AVR Maestro έχει συνδεθεί με το Home Assistant και έχει συγχρονιστεί. Ο οδηγός εγκατάστασης τα καλύπτει αυτά. Θα πρέπει να βλέπετε τα χειριστήριά σας στο Home Assistant πριν χτίσετε οτιδήποτε πάνω τους.
• Ο δέκτης σας έχει προστεθεί στο Home Assistant. Ρυθμίσεις › Συσκευές & υπηρεσίες › Προσθήκη ενσωμάτωσης › Denon AVR, και μετά η τοπική του IP. Αυτό δίνει στον πίνακα ελέγχου τη ζωντανή κατάσταση.
• Ο δέκτης σας είναι ενεργοποιημένος όσο τον στήνετε. Οι μισές από τις τιμές που θα γράψετε διαβάζουν ζωντανά δεδομένα, και ένας δέκτης σε αναμονή δεν δημοσιεύει σχεδόν τίποτα.

Δύο πηγές τροφοδοτούν αυτό το dashboard, και η διαφορά τους μετράει σε κάθε βήμα παρακάτω.

Και οι τέσσερις βρίσκονται στο προεπιλεγμένο κατάστημα του HACS. Στο Home Assistant: HACS › Frontend › Explore & Download Repositories, αναζητήστε το όνομα, πατήστε Download και ανανεώστε τον περιηγητή σας.

Κάθε απόσπασμα σε αυτή τη σελίδα χρησιμοποιεί δύο σημεία αναπλήρωσης. Βρείτε τα δικά σας μία φορά και όλα τα υπόλοιπα είναι αντιγραφή και επικόλληση.

• media_player.your_receiver → Ρυθμίσεις › Συσκευές & υπηρεσίες › ο δέκτης σας › η οντότητα media player. Κάτι σαν media_player.marantz_cinema_30.
• script.avr_maestro_MAC_... → Εργαλεία προγραμματιστή › Καταστάσεις, και πληκτρολογήστε avr_maestro στο φίλτρο οντοτήτων. Εμφανίζεται ολόκληρη η λίστα χειριστηρίων σας.

Το μεσαίο μέρος κάθε ID σεναρίου είναι η διεύθυνση MAC του δέκτη σας, δώδεκα πεζοί χαρακτήρες, ίδιοι σε όλα. Αντιγράψτε το μία φορά. Παντού όπου αυτή η σελίδα γράφει MAC, βάλτε το δικό σας.

1. 1. Settings › Dashboards › Add Dashboard › New dashboard from scratch. Δώστε του όποιο όνομα θέλετε.
2. 2. Ανοίξτε το και μετά πατήστε το εικονίδιο μολυβιού πάνω δεξιά για επεξεργασία.
3. 3. Προσθέστε μια προβολή και επιλέξτε τη διάταξη Sections. Όχι Masonry. Η Sections είναι αυτή που κάνει την προβολή να προσαρμόζεται σωστά στο κινητό.
4. 4. Στις ρυθμίσεις της προβολής, ορίστε το Max columns στο 3 και ενεργοποιήστε το Dense section placement.

Από εδώ και πέρα, κάθε βήμα είναι το ίδιο: προσθέτετε μια ενότητα και επικολλάτε κάρτες μέσα της. Για να επικολλήσετε YAML, χρησιμοποιήστε το μενού με τις τρεις τελείες σε μια κάρτα και επιλέξτε Edit in YAML, ή το μενού με τις τρεις τελείες του dashboard για το Raw configuration editor, ώστε να επικολλήσετε τα πάντα με τη μία.

# 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

Ξεκινήστε με το πιο απλό πράγμα στον πίνακα, ώστε να βεβαιωθείτε ότι τα ID των οντοτήτων σας είναι σωστά προτού χτίσετε οτιδήποτε περίπλοκο. Προσθέστε μια ενότητα, προσθέστε μια κάρτα, Edit in YAML και επικολλήστε:

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

Στάνταρ Home Assistant. Δεν χρειάζεται HACS.

Πατήστε το. Αν ο δέκτης αλλάξει, τα ID σας είναι σωστά και όλα τα παρακάτω θα λειτουργήσουν. Αν δεν συμβεί τίποτα, γυρίστε στο βήμα 2.

Αυτό είναι το μοτίβο που αξίζει να μάθετε, και κάθε πλακίδιο πηγής και surround στον πίνακα είναι αντίγραφό του. Η κάρτα στέλνει ένα σενάριο και παίρνει το χρώμα της από την οντότητα του δέκτη, έτσι η είσοδος στην οποία βρίσκεστε πραγματικά είναι φωτισμένη και οι υπόλοιπες όχι.

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 %}
    }

Αλλάξτε τρία πράγματα ανά είσοδο: το σενάριο, το εικονίδιο και τη συμβολοσειρά με την οποία γίνεται η σύγκριση.

Δύο πράγματα πρέπει να είναι σωστά, αλλιώς ένα πλακίδιο δεν θα φωτιστεί ποτέ:

• Συγκρίνετε με ό,τι αναφέρει πραγματικά ο δέκτης σας. Developer Tools › States, η οντότητα media player σας, διαβάστε τα χαρακτηριστικά source_list και sound_mode_list. Αυτές είναι οι ακριβείς συμβολοσειρές. Συγκρίνετε με πεζά, όπως παραπάνω.
• Μια μετονομασμένη είσοδος αναφέρει το νέο της όνομα. Μετονομάστε το GAME1 σε «Xbox» στον δέκτη και αναφέρει Xbox, ενώ το χειριστήριο του AVR Maestro εξακολουθεί να λέγεται input_game1. Ταιριάξτε με αυτό που αναφέρει ο δέκτης, όχι με το όνομα του σεναρίου.

Οι λειτουργίες surround είναι η ίδια κάρτα με sound_mode στη θέση του source.

Ένας απλός τίτλος είναι χαμένος χώρος. Βάλτε από κάτω την τρέχουσα τιμή και το «Πηγές» γίνεται «Πηγές / Τώρα στο 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

Το πλέγμα δύο γραμμών είναι αυτό που βάζει την ετικέτα κάτω από τον τίτλο αντί δίπλα του.

Αντικαταστήστε το attributes.source με το attributes.sound_mode στην κεφαλίδα Surround, και ούτω καθεξής.

Το Home Assistant αναφέρει την ένταση ως κλάσμα. Κανείς δεν ρυθμίζει έναν δέκτη στο «0.67». Μία γραμμή μαθηματικών το διορθώνει και ολόκληρη η ενότητα αρχίζει να διαβάζεται σαν δέκτης.

# 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

Διαβάστε το όνομα από το σενάριο αντί να το πληκτρολογείτε, και η μετονομασία μιας Σκηνής στο AVR Maestro μετονομάζει το πλακίδιο χωρίς καμία επεξεργασία του dashboard.

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

Οι δύο κλήσεις replace() αφαιρούν το πρόθεμα και το όνομα του δέκτη από το φιλικό όνομα.

Μια δεύτερη γραμμή αξίζει το επιπλέον λεπτό. Ένας τοίχος από κουμπιά με φανταχτερά ονόματα δεν σας λέει τίποτα στις 11 το βράδυ· μια γραμμή που λέει τι επαναφέρει το καθένα σας δείχνει ποιο να πατήσετε.

Η οντότητα media player του δέκτη καταγράφεται από το Home Assistant όπως κάθε άλλη, οπότε παίρνετε ιστορικό ακρόασης δωρεάν. Όλα τα παρακάτω προέρχονται από αυτή τη μία οντότητα: χωρίς επιπλέον αισθητήρες, χωρίς helpers, τίποτα για να ρυθμίσετε πρώτα.

Η απλή χρονογραμμή καταστάσεων δεν χρειάζεται καθόλου προσαρμοσμένες κάρτες και είναι αυτή που αξίζει περισσότερο:

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

Ενεργός, ανενεργός και τι έκανε, σε διάστημα μιας εβδομάδας.

Η ένταση σε dB χρησιμοποιεί την ίδια μετατροπή με το βήμα 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 με fill: last μετατρέπει τα αραιά συμβάντα σε συνεχή γραμμή. Ο άξονας y πρέπει να μπει στο apex_config για να ισχύσει.

Ένας ημερήσιος μέσος όρος και μέγιστο μετατρέπει μια τραχιά γραμμή σε κάτι που έχει σχήμα:

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'; }"

Δύο σειρές από το ίδιο χαρακτηριστικό, ομαδοποιημένες ανά ημέρα.

Και τα δύο που απαντούν στο «σε τι βλέπω πραγματικά, και με ποια λειτουργία»: πηγή και λειτουργία surround, σχεδιασμένα ως χρονογραμμή του ποια ήταν επιλεγμένη.

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'; }

Βάλτε τις δικές σας πηγές στον πίνακα transform και στους δύο πίνακες μορφοποίησης. Κρατήστε το index 0 ως «Other».

Ο άξονας ενός γραφήματος χρειάζεται αριθμούς, οπότε το transform αντιστοιχίζει κάθε όνομα πηγής σε μια θέση και οι μορφοποιητές την επαναφέρουν σε όνομα για τις ετικέτες και το tooltip. Κάντε την αντιστοίχιση ολική: το null (δέκτης σβηστός) μένει κενό, και ό,τι δεν υπάρχει στη λίστα σας πέφτει στο «Other», ώστε τα δύο να μη μπερδεύονται ποτέ. Η ίδια κάρτα με sound_mode σας δίνει τη λειτουργία surround, με τις συμβολοσειρές σε κεφαλαία ακριβώς όπως τις αναφέρει ο δέκτης σας.

Η πλήρης προβολή, κάθε ενότητα και κάθε κάρτα, με σημεία αναπλήρωσης αντί για ID οντοτήτων.

1. 1. Λήψη του YAML της προβολής.
2. 2. Ανοίξτε το σε οποιοδήποτε πρόγραμμα επεξεργασίας κειμένου και αντικαταστήστε δύο συμβολοσειρές, παντού όπου εμφανίζονται: το YOUR_RECEIVER με το όνομα της οντότητας media player σας, και το YOURMAC με τους δώδεκα χαρακτήρες του δέκτη σας από το βήμα 2.
3. 3. Στο Home Assistant, ανοίξτε το dashboard σας, εικονίδιο μολυβιού, μενού τριών τελειών, Raw configuration editor, και επικολλήστε το ως προβολή.

Προτού υποθέσετε ότι το χτίσατε λάθος: μερικά δεν μπορούν να φωτιστούν, και αξίζει να ξέρετε ποια.

Ένα πλακίδιο μπορεί να δείξει την κατάστασή του μόνο αν το Home Assistant μπορεί να τη διαβάσει, και διαβάζει τον δέκτη σας από δύο μέρη. Η ενσωμάτωση Denon AVR δημοσιεύει τα βασικά στην οντότητα media player. Το AVR Maestro δημοσιεύει τα υπόλοιπα: δημιουργεί έναν αισθητήρα Status Bridge, sensor.avr_maestro_your_receiver, και γράφει πάνω του ως χαρακτηριστικά τις μετρήσεις που ήδη διαθέτει.

Και οι δύο στήλες είναι πλέον αναγνώσιμες. Πάρτε μια τιμή media player από το states['media_player.your_receiver'].attributes, και μια τιμή του Status Bridge με το state_attr('sensor.avr_maestro_your_receiver','dirac_slot'), ώστε ένα πλακίδιο να φωτίζεται για τη ρύθμιση που είναι πραγματικά ενεργή αντί να εκτελεί απλώς το σενάριο που την αλλάζει.

Μετρήθηκε στον δέκτη στον οποίο στήθηκε αυτό: η οντότητα media player μεταφέρει περίπου είκοσι από τα εξήντα χειριστήρια και ο αισθητήρας Status Bridge δημοσιεύει περίπου σαράντα ακόμη. Μαζί, ένα dashboard μπορεί να διαβάσει σχεδόν ό,τι μπορεί να αλλάξει - η διαφορά ανάμεσα σε έναν τοίχο από κουμπιά και μια πραγματική επιφάνεια ελέγχου.

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 %}

Τρεις καταστάσεις, όχι δύο.

• Τα πλακίδια βγαίνουν στο ένα τρίτο του πλάτους που περιμένετε. Σε μια ενότητα που εκτείνεται σε 3 στήλες, το εσωτερικό πλέγμα έχει 36 στήλες, όχι 12. Για τέσσερα πλακίδια σε σειρά, ορίστε grid_options: {columns: 9}. Για έξι σε σειρά, 6.
• Το ρυθμιστικό έντασης δείχνει κουμπί λειτουργίας αντί για μπάρα. Αυτό συμβαίνει με το media_controls που περιέχει on_off. Ορίστε media_controls: [].
• Οι ετικέτες κόβονται. Το «Volume Down» γίνεται «Volume Do...». Συντομεύστε το σε «Vol Down», ή φαρδύνετε το πλακίδιο.
• Οι περιγραφές των Σκηνών κόβονται. Προσθέστε multiline_secondary: true.
• Μια σταθερή γραμμή εξαφανίζεται από ένα γράφημα apexcharts. Αυτό είναι το experimental.color_threshold. Ζωγραφίζει τη γραμμή ως κάθετη διαβάθμιση, και ένα απολύτως οριζόντιο τμήμα έχει μηδενικό ύψος για να διαβαθμιστεί, οπότε αποδίδεται αόρατο. Μια συνεδρία 43 ωρών σε μία ένταση χάθηκε εντελώς. Χρησιμοποιήστε ένα συμπαγές color.
• Προσαρμόζεται μόνο του στο κινητό. Οι προβολές Sections στοιβάζονται σε μία στήλη σε στενά πλάτη χωρίς καμία επιπλέον ρύθμιση.

Ξεκινώντας · Αρχική οθόνη · Σκηνές · Προσαρμοσμένα εικονίδια · Ήχος · Graphic EQ · Ηχεία · Γιατί ένα χειριστήριο είναι κλειδωμένο · Ο Βοηθός · Αυτοματισμός Σπιτιού · Ζώνες · Τηλεχειριστήριο · Ραδιόφωνο (FM/AM) · Ενδείξεις οθόνης · Ρυθμίσεις · Γλώσσες · Χειριστήρια έντασης · Αντίγραφο ασφαλείας & επαναφορά · Αναπαράγεται τώρα & HEOS