Skip to content

Configuration

Scroll through the examples first. Maybe you can just copy and paste!

Overall

Property Description
url The url where to get the json response from.
Type: string
Default: https://jsonplaceholder.typicode.com/users
refreshInterval The interval with which the url is queried and your values are updated.
Type: int (seconds)
Default: 300000 => 5 minutes
headerIcon The Icon for your Header
Type: string any FontAwesome Icon
Default: (none)
fetchOptions Custom parameters for the fetch call. For example method, headers, body.
Type: object
Default: {} No additional parameters.
jq Custom jq.node command to apply to the data. Used to convert JSON data.
Type: string
Default: '.' Use value as received.
values Custom Configuration of the values you want to display (see below)
Type: array
Default: [] Which means it displays all first level attributes (or the first element of an array).
styleRules Custom Style Rules matching for applying styles to any value (see below)
Type: array
Default: [] No style rules are applied.

Value Configuration

Value-Property Description
title The Title of the Property displayed on the screen
Type: string
Default: The attribute name
query The jsonpath to the value of your json response you want to display. Here you can test your expression
Type: string
Example: $[?(@.name=='Ervin Howell')].address.geo.lat
suffix String that will be displayed behind your query value
Type: string
Example: %
prefix String that will be displayed in front of your query value
Type: string
Example: EUR

styleRules Configuration

Value-Property Description
match The matching rule determining if the style
Type: function (with the value as parameter and returning a boolean)
Example: (value) => value > 10
style The style that should be applied to the value element.
Type: string
Example: color: ref
Default: (none)
class A string that will be appended to the class attribute of the value element.
Type: string
Example: class-name
Default: (none)

JSON Flow

graph TD
  API -->|Retrieve with fetchOptions| plainJSON[Original JSON];
  plainJSON -->|Run jq| form1JSON[Transformed JSON];
  form1JSON -->|Run values queries| form2JSON[Transformed JSON];
  form2JSON -->|Run styleRules| m[Display in Magic Mirror];