nspanel-lovelace-ui/HMI

NSPanel Lovelance UI

The HMI Project of this project is only used to display stuff, navigation ist mostly up to the backend. This allows to be way more flexible.

Messages to the Panel can be send through the Command CustomSend, which is implemented in the berry driver. You can issue this command through MQTT by sending messages to the cmnd/XXX/CustomSend Topic. Messages from the Panel are send to the tele/XXX/RESULT Topic, encoded in json {"CustomRecv":"message_from_screen"}

Startup

On startup the panel will send {"CustomRecv":"event,startup,39,eu"} every few seconds.

event,   #Every message from the screen will start with `event`
startup, #Startup Event
39,      #Current HMI Project Version
eu       #Current HMI Project Model

You can answer this message in many different ways, but in general the goal is to navigate way from the startup page. In the following example we will navigate to the screensaver page.

Send the following messages to the CustomSend Topic. (You can also send them on tasmota console for testing)

Some preperation before we are acually navigating away:

Send this every minute: time~18:17

Send this at least once at midnight: date~Donnerstag, 25. August 2022

Send theese message once after receiving the startup event (parameters will be explained later):

timeout~20

dimmode~10~100~6371

Navigate from the startup page to the screensaver, by sending this command to the CustomSend Topic.

pageType~screensaver

After sending this command you should already see the time and date. To also show weather data you have to send them with weatherUpdate, but we will skip this for now.

Exit Screensaver

Touching the panel on the screensaver will result in this MQTT Message on the result topic:

event,buttonPress2,screensaver,bExit,1

You can answer this by sending theese commands to the CustomSend Topic.

pageType~cardEntities

entityUpd~test~1|1~light~light.schreibtischlampe~X~17299~Schreibtischlampe~0~text~sensor.server_energy_power~Y~17299~Server ENERGY Power~155 W~shutter~cover.rolladenfenster_cover_1~Z~17299~Fenster Eingang~A|B|C|disable|enable|enable~switch~switch.bad~D~63142~Bad~1

Messages to Nextion Display

General Commands, implemented on all pages

set brightness of screensaver and active-brightness:

dimmode~0~100 - (screen off)

dimmode~100~100 - (screen on with full brightness)

set current time:

time~22:26

set current date:

date~Di 24. Februar

set screensaver timeout (set time in sec~ max 65):

timeout~15 - timeout after 15 seconds

timeout~0 - disable screensaver

change the page type:

pageType~pageStartup

pageType~cardEntities

pageType~cardThermo

pageType~cardMedia

pageType~popupLight~Schreibtischlampe~light.schreibtischlampe

pageType~popupNotify

pageType~screensaver

screensaver page

weatherUpdate~tMainIcon~tMainText~tForecast1~tF1Icon~tForecast1Val~tForecast2~tF2Icon~tForecast2Val~tForecast3~tF3Icon~tForecast3Val~tForecast4~tF4Icon~tForecast4Val~optionalLayoutIcon~optionalLayoutText~altIconFont~altIconFont

color~background~time~timeAMPM~date~tMainIcon~tMainText~tForecast1~tForecast2~tForecast3~tForecast4~tF1Icon~tF2Icon~tF3Icon~tF4Icon~tForecast1Val~tForecast2Val~tForecast3Val~tForecast4Val~bar~tMRIcon~tMR

notify~heading~text

statusUpdate~icon1~icon1Color~icon2~icon2~icon2color~icon1font~icon2font

cardEntities Page

Structure (Category): entityUpd~title~[navigation]~[entity_information] Example with 4 Entities:

entityUpd~LightTest~button~navigate.prev~<~65535~~~button~navigate.next~>~65535~~~light~light.bed_light~A~17299~Bed Light~0~light~light.ceiling_lights~B~52231~Ceiling Lights~1~switch~switch.ac~C~17299~AC~0~switch~switch.decorative_lights~D~65222~Decorative Lights~1

Possible entities on cardEntities/cardGrid:

~light~light.entityName~1~17299~Light1~0

~shutter~cover.entityName~0~17299~Shutter2~iconUp|iconStop|iconDown

~delete~~~~~

~text~sensor.entityName~3~17299~Temperature~content

~button~button.entityName~3~17299~bt-name~bt-text

~switch~switch.entityName~4~17299~Switch1~0

~number~input_number.entityName~4~17299~Number123~value|min|max

~input_sel~input_select.entityName~3~17299~sel-name~sel-text

