# Custom node appearance and event handlers. Proof on concept: Inline Gauge

**URL:** <https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001>\
**Category:** Core Development\
**Tags:** ui-widgets\
**Created:** [18 November 2023 23:47 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001 "2023-11-18T23:47:36Z")\
**Posts on this page:** 8\
**Page:** 3

<div class="post-metadata">

**Author:** ![cymplecy](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cymplecy/32/2773_2.png) [@cymplecy](https://discourse.nodered.org/u/cymplecy)\
**Post date:** [23 November 2023 06:27 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001/41 "2023-11-23T06:27:33Z")

</div>

> [@cymplecy](#):
>
> on the same web-page

is the key here 🙂 Integrated

Split screening is OK if only working on one thing but i find it very inconvenient when switching between different apps and webpages in real life

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [23 November 2023 06:36 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001/42 "2023-11-23T06:36:38Z")

</div>

> [@dceejay](#):
>
> The examples given so far seem within reach of decent developers

For all the developers ever looking for this: the code from the inline gauge is available [here](https://github.com/johnebgood/node-red-contrib-inline-gauge). @johnebgood if you ever find the time to write down (e.g. in the wiki of your repo) some of your ideas (why you did it like that, the pitfalls, and so on...), that would helpfull. For me at least... Thanks!

---

<div class="post-metadata">

**Author:** ![jackcarey](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jackcarey/32/61101_2.png) [@jackcarey](https://discourse.nodered.org/u/jackcarey)\
**Post date:** [23 November 2023 09:00 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001/43 "2023-11-23T09:00:42Z")

</div>

How would you feel about having a new node in `uibuilder` that could extract a property named something like `uib` from other nodes in order for them to package their own HTML, UI, or `ui-builder` config? Do you think there is enough potential to make this worth investigating?

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [23 November 2023 15:57 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001/44 "2023-11-23T15:57:29Z")

</div>

> [@jackcarey](#):
>
> How would you feel about having a new node in `uibuilder`

I am most certainly always open to new ideas. 🙂

> [@jackcarey](#):
>
> that could extract a property named something like `uib` from other nodes in order for them to package their own HTML, UI, or `ui-builder` config? Do you think there is enough potential to make this worth investigating?

Shall we take this to a new thread to discuss? I'd like to understand a bit more about your idea, not sure I've entirely grasped it yet.

There is something on the backlog I've had for quite a while (I think it is still there - the backlog is a bit large!) to help facilitate 3rd-party nodes for uibuilder. So certainly worth a discussion.

---

<div class="post-metadata">

**Author:** ![jackcarey](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jackcarey/32/61101_2.png) [@jackcarey](https://discourse.nodered.org/u/jackcarey)\
**Post date:** [26 November 2023 12:25 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001/45 "2023-11-26T12:25:21Z")

</div>

Sure, I made a thread here: [Third-party UI in ui-builder](https://discourse.nodered.org/t/third-party-ui-in-ui-builder/83196)

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [8 December 2023 08:02 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001/46 "2023-12-08T08:02:16Z")

</div>

For people that are wondering how a Node-RED flow editor as a dashboard would look like, you should have a look at the banners used in the official Node-RED blogs. For example [this](https://flowfuse.com/blog/2023/12/dashboard-0-10-0/) one:

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/4/845e384f6fe82fc3a004263b34a11ef95c907e96.png)

But be aware that these images are only teasers 😋  
Now I will shut up forever about this topic.  
Promised!!! (so 😇 and not 🤥 ).

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [8 December 2023 12:09 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001/47 "2023-12-08T12:09:52Z")

</div>

\*\* Official "FlowFuse", not "Node-RED", have to be sure on the differentiation. This is also just an artistic license to show what I built in the tutorial, I do like interfaces like [https://www.einblick.ai/](https://www.einblick.ai/) though

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [6 February 2024 12:10 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001/48 "2024-02-06T12:10:40Z")

</div>

Closed on 6 February 2024 12:10 UTC

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.

[Previous page](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001.md?page=2)