You mind sharing the code, interested in the weather forecast solution
Not at all. Should probably add to github, but just to share quickly here…
The Dark Sky code was mostly taken, slightly adapted, from an active thread on this forum, sorry I’m not giving credit very well:
sensor:
- platform: darksky
api_key: !secret darksky_key
forecast:
- 1
- 2
- 3
- 4
- 5
- 6
monitored_conditions:
- precip_probability
- icon
- temperature_min
- temperature_max
- temperature
- platform: season
- platform: template
sensors:
forecast_0:
friendly_name: Today
value_template: >
{{states.sensor.dark_sky_daily_high_temperature.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_1:
friendly_name: Tomorrow
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_1.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_1.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_1", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_1", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_1", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_1", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_1", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_1", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_1", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_1", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_1", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_1", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_2:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (2 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_2.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_2.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_2", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_2", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_2", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_2", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_2", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_2", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_2", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_2", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_2", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_2", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_3:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (3 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_3.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_3.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_3", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_3", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_3", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_3", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_3", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_3", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_3", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_3", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_3", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_3", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_4:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (4 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_4.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_4.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_4", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_4", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_4", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_4", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_4", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_4", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_4", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_4", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_4", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_4", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_5:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (5 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_5.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_5.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_5", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_5", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_5", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_5", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_5", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_5", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_5", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_5", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_5", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_5", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_6:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (6 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_6.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_6.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_6", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_6", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_6", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_6", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_6", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_6", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_6", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_6", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_6", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_6", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
Then I created a new widget I called day_forecast
base_day_forecast.js
function base_day_forecast(widget_id, url, skin, parameters)
{
self = this;
self.widget_id = widget_id;
self.parameters = parameters;
if ("monitored_entity" in self.parameters)
{
entity = self.parameters.monitored_entity
}
else
{
entity = self.parameters.entity
}
var callbacks = [];
self.OnStateAvailable = OnStateAvailable;
self.OnStateUpdate = OnStateUpdate;
var monitored_entities =
[
{"entity": parameters.entity, "initial": self.OnStateAvailable, "update": self.OnStateUpdate}
];
WidgetBase.call(self, widget_id, url, skin, parameters, monitored_entities, callbacks)
function OnStateAvailable(self, state)
{
set_view(self,state);
}
function OnStateUpdate(self, state)
{
set_view(self,state);
}
function set_view(self,state){
self.icon = 'mdi ' + state.attributes.icon.replace(':','-');
self.title = state.attributes.friendly_name;
self.value = state.state;
self.set_field(self, "icon", self.icon)
self.set_field(self, "value", self.value)
self.set_field(self, "title", self.title)
}
}
base_day_forecast.html
<h1 class="title left-title" data-bind="text: title"></h1>
<h2 class="iconcontainer icon right-icon" data-bind="attr:{style: icon_style}"><i data-bind="attr: {class: icon}"></i></h2>
<div class="valueunit" style=""><h2 class="value left-value" data-bind="html: value" style="color: #fff;font-size: 100%;"></h2></div>
base_day_forecast.css
.widget-base_day_forecast-{{id}} {
position: relative;
}
.widget-base_day_forecast-{{id}} .title {
position: absolute;
top: 5px;
width: 100%;
}
.widget-base_day_forecast-{{id}} .title2 {
position: absolute;
top: 23px;
width: 100%;
}
.widget-base_day_forecast-{{id}} .iconcontainer.icon {
position: absolute;
bottom: 25%;
width: 100%;
}
h1.title.left-title{
text-align:left;
box-sizing:border-box;
padding-left: 15px;
top: 17px;
}
h2.value.left-value{
box-sizing: border-box;
padding-left: 15px;
font-size: 175% !important;
top: 35px !important;
bottom: auto;
position: absolute;
left: 0;
}
.icon.right-icon{
text-align:right;
padding-right:15px;
box-sizing:border-box;
}
day_forecast.yaml
widget_type: base_day_forecast
entity: {{entity}}
fields:
title: ""
value: ""
icon: ""
icon_style: $style_inactive
static_css:
title_style: $style_title
widget_style: $background_style
css:
icon_style_active: $style_active
icon_style_inactive: $style_inactive
dashboard.dash
forecast_0:
widget_type: day_forecast
entity: sensor.forecast_0
forecast_1:
widget_type: day_forecast
entity: sensor.forecast_1
forecast_2:
widget_type: day_forecast
entity: sensor.forecast_2
forecast_3:
widget_type: day_forecast
entity: sensor.forecast_3
forecast_4:
widget_type: day_forecast
entity: sensor.forecast_4
forecast_5:
widget_type: day_forecast
entity: sensor.forecast_5
forecast_6:
widget_type: day_forecast
entity: sensor.forecast_6
