"""
Example that demonstartes how one can connect to events deep in the
hierachy. Instead of using the star notation to select all children,
one can use a double-star to select also the children's children, and
their children, etc.
"""
from flexx import app, event, ui
class DeepEventConnections(ui.Widget):
def init(self):
# Put a label and some sliders deep in the hierarchy
with ui.HBox():
with ui.VBox(flex=1) as self.box:
self.label = ui.Label()
for i in range(5):
ui.Slider(value=i/5)
class JS:
@event.connect('children**.value')
def on_slider_change(self, *events):
# Show sum of slider values in the label
v = 0
for s in self.box.children:
if hasattr(s, 'value'):
v += s.value
self.label.text = 'Sum of slider values is ' + str(v)
if __name__ == '__main__':
m = app.launch(DeepEventConnections)
app.run()