notifications.yaml

anchors:  
  card_base: &card_base
    type: custom:button-card
    show_name: false
    aspect_ratio: 1/1
  notification_count_style: &notification_count_style
    background-color: >
      [[[
        function activeCount(entities, active, operator) {
          var count = 0;
          for ( var entity in entities ) {
            if ( states[entities[entity]] ) {
              switch (operator) {
                case ">":
                  count += states[entities[entity]].state > active;
                case "<":
                  count += states[entities[entity]].state < active;
                  break;
                default:
                  count += states[entities[entity]].state === active;
                  break;
              }
            }
          }

          return count;
        }
        var count = activeCount(entity.attributes.entity_id, 'open', '=') + activeCount(entity.attributes.entity_id, 'on', '=') + activeCount(entity.attributes.entity_id, 'playing', '=') + activeCount(entity.attributes.entity_id, 40, '<') + activeCount(entity.attributes.entity_id, 'problem', '=');
        if (count > 0)
          return "var(--accent-color)";
        return "";
      ]]]
  notification_count_field: &notification_count_field
    notification: >
      [[[ 
        function activeCount(entities, active, operator) {
          var count = 0;
          for ( var entity in entities ) {
            if ( states[entities[entity]] ) {
              switch (operator) {
                case ">":
                  count += states[entities[entity]].state > active;
                case "<":
                  count += states[entities[entity]].state < active;
                  break;
                default:
                  count += states[entities[entity]].state === active;
                  break;
              }
            }
          }

          return count;
        }
        var count = activeCount(entity.attributes.entity_id, 'open', '=') + activeCount(entity.attributes.entity_id, 'on', '=') + activeCount(entity.attributes.entity_id, 'playing', '=') + activeCount(entity.attributes.entity_id, 40, '<') + activeCount(entity.attributes.entity_id, 'problem', '=');
        if (count > 0)
          return count;
        return "";
      ]]]
  count_button: &count_button
    <<: *card_base
    styles:
      card:
        - padding: 0px
      grid:
        - position: relative
      custom_fields:
        notification:
          - <<: *notification_count_style
          - border-radius: 50%
          - position: absolute
          - left: 60%
          - top: 15%
          - height: 20px
          - width: 20px
          - font-size: 10px
          - line-height: 20px
          - font-family: Helvetica
    custom_fields:
      <<: *notification_count_field
title: Home
views:
  - path: summary
    title: Summary
    badges: []
    panel: true
    cards:
      - <<: *count_button # Lights
        <<: *standard_button_state
        <<: *light_tap_action
        entity: group.lights