The icon is WHITE.
Yes because your html is not correct. I would recommend to use the template node so you that you can format/read it more consistently
<font color='rgb(200,0,0)'></font>
<i class='fa fa-bullseye fa-2x'></i>
vs:
<font color='rgb(200,0,0)'>
<i class='fa fa-bullseye fa-2x'></i>
</font>
But the reason the color is not rendering is caused by angular and its scoping.
brb.
correct format:
<i class='fa fa-bullseye fa-2x' ng-style="{color:'rgb(200,0,0)'}"></i>
I tried it both ways
<font color='rgb(200,0,0)'></font> <i class='fa fa-bullseye fa-2x'></i>
and
<font color='rgb(200,0,0)'> <i class='fa fa-bullseye fa-2x'></i> </font>
Neither work.
I know. It is my fault... I am upset by how stupid I am in that I am not remembering things. But alas this is beyond my control. (Reasons unknown)
I am trying to keep myself active - and by that I don't mean wasting your time. I am trying to get things sorted out. As soon as I think I have that. I discover it is wrong.
It is not a nice feeling that every day when I get up: what I knew yesterday is now invalid.
I see you are replying, but I think I had better post this:
Sorry, it gives an error.
If I add a , at the end I get: unclosed regular expression
There is a ezelsbruggetje (didnt know that that translated to mnemonic) to memorize the concept
<> = begin
</> = end
...
<font> = font begin
</font> = font end
...
everything in between is formatted according to the font format.
<font color="red">
<i class='fa fa-bullseye fa-2x'></i>
</font>
In this case that doesnt fly because of the framework that is used in the dashboard, which strips those inline styles.
Your error:
{"payload":string}
vs
{"payload":"string"}
Sorry..... This is really starting to make my head spin, and it isn't your fault.
From what I remember - if it is worth anything - is that <font> <i class .... </i></font> was ok.
because it wraps the <i> part.
What I can't have is <font>..... <i> </font></i> That's fair enough.
What I have done (for better or worse) is I am using an inject node to inject the value directly and the payload is as show.
That's not exactly true. The message is created in this node.
Once I get that working, I will then be able (I hope) to go a level up and then use the rgbStr which is a variable.
But I seem to be lacking the understanding of how to now get that working.
This is what is in the function node:
msg.device = "TABBYCAT"; // for testing
var dev = msg.device; // set this for later use.
msg = {
"payload":<i class='fa fa-bullseye fa-2x' ng-style="{color:'rgb(200,0,0)'}"></i>
// That is copy/pasted from what you gave me.
"device": dev
}
return msg;
It (Node-Red) doesn't like it.
Yes, I messed up something. It is so frustrating not being able to see it.
And sorry for wasting your time.
As already suggested, the bit after the colon must be a string. You need double quotes round it, and also you need to escape the double quotes inside there using \".
Ok i put that string into a template node directly:
<i class='fa fa-bullseye fa-2x' style='color:rgb({{msg.payload.color}})'></i>
The payload send is like:
m = {}
m.color = "200,0,0"
return {payload:m}
ie.
{"payload":{"color":"200,0,0"}}
( i had some trouble formatting it correctly, can drop the ng-style, style works)
Colin,
Thanks, but honestly. I can't resolve that.
"{color:'rgb(200,0,0)'}" is a matched set of " and ok, that is going to be nested inside the new " I am about to wrap this in.
But
and also you need to escape the double quotes inside there using
\"
I don't have a ladder tall enough to understand what that means. Sorry.
"payload":"<i class='fa fa-bullseye fa-2x' ng-style=\"{color:'rgb(200,0,0)'}\"></i>"
The \ before the embedded quotes escapes them so they are not interpreted by javascript as string delimiters.
Yeah, ok again: Thanks.
But I a missing how to get that in the function node.
If I put that where the other line is/was I get the same error:
unclosed regular expression.
And (way off topic) I am also missing something because I can not seem to get code printed here as you did in post #19 of this thread.
How did you get that?
I thought it was 3 x "`" these guys. But it isn't.
Or it doesn't do it when I do it. It all comes out on one line.
Post the function code, you have made an error. You have escaped both the embedded double quotes I hope.
Edit, use the </> button. Start a new line first.
If you want to send formatted html to a template node, you need to use msg.template instead
Example:
color = "200,0,0"
msg.template ="<i class='fa fa-bullseye fa-2x' style='color:rgb("+color+")'></i>"
return msg;
Connect it to a template node, any content will be overwritten by the msg.template.
Here's the code:
[{"id":"180f4891.538f47","type":"inject","z":"a1911aa3.c45be8","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":570,"y":2220,"wires":[["497b5cc9.9dd91c"]]},{"id":"497b5cc9.9dd91c","type":"function","z":"a1911aa3.c45be8","name":"","func":"msg.device = \"TABBYCAT\";\n\n//var x = msg.payload.split(\",\");\n//node.warn(\"X \"+x)\n\n//var y = x[2];\n//node.warn(y);\n\nvar dev = msg.device;\n\n//var spl = msg.payload.split(\",\");\n//var rgbPart = spl[0]; //get the rgb part (element 0)\n//var idPart = spl[1]; //get the id part (element 1)\n//var rgb = spl.slice(2); //get remaining parts (elements 2 ~ the end)\n//var rgbStr = rgb.join(\",\"); // join these last three parts by comma back to a string\n\nmsg = {\n\n \"payload\":\"<i class='fa fa-bullseye fa-2x' ng-style=\\\"{color:'rgb(200,0,0)'}\\\"></i>\",\n\n\n// \"payload\":\"<i class='fa fa-bullseye fa-2x' ng-style=\"{color:'rgb(200,0,0)'}\"></i>\"\n\n// \"payload\":\"<font color='rgb(200,0,0)'><i class='fa fa-bullseye fa-2x'></i></font>\",\n \"device\": dev\n}\nreturn msg;\n\n//set the payload as required - example...\n//msg.payload = {\n// id: idPart,\n// rgb: rgb,\n// rgbStr: rgbStr\n//}\n//return msg;\n\n\n\n\n\n//node.warn(msg.colour)\n\n//return msg;","outputs":1,"noerr":0,"x":720,"y":2220,"wires":[["d4b19fd2.f4c96"]]},{"id":"d4b19fd2.f4c96","type":"switch","z":"a1911aa3.c45be8","name":"","property":"device","propertyType":"msg","rules":[{"t":"cont","v":"Marvin","vt":"str"},{"t":"cont","v":"S5","vt":"str"},{"t":"cont","v":"TABBYCAT","vt":"str"}],"checkall":"true","repair":false,"outputs":3,"x":900,"y":2180,"wires":[[],[],["cd36d859.72e13","ccf5ab11.7c97c"]]},{"id":"cd36d859.72e13","type":"debug","z":"a1911aa3.c45be8","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":1110,"y":2240,"wires":[]},{"id":"ccf5ab11.7c97c","type":"ui_text","z":"a1911aa3.c45be8","group":"ef4cdff9.3f4b4","order":0,"width":"2","height":"1","name":"","label":"S5","format":"{{msg.payload}}","layout":"row-spread","x":1110,"y":2180,"wires":[]},{"id":"ef4cdff9.3f4b4","type":"ui_group","z":"","name":"Mobile devices","tab":"325a9fd4.22bde8","order":4,"disp":true,"width":"6","collapse":false},{"id":"325a9fd4.22bde8","type":"ui_tab","z":"","name":"Big device status","icon":"mi-drag_indicator","order":2,"disabled":false,"hidden":false}]
This is what I see in the debug node:
{"payload":"<i class='fa fa-bullseye fa-2x' ng-style=\"{color:'rgb(200,0,0)'}\"></i>","device":"TABBYCAT","_msgid":"1b2205f5.e25eba"}
The ...... text node.... WHITE.
Shouldn't it be RED?
You said it was generating a regex error. I don't see that.
When I said to post the function node code, I meant to copy it from the function node and paste it in using the </> button so I could see what was wrong.
No, I said.....
Post 30. But even before then. 29, 22.....
I posted the entire flow so there are no other hidden monsters which may be further complicating the already storm in a tea cup problem.
Is it generating a regular expression error?
As per the screen shot:
Though that is an old error and it was resolved with the \" trick I was since shown.
But when the flow - posted - is run: the text node is WHITE, and not RED which is the goal at this point.
Once I can get that working, I will then modify the code to accept the msg.payload stuff to control the colour. THEN, I will put it in the real flow.
Post 32.
It is the entire flow. the message seen in the debug node and a screen shot of the text node.
As said: It should be red - looking at the rgb part of the message. It is white.
Something - somewhere - isn't playing the game.
Your flow is using a ui-text node, this appears to be stripping off inline styles, hence default color: white.
It works with a template node (as shown above).
Please indulge me why it works on other machines?
I can't dispute what you are saying. I wanted to get the bulls eye to appear and be colour controlled by a message.
Sure a different message, etc etc. But controlled.
I got the code from another machine and stuck it here expecting it (or them to be on the same page.)
Seems they aren't.
Why? I don't know. Yes: It is my problem (and/or fault).
The colour has been RED at one point. So it can change colour. So that is another twist to things. But I am not interested - well, maybe I am - in that. I just want it to do what it was doing on the other machine, only on this one with a slightly different message.
So I shall try a template node now.
brb.
Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarksā¢ or registeredĀ® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.
The OpenJS Foundation | Terms of Use | Privacy Policy | OpenJS Foundation Bylaws | Trademark Policy | Trademark List | Cookie Policy