+ style="display: flex; overflow-x: scroll;">
.weather-period {
- width: 100px;
+ min-width: 100px;
display: flex;
flex-direction: column;
align-items: center;
From 757e5ce6c8e0b41cd800fe733aff82860639e82a Mon Sep 17 00:00:00 2001
From: Lance Edgar
Date: Sat, 8 Jun 2024 19:58:59 -0500
Subject: [PATCH 09/27] Update changelog
---
CHANGELOG.md | 4 ++++
package-lock.json | 4 ++--
package.json | 2 +-
3 files changed, 7 insertions(+), 3 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4161ed0..a7907dd 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
## Unreleased
+## 0.1.4 - 2024-06-08
+### Changed
+- Fix horizontal scroll for main forecast panel.
+
## 0.1.3 - 2024-06-08
### Changed
- Tell user to refresh the page, if access to location has failed.
diff --git a/package-lock.json b/package-lock.json
index a6dee2f..61bad3c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
{
"name": "myweather",
- "version": "0.1.3",
+ "version": "0.1.4",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "myweather",
- "version": "0.1.3",
+ "version": "0.1.4",
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.5.2",
"@fortawesome/free-solid-svg-icons": "^6.5.2",
diff --git a/package.json b/package.json
index 50074e1..ea0e9b9 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "myweather",
- "version": "0.1.3",
+ "version": "0.1.4",
"private": true,
"type": "module",
"scripts": {
From aa12f028a575615b992b41f35d3b5a3d26c27883 Mon Sep 17 00:00:00 2001
From: Lance Edgar
Date: Sat, 8 Jun 2024 20:32:02 -0500
Subject: [PATCH 10/27] Tighten up the forecast period panels a bit
---
src/views/WeatherView.vue | 9 +++++++--
1 file changed, 7 insertions(+), 2 deletions(-)
diff --git a/src/views/WeatherView.vue b/src/views/WeatherView.vue
index 2d46308..2c144a5 100644
--- a/src/views/WeatherView.vue
+++ b/src/views/WeatherView.vue
@@ -50,6 +50,10 @@ export default {
this.coordinates = this.weatherStore.coordinates
},
+ getShortForecast(period) {
+ return period.shortForecast.replace(/Showers And Thunderstorms/g, 'T-storms')
+ },
+
showHourly(period) {
this.$router.push('/hourly')
},
@@ -96,7 +100,7 @@ export default {
-
{{ period.shortForecast }}
+
{{ getShortForecast(period) }}
Hi
@@ -138,7 +142,8 @@ export default {
From 7ed314b5bf2e9eca6426427d971823e8f719810c Mon Sep 17 00:00:00 2001
From: Lance Edgar
Date: Sat, 8 Jun 2024 21:31:18 -0500
Subject: [PATCH 13/27] Update changelog
---
CHANGELOG.md | 4 ++++
package-lock.json | 4 ++--
package.json | 2 +-
3 files changed, 7 insertions(+), 3 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0b9cce9..bf57eca 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
## Unreleased
+## 0.1.6 - 2024-06-08
+### Changed
+- Add proper About page.
+
## 0.1.5 - 2024-06-08
### Changed
- Tighten up the forecast period panels a bit.
diff --git a/package-lock.json b/package-lock.json
index a58ac28..da7cc0b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
{
"name": "myweather",
- "version": "0.1.5",
+ "version": "0.1.6",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "myweather",
- "version": "0.1.5",
+ "version": "0.1.6",
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.5.2",
"@fortawesome/free-solid-svg-icons": "^6.5.2",
diff --git a/package.json b/package.json
index 0f433a3..c12ea00 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "myweather",
- "version": "0.1.5",
+ "version": "0.1.6",
"private": true,
"type": "module",
"scripts": {
From 0710f2238cb3f0239c17f2a8466e9b3a20312044 Mon Sep 17 00:00:00 2001
From: Lance Edgar
Date: Sat, 8 Jun 2024 23:16:29 -0500
Subject: [PATCH 14/27] Add basic support for active weather alerts
yikes nobody should stake their life on how well this works, but it
does seem to basically work..
---
src/router/index.js | 6 ++++
src/stores/weather.js | 67 +++++++++++++++++++++++++++++++++++++--
src/views/AlertsView.vue | 51 +++++++++++++++++++++++++++++
src/views/WeatherView.vue | 12 +++++++
4 files changed, 134 insertions(+), 2 deletions(-)
create mode 100644 src/views/AlertsView.vue
diff --git a/src/router/index.js b/src/router/index.js
index 464d998..7430367 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,6 +1,7 @@
import { createRouter, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
import WeatherView from '../views/WeatherView.vue'
+import AlertsView from '../views/AlertsView.vue'
import HourlyView from '../views/HourlyView.vue'
import EditListView from '../views/EditListView.vue'
@@ -17,6 +18,11 @@ const router = createRouter({
name: 'weather',
component: WeatherView,
},
+ {
+ path: '/alerts',
+ name: 'alerts',
+ component: AlertsView,
+ },
{
path: '/hourly',
name: 'hourly',
diff --git a/src/stores/weather.js b/src/stores/weather.js
index c8c91ab..cf79fcf 100644
--- a/src/stores/weather.js
+++ b/src/stores/weather.js
@@ -10,6 +10,7 @@ const getDefaults = () => {
coordinates,
cityState,
weather: null,
+ alerts: null,
forecast: null,
radarLatestURL: null,
radarLoopURL: null,
@@ -32,14 +33,17 @@ export const useWeatherStore = defineStore('weather', {
this.setForecast(null)
this.radarLatestURL = null
this.radarLoopURL = null
+ this.alerts = null
},
async getWeather() {
if (!this.weather) {
+ let url
+ let response
- const url = `https://api.weather.gov/points/${this.coordinates}`
- const response = await fetch(url)
+ url = `https://api.weather.gov/points/${this.coordinates}`
+ response = await fetch(url)
const weather = await response.json()
if (weather.status == 404) {
throw new Error(`Data not found for ${this.coordinates}`)
@@ -57,6 +61,65 @@ export const useWeatherStore = defineStore('weather', {
this.radarLoopURL = `https://radar.weather.gov/ridge/standard/${station}_loop.gif`
this.setWeather(weather)
+
+ // fetch zone to get its official id
+ url = weather.properties.forecastZone
+ response = await fetch(url)
+ const zone = await response.json()
+
+ // fetch alerts for zone
+ url = `https://api.weather.gov/alerts/active/zone/${zone.properties.id}`
+ response = await fetch(url)
+ const zoneAlerts = await response.json()
+
+ // fetch county to get its official id
+ url = weather.properties.county
+ response = await fetch(url)
+ const county = await response.json()
+
+ // fetch alerts for county
+ url = `https://api.weather.gov/alerts/active/zone/${county.properties.id}`
+ response = await fetch(url)
+ const countyAlerts = await response.json()
+
+ const newAlerts = {}
+
+ // use latest timestamp from either zone or county
+ newAlerts.updated = zoneAlerts.updated
+ if (countyAlerts.updated > zoneAlerts.updated) {
+ newAlerts.updated = countyAlerts.updated
+ }
+
+ // collect all alert "features" but de-duplicate them
+ newAlerts.features = {}
+ for (let feature of zoneAlerts.features) {
+ newAlerts.features[feature.properties.id] = feature
+ }
+ for (let feature of countyAlerts.features) {
+ newAlerts.features[feature.properties.id] = feature
+ }
+ newAlerts.features = Object.values(newAlerts.features)
+
+ // put "likely" before "possible" alerts
+ newAlerts.features.sort((a, b) => {
+
+ if (a.properties.certainty == 'Likely' && b.properties.certainty == 'Possible') {
+ return -1
+ }
+ if (a.properties.certainty == 'Possible' && b.properties.certainty == 'Likely') {
+ return 1
+ }
+
+ // if (a.properties.certainty == b.properties.certainty) {
+ // return 0
+ // }
+
+ // TODO: what else should this do?
+ return 0
+ })
+
+ // we have our final alerts
+ this.alerts = newAlerts
}
return this.weather
diff --git a/src/views/AlertsView.vue b/src/views/AlertsView.vue
new file mode 100644
index 0000000..a397565
--- /dev/null
+++ b/src/views/AlertsView.vue
@@ -0,0 +1,51 @@
+
+
+
+
+
+
+
+
+ Back
+
+
+ {{ weatherStore.cityState }}
+ Alerts
+
+
+
+
+
+ {{ feature.properties.event }} ({{ feature.properties.severity }}, {{ feature.properties.certainty }})
+
+
+
+
{{ feature.properties.headline }}
+
{{ feature.properties.description }}
+
+
+
+
+
diff --git a/src/views/WeatherView.vue b/src/views/WeatherView.vue
index 2c144a5..4d30a98 100644
--- a/src/views/WeatherView.vue
+++ b/src/views/WeatherView.vue
@@ -10,6 +10,7 @@ export default {
data() {
return {
coordinates: null,
+ alerts: null,
}
},
@@ -48,6 +49,7 @@ export default {
const forecast = await this.weatherStore.getForecast()
this.coordinates = this.weatherStore.coordinates
+ this.alerts = this.weatherStore.alerts
},
getShortForecast(period) {
@@ -77,6 +79,16 @@ export default {
+
+
+ Watches In Effect
+ Updated {{ new Date(alerts.updated).toLocaleTimeString('en-US', {timeStyle: 'short'}) }}
+
+
+