Changing default "entity_pictures" - Where are "static" images stored?

1

Hi all,

Whereabouts can I find the following folder /static/images/darksky/weather-windy.svg ?
This is the default folder/image that DARKSKY uses for its entity pictures.

Home assistant is installed on UBUNTU.

I’m trying to change the default images to the animated ones.
I know there is a Custom DARKSKY animated weather card that will show the animation, however, this isnt the solution for me as I am creating a PICTURE-ELEMENTS card in panel-mode and want to add weather to it.

Below is an example of the attributes for sensor.dark_sky_summary_0d
NOTE: the “entity_picture:” path

attribution: Powered by Dark Sky
friendly_name: Dark Sky Summary 0d
icon: 'mdi:weather-windy'
entity_picture: /static/images/darksky/weather-windy.svg

Any advice or better solution would be greatly appreciated!

Thank you

2

I don’t think that folder exists in HA. I’ve searched my entire config and don’t find it anywhere.

However, most things of that nature should be stored in the www folder. Which doesn’t exist by default as far as I remember - you have to create it.

1 Like
3

Thanks for looking in to it @finity

Because the DARKSKY component is built into HA it does not appear in the www folder.
Do you know where “default” components are stored in a linux environment?

4

No sorry I’m not sure where those files are located. I did a search of my entire system and didn’t find that svg file above and i’m using both the darksky sensor and weather integrations.

But I’m not sure you need to find those files. If you just want to change the entity_picture of a sensor then just change it in the customize section.

5

Thanks again for trying.

Hmmmm I wonder where the file is located then…
Yes I think you are right, I’ll probably have to use the customize option.

6

Hey Paulie,

There are two ways.

Option 1: Edit theme and add files to theme folder

  # Animated icons
  weather-icon-clear-night: url("/hacsfiles/themes/clear-night.svg")
  weather-icon-cloudy: url("/hacsfiles/themes/cloudy.svg")
  weather-icon-fog: url("/hacsfiles/themes/fog.svg")
  weather-icon-lightning: url("/hacsfiles/themes/lightning.svg")
  weather-icon-lightning-rainy: url("/hacsfiles/themes/lightning-rainy.svg")
  weather-icon-partlycloudy: url("/hacsfiles/themes/partlycloudy.svg")
  weather-icon-pouring: url("/hacsfiles/themes/pouring.svg")
  weather-icon-rainy: url("/hacsfiles/themes/rainy.svg")
  weather-icon-hail: url("/hacsfiles/themes/hail.svg")
  weather-icon-snowy: url("/hacsfiles/themes/snowy.svg")
  weather-icon-snowy-rainy: url("/hacsfiles/themes/snowy-rainy.svg")
  weather-icon-sunny: url("/hacsfiles/themes/sunny.svg")
  weather-icon-windy: url("/hacsfiles/themes/windy.svg")
  weather-icon-windy-variant: url("/hacsfiles/themes/windy-variant.svg")
  weather-icon-exceptional: url("/hacsfiles/themes/exceptional.svg")

Option 2: Add a seperate card (A little bonus :grin:)

card:
  entity: weather.yourcity
  name_template: '{{ states.weather.yourcity.state }}'
  show_name: false
  show_state: false
  state_image:
    clear-night: >-
      http://[YOUR IP}:8123/local/lovelace/images/assets/weather/clear-night.svg
    cloudy: 'http://[YOUR IP}:8123/local/lovelace/images/assets/weather/cloudy.svg'
    exceptional: >-
      http://[YOUR IP}:8123/local/lovelace/images/assets/weather/exceptional.svg
    fog: 'http://[YOUR IP}:8123/local/lovelace/images/assets/weather/fog.svg'
    hail: 'http://[YOUR IP}:8123/local/lovelace/images/assets/weather/hail.svg'
    lightning: >-
      http://[YOUR IP}:8123/local/lovelace/images/assets/weather/lightning.svg
    lightning-rainy: >-
      http://[YOUR IP}:8123/local/lovelace/images/assets/weather/lightning-rainy.svg
    partlycloudy: >-
      http://[YOUR IP}:8123/local/lovelace/images/assets/weather/partlycloudy.svg
    pouring: 'http://[YOUR IP}:8123/local/lovelace/images/assets/weather/pouring.svg'
    rainy: 'http://[YOUR IP}:8123/local/lovelace/images/assets/weather/rainy.svg'
    snowy: 'http://[YOUR IP}:8123/local/lovelace/images/assets/weather/snowy.svg'
    snowy-rainy: >-
      http://[YOUR IP}:8123/local/lovelace/images/assets/weather/snowy-rainy.svg
    sunny: 'http://[YOUR IP}:8123/local/lovelace/images/assets/weather/sunny.svg'
    windy: 'http://[YOUR IP}:8123/local/lovelace/images/assets/weather/windy.svg'
    windy-variant: >-
      http://[YOUR IP}:8123/local/lovelace/images/assets/weather/windy-variant.svg
  style: |
    ha-card {
       background: none;
       padding: 0px 0px 0px 0px;
       border-bottom: 0px;
       width: 190%
      }
  type: picture-entity
