Layout Editor - Results not reflected in Dashboard View

Dear Forum Members- I apologize if this is a stupid question. Working on my first application, a Ham Radio Antenna Tuner.

I have used the layout editor to edit a 6 unit wide group to place one 4 unit button on the right, and two 4 unit buttons on the left. They still appear "Left Justified" on the dashboard and on my connected devices.

The layout editor appears to create the correct spacers. (Just upgraded node, node-red, and dashboard to latest - no help.)

Is there a global setting I can't find?

(I've worked on this for two days, and tried hundreds of combinations.
Also "googled" and scanned this forum
Picture is of layout editor, object sidebar, and browser representation.)

Any help is appreciated.

HI am welcome to the forum.

Please don't. It is better to ask. Stupid questions are my domain. Just ask a few people here.

I would suggest you open the editor on the right of the screen and rather than doing layouts, add a "spacer" and make it 1 x 2 size (1 hight x 2 wide) and put it in front of the first button.

That may help you get the layout you desire.

I know this more advanced layout thing is supposed to be the bees knees but I've not really used it.

Good luck and I hope you enjoy playing with node-red.

Dear Trying_to_learn:

Thanks for the kind reply. In the example (Picture) i posted, there is a 2x1 spacer ahead of the first button in the hierarchy list. I have also tryed manually creating spacers and not using the Layout Editor. Interestingly, spacers work fine to put space between objects, but don't affect the alignment of buttons and other controls.

I appreciate the help. Thanks.
I am going to try placing two buttons side by side and see in the alignment engine obeys that.!

Post a screen shot.

Sometimes the spacer doesn't go where you want it and you have to put it where you want it.

See example.

Screenshot from 2020-06-08 13-19-57

Because if it is at the end of the list, it won't do much.

The picture I showed is only an example to illustrate what I mean.
You will see different stuff on your screen.

But I hope this is enough to show you what you need to do.

You may need to look at the end of the list of things in that group to see the spacer.

Dear Trying_to_learn:

I did post a screenshot. Perhaps I did something wrong and it is not showing. (I can see it though, when I browse the forum.)

I'm new to the forums as well, so I might have botched the upload and not assigned permissions or something.

I will try to figure out why you can't see the screen shot.

Thank s for your kind reply.

Eric.

Ok.

Open the window as in the screen shot.

DRAG the spacer down one line then let go.

Then, DRAG the spacer back to the top and let go.

Redeploy the flow and see what happens.

Dear Trying_to_learn.

Thanks for the suggestion.

Just tried that. No Improvement, shucks - that seemed to help some things a few dashboard versions back :slight_smile:

I have now noticed that in any of my groups, None of the spacers work any more - since I started experimenting.
I’m pretty sure that something is broken in the layout engine. I’m going to delete ALL my spacers (only about 20) and then manually try again.