Number	Category	Location	Type	Field	Addional Information
0	instruction		instruction	entityUpd
1	title	title	title	title
2	Navigation	Upper Left Icon	Entity Definition	type	(ignored)¹
3				intNameEntity
4				icon
5				iconColor
6				displayName	ignored
7				optionalValue	ignored
8		Upper Right Icon	Entity Definition	type	(ignored)¹
9				intNameEntity
10				icon
11				iconColor
12				displayName	ignored
13				optionalValue	ignored
14	Entities	First Entity	Entity Definition	type
15				intNameEntity
16				icon
17				iconColor
18				displayName
19				optionalValue
20		Second Entity	Entity Definition	type
21				intNameEntity
22				icon
23				iconColor
24				displayName
25				optionalValue
26		Thrid Entity	Entity Definition	type
27				intNameEntity
28				icon
29				iconColor
30				displayName
31				optionalValue
32		Forth Entiry	Entity Definition	type
33				intNameEntity
34				icon
35				iconColor
36				displayName
37				optionalValue
38		Fifth Entiy (US Portrait   Version)	Entity Definition	type
39				intNameEntity
40				icon
41				iconColor
42				displayName
43				optionalValue
44		Sixth Entiy (US Portrait   Version)	Entity Definition	type
45				intNameEntity
46				icon
47				iconColor
48				displayName
49				optionalValue

cardGird Page

cardGrid is using the exact same message cardEntities is using; it ignores the information supplied in optionalValue, because it isn't needed for cardGrid

Parameter   Number	Category	Location	Type	Field	Addional Information
0	instruction		instruction	entityUpd
1	title	title	title	title
2	Navigation	Upper Left Icon	Entity Definition	type	(ignored)¹
3				intNameEntity
4				icon
5				iconColor
6				displayName	ignored
7				optionalValue	ignored
8		Upper Right Icon	Entity Definition	type	(ignored)¹
9				intNameEntity
10				icon
11				iconColor
12				displayName	ignored
13				optionalValue	ignored
14	Entities	First Entity	Entity Definition	type
15				intNameEntity
16				icon
17				iconColor
18				displayName
19				optionalValue	ignored
20		Second Entity	Entity Definition	type
21				intNameEntity
22				icon
23				iconColor
24				displayName
25				optionalValue	ignored
26		Thrid Entity	Entity Definition	type
27				intNameEntity
28				icon
29				iconColor
30				displayName
31				optionalValue	ignored
32		Forth Entiry	Entity Definition	type
33				intNameEntity
34				icon
35				iconColor
36				displayName
37				optionalValue	ignored
38		Fifth Entiy (US Portrait   Version)	Entity Definition	type
39				intNameEntity
40				icon
41				iconColor
42				displayName
43				optionalValue	ignored
44		Sixth Entiy (US Portrait   Version)	Entity Definition	type
45				intNameEntity
46				icon
47				iconColor
48				displayName
49				optionalValue	ignored

cardMedia

Example without icons in bottom row: entityUpd~Kitchen~button~navigation.up~U~65535~~~delete~~~~~~media_player.kitchen~I'm a Hurricane~~Wellmess~~100~A~64704~B~media_pl~media_player.kitchen~C~17299~Kitchen~

Parameter   Number	Category	Location	Type	Field	Addional Information
0	instruction		instruction	entityUpd
1	title	title	title	title
2	Navigation	Upper Left Icon	Entity Definition	type	(ignored)¹
3				intNameEntity
4				icon
5				iconColor
6				displayName	ignored
7				optionalValue	ignored
8		Upper Right Icon	Entity Definition	type	(ignored)¹
9				intNameEntity
10				icon
11				iconColor
12				displayName	ignored
13				optionalValue	ignored
14	cardMedia specific		cardMedia specific	intNameEntity
15		1st text row		title
16				titleColor
17		2nd text row		author
18				authorColor
19		slider		volume	0-100
20		icon middle		playPauseIcon
21		icon right side		onOffBtn	"disable" or color
22		icon left side		iconShuffle	"disable" or icon
23	Entities	upper left corner media   icon	Entity Definition	type
24				intNameEntity
25				icon
26				iconColor
27				displayName	only used for popups
28				optionalValue	ignored
29		First Entity	Entity Definition	type
30				intNameEntity
31				icon
32				iconColor
33				displayName	only used for popups
34				optionalValue	ignored
35		Second Entity	Entity Definition	type
36				intNameEntity
37				icon
38				iconColor
39				displayName	only used for popups
40				optionalValue	ignored
41		Thrid Entity	Entity Definition	type
42				intNameEntity
43				icon
44				iconColor
45				displayName	only used for popups
46				optionalValue	ignored
47		Forth Entiry	Entity Definition	type
48				intNameEntity
49				icon
50				iconColor
51				displayName	only used for popups
52				optionalValue	ignored
53		Fifth Entiy	Entity Definition	type
54				intNameEntity
55				icon
56				iconColor
57				displayName	only used for popups
58				optionalValue	ignored

