Fix openweather service

dummy-data/openweather/weather

@@ -0,0 +1,46 @@
+{
+    "coord": {
+      "lon": 4.5833,
+      "lat": 45.75
+    },
+    "weather": [
+      {
+        "id": 804,
+        "main": "Clouds",
+        "description": "overcast clouds",
+        "icon": "04d"
+      }
+    ],
+    "base": "stations",
+    "main": {
+      "temp": 23,
+      "feels_like": 22.3,
+      "temp_min": 21.75,
+      "temp_max": 25.03,
+      "pressure": 1019,
+      "humidity": 36,
+      "sea_level": 1019,
+      "grnd_level": 957
+    },
+    "visibility": 10000,
+    "wind": {
+      "speed": 2.29,
+      "deg": 174,
+      "gust": 6.22
+    },
+    "clouds": {
+      "all": 97
+    },
+    "dt": 1667136939,
+    "sys": {
+      "type": 2,
+      "id": 2005747,
+      "country": "FR",
+      "sunrise": 1667110705,
+      "sunset": 1667147524
+    },
+    "timezone": 3600,
+    "id": 2996943,
+    "name": "Arrondissement de Lyon",
+    "cod": 200
+  }

public/assets/config-demo.yml.dist

@@ -100,6 +100,12 @@ services:
         keywords: "demo"
         url: "#"
         target: "_blank" 
+      - name: "Weather"
+        location: "Lyon"
+        apikey: "xxxxxxxxxxxx" # insert your own API key here. Request one from https://openweathermap.org/api.
+        units: "metric"
+        endpoint: "https://homer-demo-content.netlify.app/openweather/weather"
+        type: "OpenWeather"
   - name: "interesting links"
     icon: "fas fa-solid fa-arrow-up-right-from-square"
     items:

src/components/services/OpenWeather.vue

@@ -23,7 +23,7 @@
                 <p class="title is-4">{{ name }}</p>
                 <p class="subtitle is-6">
                   <span>
-                    {{ temp | tempSuffix(this.item.units) }}
+                    {{ temperature }}
                   </span>
                   <span class="location-time">
                     {{ locationTime }}
@@ -68,15 +68,13 @@ export default {
       }
       return `${this.temp} ${unit}`;
     },
-  },
-  created() {
-    this.fetchWeather();
-  },
-  computed: {
     locationTime: function () {
       return this.calcTime(this.timezoneOffset);
     },
   },
+  created() {
+    this.fetchWeather();
+  },
   methods: {
     fetchWeather: async function () {
       let locationQuery;
@@ -89,7 +87,11 @@ export default {
       }
 
       const apiKey = this.item.apikey || this.item.apiKey;
-      const url = `https://api.openweathermap.org/data/2.5/weather?${locationQuery}&appid=${apiKey}&units=${this.item.units}`;
+
+      let url = `https://api.openweathermap.org/data/2.5/weather?${locationQuery}&appid=${apiKey}&units=${this.item.units}`;
+      if (this.item.endpoint) {
+        url = this.item.endpoint;
+      }
       fetch(url)
         .then((response) => {
           if (!response.ok) {

src/components/services/Ping.vue

@@ -29,9 +29,12 @@ export default {
   },
   methods: {
     fetchStatus: async function () {
-      const method = typeof this.item.method === 'string' ? this.item.method.toUpperCase() : 'HEAD';
+      const method =
+        typeof this.item.method === "string"
+          ? this.item.method.toUpperCase()
+          : "HEAD";
 
-      if (!['GET', 'HEAD', 'OPTION'].includes(method)) {
+      if (!["GET", "HEAD", "OPTION"].includes(method)) {
         console.error(`Ping: ${method} is not a supported HTTP method`);
         return;
       }