diff --git a/MMM-Trello.css b/MMM-Trello.css
index e73dc10..f970944 100644
--- a/MMM-Trello.css
+++ b/MMM-Trello.css
@@ -9,3 +9,11 @@
.is-completed {
text-decoration: line-through;
}
+
+.medium {
+ font-size: 20px;
+}
+
+.large {
+ font-size: 30px;
+}
diff --git a/MMM-Trello.js b/MMM-Trello.js
index 25de6a4..3757524 100644
--- a/MMM-Trello.js
+++ b/MMM-Trello.js
@@ -24,7 +24,8 @@ Module.register("MMM-Trello", {
showChecklists: true,
showChecklistTitle: false,
wholeList: false,
- isCompleted: false
+ isCompleted: false,
+ fontSize: "medium" // added fontSize option with default value
},
// Define start sequence.
@@ -109,86 +110,89 @@ Module.register("MMM-Trello", {
};
},
- // Override dom generator.
- getDom: function () {
- var wrapper = document.createElement("div");
+// Override dom generator.
+getDom: function () {
+ var wrapper = document.createElement("div");
- if (this.activeItem >= this.listContent.length) {
- this.activeItem = 0;
- }
+ if (this.activeItem >= this.listContent.length) {
+ this.activeItem = 0;
+ }
- if (this.loaded) {
- if (this.listContent.length === 0) {
- wrapper.innerHTML = this.translate("NO_CARDS");
- wrapper.className = "small dimmed";
- } else {
- var content, card, startat = 0, endat = this.listContent.length - 1;
- if (!this.config.wholeList) {
- startat = this.activeItem;
- endat = this.activeItem;
- }
- for (card = startat; card <= endat; card++) {
- if (this.config.showTitle || this.config.showDueDate) {
- var name = document.createElement("div");
- name.className = "medium light " + (this.config.isCompleted ? "is-completed" : "bright");
+ var fontSizeClass = this.config.fontSize === "large" ? "large" : "medium";
- content = "";
+ if (this.loaded) {
+ if (this.listContent.length === 0) {
+ wrapper.innerHTML = this.translate("NO_CARDS");
+ wrapper.className = fontSizeClass + " dimmed";
+ } else {
+ var content, card, startat = 0, endat = this.listContent.length - 1;
+ if (!this.config.wholeList) {
+ startat = this.activeItem;
+ endat = this.activeItem;
+ }
+ for (card = startat; card <= endat; card++) {
+ if (this.config.showTitle || this.config.showDueDate) {
+ var name = document.createElement("div");
+ name.className = fontSizeClass + " light " + (this.config.isCompleted ? "is-completed" : "bright");
+
+ content = "";
+ if (this.config.showTitle) {
+ content = this.listContent[card].name;
+ }
+
+ if (this.config.showDueDate && this.listContent[card].due) {
if (this.config.showTitle) {
- content = this.listContent[card].name;
+ content += " (" + moment(this.listContent[card].due).fromNow() + ")";
}
-
- if (this.config.showDueDate && this.listContent[card].due) {
- if (this.config.showTitle) {
- content += " (" + moment(this.listContent[card].due).fromNow() + ")";
- }
- else {
- content += moment(this.listContent[card].due).fromNow() + ":";
- }
+ else {
+ content += moment(this.listContent[card].due).fromNow() + ":";
}
+ }
- name.innerHTML = content;
+ name.innerHTML = content;
- wrapper.appendChild(name);
- }
- if(this.config.showDescription){
- var desc = document.createElement("div");
- desc.className = "small light " + (this.config.isCompleted ? "is-completed dimmed" : "");
-
- content = this.listContent[card].desc;
-
- if (this.config.showLineBreaks) {
- var lines = content.split('\n');
- for (var i in lines) {
- var lineElement = document.createElement("div");
- lineElement.innerHTML = lines[i];
- desc.appendChild(lineElement);
- }
- }
- else {
- desc.innerHTML = content;
+ wrapper.appendChild(name);
+ }
+ if(this.config.showDescription){
+ var desc = document.createElement("div");
+ desc.className = fontSizeClass + " light " + (this.config.isCompleted ? "is-completed dimmed" : "");
+
+ content = this.listContent[card].desc;
+
+ if (this.config.showLineBreaks) {
+ var lines = content.split('\n');
+ for (var i in lines) {
+ var lineElement = document.createElement("div");
+ lineElement.innerHTML = lines[i];
+ desc.appendChild(lineElement);
}
- wrapper.appendChild(desc);
}
- if (this.config.showChecklists) {
- var checklistWrapper = document.createElement("div");
- checklistWrapper.className = "checklist-wrapper";
- this.getChecklistDom(checklistWrapper, card);
- wrapper.appendChild(checklistWrapper);
+ else {
+ desc.innerHTML = content;
}
+ wrapper.appendChild(desc);
+ }
+ if (this.config.showChecklists) {
+ var checklistWrapper = document.createElement("div");
+ checklistWrapper.className = "checklist-wrapper";
+ this.getChecklistDom(checklistWrapper, card);
+ wrapper.appendChild(checklistWrapper);
}
}
+ }
+ } else {
+ if (this.error) {
+ wrapper.innerHTML = "Please check your config file, an error occured: " + this.errorMessage;
+ wrapper.className = "xsmall dimmed";
} else {
- if (this.error) {
- wrapper.innerHTML = "Please check your config file, an error occured: " + this.errorMessage;
- wrapper.className = "xsmall dimmed";
- } else {
- wrapper.innerHTML = "";
- wrapper.className = "small dimmed";
- }
+ wrapper.innerHTML = "";
+ wrapper.className = "small dimmed";
}
+ }
+
+ return wrapper;
+},
- return wrapper;
- },
/* getChecklistDom()
* return the dom for all checklists on current card
diff --git a/README.md b/README.md
index c9c636a..7137298 100644
--- a/README.md
+++ b/README.md
@@ -95,6 +95,13 @@ The following properties can be configured:
Possible values: true
or false
Default value: true
+
+
fontSize
large
or medium
+ large
+ showDescription