cardThermo

Serial Protocol of cardThermo is about to change; table will be completed later

Parameter   Number	Category	Location	Type	Field	Addional Information
0	instruction		instruction	entityUpd
1	title	title	title	title
2	Navigation	Upper Left Icon	Entity Definition	type	(ignored)¹
3				intNameEntity
4				icon
5				iconColor
6				displayName	ignored
7				optionalValue	ignored
8		Upper Right Icon	Entity Definition	type	(ignored)¹
9				intNameEntity
10				icon
11				iconColor
12				displayName	ignored
13				optionalValue	ignored
14	cardThermo specific		cardThermo specific	intNameEntity
15				currentTemp
16				dstTemp	current temp; multiplied by 10
17		4th Text Box Left Side		status
18				minTemp	min temp; multiplied by 10
19				maxTemp	max temp; multiplied by 10
20				tempStep	temp adj per step; multiplied by 10
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73

cardAlarm

Parameter   Number	Category	Location	Type	Field	Addional Information
0	instruction		instruction	entityUpd
1	title	title	title	intNameEntity
2	Navigation	Upper Left Icon	Entity Definition	type	(ignored)¹
3				intNameEntity
4				icon
5				iconColor
6				displayName	ignored
7				optionalValue	ignored
8		Upper Right Icon	Entity Definition	type	(ignored)¹
9				intNameEntity
10				icon
11				iconColor
12				displayName	ignored
13				optionalValue	ignored
14	cardAlarm specific	1st button   right side		displayName
15				intId
16		2nd button   right side		displayName
17				intId
18		3rd button   right side		displayName
19				intId
20		4th button   right side		displayName
21				intId
22		icon next to code display		icon
23				iconColor
24		numpad		numpadStatus	"disable" or "enable"
25		flashing of icon next to code		flashing status	"enable" or "disable"
26		button bottom left corner		icon
27				iconColor
28				intNameEntity

cardQR

Example: entityUpd~Guest Wifi~button~navigate.prev~<~65535~~~button~navigate.next~>~65535~~~WIFI:S:test_ssid;T:WPA;P:test_pw;;~text~iText.test_ssid~<7E><><EFBFBD>~17299~Name~test_ssid~text~iText.test_pw~<7E><><EFBFBD>~17299~Password~test_pw

Parameter   Number	Category	Location	Type	Field	Addional Information
0	instruction		instruction	entityUpd
1	title	title	title	intNameEntity
2	Navigation	Upper Left Icon	Entity Definition	type	(ignored)¹
3				intNameEntity
4				icon
5				iconColor
6				displayName	ignored
7				optionalValue	ignored
8		Upper Right Icon	Entity Definition	type	(ignored)¹
9				intNameEntity
10				icon
11				iconColor
12				displayName	ignored
13				optionalValue	ignored
14	cardQR specific			qrcode text
15	Entities	1st Entity	Entity Definition	type
16				intNameEntity
17				icon
18				iconColor
19				displayName
20				optionalValue
21		2nd Entity	Entity Definition	type
22				intNameEntity
23				icon
24				iconColor
25				displayName
26				optionalValue

cardPower (in development)

Parameter   Number	Category	Location	Type	Field	Addional Information
0	instruction		instruction	entityUpd
1	title	title	title	intNameEntity
2	Navigation	Upper Left Icon	Entity Definition	type	(ignored)¹
3				intNameEntity
4				icon
5				iconColor
6				displayName	ignored
7				optionalValue	ignored
8		Upper Right Icon	Entity Definition	type	(ignored)¹
9				intNameEntity
10				icon
11				iconColor
12				displayName	ignored
13				optionalValue	ignored
14	cardPower specific	Home Icon Middle		iconColor
15				icon
16				text
17		1st Item Upper Left	Power Entity Definition	iconColor
18				icon
19				speed	numbers (-2,-1,0,1,2)
20				text
21		2nd Item Middle Left	Power Entity Definition	iconColor
22				icon
23				speed	numbers (-2,-1,0,1,2)
24				text
25		3rd Item Bottom Left	Power Entity Definition	iconColor
26				icon
27				speed	numbers (-2,-1,0,1,2)
28				text
29		4th Item Upper Right	Power Entity Definition	iconColor
30				icon
31				speed	numbers (-2,-1,0,1,2)
32				text
33		5thItem Middle Right	Power Entity Definition	iconColor
34				icon
35				speed	numbers (-2,-1,0,1,2)
36				text
37		6th Item Bottom Right	Power Entity Definition	iconColor
38				icon
39				speed	numbers (-2,-1,0,1,2)
40				text

