[MMM-ValuesByNotification] Display the payloads of notifications with titles and icons

wishmaster270

@Cr4z33
No problem.
Simply add

.vbn .groupWrapper {
  border-style: none;
  padding: 0px;
}

to your custom.css

Ps.: Try to never ever edit any files in the module directory (except mentioned in the documentation) as you will get problems with updates in the future otherwise!

Cr4z33

@wishmaster270 exactly what I wanted thanks!

wishmaster270

@Cr4z33
If you still want to move the content to the left you can try something like the following in your custom.css:

.vbn .groupWrapper {
  border-style: none;
  padding: 0px;
  margin-left: 20px;
}

.vbn .groupsWrapper, .vbn .groupWrapper, .vbn .itemsWrapper, .vbn .valueWrapper {
  justify-content: left;
  align-items: unset;
}

BKeyport

@wishmaster270

Hey, Tom - Trying to use this module to decode the json output by my weatherstation - Like https://forum.magicmirror.builders/topic/17396/json-request-module

What I’m getting from Command to notification module is:

WEATHERLINK {"data":{"did":"001D0A71573B","ts":1675287003,"conditions":[{"lsid":434637,"data_structure_type":1,"txid":1,"temp": 47.4,"hum":52.8,"dew_point": 31.0,"wet_bulb": 38.4,"heat_index": 46.4,"wind_chill": 47.4,"thw_index": 46.4,"thsw_index":null,"wind_speed_last":2.00,"wind_dir_last":31,"wind_speed_avg_last_1_min":2.62,"wind_dir_scalar_avg_last_1_min":6,"wind_speed_avg_last_2_min":2.81,"wind_dir_scalar_avg_last_2_min":358,"wind_speed_hi_last_2_min":5.00,"wind_dir_at_hi_speed_last_2_min":340,"wind_speed_avg_last_10_min":1.43,"wind_dir_scalar_avg_last_10_min":36,"wind_speed_hi_last_10_min":5.00,"wind_dir_at_hi_speed_last_10_min":336,"rain_size":1,"rain_rate_last":0,"rain_rate_hi":0,"rainfall_last_15_min":0,"rain_rate_hi_last_15_min":0,"rainfall_last_60_min":0,"rainfall_last_24_hr":0,"rain_storm":0,"rain_storm_start_at":null,"solar_rad":null,"uv_index":null,"rx_state":0,"trans_battery_flag":0,"rainfall_daily":0,"rainfall_monthly":0,"rainfall_year":1750,"rain_storm_last":4,"rain_storm_last_start_at":1674798601,"rain_storm_last_end_at":1675000860},{"lsid":434634,"data_structure_type":4,"temp_in": 79.4,"hum_in":20.5,"dew_point_in": 35.5,"heat_index_in": 77.4},{"lsid":434633,"data_structure_type":3,"bar_sea_level":30.125,"bar_trend":-0.013,"bar_absolute":29.660}]},"error":null}

yes, the weather station dumps a mess. :)

my current config for the values by notification is just the basics, but should be grabbing the “hum” value for testing:

		{
			module: "MMM-ValuesByNotification",
			position: "top_left",
			header: "Module-1",
			config: {
				groups: [
					{
						items: [
							{
								notification: "WEATHERLINK",
								itemTitle: "Item-1",
								values: [
									{
										valueTitle: "Value-1",
										jsonpath: "hum",
									},
								]
							},
						]
					},
				]
			},
		},

I get initally “NA” as a value, then it flips to “Undefined”

Any clue on what I’m doing wrong, or is the feed from the weather station needing more of a massage to be useful?

thanks!

wishmaster270

@BKeyport Hi,
i formatted your output to understand the JSON structure you are using:

