Merge branch 'develop' into features/weather_forecast_and_forecast_daily_support

modules/default/weather/README.md

@@ -2,7 +2,7 @@
 
 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 biggest change 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.
 
@@ -71,6 +71,9 @@ The following properties can be configured:
 | `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`
+| `fade`                       | Fade the future events to black. (Gradient) <br><br> **Possible values:** `true` or `false` <br> **Default value:** `true`
+| `fadePoint`                  | Where to start fade? <br><br> **Possible values:** `0` (top of the list) - `1` (bottom of list) <br> **Default value:** `0.25`
+| `maxNumberOfDays`            | How many days of forecast to return. Specified by config.js <br><br> **Possible values:** `1` - `16` <br> **Default value:** `5` (5 days) <br> This value is optional. By default the weatherforecast module will return 5 days.
 
 ### Openweathermap options
 

modules/default/weather/current.njk

@@ -65,9 +65,9 @@
     {% endif %}
 {% else %}
     <div class="dimmed light small">
-        {{ "LOADING" | translate }}
+        {{ "LOADING" | translate | safe }}
     </div>
 {% endif %}
 
-<!-- Unclomment the line below to see the contents of the `current` object. -->
+<!-- Uncomment 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

@@ -1,7 +1,10 @@
 {% if forecast %}
+    {% set numSteps = forecast | calcNumSteps %}
+    {% set currentStep = 0 %}
     <table class="{{ config.tableClass }}">
+        {% set forecast = forecast.slice(0, numSteps) %}
         {% for f in forecast %}
-            <tr {% if config.colored %}class="colored"{% endif %}>
+            <tr {% if config.colored %}class="colored"{% endif %} {% if config.fade %}style="opacity: {{ currentStep | opacity(numSteps) }};"{% 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">
@@ -16,13 +19,14 @@
                     </td>
                 {% endif %}
             </tr>
+            {% set currentStep = currentStep + 1 %}
         {% endfor %}
     </table>
 {% else %}
     <div class="dimmed light small">
-        {{ "LOADING" | translate }}
+        {{ "LOADING" | translate | safe }}
     </div>
 {% endif %}
 
-<!-- Unclomment the line below to see the contents of the `current` object. -->
+<!-- Uncomment 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/weather.js

@@ -33,6 +33,9 @@ Module.register("weather",{
 		decimalSymbol: ".",
 		showIndoorTemperature: false,
 		showIndoorHumidity: false,
+		maxNumberOfDays: 5,
+		fade: true,
+		fadePoint: 0.25, // Start on 1/4th of the list.
 
 		initialLoadDelay: 0, // 0 seconds delay
 		retryDelay: 2500,
@@ -59,7 +62,7 @@ Module.register("weather",{
 		return ["font-awesome.css", "weather-icons.css", "weather.css"];
 	},
 
-	// Return the scripts that are nessecery for the weather module.
+	// Return the scripts that are necessary for the weather module.
 	getScripts: function () {
 		return [
 			"moment.js",
@@ -215,7 +218,28 @@ Module.register("weather",{
 		}.bind(this));
 
 		this.nunjucksEnvironment().addFilter("decimalSymbol", function(value) {
-			return value.replace(/\./g, this.config.decimalSymbol);
+			return value.toString().replace(/\./g, this.config.decimalSymbol);
+		}.bind(this));
+
+		this.nunjucksEnvironment().addFilter("calcNumSteps", function(forecast) {
+			return Math.min(forecast.length, this.config.maxNumberOfDays);
+		}.bind(this));
+
+		this.nunjucksEnvironment().addFilter("opacity", function(currentStep, numSteps) {
+			if (this.config.fade && this.config.fadePoint < 1) {
+				if (this.config.fadePoint < 0) {
+					this.config.fadePoint = 0;
+				}
+				var startingPoint = numSteps * this.config.fadePoint;
+				var numFadesteps = numSteps - startingPoint;
+				if (currentStep >= startingPoint) {
+					return 1 - (currentStep - startingPoint) / numFadesteps;
+				} else {
+					return 1;
+				}
+			} else {
+				return 1;
+			}
 		}.bind(this));
 	}
 });