Skip to content

Instantly share code, notes, and snippets.

@cerebrate
Created April 17, 2017 11:37
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save cerebrate/9d8b6662408a036b77ccc851a0f8df52 to your computer and use it in GitHub Desktop.
Save cerebrate/9d8b6662408a036b77ccc851a0f8df52 to your computer and use it in GitHub Desktop.
Checkmark for Ui_template

An extremely simple Boolean-powered checkmark in a ui_template. I use it to indicate the status of IoT devices, but it could be used to indicate pretty much any two-state value.

[
{
"id": "dc884fe.e4387b",
"type": "ui_template",
"z": "a2a0f621.d83018",
"group": "5627adc5.5dddd4",
"name": "state",
"order": 0,
"width": 0,
"height": 0,
"format": "<style>\n i.off {color: red;}\n i.on {color: green;}\n</style>\n<div layout=\"row\" layout-align=\"space-between\">\n <p>Example State</p>\n <p><i ng-class=\"{false:'fa fa-exclamation-circle off', true:'fa fa-check-circle on'}[(msg.payload || false)]\"></i></p>\n</div>\n",
"storeOutMessages": true,
"fwdInMessages": true,
"x": 1350,
"y": 420,
"wires": [
[]
]
},
{
"id": "5627adc5.5dddd4",
"type": "ui_group",
"z": "",
"name": "Examples",
"tab": "8656b654.3d56f8",
"order": 1,
"disp": true,
"width": "6"
},
{
"id": "8656b654.3d56f8",
"type": "ui_tab",
"z": "",
"name": "Examples",
"icon": "dashboard",
"order": 4
}
]
@Werner-G
Copy link

Like this little node very much, also because I'm able to change colors or Icons on the fly. Can you please give me any help to change the icons to a bigger (normal) size, and also how to change from boolean to a number input ('0' / '1'). Thanks for this!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment