- Possibility to add classes to the cell of symbol, title and time of the events of calendar.

CHANGELOG.md

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

modules/default/calendar/README.md

@@ -86,6 +86,9 @@ config: {
 | `maximumEntries`      | The maximum number of events shown.  Overrides global setting. **Possible values:** `0` - `100`
 | `maximumNumberOfDays` | The maximum number of days in the future.  Overrides global setting
 | `auth`                | The object containing options for authentication against the calendar.
+| `symbolClass`         | Add a class to the cell of symbol.
+| `titleClass`          | Add a class to the title's cell.
+| `timeClass`           | Add a class to the time's cell.
 
 
 #### Calendar authentication options:

modules/default/calendar/calendar.js

@@ -82,6 +82,15 @@ Module.register("calendar", {
 				maximumEntries: calendar.maximumEntries,
 				maximumNumberOfDays: calendar.maximumNumberOfDays
 			};
+			if (calendar.symbolClass === "undefined" || calendar.symbolClass === null) {
+				calendarConfig.symbolClass = "";
+			}
+			if (calendar.titleClass === "undefined" || calendar.titleClass === null) {
+				calendarConfig.titleClass = "";
+			}
+			if (calendar.timeClass === "undefined" || calendar.timeClass === null) {
+				calendarConfig.timeClass = "";
+			}
 
 			// we check user and password here for backwards compatibility with old configs
 			if(calendar.user && calendar.pass) {
@@ -143,7 +152,7 @@ Module.register("calendar", {
 			if(this.config.timeFormat === "dateheaders"){
 				if(lastSeenDate !== dateAsString){
 					var dateRow = document.createElement("tr");
-					dateRow.className = "normal"
+					dateRow.className = "normal";
 					var dateCell = document.createElement("td");
 
 					dateCell.colSpan = "3";
@@ -172,7 +181,9 @@ Module.register("calendar", {
 					symbolWrapper.style.cssText = "color:" + this.colorForUrl(event.url);
 				}
 
-				symbolWrapper.className = "symbol align-right";
+				var symbolClass = this.symbolClassForUrl(event.url);
+				symbolWrapper.className = "symbol align-right " + symbolClass;
+
 				var symbols = this.symbolsForUrl(event.url);
 				if(typeof symbols === "string") {
 					symbols = [symbols];
@@ -189,7 +200,7 @@ Module.register("calendar", {
 				eventWrapper.appendChild(symbolWrapper);
 			}else if(this.config.timeFormat === "dateheaders"){
 				var blankCell = document.createElement("td");
-				blankCell.innerHTML = "   "
+				blankCell.innerHTML = "   ";
 				eventWrapper.appendChild(blankCell);
 			}
 
@@ -210,10 +221,12 @@ Module.register("calendar", {
 
 			titleWrapper.innerHTML = this.titleTransform(event.title) + repeatingCountTitle;
 
+			var titleClass = this.titleClassForUrl(event.url);
+
 			if (!this.config.colored) {
-				titleWrapper.className = "title bright";
+				titleWrapper.className = "title bright " + titleClass;
 			} else {
-				titleWrapper.className = "title";
+				titleWrapper.className = "title " + titleClass;
 			}
 
 			if(this.config.timeFormat === "dateheaders"){
@@ -223,8 +236,10 @@ Module.register("calendar", {
 					titleWrapper.align = "left";
 
 				}else{
+
+					var timeClass = this.timeClassForUrl(event.url);
 					var timeWrapper = document.createElement("td");
-					timeWrapper.className = "time light";
+					timeWrapper.className = "time light " + timeClass;
 					timeWrapper.align = "left";
 					timeWrapper.style.paddingLeft = "2px";
 					var timeFormatString = "";
@@ -343,7 +358,8 @@ Module.register("calendar", {
 				}
 				//timeWrapper.innerHTML += ' - '+ moment(event.startDate,'x').format('lll');
 				//console.log(event);
-				timeWrapper.className = "time light";
+				var timeClass = this.timeClassForUrl(event.url);
+				timeWrapper.className = "time light " + timeClass;
 				eventWrapper.appendChild(timeWrapper);
 			}
 
@@ -472,11 +488,15 @@ Module.register("calendar", {
 			maximumEntries: calendarConfig.maximumEntries || this.config.maximumEntries,
 			maximumNumberOfDays: calendarConfig.maximumNumberOfDays || this.config.maximumNumberOfDays,
 			fetchInterval: this.config.fetchInterval,
+			symbolClass: calendarConfig.symbolClass,
+			titleClass: calendarConfig.titleClass,
+			timeClass: calendarConfig.timeClass,
 			auth: auth
 		});
 	},
 
-	/* symbolsForUrl(url)
+	/**
+	 * symbolsForUrl(url)
 	 * Retrieves the symbols for a specific url.
 	 *
 	 * argument url string - Url to look for.
@@ -487,6 +507,42 @@ Module.register("calendar", {
 		return this.getCalendarProperty(url, "symbol", this.config.defaultSymbol);
 	},
 
+	/**
+	 * symbolClassForUrl(url)
+	 * Retrieves the symbolClass for a specific url.
+	 *
+	 * @param url string - Url to look for.
+	 *
+	 * @returns string
+	 */
+	symbolClassForUrl: function (url) {
+		return this.getCalendarProperty(url, "symbolClass", "");
+	},
+
+	/**
+	 * titleClassForUrl(url)
+	 * Retrieves the titleClass for a specific url.
+	 *
+	 * @param url string - Url to look for.
+	 *
+	 * @returns string
+	 */
+	titleClassForUrl: function (url) {
+		return this.getCalendarProperty(url, "titleClass", "");
+	},
+
+	/**
+	 * timeClassForUrl(url)
+	 * Retrieves the timeClass for a specific url.
+	 *
+	 * @param url string - Url to look for.
+	 *
+	 * @returns string
+	 */
+	timeClassForUrl: function (url) {
+		return this.getCalendarProperty(url, "timeClass", "");
+	},
+
 	/* colorForUrl(url)
 	 * Retrieves the color for a specific url.
 	 *