v1.5.5: Added weather data to park overview page

timyboy12345 · Oct 11, 2024 · 0a39dd1 · 0a39dd1
1 parent f0592b2
commit 0a39dd1
Show file tree

Hide file tree

Showing 11 changed files with 418 additions and 3 deletions.
diff --git a/assets/wmo-weather-codes.json b/assets/wmo-weather-codes.json
@@ -0,0 +1,282 @@
+{
+  "0": {
+    "day": {
+      "description": "Sunny",
+      "image": "http://openweathermap.org/img/wn/01d@2x.png"
+    },
+    "night": {
+      "description": "Clear",
+      "image": "http://openweathermap.org/img/wn/01n@2x.png"
+    }
+  },
+  "1": {
+    "day": {
+      "description": "Mainly Sunny",
+      "image": "http://openweathermap.org/img/wn/01d@2x.png"
+    },
+    "night": {
+      "description": "Mainly Clear",
+      "image": "http://openweathermap.org/img/wn/01n@2x.png"
+    }
+  },
+  "2": {
+    "day": {
+      "description": "Partly Cloudy",
+      "image": "http://openweathermap.org/img/wn/02d@2x.png"
+    },
+    "night": {
+      "description": "Partly Cloudy",
+      "image": "http://openweathermap.org/img/wn/02n@2x.png"
+    }
+  },
+  "3": {
+    "day": {
+      "description": "Cloudy",
+      "image": "http://openweathermap.org/img/wn/03d@2x.png"
+    },
+    "night": {
+      "description": "Cloudy",
+      "image": "http://openweathermap.org/img/wn/03n@2x.png"
+    }
+  },
+  "45": {
+    "day": {
+      "description": "Foggy",
+      "image": "http://openweathermap.org/img/wn/50d@2x.png"
+    },
+    "night": {
+      "description": "Foggy",
+      "image": "http://openweathermap.org/img/wn/50n@2x.png"
+    }
+  },
+  "48": {
+    "day": {
+      "description": "Rime Fog",
+      "image": "http://openweathermap.org/img/wn/50d@2x.png"
+    },
+    "night": {
+      "description": "Rime Fog",
+      "image": "http://openweathermap.org/img/wn/50n@2x.png"
+    }
+  },
+  "51": {
+    "day": {
+      "description": "Light Drizzle",
+      "image": "http://openweathermap.org/img/wn/09d@2x.png"
+    },
+    "night": {
+      "description": "Light Drizzle",
+      "image": "http://openweathermap.org/img/wn/09n@2x.png"
+    }
+  },
+  "53": {
+    "day": {
+      "description": "Drizzle",
+      "image": "http://openweathermap.org/img/wn/09d@2x.png"
+    },
+    "night": {
+      "description": "Drizzle",
+      "image": "http://openweathermap.org/img/wn/09n@2x.png"
+    }
+  },
+  "55": {
+    "day": {
+      "description": "Heavy Drizzle",
+      "image": "http://openweathermap.org/img/wn/09d@2x.png"
+    },
+    "night": {
+      "description": "Heavy Drizzle",
+      "image": "http://openweathermap.org/img/wn/09n@2x.png"
+    }
+  },
+  "56": {
+    "day": {
+      "description": "Light Freezing Drizzle",
+      "image": "http://openweathermap.org/img/wn/09d@2x.png"
+    },
+    "night": {
+      "description": "Light Freezing Drizzle",
+      "image": "http://openweathermap.org/img/wn/09n@2x.png"
+    }
+  },
+  "57": {
+    "day": {
+      "description": "Freezing Drizzle",
+      "image": "http://openweathermap.org/img/wn/09d@2x.png"
+    },
+    "night": {
+      "description": "Freezing Drizzle",
+      "image": "http://openweathermap.org/img/wn/09n@2x.png"
+    }
+  },
+  "61": {
+    "day": {
+      "description": "Light Rain",
+      "image": "http://openweathermap.org/img/wn/10d@2x.png"
+    },
+    "night": {
+      "description": "Light Rain",
+      "image": "http://openweathermap.org/img/wn/10n@2x.png"
+    }
+  },
+  "63": {
+    "day": {
+      "description": "Rain",
+      "image": "http://openweathermap.org/img/wn/10d@2x.png"
+    },
+    "night": {
+      "description": "Rain",
+      "image": "http://openweathermap.org/img/wn/10n@2x.png"
+    }
+  },
+  "65": {
+    "day": {
+      "description": "Heavy Rain",
+      "image": "http://openweathermap.org/img/wn/10d@2x.png"
+    },
+    "night": {
+      "description": "Heavy Rain",
+      "image": "http://openweathermap.org/img/wn/10n@2x.png"
+    }
+  },
+  "66": {
+    "day": {
+      "description": "Light Freezing Rain",
+      "image": "http://openweathermap.org/img/wn/10d@2x.png"
+    },
+    "night": {
+      "description": "Light Freezing Rain",
+      "image": "http://openweathermap.org/img/wn/10n@2x.png"
+    }
+  },
+  "67": {
+    "day": {
+      "description": "Freezing Rain",
+      "image": "http://openweathermap.org/img/wn/10d@2x.png"
+    },
+    "night": {
+      "description": "Freezing Rain",
+      "image": "http://openweathermap.org/img/wn/10n@2x.png"
+    }
+  },
+  "71": {
+    "day": {
+      "description": "Light Snow",
+      "image": "http://openweathermap.org/img/wn/13d@2x.png"
+    },
+    "night": {
+      "description": "Light Snow",
+      "image": "http://openweathermap.org/img/wn/13n@2x.png"
+    }
+  },
+  "73": {
+    "day": {
+      "description": "Snow",
+      "image": "http://openweathermap.org/img/wn/13d@2x.png"
+    },
+    "night": {
+      "description": "Snow",
+      "image": "http://openweathermap.org/img/wn/13n@2x.png"
+    }
+  },
+  "75": {
+    "day": {
+      "description": "Heavy Snow",
+      "image": "http://openweathermap.org/img/wn/13d@2x.png"
+    },
+    "night": {
+      "description": "Heavy Snow",
+      "image": "http://openweathermap.org/img/wn/13n@2x.png"
+    }
+  },
+  "77": {
+    "day": {
+      "description": "Snow Grains",
+      "image": "http://openweathermap.org/img/wn/13d@2x.png"
+    },
+    "night": {
+      "description": "Snow Grains",
+      "image": "http://openweathermap.org/img/wn/13n@2x.png"
+    }
+  },
+  "80": {
+    "day": {
+      "description": "Light Showers",
+      "image": "http://openweathermap.org/img/wn/09d@2x.png"
+    },
+    "night": {
+      "description": "Light Showers",
+      "image": "http://openweathermap.org/img/wn/09n@2x.png"
+    }
+  },
+  "81": {
+    "day": {
+      "description": "Showers",
+      "image": "http://openweathermap.org/img/wn/09d@2x.png"
+    },
+    "night": {
+      "description": "Showers",
+      "image": "http://openweathermap.org/img/wn/09n@2x.png"
+    }
+  },
+  "82": {
+    "day": {
+      "description": "Heavy Showers",
+      "image": "http://openweathermap.org/img/wn/09d@2x.png"
+    },
+    "night": {
+      "description": "Heavy Showers",
+      "image": "http://openweathermap.org/img/wn/09n@2x.png"
+    }
+  },
+  "85": {
+    "day": {
+      "description": "Light Snow Showers",
+      "image": "http://openweathermap.org/img/wn/13d@2x.png"
+    },
+    "night": {
+      "description": "Light Snow Showers",
+      "image": "http://openweathermap.org/img/wn/13n@2x.png"
+    }
+  },
+  "86": {
+    "day": {
+      "description": "Snow Showers",
+      "image": "http://openweathermap.org/img/wn/13d@2x.png"
+    },
+    "night": {
+      "description": "Snow Showers",
+      "image": "http://openweathermap.org/img/wn/13n@2x.png"
+    }
+  },
+  "95": {
+    "day": {
+      "description": "Thunderstorm",
+      "image": "http://openweathermap.org/img/wn/11d@2x.png"
+    },
+    "night": {
+      "description": "Thunderstorm",
+      "image": "http://openweathermap.org/img/wn/11n@2x.png"
+    }
+  },
+  "96": {
+    "day": {
+      "description": "Light Thunderstorms With Hail",
+      "image": "http://openweathermap.org/img/wn/11d@2x.png"
+    },
+    "night": {
+      "description": "Light Thunderstorms With Hail",
+      "image": "http://openweathermap.org/img/wn/11n@2x.png"
+    }
+  },
+  "99": {
+    "day": {
+      "description": "Thunderstorm With Hail",
+      "image": "http://openweathermap.org/img/wn/11d@2x.png"
+    },
+    "night": {
+      "description": "Thunderstorm With Hail",
+      "image": "http://openweathermap.org/img/wn/11n@2x.png"
+    }
+  }
+}
diff --git a/locales/de-DE.js b/locales/de-DE.js
@@ -16,6 +16,7 @@ export default {
     shop: 'Einkaufen',
     animals: 'Tiere',
     animal: 'Tier',
+    weather: 'Wetter',
     halloweenEvents: 'Halloween-Aktivitäten',
     halloweenEvent: 'Halloween-Aktivität',
     blog: 'Blog',

diff --git a/locales/en-US.js b/locales/en-US.js
@@ -16,6 +16,7 @@ export default {
     shop: 'Shop',
     animals: 'Animals',
     animal: 'Animal',
+    weather: 'Weather',
     halloweenEvents: 'Halloween Activities',
     halloweenEvent: 'Halloween Activity',
     blog: 'Blog',

diff --git a/locales/es-ES.js b/locales/es-ES.js
@@ -16,6 +16,7 @@ export default {
     shop: 'Tienda',
     animals: 'Animales',
     animal: 'Animal',
+    weather: 'Clima',
     halloweenEvents: 'Actividades de halloween',
     halloweenEvent: 'Actividad de halloween',
     blog: 'Blog',

diff --git a/locales/nl-NL.js b/locales/nl-NL.js
@@ -16,6 +16,7 @@ export default {
     shop: 'Winkel',
     animals: 'Dieren',
     animal: 'Dier',
+    weather: 'Weer',
     halloweenEvents: 'Halloweenactiviteiten',
     halloweenEvent: 'Halloweenactiviteit',
     blog: 'Blog',

diff --git a/nuxt.config.js b/nuxt.config.js
@@ -51,6 +51,8 @@ export default {
   // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
   plugins: [
     '~/plugins/axios',
+    // Weather data from open-meteo.com
+    '~/plugins/open-meteo',
     // https://kuroco.app/docs/faq/how-do-i-set-up-google-analytics-4-in-nuxtjs/
     '~/plugins/gtag',
     { src: '~plugins/markdown', ssr: false },

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "themeparks-nuxtjs",
-  "version": "1.5.4",
+  "version": "1.5.5",
   "private": false,
   "repository": {
     "url": "https://github.com/timyboy12345/Themeparks-NuxtJS"

diff --git a/pages/parks/:id/index.vue b/pages/parks/:id/index.vue
@@ -107,6 +107,14 @@
         </template>
       </card>
 
+      <ClientOnly>
+        <card v-if="park && park.location" :title="$t('general.weather')">
+          <template #content>
+            <weather-list class="-mx-4" :lat="park.location.lat" :lng="park.location.lng" />
+          </template>
+        </card>
+      </ClientOnly>
+
       <AdCard v-if="park" />
 
       <card v-if="park && blogPosts && blogPosts.length > 0" :title="$t('general.blog')" :sub-title="$t('park.allBlogPostsSubtitle')">
@@ -154,9 +162,11 @@ import OpeningHoursList from '~/views/OpeningHoursList'
 import BlogPostList from '~/views/BlogPostList.vue'
 import HalloweenEventList from '~/views/HalloweenEventList.vue'
 import GeneralError from '~/components/GeneralError.vue'
+import WeatherList from '~/views/WeatherList.vue'
 
 export default {
   components: {
+    WeatherList,
     GeneralError,
     HalloweenEventList,
     BlogPostList,

diff --git a/plugins/open-meteo.js b/plugins/open-meteo.js
@@ -0,0 +1,22 @@
+export default function ({ $axios }, inject) {
+  // Example: https://open-meteo.com/en/docs#current=temperature_2m,is_day,weather_code&hourly=temperature_2m,rain,weather_code,is_day&forecast_days=1
+
+  // Create a custom axios instance
+  const openMeteo = $axios.create({
+    baseURL: 'https://api.open-meteo.com/',
+    params: {
+      // latitude: 52.52,
+      // longitude: 13.41,
+      hourly: 'temperature_2m,rain,weather_code,is_day',
+      current: 'temperature_2m,weather_code,is_day',
+      forecast_days: 1,
+    },
+    headers: {
+      common: {
+        Accept: 'application/json, */*',
+      },
+    },
+  })
+
+  inject('openMeteo', openMeteo)
+}