DWD WarnWetter markdown card

Share your Projects! Dashboards & Frontend
63

Hello all - I think I need to use a “dictionary” to convert/translate to English

I have @stephan19’s card (above) working just fine but the data is in German. I want to change the “headline” at a minimum to English but NOT sure exactly where to put the ‘translate’ code.

I see @Maxi531 is using a template to set an image to a corresponding numerical value. I think this is doable trying to essentially do something similar.

I can grab the value but can’t correlate it.

This is my code:

{% set dwd_sensor = state_attr('sensor.dwd_weather_warnings_107336000_current_warning_level', 'warning_1_type') %} {%
        set warn_lvl = {
          11: "COASTAL WARNING - GUSTS",
          12: "COASTAL WARNING - WIND",
          13: "COASTAL WARNING - STORM",
          14: "OCEAN WARNING - STRONG WIND",
          15: "OCEAN WARNING - STORM",
          16: "OCEAN WARNING - HEAVY STORM",
          22: "FROST",
          24: "SLICK",
          31: "THUNDERSTORMS",
          33: "STRONG THUNDERSTORM",
          34: "STRONG THUNDERSTORM",
          36: "STRONG THUNDERSTORM",
          38: "STRONG THUNDERSTORM",
          40: "SEVERE THUNDERSTORM with GALE-FORCE WINDS",
          41: "SEVERE THUNDERSTORM with EXTREME GALE-FORCE WINDS",
          42: "SEVERE THUNDERSTORM with HEAVY RAIN",
          44: "SEVERE THUNDERSTORM with GALE GUSTS and HEAVY RAIN",
          45: "SEVERE THUNDERSTORM with EXTREME GALE-FORCE WINDS and HEAVY RAIN",
          46: "SEVERE THUNDERSTORM with HEAVY RAIN and HAIL",
          48: "SEVERE THUNDERSTORM with GALE-FORCE GUSTS, HEAVY HEAVY RAIN and HAIL",
          49: "SEVERE THUNDERSTORM with EXTREME GALE GUSTS, HEAVY RAIN and HAIL",
          51: "WIND GUSTS",
          52: "STORM GUSTS",
          53: "HEAVY WIND GUSTS",
          54: "GALE FORCE WINDS",
          55: "GALE GUSTS",
          56: "EXTREME GALE-FORCE WINDS",
          57: "INLAND WATERWAY WARNING - STRONG WIND",
          58: "INLAND WATERWAY WARNING - STORM",
          59: "FOG",
          61: "STRONG RAIN",
          62: "HEAVY RAIN",
          63: "PERSISTENT RAIN",
          64: "HEAVY CONTINUOUS RAIN",
          65: "EXTREMELY HEAVY CONTINUOUS RAIN",
          66: "EXTREMELY HEAVY RAIN",
          70: "LIGHT SNOWFALL",
          71: "SNOW",
          72: "HEAVY SNOWFALL",
          73: "EXTREMELY HEAVY SNOWFALL",
          74: "SNOWDRIFT",
          75: "HEAVY SNOWDRIFT",
          76: "EXTREMELY HEAVY SNOWDRIFT",
          79: "",
          82: "HARD FREEZE",
          84: "SURFACE ICE",
          85: "BLACK ICE",
          87: "BLACK ICE",
          88: "THAW",
          89: "SEVERE THAW",
          90: "THUNDERSTORMS",
          91: "STRONG THUNDERSTORMS",
          92: "HEAVY THUNDERSTORMS",
          93: "EXTRME THUNDERSTORMS",
          95: "SEVERE THUNDERSTORM with EXTREMELY HEAVY RAIN and HAIL",
          96: "EXTREME THUNDERSTORM with GAIL-FORCE GUSTS, EXTREMELY HEAVY RAIN and HAIL",
          98: "TEST-WARNUNG",
          99: "TEST SEVERE WEATHER WARNING",
          246: "UV-INDEX",
          247: "HEAT",
          248: "EXTREME HEAT"}
        %}
64

I think I fixed it. :slight_smile:

65

Hi,
is there possibly a way to remove the text in the brackets (including the brackets)?

Various units for the wind speed are given here, which are generally not relevant.

66

regex_replace

67

@stephan19 Any idea why this is happening?

