Plantilles de Targetes Personalitzades Suport de Mapes

Les cartes d'aquesta pàgina són plantilles dissenyades per generar configuracions de cartes personalitzades específicament per a l'ús amb la integració Dreame Vacuum. Cada plantilla de carta d'aquesta pàgina pot requerir una instal·lació de carta personalitzada diferent.

Carta d'habitacions

La carta d'habitacions està dissenyada per recollir i gestionar totes les diverses entitats de configuració de neteja personalitzada generades per la integració per a cada habitació en una sola carta utilitzant les cartes personalitzades Plantilla de configuració de carta i Fila d'entitats múltiples.

Per obtenir més informació sobre aquestes entitats, consulteu el Entitats d'habitació per a la neteja personalitzada.

Per generar la configuració completa de la carta a partir d'aquesta plantilla, s'utilitza el Editor de plantilles de Home Assistant.

Si la integració My Home Assistant està activa, el botó següent es pot utilitzar per anar directament a l'Editor de plantilles:

Eines de plantilla de

Si es requereix una navegació manual, seguiu aquests passos:

1. Ves al panell Eines de desenvolupador a Home Assistant.
2. Selecciona la pestanya Plantilla del menú superior.
3. Enganxa el codi de plantilla proporcionat a continuació al panell de l'editor de l'esquerra.
4. Copia la sortida YAML resultant generada al panell de Resultat de la dreta.
5. Enganxa la sortida generada a la configuració de la targeta Lovelace.

Important

Assegura't de substituir el marcador de posició vacuum. a la línia {% set vacuum_entity = "vacuum." %} pel teu ID d'entitat de l'aspiradora abans d’utilitzar la plantilla.

Exemple: {% set vacuum_entity = "vacuum.l10s_gen2" %}

Mostra codi

