Alarm Control Panel

Share your Projects! Dashboards & Frontend
1

Hi,

I have just started to use the Lovelace interface in yaml mode, because I wanted to add custom visuals like ‘alarm-control-panel’ (Lovelace: Alarm card)

I have tried to add the custom card with no success, but I don’t know where is the problem:

  • I have added in configuration.yaml:
lovelace:
  mode: yaml
  • I have created ui-lovelace.yaml in homeassistant config directory
  • I have also created a new directory called www, where I have placed the js file

Then in ui-lovelace.yaml I have added the following lines:

title: AA HOME
# Include external resources
resources:
  - url: /local/alarm_control_panel-card.js?v=1
    type: js

views:
  - view2:
    title: ALARMA
    cards:
      - type: custom:alarm_control_panel-card  #I have tried with quoted text
        entity: alarm_control_panel.alarm
        title: My Alarm
        states:
          - arm_home
          - arm_away

As you can see, I have followed the instructions available in thelink.

However, the result is not what I expected. In my homeassistant lovelace interface I can see the view but without any content inside. The screen is empty.

I have checked the elements using web inspector and I can see that the javascript file is loaded, so I don’t understand what I have done wrong. I have also tried with another web browser, but with no luck.

Any ideas of where is my mistake?

Thanks!!