{
    "data": {
        "did": "001D0A71573B",
        "ts": 1675287003,
        "conditions": [
            {
                "lsid": 434637,
                "data_structure_type": 1,
                "txid": 1,
                "temp": 47.4,
                "hum": 52.8,
                "dew_point": 31.0,
                "wet_bulb": 38.4,
                "heat_index": 46.4,
                "wind_chill": 47.4,
                "thw_index": 46.4,
                "thsw_index": null,
                "wind_speed_last": 2.00,
                "wind_dir_last": 31,
                "wind_speed_avg_last_1_min": 2.62,
                "wind_dir_scalar_avg_last_1_min": 6,
                "wind_speed_avg_last_2_min": 2.81,
                "wind_dir_scalar_avg_last_2_min": 358,
                "wind_speed_hi_last_2_min": 5.00,
                "wind_dir_at_hi_speed_last_2_min": 340,
                "wind_speed_avg_last_10_min": 1.43,
                "wind_dir_scalar_avg_last_10_min": 36,
                "wind_speed_hi_last_10_min": 5.00,
                "wind_dir_at_hi_speed_last_10_min": 336,
                "rain_size": 1,
                "rain_rate_last": 0,
                "rain_rate_hi": 0,
                "rainfall_last_15_min": 0,
                "rain_rate_hi_last_15_min": 0,
                "rainfall_last_60_min": 0,
                "rainfall_last_24_hr": 0,
                "rain_storm": 0,
                "rain_storm_start_at": null,
                "solar_rad": null,
                "uv_index": null,
                "rx_state": 0,
                "trans_battery_flag": 0,
                "rainfall_daily": 0,
                "rainfall_monthly": 0,
                "rainfall_year": 1750,
                "rain_storm_last": 4,
                "rain_storm_last_start_at": 1674798601,
                "rain_storm_last_end_at": 1675000860
            },
            {
                "lsid": 434634,
                "data_structure_type": 4,
                "temp_in": 79.4,
                "hum_in": 20.5,
                "dew_point_in": 35.5,
                "heat_index_in": 77.4
            },
            {
                "lsid": 434633,
                "data_structure_type": 3,
                "bar_sea_level": 30.125,
                "bar_trend": -0.013,
                "bar_absolute": 29.660
            }
        ]
    },
    "error": null
}

The hum value is part of the first element with index 0 of the conditions object which is part of the data object.
This results in a more advanced jsonpath…

		{
			module: "MMM-ValuesByNotification",
			position: "top_left",
			header: "Module-1",
			config: {
				groups: [
					{
						items: [
							{
								notification: "WEATHERLINK",
								itemTitle: "Item-1",
								values: [
									{
										valueTitle: "Value-1",
										jsonpath: "data.conditions[0].hum",
									},
								]
							},
						]
					},
				]
			},
		},

This config works out of the box ;-)

Edit:

If the order of the elements of conditions varies you can use

jsonpath: "data.conditions..hum"

This one selects the hum value of any element of conditions.

BKeyport

@wishmaster270 Brilliant. Thank you. JSON is still quite the mystery to me sometimes. :)

BKeyport

One last thing - where in the CSS do I adjust the font size for the module? I want it to use the MM “Large” font, as it’s on a wall display across from my desk. Can’t seem to find it.

wishmaster270

@BKeyport
Hi, great that it works now.
There are two different ways of how to change the font-size.
Either by using the classes option and add large to the element you want the font-size to be changed. i.e.:

{
			module: "MMM-ValuesByNotification",
			position: "top_left",
			header: "Module-1",
			config: {
				groups: [
					{
						items: [
							{
								notification: "WEATHERLINK",
								itemTitle: "Item-1",
								values: [
									{
										classes: "large",
										valueTitle: "Value-1",
										jsonpath: "data.conditions..hum",
									},
								]
							},
						]
					},
				]
			},
		},

The main problem with this solution is that the font-size of the valueTitle and the value itself is changed.

Or you can use custom.css to do the job:

.MMM-ValuesByNotification .vbn .groupTitle,
.MMM-ValuesByNotification .vbn .itemTitle,
.MMM-ValuesByNotification .vbn .value,
.MMM-ValuesByNotification .vbn .valueTitle {
  font-size: var(--font-size-large);
  line-height: 1;
}

In this example the font-size of all titles and the value is changed. I use the font-size-large CSS variable of the main.css for this job.

BKeyport

Thanks again, man. :)

I might not have to work up my own module to get the notifications. 🤣

BKeyport

I’m using the example scripts in CommandToNotification using a BME280. I’m trying to keep the temperature in F to two digits, as the script or BME module is producing LONG temperature values. (76.0000000000000000000000001)

Using the configuration below, I’m not getting any rounding on output. The “valueFormat” is directly from your README.md.

		{
			module: "MMM-ValuesByNotification", // https://github.com/Tom-Hirschberger/MMM-ValuesByNotification
			position: "top_bar",
			config: {
				animationSpeed: 0,
				updateInterval: 15,
				groups: [
					{
						items: [
							{
								notification: "WEATHERLINK", 
								values: [
									{
										valueTitle: "Closet",
										valueUnit: "°F",
										jsonpath: "data.conditions[1].temp_in",
										naValue: "0",
									},
								]
							},
						]
					},
					{
						items: [
							{
								notification: "TEMPROOM",
								itemTitle: "Room",
								values: [
									{
										valueTitle: "Temp",
										valueUnit: "°F",
										naValue: "0",
										valueFormat: "Number(${value}).toFixed(2)",
										jsonpath: "temperature_f",
									},
								],
							},
						]
					}, 
				]
			},
		},