diff --git a/MMM-JsonTable.js b/MMM-JsonTable.js index 74b0516..9f8603b 100644 --- a/MMM-JsonTable.js +++ b/MMM-JsonTable.js @@ -93,15 +93,31 @@ Module.register("MMM-JsonTable", { const cell = document.createElement("td"); let valueToDisplay = ""; + let cellValue = ""; + + if (value.constructor === Object) { + if ("value" in value) { + cellValue = value.value; + } else { + cellValue = ""; + } + + if ("color" in value) { + cell.style.color = value.color; + } + } else { + cellValue = value; + } + if (key === "icon") { - cell.classList.add("fa", value); + cell.classList.add("fa", cellValue); } else if (this.config.tryFormatDate) { - valueToDisplay = this.getFormattedValue(value); + valueToDisplay = this.getFormattedValue(cellValue); } else if ( this.config.keepColumns.length === 0 || this.config.keepColumns.indexOf(key) >= 0 ) { - valueToDisplay = value; + valueToDisplay = cellValue; } const cellText = document.createTextNode(valueToDisplay); diff --git a/README.md b/README.md index 07a4037..f31060c 100644 --- a/README.md +++ b/README.md @@ -244,6 +244,66 @@ Configuration: } ``` +## Example 5 (with font awesome icons, colors and descriptive row) + +![Example 5](example5.png) + +Raw json response: + +```json +{ + "trash": [ + { + "icon": "fa-trash", + "za-type": "Paper", + "zb-date": "15 July" + }, + { + "icon": { + "color": "#FF6E00", + "value": "fa-trash" + }, + "za-type": { + "color": "#FF6E00", + "value": "Plastic" + }, + "zb-date": { + "color": "#FF6E00", + "value": "25 July" + } + }, + { + "icon": { + "color": "red", + "value": "fa-trash" + }, + "za-type": { + "value": "GFT" + }, + "zb-date": { + "color": "yellow" + } + } + ] +} +``` + +Configuration: + +```javascript +{ + module: 'MMM-JsonTable', + position: 'top_left', + header: 'Trash calendar', + config: { + url: 'https://xyz/abc/get.json', + arrayName: 'trash', + descriptiveRow: '