IMG_1754
IMG_17541284×961 103 KB

Here is my card. I’m sure I have something out of place.

type: conditional
conditions:
  - condition: state
    entity: sensor.dwd_weather_warnings_807335038_current_warning_level
    state_not: '0'
  - condition: state
    entity: sensor.dwd_weather_warnings_807335038_advance_warning_level
    state: '0'
card:
  type: markdown
  content: |2

      {% set level_colors = ["#c5e566", "#ffeb3b", "#fb8c00", "#e53935", "#880e4f"]
      %} {% set current_count =
      state_attr("sensor.dwd_weather_warnings_807335038_current_warning_level",
      "warning_count") %} {% set advance_count =
      state_attr("sensor.dwd_weather_warnings_807335038_advance_warning_level",
      "warning_count") %} {% if ((current_count == 0) and (advance_count == 0)) %}
      **<font color={{ level_colors[0] }}>Keine Warnungen</font>** {% else %}
        {% for i in range(current_count) %}
          {% set headline = state_attr("sensor.dwd_weather_warnings_807335038_current_warning_level", "warning_" ~ loop.index ~ "_headline") %}
          {% set description = state_attr("sensor.dwd_weather_warnings_807335038_current_warning_level", "warning_" ~ loop.index ~ "_description") %}
          {% set level = state_attr("sensor.dwd_weather_warnings_807335038_current_warning_level", "warning_" ~ loop.index ~ "_level") %}
          {% set time_start = state_attr("sensor.dwd_weather_warnings_807335038_current_warning_level", "warning_" ~ loop.index ~ "_start") %}
          {% set time_end = state_attr("sensor.dwd_weather_warnings_807335038_current_warning_level", "warning_" ~ loop.index ~ "_end") %}
        **<font color={{ level_colors[level] }}>{{ headline }}</font>**
        {{ time_start.strftime("%a %H:%M") ~ " - " ~ time_end.strftime("%a %H:%M") }}
        *{{ description }}*
        {% if not loop.last %}***{% endif %}
        {% endfor %}
        {% if ((current_count != 0) and (advance_count != 0)) %}***{% endif %}
        {% for i in range(advance_count) %}
          {% set headline = state_attr("sensor.dwd_weather_warnings_807335038_advance_warning_level", "warning_" ~ loop.index ~ "_headline") %}
          {% set description = state_attr("sensor.dwd_weather_warnings_807335038_advance_warning_level", "warning_" ~ loop.index ~ "_description") %}
          {% set level = state_attr("sensor.dwd_weather_warnings_807335038_advance_warning_level", "warning_" ~ loop.index ~ "_level") %}
          {% set time_start = state_attr("sensor.dwd_weather_warnings_807335038_advance_warning_level", "warning_" ~ loop.index ~ "_start") %}
          {% set time_end = state_attr("sensor.dwd_weather_warnings_807335038_advance_warning_level", "warning_" ~ loop.index ~ "_end") %}
        **<font color={{ level_colors[level] }}>{{ headline }}</font>**
        {{ time_start.strftime("%a %H:%M") ~ " - " ~ time_end.strftime("%a %H:%M") }}
        *{{ description }}*
        {% if not loop.last %}***{% endif %}
        {% endfor %}
      {% endif %}
  title: 'Weather Alert! '
68

You may want to move everything to be left bound

69

Hey there,

thanks a ton for sharing this! I took the modification of @gerd1 because it has nice additional formatting as well as the correct local time (my previous markdown had an offset of 1 hour).
I made even one more replacement in the code because one will not need to extract the name from the sensor component but one can directly use he complete sensor names as HA proposes them while coding.

This is how it looks like:

Bildschirmfoto vom 2024-01-22 17-08-00
Bildschirmfoto vom 2024-01-22 17-08-00507×538 71.7 KB

And this is the code:

