Weather refactoring

CHANGELOG.md

@@ -7,7 +7,10 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 
 ## [2.6.0] - Unreleased
 
-*This release is scheduled to be released on 2018-10-01.*
+*This release is scheduled to be released on 2019-01-01.*
+
+### Experimental
+- New default [module weather](modules/default/weather).
 
 ### Added
 - Possibility to add classes to the cell of symbol, title and time of the events of calendar.

modules/default/defaultmodules.js

@@ -16,7 +16,8 @@ var defaultModules = [
 	"helloworld",
 	"newsfeed",
 	"weatherforecast",
-	"updatenotification"
+	"updatenotification",
+	"weather"
 ];
 
 /*************** DO NOT EDIT THE LINE BELOW ***************/

modules/default/weather/README.md

@@ -0,0 +1,94 @@
+# Weather Module
+
+This module is aimed to be the replacement for the current `currentweather` and `weatherforcast` modules. The module will be configurable to be used as a current weather view, or to show the forecast. This way the module can be used twice to fullfil both purposes. 
+
+The biggest cange is the use of weather providers. This way we are not bound to one API source. And users can choose which API they want to use as their source.
+
+The module is in a very early stage, and needs a lot of work. It's API isn't set in stone, so keep that in mind when you want to contribute.
+
+## Example
+
+![Current Weather Screenshot](current.png) ![Weather Forecast Screenshot](forecast.png)
+
+## Usage
+
+To use this module, add it to the modules array in the `config/config.js` file:
+
+````javascript
+modules: [
+	{
+		module: "weather",
+		position: "top_right",
+		config: {
+			// See 'Configuration options' for more information.
+			type: 'current'
+		}
+	}
+]
+````
+
+## Configuration options
+
+The following properties can be configured:
+
+### General options
+
+| Option                       | Description
+| ---------------------------- | -----------
+| `weatherProvider`            | Which weather provider should be used. <br><br> **Possible values:** `openweathermap` and `darksky` <br> **Default value:** `openweathermap`
+| `type`                       | Which type of weather data should be displayed. <br><br> **Possible values:** `current` and `forecast` <br> **Default value:** `current`
+| `units`                      | What units to use. Specified by config.js <br><br> **Possible values:** `config.units` = Specified by config.js, `default` = Kelvin, `metric` = Celsius, `imperial` =Fahrenheit <br> **Default value:** `config.units`
+| `roundTemp`                  | Round temperature value to nearest integer. <br><br> **Possible values:** `true` (round to integer) or `false` (display exact value with decimal point) <br> **Default value:** `false`
+| `degreeLabel`                | Show the degree label for your chosen units (Metric = C, Imperial = F, Kelvins = K). <br><br> **Possible values:** `true` or `false` <br> **Default value:** `false`
+| `updateInterval`             | How often does the content needs to be fetched? (Milliseconds) <br><br> **Possible values:** `1000` - `86400000` <br> **Default value:** `600000` (10 minutes)
+| `animationSpeed`             | Speed of the update animation. (Milliseconds) <br><br> **Possible values:**`0` - `5000` <br> **Default value:** `1000` (1 second)
+| `timeFormat`                 | Use 12 or 24 hour format. <br><br> **Possible values:** `12` or `24` <br> **Default value:** uses value of _config.timeFormat_
+| `showPeriod`                 | Show the period (am/pm) with 12 hour format <br><br> **Possible values:** `true` or `false` <br> **Default value:** `true`
+| `showPeriodUpper`	           | Show the period (AM/PM) with 12 hour format as uppercase <br><br> **Possible values:** `true` or `false` <br> **Default value:** `false`
+| `lang`                       | The language of the days. <br><br> **Possible values:** `en`, `nl`, `ru`, etc ... <br> **Default value:** uses value of _config.language_
+| `decimalSymbol`              | The decimal symbol to use.<br><br> **Possible values:** `.`, `,` or any other symbol.<br> **Default value:** `.`
+| `initialLoadDelay`           | The initial delay before loading. If you have multiple modules that use the same API key, you might want to delay one of the requests. (Milliseconds) <br><br> **Possible values:** `1000` - `5000` <br> **Default value:**  `0`
+| `retryDelay`                 | The delay before retrying after a request failure. (Milliseconds) <br><br> **Possible values:** `1000` - `60000` <br> **Default value:**  `2500`
+| `appendLocationNameToHeader` | If set to `true`, the returned location name will be appended to the header of the module, if the header is enabled. This is mainly intresting when using calender based weather. <br><br> **Default value:**  `true`
+| `calendarClass`              | The class for the calender module to base the event based weather information on. <br><br> **Default value:**  `'calendar'`
+
+#### Current weather options
+
+| Option                       | Description
+| ---------------------------- | -----------
+| `onlyTemp`                   | Show only current Temperature and weather icon without windspeed, sunset, sunrise time and feels like. <br><br> **Possible values:** `true` or `false` <br> **Default value:** `false`
+| `useBeaufort`                | Pick between using the Beaufort scale for wind speed or using the default units. <br><br> **Possible values:** `true` or `false` <br> **Default value:** `true`
+| `showWindDirection`          | Show the wind direction next to the wind speed. <br><br> **Possible values:** `true` or `false` <br> **Default value:** `true`
+| `showWindDirectionAsArrow`   | Show the wind direction as an arrow instead of abbreviation <br><br> **Possible values:** `true` or `false` <br> **Default value:** `false`
+| `showHumidity`               | Show the current humidity <br><br> **Possible values:** `true` or `false` <br> **Default value:** `false`
+| `showIndoorTemperature`      | If you have another module that emits the `INDOOR_TEMPERATURE` notification, the indoor temperature will be displayed <br> **Default value:** `false`
+| `showIndoorHumidity`         | If you have another module that emits the `INDOOR_HUMIDITY` notification, the indoor humidity will be displayed <br> **Default value:** `false`
+
+#### Weather forecast options
+
+| Option                       | Description
+| ---------------------------- | -----------
+| `tableClass`                 | The class for the forecast table. <br><br> **Default value:**  `'small'`
+| `colored`                    | If set to `true`, the min and max temperature are color coded. <br><br> **Default value:**  `false`
+| `showRainAmount`             | Show the amount of rain in the forecast <br><br> **Possible values:** `true` or `false` <br> **Default value:** `true`
+
+### Openweathermap options
+
+| Option                       | Description
+| ---------------------------- | -----------
+| `apiVersion`                 | The OpenWeatherMap API version to use. <br><br> **Default value:**  `2.5`
+| `apiBase`                    | The OpenWeatherMap base URL. <br><br> **Default value:**  `'http://api.openweathermap.org/data/'`
+| `weatherEndpoint`	           | The OpenWeatherMap API endPoint. <br><br> **Possible values:** `/weather` or `/forecast/daily` <br> **Default value:**  `'/weather'`
+| `locationID`                 | Location ID from [OpenWeatherMap](https://openweathermap.org/find) **This will override anything you put in location.** <br> Leave blank if you want to use location. <br> **Example:** `1234567` <br> **Default value:** `false` <br><br> **Note:** When the `location` and `locationID` are both not set, the location will be based on the information provided by the calendar module. The first upcoming event with location data will be used.
+| `location`                   | The location used for weather information. <br><br> **Example:** `'Amsterdam,Netherlands'` <br> **Default value:** `false` <br><br> **Note:** When the `location` and `locationID` are both not set, the location will be based on the information provided by the calendar module. The first upcoming event with location data will be used.
+| `apiKey`                      | The [OpenWeatherMap](https://home.openweathermap.org) API key, which can be obtained by creating an OpenWeatherMap account. <br><br>  This value is **REQUIRED**
+
+### Darksky options
+
+| Option                       | Description
+| ---------------------------- | -----------
+| `apiBase`                    | The DarkSky base URL. The darksky api has disabled [cors](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS), therefore a proxy is required. <br><br> **Possible value:**  `'https://cors-anywhere.herokuapp.com/https://api.darksky.net'` <br>  This value is **REQUIRED**
+| `weatherEndpoint`	           | The DarkSky API endPoint. <br><br> **Possible values:** `/forecast` <br>  This value is **REQUIRED**
+| `apiKey`                     | The [DarkSky](https://darksky.net/dev/register) API key, which can be obtained by creating an DarkSky account. <br><br>  This value is **REQUIRED**
+| `lat`                        | The geo coordinate latitude. <br><br>  This value is **REQUIRED**
+| `lon`                        | The geo coordinate longitude. <br><br>  This value is **REQUIRED**

modules/default/weather/current.njk

@@ -0,0 +1,61 @@
+{% if current %}
+    {% if not config.onlyTemp %}
+        <div class="normal medium">
+            <span class="wi wi-strong-wind dimmed"></span>
+            <span>
+                {% if config.useBeaufort %}
+                    {{current.beaufortWindSpeed() | round}}
+                {% else %}
+                    {{current.windSpeed | round}}
+                {% endif %}
+
+                {% if config.showWindDirection %}
+                    <sup> 
+                        {% if config.showWindDirectionAsArrow %}
+                            <i class="fa fa-long-arrow-up" style="transform:rotate({{current.windDirection}}deg);"></i>    
+                        {% else %}
+                            {{current.cardinalWindDirection() | translate}}
+                        {% endif %}
+                        &nbsp;
+                    </sup>
+                {% endif %}
+            </span>
+            {% if config.showHumidity and current.humidity %}
+                <span>{{ current.humidity }}</span><sup>&nbsp;<i class="wi wi-humidity humidityIcon"></i></sup>
+            {% endif %}
+            <span class="wi dimmed wi-{{current.nextSunAction()}}"></span>
+            <span>
+                {% if current.nextSunAction() == "sunset" %}
+                    {{current.sunset | formatTime}}
+                {% else %}
+                    {{current.sunrise | formatTime}}
+                {% endif %}
+            </span>
+        </div>
+    {% endif %}
+    <div class="large light">
+        <span class="wi weathericon wi-{{current.weatherType}}"></span>
+        <span class="bright">
+            {{current.temperature | roundValue | unit("temperature")}}
+        </span>
+        {% if config.showIndoorTemperature and indoor.temperature %}
+            <span class="fa fa-home"></span>
+            <span class="bright">
+                {{indoor.temperature | roundValue | unit("temperature")}}
+            </span>
+        {% endif %}
+        {% if config.showIndoorHumidity and indoor.humidity %}
+            <span class="fa fa-tint"></span>
+            <span class="bright">
+                {{indoor.humidity | roundValue}}%
+            </span>
+        {% endif %}
+    </div>
+{% else %}
+    <div class="dimmed light small">
+        {{"LOADING" | translate}}
+    </div>
+{% endif %}
+
+<!-- Unclomment the line below to see the contents of the `current` object. -->
+<!-- <div style="word-wrap:break-word" class="xsmall dimmed">{{current | dump}}</div> -->

modules/default/weather/forecast.njk

@@ -0,0 +1,26 @@
+{% if forecast %}
+    <table class="{{config.tableClass}}">
+        {% for f in forecast %}
+            <tr {% if config.colored %}class="colored"{% endif %}>
+                <td class="day">{{f.date.format('ddd')}}</td>
+                <td class="bright weather-icon"><span class="wi weathericon wi-{{f.weatherType}}"></span></td>
+                <td class="align-right bright max-temp">
+                    {{f.maxTemperature | roundValue | unit("temperature")}}
+                </td>
+                <td class="align-right min-temp">
+                    {{f.minTemperature | roundValue | unit("temperature")}}
+                </td>
+                {% if config.showRainAmount %}
+                    <td class="align-right bright rain">
+                        {{f.rain | formatRain}}
+                    </td>
+                {% endif %}
+            </tr>
+        {% endfor %}
+    </table>
+{% else %}
+    {{"LOADING" | translate}}
+{% endif %}
+
+<!-- Unclomment the line below to see the contents of the `current` object. -->
+<!-- <div style="word-wrap:break-word" class="xsmall dimmed">{{forecast | dump}}</div> -->

modules/default/weather/providers/darksky.js

@@ -0,0 +1,102 @@
+/* global WeatherProvider, WeatherDay */
+
+/* Magic Mirror
+ * Module: Weather
+ * Provider: Dark Sky
+ *
+ * By Nicholas Hubbard https://github.com/nhubbard
+ * MIT Licensed
+ *
+ * This class is a provider for Dark Sky.
+ */
+WeatherProvider.register("darksky", {
+	// Set the name of the provider.
+	// Not strictly required, but helps for debugging.
+	providerName: "Dark Sky",
+
+	fetchCurrentWeather: function() {
+		this.fetchData(this.getUrl())
+			.then(data => {
+				if(!data || !data.currently || typeof data.currently.temperature === "undefined") {
+					// No usable data?
+					return;
+				}
+
+				var currentWeather = this.generateWeatherDayFromCurrentWeather(data);
+				this.setCurrentWeather(currentWeather);
+			}).catch(function(request) {
+				Log.error("Could not load data ... ", request);
+			});
+	},
+
+	fetchWeatherForecast: function() {
+		this.fetchData(this.getUrl())
+			.then(data => {
+				if(!data || !data.daily || !data.daily.data.length) {
+					// No usable data?
+					return;
+				}
+
+				var forecast = this.generateWeatherObjectsFromForecast(data.daily.data);
+				this.setWeatherForecast(forecast);
+			}).catch(function(request) {
+				Log.error("Could not load data ... ", request);
+			});
+	},
+
+	// Create a URL from the config and base URL.
+	getUrl: function() {
+		return `${this.config.apiBase}${this.config.weatherEndpoint}/${this.config.apiKey}/${this.config.lat},${this.config.lon}`;
+	},
+
+	// Implement WeatherDay generator.
+	generateWeatherDayFromCurrentWeather: function(currentWeatherData) {
+		var currentWeather = new WeatherObject();
+
+		currentWeather.date = moment();
+		currentWeather.humidity = parseFloat(currentWeatherData.currently.humidity);
+		currentWeather.temperature = parseFloat(currentWeatherData.currently.temperature);
+		currentWeather.windSpeed = parseFloat(currentWeatherData.currently.windSpeed);
+		currentWeather.windDirection = currentWeatherData.currently.windBearing;
+		currentWeather.weatherType = this.convertWeatherType(currentWeatherData.currently.icon);
+		currentWeather.sunrise = moment(currentWeatherData.daily.data[0].sunriseTime, "X");
+		currentWeather.sunset = moment(currentWeatherData.daily.data[0].sunsetTime, "X");
+
+		return currentWeather;
+	},
+
+	generateWeatherObjectsFromForecast: function(forecasts) {
+		var days = [];
+
+		for (var forecast of forecasts) {
+			var weather = new WeatherObject();
+
+			weather.date = moment(forecast.time, "X");
+			weather.minTemperature = forecast.temperatureMin;
+			weather.maxTemperature = forecast.temperatureMax;
+			weather.weatherType = this.convertWeatherType(forecast.icon);
+			weather.rain = forecast.precipAccumulation;
+
+			days.push(weather)
+		}
+
+		return days
+	},
+
+	// Map icons from Dark Sky to our icons.
+	convertWeatherType: function(weatherType) {
+		var weatherTypes = {
+			"clear-day": "day-sunny",
+			"clear-night": "night-clear",
+			"rain": "rain",
+			"snow": "snow",
+			"sleet": "snow",
+			"wind": "wind",
+			"fog": "fog",
+			"cloudy": "cloudy",
+			"partly-cloudy-day": "day-cloudy",
+			"partly-cloudy-night": "night-cloudy"
+		};
+		return weatherTypes.hasOwnProperty(weatherType) ? weatherTypes[weatherType] : null;
+	}
+});