{"id":13830258,"url":"https://github.com/timdows/MMM-JsonTable","last_synced_at":"2025-07-09T11:32:35.418Z","repository":{"id":30402030,"uuid":"124797771","full_name":"timdows/MMM-JsonTable","owner":"timdows","description":"A module for the MagicMirror project which creates a table filled with a list gathered from a json request.","archived":false,"fork":false,"pushed_at":"2024-07-16T09:01:31.000Z","size":312,"stargazers_count":25,"open_issues_count":7,"forks_count":31,"subscribers_count":4,"default_branch":"master","last_synced_at":"2024-08-04T10:02:48.085Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/timdows.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-03-11T20:44:44.000Z","updated_at":"2024-08-04T10:02:52.900Z","dependencies_parsed_at":"2024-04-03T15:29:28.911Z","dependency_job_id":"940e12ca-fe32-450d-9d45-47a7101cf180","html_url":"https://github.com/timdows/MMM-JsonTable","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/timdows%2FMMM-JsonTable","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/timdows%2FMMM-JsonTable/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/timdows%2FMMM-JsonTable/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/timdows%2FMMM-JsonTable/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/timdows","download_url":"https://codeload.github.com/timdows/MMM-JsonTable/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225539364,"owners_count":17485313,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-04T10:00:57.909Z","updated_at":"2024-11-20T11:30:34.716Z","avatar_url":"https://github.com/timdows.png","language":"JavaScript","funding_links":[],"categories":["Home Automation \u0026 Notifications"],"sub_categories":[],"readme":"# MMM-JsonTable\n\nA module for the [MagicMirror²](https://github.com/MagicMirrorOrg/MagicMirror) project which creates a table filled with a list gathered from a json request.\n\nAll the variables of the objects in the array are represented by a table column.\nFor every column it checks if a valid DateTime is given, and then formats it to `HH:mm:ss` if it is today or `YYYY-MM-DD` otherwise.\n\n## Installation\n\nJust clone the module into your modules folder of your MagicMirror².\n\n```shell\ngit clone https://github.com/timdows/MMM-JsonTable\n```\n\nThat's it!\n\nIf you are a developer please also install the depenendies for linter and prettier:\n\n```shell\ncd MMM-JsonTable\nnpm install\n```\n\n## Build and Test status\n\n[![Node.js CI](https://github.com/timdows/MMM-JsonTable/actions/workflows/runtest.yml/badge.svg)](https://github.com/timdows/MMM-JsonTable/actions/workflows/runtest.yml)\n\n## Config options\n\nExcept `url` all options are optional.\n\n\u003c!-- prettier-ignore-start --\u003e\n| **Option**     | **Description**   |\n| -------------- | --------------    |\n| url            | The full url to get the json response from \u003cbr\u003e\u003cbr\u003e**Default value:** `\"\"` |\n| arrayName      | Define the name of the variable that holds the array to display \u003cbr\u003e\u003cbr\u003e**Default value:** `null` |\n| noDataText     | Text indicating that there is no data. \u003cbr\u003e\u003cbr\u003e**Default value:** `Json data is not of type array! Maybe the config arrayName is not used and should be, or is configured wrong.` |\n| keepColumns    | Columns on json will be showed \u003cbr\u003e\u003cbr\u003e**Default value:** `[]` |\n| tryFormatDate  | For every column it checks if a valid DateTime is given, and then formats it to `HH:mm:ss` if it is today or `YYYY-MM-DD` otherwise \u003cbr\u003e\u003cbr\u003e**Default value:** `false`\u003cbr\u003e **Possible values:** `false` and `true` |\n| size           | Text size at table, 0 is default and 3 is H3 \u003cbr\u003e\u003cbr\u003e**Default value:** `0`\u003cbr\u003e **Possible values:** `0` - `3` |\n| updateInterval | Milliseconds between the refersh \u003cbr\u003e\u003cbr\u003e**Default value:** `15000` |\n| animationSpeed | Speed of the update animation. (Milliseconds)\u003cbr\u003eIf you don't want that the module blinks during an update, set the value to `0`. \u003cbr\u003e\u003cbr\u003e**Default value:** `500`\u003cbr\u003e **Possible values:** `0` - `5000` |\n| descriptiveRow | Complete html table row that will be added above the array data \u003cbr\u003e\u003cbr\u003e**Default value:** `\"\"` |\n\u003c!-- prettier-ignore-end --\u003e\n\n## Example 1\n\nEnd result:\n\n![Example 1](example1.png)\n\nRaw json response:\n\n```json\n{\n  \"items\": [\n    {\n      \"name\": \"Watt\",\n      \"value\": \"270 Watt\"\n    },\n    {\n      \"name\": \"Today\",\n      \"value\": \"5.85 kWh\"\n    },\n    {\n      \"name\": \"ThisWeek\",\n      \"value\": \"5.83 kWh\"\n    },\n    {\n      \"name\": \"ThisMonth\",\n      \"value\": \"12.8 kWh\"\n    },\n    {\n      \"name\": \"LastMonth\",\n      \"value\": \"246.75 kWh\"\n    }\n  ]\n}\n```\n\nConfiguration:\n\n```javascript\n{\n  module: 'MMM-JsonTable',\n  position: 'top_right',\n  header: 'HouseDB Sevensegment',\n  config: {\n    url: 'https://xyz/abc/get.json', // Required\n    arrayName: 'items' // Optional\n  }\n}\n```\n\n## Example 2\n\n![Example 2](example2.png)\n\nRaw json response:\n\n```json\n{\n  \"currentUsages\": [\n    {\n      \"deviceName\": \"P1\",\n      \"currentWattValue\": 180,\n      \"todayKwhUsage\": 5.902,\n      \"lastUpdate\": \"2018-04-02T18:12:06Z\"\n    },\n    {\n      \"deviceName\": \"Studie - MainDown\",\n      \"currentWattValue\": 76,\n      \"todayKwhUsage\": 0.46,\n      \"lastUpdate\": \"2018-04-02T18:06:52Z\"\n    },\n    {\n      \"deviceName\": \"BoilerPower\",\n      \"currentWattValue\": 0,\n      \"todayKwhUsage\": 2.21,\n      \"lastUpdate\": \"2018-04-02T17:30:01Z\"\n    },\n    {\n      \"deviceName\": \"Koelkast\",\n      \"currentWattValue\": 1.3,\n      \"todayKwhUsage\": 0.55,\n      \"lastUpdate\": \"2018-04-02T18:09:55Z\"\n    },\n    {\n      \"deviceName\": \"Vaatwasser\",\n      \"currentWattValue\": 0.5,\n      \"todayKwhUsage\": 0.01,\n      \"lastUpdate\": \"2018-04-02T18:10:51Z\"\n    },\n    {\n      \"deviceName\": \"Wasmachine\",\n      \"currentWattValue\": 0,\n      \"todayKwhUsage\": 0,\n      \"lastUpdate\": \"2018-04-02T18:12:06Z\"\n    }\n  ]\n}\n```\n\nConfiguration:\n\n```javascript\n{\n  module: 'MMM-JsonTable',\n  position: 'top_right',\n  header: 'HouseDB Current Usages',\n  config: {\n    url: 'https://xyz/abc/get.json', // Required\n    arrayName: 'currentUsages', // Optional\n    tryFormatDate: true\n  }\n}\n```\n\n## Example 3 (with font awesome icons)\n\n![Example 3](https://user-images.githubusercontent.com/1011699/53985507-104ecc00-411c-11e9-9ca4-c994f0ae62e1.png)\n\nRaw json response:\n\n```json\n{\n   \"cups\":[\n      {\n         \"icon\":\"fa-calendar\",\n         \"data\":\"Senaste bryggning\",\n         \"value\":\"2019-03-07\",\n         \"type\":\"\"\n      },\n      {\n         \"icon\":\"fa-clock-o\",\n         \"data\":\"Klockan\",\n         \"value\":\"17:32:06\",\n         \"type\":\"\"\n      },\n      {\n         \"icon\":\"fa-coffee\",\n         \"data\":\"Totalt antal bryggda koppar\",\n         \"value\":60,\n         \"type\":\"st\"\n      },\n      ...\n   ]\n}\n```\n\n## Example 4 (with descriptive row)\n\n![Example 4](example4.png)\n\nRaw json response:\n\n```json\n{\n   \"deviceKwhUsages\":[\n      {\n      \"name\": \"Studie - MainDown\",\n      \"today\": 0,\n      \"todayFormatted\": \"0\",\n      \"thisWeek\": 1.27,\n      \"thisWeekFormatted\": \"1,27\",\n      \"lastWeek\": 7,\n      \"lastWeekFormatted\": \"7,00\",\n      \"thisMonth\": 17.41,\n      \"thisMonthFormatted\": \"17,41\",\n      \"lastMonth\": 30.58,\n      \"tLastMonthFormatted\": \"30,58\"\n    },\n    {\n      \"name\": \"BoilerPower\",\n      \"today\": 0,\n      \"todayFormatted\": \"0\",\n      \"thisWeek\": 1.9,\n      \"thisWeekFormatted\": \"1,90\",\n      \"lastWeek\": 13.3,\n      \"lastWeekFormatted\": \"13,30\",\n      \"thisMonth\": 30.44,\n      \"thisMonthFormatted\": \"30,44\",\n      \"lastMonth\": 54.99,\n      \"tLastMonthFormatted\": \"54,99\"\n    },\n      ...\n   ]\n}\n```\n\nConfiguration:\n\n```javascript\n{\n  module: 'MMM-JsonTable',\n  position: 'top_right',\n  header: 'HouseDB Kwh Statistics',\n  config: {\n    url: 'https://xyz/abc/get.json',\n    arrayName: 'deviceKwhUsages',\n    descriptiveRow: '\u003ctr\u003e\u003ctd\u003eName\u003c/td\u003e\u003ctd\u003eToday\u003c/td\u003e\u003ctd\u003eThisWeek\u003c/td\u003e\u003ctd\u003eLastWeek\u003c/td\u003e\u003ctd\u003eThisMonth\u003c/td\u003e\u003ctd\u003eLastMonth\u003c/td\u003e\u003c/tr\u003e'\n  }\n}\n```\n\n## Example 5 (with font awesome icons, colors and descriptive row)\n\n![Example 5](example5.png)\n\nRaw json response:\n\n```json\n{\n  \"trash\": [\n    {\n      \"icon\": \"fa-trash\",\n      \"za-type\": \"Paper\",\n      \"zb-date\": \"15 July\"\n    },\n    {\n      \"icon\": {\n        \"color\": \"#FF6E00\",\n        \"value\": \"fa-trash\"\n      },\n      \"za-type\": {\n        \"color\": \"#FF6E00\",\n        \"value\": \"Plastic\"\n      },\n      \"zb-date\": {\n        \"color\": \"#FF6E00\",\n        \"value\": \"25 July\"\n      }\n    },\n    {\n      \"icon\": {\n        \"color\": \"red\",\n        \"value\": \"fa-trash\"\n      },\n      \"za-type\": {\n        \"value\": \"GFT\"\n      },\n      \"zb-date\": {\n        \"color\": \"yellow\"\n      }\n    }\n  ]\n}\n```\n\nConfiguration:\n\n```javascript\n{\n  module: 'MMM-JsonTable',\n  position: 'top_left',\n  header: 'Trash calendar',\n  config: {\n    url: 'https://xyz/abc/get.json',\n    arrayName: 'trash',\n    descriptiveRow: '\u003ctr\u003e\u003ctd\u003e\u003c/td\u003e\u003ctd\u003eType\u003c/td\u003e\u003ctd\u003eDay\u003c/td\u003e\u003c/tr\u003e',\n    updateInterval: 60000\n  }\n}\n```\n\n## Developer hints\n\nPlease use `npm run test` before doing a PR.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftimdows%2FMMM-JsonTable","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftimdows%2FMMM-JsonTable","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftimdows%2FMMM-JsonTable/lists"}