type: markdown
title: DWD Wetterwarnungen
content: >-
  {# Beginn: Letzte Aktualisierung #}  

  {% set sensor_warning_current =
  "sensor.dwd_weather_warnings_805758036_current_warning_level" %}

  {% set sensor_warning_advance =
  "sensor.dwd_weather_warnings_805758036_advance_warning_level" %}

  {% set current_last_update = state_attr(sensor_warning_current, "last_update")
  %} {% set weekday_last_update = as_timestamp(current_last_update) |
  timestamp_custom("%w", True) | int %} Stand: {{
  ['Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag','Sonntag'][weekday_last_update-1]
  ~ ", " ~ as_timestamp(current_last_update) |
  timestamp_custom('%d.%m.%Y-%H:%M:%S') }}

  {# Ende: Letzte Aktualisierung #} 


  {# Beginn: Meldungen #}

  {% set current_region_name = state_attr(sensor_warning_current, "region_name")
  %} {% set current_count = state_attr(sensor_warning_current, "warning_count")
  %} {% set advance_count = state_attr(sensor_warning_advance, "warning_count")
  %} 

  ****{{ current_region_name }}****

  {% if ((current_count == 0 or current_count == None) and (advance_count == 0
  or advance_count == None)) %} **<font color=#c5e566>Keine Warnungen</font>**{%
  else %}
    {% for i in range(current_count) %}
      {% set headline = state_attr(sensor_warning_current, "warning_" ~ loop.index ~ "_headline") %}
      {% set description = state_attr(sensor_warning_current, "warning_" ~ loop.index ~ "_description") %}
      {% set instruction = state_attr(sensor_warning_current, "warning_" ~ loop.index ~ "_instruction") %}
      {% set level = state_attr(sensor_warning_current, "warning_" ~ loop.index ~ "_level") %}
      {% set time_start = state_attr(sensor_warning_current, "warning_" ~ loop.index ~ "_start") %}
      {% set weekday_start = as_timestamp(time_start) | timestamp_custom("%w", True) | int %}
      {% set time_end = state_attr(sensor_warning_current, "warning_" ~ loop.index ~ "_end") %}
      {% set weekday_end = as_timestamp(time_end) | timestamp_custom("%w", True) | int %}
      {% set color = state_attr(sensor_warning_current, "warning_" ~ loop.index ~ "_color") %}
    **<font color={{ color }}>{{ headline }}</font>**     
    **{{ ['Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag','Sonntag'][weekday_start-1] ~ ", " ~ as_timestamp(time_start) | timestamp_custom('%H:%M') ~ " Uhr - " ~ ['Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag','Sonntag'][weekday_end-1] ~ ", " ~ as_timestamp(time_end) | timestamp_custom('%H:%M') ~ " Uhr" }}**
    *{{ description|trim }}*
    {% if (instruction|trim != "None") %}
    ****{{ instruction|trim }}****
    {% endif %}
    {% if not loop.last %}***{% endif %}
    {% endfor %}
    {% if ((current_count != 0) and (advance_count != 0)) %}***{% endif %}
    {% for i in range(advance_count) %}
      {% set headline = state_attr(sensor_warning_advance, "warning_" ~ loop.index ~ "_headline") %}
      {% set description = state_attr(sensor_warning_advance, "warning_" ~ loop.index ~ "_description") %}
      {% set instruction = state_attr(sensor_warning_advance, "warning_" ~ loop.index ~ "_instruction") %}
      {% set level = state_attr(sensor_warning_advance, "warning_" ~ loop.index ~ "_level") %}
      {% set time_start = state_attr(sensor_warning_advance, "warning_" ~ loop.index ~ "_start") %}
      {% set weekday_start = as_timestamp(time_start) | timestamp_custom("%w", True) | int %}
      {% set time_end = state_attr(sensor_warning_advance, "warning_" ~ loop.index ~ "_end") %}
      {% set weekday_end = as_timestamp(time_end) | timestamp_custom("%w", True) | int %}
      {% set color = state_attr(sensor_warning_advance, "warning_" ~ loop.index ~ "_color") %}
    **<font color={{ color }}>{{ headline }}</font>**
    **{{ ['Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag','Sonntag'][weekday_start-1] ~ ", " ~ as_timestamp(time_start) | timestamp_custom('%H:%M') ~ " Uhr - " ~ ['Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag','Sonntag'][weekday_end-1] ~ ", " ~ as_timestamp(time_end) | timestamp_custom('%H:%M') ~ " Uhr" }}**
    *{{ description|trim }}*
    {% if (instruction|trim != "None") %}
    ****{{ instruction|trim }}****
    {% endif %}
    {% if not loop.last %}***{% endif %}
    {% endfor %}
  {% endif %}   

  {# Ende: Meldungen #}

Thank you!

2 Likes
70

Thank you all so much so much for this. Being completely new to HA it was a bit of work to figure everything out, but now the weather warnings on my dashboard are working and are looking so nice! This made me really glad today!

1 Like
71

I am using mushroom cards in combination with the decluttering card, and of course all embedded into a conditional card.
image

1 Like
72

Can your share the Code? @nicknol

73

You need

Template for binary sensors
please pay attention to <x>; replace it with 1, 2, 3
replace <the_city> according to your location

{% if state_attr('sensor.dwd_warnungen_<the_city>_current_warning_level', "warning_count") != None %}
{{ state_attr('sensor.dwd_warnungen_<the_city>_current_warning_level', "warning_count") >= <x> }}
{% else %}
0
{% endif %}

The Code Snippets
replace <the_city> according to your location

decluttering card

  wetter_warnung_template:
    card:
      type: conditional
      conditions:
        - entity: binary_sensor.dwd_warnungen_<the_city>_[[time]]_[[warning]]
          state: 'on'
      card:
        type: custom:mushroom-template-card
        primary: >-
          {% if
          states('binary_sensor.dwd_warnungen_<the_city>_[[time]]_[[warning]]')
          == 'on' %} {% set dwd_sensor =
          "sensor.dwd_warnungen_<the_city>_[[time]]_warning_level" %}  

          {% set days = ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa"] %}  


          {% set headline = state_attr(dwd_sensor, ("[[warning]]")).event %}

          {% set time_start = state_attr(dwd_sensor, ("[[warning]]_start")) %}

          {% set time_end = state_attr(dwd_sensor, ("[[warning]]_end")) %}


          {% set ts = as_timestamp(time_start) | timestamp_local %}

          {% set wd_start = as_timestamp(ts) | timestamp_custom("%w") | int %}

          {% set t_start = as_timestamp(ts) | timestamp_custom("%-H:%M") %}

          {% set day_start = days[wd_start] %}


          {% set ts = as_timestamp(time_end) | timestamp_local %}

          {% set wd_end = as_timestamp(ts) | timestamp_custom("%w") | int %}

          {% set t_end = as_timestamp(ts) | timestamp_custom("%-H:%M") %}

          {% if (wd_end == wd_start) %}
            {% set day_end = "" %}
          {% else %}
            {% set day_end = days[wd_end] +" " %}
          {% endif %}


          {{headline}}: {{day_start}} {{t_start}} - {{day_end}}{{t_end}} {%
          endif %}
        secondary: >-
          {% if
          states('binary_sensor.dwd_warnungen_<the_city>_[[time]]_[[warning]]')
          == 'on' %} {% set dwd_sensor =
          "sensor.dwd_warnungen_<the_city>_[[time]]_warning_level" %}  

          {% set description = state_attr(dwd_sensor,
          ("[[warning]]")).description %}

          {% if None == state_attr(dwd_sensor, ("[[warning]]")).instruction %}

          {% set instruction = '' %}

          {% else %}

          {% set instruction = state_attr(dwd_sensor,
          ("[[warning]]")).instruction %}

          {% endif %}{{description}}


          {{instruction}} {% endif %}
        icon: >-
          {% if
          states('binary_sensor.dwd_warnungen_<the_city>_[[time]]_[[warning]]')
          == 'on' %} {% set dwd_sensor =
          "sensor.dwd_warnungen_<the_city>_[[time]]_warning_level" %}  

          {% set type_to_img = {
            11: "",
            12: "",
            13: "",
            14: "",
            15: "",
            16: "",
            22: "fas:temperature-arrow-down",
            24: "fas:person-falling",
            31: "fas:cloud-bolt",
            33: "fas:cloud-bolt",
            34: "fas:cloud-bolt",
            36: "fas:cloud-bolt",
            38: "fas:cloud-bolt",
            40: "fas:cloud-bolt",
            41: "fas:cloud-bolt",
            42: "fas:cloud-bolt",
            44: "fas:cloud-bolt",
            45: "fas:cloud-bolt",
            46: "fas:cloud-bolt",
            48: "fas:cloud-bolt",
            49: "fas:cloud-bolt",
            51: "fas:wind",
            52: "fas:wind",
            53: "fas:wind",
            54: "fas:wind",
            55: "fas:wind",
            56: "fas:wind",
            57: "fas:wind",
            58: "fas:wind",
            59: "fas:smog",
            61: "fas:cloud-showers-heavy",
            62: "fas:cloud-showers-heavy",
            63: "fas:cloud-showers-heavy",
            64: "fas:cloud-showers-heavy",
            65: "fas:cloud-showers-heavy",
            66: "fas:cloud-showers-heavy",
            70: "far:snowflake",
            71: "far:snowflake",
            72: "far:snowflake",
            73: "far:snowflake",
            74: "far:snowflake",
            75: "far:snowflake",
            76: "far:snowflake",
            79: "",
            82: "fas:temperature-arrow-down",
            84: "fas:person-falling",
            85: "fas:person-falling",
            87: "fas:person-falling",
            88: "fas:temperature-arrow-up",
            89: "fas:temperature-arrow-up",
            90: "fas:cloud-bolt",
            91: "fas:cloud-bolt",
            92: "fas:cloud-bolt",
            93: "fas:cloud-bolt",
            95: "fas:cloud-bolt",
            96: "fas:cloud-bolt",
            98: "",
            99: "",
            246: "mdi:weather-sunny-alert",
            247: "mdi:sun-thermometer-outline",
            248: "mdi:sun-thermometer-outline"}
          %}

          {% set img = type_to_img[state_attr(dwd_sensor,
          ("[[warning]]")).event_code] %}

          {{img}} {% endif %}
        icon_color: >-
          {% if
          states('binary_sensor.dwd_warnungen_<the_city>_[[time]]_[[warning]]')
          == 'on' %} {% set dwd_sensor =
          "sensor.dwd_warnungen_<the_city>_[[time]]_warning_level" %}  

          {% set type_to_color = {
            11: "",
            12: "",
            13: "",
            14: "",
            15: "",
            16: "",
            22: "amber",
            24: "amber",
            31: "amber",
            33: "orange",
            34: "orange",
            36: "orange",
            38: "orange",
            40: "red",
            41: "pink",
            42: "red",
            44: "red",
            45: "pink",
            46: "red",
            48: "red",
            49: "pink",
            51: "amber",
            52: "orange",
            53: "orange",
            54: "red",
            55: "red",
            56: "pink",
            57: "amber",
            58: "orange",
            59: "amber",
            61: "orange",
            62: "red",
            63: "orange",
            64: "red",
            65: "pink",
            66: "pink",
            70: "amber",
            71: "orange",
            72: "red",
            73: "pink",
            74: "orange",
            75: "red",
            76: "pink",
            79: "",
            82: "orange",
            84: "amber",
            85: "orange",
            87: "red",
            88: "orange",
            89: "red",
            90: "amber",
            91: "orange",
            92: "red",
            93: "pink",
            95: "pink",
            96: "pink",
            98: "",
            99: "",
            246: "pink",
            247: "pink",
            248: "purple"}
          %}

          {% set color = type_to_color[state_attr(dwd_sensor,
          ("[[warning]]")).event_code] %}

          {{color}} {% endif %}
        multiline_secondary: true
        fill_container: false
        layout: horizontal
        tap_action:
          action: none
        hold_action:
          action: none
        double_tap_action:
          action: none

Cards in Dashboard
** Heading
** max 3 current warnings
** max 3 advanced warnings

      - type: conditional
        conditions:
          - condition: state
            entity: sensor.dwd_warnungen_<the_city>_summe
            state_not: '0.0'
        card:
          type: custom:mushroom-title-card
          title: ⚠ Wetterwarnung!
          subtitle: <The City>
          title_tap_action:
            action: none
          subtitle_tap_action:
            action: none
      - type: custom:decluttering-card
        template: wetter_warnung_template
        variables:
          - warning: warning_1
          - time: current
      - type: custom:decluttering-card
        template: wetter_warnung_template
        variables:
          - warning: warning_2
          - time: current
      - type: custom:decluttering-card
        template: wetter_warnung_template
        variables:
          - warning: warning_3
          - time: current
      - type: custom:decluttering-card
        template: wetter_warnung_template
        variables:
          - warning: warning_1
          - time: advanced

If someone has an idea how to

  • colorize the icon in the heading according to the severity of the most serious
  • place the weather icon at the top instead of centered

please let me know

1 Like
75

where do you get the sensor from: binary_sensor.dwd_warnings_<the_city>[[time]][[warning]]
Because this is not included in the AddIN by default

and as which sensor did you create this one with the helper: sensor.dwd_warnings_<the_city>_sum ?

I am not getting any results.

do you have a different repository than me? which one exactly do you have?
I think your version is really good but I can’t find my errors. maybe I missed something in the forum of the last years…

76

thanks for the hint. I missed a set of template helpers in my description. I have amended it with the template helpers.

77

Okay cool Thank you. my last queststion i hope is.
[[warning]] & [[time]] dont have any informations. Do I need to declare them some where else? Or just in the decluttering card in the array. I´m new in the Business Sorry :smiley:

78

[[warning]] and [[time]] are pieces of replaced text in the decluttering card. They are not arrays the [[]] is just the way to indicate the placeholders for text.

It might advisable to get familar with the decluttering cards and templating in general and mushroom template cards before combining components.

Good luck

79

Inspired by this post i wanted to integrate a (really simple) ‘DWD weather warning card’ in my dashboard which just shows the content of the first weather warning if there are any warnings for my area. It’s built with paper buttons, so it can be customized easily. Next step will be a little arrow in the top right corner for navigating from one warning to another.

dwd_warning_screenshot

Maybe this is useful for others, so here’s the code:

type: custom:paper-buttons-row
styles:
  margin: 32px 16px 32px 16px
  padding: 16px
  align-items: center
  flex-wrap: wrap
  gap: 8px
  justify-content: flex-start
  border-radius: 25px
  background-color: rgba(209, 74, 17, 0.2)
buttons:
  - icon: mdi:exclamation-thick
    layout: icon
    ripple: none
    tap_action:
      action: none
    styles:
      button:
        padding: 0px
        margin-right: 8px
        background-color: transparent
      icon:
        '--mdc-icon-size': 26px
        color: var(--text-color)
        padding: 0px
        border-radius: 25px
        display: flex
        justify-content: center
        align-items: center
        min-width: 40px
        min-height: 40px
        background-image: >-
          linear-gradient(20deg,rgba(209,74,17,0.15) 30%, rgba(219, 94, 17, 0.5)
          100%)
  - layout: state_name
    name: >-
      Ohaa... {{ state_attr('sensor.your_dwd_warning_sensor_name', 'warning_1_name') }}!
    state: >-
      {{ as_timestamp(state_attr('sensor.your_dwd_warning_sensor_name',
      'warning_1_start')) | timestamp_custom('%H:%M') }} bis {{
      as_timestamp(state_attr('sensor.your_dwd_warning_sensor_name',
      'warning_1_end')) | timestamp_custom('%H:%M') }} Uhr
    ripple: none
    tap_action:
      action: none
    styles:
      button:
        flex: 1
        padding: 0px
        align-items: flex-start
        justify-content: flex-start
        background-color: transparent
      name:
        font-weight: 700
        font-size: 18px
        padding: 0px
        margin-top: 3px
        align-self: flex-start
        max-width: 240px
        overflow: hidden
        white-space: nowrap
        text-overflow: ellipsis
      state:
        font-weight: 700
        line-height: 1.3em
        font-size: 14px
        padding: 0px
        margin-top: 0px
        opacity: 0.7
        align-self: flex-start
        text-align: left
  - layout: state
    state:
      attribute: warning_1_description
    ripple: none
    entity: sensor.your_dwd_warning_sensor_name
    tap_action:
      action: none
    styles:
      button:
        flex: 1
        min-width: 100%
        padding: 0px
        align-items: flex-start
        justify-content: flex-start
        background-color: transparent
      state:
        font-weight: 500
        line-height: 1.3em
        font-size: 12px
        padding: 0px
        margin-top: 0px
        opacity: 0.5
        align-self: flex-start
        overflow: hidden
        white-space: wrap
        text-align: left
        hyphens: auto
2 Likes