Difficulty getting aarlo Lovelace card working

pickerin · November 24, 2019, 3:28pm

I’ve installed the “Arlo Camera Support” and “Lovelace Haas Aarlo” plugins from the HACS store.
The “Arlo Camera Support” is working and I see the camera entities.

I’m now trying to get the “Lovelace Haas Aarlo” card working. I’ve added the following to my RAW UI Configuration:

resources:
  - type: module
    url: /community_plugin/lovelace-hass-aarlo/haas-aarlo.js

I’ve then added the card to my UI as follows (per the documentation here: https://github.com/twrecked/lovelace-hass-aarlo

      - entity: camera.aarlo_front_yard
        image_click: play
        name: Front Yard
        show:
          - motion
          - sound
          - snapshot
          - battery_level
          - signal_strength
          - captured_today
          - image_date
        top_date: false
        top_status: false
        top_title: false
        type: 'custom:aarlo-glance'

But, the UI shows the following error:

Liperty · March 23, 2020, 8:52am

I’m trying to find the haas-aarlo.js file from somewhere.
I’m on hasbian so I need to find a place to donwload the .js file - could you please help me find a source? Hopefully I can help you with your card when I install the js file.

dusing · April 20, 2020, 4:42pm

@pickerin Did you ever figure this out? I’ve used HACS to install aarlo and lovelace-hass-arlo card. As part of the lovelace-hass-arlo install it has a GUI for adding the resource (barks if you don’t do it) and it adds the following:

which is a path that doesn’t seem to exist as the install itself put the js file in /www/community/lovelace-hass-aarlo/

I’ve tried creating a resource for the real location as well, and I just get the custom element doesn’t exist error

Liperty · April 20, 2020, 10:17pm

I just got it working now…

My lovelace config is…

entity: camera.aarlo_veggie_patch
type: ‘custom:aarlo-glance’
name: Veggie Patch
show:

motion
sound
snapshot
battery_level
signal_strength
captured_today
image_date
top_date: false
top_status: false
top_title: false

I have hass-aarlo.js in two paths - probably only one is required!
config\www\custom_ui
and
config\www\community\lovelace-hass-aarlo

I have these two components installed using HACS

Integrations - Arlo Camera Support
Plugin - Lovelace Hass Aarlo

and I believe I added resources to Lovelace as well (using HACS UI)
Hope that helps.
-Steve

dusing · April 20, 2020, 10:41pm

Thanks, do you have something in configuration.yaml or are you using the lovelace resources GUI?

Liperty · April 20, 2020, 11:01pm

I have this

aarlo:
  username: !secret arlo_username
  password: !secret arlo_password
  refresh_devices_every: 2
  stream_timeout: 120
  
alarm_control_panel:
  - platform: aarlo
    home_mode_name: Disarmed
    away_mode_name: Armed
    night_mode_name: Armed Silent
    trigger_time: 30
    alarm_volume: 8

sensor:
  - platform: aarlo
    monitored_conditions:
      - total_cameras
      - last_capture
      - recent_activity
      - captured_today
      - battery_level
      - signal_strength

in configuration.yaml - hope that helps!

pickerin · April 20, 2020, 11:02pm

Yes, I did get it working…

First, “hacsfiles” is a generic path element that will normally map to /www/community as you’ve discovered. It was a recent change to HACS and all components should be moved to using /hacsfiles in all configurations, so they can essentially define it once and have all components use the abstracted one, so don’t sweat that, right now it will work with either.

Here is the configuration for my card. This is defined WITHIN THE LOVELACE UI, not in a configuration file:

entity: camera.aarlo_front_yard
image_click: play
name: Front Yard
show:
  - motion
  - sound
  - snapshot
  - battery_level
  - signal_strength
  - captured_today
  - image_date
top_date: false
top_status: false
top_title: false
type: 'custom:aarlo-glance'

The component is installed in: /www/community/lovelace-hass-aarlo
The contents of that folder are: hass-aarlo.js and hass-aarlo.js.gz

In my Lovelace UI Resources page (found under Configuration > Lovelace Dashboards > Resources tab), I have:
/hacsfiles/lovelace-hass-aarlo/hass-aarlo.js, as a JavaScript Module

dusing · April 21, 2020, 3:54pm

Thank you for explaining it all like that. It is working for me now!

tyoung560 · July 1, 2020, 11:13pm

I’ve been having the same problem. Where do I find the resources tab when I navigate to configuration/Lovelace dashboards? I don’t have resources at the top.

I think what breaks my cards is when I try to load the dashboard on the iOS app. I’m using it on my home network but I also have nabu casa and have the iOS app set to use the nabu casa url.

pickerin · July 1, 2020, 11:27pm

Should look like this (Configuration > Lovelace Dashboards), you have two “tabs” at the top: Dashboards and Resources:

tyoung560 · July 1, 2020, 11:41pm

Hmm, I definitely don’t have that. Missing the resources tab.

pickerin · July 2, 2020, 2:19am

You have to have enabled “Advanced Mode” in your user profile:

tyoung560 · July 2, 2020, 2:42am

Gotcha thank you

SkiRider · August 18, 2020, 7:29pm

I’m at a loss. I have lovelass-hass-aarlo installed from HACS. I have the right resource in my Loveless UI as /hacsfiles/lovelace-hass-aarlo/hass-arlo.js I can see the files in /www/community/lovelace-hass-arlo and I have all the sesnors configured in configuration.yaml but I am still getting the Custom element doesn't exist: aarlo-glance. error when I try to use a manual card with the following config:

type: 'custom:aarlo-glance'
entity: camera.aarlo_backyard_camera
name: Backyard
show:
  - motion
  - sound
  - snapshot
  - battery_level
  - signal_strength
  - captured_today
  - image_date
top_title: false
top_status: false
top_date: false
image_click: play
light: light.back_porch

pickerin · August 18, 2020, 8:38pm

It should be “aarlo” not “arlo” in your Lovelace Dashboard Resources:
“/hacsfiles/lovelace-hass-aarlo/hass-aarlo.js”

SkiRider · August 18, 2020, 11:28pm

That was a typo in my post. It is hass-aarlo.js in my hacsfiles path

SkiRider · August 19, 2020, 12:54am

Strange. It seems to be working now.

kunalkhosla · December 6, 2020, 4:06pm

A quick update.

If you need live stream on click, add play_direct: true to your lovelace hacs aarlo config

HyperSprite · January 7, 2021, 12:04am

With the HACS installing the lovelace card files at /config/www/community/lovelace-hass-aarlo/hass-aarlo.js,

To get it to work, I ended up using:
Lovelace Resources URL: /local/community/lovelace-hass-aarlo/hass-aarlo.js

laichiufamily · January 17, 2021, 2:54am

I have aarlo installed and running by following these instructions:

Manually
Copy the aarlo directory into your /config/custom_components directory.

I can see this

How do I install lovelace-hass-aarlo if I am on docker?