test icon drop in and load

[Mariusthvdb]

since currently we need to write the path of each icon into the js resource and update all references to those is a bit of a hassle, I hope we can do as other integrations do. Simply have a map with the actual icons, and load those icons. A bit like Fontawesome does, or its clone simple-icons.

Ive tried to create an initial js resource, and it loads, but I see a 'forbidden' in inspector...

would you know if this could be feasible?
icon_picker.js.zip

[Mariusthvdb]

experimental custom component is working, copied form Fontawesome, and carefully edited the brand out of it, as I only want a way to drop icons and be able to. use them in HA.

[arallsopp]

When I had failures trying to load the icons via JS in the frontend, I created a custom integration version that loads hass-hue-icons from disk. Might be a useful reference?

https://github.com/arallsopp/hass-hue-icons-integration

[Mariusthvdb]

how could I have missed that ;-)

still, that requires the icons to be mapped in the main.js file?

my idea is to simply be able to drop an icon.svg in the directory , and then be able to use it in the picker and yaml directly. no more hassle with mapping them and editing paths...

just dropped your adore file and voila:

- title: Custom icons
  path: custom_icons
  icon: cli:adore

using cli: for the custom_component, to differentiate between cil: for the plugin resource ...

[arallsopp]

It predates the picker, I think. But it does let you load svg files directly from the disk, IIRC. It was a while back now, so I forget quite how it worked :)

The documentation / readme is just a clone of the hass-hue-icons repo at that time, so probably needs to be looked again.

I think the issue will be having the picker be aware of what's in the custom folder, as you maybe don't want to be scanning the disc every time someone types a character in the picker.