Buttons, messages, topics and weird things with messages

[Trying_to_learn]

I have been running around in circles for the last couple of hours with a flow I am/was trying to get working.

This is the cut down version.
It is a mess, because I slapped it together to show something I don't get.

Walk through:
4 buttons.
Top two set the "mode" (mood if you will) of things.
Either good (normal), or bad (error).

The text node below that indicates this quite clearly.

The two buttons below......

ACK - works.
ACK F - doesn't.

Originally I had "ACK-F" and was pressing the button (until the cow's come home) and nothing was happening.

Only when I added a topic to the button (as in with ACK) did it work.

WHY?

WHY is it there are no "complaints" from any node about missing such and such or what ever if they are needed.
Rather it just . . . . fails.
I say fail, but I can't really think of a better word.

I am going to be picked to death about this I am sure to do with the function node I'm sure.

If there is a problem with missing parts of a message I would have thought that the node would complain about it.

[{"id":"3a7fe578.97b572","type":"ui_button","z":"aa48e352.9ad2f8","name":"All good/normal","group":"7fe920c6.daab38","order":1,"width":"0","height":"0","passthru":false,"label":"All good/normal","tooltip":"","color":"","bgcolor":"","icon":"fa-check-square-o fa-2x","payload":"false","payloadType":"bool","topic":"undervoltage","x":350,"y":1670,"wires":[["acaab0ce.aaa4e"]]},{"id":"acaab0ce.aaa4e","type":"fan","z":"aa48e352.9ad2f8","x":590,"y":1710,"wires":[["e02cf657.010ca","623bc8c6.fb3ba8"]]},{"id":"e02cf657.010ca","type":"function","z":"aa48e352.9ad2f8","name":"","func":"//node.warn(msg.topic);\nif (msg.payload == false)\n{\n    //\n    msg = {payload: '<font color=\\\"lime\\\" ><i class=\"fa fa-thumbs-o-up fa-2x\" style=\"font-size:8px;\"></i></font>',topic: msg.topic};\n    node.status({fill:\"green\",shape:\"dot\",text:\"Good\"});\n    //\n} else\n{\n    //\n    msg = {payload: '<font color =\\\"red\\\"><i class=\"fa fa-thumbs-o-down fa-2x\" style=\"font-size:8px;\"></i></font>',topic: msg.topic};\n    node.status({fill:\"red\",shape:\"dot\",text:\"Bad\"});\n    //\n}\nreturn msg;","outputs":1,"noerr":0,"x":720,"y":1710,"wires":[["276d56dd.693ab2","45223f3d.94312"]]},{"id":"623bc8c6.fb3ba8","type":"debug","z":"aa48e352.9ad2f8","name":"A","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":720,"y":1670,"wires":[]},{"id":"3741ea70.77930e","type":"inject","z":"aa48e352.9ad2f8","name":"TEST","topic":"test topic","payload":"true","payloadType":"bool","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":210,"y":1770,"wires":[["acaab0ce.aaa4e"]]},{"id":"e8cec37b.05b91","type":"ui_button","z":"aa48e352.9ad2f8","name":"","group":"7fe920c6.daab38","order":3,"width":"0","height":"0","passthru":false,"label":"ACK","tooltip":"","color":"","bgcolor":"","icon":"fa-check-square-o fa-2x","payload":"false","payloadType":"bool","topic":"status ACK","x":380,"y":1770,"wires":[["acaab0ce.aaa4e"]]},{"id":"57ec47d0.2f3fc","type":"ui_button","z":"aa48e352.9ad2f8","name":"","group":"7fe920c6.daab38","order":4,"width":"0","height":"0","passthru":false,"label":"ACK F","tooltip":"","color":"","bgcolor":"","icon":"fa-check-square-o fa-2x","payload":"false","payloadType":"bool","topic":"","x":380,"y":1810,"wires":[["acaab0ce.aaa4e"]]},{"id":"73e2cf63.8cd238","type":"ui_button","z":"aa48e352.9ad2f8","name":"All good/normal","group":"7fe920c6.daab38","order":1,"width":"0","height":"0","passthru":false,"label":"Error","tooltip":"","color":"","bgcolor":"","icon":"fa-check-square-o fa-2x","payload":"true","payloadType":"bool","topic":"undervoltage","x":350,"y":1710,"wires":[["acaab0ce.aaa4e"]]},{"id":"276d56dd.693ab2","type":"ui_text","z":"aa48e352.9ad2f8","group":"7fe920c6.daab38","order":2,"width":0,"height":0,"name":"Under voltage","label":"{{msg.topic}}","format":"{{msg.payload}}","layout":"row-spread","x":920,"y":1710,"wires":[]},{"id":"45223f3d.94312","type":"debug","z":"aa48e352.9ad2f8","name":"B","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":890,"y":1670,"wires":[]},{"id":"7fe920c6.daab38","type":"ui_group","name":"Group 3","tab":"50f4e688.7d4b7","order":3,"disp":true,"width":6},{"id":"50f4e688.7d4b7","type":"ui_tab","z":"","name":"Machine health","icon":"fa-heartbeat","order":4,"disabled":false,"hidden":false}]

[bakman2]

Cannot import the flow due to some unknown node.
But open the function node, what do you see ?

Not sure if that is related to your problem (because I don't understand your problem).

[Trying_to_learn]

I shall check that in a moment.

To all:
Sorry about the FAN node used.

Here is the flow with out the extraneous node.

(Update via edit)

Ok, tried that. No change in the output HOWEVER now I am getting SyntaxError: Unexpected token u in JSON at position 0
which I wasn't getting originally.

Yes, that now kind of points me in the right direction.

But please indulge me in this.

The flow wasn't giving any errors. (Alas now it is showing that one just mentioned)
Why is it that if the msg.topic is not set it doesn't work?

[{"id":"c3ada373.75c6f8","type":"ui_button","z":"3dbe217c.10c666","name":"All good/normal","group":"5f549250.4efd84","order":1,"width":"0","height":"0","passthru":false,"label":"All good/normal","tooltip":"","color":"","bgcolor":"","icon":"fa-check-square-o fa-2x","payload":"false","payloadType":"bool","topic":"undervoltage","x":270,"y":1430,"wires":[["f2de7352.6ecaa8","d262e51b.3f2ee8"]]},{"id":"d262e51b.3f2ee8","type":"function","z":"3dbe217c.10c666","name":"","func":"//node.warn(msg.topic);\nif (msg.payload == false)\n{\n    //\n    msg = {payload: '<font color=\\\"lime\\\" ><i class=\"fa fa-thumbs-o-up fa-2x\" style=\"font-size:8px;\"></i></font>',topic: msg.topic};\n    node.status({fill:\"green\",shape:\"dot\",text:\"Good\"});\n    //\n} else\n{\n    //\n    msg = {payload: '<font color =\\\"red\\\"><i class=\"fa fa-thumbs-o-down fa-2x\" style=\"font-size:8px;\"></i></font>',topic: msg.topic};\n    node.status({fill:\"red\",shape:\"dot\",text:\"Bad\"});\n    //\n}\nreturn msg;","outputs":1,"noerr":0,"x":560,"y":1510,"wires":[["7c072bfa.2aa434","2d250719.1b403"]]},{"id":"f2de7352.6ecaa8","type":"debug","z":"3dbe217c.10c666","name":"A","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":560,"y":1470,"wires":[]},{"id":"d2f04327.6e6f","type":"ui_button","z":"3dbe217c.10c666","name":"","group":"5f549250.4efd84","order":3,"width":"0","height":"0","passthru":false,"label":"ACK","tooltip":"","color":"","bgcolor":"","icon":"fa-check-square-o fa-2x","payload":"false","payloadType":"bool","topic":"status ACK","x":300,"y":1530,"wires":[["d262e51b.3f2ee8","f2de7352.6ecaa8"]]},{"id":"cd8e5472.ba9768","type":"ui_button","z":"3dbe217c.10c666","name":"","group":"5f549250.4efd84","order":4,"width":"0","height":"0","passthru":false,"label":"ACK F","tooltip":"","color":"","bgcolor":"","icon":"fa-check-square-o fa-2x","payload":"false","payloadType":"bool","topic":"","x":300,"y":1570,"wires":[["f2de7352.6ecaa8","d262e51b.3f2ee8"]]},{"id":"8b65df76.a7542","type":"ui_button","z":"3dbe217c.10c666","name":"All good/normal","group":"5f549250.4efd84","order":1,"width":"0","height":"0","passthru":false,"label":"Error","tooltip":"","color":"","bgcolor":"","icon":"fa-check-square-o fa-2x","payload":"true","payloadType":"bool","topic":"undervoltage","x":270,"y":1470,"wires":[["f2de7352.6ecaa8","d262e51b.3f2ee8"]]},{"id":"7c072bfa.2aa434","type":"ui_text","z":"3dbe217c.10c666","group":"5f549250.4efd84","order":2,"width":0,"height":0,"name":"Under voltage","label":"{{msg.topic}}","format":"{{msg.payload}}","layout":"row-spread","x":760,"y":1510,"wires":[]},{"id":"2d250719.1b403","type":"debug","z":"3dbe217c.10c666","name":"B","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":730,"y":1470,"wires":[]},{"id":"5f549250.4efd84","type":"ui_group","name":"Group 3","tab":"3b144469.77f2ec","order":3,"disp":true,"width":6},{"id":"3b144469.77f2ec","type":"ui_tab","z":"","name":"Machine health","icon":"fa-heartbeat","order":4,"disabled":false,"hidden":false}]

[Trying_to_learn]

(sorry....)

Here is the two packets I send from the two buttons.

Packet 1 - works.
{"payload":"<font color =\"red\"><i class=\"fa fa-thumbs-o-down fa-2x\" style=\"font-size:8px;\"></i></font>","topic":"undervoltage","_msgid":"4a71a3d1.8d1b6c"}

Packet 2 - fails
{"payload":"<font color=\"lime\" ><i class=\"fa fa-thumbs-o-up fa-2x\" style=\"font-size:8px;\"></i></font>","_msgid":"3305f8fa.83d798"}

Error:
SyntaxError: Unexpected token u in JSON at position 0

Hmmmmm....

position 0

Looking.

Both packets at position 0:
Same as far as I can see.
{

With this new (previously undeclared) information the only difference is the "topic":"undervoltage",
which is NOT at position 0

[Steve-Mcl]

Hi,

@Trying_to_learn

SyntaxError: Unexpected token u in JSON at position 0

This might be a bug but its not really an issue.

consider this...

• You create a new msg in your function node
  • set payload to "some html" and topic to a value
• In your dashboard text, you use {{msg.topic}} for the label

In your send ACK F button, you havent entered anything for topic so when the new msg is created, topic is undefined and thus never created in your msg object.
Look at the debug output of ACK F...

{
  "payload":false, 
  "socketid":"LYdCuajr81vYqHLgAAAB",
  "_msgid":"3307bd64.678e82"
}

note there is NO topic property in the msg. So when the label {{msg.topic}} is being evaluated, there is nothing to evaluate.

Some questions on your code and design ...

• why are you generating HTML in the FB? Why not send colour and icon as properties of payload - then use a template in the value field. No need for a function block at all.
• Why are you always creating a new msg, just update the one that comes in to the function. This has several benefits (e.g. less wasteful, you can track how things change as it travels through your flow)
• Why are you escaping the quotes? \" it is unnecessary.

Regards, Steve.

[Trying_to_learn]

@Steve-Mcl

Some questions on your code and design ...

• why are you generating HTML in the FB? Why not send colour and icon as properties of payload - then use a template in the value field. No need for a function block at all.
• Why are you always creating a new msg , just update the one that comes in to the function. This has several benefits (e.g. less wasteful, you can track how things change as it travels through your flow)
• Why are you escaping the quotes? \" it is unnecessary.

Hi.

Oh dear. To answer.
1 - I think that is only for the sake of showing what I was chasing for hours.
The real flow is a lot bigger and complex. If you want I can post it to you but it needs a few external nodes.
2 - Thanks. But I am not sure it is applicable for all cases. In this case could you show how it would be different to what I did?
3 - I'll get back to you on that soon.
This is all part of a new schema to which I have been introduced.
Obviously there is a problem somewhere in there either in how I was told or how I am applying it.

@Steve-Mcl

This might be a bug but its not really an issue.

Well, it is an issue if I am (or originally wasn't) using it to find where the problem is.
If it says the wrong place, it doesn't help me understand where to look.

I don't like "telling tales out of school" (or something like that), @afelix has been of great help to me.
In another thread This one reply #13

Yes, if this was just HTML you wouldn’t have to deal with \ . But this is using HTML code inside a JavaScript string in the payload. For JavaScript strings you’ve to wrap the entire thing in quotes. It will see it as string from the first quote until the second. The lime is a string value in HTML, and in HTML you have to wrap attributes in double quotes. If your JavaScript string sees that double quote for the attribute it will consider it the end of the string. So you will have to “escape” the quotes in your HTML. You do that by putting a backslash before it.

So. . . . . that's how I read it.

I am (as I am famous for) missing something.

[Steve-Mcl]

@Trying_to_learn

The real flow is a lot bigger and complex . If you want I can post it to you but it needs a few external nodes.

No need. I now understand. Perfectly acceptable reason.

@Trying_to_learn

But I am not sure it is applicable for all cases. In this case could you show how it would be different to what I did?

You are right however i always recommend reuse of the msg object as good habit. Consider responding to a TCP node, you would lose valuablemsg properties by creating a new msg. In this particular instance, I'm not sure but I suspect the topic property would be present (albeit empty) from the button node and so the error you seen might not occur.

[afelix]

@Trying_to_learn

Yes, if this was just HTML you wouldn’t have to deal with \ . But this is using HTML code inside a JavaScript string in the payload. For JavaScript strings you’ve to wrap the entire thing in quotes. It will see it as string from the first quote until the second. The lime is a string value in HTML, and in HTML you have to wrap attributes in double quotes. If your JavaScript string sees that double quote for the attribute it will consider it the end of the string. So you will have to “escape” the quotes in your HTML. You do that by putting a backslash before it.

@Steve-Mcl

Why are you escaping the quotes? \" it is unnecessary.

Hi Steve, normally I would agree with you here, if it was indeed just HTML you wouldn’t have to escape the quotes. However, it is not. For HTML attributes you’ve to use double quotes, and with the HTML wrapped in a string that is “generated” inside a function node where the chosen string boundary is a double quote too. There’s more than oneway to Rome obviously, but I believe it’s better to not bring in more ways that the code could fail over time by using different string boundaries depending on the kind of contents. Nothing bad about Andrew here, but we all have different ways in how we learn. While escaping can be evaded by using different string quotes, I don’t believe adding more choice is at this stage a good idea, and will only lead to more confusion. KISS in the learning for now. Perhaps in the future, perhaps not at all.

So in summary, what is happening is the payload has an HTML string that’s coming from a function node and is set to the dashboard. There are several topics spread around with previous attempts and using regular payloads as opposed to HTML, but I haven’t read them all yet, I only started reading on this forum in June, and I’m not fully up to date yet with the past topics.

[zenofmud]

@Trying_to_learn

Why is it that if the msg.topic is not set it doesn't work?

Look at what you have in the ui_text node

when a message comes in, and it tries to build the label, what do you think will happen if the msg has no msg.topic??

Should it look to see if the data coming in is empty...maybe but if you form your msgs with a topic it won't be a problem

[Steve-Mcl]

But he has used single quotes in his function node for the string. In inner parts he uses double quotes but unnecessary escapes them. I only ask as it would seem he doesn't understand why. Unless I'm missing something?

[Trying_to_learn]

Paul,

I kind of agree with what you are saying.

However....

For more than an hour I was on the RPI pulling my hair out wondering why it wasn't working.

I hacked it down to a smaller flow and put it on the NUC and studied it relentlessly.

There were no errors reported to me on either machine.

I don't know if it was the changing of the == to === which was suggested by @bakman2 then I started getting the error.
(Though that is in itself erroneous.)

So I am not understanding why it wasn't giving me ANY errors or indications until then.
Nothing.

That's a couple of hours I lost for no real reason.
If the error happened at the get go, no problem.

[zenofmud]

I also notice that all your buttons except ACK F set a topic.....

[Trying_to_learn]

Yeah, the first two set the topic because they are simulating a failure.

The ACK and ACK F buttons:
The F is/was the original button.

It is/was supposed to be enabled by the incoming message and when pressed send an "ACK" kind of message.

So that's why they are like that.

[afelix]

@Steve-Mcl

But he has used single quotes in his function node for the string. In inner parts he uses double quotes but unnecessary escapes them.

Got to admit I haven’t seen the function code in a few days now, will have to look back at those to see. In another topic I’m seeing payloads with double quotes for the string payload, and inside double quotes for the html with escapes for those. Will look at the function code for confirmation when I’m feeling a bit better. Thanks Steve

[zenofmud]

FYI. I opened another thread about the label issue and went back and forth with Dave about it. He fixed a bug dealing with labels in Master

[Trying_to_learn]

I just saw that.

Thanks.

It is also good that the (probably) original problem is seen.

I never got errors.