diff --git a/src/data/weather.ts b/src/data/weather.ts index 8c0f7cb5f7..658343a2b7 100644 --- a/src/data/weather.ts +++ b/src/data/weather.ts @@ -48,7 +48,7 @@ const snowyStates = new Set(["snowy", "snowy-rainy"]); const lightningStates = new Set(["lightning", "lightning-rainy"]); -export const cardinalDirections = [ +const cardinalDirections = [ "N", "NNE", "NE", @@ -77,13 +77,29 @@ const getWindBearingText = (degree: string): string => { return degree; }; -export const getWindBearing = (bearing: string): string => { +const getWindBearing = (bearing: string): string => { if (bearing != null) { return getWindBearingText(bearing); } return ""; }; +export const getWind = ( + hass: HomeAssistant, + speed: string, + bearing: string +): string => { + if (bearing !== null) { + const cardinalDirection = getWindBearing(bearing); + return `${speed} ${getWeatherUnit(hass!, "wind_speed")} (${ + hass.localize( + `ui.card.weather.cardinal_direction.${cardinalDirection.toLowerCase()}` + ) || cardinalDirection + })`; + } + return `${speed} ${getWeatherUnit(hass!, "wind_speed")}`; +}; + export const getWeatherUnit = ( hass: HomeAssistant, measure: string @@ -210,7 +226,7 @@ export const weatherSVGStyles = css` } `; -export const getWeatherStateSVG = ( +const getWeatherStateSVG = ( state: string, nightTime?: boolean ): SVGTemplateResult => { diff --git a/src/dialogs/more-info/controls/more-info-weather.ts b/src/dialogs/more-info/controls/more-info-weather.ts index 9403fefc4b..7e962071a5 100644 --- a/src/dialogs/more-info/controls/more-info-weather.ts +++ b/src/dialogs/more-info/controls/more-info-weather.ts @@ -11,6 +11,8 @@ import { import { html, TemplateResult } from "lit-html"; import { HomeAssistant } from "../../../types"; +import { getWind, getWeatherUnit } from "../../../data/weather"; + import { mdiAlertCircleOutline, mdiEye, @@ -33,26 +35,6 @@ import { mdiWeatherWindyVariant, } from "@mdi/js"; -const cardinalDirections = [ - "N", - "NNE", - "NE", - "ENE", - "E", - "ESE", - "SE", - "SSE", - "S", - "SSW", - "SW", - "WSW", - "W", - "WNW", - "NW", - "NNW", - "N", -]; - const weatherIcons = { "clear-night": mdiWeatherNight, cloudy: mdiWeatherCloudy, @@ -106,7 +88,8 @@ class MoreInfoWeather extends LitElement { ${this.hass.localize("ui.card.weather.attributes.temperature")}
- ${this.stateObj.attributes.temperature} ${this.getUnit("temperature")} + ${this.stateObj.attributes.temperature} + ${getWeatherUnit(this.hass, "temperature")}
${this._showValue(this.stateObj.attributes.pressure) @@ -118,7 +101,7 @@ class MoreInfoWeather extends LitElement {
${this.stateObj.attributes.pressure} - ${this.getUnit("air_pressure")} + ${getWeatherUnit(this.hass, "air_pressure")}
` @@ -142,7 +125,8 @@ class MoreInfoWeather extends LitElement { ${this.hass.localize("ui.card.weather.attributes.wind_speed")}
- ${this.getWind( + ${getWind( + this.hass, this.stateObj.attributes.wind_speed, this.stateObj.attributes.wind_bearing )} @@ -158,7 +142,8 @@ class MoreInfoWeather extends LitElement { ${this.hass.localize("ui.card.weather.attributes.visibility")}
- ${this.stateObj.attributes.visibility} ${this.getUnit("length")} + ${this.stateObj.attributes.visibility} + ${getWeatherUnit(this.hass, "length")}
` @@ -191,12 +176,14 @@ class MoreInfoWeather extends LitElement { ${this.computeDate(item.datetime)}
- ${item.templow} ${this.getUnit("temperature")} + ${item.templow} + ${getWeatherUnit(this.hass, "temperature")}
` : ""}
- ${item.temperature} ${this.getUnit("temperature")} + ${item.temperature} + ${getWeatherUnit(this.hass, "temperature")}
`; @@ -269,41 +256,6 @@ class MoreInfoWeather extends LitElement { }); } - private getUnit(measure: string): string { - const lengthUnit = this.hass.config.unit_system.length || ""; - switch (measure) { - case "air_pressure": - return lengthUnit === "km" ? "hPa" : "inHg"; - case "length": - return lengthUnit; - case "precipitation": - return lengthUnit === "km" ? "mm" : "in"; - default: - return this.hass.config.unit_system[measure] || ""; - } - } - - private windBearingToText(degree: string): string { - const degreenum = parseInt(degree, 10); - if (isFinite(degreenum)) { - // eslint-disable-next-line no-bitwise - return cardinalDirections[(((degreenum + 11.25) / 22.5) | 0) % 16]; - } - return degree; - } - - private getWind(speed: string, bearing: string) { - if (bearing != null) { - const cardinalDirection = this.windBearingToText(bearing); - return `${speed} ${this.getUnit("length")}/h (${ - this.hass.localize( - `ui.card.weather.cardinal_direction.${cardinalDirection.toLowerCase()}` - ) || cardinalDirection - })`; - } - return `${speed} ${this.getUnit("length")}/h`; - } - private _showValue(item: string): boolean { return typeof item !== "undefined" && item !== null; } diff --git a/src/panels/lovelace/cards/hui-weather-forecast-card.ts b/src/panels/lovelace/cards/hui-weather-forecast-card.ts index 98726230bc..82ee9b96f6 100644 --- a/src/panels/lovelace/cards/hui-weather-forecast-card.ts +++ b/src/panels/lovelace/cards/hui-weather-forecast-card.ts @@ -23,6 +23,7 @@ import { getSecondaryWeatherAttribute, getWeatherUnit, getWeatherStateIcon, + getWind, weatherSVGStyles, } from "../../../data/weather"; import type { HomeAssistant, WeatherEntity } from "../../../types"; @@ -224,13 +225,21 @@ class HuiWeatherForecastCard extends LitElement implements LovelaceCard { ${this.hass!.localize( `ui.card.weather.attributes.${this._config.secondary_info_attribute}` )} - ${stateObj.attributes[ - this._config.secondary_info_attribute - ]} - ${getWeatherUnit( - this.hass, - this._config.secondary_info_attribute - )} + ${this._config.secondary_info_attribute === "wind_speed" + ? getWind( + this.hass, + stateObj.attributes.wind_speed, + stateObj.attributes.wind_bearing + ) + : html` + ${stateObj.attributes[ + this._config.secondary_info_attribute + ]} + ${getWeatherUnit( + this.hass, + this._config.secondary_info_attribute + )} + `} ` : getSecondaryWeatherAttribute(this.hass, stateObj)} diff --git a/src/types.ts b/src/types.ts index c277a60093..4092ac6c6a 100644 --- a/src/types.ts +++ b/src/types.ts @@ -360,5 +360,7 @@ export type WeatherEntity = HassEntityBase & { temperature: number; humidity?: number; forecast?: ForecastAttribute[]; + wind_speed: string; + wind_bearing: string; }; };