# ============================================================= # ΠΑΡΑΔΕΙΓΜΑΤΑ MUSHROOM ΚΑΡΤΩΝ ΓΙΑ HOME ASSISTANT # Βασισμένα στη λογική του βίντεο "Dashboards for Beginners 2025" # Όλα τα σχόλια είναι στα ελληνικά. # ============================================================= # # ΤΙ ΠΡΕΠΕΙ ΝΑ ΕΧΕΙΣ ΕΓΚΑΤΑΣΤΗΣΕΙ ΑΠΟ ΤΟ HACS (Frontend): # 1. Mushroom -> piitaya/lovelace-mushroom # 2. stack-in-card -> custom-cards/stack-in-card # 3. card-mod -> thomasloven/lovelace-card-mod # # ΠΩΣ ΤΟ ΒΑΖΕΙΣ: # Dashboard -> μολύβι (Επεξεργασία) -> τρεις τελείες -> # "Raw configuration editor" (ή στην κάρτα: "Show code editor") # # ΠΡΟΣΟΧΗ: όλα τα entity_id παρακάτω είναι ΠΑΡΑΔΕΙΓΜΑΤΑ. # Αντικατέστησέ τα με τα δικά σου (Ρυθμίσεις -> Συσκευές -> Οντότητες). # # ============================================================= # ------------------------------------------------------------- # ΜΕΡΟΣ 1: BADGE ΜΕ ΣΥΝΘΗΚΕΣ (3D printer) # ------------------------------------------------------------- # Το badge είναι το μικρό "τσιπάκι" στην κορυφή της σελίδας. # Το ενσωματωμένο badge της HA ΔΕΝ δέχεται templates — γι' αυτό # χρησιμοποιούμε το template badge του Mushroom. # # Μπαίνει στην ενότητα badges: της κάθε view, ΟΧΙ στα cards:. # ------------------------------------------------------------- badges: - type: custom:mushroom-template-badge # Η οντότητα-αναφορά. Μέσα στα templates τη λες σκέτα "entity". entity: sensor.printer_state # ΕΙΚΟΝΙΔΙΟ ΥΠΟ ΣΥΝΘΗΚΗ: # αλλάζει ανάλογα με το τι κάνει ο εκτυπωτής αυτή τη στιγμή. # Το "-" μετά το > σημαίνει: ένωσέ το σε μία γραμμή, χωρίς κενό στο τέλος. icon: >- {% if is_state(entity, 'printing') %} mdi:printer-3d-nozzle {% elif is_state(entity, 'complete') %} mdi:check-circle {% else %} mdi:printer-3d-nozzle-off {% endif %} # ΧΡΩΜΑ ΕΙΚΟΝΙΔΙΟΥ: # δέχεται ονόματα χρωμάτων του Material (red, blue, purple, grey...) color: >- {% if is_state(entity, 'printing') %} purple {% elif is_state(entity, 'complete') %} green {% else %} grey {% endif %} # ΚΕΙΜΕΝΟ ΔΙΠΛΑ ΣΤΟ ΕΙΚΟΝΙΔΙΟ: # όταν τυπώνει -> ποσοστό προόδου, αλλιώς λεκτικό στα ελληνικά. # Το | int(0) βάζει 0 αν η τιμή είναι κενή/unavailable, ώστε # να μη "σκάσει" η κάρτα με κόκκινο μήνυμα σφάλματος. content: >- {% if is_state(entity, 'printing') %} {{ states('sensor.printer_progress') | int(0) }}% {% elif is_state(entity, 'complete') %} Ολοκληρώθηκε {% else %} Αναμονή {% endif %} # ΜΙΚΡΟ ΛΕΚΤΙΚΟ ΑΠΟ ΠΑΝΩ (προαιρετικό) - εδώ το όνομα της συσκευής. label: Εκτυπωτής # ΤΙ ΓΙΝΕΤΑΙ ΜΕ ΤΟ ΠΑΤΗΜΑ: # navigate = πήγαινέ με κάπου αλλού. # Το navigation_path μπορεί να είναι: # - σελίδα συσκευής: /config/devices/device/ # - άλλη view του dashboard: /lovelace/salon tap_action: action: navigate navigation_path: /config/devices/device/ΑΛΛΑΞΕ_ΜΕ_ΤΟ_DEVICE_ID # ------------------------------------------------------------- # ΜΕΡΟΣ 2: ΣΥΝΘΕΤΗ ΚΑΡΤΑ ΕΛΕΓΧΟΥ (ρομποτική σκούπα) # ------------------------------------------------------------- # Η ιδέα: πολλές μικρές κάρτες ενωμένες ώστε να ΦΑΙΝΟΝΤΑΙ σαν μία. # # stack-in-card = τις βάζει όλες μέσα σε ΕΝΑ πλαίσιο # card-mod = σβήνει τα εσωτερικά περιγράμματα και τις σκιές # (χωρίς αυτό βλέπεις γραμμές ανάμεσα στις κάρτες) # # Μπαίνει στην ενότητα cards: της view. # ------------------------------------------------------------- cards: - type: custom:stack-in-card mode: vertical # η μία κάρτα κάτω από την άλλη cards: # --- ΕΠΑΝΩ ΜΕΡΟΣ: κατάσταση συσκευής --- - type: custom:mushroom-template-card entity: vacuum.skoupa_salonioy primary: Σκούπα σαλονιού # μεγάλο κείμενο # ΜΕΤΑΦΡΑΣΗ ΚΑΤΑΣΤΑΣΗΣ ΣΤΑ ΕΛΛΗΝΙΚΑ: # η HA επιστρέφει αγγλικά (cleaning, docked...), οπότε τα # αντιστοιχίζουμε μόνοι μας. secondary: >- {% set s = states(entity) %} {% if s == 'cleaning' %} Καθαρίζει {% elif s == 'docked' %} Στη βάση {% elif s == 'returning' %} Επιστρέφει {% elif s == 'paused' %} Σε παύση {% elif s == 'error' %} Σφάλμα {% else %} Άγνωστη κατάσταση {% endif %} icon: mdi:robot-vacuum icon_color: >- {% set s = states(entity) %} {% if s == 'cleaning' %} blue {% elif s == 'docked' %} grey {% elif s == 'error' %} red {% else %} orange {% endif %} # Πατώντας το πάνω μέρος -> ξεκινά ο καθαρισμός. # ΣΗΜΕΙΩΣΗ: το "perform-action" ισχύει σε HA 2024.8 και νεότερες. # Σε παλαιότερες εκδόσεις γράφεις: # action: call-service # service: vacuum.start tap_action: action: perform-action perform_action: vacuum.start target: entity_id: vacuum.skoupa_salonioy # Κρατάμε πάτημα -> ανοίγει το αναλυτικό παράθυρο της συσκευής. hold_action: action: more-info # CARD-MOD: αφαιρούμε σκιά και περίγραμμα ώστε να δένει # οπτικά με την από κάτω σειρά κουμπιών. card_mod: style: | ha-card { box-shadow: none; border: none; } # --- ΚΑΤΩ ΜΕΡΟΣ: σειρά κουμπιών ελέγχου --- # Το horizontal-stack τα βάζει όλα στην ίδια γραμμή. - type: horizontal-stack cards: # ΚΟΥΜΠΙ 1: Εκκίνηση - type: custom:mushroom-template-card icon: mdi:play icon_color: green tap_action: action: perform-action perform_action: vacuum.start target: entity_id: vacuum.skoupa_salonioy card_mod: style: | ha-card { box-shadow: none; border: none; /* λιγότερο κενό γύρω από το εικονίδιο */ --ha-card-border-width: 0; } # ΚΟΥΜΠΙ 2: Παύση - type: custom:mushroom-template-card icon: mdi:pause icon_color: orange tap_action: action: perform-action perform_action: vacuum.pause target: entity_id: vacuum.skoupa_salonioy card_mod: style: | ha-card { box-shadow: none; border: none; --ha-card-border-width: 0; } # ΚΟΥΜΠΙ 3: Επιστροφή στη βάση - type: custom:mushroom-template-card icon: mdi:home-import-outline icon_color: blue tap_action: action: perform-action perform_action: vacuum.return_to_base target: entity_id: vacuum.skoupa_salonioy card_mod: style: | ha-card { box-shadow: none; border: none; --ha-card-border-width: 0; } # ΚΟΥΜΠΙ 4: Εντοπισμός (η σκούπα κάνει ήχο για να τη βρεις) - type: custom:mushroom-template-card icon: mdi:map-marker icon_color: purple tap_action: action: perform-action perform_action: vacuum.locate target: entity_id: vacuum.skoupa_salonioy card_mod: style: | ha-card { box-shadow: none; border: none; --ha-card-border-width: 0; } # ============================================================= # ΣΗΜΕΙΩΣΕΙΣ ΠΡΟΣΑΡΜΟΓΗΣ # ============================================================= # # 1. Αν μια κάρτα βγάλει κόκκινο σφάλμα "Custom element doesn't # exist", δεν έχει φορτώσει το HACS component. Κάνε σκληρή # ανανέωση στον browser (Ctrl+F5) ή επανεκκίνηση της HA. # # 2. Τα templates δοκιμάζονται ΠΡΙΝ τα βάλεις στην κάρτα, στο: # Εργαλεία προγραμματιστή -> Πρότυπα (Template). # Κάνεις επικόλληση και βλέπεις αμέσως το αποτέλεσμα. # # 3. Πρόσεχε την εσοχή (indentation). Το YAML δουλεύει ΜΟΝΟ με # κενά, ποτέ με Tab. Ένα λάθος κενό ρίχνει όλη την κάρτα. # # 4. Αν αλλάξεις entity_id αργότερα, θυμήσου ότι το entity_id # εμφανίζεται και μέσα στα tap_action -> target. # # =============================================================