entities:
  - weather.yourcity
type: 'custom:card-templater'
1 Like
7

Thanks for your reply @dennisaion I’ll have a go at this soon.
:+1: :+1: :+1: :+1: :+1: :+1: :+1: :+1: :+1:

8

Glad to help :+1:

9

Turns out Templating was the best solution for my use case:

sensor:
  - platform: template
    sensors:
      weather_animated_day_0:
        friendly_name: "Weather Animated Day 0"
        entity_picture_template: >-
          {% if is_state("sensor.dark_sky_icon_0d","clear-day") %} /local/weather_icons/animated/weather-sunny.svg
          {% elif is_state("sensor.dark_sky_icon_0d","clear-night") %} /local/weather_icons/animated/weather-night.svg
          {% elif is_state("sensor.dark_sky_icon_0d","rain") %} /local/weather_icons/animated/rainy-6.svg
          {% elif is_state("sensor.dark_sky_icon_0d","snow") %} /local/weather_icons/animated/snowy-1.svg
          {% elif is_state("sensor.dark_sky_icon_0d","fog") %} /local/weather_icons/animated/fog.svg
          {% elif is_state("sensor.dark_sky_icon_0d","sleet") %} /local/weather_icons/animated/sleet.svg
          {% elif is_state("sensor.dark_sky_icon_0d","wind") %} /local/weather_icons/animated/windy.svg
          {% elif is_state("sensor.dark_sky_icon_0d","cloudy") %} /local/weather_icons/animated/cloudy.svg
          {% elif is_state("sensor.dark_sky_icon_0d","partly-cloudy-day") %} /local/weather_icons/animated/cloudy-day-3.svg
          {% elif is_state("sensor.dark_sky_icon_0d","partly-cloudy-night") %} /local/weather_icons/animated/cloudy-night-3.svg
          {% elif is_state("sensor.dark_sky_icon_0d","hail") %} /local/weather_icons/animated/hail.svg
          {% elif is_state("sensor.dark_sky_icon_0d","lightning") %} /local/weather_icons/animated/thunder.svg
          {% elif is_state("sensor.dark_sky_icon_0d","thunderstorm") %} /local/weather_icons/animated/thunder.svg
          {% endif %}
        # entity_id: sensor.dark_sky_icon_0d
        value_template: >-
          {% if is_state("sensor.dark_sky_icon_0d","clear-day") %} weather-sunny 
          {% elif is_state("sensor.dark_sky_icon_0d","clear-night") %} weather-night 
          {% elif is_state("sensor.dark_sky_icon_0d","rain") %} weather-rainy
          {% elif is_state("sensor.dark_sky_icon_0d","snow") %} weather-snowy
          {% elif is_state("sensor.dark_sky_icon_0d","fog") %} weather-fog
          {% elif is_state("sensor.dark_sky_icon_0d","sleet") %} weather-partly-snowy-rainy
          {% elif is_state("sensor.dark_sky_icon_0d","wind") %} weather-windy
          {% elif is_state("sensor.dark_sky_icon_0d","cloudy") %} weather-cloudy
          {% elif is_state("sensor.dark_sky_icon_0d","partly-cloudy-day") %} weather-partly-cloudy
          {% elif is_state("sensor.dark_sky_icon_0d","partly-cloudy-night") %} weather-night-partly-cloudy
          {% elif is_state("sensor.dark_sky_icon_0d","hail") %} weather-hail
          {% elif is_state("sensor.dark_sky_icon_0d","lightning") %} weather-lightning
          {% elif is_state("sensor.dark_sky_icon_0d","thunderstorm") %} weather-lightning-rainy
          {% endif %}