Dynamically Adding Windows using Golden Layout

Hello HoloViz Community,

I wanted to ask if anyone has been able to dynamically add windows to the main area of their Golden layout app?

My current configuration is as follows,

import panel as pn

add_btn = pn.widgets.Button(name='Add window', width=150)

a = pn.Column("test",name='A')

def add_window(event):
    golden.main.append(pn.Column("Oi", name='New Tab'))

add_btn.on_click(add_window)

golden = pn.template.GoldenTemplate(title="Add Window Test")
golden.sidebar.append(add_btn)
golden.main.append(a)
golden.show()

I am essentially trying to instantiate more windows by clicking the button on the sidebar. For context, I am building small scale tests to understand the behavior but eventually I plan to have buttons in the sidebar that will instantiate separate plots.

In regards to this topic, I found an old post of someone trying something similar but unfortunately did not get their question answered on the GitHub page for Panel.

Appreciate any help or input!

Update 1: So the functionality works - kind of. After clicking the ‘Add Window’ button nothing happens but when you click the top left of the header where the title is to refresh the page, you can see it adds another window to main after selecting the button on the sidebar.

Hi,
have you found solution to this? It indeed works but doesn’t work dynamically, only after refreshing the page. It would be cool if it was possible to add and remove windows dynamically.
Cheers

Not yet, as a team we put it on the back-burner for the moment since it will need a lot more work to figure out why its not working the way we wanted it to. I know within the Golden Layout Documentation there is a chance to get it implemented but a common theme I’ve seen within panel is that you need to instantiate what components you want from the get go (More or less like setting the foundation to a house). So its not that easy to dynamically add things, the closest thing I found was using the “Tabs” widget. If I come across the post, I’ll update this post with the link.

@russkev @bluedevil947 I don’t think the templates are set up currently to append components to dynamically (correct me if I am wrong @philippjfr, I would love to know how to do it if so), but most of the rest of panel can be updated dynamically. And you can get a very similar looking app with using tabs and a different template. Here is an example below.

import panel as pn

add_btn = pn.widgets.Button(name='Add window', width=150)

tabs = pn.Tabs(
    ("0", pn.Column("test")),
    ("1", pn.Column("test")),
    ("2", pn.Column("test")),
    closable=True
)

def add_window(event):
    tabs.append((str(len(tabs)), pn.Column("test")))


add_btn.on_click(add_window)

template = pn.template.BootstrapTemplate(title="Add Window Test")
template.sidebar.append(add_btn)
template.main.append(tabs)
template.show()

tabs can be appended to dynamically, and by setting closable=True, you can create almost the same look as you get with the Golden template, I picked the Bootstrap theme almost randomly, so you should be able to use most themes, and you could put this almost anywhere in the page as well, not just where it is in the Golden theme. Does this do what you want it to?

In theory it might be possible to add a handler to templates to handle root added events that would make this possible. A feature request to that effect would be appreciated.

1 Like

Though you should probably first consider whether a refactor into a Golden layout (i.e. like Column etc) would make sense :+1: