From 399e1710836420617d6a00725d251f7bc800d2b2 Mon Sep 17 00:00:00 2001
From: Andrew McOlash <amcolash@gmail.com>
Date: Wed, 16 Jan 2019 22:51:44 -0800
Subject: [PATCH] Add in cutting of long vertical titles

---
 CHANGELOG.md                         |  2 +-
 modules/default/calendar/README.md   |  1 +
 modules/default/calendar/calendar.js | 15 ++++++++++++---
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0a1c4693..2dbc2675 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,7 +14,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 ### Added
 - Italian translation for "Feels"
 - Disabled the screensaver on raspbian with installation script 
-
+- Added option to truncate the number of vertical lines a calendar item can span if `wrapEvents` is enabled.
 
 ### Updated
 - Bumped the Electron dependency to v3.0.13 to support the most recent Raspbian. [#1500](https://github.com/MichMich/MagicMirror/issues/1500)
diff --git a/modules/default/calendar/README.md b/modules/default/calendar/README.md
index b272a2d2..e0d727c8 100755
--- a/modules/default/calendar/README.md
+++ b/modules/default/calendar/README.md
@@ -32,6 +32,7 @@ The following properties can be configured:
 | `defaultSymbol`              | The default symbol. <br><br> **Possible values:** See [Font Awsome](http://fontawesome.io/icons/) website. <br> **Default value:** `calendar`
 | `maxTitleLength`             | The maximum title length. <br><br> **Possible values:** `10` - `50` <br> **Default value:** `25`
 | `wrapEvents`                 | Wrap event titles to multiple lines. Breaks lines at the length defined by `maxTitleLength`. <br><br> **Possible values:** `true` or `false` <br> **Default value:** `false`
+| `maxTitleLines`              | The maximum number of lines a title will wrap vertically before being cut (Only enabled if `wrapEvents` is also enabled). <br><br> **Possible values:** `0` - `10` <br> **Default value:** `3`
 | `fetchInterval`              | How often does the content needs to be fetched? (Milliseconds) <br><br> **Possible values:** `1000` - `86400000` <br> **Default value:** `300000` (5 minutes)
 | `animationSpeed`             | Speed of the update animation. (Milliseconds) <br><br> **Possible values:** `0` - `5000` <br> **Default value:** `2000` (2 seconds)
 | `fade`                       | Fade the future events to black. (Gradient) <br><br> **Possible values:** `true` or `false` <br> **Default value:** `true`
diff --git a/modules/default/calendar/calendar.js b/modules/default/calendar/calendar.js
index d9cc8291..f2017a6c 100755
--- a/modules/default/calendar/calendar.js
+++ b/modules/default/calendar/calendar.js
@@ -19,6 +19,7 @@ Module.register("calendar", {
 		defaultRepeatingCountTitle: "",
 		maxTitleLength: 25,
 		wrapEvents: false, // wrap events to multiple lines breaking at maxTitleLength
+		maxTitleLines: 3,
 		fetchInterval: 5 * 60 * 1000, // Update every 5 minutes.
 		animationSpeed: 2000,
 		fade: true,
@@ -220,7 +221,7 @@ Module.register("calendar", {
 			var titleWrapper = document.createElement("td"),
 				repeatingCountTitle = "";
 
-			if (this.config.displayRepeatingCountTitle && event.firstYear !== undefined) {
+				if (this.config.displayRepeatingCountTitle && event.firstYear !== undefined) {
 
 				repeatingCountTitle = this.countTitleForUrl(event.url);
 
@@ -584,9 +585,10 @@ Module.register("calendar", {
 	 * @param {string} string Text string to shorten
 	 * @param {number} maxLength The max length of the string
 	 * @param {boolean} wrapEvents Wrap the text after the line has reached maxLength
+	 * @param {number} maxTitleLines The max number of vertical lines before cutting event title
 	 * @returns {string} The shortened string
 	 */
-	shorten: function (string, maxLength, wrapEvents) {
+	shorten: function (string, maxLength, wrapEvents, maxTitleLines) {
 		if (typeof string !== "string") {
 			return "";
 		}
@@ -595,12 +597,19 @@ Module.register("calendar", {
 			var temp = "";
 			var currentLine = "";
 			var words = string.split(" ");
+			var line = 0;
 
 			for (var i = 0; i < words.length; i++) {
 				var word = words[i];
 				if (currentLine.length + word.length < (typeof maxLength === "number" ? maxLength : 25) - 1) { // max - 1 to account for a space
 					currentLine += (word + " ");
 				} else {
+					line++;
+					if (line > maxTitleLines - 1) {
+						if (i < words.length) currentLine += "&hellip;";
+						break;
+					}
+
 					if (currentLine.length > 0) {
 						temp += (currentLine + "<br>" + word + " ");
 					} else {
@@ -651,7 +660,7 @@ Module.register("calendar", {
 			title = title.replace(needle, replacement);
 		}
 
-		title = this.shorten(title, this.config.maxTitleLength, this.config.wrapEvents);
+		title = this.shorten(title, this.config.maxTitleLength, this.config.wrapEvents, this.config.maxTitleLines);
 		return title;
 	},