Add support for showing wind as barb glyphs

cypress/e2e/weather-bar.cy.ts

@@ -292,6 +292,14 @@ describe('Weather bar', () => {
       'WNW',
       'WNW'
     ];
+    const expectedWindBearings = [
+      253,
+      278,
+      293,
+      359,
+      285,
+      283
+    ];
 
     it('shows wind speed/direction if specified in config', () => {
       cy.configure({
@@ -332,6 +340,21 @@ describe('Weather bar', () => {
         });
     });
 
+    it('shows wind barbs if specified in config', () => {
+      cy.configure({
+        show_wind: 'barb'
+      });
+      cy.get('weather-bar')
+        .shadow()
+        .find('div.axes > div.bar-block div.wind span')
+        .should('have.length', 6)
+        .each((el, i) => {
+          cy.wrap(el).should('have.attr', 'title', `${expectedWindSpeeds[i]} mph ${expectedWindDirections[i]}`)
+            .find('svg').should('exist')
+            .and('have.attr', 'style', `transform:rotate(${expectedWindBearings[i]}deg);`);
+        });
+    });
+
     it('does not show precipitation by default', () => {
       cy.get('weather-bar')
         .shadow()

rollup.config.js

@@ -14,6 +14,7 @@ import { ignoreSelectFiles } from './elements/ignore/select';
 import { ignoreSwitchFiles } from './elements/ignore/switch';
 
 const dev = process.env.ROLLUP_WATCH;
+if (dev) console.log('Development build');
 
 const serveopts = {
   contentBase: ['./dist'],
@@ -42,6 +43,7 @@ const plugins = [
   json(),
   babel({
     exclude: 'node_modules/**',
+    babelHelpers: 'bundled'
   }),
   dev && serve(serveopts),
   !dev && terser(),

src/editor.ts

@@ -157,6 +157,7 @@ export class HourlyWeatherCardEditor extends ScopedRegistryHost(LitElement) impl
         <mwc-list-item value="true">${localize('editor.both')}</mwc-list-item>
         <mwc-list-item value="speed">${localize('editor.speed_only')}</mwc-list-item>
         <mwc-list-item value="direction">${localize('editor.direction_only')}</mwc-list-item>
+        <mwc-list-item value="barb">${localize('editor.barb')}</mwc-list-item>
       </mwc-select>
       <mwc-formfield .label=${localize('editor.show_precipitation_amounts')}>
         <mwc-switch

src/hourly-weather.ts

@@ -375,7 +375,9 @@ export class HourlyWeatherCard extends LitElement {
       wind.push({
         hour: this.formatHour(new Date(fs.datetime), this.hass.locale),
         windSpeed: speed,
-        windDirection: dir
+        windSpeedRawMS: this.getWindSpeedMS(fs.wind_speed, speedUnit),
+        windDirection: dir,
+        windDirectionRaw: fs.wind_bearing
       })
     }
     return wind;
@@ -385,6 +387,22 @@ export class HourlyWeatherCard extends LitElement {
     return this.directions[Math.floor((degrees+11.25)/22.5)];
   }
 
+  private getWindSpeedMS(speed: number, unit: string): number {
+    switch (unit) {
+      case 'm/s':
+        return speed;
+      case 'mph':
+        return speed * 0.44704;
+      case 'km/h':
+        return speed * 0.27777777777778;
+      case 'ft/s':
+        return speed * 0.3048;
+      case 'kt':
+        return speed * 0.51444444444444;
+    }
+    return -1;
+  }
+
   private isForecastDaily(forecast: ForecastSegment[]): boolean {
     const dates = forecast.map(f => new Date(f.datetime).getDate());
     const uniqueDates = new Set(dates);

src/lib/svg-wind-barbs/LICENSE

@@ -0,0 +1,25 @@
+BSD 2-Clause License
+
+Copyright (c) 2021-present, Qulle
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice, this
+   list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright notice,
+   this list of conditions and the following disclaimer in the documentation
+   and/or other materials provided with the distribution.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

src/lib/svg-wind-barbs/MODIFICATIONS

@@ -0,0 +1,7 @@
+This library code is based on the open-source work at https://github.com/qulle/svg-wind-barbs licensed under the BSD
+2-clause license. It has been modified to fit the needs of this project. Specifically:
+
+- The source was refactored into Typescript
+- The exported function now returns a bare SVG `path` rather than a fully-formed SVG with `style` tag
+- Fills and strokes are fully handled in CSS classes rather than hard-coded
+- SVG strings are returned as Lit HTML template results rather than raw strings

src/lib/svg-wind-barbs/index.ts

@@ -0,0 +1,91 @@
+import { svg, TemplateResult } from "lit";
+
+const WIND_BARB_0 = svg`<path class="svg-wb-fill" d="M125,120c2.762,0,5,2.239,5,5c0,2.762-2.238,5-5,5c-2.761,0-5-2.238-5-5C120,122.239,122.239,120,125,120z"/><path fill="none" class="svg-wb-stroke" stroke-width="2" d="M125,115c5.523,0,10,4.477,10,10c0,5.523-4.477,10-10,10 c-5.523,0-10-4.477-10-10C115,119.477,119.477,115,125,115z "/>`;
+const WIND_BARB_2 = svg`<path class="svg-wb" d="M125,112V76 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_5 = svg`<path class="svg-wb" d="M125,112V76 M125,89l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_10 = svg`<path class="svg-wb" d="M125,112V89 M125,89l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_15 = svg`<path class="svg-wb" d="M125,112V89 M125,89l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_20 = svg`<path class="svg-wb" d="M125,112V89 M125,89l14-14 M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_25 = svg`<path class="svg-wb" d="M125,112V79 M125,79l14-14 M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_30 = svg`<path class="svg-wb" d="M125,112V79 M125,79l14-14 M125,90l14-14 M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_35 = svg`<path class="svg-wb" d="M125,112V69 M125,69l14-14 M125,80l14-14 M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_40 = svg`<path class="svg-wb" d="M125,112V69 M125,69l14-14 M125,80l14-14 M125,90l14-14 M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_45 = svg`<path class="svg-wb" d="M125,112V59 M125,59l14-14 M125,70l14-14 M125,80l14-14 M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14 L125,125z"/>`;
+const WIND_BARB_50 = svg`<path class="svg-wb" d="M125,112V76 M125,76h14l-14,14V76z M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_55 = svg`<path class="svg-wb" d="M125,112V76 M125,76h14l-14,14V76z M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_60 = svg`<path class="svg-wb" d="M125,112V76 M125,76h14l-14,14V76z M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_65 = svg`<path class="svg-wb" d="M125,112V66 M125,66h14l-14,14V66z M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_70 = svg`<path class="svg-wb" d="M125,112V66 M125,66h14l-14,14V66z M125,90l14-14 M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_75 = svg`<path class="svg-wb" d="M125,112V56 M125,56h14l-14,14V56z M125,80l14-14 M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_80 = svg`<path class="svg-wb" d="M125,112V56 M125,56h14l-14,14V56z M125,80l14-14 M125,90l14-14 M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_85 = svg`<path class="svg-wb" d="M125,112V46 M125,46h14l-14,14V46z M125,70l14-14 M125,80l14-14 M125,90l14-14 M125,100l7-7 M125,125l7-12.1 h-14L125,125z"/>`;
+const WIND_BARB_90 = svg`<path class="svg-wb" d="M125,112V46 M125,46h14l-14,14V46z M125,70l14-14 M125,80l14-14 M125,90l14-14 M125,100l14-14 M125,125l7-12.1 h-14L125,125z"/>`;
+const WIND_BARB_95 = svg`<path class="svg-wb" d="M125,112V36 M125,36h14l-14,14V36z M125,60l14-14 M125,70l14-14 M125,80l14-14 M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_100 = svg`<path class="svg-wb" d="M125,112V62 M125,62h14l-14,14V62z M125,76h14l-14,14V76z M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_105 = svg`<path class="svg-wb" d="M125,112V62 M125,62h14l-14,14V62z M125,76h14l-14,14V76z M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_110 = svg`<path class="svg-wb" d="M125,112V62 M125,62h14l-14,14V62z M125,76h14l-14,14V76z M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_115 = svg`<path class="svg-wb" d="M125,112V52 M125,52h14l-14,14V52z M125,66h14l-14,14V66z M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14 L125,125z"/>`;
+const WIND_BARB_120 = svg`<path class="svg-wb" d="M125,112V52 M125,52h14l-14,14V52z M125,66h14l-14,14V66z M125,90l14-14 M125,100l14-14 M125,125l7-12.1h-14 L125,125z"/>`;
+const WIND_BARB_125 = svg`<path class="svg-wb" d="M125,112V42 M125,42h14l-14,14V42z M125,56h14l-14,14V56z M125,80l14-14 M125,90l14-14 M125,100l7-7 M125,125 l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_130 = svg`<path class="svg-wb" d="M125,112V42 M125,42h14l-14,14V42z M125,56h14l-14,14V56z M125,80l14-14 M125,90l14-14 M125,100l14-14 M125,125 l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_135 = svg`<path class="svg-wb" d="M125,112V32 M125,32h14l-14,14V32z M125,46h14l-14,14V46z M125,70l14-14 M125,80l14-14 M125,90l14-14 M125,100 l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_140 = svg`<path class="svg-wb" d="M125,112V32 M125,32h14l-14,14V32z M125,46h14l-14,14V46z M125,70l14-14 M125,80l14-14 M125,90l14-14 M125,100 l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_145 = svg`<path class="svg-wb" d="M125,112V22 M125,22h14l-14,14V22z M125,36h14l-14,14V36z M125,60l14-14 M125,70l14-14 M125,80l14-14 M125,90 l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_150 = svg`<path class="svg-wb" d="M125,112V48 M125,48h14l-14,14V48z M125,62h14l-14,14V62z M125,76h14l-14,14V76z M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_155 = svg`<path class="svg-wb" d="M125,112V48 M125,48h14l-14,14V48z M125,62h14l-14,14V62z M125,76h14l-14,14V76z M125,100l7-7 M125,125l7-12.1 h-14L125,125z"/>`;
+const WIND_BARB_160 = svg`<path class="svg-wb" d="M125,112V48 M125,48h14l-14,14V48z M125,62h14l-14,14V62z M125,76h14l-14,14V76z M125,100l14-14 M125,125 l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_165 = svg`<path class="svg-wb" d="M125,112V38 M125,38h14l-14,14V38z M125,52h14l-14,14V52z M125,66h14l-14,14V66z M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_170 = svg`<path class="svg-wb" d="M125,112V38 M125,38h14l-14,14V38z M125,52h14l-14,14V52z M125,66h14l-14,14V66z M125,90l14-14 M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_175 = svg`<path class="svg-wb" d="M125,112V28 M125,28h14l-14,14V28z M125,42h14l-14,14V42z M125,56h14l-14,14V56z M125,80l14-14 M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_180 = svg`<path class="svg-wb" d="M125,112V28 M125,28h14l-14,14V28z M125,42h14l-14,14V42z M125,56h14l-14,14V56z M125,80l14-14 M125,90l14-14 M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_185 = svg`<path class="svg-wb" d="M125,112V18 M125,18h14l-14,14V18z M125,32h14l-14,14V32z M125,46h14l-14,14V46z M125,70l14-14 M125,80l14-14 M125,90l14-14 M125,100l7-7 M125,125l7-12.1h-14L125,125z"/>`;
+const WIND_BARB_190 = svg`<path class="svg-wb" d="M125,112V18 M125,18h14l-14,14V18z M125,32h14l-14,14V32z M125,46h14l-14,14V46z M125,70l14-14 M125,80l14-14 M125,90l14-14 M125,100l14-14 M125,125l7-12.1h-14L125,125z"/>`;
+
+/**
+ * Get SVG barb for the specified wind speed
+ * @param windSpeed Wind speed in meters per second
+ * @returns Lit template of SVG path for barb
+ */
+export function getWindBarbSVG(windSpeed: number): TemplateResult<2> {
+  if (windSpeed >= 0.0 && windSpeed < 1.0) return WIND_BARB_0;
+  else if (windSpeed >= 1.0 && windSpeed < 2.5) return WIND_BARB_2;
+  else if (windSpeed >= 2.5 && windSpeed < 5.0) return WIND_BARB_5;
+  else if (windSpeed >= 5.0 && windSpeed < 7.5) return WIND_BARB_10;
+  else if (windSpeed >= 7.5 && windSpeed < 10.0) return WIND_BARB_15;
+  else if (windSpeed >= 10.0 && windSpeed < 12.5) return WIND_BARB_20;
+  else if (windSpeed >= 12.5 && windSpeed < 15.0) return WIND_BARB_25;
+  else if (windSpeed >= 15.0 && windSpeed < 17.5) return WIND_BARB_30;
+  else if (windSpeed >= 17.5 && windSpeed < 20.0) return WIND_BARB_35;
+  else if (windSpeed >= 20.0 && windSpeed < 22.5) return WIND_BARB_40;
+  else if (windSpeed >= 22.5 && windSpeed < 25.0) return WIND_BARB_45;
+  else if (windSpeed >= 25.0 && windSpeed < 27.5) return WIND_BARB_50;
+  else if (windSpeed >= 27.5 && windSpeed < 30.0) return WIND_BARB_55;
+  else if (windSpeed >= 30.0 && windSpeed < 32.5) return WIND_BARB_60;
+  else if (windSpeed >= 32.5 && windSpeed < 35.0) return WIND_BARB_65;
+  else if (windSpeed >= 35.0 && windSpeed < 37.5) return WIND_BARB_70;
+  else if (windSpeed >= 37.5 && windSpeed < 40.0) return WIND_BARB_75;
+  else if (windSpeed >= 40.0 && windSpeed < 42.5) return WIND_BARB_80;
+  else if (windSpeed >= 42.5 && windSpeed < 45.0) return WIND_BARB_85;
+  else if (windSpeed >= 45.0 && windSpeed < 47.5) return WIND_BARB_90;
+  else if (windSpeed >= 47.5 && windSpeed < 50.0) return WIND_BARB_95;
+  else if (windSpeed >= 50.0 && windSpeed < 52.5) return WIND_BARB_100;
+  else if (windSpeed >= 52.5 && windSpeed < 55.0) return WIND_BARB_105;
+  else if (windSpeed >= 55.0 && windSpeed < 57.5) return WIND_BARB_110;
+  else if (windSpeed >= 57.5 && windSpeed < 60.0) return WIND_BARB_115;
+  else if (windSpeed >= 60.0 && windSpeed < 62.5) return WIND_BARB_120;
+  else if (windSpeed >= 62.5 && windSpeed < 65.0) return WIND_BARB_125;
+  else if (windSpeed >= 65.0 && windSpeed < 67.5) return WIND_BARB_130;
+  else if (windSpeed >= 67.5 && windSpeed < 70.0) return WIND_BARB_135;
+  else if (windSpeed >= 70.0 && windSpeed < 72.5) return WIND_BARB_140;
+  else if (windSpeed >= 72.5 && windSpeed < 75.0) return WIND_BARB_145;
+  else if (windSpeed >= 75.0 && windSpeed < 77.5) return WIND_BARB_150;
+  else if (windSpeed >= 77.5 && windSpeed < 80.0) return WIND_BARB_155;
+  else if (windSpeed >= 80.0 && windSpeed < 82.5) return WIND_BARB_160;
+  else if (windSpeed >= 82.5 && windSpeed < 85.0) return WIND_BARB_165;
+  else if (windSpeed >= 85.0 && windSpeed < 87.5) return WIND_BARB_170;
+  else if (windSpeed >= 87.5 && windSpeed < 90.0) return WIND_BARB_175;
+  else if (windSpeed >= 90.0 && windSpeed < 92.5) return WIND_BARB_180;
+  else if (windSpeed >= 92.5 && windSpeed < 95.0) return WIND_BARB_185;
+  else if (windSpeed >= 95.0 && windSpeed < 97.5) return WIND_BARB_190;
+  else return WIND_BARB_0;
+}

src/localize/languages/de.json

@@ -18,7 +18,8 @@
     "neither": "Weder",
     "both": "Beide",
     "speed_only": "Nur Geschwindigkeit",
-    "direction_only": "Nur Richtung"
+    "direction_only": "Nur Richtung",
+    "barb": "Als Windbarbe"
   },
   "errors": {
     "missing_entity": "Keine Wetter-Entität festgelegt",

src/localize/languages/en.json

@@ -18,7 +18,8 @@
     "neither": "Neither",
     "both": "Both",
     "speed_only": "Speed only",
-    "direction_only": "Direction only"
+    "direction_only": "Direction only",
+    "barb": "As wind barb"
   },
   "errors": {
     "missing_entity": "entity is missing in configuration",

src/localize/languages/es.json

@@ -18,7 +18,8 @@
     "neither": "Ninguno de los dos",
     "both": "Ambas cosas",
     "speed_only": "Solo velocidad",
-    "direction_only": "Solo dirección"
+    "direction_only": "Solo dirección",
+    "barb": "Como púa de viento"
   },
   "errors": {
     "missing_entity": "falta la entidad en la configuración",

src/localize/languages/fr.json

@@ -18,7 +18,8 @@
     "neither": "Ni",
     "both": "Tous les deux",
     "speed_only": "Vitesse uniquement",
-    "direction_only": "Sens uniquement"
+    "direction_only": "Sens uniquement",
+    "barb": "Comme barbillon de vent"
   },
   "errors": {
     "missing_entity": "Entité manquante dans la configuration",

src/localize/languages/it.json

@@ -18,7 +18,8 @@
     "neither": "Né",
     "both": "Tutti e due",
     "speed_only": "Solo velocità",
-    "direction_only": "Solo direzione"
+    "direction_only": "Solo direzione",
+    "barb": "Come una punta di vento"
   },
   "errors": {
     "missing_entity": "entità mancante nella configurazione",
@@ -64,4 +65,4 @@
     "nw": "NO",
     "nnw": "NNO"
   }
-}
+}

src/localize/languages/nb.json

@@ -18,7 +18,8 @@
     "neither": "Ingen",
     "both": "Både",
     "speed_only": "Kun hastighet",
-    "direction_only": "Kun retning"
+    "direction_only": "Kun retning",
+    "barb": "Som vindmothak"
   },
   "errors": {
     "missing_entity": "entity mangler i konfigurasjonen",

src/localize/languages/nl.json

@@ -18,7 +18,8 @@
     "neither": "Geen van beide",
     "both": "Beide",
     "speed_only": "Alleen snelheid",
-    "direction_only": "Alleen richting"
+    "direction_only": "Alleen richting",
+    "barb": "Als windhaak"
   },
   "errors": {
     "missing_entity": "entity ontbreekt in configuratie",
@@ -64,4 +65,4 @@
     "nw": "NW",
     "nnw": "NNW"
   }
-}
+}

src/localize/languages/pl.json

@@ -18,7 +18,8 @@
     "neither": "Żaden",
     "both": "Obie",
     "speed_only": "Tylko prędkość",
-    "direction_only": "Tylko kierunek"
+    "direction_only": "Tylko kierunek",
+    "barb": "Jak kolce wiatru"
   },
   "errors": {
     "missing_entity": "encja nie istnieje",

src/localize/languages/pt-BR.json

@@ -18,7 +18,8 @@
     "neither": "Nenhum",
     "both": "Ambos",
     "speed_only": "Apenas velocidade",
-    "direction_only": "Apenas direção"
+    "direction_only": "Apenas direção",
+    "barb": "Como farpa de vento"
   },
   "errors": {
     "missing_entity": "entidade está faltando na configuração",

src/localize/languages/pt.json

@@ -18,7 +18,8 @@
     "neither": "Nenhum",
     "both": "Ambos",
     "speed_only": "Apenas velocidade",
-    "direction_only": "Apenas direção"
+    "direction_only": "Apenas direção",
+    "barb": "Como farpa de vento"
   },
   "errors": {
     "missing_entity": "A entidade não existe na configuração",
@@ -64,4 +65,4 @@
     "nw": "NO",
     "nnw": "NNO"
   }
-}
+}

src/types.ts

@@ -7,7 +7,7 @@ declare global {
   }
 }
 
-export type WindType = 'true' | 'false' | 'speed' | 'direction';
+export type WindType = 'true' | 'false' | 'speed' | 'direction' | 'barb';
 
 export interface HourlyWeatherCardConfig extends LovelaceCardConfig {
   type: string;
@@ -21,7 +21,7 @@ export interface HourlyWeatherCardConfig extends LovelaceCardConfig {
   colors?: ColorConfig;
   hide_hours?: boolean;
   hide_temperatures?: boolean;
-  show_wind?: WindType; // 'true' | 'false' | 'speed' | 'direction'
+  show_wind?: WindType; // 'true' | 'false' | 'speed' | 'direction' | 'barb'
   show_precipitation_amounts?: boolean;
   label_spacing?: string; // number
   test_gui?: boolean;
@@ -74,7 +74,9 @@ export interface SegmentTemperature {
 export interface SegmentWind {
   hour: string,
   windSpeed: string,
-  windDirection: string
+  windSpeedRawMS: number,
+  windDirection: string,
+  windDirectionRaw: number
 }
 
 export interface SegmentPrecipitation {