TLDR:
(I got this all to work fine by manually inserting spacers since I started this project last fall. The groups that I did not use the layout tool worked until today.)
I’ll keep fiddling with it. (I’m also try to figure out how to change the CSS canvas size so that my app does not scale to 6 units across when viewed with a phone.

(The dashboard is smart enough to tell the difference between computer screen and phone, and arranges things differently - by design I read.)

Thanks again.

Bye.

Can you stop node red and restart it in a terminal please, and post the log here. I would like to see what versions of everything you are using as the symptom you see should definitely not happen.

Dear Colin:

Thanks for the reply, I appreciate expert eyes.

Here's the startup ..

willard@willard-ThinkPad-T61:~$ node-red
8 Jun 09:42:32 - [info]

Welcome to Node-RED

8 Jun 09:42:32 - [info] Node-RED version: v1.0.6
8 Jun 09:42:32 - [info] Node.js version: v9.11.2
8 Jun 09:42:32 - [info] Linux 5.3.0-53-generic ia32 LE
8 Jun 09:42:32 - [info] Loading palette nodes
8 Jun 09:42:33 - [info] Dashboard version 2.22.1 started at /ui
8 Jun 09:42:33 - [info] Settings file : /home/willard/.node-red/settings.js
8 Jun 09:42:33 - [info] Context store : 'memoryOnly' [module=memory]
8 Jun 09:42:33 - [info] Context store : 'file' [module=localfilesystem]
8 Jun 09:42:33 - [info] User directory : /home/willard/.node-red
8 Jun 09:42:33 - [warn] Projects disabled : editorTheme.projects.enabled=false
8 Jun 09:42:33 - [info] Flows file : /home/willard/.node-red/flows_willard-ThinkPad-T61.json
8 Jun 09:42:33 - [info] Server now running at http://127.0.0.1:1880/
8 Jun 09:42:33 - [info] Starting flows
8 Jun 09:42:33 - [info] Started flows

Spacers have been "flakey" since I started with Node-Red last fall, but I could get them to work with a LOT of effort. Never discovered the layout editor until a week ago - when It really got bad :slight_smile:

Gotten worse with updates and use (strange). Now, completely broken, even if created manually rather than with layout editor.

Thanks a bunch. I might do a fresh install on another computer if I can find one. (Maybe the wife's old laptop :slight_smile )

How did you end up with nodejs v9? That has never been a supported version. I don't know whether that is the problem but I would fix it first. Versions supported by node red are 8, 10 and 12, but 8 is no longer maintained so I suggest 10 or 12.

Dear Colin:

Thanks for the note. I'll upgrade right away.
I hope to post success...

I did npm update -g nodejs@latest (Not exact but something similar yesterday, trying to fix.)

Thanks.
Eric.

That isn't how to update nodejs. How did you install node-red and nodejs originally?
What OS are you running on?

Dear Colin:

Sorry, but I was confused. I actually used 'sudo n stable'

Why I got 9, I couldn't tell. Trying to get n to find 12.18.0, but the filename asked for is incorrect compared with

I used n to delete the 9.11.2 install, and then used "sudo n latest' and still got number 9.11.2.

I don't want to waste your time with my messed up software suite. If this isn't a common problem, I'll just format the disk and do a clean install. (Might fire up a vm, instead of using wife's old laptop....)

Thanks.

Eric.

Dear Colin:

After looking through https://nodejs.org/dist/...

I have determined that My "N" application is trying to download an X86 linux package, and version 9 is the most recent version that is X86 - I guess I need to find a 64-Bit computer and start over.

N is looking for node-v12.18.0-linux-x86.tar.xz when I ask for a particular version, Which does not exist in the repository.

Thanks again for your kind response.

Yes, I think 32 bit machines have pretty much reached the end of the road, though you might still be able to get nodejs 8, I don't know
If you find a another machine and are using a Debian based OS such as Ubuntu then you can use the Pi/Debian install script to install everything node-red related.

Dear Colin (and Andrew).

Thanks to you both for your comments. A new VM with Fedora - and a new install using node-red.org script and then the palette manager to add dashboard - got me a working system.

It turns out that "n" and npm are both smart enough to look for the "newest" modules one's hardware might support. So even though I regularly update everything, I was stuck on an unsupported version (9.x.x) of nodejs.

Interestingly, the hardware shows a Core 2 Duo in "system config", but the installers kept looking for X86 versions anyway. I guess you need a "REAL" 64 bit machine instead of one intel just advertises as such. (My copy of Lubuntu claims to be 64 bit!)

Thanks again for your help. It's nice to know "It's broken" or "it's You" when trouble shooting.

Now running Fedora 32 and node-red in a VM on my Mac mini. Runs well.

Eric.

FYI - there are a bunch of unofficial builds of nodejs for several platforms including 32bit x86 platforms etc... Work just fine - but obviously n etc won't know about them.
https://unofficial-builds.nodejs.org/download/release/

Dear deejay:

Thanks for the note. By watching the console as I ran "n 13.x.x", I could see the url it was trying to use for download - which contained the "13.X.X.linux-X86.tar.xz" string. That did not exist in the repository "n" was looking in. The latest in that repository was 9.x.x so the manual update using npm was successful in finding the 9.x.x. image and installing it.

It only took an hour to spin up a Fedora VM and run your script, and then add dashboard. Note more weird quirks. The viewport now works correctly on phones, tablets, and PC's too! Yay!

Thanks to you and your group for such fine work. BTW... In a "secret" meeting when I worked at IBM HQ back in the late 80's - I saw a primitive demo of the forerunner of node-red.
Glad to see you guys keeping things alive.

Eric.

Here's a picture of Success. (The positions of the button in the flow editor are just for looks!)

Thanks to all - Issue is user error - Closed!

Keywords:
Dashboard
Spacers
Solved
Fixed

Eric.

While indeed Paul Morrison did come up with the concept of Flow Based Programming, I can assure you that Node-RED was created out of thin air (mainly) by Nick and myself, and it's pure co-incidence we all work at IBM :slight_smile:

1 Like