cardChart Page

entityUpd~heading~navigation~color~yAxisLabel~yAxisTick:[yAxisTick]*[~value[:xAxisLabel]?]*

entityUpd~Chart Demo~1|1~6666~Gas [kWh]~20:40:60:80:100~10~7^2:00~7~6^4:00~6~7^6:00~0~7^8:00~5~1^10:00~1~10^12:00~5~6^14:00~8

popupLight Page

entityUpdateDetail~entityName~*ignored*~*iconColor*~*buttonState*~*sliderBrightnessPos*~*sliderColorTempPos*~*colorMode*~*color_translation*~*color_temp_translation*~*brightness_translation*

entityUpdateDetail~1~17299~1~100~78~enable

entityUpdateDetail~1~17299~1~100~disable

popupShutter Page

entityUpdateDetail~entityName~*sliderPos*~2ndrow~textPosition~icon1~iconUp~iconStop~iconDown~iconUpStatus~iconStopStatus~iconDownStatus~textTilt~iconTiltLeft~iconTiltStop~iconTiltRight~iconTiltLeftStatus~iconTiltStopStatus~iconTiltLeftStatus~tiltPos

entityUpdateDetail~1~77

popupNotify Page

entityUpdateDetail~*internalName*~*tHeading*~*tHeadingColor*~*b1*~*tB1Color*~*b2*~*tB2Color*~*tText*~*tTextColor*~*sleepTimeout*~*font*~*alt_icon*~*altIconColor*

exitPopup

popupThermo Page

entityUpdateDetail~{entity_id}~{icon_id}~{icon_color}~{heading}~{mode}~mode1~mode1?mode2?mode3~{heading}~{mode}~mode1~mode1?mode2?mode3~{heading}~{mode}~mode1~mode1?mode2?mode3~

popupInSel Page (input_select detail page)

entityUpdateDetail2~*entity_id*~~*icon_color*~*input_sel*~*state*~*options*

options are ? seperated

popupTimer

editable is 0 or 1

action fields are in the answer on the button press

in case action is empty the button will be hidden

entityUpdateDetail~{entity_id}~~{icon_color}~{entity_id}~{min_remaining}~{sec_remaining}~{editable}~{action1}~{action2}~{action3}~{label1}~{label2}~{label3}

Messages from Nextion Display

event,buttonPress2,pageName,bNext

event,buttonPress2,pageName,bPrev

event,buttonPress2,pageName,bExit,number_of_taps

event,buttonPress2,pageName,sleepReached

startup page

event,startup,version,model

screensaver page

event,buttonPress2,screensaver,exit - Touch Event on Screensaver

event,screensaverOpen - Screensaver has opened

cardEntities Page

event,*eventName*,*entityName*,*actionName*,*optionalValue*

event,buttonPress2,internalNameEntity,up

event,buttonPress2,internalNameEntity,down

event,buttonPress2,internalNameEntity,stop

event,buttonPress2,internalNameEntity,OnOff,1

event,buttonPress2,internalNameEntity,button

popupLight Page

event,pageOpenDetail,popupLight,internalNameEntity

event,buttonPress2,internalNameEntity,OnOff,1

event,buttonPress2,internalNameEntity,brightnessSlider,50

event,buttonPress2,internalNameEntity,colorTempSlider,50

event,buttonPress2,internalNameEntity,colorWheel,x|y|wh

popupShutter Page

event,pageOpenDetail,popupShutter,internalNameEntity

event,buttonPress2,internalNameEntity,positionSlider,50

popupNotify Page

event,buttonPress2,*internalName*,notifyAction,yes

event,buttonPress2,*internalName*,notifyAction,no

cardThermo Page

event,buttonPress2,*entityName*,tempUpd,*temperature*

event,buttonPress2,*entityName*,hvac_action,*hvac_action*

cardMedia Page

event,buttonPress2,internalNameEntity,media-back

event,buttonPress2,internalNameEntity,media-pause

event,buttonPress2,internalNameEntity,media-next

event,buttonPress2,internalNameEntity,volumeSlider,75

cardAlarm Page

event,buttonPress2,internalNameEntity,actionName,code

Custom Protocol

55 BB [payload length] [payload length] [payload] [crc] [crc]

Payload length contains the number of bytes of the payload.

CRC is "CRC-16 (MODBUS) Big Endian" calculated over the whole message

This protocol does not try to implement broken JSON Commands with a specified type (lol). Instead the commands are plain text commands with parameters.

Example for valid Message

This message has to be generated for the Message "1337" (1337 is not a valid command~ this is just an example)

55 BB  04 00  31 33 33 37  5F 5B