I am capturing images and videos from my IP cameras, and wasn’t finding a Gallery to view them that fit my desires, so I wrote my own custom panel. Sharing in case anyone else finds this useful…
Be gentle, it’s a first of many for me (Hass coding, even github). 
Good Job for your first project, it’s awesome! installation easy and work great +1
Thanks for sharing with us.
Awesome project. Couple of suggestions I forgot to add -
Sorry, I missed the edit with suggestions.
#1 is certainly doable. I’ll circle back and do that as soon as I can.
#2 I’m not sure if I can do. It can certainly poll any directory hass can get at, but the issue is rendering those results in the webpage if those files are not accessible from the web. I’ve done that in other languages, but it needs some middleware to fetch the file contents that I have no idea if it exists in hass.
I published an update that will hide the tabs row when only one tab is defined. Just replace the gallery.html to update.
Hopefully this works for you.
Thank you for great job, this is what i was looking for!!
Just wanted to say thanks! I’m using this for both security videos and snapshots. Works great.
This is awesome I had been looking for something like this, but I am having trouble getting it to accept my folder:
Invalid config for [sensor.files]: not a directory for dictionary value @ data['folder']. Got '/config/www/cam_captures/front'. (See ?, line ?). Please check the docs at https://home-assistant.io/components/sensor.files/
- platform: files
folder: /config/www/cam_captures/front
name: gallery_images_front
sort: date
Is it because it is a couple levels in? If I put the full path it contains that in the URL when trying to view the image. the cam_captures dir is in my whitelist and works iOS notifications which require URL
Hrm, strange. No, it shouldn’t be the depth…mine works fine with the below, which is similar.
And you say you can view images from a browser using the equivalent path?
I would guess that the user your hass instance runs under doesn’t have access to that folder, maybe? Does it create those images (via snapshot, etc)?
- platform: files
folder: /config/www/downloads/front_door
name: kuna_vids
sort: name
Yes they are snapshot images which then get sent via iOS notification. I can access them directly with the url… it seems it is looking to replace /config/www but I have to use the full path which it then does not replace… when I look at the state of the sensor it shows the entire path there as well.
What do you mean by that? Can you clarify?
Sorry, I’m at work on mobile so it would be hard to copy the code but it looked like in gallery.html “imageLocation” did a replace of the path and looked for /config/www (I am no programmer… just dabble enough to try to see how stuff works )…
so it seems that since I can’t use the /config/www path (only full Linux path works without error in config) it isn’t doing the replace.
For the heck of it I chmod’d the dir to 777 and still had the issue.
Edit: I don’t know if something is wrong with my setup as I can’t even add /config/www to my whitelist as it says it doesn’t exist (although I wouldn’t think that would matter as the cam_captures directory is already whitelisted with the full path, I tried adding one with /config/www and it says it doesn’t exist.
Ah, yes, the gallery does do that in order to make a path for the URL, but it sounded to me like your problem was in the files component.
Is the files component working? I.e. do you see the sensor and the list of files that are in your folder?
Yes I do but each image listed with the full Linux path as that was the only one that let the config check pass (I can screenshot shortly or copy from states page soon )…
so here is part of the attributes of the sensor…
path: /home/homeassistant/.homeassistant/www/cam_captures/front/
filter: *
number_of_files: 90
bytes: 1959610
fileList: /home/homeassistant/.homeassistant/www/cam_captures/front/front_yard_1571270525.jpg,/home/homeassistant/.homeassistant/www/cam_captures/front/front_yard_1571272054.jpg,/home/homeassistant/.homeassistant/www/cam_captures/front/front_yard_1571272068.jpg,/home/homeassistant/.homeassistant/www/cam_captures/front/front_yard_1571275281.jpg,/home/homeassistant/.homeassistant/www/cam_captures/front/front_yard_1571276199.jpg,/home/homeassistant/.homeassistant/www/cam_captures/front/front_yard_1571277181.jpg,
So… that is what it appends to the URL in the gallery page https://MYURL/home/homeassistant/.homeassistant/www/cam_captures/front/front_yard_1571270525.jpg
do you think something is not right in my HA that I cannot use /config/www at all? I see other posts where people refer to folder_watcher/sensor type issues but they all seem to be using directories that are actually outside of their HA config folder.
I looked at any other situations where I use paths and it seems I always use the whole path starting with /home… command line sensors, snapshots etc all work fine.
I don’t know if I’d say there’s something wrong, but it’s definitely not the standard, at least that I’ve seen.
Anyway, I posted an update to gallery that should handle your case. Try that one and see if it works for you.
No luck, still putting whole path in URL… thank you for trying
Did you clear your cache?
I had not, did now but get blank page as if no images are found at all but sensor still lists all the files.
Javascript console says ReferenceError: Can’t find variable: testPath
I don’t know if that’s of any use to you.
EDIT again… changed testPath to path and it’s working! Thanks so much!
Oops, sorry about that. Good catch. I updated the one in github too.
Any chance you use the iOS 2.0 beta app? It seems to not be working there, but seems good in the regular release. (iOS 13 also)
