Add getHeader functionlity..

CHANGELOG.md

@@ -2,13 +2,19 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+
+## [2.1.0] - Unreleased
+
+### Added
+- Method to overwrite the module's header. [See documentation.](https://github.com/MichMich/MagicMirror/tree/develop/modules#getheader) 
+
 ## [2.0.5] - 2016-09-20
 
 ### Added
 - Added ability to remove tags from the beginning or end of newsfeed items in 'newsfeed.js'.
 - Added ability to define "the day after tomorrow" for calendar events (Definition for German and Dutch already included).
 - Added CII Badge (we are compliant with the CII Best Practices)
-- Add support for doing http basic auth when loading calendars 
+- Add support for doing http basic auth when loading calendars
 - Add the abilty to turn off and on the date display in the Clock Module
 
 ### Fixed

js/main.js

@@ -40,6 +40,7 @@ var MM = (function() {
 				if (typeof module.data.header !== "undefined" && module.data.header !== "") {
 					var moduleHeader = document.createElement("header");
 					moduleHeader.innerHTML = module.data.header;
+					moduleHeader.className = "module-header";
 					dom.appendChild(moduleHeader);
 				}
 
@@ -94,26 +95,27 @@ var MM = (function() {
 	 */
 	var updateDom = function(module, speed) {
 		var newContent = module.getDom();
+		var newHeader = module.getHeader();
 
 		if (!module.hidden) {
 
-			if (!moduleNeedsUpdate(module, newContent)) {
+			if (!moduleNeedsUpdate(module, newHeader, newContent)) {
 				return;
 			}
 
 			if (!speed) {
-				updateModuleContent(module, newContent);
+				updateModuleContent(module, newHeader, newContent);
 				return;
 			}
 
 			hideModule(module, speed / 2, function() {
-				updateModuleContent(module, newContent);
+				updateModuleContent(module, newHeader, newContent);
 				if (!module.hidden) {
 					showModule(module, speed / 2);
 				}
 			});
 		} else {
-			updateModuleContent(module, newContent);
+			updateModuleContent(module, newHeader, newContent);
 		}
 	};
 
@@ -125,14 +127,23 @@ var MM = (function() {
 	 *
 	 * return bool - Does the module need an update?
 	 */
-	var moduleNeedsUpdate = function(module, newContent) {
+	var moduleNeedsUpdate = function(module, newHeader, newContent) {
 		var moduleWrapper = document.getElementById(module.identifier);
-		var contentWrapper = moduleWrapper.getElementsByClassName("module-content")[0];
+		var contentWrapper = moduleWrapper.getElementsByClassName("module-content");
+		var headerWrapper = moduleWrapper.getElementsByClassName("module-header");
 
-		var tempWrapper = document.createElement("div");
+		var headerNeedsUpdate = false;
-		tempWrapper.appendChild(newContent);
+		var contentNeedsUpdate = false;
 
-		return tempWrapper.innerHTML !== contentWrapper.innerHTML;
+		if (headerWrapper.length > 0) {
+			headerNeedsUpdate = newHeader !== headerWrapper.innerHTML;
+		}
+
+		var tempContentWrapper = document.createElement("div");
+		tempContentWrapper.appendChild(newContent);
+		contentNeedsUpdate = tempContentWrapper.innerHTML !== contentWrapper[0].innerHTML;
+
+		return headerNeedsUpdate || contentNeedsUpdate;
 	};
 
 	/* moduleNeedsUpdate(module, newContent)
@@ -141,12 +152,19 @@ var MM = (function() {
 	 * argument module Module - The module to check.
 	 * argument newContent Domobject - The new content that is generated.
 	 */
-	var updateModuleContent = function(module, content) {
+	var updateModuleContent = function(module, newHeader, newContent) {
 		var moduleWrapper = document.getElementById(module.identifier);
-		var contentWrapper = moduleWrapper.getElementsByClassName("module-content")[0];
+		var headerWrapper = moduleWrapper.getElementsByClassName("module-header");
+		var contentWrapper = moduleWrapper.getElementsByClassName("module-content");
+
+		contentWrapper[0].innerHTML = "";
+		contentWrapper[0].appendChild(newContent);
+
+		if( headerWrapper.length > 0 && newHeader) {
+			headerWrapper[0].innerHTML = newHeader;
+		}
+
 
-		contentWrapper.innerHTML = "";
-		contentWrapper.appendChild(content);
 	};
 
 	/* hideModule(module, speed, callback)

js/module.js

@@ -84,6 +84,17 @@ var Module = Class.extend({
 		return div;
 	},
 
+	/* getHeader()
+	 * This method generates the header string which needs to be displayed if a user has a header configured for this module.
+	 * This method is called by the Magic Mirror core, but only if the user has configured a default header for the module.
+	 * This method needs to be subclassed if the module wants to display modified headers on the mirror.
+	 *
+	 * return string - The header to display above the header.
+	 */
+	getHeader: function() {
+		return this.data.header;
+	},
+
 	/* notificationReceived(notification, payload, sender)
 	 * This method is called when a notification arrives.
 	 * This method is called by the Magic Mirror core.

modules/README.md

@@ -166,6 +166,23 @@ getDom: function() {
 
 ````
 
+####`getHeader()`
+**Should return:** String
+
+Whenever the MagicMirror needs to update the information on screen (because it starts, or because your module asked a refresh using `this.updateDom()`), the system calls the getHeader method to retrieve the module's header. This method should therefor return a string. If this method is not subclassed, this function will return the user's configured header.
+
+If you want to use the original user's configured header, reference `this.data.header`.
+
+**NOTE:** If the user did not confiugure a default header, no header will be displayed and thus this method will not be called.
+
+**Example:**
+````javascript
+getHeader: function() {
+	return this.data.header + ' Foo Bar';
+}
+
+````
+
 ####`notificationReceived(notification, payload, sender)`
 
 That MagicMirror core has the ability to send notifications to modules. Or even better: the modules have the possibility to send notifications to other modules. When this module is called, it has 3 arguments: