# \[Announce\] node-red-contrib-ui-svg (final beta) UPDATE V1.2.1

**URL:** <https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210>\
**Category:** Share Your Nodes\
**Created:** [2 October 2019 17:46 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210 "2019-10-02T17:46:56Z")\
**Posts on this page:** 20\
**Page:** 2

<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:** [3 October 2019 15:54 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/21 "2019-10-03T15:54:07Z")

</div>

> [@BartButenaers](#):
>
> We just need to do following steps for every flow on our readme (and in the examples directory):

Was not much work. I have updated all the flows, to avoid users having the same problem...

Tooltip has been changed to guide the user toward the Settings tabsheet:

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/b/b24b68385ff0045eeeca345c4f9f38f202051ddb.png)

---

<div class="post-metadata">

**Author:** ![thucar](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/thucar/32/12870_2.png) [@thucar](https://discourse.nodered.org/u/thucar)\
**Post date:** [4 October 2019 05:22 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/22 "2019-10-04T05:22:30Z")

</div>

I've used ComfortClick bOS in the past and the thing I loved the most about it was how easy it was to visualize your data using either floor plans or technical layouts of your boiler room for instance. So I can not wait to give this svg plugin a try. However, I seem to be having some issues with it. I've successfully installed it using npm, ( `npm install bartbutenaers/node-red-contrib-ui-svg`) but now my node editor view comes up blank. It's complaining that it can not find the jschannel library.

`main.js:1050 GET http://192.168.32.50:1880/ui_svg_graphics/lib/jschannel.js?_=1570166131278 404 (Not Found)`

Any ideas on what I missed or botched up?

---

<div class="post-metadata">

**Author:** ![thucar](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/thucar/32/12870_2.png) [@thucar](https://discourse.nodered.org/u/thucar)\
**Post date:** [4 October 2019 05:29 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/23 "2019-10-04T05:29:01Z")

</div>

And of course, after posting I would identify the root cause... my httpAdminRoot path is non standard. As soon as I switch it back to default (/) it works perfectly.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [4 October 2019 06:00 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/24 "2019-10-04T06:00:18Z")

</div>

Hi, could you explain a little further please? This is perhaps something we need to handle.

---

<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:** [4 October 2019 06:08 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/25 "2019-10-04T06:08:45Z")

</div>

Morning @thucar, @Steve-Mcl,  
Normally I always take into account the httpAdminRoot path when I create an http endpoint for my custom nodes. Really thought I had added it also for the SVG node, but seems I have forgotten. Will fix it today !!!

---

<div class="post-metadata">

**Author:** ![thucar](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/thucar/32/12870_2.png) [@thucar](https://discourse.nodered.org/u/thucar)\
**Post date:** [4 October 2019 06:12 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/26 "2019-10-04T06:12:42Z")

</div>

It seems that node-red-contrib-ui-svg expects to find its libraries at a very specific path (`noderedIP:port/ui_svg_graphics/lib/`) which is fine until someone goes into nodered config file and changes their httpAdminRoot path. For isntance, my nodered editor is located at `noderedip:port/editor`  
And in this case, the library path should be `noderedIP:port/editor/ui_svg_graphics/lib/`

So, since the httpAdminRoot is configurable, then it would be good if node-red-contrib-ui-svg could detect and use whatever path is defined in the configuration. To ensure compatibility.

---

<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:** [4 October 2019 06:44 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/27 "2019-10-04T06:44:01Z")

</div>

@Steve-Mcl,  
I have added following fix on Github

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/8/8e16229ead78a06d83345fa7e02d260bb2a7308d.png)

@thucar,  
It still works for my test setup, but would be nice if you could test this as soon as possible. Because I never use the httpAdminRoot, and would be a pitty if my fix is incorrect and I mess up the flows of other test users ...  
P.S. Your post that you have withdrawned contained a good explanation. If you can restore it somehow, I would do that so others can learn from it ...

---

<div class="post-metadata">

**Author:** ![thucar](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/thucar/32/12870_2.png) [@thucar](https://discourse.nodered.org/u/thucar)\
**Post date:** [4 October 2019 07:10 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/28 "2019-10-04T07:10:51Z")

</div>

Thank you for the quick fix @BartButenaers

I'll test it as soon as I can. I've also restored my post. I deleted it because I felt it was irrelevant after you identified the issue and solution.

---

<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:** [4 October 2019 09:17 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/29 "2019-10-04T09:17:09Z")

</div>

> [@BartButenaers](#):
>
> Because I never use the httpAdminRoot

I fell foul of similar issues uibuilder as well! Now I keep my dev PC with projects, httpAdminRoot and httpRoot set.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [4 October 2019 09:22 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/30 "2019-10-04T09:22:07Z")

</div>

> [@BartButenaers](#):
>
> Will fix it today

In fairness, pretty sure that was my booboo haha. (Off to check gitblame) 😂

---

<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:** [4 October 2019 10:24 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/31 "2019-10-04T10:24:35Z")

</div>

One of our company policies was "_no shame, no blame, no name"_. But as soon as something went wrong, they said "_wo caused that problem_" 🤣

---

<div class="post-metadata">

**Author:** ![nisiyama](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nisiyama/32/85_2.png) [@nisiyama](https://discourse.nodered.org/u/nisiyama)\
**Post date:** [4 October 2019 16:37 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/32 "2019-10-04T16:37:15Z")

</div>

Great work!  
By the way, in the current implementation, there is no `order` property defined in the first object argument of `addWidget` call.  
The `order` property controls the UI widget placement and is a required parameter.  
Please consider adding: `order: config.order,`

---

<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:** [4 October 2019 20:46 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/33 "2019-10-04T20:46:03Z")

</div>

> [@nisiyama](#):
>
> The `order` property controls the UI widget placement and is a required parameter.

Hi Hiroyasu (@nisiyama),  
Thanks!!  
About the `order` property:

- Seems I have never used that for my UI nodes (e.g. [node-red-contrib-ui-heatmap](https://github.com/bartbutenaers/node-red-contrib-ui-heatmap/blob/master/heat_map.js)) and none of the users have ever complaint about that. So I'm wondering now what it is being used for, if nobody notices it?
- I see that other nodes (e.g. [node-red-contrib-ui-led](https://github.com/Adorkable/node-red-contrib-ui-led/blob/master/led.js#L41)) don't use it. If it so important, wouldn't it be a good plan to create a quick pull request for all those nodes. There are very few UI nodes currently, and others will look at the code of those nodes to start creating new UI nodes ...
- I see that all UI nodes in [node-red-ui-nodes](https://github.com/node-red/node-red-ui-nodes) are already using the `order`, so that is already covered.

Bart

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [4 October 2019 21:11 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/34 "2019-10-04T21:11:38Z")

</div>

It is mandatory. I struggled with it in early days of ui-level couple of days before i found it was missing. It will be affect placement of widgets if ther is more than one to show.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [4 October 2019 21:45 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/35 "2019-10-04T21:45:26Z")

</div>

@BartButenaers i seen issues with random reordering of buttons and text items in relation to our SVG node during development. I forgot to query it but now thinking it's related?. Perhaps @nisiyama, @hotNipi or @dceejay can confirm this is the side effect of not having the `order` property?

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [4 October 2019 21:49 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/36 "2019-10-04T21:49:40Z")

</div>

Yes it is... needs to be there. happy patching weekend 🙂

---

<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:** [4 October 2019 21:51 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/37 "2019-10-04T21:51:25Z")

</div>

Have added it now to Github. Will trust everybody blindfolded 🤨

---

<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:** [4 October 2019 22:13 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/38 "2019-10-04T22:13:19Z")

</div>

> [@Steve-Mcl](#):
>
> i seen issues with random reordering of buttons and text items in relation to our SVG node during development

@Steve-Mcl: Ooh, now indeed I remember... Would never have linked that weird behaviour to the `order` property.

---

<div class="post-metadata">

**Author:** ![thucar](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/thucar/32/12870_2.png) [@thucar](https://discourse.nodered.org/u/thucar)\
**Post date:** [5 October 2019 00:55 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/39 "2019-10-05T00:55:48Z")

</div>

Sorry for the delay. I was not able to test it until now. Good news is - it works exactly as expected! I could switch back to my preferred httpAdminRoot without any issues.

Thanks again for the quick patch!

---

<div class="post-metadata">

**Author:** ![nisiyama](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nisiyama/32/85_2.png) [@nisiyama](https://discourse.nodered.org/u/nisiyama)\
**Post date:** [5 October 2019 01:27 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210/40 "2019-10-05T01:27:29Z")

</div>

> [@BartButenaers](#):
>
> Have added it now to Github.

Thank you!

@dceejay It might be better to add a feature to check existence of required parameters of `addWidget`.

[Previous page](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210.md?page=1)

[Next page](https://discourse.nodered.org/t/announce-node-red-contrib-ui-svg-final-beta-update-v1-2-1/16210.md?page=3)