1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
|
from trame.app import get_server
from trame.ui.html import DivLayout
from trame.widgets import html, trame
# -----------------------------------------------------------------------------
# Trame app
# -----------------------------------------------------------------------------
server = get_server()
state = server.state
# -----------------------------------------------------------------------------
# State setup
# -----------------------------------------------------------------------------
# initial state with only 1 variable
state.a = 1
# Force state.[b,d] to be client side only (+=1 only local + method call will be out of sync)
state.client_only("b", "d")
# state.trame__client_only += ["d"]
def update_variable(var_name="a", delta=+1):
state[var_name] += delta
# -----------------------------------------------------------------------------
# UI setup
# -----------------------------------------------------------------------------
layout = DivLayout(server)
with layout:
trame.LifeCycleMonitor()
# UI helper to extent layout
def create_variable_editor(name):
with layout:
html.Div(
f'Variable "{name}" = {{{{ {name} }}}}',
style="padding: 10px;",
)
with html.Div(style="padding: 10px;"):
html.Button(f"{name} (no args)", click=update_variable)
html.Button(f"{name} +", click=f"{name}+=1")
html.Button(
f"{name} args('{name}', 1)", click=(update_variable, f"['{name}', 1]")
)
html.Button(
f"{name} args('{name}', -1)", click=(update_variable, f"['{name}', -1]")
)
html.Button(
f"{name} kwargs(var_name='{name}', delta=1)",
click=(update_variable, "[]", f"{{ var_name:'{name}', delta:1 }}"),
)
html.Button(
f"{name} kwargs(var_name='{name}', delta=-1) ",
click=(update_variable, "[]", f"{{ var_name:'{name}', delta:-1 }}"),
)
# Start with some UI to control a
create_variable_editor("a")
# -----------------------------------------------------------------------------
# State Listener to a and add new state entries
# -----------------------------------------------------------------------------
@state.change("a", "d")
def state_change(a, b=None, c=None, d=None, **kwargs):
print(f"State updated a={a} b={b} c={c} d={d}")
if a == 5 and not state.has("b"):
state.b = 1
create_variable_editor("b")
state.change("b")(state_change)
if a == 10 and not state.has("c"):
state.c = 1
create_variable_editor("c")
state.change("c")(state_change)
if a == 15 and not state.has("d"):
# Make "d" variable client only...
state.d = 1
create_variable_editor("d")
# -----------------------------------------------------------------------------
# start server
# -----------------------------------------------------------------------------
if __name__ == "__main__":
server.start()
|
