async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'range_slider={q.args.range_slider}'),
ui.text(f'range_slider_step={q.args.range_slider_step}'),
ui.text(f'range_slider_disabled={q.args.range_slider_disabled}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(
box='1 1 4 10',
items=[
ui.range_slider(name='range_slider', label='Default slider'),
ui.range_slider(name='range_slider_step',
label='Step slider',
min=0,
max=1000,
step=100,
min_value=0,
max_value=100),
ui.range_slider(name='range_slider_disabled',
label='Disabled slider',
min=0,
max=100,
step=10,
min_value=0,
max_value=70,
disabled=True),
ui.button(name='show_inputs', label='Submit', primary=True),
])
await q.page.save()
async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'toggle_unchecked={q.args.toggle_unchecked}'),
ui.text(f'toggle_checked={q.args.toggle_checked}'),
ui.text(
f'toggle_unchecked_disabled={q.args.toggle_unchecked_disabled}'
),
ui.text(
f'toggle_checked_disabled={q.args.toggle_checked_disabled}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(
box='1 1 4 10',
items=[
ui.toggle(name='toggle_unchecked', label='Not checked'),
ui.toggle(name='toggle_checked', label='Checked', value=True),
ui.toggle(name='toggle_unchecked_disabled',
label='Not checked (Disabled)',
disabled=True),
ui.toggle(name='toggle_checked_disabled',
label='Checked (Disabled)',
value=True,
disabled=True),
ui.button(name='show_inputs', label='Submit', primary=True),
])
await q.page.save()
def card_place_order(q: Q) -> ui.FormCard:
item_list = []
for i, item in enumerate(q.client.items.keys()):
text = ui.text_xl(f'{item}')
gpo_order = ui.slider(name=f'gpo_order_{i}',
label='How many to order from GPO?',
min=0,
max=q.client.items[item].max_storage,
value=random.randint(0, q.client.max_storage))
alt_order = ui.slider(name=f'alt_order_{i}',
label='How many to order from alt?',
min=0,
max=q.client.items[item].max_storage,
value=random.randint(0, q.client.max_storage))
item_list.extend([text, gpo_order, alt_order])
buttons = ui.buttons([
ui.button(name='make_order', label='Place Order', primary=True),
ui.button(name='go_home', label='Back', primary=True)
])
item_list.append(buttons)
card = ui.FormCard(
box=box_sidebar,
items=item_list,
)
return card
async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'date={q.args.date}'),
ui.text(f'date_placeholder={q.args.date_placeholder}'),
ui.text(f'date_disabled={q.args.date_disabled}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(
box='1 1 4 10',
items=[
ui.date_picker(name='date',
label='Standard date picker',
value='2017-10-19'),
ui.date_picker(name='date_placeholder',
label='Date picker with placeholder',
placeholder='Pick a date'),
ui.date_picker(name='date_disabled',
label='Disabled date picker',
value='2017-10-19',
disabled=True),
ui.button(name='show_inputs', label='Submit', primary=True),
])
await q.page.save()
async def serve(q: Q):
if not q.client.initialized:
q.client.initialized = True
q.page['nav'] = ui.markdown_card(
box='1 1 4 2',
title='Menu',
content=
'[Spam](#menu/spam) / [Ham](#menu/ham) / [Eggs](#menu/eggs) / [About](#about)',
)
q.page['blurb'] = ui.markdown_card(
box='1 3 4 2',
title='Description',
content='Welcome to our store!',
)
q.page['cart'] = ui.form_card(
box='1 5 4 2',
title='Cart',
items=[
ui.text('Your cart is empty!'),
ui.buttons([
ui.button(name=buy_now.__name__,
label='Buy Now!',
primary=True),
ui.button(name='empty_cart', label='Clear cart'),
])
],
)
await q.page.save()
else:
await handle_on(q)
async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'dropdown={q.args.dropdown}'),
ui.text(f'dropdown_multi={q.args.dropdown_multi}'),
ui.text(f'dropdown_disabled={q.args.dropdown_disabled}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(box='1 1 4 10',
items=[
ui.dropdown(name='dropdown',
label='Pick one',
value='B',
required=True,
choices=choices),
ui.dropdown(name='dropdown_multi',
label='Pick multiple',
values=['B', 'D'],
required=True,
choices=choices),
ui.dropdown(
name='dropdown_disabled',
label='Pick one (Disabled)',
value='B',
choices=choices,
disabled=True),
ui.button(name='show_inputs',
label='Submit',
primary=True),
])
await q.page.save()
async def show_issue(q: Q, issue_id: str):
issue = issue_lookup[issue_id]
issue.views += 1
q.client.active_issue_id = issue_id
q.page['form'] = ui.form_card(
box='1 1 4 -1',
items=[
ui.text_xl(f'Issue {issue.id}'),
ui.text(issue.text),
ui.text_xs(f'({issue.views} views)'),
ui.buttons([
ui.button(
name='close_issue'
if issue.status == 'Open' else 'reopen_issue',
label="Close Issue"
if issue.status == 'Open' else "Reopen Issue",
primary=True,
),
ui.button(name='back', label='Back'),
]),
])
await q.page.save()
async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'spinbox={q.args.spinbox}'),
ui.text(f'spinbox_disabled={q.args.spinbox_disabled}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(
box='1 1 4 10',
items=[
ui.spinbox(name='spinbox',
label='Standard spinbox',
min=0,
max=100,
step=10,
value=30),
ui.spinbox(name='spinbox_disabled',
label='Disabled spinbox',
min=0,
max=100,
step=10,
value=30,
disabled=True),
ui.button(name='show_inputs', label='Submit', primary=True),
])
await q.page.save()
async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'combobox={q.args.combobox}'),
ui.text(f'combobox_disabled={q.args.combobox_disabled}'),
ui.text(f'combobox_error={q.args.combobox_error}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(
box='1 1 4 10',
items=[
ui.combobox(name='combobox',
label='Enter or choose a color',
placeholder='Color...',
value='Blue',
choices=combobox_choices),
ui.combobox(name='combobox_disabled',
label='Enter or choose a color',
placeholder='Color...',
value='Blue',
choices=combobox_choices,
disabled=True),
ui.combobox(name='combobox_error',
label='Enter or choose a color',
placeholder='Color...',
value='Blue',
choices=combobox_choices,
error='This combobox has an error!'),
ui.button(name='show_inputs', label='Submit', primary=True),
])
await q.page.save()
async def serve(q: Q):
if q.args.tall_article:
q.page['example'] = ui.form_card(box='1 1 4 6',
items=[
ui.button(name='back',
label='Go back',
primary=True),
])
else:
q.page['example'] = ui.tall_article_preview_card(
box='1 1 4 6',
title='Tall article preview',
subtitle='Click the card',
value='$19',
name='tall_article',
image=
'https://images.pexels.com/photos/3225517/pexels-photo-3225517.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260', # noqa
content=content,
items=[
ui.buttons(items=[
ui.button(name='like', label='Like'),
ui.button(name='comment', label='Comment'),
ui.button(name='share', label='Share'),
]),
])
await q.page.save()
async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'swatch={q.args.swatch}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(box='1 1 4 10',
items=[
ui.color_picker(
name='swatch',
label='Pick a swatch',
choices=[
'#011627',
'#2EC4B6',
'#E71D36',
'#FF9F1C',
'#50514F',
'#F25F5C',
'#FFE066',
'#247BA0',
'#70C1B3',
'#FDFFFC',
]),
ui.button(name='show_inputs',
label='Submit',
primary=True),
])
await q.page.save()
async def serve(q: Q):
if q.args.annotator:
q.page['example'].items = [
ui.text(f'annotator={q.args.annotator}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(
box='1 1 4 10',
items=[
ui.text_annotator(
name='annotator',
title='Select text to annotate',
tags=[
ui.text_annotator_tag(name='p',
label='Person',
color='#F1CBCB'),
ui.text_annotator_tag(name='o',
label='Org',
color='#CAEACA'),
],
items=[
ui.text_annotator_item(text='Killer Mike', tag='p'),
ui.text_annotator_item(
text=' is a member, of the hip hop supergroup '
), # no tag
ui.text_annotator_item(text='Run the Jewels', tag='o'),
],
),
ui.button(name='submit', label='Submit', primary=True)
])
await q.page.save()
async def serve(q: Q):
if not q.client.initialized:
q.page['meta'] = ui.meta_card(box='')
q.page['example'] = ui.form_card(box='1 1 11 10', items=[
ui.button(name='show_side_panel', label='Order donuts', primary=True)
])
q.client.initialized = True
else:
if q.args.show_side_panel:
q.page['meta'].side_panel = ui.side_panel(title='Welcome to store', items=[
ui.text('Donuts cost $1.99. Proceed?'),
ui.buttons([ui.button(name='next_step', label='Next', primary=True)])
])
elif q.args.next_step:
q.page['meta'].side_panel.items = [
ui.text('You will be charged $1.99. Proceed?'),
ui.buttons([
ui.button(name='cancel', label='Back to safety'),
ui.button(name='submit', label='Place order', primary=True),
])
]
elif q.args.submit:
q.page['example'].items = [ui.message_bar('success', 'Order placed!')]
q.page['meta'].side_panel = None
elif q.args.cancel:
q.page['example'].items = [ui.message_bar('info', 'Order canceled!')]
q.page['meta'].side_panel = None
await q.page.save()
def make_blurb(q: Q, example: Example):
blurb_card = q.page['blurb']
blurb_card.title = example.title
blurb_card.subtitle = example.description
# HACK: Recreate dropdown every time (by dynamic name) to control value (needed for next / prev btn functionality).
items = [
ui.dropdown(name=q.args['#'] or default_example_name,
width='300px',
value=example.name,
trigger=True,
choices=[
ui.choice(name=e.name, label=e.title)
for e in catalog.values()
])
]
if example.previous_example:
items.append(
ui.button(name=f'#{example.previous_example.name}',
label='Previous'))
if example.next_example:
items.append(
ui.button(name=f'#{example.next_example.name}',
label='Next',
primary=True))
blurb_card.items = items
async def serve(q: Q):
if q.args.train:
# train WaveML Model using H2O-3 AutoML
copy_expando(q.args, q.client)
q.client.wave_model = build_model(
train_df=q.client.train_df,
target_column='target',
model_type=ModelType.H2O3,
_h2o3_max_runtime_secs=30,
_h2o3_nfolds=2,
_h2o3_include_algos=[q.client.algo]
)
model_id = q.client.wave_model.model.model_id
accuracy = round(100 - q.client.wave_model.model.mean_per_class_error() * 100, 2)
# show training details and prediction option
q.page['example'].items[1].choice_group.value = q.client.algo
q.page['example'].items[2].buttons.items[1].button.disabled = False
q.page['example'].items[3].message_bar.type = 'success'
q.page['example'].items[3].message_bar.text = 'Training successfully completed!'
q.page['example'].items[4].text.content = f'''**H2O AutoML model id:** {model_id} <br />
**Accuracy:** {accuracy}%'''
q.page['example'].items[5].text.content = ''
elif q.args.predict:
# predict on test data
preds = q.client.wave_model.predict(test_df=q.client.test_df)
# show predictions
q.page['example'].items[3].message_bar.text = 'Prediction successfully completed!'
q.page['example'].items[5].text.content = f'''**Example predictions:** <br />
{preds[0]} <br /> {preds[1]} <br /> {preds[2]}'''
else:
# prepare sample train and test dataframes
data = load_wine(as_frame=True)['frame']
q.client.train_df, q.client.test_df = train_test_split(data, train_size=0.8)
# algos
algo_choices = [ui.choice(x, x) for x in ['DRF', 'GLM', 'XGBoost', 'GBM', 'DeepLearning']]
# display ui
q.page['example'] = ui.form_card(
box='1 1 -1 -1',
items=[
ui.text(content='''The sample dataset used is the
<a href="https://scikit-learn.org/stable/modules/generated/sklearn.datasets.load_wine.html" target="_blank">wine dataset</a>.'''),
ui.choice_group(name='algo', label='Select Algo', choices=algo_choices, value='DRF'),
ui.buttons(items=[
ui.button(name='train', label='Train', primary=True),
ui.button(name='predict', label='Predict', primary=True, disabled=True),
]),
ui.message_bar(type='warning', text='Training will take a few seconds'),
ui.text(content=''),
ui.text(content='')
]
)
await q.page.save()
async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'selected={q.args.choice_group}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(box='1 1 4 10', items=[
ui.choice_group(name='choice_group', label='Pick one', value='B', required=True, choices=choices),
ui.button(name='show_inputs', label='Submit', primary=True),
])
await q.page.save()
def form_default(q: Q):
# display when app is initialized
return [
ui.text(content=DATASET_TEXT),
ui.dropdown(name='dai_instance_id', label='Select Driverless AI instance', value=q.client.dai_instance_id,
choices=q.client.choices_dai_instances, required=True),
ui.text(content=STEAM_TEXT, visible=q.client.disable_training),
ui.buttons(items=[
ui.button(name='train', label='Train', primary=True, disabled=q.client.disable_training),
ui.button(name='predict', label='Predict', primary=True, disabled=True),
])
]
def make_blurb(example: Example):
buttons = []
if example.previous_example:
buttons.append(ui.button(name=f'#{example.previous_example.name}', label='Previous'))
if example.next_example:
buttons.append(ui.button(name=f'#{example.next_example.name}', label='Next', primary=True))
return [
ui.text(example.title, size='l'),
ui.text(example.description),
ui.buttons(buttons),
]
async def edit_multiple(q: Q):
q.page['form'] = ui.form_card(
box='1 1 4 -1',
items=[
make_issue_table(allow_multiple_selection=True), # This time, allow multiple selections
ui.buttons([
ui.button(name='reopen_issues', label='Reopen Selected', primary=True),
ui.button(name='close_issues', label='Close Selected', primary=True),
ui.button(name='back', label='Back to safety')
]),
]
)
await q.page.save()
async def serve(q: Q):
if q.args.show_inputs:
q.page['example'].items = [
ui.text(f'selected={q.args.checklist}'),
ui.button(name='show_form', label='Back', primary=True),
]
else:
q.page['example'] = ui.form_card(box='1 1 4 10', items=[
ui.checklist(name='checklist', label='Choices',
choices=[ui.choice(name=x, label=x) for x in ['Egg', 'Bacon', 'Spam']]),
ui.button(name='show_inputs', label='Submit', primary=True),
])
await q.page.save()
def form_training_completed(q: Q):
# display when model training is completed
return [
ui.text(content=DATASET_TEXT),
ui.dropdown(name='dai_instance_id', label='Select Driverless AI instance', value=q.client.dai_instance_id,
choices=q.client.choices_dai_instances, required=True),
ui.buttons(items=[
ui.button(name='train', label='Train', primary=True),
ui.button(name='predict', label='Predict', primary=True)
]),
ui.message_bar(type='success', text='Training successfully completed!'),
ui.text(content=q.client.model_details)
]
def form_training_progress(q: Q):
# display when model training is in progress
return [
ui.text(content=DATASET_TEXT),
ui.dropdown(name='dai_instance_id', label='Select Driverless AI instance', value=q.client.dai_instance_id,
choices=q.client.choices_dai_instances, required=True),
ui.buttons(items=[
ui.button(name='train', label='Train', primary=True, disabled=True),
ui.button(name='predict', label='Predict', primary=True, disabled=True)
]),
ui.progress(label='Training in progress...', caption='This can take a few minutes...'),
ui.text(content=q.client.model_details)
]
def form_default(q: Q):
# display when app is initialized
return [
ui.text(content=DATASET_TEXT),
ui.dropdown(name='dai_instance_id', label='Select Driverless AI instance', value=q.client.dai_instance_id,
choices=q.client.choices_dai_instances, required=True),
ui.text(content=STEAM_TEXT, visible=q.client.disable_training),
ui.slider(name='dai_interpretability', label='Interpretability', min=1, max=10, step=1, value=7),
ui.toggle(name='dai_reproducible', label='Reproducible', value=False),
ui.buttons(items=[
ui.button(name='train', label='Train', primary=True, disabled=q.client.disable_training),
ui.button(name='predict', label='Predict', primary=True, disabled=True),
])
]
def make_blurb(q: Q, example: Example):
blurb_card = q.page['blurb']
blurb_card.title = example.title
blurb_card.subtitle = example.description
buttons = []
if example.previous_example:
buttons.append(
ui.button(name=f'#{example.previous_example.name}',
label='Previous'))
if example.next_example:
buttons.append(
ui.button(name=f'#{example.next_example.name}',
label='Next',
primary=True))
blurb_card.items = buttons
async def serve(q: Q):
links = q.args.user_files
if links:
items = [ui.text_xl('Files uploaded!')]
for link in links:
local_path = await q.site.download(link, '.')
#
# The file is now available locally; process the file.
# To keep this example simple, we just read the file size.
#
size = os.path.getsize(local_path)
items.append(
ui.link(label=f'{os.path.basename(link)} ({size} bytes)',
download=True,
path=link))
# Clean up
os.remove(local_path)
items.append(ui.button(name='back', label='Back', primary=True))
q.page['example'].items = items
else:
q.page['example'] = ui.form_card(box='1 1 4 10',
items=[
ui.text_xl('Upload some files'),
ui.file_upload(name='user_files',
label='Upload',
multiple=True),
])
await q.page.save()
async def serve(q: Q):
if not q.client.initialized:
q.page['meta'] = ui.meta_card(box='')
q.page['controls'] = ui.form_card(
box='1 1 2 2',
items=[
ui.text_xl('This is normal theme'),
ui.button(name='change',
label='Change to see neon theme',
primary=True)
])
q.client.current_theme = 'light'
q.client.initialized = True
meta = q.page['meta']
controls = q.page['controls']
if q.args.change and q.client.current_theme != 'neon':
meta.theme = 'neon'
q.client.current_theme = 'neon'
controls.items[0].text_xl.content = 'This is Neon theme!'
controls.items[1].button.label = 'Back to normal'
elif q.args.change:
meta.theme = 'light'
q.client.current_theme = 'light'
controls.items[0].text_xl.content = 'This is normal theme'
controls.items[1].button.label = 'Change to see neon theme'
await q.page.save()
async def serve(q: Q):
if '#' in q.args:
hash_ = q.args['#']
q.page['nav'] = ui.form_card(box='1 1 2 5', items=[
ui.text(f'#={hash_}'),
ui.button(name='show_nav', label='Back', primary=True),
])
else:
q.page['nav'] = ui.nav_card(
box='1 1 2 5',
value='#menu/spam',
items=[
ui.nav_group('Menu', items=[
ui.nav_item(name='#menu/spam', label='Spam'),
ui.nav_item(name='#menu/ham', label='Ham'),
ui.nav_item(name='#menu/eggs', label='Eggs'),
ui.nav_item(name='#menu/toast', label='Toast', disabled=True),
]),
ui.nav_group('Help', items=[
ui.nav_item(name='#about', label='About', icon='Info'),
ui.nav_item(name='#support', label='Support', icon='Help'),
])
],
)
await q.page.save()
async def serve(q: Q):
if q.args.start:
q.page['form'] = ui.form_card(box='1 1 12 10',
items=[ui.progress('Running...')])
await q.page.save()
seconds = random.randint(1, 6)
# DON'T DO THIS!
# This will make your app unresponsive for some time:
# message = blocking_function(seconds)
# Do this instead:
with concurrent.futures.ThreadPoolExecutor() as pool:
message = await q.exec(pool, blocking_function, seconds)
# You can also pass a ProcessPoolExecutor, like this:
# with concurrent.futures.ProcessPoolExecutor() as pool:
# message = await q.exec(pool, blocking_function, seconds)
q.page['form'] = ui.form_card(box='1 1 12 10',
items=[ui.message_bar('info', message)])
await q.page.save()
else:
q.page['form'] = ui.form_card(
box='1 1 12 10', items=[ui.button(name='start', label='Start')])
await q.page.save()
async def serve(q: Q):
if not q.client.initialized:
q.page['meta'] = ui.meta_card(box='', theme='neon')
q.page['controls'] = ui.form_card(box='1 1 2 8', items=[
ui.text_xl('Form'),
ui.textbox(name='textbox', label='Textbox'),
ui.toggle(name='toggle', label='Toggle'),
ui.choice_group(name='choice_group', label='Choice group', choices=[
ui.choice(name=x, label=x) for x in ['Egg', 'Bacon', 'Spam']
]),
ui.checklist(name='checklist', label='Checklist', choices=[
ui.choice(name=x, label=x) for x in ['Egg', 'Bacon', 'Spam']
]),
ui.dropdown(name='dropdown', label='Dropdown', choices=[
ui.choice(name=x, label=x) for x in ['Egg', 'Bacon', 'Spam']
]),
ui.slider(name='slider', label='Slider'),
ui.button(name='toggle_theme', label='Toggle Theme', primary=True)
])
q.client.theme = 'default'
q.client.initialized = True
meta = q.page['meta']
if q.args.toggle_theme:
meta.theme = q.client.theme = 'neon' if q.client.theme == 'default' else 'default'
await q.page.save()
async def serve(q: Q):
if not q.client.initialized:
# Set up up the page at /stats
stats_page.drop() # Clear any existing page
stats_page['example'] = ui.wide_gauge_stat_card(
box='1 1 2 1',
title='Stats',
value='=${{intl price minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value='={{intl percent style="percent" minimum_fraction_digits=2 maximum_fraction_digits=2}}',
plot_color='$red',
progress=0,
data=dict(price=0, percent=0),
)
await stats_page.save()
# Set up this app's UI
q.page['form'] = ui.form_card(box='1 1 -1 -1', items=[
ui.frame(path='/stats', height='110px'),
ui.button(name='toggle', label='Start updates', primary=True),
])
await q.page.save()
q.client.initialized = True
if q.args.toggle:
global update_stats
update_stats = not update_stats
q.page['form'].items[1].button.label = 'Stop updates' if update_stats else 'Start updates'
await q.page.save()
await update_stats_page(q, stats_page)