{# ----------------- PROVIDE YOUR OWN ENTITY ID HERE ----------------- #}
{% set vacuum_entity = "vacuum." %}
{# ------------------- DO NOT CHANGE ANYTHING BELOW ------------------- #}
{%- set vacuum_name = states[vacuum_entity].entity_id.replace('vacuum.', '') %} 
{%- set mop_pad = ('mop_pad_humidity' in states[vacuum_entity].attributes)|bool %}
{% set rooms = namespace(list=[]) %}
{%- if 'rooms' in states[vacuum_entity].attributes %}
{%- for map in states[vacuum_entity].attributes.rooms.values() %}  
    {%- for room in map %}      
    {%- if room.id not in rooms.list %}
        {%- set rooms.list = rooms.list + [room.id] %}
    {%- endif %}
    {%- endfor %}
{%- endfor %}
{%- endif %}
{%- set rooms.list = rooms.list|sort() %}

type: entities
title: Rooms
show_header_toggle: false
entities:
{%- for room in rooms.list %}
{%- set custom_cleaning_mode = states['select.' + vacuum_name + '_room_' + room|string + '_cleaning_mode'] != None %}
{%- set room_exists = "states['" + vacuum_entity + "'].attributes.cleaning_sequence && states['" + vacuum_entity + "'].attributes.cleaning_sequence.length > " + (loop.index - 1)|string  %} 
{%- set room_id = "(" + room_exists + " ? (states['" + vacuum_entity + "'].attributes.cleaning_sequence[" + (loop.index - 1)|string + "]) : " + room|string + ")" %}
{%- set current_room = "(vars[5].state == 'unavailable' && states['select." + vacuum_name + "_cleaning_mode'].state == 'unavailable' && states['" + vacuum_entity + "'].attributes.current_segment == vars[0])" %}
  - type: custom:config-template-card
    variables:
      - >- 
        {{ room_id }}
      - states['select.{{ vacuum_name }}_room_' + vars[0] + '_name'] 
      - states['select.{{ vacuum_name }}_room_' + vars[0] + '_suction_level']
      {%- if mop_pad %}
      - states['select.{{ vacuum_name }}_room_' + vars[0] + '_mop_pad_humidity']
      {%- else %}
      - states['select.{{ vacuum_name }}_room_' + vars[0] + '_water_volume']
      {%- endif %}
      - states['select.{{ vacuum_name }}_room_' + vars[0] + '_cleaning_times']
      - states['select.{{ vacuum_name }}_room_' + vars[0] + '_order']
      - >- 
        states['{{ vacuum_entity }}']
      - >-
        (vars[6].attributes.rooms && vars[6].attributes.selected_map ? vars[6].attributes.rooms[vars[6].attributes.selected_map].filter(function (e) { return states['select.{{ vacuum_name }}_room_' + e.id + '_order'] && states['select.{{ vacuum_name }}_room_' + e.id + '_order'].state != 'not_set' }).length : 0)
      - >-
        ({{ current_room }} ? 'var(--state-icon-active-color)' : 'var(--primary-text-color)')
      - >-
        (vars[6].attributes.cleaning_sequence ? 'inherit' : 'none')
      - >-
        (vars[5] && vars[5].state != 'unavailable' ? 'inherit' : 'none')
      - >-
        (vars[6].attributes.customized_cleaning && (!vars[6].attributes.active_segments || states['{{ vacuum_entity }}'].attributes.active_segments.includes(vars[0])) ? 'inherit' : 'none')        
      - >-
        (vars[5] && vars[5].state != 'not_set' ? 'inherit' : 'hidden')
      {%- if custom_cleaning_mode %}
      - states['select.{{ vacuum_name }}_room_' + vars[0] + '_cleaning_mode']
      {%- endif %}
    entities:
      - ${vars[1].entity_id}
      - ${vars[2].entity_id}
      - ${vars[3].entity_id}
      - ${vars[4].entity_id}
      - ${vars[5].entity_id}
      - ${vars[6].entity_id}
      {%- if custom_cleaning_mode %}
      - ${vars[13].entity_id}
      {%- endif %}
    card:
      type: conditional
      conditions:
        - entity: ${vars[1].entity_id}
          state_not: unavailable
      card:            
        type: custom:multiple-entity-row
        entity: ${vars[1].entity_id}
        show_state: false
        name: ${vars[1].state}
        entities:
        {%- if custom_cleaning_mode %}
          - icon: ${vars[13].attributes.icon}
            entity: ${vars[13].entity_id}
            name: ' '
            tap_action: 
              action: call-service
              service: dreame_vacuum.select_select_next
              service_data:
                entity_id: ${vars[13].entity_id}
            double_tap_action:
              action: call-service
              service: dreame_vacuum.select_select_previous
              service_data:
                entity_id: ${vars[13].entity_id}
            hold_action:
              action: more-info
            styles:
              display: ${vars[11]}
              pointer-events: >-
                ${vars[13].state != 'unavailable' ? 'inherit' : 'none'}
              width: 28px
              '--paper-item-icon-color': ${vars[8]}
        {%- endif %}
          - icon: ${vars[2].attributes.icon}
            entity: ${vars[2].entity_id}
            name: ' '
            tap_action: 
              action: call-service
              service: dreame_vacuum.select_select_next
              service_data:
                entity_id: ${vars[2].entity_id}
            double_tap_action:
              action: call-service
              service: dreame_vacuum.select_select_previous
              service_data:
                entity_id: ${vars[2].entity_id}
            hold_action:
              action: more-info
            styles:
              display: ${vars[11]}
              pointer-events: >-
                ${vars[2].state != 'unavailable' ? 'inherit' : 'none'}
              width: 28px
              '--paper-item-icon-color': ${vars[8]}
          - icon: ${vars[3].attributes.icon}
            entity: ${vars[3].entity_id}
            name: ' '
            tap_action:
              action: call-service
              service: dreame_vacuum.select_select_next
              service_data:
                entity_id: ${vars[3].entity_id}
            double_tap_action:
              action: call-service
              service: dreame_vacuum.select_select_previous
              service_data:
                entity_id: ${vars[3].entity_id}
            styles:
              display: ${vars[11]}
              pointer-events: >-
                ${vars[3].state != 'unavailable' ? 'inherit' : 'none'}
              width: 28px
              '--paper-item-icon-color': ${vars[8]}
          - icon: ${vars[4].attributes.icon}
            entity: ${vars[4].entity_id}
            name: ' '
            tap_action:
              action: call-service
              service: dreame_vacuum.select_select_next
              service_data:
                entity_id: ${vars[4].entity_id}
            double_tap_action:
              action: call-service
              service: dreame_vacuum.select_select_previous
              service_data:
                entity_id: ${vars[4].entity_id}
            hold_action:
              action: more-info
            styles:
              display: ${vars[11]}
              pointer-events: >-
                ${vars[4].state != 'unavailable' ? 'inherit' : 'none'}
              width: 28px
              '--paper-item-icon-color': ${vars[8]}
          - icon: mdi:chevron-down
            entity: ${vars[5].entity_id}
            name: ' '
            tap_action:
              action: call-service
              service: dreame_vacuum.select_select_next
              service_data:
                entity_id: ${vars[5].entity_id}
                cycle: false
            hold_action:
              action: more-info
            styles:
              display: ${vars[9]}
              visibility: ${vars[12]}
              margin-right: 0
              margin-left: 8px
              '--paper-item-icon-color': >-
                ${(vars[7] > {{ loop.index }} ? 'var(--primary-color)' : 'var(--state-unavailable-color)')}
              pointer-events: >-
                ${(vars[7] > {{ loop.index }} ? vars[10] : 'none')}
          - icon: mdi:chevron-up
            entity: ${vars[5].entity_id}
            name: ' '
            tap_action:
              action: call-service
              service: dreame_vacuum.select_select_previous
              service_data:
                entity_id: ${vars[5].entity_id}
                cycle: false
            hold_action:
              action: more-info
            styles:
              display: ${vars[9]}
              visibility: ${vars[12]}
              '--paper-item-icon-color': {{ 'var(--primary-color)' if loop.index > 1 else 'var(--state-unavailable-color)' }}
              pointer-events: {{ "${vars[10]}" if loop.index > 1 else 'none' }}
  {%- endfor %}
  - type: divider
  - entity: switch.{{vacuum_name}}_customized_cleaning
    name: Customized Cleaning    
{%- if states['switch.' + vacuum_name + '_cleaning_sequence'] is not none %}
  - entity: switch.{{vacuum_name}}_cleaning_sequence
    name: Cleaning Sequence
{%- endif %}

Targeta d'historial de neteja

La targeta d'historial de neteja està dissenyada per mostrar mapes de treballs de neteja passats utilitzant la targeta personalitzada Targeta de botó. Un menú desplegable situat a la part superior de la targeta permet seleccionar i visualitzar el mapa d'un treball passat específic.

Per a més informació sobre aquests mapes, consulta la Mapes d'historial de neteja i recorreguts.

Mostra codi

type: custom:button-card
entity: camera. # Current map camera entity
label: Cleaning History # Optional
title: Cleaning History # Optional
icon: mdi:clipboard-text-clock
tap_action:
  action: none
entity_picture: >
  [[[ return function(t){const e=t._config;if(t.shadowRoot.querySelector("hui-error-card")&&!t._u)return t._u=!0,t.style.opacity=0,void setTimeout((function(){t.style.opacity=1,t.update()}),0);if(!t.__shouldUpdate){t._u=!1;const i=/v=([^&]*)/,o=/index=([^&]*)/;t.__shouldUpdate=t.shouldUpdate,t.shouldUpdate=function(t){const e=this;let o=e.__shouldUpdate(t);if(t&&t.has("_config"))return e.shouldUpdate=e.__shouldUpdate,e.__shouldUpdate=null,e._s=null,!0;const a=e._config,n=e._hass.states[a.entity],l=t.get("_hass"),s=l?l.states[a.entity]:null;if(o=l&&s!=n,!o)return!1;e._l&&(e._l.stateObj=n);let r=e.__items(e._hass);const c=e.__items(l)[0].join(",")!==r[0].join(",");if(e._i&&n&&!c){if(!c&&e._i&&n&&e._a){const t=n.attributes.access_token;if(t!=e._a&&(e._config.hold_action.url_path=e._i[1].replace(e._a,t),e._a=t,this._config.custom_fields))return!0}return e.hass=e._hass,!1}let d=0;const u=e._s;if(n){const t=n.attributes.access_token;if(!c&&t!=e._a){let i=n.attributes[a.picture_list+"_picture"];if(i)if("string"==typeof i||i instanceof String)i=i.replace(e._a,t);else for(let o=0;o<r[0].length;o++)i[r[0][o]]=i[r[0][o]].replace(e._a,t)}if(e._a=t,d=u&&""===u.value?0:parseInt(u.value),d<0||d>=r[0].length)d=0;else if(d>0&&r[0].length>0&&(d=0,e._i&&(d=r[0].indexOf(e._i[0]),-1===d))){d=0;let t=e._i[1].match(i)[1];for(let e=0;e<r[1].length;e++)if(t==r[1][e].match(i)[1]){d=e;break}}}return u.label=!(!a.label||!n)&&a.label,e.__populate(d,r[0],u),u.dispatchEvent(new Event("change")),o},t.__items=function(t){if(t){const e=t.states[this._config.entity];if(e&&e.attributes){const t=e.attributes[this._config.picture_list+"_picture"];if(t){if("string"==typeof t||t instanceof String)return[[""],[t]];{const e=Object.values(t);if(e.length)return[Object.keys(t),e]}}}}return[[],[]]},t.__populate=function(t,e,i){const o={"(Completed)":"✔️","(Interrupted)":"❌","(Manually Ignored)":"⛔","(Automatically Ignored)":"⭕","(Edited)":"📝","(Original)":"✅","(Backup)":"💾"},a=new RegExp(Object.keys(o).join("|").replaceAll(")","\\)").replaceAll("(","\\("),"g"),n=function(t){return t&&t.length?t.replace(a,(t=>o[t])):""};if((t<0||t>=e.length)&&(t=0),void 0!==i._opened){let t=[];for(let i=0;i<e.length;i++)t.push({value:i+"",label:n(e[i])});i.options=t}else{let o="";for(let i=0;i<e.length;i++)o+='<mwc-list-item value="'+i+'"'+(t==i?" selected activated":"")+">"+n(e[i])+"</mwc-list-item>";i.innerHTML=o}i.value=t+"",i.selectedText=n(e[t])};const a="picture-selector",n=t.shadowRoot.querySelector("ha-card#"+a);n&&n.remove();const l=document.createElement("ha-card");let s;l.id=a,l.style.cssText="cursor:default;display:block;padding:12px 16px 16px;overflow:visible;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none;",t.shadowRoot.children.length?t.shadowRoot.insertBefore(l,t.shadowRoot.children[0]):t.shadowRoot.appendChild(l),e.title&&e.title.length&&(" "!==e.title&&(s=document.createElement("h1"),s.className="card-header",s.style.padding="0 0 4px 0",s.innerHTML='<div class="name">'+e.title+"</div>",l.appendChild(s)),e.styles.grid||(e.styles.grid=[]),e.styles.grid=e.styles.grid.concat([{cursor:"default"},{display:"block"},{margin:"0 16px 16px"},{overflow:"hidden"},{"border-radius":"var(--ha-card-border-radius,12px)"},{"border-width":"var(--ha-card-border-width,1px)"},{"border-style":"solid"},{"border-color":"var(--ha-card-border-color,var(--divider-color,#e0e0e0))"},{background:"var(--input-disabled-fill-color);"}]));const r=t._hass.states[e.entity];t._a=r?r.attributes.access_token:"";const c=t.__items(t._hass),d=document.createElement("ha-select");if(d.style.cssText="width:auto;display:block;",e.icon&&e.icon.length){d.style.cssText+="margin:4px 0 0 40px;";const i=document.createElement("state-badge");i.stateObj=r,i.overrideIcon=e.icon,i.style.cssText="float:left;margin-top:12px;",l.appendChild(i),t._l=i}d.label=!(!e.label||!r)&&e.label,d.value="0",d.naturalMenuWidth=!0,1==c[0].length&&0==c[0][0].length&&(s?(d.style.display="none",t._l&&(t._l.style.display="none"),s.style.padding="0"):l.style.display="none"),t.__populate(0,c[0],d),l.appendChild(d),t._s=d;const u=function(e){const i=function(i){if(!i)return;const o=customElements.get("ha-circular-progress")?"ha-circular-progress":"ha-spinner",a=function(t){const e=t.target.parentElement.querySelectorAll(o).forEach((t=>t.remove()));e&&e.remove(),t.target.style.cursor=""};i.onload=function(t){i.style.height="",t.target.style.opacity=1,a(t),t.target.onload=null},i.onerror=function(e){t._i=!1,a(e),t.update()},i.style.opacity=0,i.style.cursor="wait",e&&0==i.naturalHeight&&i.width&&(i.style.height=i.width+"px");const n=document.createElement(o);n.active=!0,n.size="large",n.indeterminate=true,n.style.position="absolute",i.parentElement.appendChild(n)},o=t.shadowRoot.querySelector("#icon");o&&"IMG"==o.tagName?i(o):setTimeout((function(){const e=t.shadowRoot.querySelector("#icon");e&&0==e.naturalHeight&&e.width&&(e.style.height=e.width+"px"),i(e)}),0)};d.addEventListener("closed",(function(t){t.stopPropagation()}));const _=function(e){if(""!=e.target.value){const a=t.__items(t._hass);if(0===a[1].length)return void(t._i=!1);e.detail&&e.detail.value&&(e.target.value=e.detail.value);const n=parseInt(e.target.value);if(n>=0&&n<a[1].length&&(!t._i||t._i[0]!=a[0][n]&&t._i[1]!=a[1][n])){if(t._i){if(t._i[0]=a[0][n],t._i[1].match(i)[1]===a[1][n].match(i)[1])return;t._i[1]=a[1][n]}else t._i=[a[0][n],a[1][n]];t._config.hold_action.url_path=t._i[1];const e=t._i[1].match(o);t._x=e&&e.length>1?e[1]:"",u(),t.update()}}};if(d.onchange=_,d.addEventListener("selected",_),t._i=!1,t._config.hold_action={action:"url"},c[0].length){t._config.hold_action.url_path=c[1][0];const e=c[1][0].match(o);t._x=e&&e.length>1?e[1]:"";const i=t.shadowRoot.querySelector("#icon");i&&"IMG"==i.tagName?t._i=[c[0][0],c[1][0]]:(t.style.opacity=0,setTimeout((function(){t._i=[c[0][0],c[1][0]],u(!0),t.update(),t.style.opacity=1}),0))}}return t._i?t._i[1]+(e.extra_params&&e.extra_params.length?"&"+e.extra_params:""):void 0}(this) ]]]
picture_list: cleaning_history
size: 100%
show_name: false
show_entity_picture: true
styles:
  icon:
    - transition: opacity 180ms ease-in-out 0s
  card:
    - --mdc-ripple-color: rgba(0,0,0,0)
    - padding: 0
    - border-top-left-radius: 0
    - border-top-right-radius: 0
    - border-top: none

Targeta d'historial de recorreguts

La targeta d'Historial de Navegació està dissenyada per mostrar mapes de navegació passada per a treballs de punt i de camí de navegació utilitzant la targeta personalitzada Targeta de botó. Un menú desplegable situat a la part superior de la targeta permet seleccionar i visualitzar el mapa d'un treball passat específic.

Per a més informació sobre aquests mapes, consulta la Mapes d'historial de neteja i recorreguts.

Mostra codi

type: custom:button-card
entity: camera. # Current map camera entity
label: Cruising History # Optional
title: Cruising History # Optional
icon: mdi:camera-marker
tap_action:
  action: none
entity_picture: >
  [[[ return function(t){const e=t._config;if(t.shadowRoot.querySelector("hui-error-card")&&!t._u)return t._u=!0,t.style.opacity=0,void setTimeout((function(){t.style.opacity=1,t.update()}),0);if(!t.__shouldUpdate){t._u=!1;const i=/v=([^&]*)/,o=/index=([^&]*)/;t.__shouldUpdate=t.shouldUpdate,t.shouldUpdate=function(t){const e=this;let o=e.__shouldUpdate(t);if(t&&t.has("_config"))return e.shouldUpdate=e.__shouldUpdate,e.__shouldUpdate=null,e._s=null,!0;const a=e._config,n=e._hass.states[a.entity],l=t.get("_hass"),s=l?l.states[a.entity]:null;if(o=l&&s!=n,!o)return!1;e._l&&(e._l.stateObj=n);let r=e.__items(e._hass);const c=e.__items(l)[0].join(",")!==r[0].join(",");if(e._i&&n&&!c){if(!c&&e._i&&n&&e._a){const t=n.attributes.access_token;if(t!=e._a&&(e._config.hold_action.url_path=e._i[1].replace(e._a,t),e._a=t,this._config.custom_fields))return!0}return e.hass=e._hass,!1}let d=0;const u=e._s;if(n){const t=n.attributes.access_token;if(!c&&t!=e._a){let i=n.attributes[a.picture_list+"_picture"];if(i)if("string"==typeof i||i instanceof String)i=i.replace(e._a,t);else for(let o=0;o<r[0].length;o++)i[r[0][o]]=i[r[0][o]].replace(e._a,t)}if(e._a=t,d=u&&""===u.value?0:parseInt(u.value),d<0||d>=r[0].length)d=0;else if(d>0&&r[0].length>0&&(d=0,e._i&&(d=r[0].indexOf(e._i[0]),-1===d))){d=0;let t=e._i[1].match(i)[1];for(let e=0;e<r[1].length;e++)if(t==r[1][e].match(i)[1]){d=e;break}}}return u.label=!(!a.label||!n)&&a.label,e.__populate(d,r[0],u),u.dispatchEvent(new Event("change")),o},t.__items=function(t){if(t){const e=t.states[this._config.entity];if(e&&e.attributes){const t=e.attributes[this._config.picture_list+"_picture"];if(t){if("string"==typeof t||t instanceof String)return[[""],[t]];{const e=Object.values(t);if(e.length)return[Object.keys(t),e]}}}}return[[],[]]},t.__populate=function(t,e,i){const o={"(Completed)":"✔️","(Interrupted)":"❌","(Manually Ignored)":"⛔","(Automatically Ignored)":"⭕","(Edited)":"📝","(Original)":"✅","(Backup)":"💾"},a=new RegExp(Object.keys(o).join("|").replaceAll(")","\\)").replaceAll("(","\\("),"g"),n=function(t){return t&&t.length?t.replace(a,(t=>o[t])):""};if((t<0||t>=e.length)&&(t=0),void 0!==i._opened){let t=[];for(let i=0;i<e.length;i++)t.push({value:i+"",label:n(e[i])});i.options=t}else{let o="";for(let i=0;i<e.length;i++)o+='<mwc-list-item value="'+i+'"'+(t==i?" selected activated":"")+">"+n(e[i])+"</mwc-list-item>";i.innerHTML=o}i.value=t+"",i.selectedText=n(e[t])};const a="picture-selector",n=t.shadowRoot.querySelector("ha-card#"+a);n&&n.remove();const l=document.createElement("ha-card");let s;l.id=a,l.style.cssText="cursor:default;display:block;padding:12px 16px 16px;overflow:visible;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none;",t.shadowRoot.children.length?t.shadowRoot.insertBefore(l,t.shadowRoot.children[0]):t.shadowRoot.appendChild(l),e.title&&e.title.length&&(" "!==e.title&&(s=document.createElement("h1"),s.className="card-header",s.style.padding="0 0 4px 0",s.innerHTML='<div class="name">'+e.title+"</div>",l.appendChild(s)),e.styles.grid||(e.styles.grid=[]),e.styles.grid=e.styles.grid.concat([{cursor:"default"},{display:"block"},{margin:"0 16px 16px"},{overflow:"hidden"},{"border-radius":"var(--ha-card-border-radius,12px)"},{"border-width":"var(--ha-card-border-width,1px)"},{"border-style":"solid"},{"border-color":"var(--ha-card-border-color,var(--divider-color,#e0e0e0))"},{background:"var(--input-disabled-fill-color);"}]));const r=t._hass.states[e.entity];t._a=r?r.attributes.access_token:"";const c=t.__items(t._hass),d=document.createElement("ha-select");if(d.style.cssText="width:auto;display:block;",e.icon&&e.icon.length){d.style.cssText+="margin:4px 0 0 40px;";const i=document.createElement("state-badge");i.stateObj=r,i.overrideIcon=e.icon,i.style.cssText="float:left;margin-top:12px;",l.appendChild(i),t._l=i}d.label=!(!e.label||!r)&&e.label,d.value="0",d.naturalMenuWidth=!0,1==c[0].length&&0==c[0][0].length&&(s?(d.style.display="none",t._l&&(t._l.style.display="none"),s.style.padding="0"):l.style.display="none"),t.__populate(0,c[0],d),l.appendChild(d),t._s=d;const u=function(e){const i=function(i){if(!i)return;const o=customElements.get("ha-circular-progress")?"ha-circular-progress":"ha-spinner",a=function(t){const e=t.target.parentElement.querySelectorAll(o).forEach((t=>t.remove()));e&&e.remove(),t.target.style.cursor=""};i.onload=function(t){i.style.height="",t.target.style.opacity=1,a(t),t.target.onload=null},i.onerror=function(e){t._i=!1,a(e),t.update()},i.style.opacity=0,i.style.cursor="wait",e&&0==i.naturalHeight&&i.width&&(i.style.height=i.width+"px");const n=document.createElement(o);n.active=!0,n.size="large",n.indeterminate=true,n.style.position="absolute",i.parentElement.appendChild(n)},o=t.shadowRoot.querySelector("#icon");o&&"IMG"==o.tagName?i(o):setTimeout((function(){const e=t.shadowRoot.querySelector("#icon");e&&0==e.naturalHeight&&e.width&&(e.style.height=e.width+"px"),i(e)}),0)};d.addEventListener("closed",(function(t){t.stopPropagation()}));const _=function(e){if(""!=e.target.value){const a=t.__items(t._hass);if(0===a[1].length)return void(t._i=!1);e.detail&&e.detail.value&&(e.target.value=e.detail.value);const n=parseInt(e.target.value);if(n>=0&&n<a[1].length&&(!t._i||t._i[0]!=a[0][n]&&t._i[1]!=a[1][n])){if(t._i){if(t._i[0]=a[0][n],t._i[1].match(i)[1]===a[1][n].match(i)[1])return;t._i[1]=a[1][n]}else t._i=[a[0][n],a[1][n]];t._config.hold_action.url_path=t._i[1];const e=t._i[1].match(o);t._x=e&&e.length>1?e[1]:"",u(),t.update()}}};if(d.onchange=_,d.addEventListener("selected",_),t._i=!1,t._config.hold_action={action:"url"},c[0].length){t._config.hold_action.url_path=c[1][0];const e=c[1][0].match(o);t._x=e&&e.length>1?e[1]:"";const i=t.shadowRoot.querySelector("#icon");i&&"IMG"==i.tagName?t._i=[c[0][0],c[1][0]]:(t.style.opacity=0,setTimeout((function(){t._i=[c[0][0],c[1][0]],u(!0),t.update(),t.style.opacity=1}),0))}}return t._i?t._i[1]+(e.extra_params&&e.extra_params.length?"&"+e.extra_params:""):void 0}(this) ]]]
picture_list: cruising_history
size: 100%
show_name: false
show_entity_picture: true
styles:
  icon:
    - transition: opacity 180ms ease-in-out 0s
  card:
    - --mdc-ripple-color: rgba(0,0,0,0)
    - padding: 0
    - border-top-left-radius: 0
    - border-top-right-radius: 0
    - border-top: none

Targeta d'Obstacles

La targeta d'Obstacles està dissenyada per mostrar fotografies dels obstacles detectats pel robot durant l'últim treball de neteja utilitzant la targeta personalitzada Targeta de botó. Un menú desplegable situat a la part superior de la targeta llista els obstacles detectats ordenats des del més recent fins al més antic segons l'ordre de detecció, juntament amb el nom de l'habitació on es va trobar cada obstacle. A més, els obstacles es poden ignorar o deixar de ser ignorats manualment directament des d'aquesta targeta, sempre que no estiguin ignorats dinàmicament pel sistema.

Per a més informació sobre aquests mapes, consulta la Mapes d'Obstacles.

Mostra codi

type: custom:button-card
entity: camera. # Current map camera entity
label: Obstacles # Optional
title: null # Optional
icon: mdi:traffic-cone
entity_picture: >
  [[[ return function(t){const e=t._config;if(t.shadowRoot.querySelector("hui-error-card")&&!t._u)return t._u=!0,t.style.opacity=0,void setTimeout((function(){t.style.opacity=1,t.update()}),0);if(!t.__shouldUpdate){t._u=!1;const i=/v=([^&]*)/,o=/index=([^&]*)/;t.__shouldUpdate=t.shouldUpdate,t.shouldUpdate=function(t){const e=this;let o=e.__shouldUpdate(t);if(t&&t.has("_config"))return e.shouldUpdate=e.__shouldUpdate,e.__shouldUpdate=null,e._s=null,!0;const a=e._config,n=e._hass.states[a.entity],l=t.get("_hass"),s=l?l.states[a.entity]:null;if(o=l&&s!=n,!o)return!1;e._l&&(e._l.stateObj=n);let r=e.__items(e._hass);const c=e.__items(l)[0].join(",")!==r[0].join(",");if(e._i&&n&&!c){if(!c&&e._i&&n&&e._a){const t=n.attributes.access_token;if(t!=e._a&&(e._config.hold_action.url_path=e._i[1].replace(e._a,t),e._a=t,this._config.custom_fields))return!0}return e.hass=e._hass,!1}let d=0;const u=e._s;if(n){const t=n.attributes.access_token;if(!c&&t!=e._a){let i=n.attributes[a.picture_list+"_picture"];if(i)if("string"==typeof i||i instanceof String)i=i.replace(e._a,t);else for(let o=0;o<r[0].length;o++)i[r[0][o]]=i[r[0][o]].replace(e._a,t)}if(e._a=t,d=u&&""===u.value?0:parseInt(u.value),d<0||d>=r[0].length)d=0;else if(d>0&&r[0].length>0&&(d=0,e._i&&(d=r[0].indexOf(e._i[0]),-1===d))){d=0;let t=e._i[1].match(i)[1];for(let e=0;e<r[1].length;e++)if(t==r[1][e].match(i)[1]){d=e;break}}}return u.label=!(!a.label||!n)&&a.label,e.__populate(d,r[0],u),u.dispatchEvent(new Event("change")),o},t.__items=function(t){if(t){const e=t.states[this._config.entity];if(e&&e.attributes){const t=e.attributes[this._config.picture_list+"_picture"];if(t){if("string"==typeof t||t instanceof String)return[[""],[t]];{const e=Object.values(t);if(e.length)return[Object.keys(t),e]}}}}return[[],[]]},t.__populate=function(t,e,i){const o={"(Completed)":"✔️","(Interrupted)":"❌","(Manually Ignored)":"⛔","(Automatically Ignored)":"⭕","(Edited)":"📝","(Original)":"✅","(Backup)":"💾"},a=new RegExp(Object.keys(o).join("|").replaceAll(")","\\)").replaceAll("(","\\("),"g"),n=function(t){return t&&t.length?t.replace(a,(t=>o[t])):""};if((t<0||t>=e.length)&&(t=0),void 0!==i._opened){let t=[];for(let i=0;i<e.length;i++)t.push({value:i+"",label:n(e[i])});i.options=t}else{let o="";for(let i=0;i<e.length;i++)o+='<mwc-list-item value="'+i+'"'+(t==i?" selected activated":"")+">"+n(e[i])+"</mwc-list-item>";i.innerHTML=o}i.value=t+"",i.selectedText=n(e[t])};const a="picture-selector",n=t.shadowRoot.querySelector("ha-card#"+a);n&&n.remove();const l=document.createElement("ha-card");let s;l.id=a,l.style.cssText="cursor:default;display:block;padding:12px 16px 16px;overflow:visible;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none;",t.shadowRoot.children.length?t.shadowRoot.insertBefore(l,t.shadowRoot.children[0]):t.shadowRoot.appendChild(l),e.title&&e.title.length&&(" "!==e.title&&(s=document.createElement("h1"),s.className="card-header",s.style.padding="0 0 4px 0",s.innerHTML='<div class="name">'+e.title+"</div>",l.appendChild(s)),e.styles.grid||(e.styles.grid=[]),e.styles.grid=e.styles.grid.concat([{cursor:"default"},{display:"block"},{margin:"0 16px 16px"},{overflow:"hidden"},{"border-radius":"var(--ha-card-border-radius,12px)"},{"border-width":"var(--ha-card-border-width,1px)"},{"border-style":"solid"},{"border-color":"var(--ha-card-border-color,var(--divider-color,#e0e0e0))"},{background:"var(--input-disabled-fill-color);"}]));const r=t._hass.states[e.entity];t._a=r?r.attributes.access_token:"";const c=t.__items(t._hass),d=document.createElement("ha-select");if(d.style.cssText="width:auto;display:block;",e.icon&&e.icon.length){d.style.cssText+="margin:4px 0 0 40px;";const i=document.createElement("state-badge");i.stateObj=r,i.overrideIcon=e.icon,i.style.cssText="float:left;margin-top:12px;",l.appendChild(i),t._l=i}d.label=!(!e.label||!r)&&e.label,d.value="0",d.naturalMenuWidth=!0,1==c[0].length&&0==c[0][0].length&&(s?(d.style.display="none",t._l&&(t._l.style.display="none"),s.style.padding="0"):l.style.display="none"),t.__populate(0,c[0],d),l.appendChild(d),t._s=d;const u=function(e){const i=function(i){if(!i)return;const o=customElements.get("ha-circular-progress")?"ha-circular-progress":"ha-spinner",a=function(t){const e=t.target.parentElement.querySelectorAll(o).forEach((t=>t.remove()));e&&e.remove(),t.target.style.cursor=""};i.onload=function(t){i.style.height="",t.target.style.opacity=1,a(t),t.target.onload=null},i.onerror=function(e){t._i=!1,a(e),t.update()},i.style.opacity=0,i.style.cursor="wait",e&&0==i.naturalHeight&&i.width&&(i.style.height=i.width+"px");const n=document.createElement(o);n.active=!0,n.size="large",n.indeterminate=true,n.style.position="absolute",i.parentElement.appendChild(n)},o=t.shadowRoot.querySelector("#icon");o&&"IMG"==o.tagName?i(o):setTimeout((function(){const e=t.shadowRoot.querySelector("#icon");e&&0==e.naturalHeight&&e.width&&(e.style.height=e.width+"px"),i(e)}),0)};d.addEventListener("closed",(function(t){t.stopPropagation()}));const _=function(e){if(""!=e.target.value){const a=t.__items(t._hass);if(0===a[1].length)return void(t._i=!1);e.detail&&e.detail.value&&(e.target.value=e.detail.value);const n=parseInt(e.target.value);if(n>=0&&n<a[1].length&&(!t._i||t._i[0]!=a[0][n]&&t._i[1]!=a[1][n])){if(t._i){if(t._i[0]=a[0][n],t._i[1].match(i)[1]===a[1][n].match(i)[1])return;t._i[1]=a[1][n]}else t._i=[a[0][n],a[1][n]];t._config.hold_action.url_path=t._i[1];const e=t._i[1].match(o);t._x=e&&e.length>1?e[1]:"",u(),t.update()}}};if(d.onchange=_,d.addEventListener("selected",_),t._i=!1,t._config.hold_action={action:"url"},c[0].length){t._config.hold_action.url_path=c[1][0];const e=c[1][0].match(o);t._x=e&&e.length>1?e[1]:"";const i=t.shadowRoot.querySelector("#icon");i&&"IMG"==i.tagName?t._i=[c[0][0],c[1][0]]:(t.style.opacity=0,setTimeout((function(){t._i=[c[0][0],c[1][0]],u(!0),t.update(),t.style.opacity=1}),0))}}return t._i?t._i[1]+(e.extra_params&&e.extra_params.length?"&"+e.extra_params:""):void 0}(this) ]]]
picture_list: obstacle
size: 100%
show_entity_picture: true
show_name: false
custom_fields:
  buttons:
    card:
      type: custom:button-card
      name: >
        [[[ return (!this.__c || this.__c(this.__o()) ? 'Cancel Ignore' : 'Ignore Obstacle'); ]]]
      icon: >
        [[[ return (!this.__c || this.__c(this.__o()) ? 'mdi:eye' : 'mdi:eye-off'); ]]]
      confirmation: >
        [[[ return this.__c && !this.__c(this.__o()); ]]]
      size: 24px
      tap_action:
        action: call-service
        service: dreame_vacuum.vacuum_set_obstacle_ignore
        data: >
          [[[ return function(t){t.__o||(t.__o=function(){const n=t._hass.states[t._config.entity];return n&&n.attributes.obstacles&&n.attributes.obstacles[t._i?t._x:""]},t.__c=function(t){return t&&t.ignore_status&&"Not Ignored"!==t.ignore_status},t.__d=function(t){return t&&t.ignore_status&&t.ignore_status.indexOf("Automatically")>=0});const n=t.__o();if(n)return{entity_id:t._config.entity.replace("camera.","vacuum.").substring(0,t._config.entity.lastIndexOf("_map")),x:n.x,y:n.y,obstacle_ignored:!t.__c(n)}}(this); ]]]
      styles:
        grid:
          - display: contents
        img_cell:
          - display: contents
        name:
          - color: >
              [[[ return (!this.__d || this.__d(this.__o()) ? 'var(--state-icon-unavailable-color)' : 'var(--primary-text-color)'); ]]]
        icon:
          - color: >
              [[[ return (!this.__d || this.__d(this.__o()) ? 'var(--state-icon-unavailable-color)' : 'var(--primary-text-color)'); ]]]
          - margin: 0 6px 0 0
        card:
          - background-color: >
              [[[ return (!this.__d || this.__d(this.__o()) ? 'var(--state-unavailable-color)' : 'var(--primary-color)'); ]]]
          - pointer-events: >
              [[[ return (!this.__d || this.__d(this.__o()) ? 'none' : 'auto'); ]]]
          - border-radius: 100px
          - max-width: 200px
          - max-height: 48px
          - padding: 8px 24px
styles:
  custom_fields:
    buttons:
      - cursor: >
          [[[ return (!this.__d || this.__d(this.__o()) ? 'not-allowed' : 'default'); ]]]
      - margin: 16px
      - display: >
          [[[ const o = this.__o(); return (o && o.ignore_status ? 'inline-block': 'none'); ]]]
      - width: auto
  grid:
    - display: block
  icon:
    - transition: opacity 180ms ease-in-out 0s
  card:
    - '--mdc-ripple-color': rgba(0,0,0,0)
    - padding: 0
    - border-top-left-radius: 0
    - border-top-right-radius: 0
    - border-top: none

Targeta de Recuperació de Mapes

La targeta de recuperació de mapa està dissenyada per mostrar estats històrics del mapa guardat seleccionat i proporciona un botó per restaurar el mapa a un estat anterior utilitzant la targeta personalitzada Targeta de botó. Depenent del model de robot, hi ha disponibles 3 o 4 còpies de seguretat del mapa per a la restauració. Un menú desplegable mostra aquestes còpies de seguretat, indicant tant l'hora de modificació com el tipus de còpia de seguretat.

Per a més informació sobre aquests mapes, consulta la Mapes de recuperació.

Mostra codi

type: custom:button-card
entity: camera. # Current or saved map camera entity
label: Recovery Maps # Optional
title: Restore Map # Optional 
extra_params: info=0 # For transparent map
icon: mdi:file-restore
entity_picture: >
  [[[ return function(t){const e=t._config;if(t.shadowRoot.querySelector("hui-error-card")&&!t._u)return t._u=!0,t.style.opacity=0,void setTimeout((function(){t.style.opacity=1,t.update()}),0);if(!t.__shouldUpdate){t._u=!1;const i=/v=([^&]*)/,o=/index=([^&]*)/;t.__shouldUpdate=t.shouldUpdate,t.shouldUpdate=function(t){const e=this;let o=e.__shouldUpdate(t);if(t&&t.has("_config"))return e.shouldUpdate=e.__shouldUpdate,e.__shouldUpdate=null,e._s=null,!0;const a=e._config,n=e._hass.states[a.entity],l=t.get("_hass"),s=l?l.states[a.entity]:null;if(o=l&&s!=n,!o)return!1;e._l&&(e._l.stateObj=n);let r=e.__items(e._hass);const c=e.__items(l)[0].join(",")!==r[0].join(",");if(e._i&&n&&!c){if(!c&&e._i&&n&&e._a){const t=n.attributes.access_token;if(t!=e._a&&(e._config.hold_action.url_path=e._i[1].replace(e._a,t),e._a=t,this._config.custom_fields))return!0}return e.hass=e._hass,!1}let d=0;const u=e._s;if(n){const t=n.attributes.access_token;if(!c&&t!=e._a){let i=n.attributes[a.picture_list+"_picture"];if(i)if("string"==typeof i||i instanceof String)i=i.replace(e._a,t);else for(let o=0;o<r[0].length;o++)i[r[0][o]]=i[r[0][o]].replace(e._a,t)}if(e._a=t,d=u&&""===u.value?0:parseInt(u.value),d<0||d>=r[0].length)d=0;else if(d>0&&r[0].length>0&&(d=0,e._i&&(d=r[0].indexOf(e._i[0]),-1===d))){d=0;let t=e._i[1].match(i)[1];for(let e=0;e<r[1].length;e++)if(t==r[1][e].match(i)[1]){d=e;break}}}return u.label=!(!a.label||!n)&&a.label,e.__populate(d,r[0],u),u.dispatchEvent(new Event("change")),o},t.__items=function(t){if(t){const e=t.states[this._config.entity];if(e&&e.attributes){const t=e.attributes[this._config.picture_list+"_picture"];if(t){if("string"==typeof t||t instanceof String)return[[""],[t]];{const e=Object.values(t);if(e.length)return[Object.keys(t),e]}}}}return[[],[]]},t.__populate=function(t,e,i){const o={"(Completed)":"✔️","(Interrupted)":"❌","(Manually Ignored)":"⛔","(Automatically Ignored)":"⭕","(Edited)":"📝","(Original)":"✅","(Backup)":"💾"},a=new RegExp(Object.keys(o).join("|").replaceAll(")","\\)").replaceAll("(","\\("),"g"),n=function(t){return t&&t.length?t.replace(a,(t=>o[t])):""};if((t<0||t>=e.length)&&(t=0),void 0!==i._opened){let t=[];for(let i=0;i<e.length;i++)t.push({value:i+"",label:n(e[i])});i.options=t}else{let o="";for(let i=0;i<e.length;i++)o+='<mwc-list-item value="'+i+'"'+(t==i?" selected activated":"")+">"+n(e[i])+"</mwc-list-item>";i.innerHTML=o}i.value=t+"",i.selectedText=n(e[t])};const a="picture-selector",n=t.shadowRoot.querySelector("ha-card#"+a);n&&n.remove();const l=document.createElement("ha-card");let s;l.id=a,l.style.cssText="cursor:default;display:block;padding:12px 16px 16px;overflow:visible;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none;",t.shadowRoot.children.length?t.shadowRoot.insertBefore(l,t.shadowRoot.children[0]):t.shadowRoot.appendChild(l),e.title&&e.title.length&&(" "!==e.title&&(s=document.createElement("h1"),s.className="card-header",s.style.padding="0 0 4px 0",s.innerHTML='<div class="name">'+e.title+"</div>",l.appendChild(s)),e.styles.grid||(e.styles.grid=[]),e.styles.grid=e.styles.grid.concat([{cursor:"default"},{display:"block"},{margin:"0 16px 16px"},{overflow:"hidden"},{"border-radius":"var(--ha-card-border-radius,12px)"},{"border-width":"var(--ha-card-border-width,1px)"},{"border-style":"solid"},{"border-color":"var(--ha-card-border-color,var(--divider-color,#e0e0e0))"},{background:"var(--input-disabled-fill-color);"}]));const r=t._hass.states[e.entity];t._a=r?r.attributes.access_token:"";const c=t.__items(t._hass),d=document.createElement("ha-select");if(d.style.cssText="width:auto;display:block;",e.icon&&e.icon.length){d.style.cssText+="margin:4px 0 0 40px;";const i=document.createElement("state-badge");i.stateObj=r,i.overrideIcon=e.icon,i.style.cssText="float:left;margin-top:12px;",l.appendChild(i),t._l=i}d.label=!(!e.label||!r)&&e.label,d.value="0",d.naturalMenuWidth=!0,1==c[0].length&&0==c[0][0].length&&(s?(d.style.display="none",t._l&&(t._l.style.display="none"),s.style.padding="0"):l.style.display="none"),t.__populate(0,c[0],d),l.appendChild(d),t._s=d;const u=function(e){const i=function(i){if(!i)return;const o=customElements.get("ha-circular-progress")?"ha-circular-progress":"ha-spinner",a=function(t){const e=t.target.parentElement.querySelectorAll(o).forEach((t=>t.remove()));e&&e.remove(),t.target.style.cursor=""};i.onload=function(t){i.style.height="",t.target.style.opacity=1,a(t),t.target.onload=null},i.onerror=function(e){t._i=!1,a(e),t.update()},i.style.opacity=0,i.style.cursor="wait",e&&0==i.naturalHeight&&i.width&&(i.style.height=i.width+"px");const n=document.createElement(o);n.active=!0,n.size="large",n.indeterminate=true,n.style.position="absolute",i.parentElement.appendChild(n)},o=t.shadowRoot.querySelector("#icon");o&&"IMG"==o.tagName?i(o):setTimeout((function(){const e=t.shadowRoot.querySelector("#icon");e&&0==e.naturalHeight&&e.width&&(e.style.height=e.width+"px"),i(e)}),0)};d.addEventListener("closed",(function(t){t.stopPropagation()}));const _=function(e){if(""!=e.target.value){const a=t.__items(t._hass);if(0===a[1].length)return void(t._i=!1);e.detail&&e.detail.value&&(e.target.value=e.detail.value);const n=parseInt(e.target.value);if(n>=0&&n<a[1].length&&(!t._i||t._i[0]!=a[0][n]&&t._i[1]!=a[1][n])){if(t._i){if(t._i[0]=a[0][n],t._i[1].match(i)[1]===a[1][n].match(i)[1])return;t._i[1]=a[1][n]}else t._i=[a[0][n],a[1][n]];t._config.hold_action.url_path=t._i[1];const e=t._i[1].match(o);t._x=e&&e.length>1?e[1]:"",u(),t.update()}}};if(d.onchange=_,d.addEventListener("selected",_),t._i=!1,t._config.hold_action={action:"url"},c[0].length){t._config.hold_action.url_path=c[1][0];const e=c[1][0].match(o);t._x=e&&e.length>1?e[1]:"";const i=t.shadowRoot.querySelector("#icon");i&&"IMG"==i.tagName?t._i=[c[0][0],c[1][0]]:(t.style.opacity=0,setTimeout((function(){t._i=[c[0][0],c[1][0]],u(!0),t.update(),t.style.opacity=1}),0))}}return t._i?t._i[1]+(e.extra_params&&e.extra_params.length?"&"+e.extra_params:""):void 0}(this) ]]]
picture_list: recovery_map
size: 100%
show_entity_picture: true
show_name: false
custom_fields:
  buttons:
    card:
      type: horizontal-stack
      cards:
        - type: custom:button-card
          name: Restore
          icon: mdi:restore
          size: 24px
          tap_action:
            action: call-service
            service: dreame_vacuum.vacuum_restore_map
            data: 
              entity_id: |
                [[[ return (this._config.entity ? this._config.entity.replace('camera.','vacuum.').substring(0, this._config.entity.lastIndexOf('_map')) : ''); ]]]
              recovery_map_index: |
                [[[ return this._x ? parseInt(this._x) : 99 ]]]
          confirmation: true
          styles:
            grid:
              - display: contents
            img_cell:
              - display: contents
            icon:
              - margin: 0 6px 0 0
              - color: var(--primary-text-color)
            card:
              - border-radius: 100px
              - background-color: var(--primary-color)
        - type: custom:button-card
          name: Download
          icon: mdi:download
          size: 24px
          tap_action:
            action: url
            url_path: |
              [[[ return (this._x ? this._config.hold_action.url_path + '&file=1' : ''); ]]]
          styles:
            grid:
              - display: contents
            img_cell:
              - display: contents
            icon:
              - margin: 0 6px 0 0
              - color: var(--primary-text-color)
            card:
              - border-radius: 100px
              - background-color: var(--primary-color)
styles:
  custom_fields:
    buttons:
      - '--horizontal-stack-card-margin': 0 8px
      - padding: 0 16px 16px
      - display: >
          [[[ return (this._i ? 'block': 'none');]]]
  grid:
    - display: block
  icon:
    - transition: opacity 180ms ease-in-out 0s
  card:
    - '--mdc-ripple-color': rgba(0,0,0,0)
    - padding: 0
    - border-top-left-radius: 0
    - border-top-right-radius: 0
    - border-top: none

Targeta de mapa WiFi

Tot i que la integració normalment obté, emmagatzema i pot mostrar el mapa WiFi guardat si n'existeix un, visualitzar-lo és una mica difícil, ja que no està exposat directament per cap entitat de càmera. La targeta de mapa WiFi està dissenyada per simplificar això mostrant directament el mapa WiFi utilitzant la targeta personalitzada Targeta de botó.

Per obtenir més informació sobre aquest mapa, consulteu la Mapa Wi-Fi.

Mostra codi

type: custom:button-card
entity: camera. # Current or saved map camera entity
icon: mdi:wifi-marker
tap_action:
  action: none
entity_picture: >
  [[[ return function(t){const e=t._config;if(t.shadowRoot.querySelector("hui-error-card")&&!t._u)return t._u=!0,t.style.opacity=0,void setTimeout((function(){t.style.opacity=1,t.update()}),0);if(!t.__shouldUpdate){t._u=!1;const i=/v=([^&]*)/,o=/index=([^&]*)/;t.__shouldUpdate=t.shouldUpdate,t.shouldUpdate=function(t){const e=this;let o=e.__shouldUpdate(t);if(t&&t.has("_config"))return e.shouldUpdate=e.__shouldUpdate,e.__shouldUpdate=null,e._s=null,!0;const a=e._config,n=e._hass.states[a.entity],l=t.get("_hass"),s=l?l.states[a.entity]:null;if(o=l&&s!=n,!o)return!1;e._l&&(e._l.stateObj=n);let r=e.__items(e._hass);const c=e.__items(l)[0].join(",")!==r[0].join(",");if(e._i&&n&&!c){if(!c&&e._i&&n&&e._a){const t=n.attributes.access_token;if(t!=e._a&&(e._config.hold_action.url_path=e._i[1].replace(e._a,t),e._a=t,this._config.custom_fields))return!0}return e.hass=e._hass,!1}let d=0;const u=e._s;if(n){const t=n.attributes.access_token;if(!c&&t!=e._a){let i=n.attributes[a.picture_list+"_picture"];if(i)if("string"==typeof i||i instanceof String)i=i.replace(e._a,t);else for(let o=0;o<r[0].length;o++)i[r[0][o]]=i[r[0][o]].replace(e._a,t)}if(e._a=t,d=u&&""===u.value?0:parseInt(u.value),d<0||d>=r[0].length)d=0;else if(d>0&&r[0].length>0&&(d=0,e._i&&(d=r[0].indexOf(e._i[0]),-1===d))){d=0;let t=e._i[1].match(i)[1];for(let e=0;e<r[1].length;e++)if(t==r[1][e].match(i)[1]){d=e;break}}}return u.label=!(!a.label||!n)&&a.label,e.__populate(d,r[0],u),u.dispatchEvent(new Event("change")),o},t.__items=function(t){if(t){const e=t.states[this._config.entity];if(e&&e.attributes){const t=e.attributes[this._config.picture_list+"_picture"];if(t){if("string"==typeof t||t instanceof String)return[[""],[t]];{const e=Object.values(t);if(e.length)return[Object.keys(t),e]}}}}return[[],[]]},t.__populate=function(t,e,i){const o={"(Completed)":"✔️","(Interrupted)":"❌","(Manually Ignored)":"⛔","(Automatically Ignored)":"⭕","(Edited)":"📝","(Original)":"✅","(Backup)":"💾"},a=new RegExp(Object.keys(o).join("|").replaceAll(")","\\)").replaceAll("(","\\("),"g"),n=function(t){return t&&t.length?t.replace(a,(t=>o[t])):""};if((t<0||t>=e.length)&&(t=0),void 0!==i._opened){let t=[];for(let i=0;i<e.length;i++)t.push({value:i+"",label:n(e[i])});i.options=t}else{let o="";for(let i=0;i<e.length;i++)o+='<mwc-list-item value="'+i+'"'+(t==i?" selected activated":"")+">"+n(e[i])+"</mwc-list-item>";i.innerHTML=o}i.value=t+"",i.selectedText=n(e[t])};const a="picture-selector",n=t.shadowRoot.querySelector("ha-card#"+a);n&&n.remove();const l=document.createElement("ha-card");let s;l.id=a,l.style.cssText="cursor:default;display:block;padding:12px 16px 16px;overflow:visible;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none;",t.shadowRoot.children.length?t.shadowRoot.insertBefore(l,t.shadowRoot.children[0]):t.shadowRoot.appendChild(l),e.title&&e.title.length&&(" "!==e.title&&(s=document.createElement("h1"),s.className="card-header",s.style.padding="0 0 4px 0",s.innerHTML='<div class="name">'+e.title+"</div>",l.appendChild(s)),e.styles.grid||(e.styles.grid=[]),e.styles.grid=e.styles.grid.concat([{cursor:"default"},{display:"block"},{margin:"0 16px 16px"},{overflow:"hidden"},{"border-radius":"var(--ha-card-border-radius,12px)"},{"border-width":"var(--ha-card-border-width,1px)"},{"border-style":"solid"},{"border-color":"var(--ha-card-border-color,var(--divider-color,#e0e0e0))"},{background:"var(--input-disabled-fill-color);"}]));const r=t._hass.states[e.entity];t._a=r?r.attributes.access_token:"";const c=t.__items(t._hass),d=document.createElement("ha-select");if(d.style.cssText="width:auto;display:block;",e.icon&&e.icon.length){d.style.cssText+="margin:4px 0 0 40px;";const i=document.createElement("state-badge");i.stateObj=r,i.overrideIcon=e.icon,i.style.cssText="float:left;margin-top:12px;",l.appendChild(i),t._l=i}d.label=!(!e.label||!r)&&e.label,d.value="0",d.naturalMenuWidth=!0,1==c[0].length&&0==c[0][0].length&&(s?(d.style.display="none",t._l&&(t._l.style.display="none"),s.style.padding="0"):l.style.display="none"),t.__populate(0,c[0],d),l.appendChild(d),t._s=d;const u=function(e){const i=function(i){if(!i)return;const o=customElements.get("ha-circular-progress")?"ha-circular-progress":"ha-spinner",a=function(t){const e=t.target.parentElement.querySelectorAll(o).forEach((t=>t.remove()));e&&e.remove(),t.target.style.cursor=""};i.onload=function(t){i.style.height="",t.target.style.opacity=1,a(t),t.target.onload=null},i.onerror=function(e){t._i=!1,a(e),t.update()},i.style.opacity=0,i.style.cursor="wait",e&&0==i.naturalHeight&&i.width&&(i.style.height=i.width+"px");const n=document.createElement(o);n.active=!0,n.size="large",n.indeterminate=true,n.style.position="absolute",i.parentElement.appendChild(n)},o=t.shadowRoot.querySelector("#icon");o&&"IMG"==o.tagName?i(o):setTimeout((function(){const e=t.shadowRoot.querySelector("#icon");e&&0==e.naturalHeight&&e.width&&(e.style.height=e.width+"px"),i(e)}),0)};d.addEventListener("closed",(function(t){t.stopPropagation()}));const _=function(e){if(""!=e.target.value){const a=t.__items(t._hass);if(0===a[1].length)return void(t._i=!1);e.detail&&e.detail.value&&(e.target.value=e.detail.value);const n=parseInt(e.target.value);if(n>=0&&n<a[1].length&&(!t._i||t._i[0]!=a[0][n]&&t._i[1]!=a[1][n])){if(t._i){if(t._i[0]=a[0][n],t._i[1].match(i)[1]===a[1][n].match(i)[1])return;t._i[1]=a[1][n]}else t._i=[a[0][n],a[1][n]];t._config.hold_action.url_path=t._i[1];const e=t._i[1].match(o);t._x=e&&e.length>1?e[1]:"",u(),t.update()}}};if(d.onchange=_,d.addEventListener("selected",_),t._i=!1,t._config.hold_action={action:"url"},c[0].length){t._config.hold_action.url_path=c[1][0];const e=c[1][0].match(o);t._x=e&&e.length>1?e[1]:"";const i=t.shadowRoot.querySelector("#icon");i&&"IMG"==i.tagName?t._i=[c[0][0],c[1][0]]:(t.style.opacity=0,setTimeout((function(){t._i=[c[0][0],c[1][0]],u(!0),t.update(),t.style.opacity=1}),0))}}return t._i?t._i[1]+(e.extra_params&&e.extra_params.length?"&"+e.extra_params:""):void 0}(this) ]]]
picture_list: wifi_map
size: 100%
show_name: false
show_entity_picture: true
styles:
  icon:
    - transition: opacity 180ms ease-in-out 0s
  card:
    - --mdc-ripple-color: rgba(0,0,0,0)
    - padding: 0