async def get_inputs(q: Q): q.page['main'] = ui.form_card( box="1 2 8 5", items=[ ui.text_xl('Enter your text input for generation:'), ui.textbox(name="input_text", label='', value=q.app.input_text, multiline=True), ui.separator(), ui.slider( name="num_words_to_generate", label= "Maximum number of words to generate (including input text)", min=5, max=50, step=1, value=q.app.num_words_to_generate if q.app.num_words_to_generate else 12, ), ui.separator(), ui.buttons([ ui.button(name="generate_text", label='Generate', primary=True), ]) ])
def render_content_changes(q: Q): q.page['sidebar'] = ui.form_card( box='1 2 2 8', items=[ ui.separator('Button Counting'), ui.text( f'This button has been **clicked in this browser session {q.client.count}** times!' ), ui.text( f'This button has been **clicked by you {q.user.count}** times!' ), ui.text(f'This button has been **clicked {q.app.count}** times!'), ui.buttons([ui.button(name='button', label='Click Me!')], justify='center') ]) q.page['content'] = ui.form_card( box='3 2 9 8', items=[ ui.tabs(name='header_tabs', value=q.client.tab, items=[ ui.tab(name=t.lower(), label=t) for t in ['Home', 'Learn More', 'Contact Us'] ]), ui.frame( content= f'This is the {q.client.tab} section, it is still in development.' ) ])
def init(q: Q): q.page['meta'] = ui.meta_card( box='', title='Explain Ratings', layouts=[ ui.layout(breakpoint='xs', zones=[ ui.zone('header'), ui.zone('body', direction=ui.ZoneDirection.ROW, size='calc(100vh - 70px)', zones=[ ui.zone('sidebar', size='350px'), ui.zone('content', direction=ui.ZoneDirection.ROW) ]) ]), ]) q.page['header'] = ui.header_card(box='header', title='Hotel Reviews', subtitle='Explains the hotel reviews', icon='ReviewSolid', icon_color='#00A8E0') q.client.review = config.review_column_list[0] form_filters = [] for column in config.filterable_columns: choices = [ui.choice(name='empty', label='All')] + [ ui.choice(name=str(column), label=str(column)) for column in config.dataset[column].drop_duplicates() ] form_filters.append( ui.dropdown(name=f'filter_{column}', label=config.column_mapping[column], trigger=True, value='empty', choices=choices)) sidebar_items = [ ui.dropdown(name='review', label='Review type', value=q.client.review, trigger=True, choices=[ ui.choice(name=column, label=config.column_mapping[column]) for column in config.dataset[config.review_column_list] ]), ui.separator('Filters') ] + form_filters q.page['sidebar'] = ui.form_card(box='sidebar', items=sidebar_items) q.page['original'] = ui.image_card(box='content', title='Original', type='png', image=plot_word_cloud( config.dataset[q.client.review], q))
def render_plot_view(q: Q): """Sets up the view a file as ui.table card""" items = [ui.separator(label='Step 3: Visualize the Dataset')] if q.client.working_file_path is None: items.append(ui.message_bar(type='warning', text='Please upload a dataset!')) else: items.append(make_ui_plot(file_path=q.client.working_file_path)) q.page['plot'] = ui.form_card(box='4 6 8 -1', items=items)
def render_table_view(q: Q): """Sets up the view a file as ui.table card""" items = [ui.separator(label='Step 2: View the Dataset')] if q.client.working_file_path is None: items.append(ui.message_bar(type='warning', text='Please upload a dataset!')) else: items.append(ui.text_xl(os.path.basename(q.client.working_file_path))) items.append(make_ui_table(file_path=q.client.working_file_path, n_rows=10, name='head_of_table')) q.page['table'] = ui.form_card(box='4 2 8 4', items=items)
def render_suggestions(q: Q): suggestions = get_suggestions(q.client.rule_set, q.client.cart_products) q.page['suggestions'].items = [ ui.separator(label='Recommended for You'), *[ ui.button(name='suggestion_btn', label=suggestion, value=suggestion, caption='Add to cart') for suggestion in suggestions ], ]
def render_upload_view(q: Q): """Sets up the upload-dataset card""" q.page['upload'] = ui.form_card( box='1 2 3 -1', items=[ ui.separator(label='Step 1: Choose a Dataset'), ui.message_bar( type='info', text='This application requires a .csv file with any type of data within it', ), ui.file_upload(name='file_upload', label='Upload Data', multiple=False, file_extensions=['csv']), ] )
def render_trending(q: Q): trending_products = get_trending_products(q.client.rule_set, q.client.cart_products) q.page['trending'].items = [ ui.separator(label='Trending Now'), *[ ui.button(name='trending_btn', label=product, value=product, caption='Add to cart') for product in trending_products ], ]
async def show_todos(q: Q): # Get items for this user. db: WaveDB = q.app.db # Check if we have any updates, i.e. the user has checked/unchecked any item. updates = [] for key, done in expando_to_dict(q.args).items(): # We've named each todo item `todo_{id}' (e.g. todo_42, todo_43, and so on) # So identify the todo items from their 'todo_' prefix, then extract the ids from the names. if key.startswith('todo_'): _, id = key.split('_', 1) updates.append(('update todo set done=? where id=?', 1 if done else 0, int(id))) # If we have updates, update our database. if len(updates): _, err = await db.exec_many(*updates) if err: raise RuntimeError(f'Failed updating todos: {err}') # Fetch latest todos for our user rows, err = await db.exec('select id, label, done from todo where user=?', q.auth.subject) if err: raise RuntimeError(f'Failed fetching todos: {err}') todos = [TodoItem(id, label, done) for id, label, done in rows] # Create done/not-done checkboxes. done = [ ui.checkbox(name=f'todo_{todo.id}', label=todo.label, value=True, trigger=True) for todo in todos if todo.done ] not_done = [ ui.checkbox(name=f'todo_{todo.id}', label=todo.label, trigger=True) for todo in todos if not todo.done ] # Display list q.page['form'] = ui.form_card( box='1 1 4 10', items=[ ui.text_l('To Do'), ui.button(name='new_todo', label='Add To Do...', primary=True), *not_done, *([ui.separator('Done')] if len(done) else []), *done, ]) await q.page.save()
async def show_results(q: Q): q.page['main'] = ui.form_card(box="1 2 4 5", items=[ ui.text_xl("Input Text:"), ui.separator(), ui.text(q.app.input_text), ui.separator(), ui.buttons([ ui.button(name="get_inputs", label='Try Again!', primary=True), ]) ]) result = q.app.model(q.app.input_text, max_length=q.app.num_words_to_generate, do_sample=False)[0] q.app.generated_text = result["generated_text"] q.page['visualization'] = ui.form_card(box="5 2 4 5", items=[ ui.text_xl("Generated Text:"), ui.separator(''), ui.text(q.app.generated_text) ])
def populate_dropdown_list(q: Q): filter_choices = [ ui.choice( name=json.dumps({"id": q.client.filter_count + 1, "attr": column, "attr_val": None}), label=config.column_mapping[column] ) for column in config.filterable_columns ] items = [ ui.text_l("Filter reviews"), ] for key, value in q.client.filters.items(): for attr, attr_val in value.items(): items.append(ui.dropdown( name="filter", label="Choose a review attribute", placeholder=config.column_mapping[attr], choices=[ ui.choice( name=json.dumps({'id': key, 'attr': column, 'attr_val': None}), label=config.column_mapping[column] ) for column in config.filterable_columns ], trigger=True, ), ) items.append(ui.dropdown( name="filter_value", label="Choose a value for selected review attribute", placeholder=attr_val, choices=[ui.choice(name=json.dumps({'id': key, 'attr': attr, 'attr_val': column}), label=column) for column in config.dataset[attr].drop_duplicates()], trigger=True, ), ) items.append(ui.separator()) if (q.args.add_filter and all(q.client.filters.values())) or q.args.review_choice or q.args.reset_filters: items.append(ui.dropdown( name="filter", label="Choose a review attribute", placeholder="Please select a category to filter", choices=filter_choices, trigger=True ), ) items.append(ui.button(name="compare_review_button", label="Compare Reviews", primary=True)) return items
async def show_todos(q: Q): # Get items for this user. todos: List[TodoItem] = q.user.todos # Create a sample list if we don't have any. if todos is None: q.user.todos = todos = [ TodoItem('Do this'), TodoItem('Do that'), TodoItem('Do something else') ] # If the user checked/unchecked an item, update our list. for todo in todos: if todo.id in q.args: todo.done = q.args[todo.id] # Create done/not-done checkboxes. done = [ ui.checkbox(name=todo.id, label=todo.label, value=True, trigger=True) for todo in todos if todo.done ] not_done = [ ui.checkbox(name=todo.id, label=todo.label, trigger=True) for todo in todos if not todo.done ] # Display list q.page['form'] = ui.form_card( box='1 1 4 10', items=[ ui.text_l('To Do'), ui.button(name='new_todo', label='Add To Do...', primary=True), *not_done, *([ui.separator('Done')] if len(done) else []), *done, ]) await q.page.save()
async def serve(q: Q): q.page['example'] = ui.form_card(box='1 1 4 10', items=[ ui.text_xl(content='Extra-large text, for headings.'), ui.text_l(content='Large text, for sub-headings.'), ui.text_m(content='Body text, for paragraphs and other content.'), ui.text_s(content='Small text, for small print.'), ui.text_xs(content='Extra-small text, for really small print.'), ui.separator(label='A separator sections forms'), ui.progress(label='A progress bar'), ui.progress(label='A progress bar'), ui.message_bar(type='success', text='Message bar'), ui.textbox(name='textbox', label='Textbox'), ui.label(label='Checkboxes'), ui.checkbox(name='checkbox1', label='A checkbox'), ui.checkbox(name='checkbox1', label='Another checkbox'), ui.checkbox(name='checkbox1', label='Yet another checkbox'), 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.dropdown(name='dropdown', label='Multi-valued Dropdown', values=[], choices=[ ui.choice(name=x, label=x) for x in ['Egg', 'Bacon', 'Spam'] ]), ui.combobox(name='combobox', label='Combobox', choices=['Choice 1', 'Choice 2', 'Choice 3']), ui.slider(name='slider', label='Slider'), ui.range_slider(name='range_slider', label='Range slider', max=99), ui.spinbox(name='spinbox', label='Spinbox'), ui.date_picker(name='date_picker', label='Date picker'), ui.color_picker(name='color_picker', label='Color picker'), ui.buttons([ ui.button(name='primary_button', label='Primary', primary=True), ui.button(name='standard_button', label='Standard'), ui.button(name='standard_disabled_button', label='Standard', disabled=True), ]), ui.file_upload(name='file_upload', label='File upload'), ui.table(name='table', columns=[ ui.table_column(name='col1', label='Column 1'), ui.table_column(name='col2', label='Column 2'), ], rows=[ ui.table_row(name='row1', cells=['Text A', 'Text B']), ui.table_row(name='row2', cells=['Text C', 'Text D']), ui.table_row(name='row3', cells=['Text E', 'Text F']), ]), ui.link(label='Link'), ui.tabs(name='tabs', items=[ ui.tab(name='email', label='Mail', icon='Mail'), ui.tab(name='events', label='Events', icon='Calendar'), ui.tab(name='spam', label='Spam'), ]), ui.expander(name='expander', label='Expander'), ui.frame(path='https://example.com'), ui.markup(content=html), ui.template( content=menu, data=pack(dict(dishes=[ dict(name='Spam', price='$2.00'), dict(name='Ham', price='$3.45'), dict(name='Eggs', price='$1.75'), ])) ), ui.picker(name='picker', label='Picker', choices=[ ui.choice('choice1', label='Choice 1'), ui.choice('choice2', label='Choice 2'), ui.choice('choice3', label='Choice 3'), ]), ui.stepper(name='stepper', items=[ ui.step(label='Step 1', icon='MailLowImportance'), ui.step(label='Step 2', icon='TaskManagerMirrored'), ui.step(label='Step 3', icon='Cafe'), ]), ui.visualization( plot=ui.plot([ui.mark(type='interval', x='=product', y='=price', y_min=0)]), data=data(fields='product price', rows=[(c, x) for c, x, _ in [f.next() for _ in range(n)]], pack=True), ), ui.vega_visualization( specification=spec, data=data(fields=["a", "b"], rows=[ ["A", rnd()], ["B", rnd()], ["C", rnd()], ["D", rnd()], ["E", rnd()], ["F", rnd()], ["G", rnd()], ["H", rnd()], ["I", rnd()] ], pack=True), ), ui.button(name='show_inputs', label='Submit', primary=True), ]) await q.page.save()
def init_ui(q: Q): q.page['meta'] = ui.meta_card( title='Shopping Cart Recomendations', box='', layouts=[ ui.layout(breakpoint='xs', zones=[ ui.zone('header', size='80px'), ui.zone('cart', size='250px'), ui.zone('trending'), ui.zone('suggestions'), ]), ui.layout( breakpoint='m', zones=[ ui.zone('header', size='80px'), ui.zone('body', size='1000px', direction=ui.ZoneDirection.ROW, zones=[ ui.zone('cart', size='300px'), ui.zone('right-pane', direction=ui.ZoneDirection.COLUMN, zones=[ ui.zone('trending', size='600px'), ui.zone('suggestions'), ]), ]), ]), ui.layout(breakpoint='xl', width='1600px', zones=[ ui.zone('header', size='80px'), ui.zone('body', size='750px', direction=ui.ZoneDirection.ROW, zones=[ ui.zone('cart', size='300px'), ui.zone('trending'), ui.zone('suggestions'), ]) ]) ]) q.page.add( 'header', ui.header_card( box='header', title=config.title, subtitle=config.subtitle, icon=config.icon, icon_color=config.icon_color, )) q.page['suggestions'] = ui.form_card(box='suggestions', items=[]) q.page['trending'] = ui.form_card(box='trending', items=[]) q.page['cart'] = ui.form_card( box='cart', items=[ ui.separator('Cart'), ui.text('Search and add products to the cart'), ui.picker( name='cart_products', choices=[ ui.choice(name=str(x), label=str(x)) for x in get_products_list() ], values=q.client.cart_products, trigger=True, ), ui.button(name='toggle_theme', label='Toggle Theme', primary=True) ]) q.client.theme = 'default'
# Form / Text / Sizes # Use text size variants to display formatted text using predefined font sizes. # --- from h2o_wave import site, ui page = site['/demo'] page['example'] = ui.form_card( box='1 1 4 -1', items=[ ui.separator('Separator'), ui.text_xl('Extra large text'), ui.text_l('Large text'), ui.text('Normal text'), ui.text_m('Medium text'), ui.text_s('Small text'), ui.text_xs('Extra small text'), # Using `ui.text()` with a `size` argument produces similar results: ui.separator('Separator'), ui.text('Extra large text', size=ui.TextSize.XL), ui.text('Large text', size=ui.TextSize.L), ui.text('Normal text'), ui.text('Medium text', size=ui.TextSize.M), ui.text('Small text', size=ui.TextSize.S), ui.text('Extra small text', size=ui.TextSize.XS), ], ) page.save()
# Form / Separator # Use a separator to visually separate content into groups. # --- from h2o_wave import site, ui page = site['/demo'] page['example'] = ui.form_card( box='1 1 2 5', items=[ ui.separator(label='Separator 1'), ui.text('The quick brown fox jumps over the lazy dog.'), ui.separator(label='Separator 2'), ui.text('The quick brown fox jumps over the lazy dog.'), ui.separator(label='Separator 3'), ui.text('The quick brown fox jumps over the lazy dog.'), ] ) page.save()