async def small_stat_card(q):
cat = 'dog'
val = 1
pc = 0.1
c = q.page.add(
f'example',
ui.small_series_stat_card(
box='1 1 1 1',
title='Verticoin',
value=
'=${{intl qux minimum_fraction_digits=2 maximum_fraction_digits=2}}',
data=dict(qux=val, quux=pc),
plot_category='foo',
plot_type='interval',
plot_value='qux',
plot_color='$red',
plot_data=data('foo qux', -20),
plot_zero_value=0,
))
await q.page.save()
while val < 1000:
time.sleep(1)
cat, val, pc = cat, val + np.random.randint(0, 10), np.random.rand()
c.data.qux = val
c.data.quux = pc
c.plot_data[-1] = [cat, val]
await q.page.save()
async def show_grey_dashboard(q: Q):
q.page['meta'] = ui.meta_card(box='', layouts=[
ui.layout(
breakpoint='xl',
min_width='800px',
zones=[
ui.zone('header', size='0'),
ui.zone('body', size='1000px', zones=[
ui.zone('title', size='0'),
ui.zone('top', direction=ui.ZoneDirection.ROW, size='25%'),
ui.zone('middle', direction=ui.ZoneDirection.ROW, size='25%'),
ui.zone('middle2', direction=ui.ZoneDirection.ROW, size='25%'),
ui.zone('bottom', direction=ui.ZoneDirection.ROW, size='20%'),
]),
ui.zone('footer', size='0'),
]
)
])
q.page['header'] = ui.header_card(box='header', title='H2O Wave Demo', subtitle='Grey Dashboard',
nav=global_nav)
q.page['section'] = ui.section_card(
box='title',
title=next(sample_title),
subtitle=next(sample_caption),
items=[
ui.label(label='Start:'),
ui.date_picker(name='target_date', label='', value='2020-12-20'),
ui.label(label='End:'),
ui.date_picker(name='target_date', label='', value='2020-12-25'),
],
)
stock_dates = generate_time_series(10000)
stock_prices = generate_random_walk()
q.page['small'] = ui.small_stat_card(
box=ui.box('top', order=1),
title=next(sample_term),
value=next(sample_dollars),
)
q.page['small_series'] = ui.small_series_stat_card(
box=ui.box('top', order=2),
title=next(sample_term),
value=next(sample_dollars),
plot_category='date',
plot_value='price',
plot_data=data(
fields=['date', 'price'],
rows=[(next(stock_dates), next(stock_prices)) for i in range(30)],
pack=True,
),
)
q.page['small_series_interval'] = ui.small_series_stat_card(
box=ui.box('top', order=3),
title=next(sample_term),
value=next(sample_dollars),
plot_category='date',
plot_value='price',
plot_type=ui.SmallSeriesStatCardPlotType.INTERVAL,
plot_data=data(
fields=['date', 'price'],
rows=[(next(stock_dates), next(stock_prices)) for i in range(30)],
pack=True,
),
)
q.page['wide_series'] = ui.wide_series_stat_card(
box=ui.box('middle', order=1),
title=next(sample_term),
value=next(sample_dollars),
aux_value=next(sample_percent),
plot_category='date',
plot_value='price',
plot_data=data(
fields=['date', 'price'],
rows=[(next(stock_dates), next(stock_prices)) for i in range(30)],
pack=True,
),
)
q.page['wide_bar'] = ui.wide_bar_stat_card(
box=ui.box('middle', order=2),
title=next(sample_term),
value=next(sample_dollars),
aux_value=next(sample_percent),
progress=random.random(),
)
q.page['wide_gauge'] = ui.wide_gauge_stat_card(
box=ui.box('middle', order=3),
title=next(sample_term),
value=next(sample_dollars),
aux_value=next(sample_percent),
progress=random.random(),
)
q.page['tall_series'] = ui.tall_series_stat_card(
box=ui.box('middle2', order=1),
title=next(sample_term),
value=next(sample_dollars),
aux_value=next(sample_percent),
plot_category='date',
plot_value='price',
plot_data=data(
fields=['date', 'price'],
rows=[(next(stock_dates), next(stock_prices)) for i in range(30)],
pack=True,
),
)
q.page['tall_gauge'] = ui.tall_gauge_stat_card(
box=ui.box('middle2', order=2),
title=next(sample_term),
value=next(sample_dollars),
aux_value=next(sample_percent),
progress=random.random(),
)
q.page['large'] = ui.large_stat_card(
box=ui.box('bottom', order=1),
title=next(sample_term),
value=next(sample_dollars),
aux_value=next(sample_percent),
caption=next(sample_caption),
)
q.page['large_bar'] = ui.large_bar_stat_card(
box=ui.box('bottom', order=2),
title=next(sample_term),
value=next(sample_dollars),
value_caption=next(sample_term),
aux_value=next(sample_dollars),
aux_value_caption=next(sample_term),
progress=random.random(),
caption=next(sample_caption),
)
q.page['footer'] = ui.footer_card(box='footer', caption='(c) 2021 H2O.ai. All rights reserved.')
await q.page.save()
from h2o_wave import site, ui, data
page = site['/demo']
fake = Faker()
f = FakeCategoricalSeries()
cat, val, pc = f.next()
c = page.add(
f'example',
ui.small_series_stat_card(
box='1 1 1 1',
title=fake.cryptocurrency_name(),
value=
'=${{intl qux minimum_fraction_digits=2 maximum_fraction_digits=2}}',
data=dict(qux=val, quux=pc),
plot_category='foo',
plot_type='interval',
plot_value='qux',
plot_color='$red',
plot_data=data('foo qux', -20),
plot_zero_value=0,
))
page.save()
while True:
time.sleep(1)
cat, val, pc = f.next()
c.data.qux = val
c.data.quux = pc
c.plot_data[-1] = [cat, val]
page.save()
async def show_purple_dashboard(q: Q):
q.page['meta'] = ui.meta_card(
box='',
layouts=[
ui.layout(
breakpoint='xs',
zones=[
ui.zone('header', size='80px'),
ui.zone('title', size='0'),
ui.zone('body'),
ui.zone('footer', size='50px'),
],
),
ui.layout(
breakpoint='m',
zones=[
ui.zone('header', size='80px'),
ui.zone('title', size='0'),
ui.zone('body',
direction=ui.ZoneDirection.ROW,
zones=[
ui.zone(
'main',
zones=[
ui.zone('overview', size='0'),
ui.zone('stats1',
direction=ui.ZoneDirection.ROW,
size='150px'),
ui.zone('stats2',
direction=ui.ZoneDirection.ROW,
size='150px'),
ui.zone('others'),
]),
ui.zone('sidebar', size='30%'),
]),
ui.zone('footer', size='50px'),
],
),
ui.layout(
breakpoint='xl',
width='1200px',
zones=[
ui.zone('header', size='80px'),
ui.zone('title', size='0'),
ui.zone('body',
direction=ui.ZoneDirection.ROW,
zones=[
ui.zone('main',
size='3',
zones=[
ui.zone(
'overview',
direction=ui.ZoneDirection.ROW,
size='200px'),
ui.zone(
'stats',
direction=ui.ZoneDirection.ROW,
size='150px'),
ui.zone(
'details',
direction=ui.ZoneDirection.ROW,
size='400px'),
ui.zone(
'reports',
direction=ui.ZoneDirection.ROW,
size='400px'),
]),
ui.zone('sidebar', size='30%'),
]),
ui.zone('footer', size='50px'),
])
])
q.page['header'] = ui.header_card(box='header',
title='H2O Wave Demo',
subtitle='Purple Dashboard',
nav=global_nav)
q.page['title'] = ui.section_card(
box='title',
title=next(sample_title),
subtitle=next(sample_caption),
items=[
ui.date_picker(name='target_date', label='', value='2020-12-25'),
],
)
customers_overview_dates = generate_time_series(30)
customers_overview_counts = generate_random_walk()
q.page['customers_overview'] = ui.tall_series_stat_card(
box=ui.boxes(
ui.box('body', height='200px', order=1),
ui.box('overview', height='200px', order=1),
ui.box('overview', order=1),
),
title=next(sample_title),
value=next(sample_dollars),
aux_value=next(sample_title),
plot_type='area',
plot_color='$red',
plot_category='date',
plot_value='customer_count',
plot_zero_value=0,
plot_data=data(
fields=['date', 'customer_count'],
rows=[(next(customers_overview_dates),
next(customers_overview_counts)) for i in range(30)],
pack=True,
),
)
conversions_overview_dates = generate_time_series(30)
conversions_overview_counts = generate_random_walk()
q.page['conversions_overview'] = ui.tall_series_stat_card(
box=ui.boxes(
ui.box('body', height='200px', order=2),
ui.box('overview', height='200px', order=2),
ui.box('overview', order=2),
),
title=next(sample_title),
value=next(sample_amount),
aux_value=next(sample_dollars),
plot_type='interval',
plot_color='$pink',
plot_category='date',
plot_value='conversions',
plot_zero_value=0,
plot_data=data(
fields=['date', 'conversions'],
rows=[(next(conversions_overview_dates),
next(conversions_overview_counts)) for i in range(30)],
pack=True,
),
)
revenue_overview_dates = generate_time_series(30)
revenue_overview_counts = generate_random_walk()
q.page['revenue_overview'] = ui.tall_series_stat_card(
box=ui.boxes(
ui.box('body', height='200px', order=3),
ui.box('overview', height='200px', order=3),
ui.box('overview', order=3),
),
title=next(sample_title),
value=next(sample_amount),
aux_value=next(sample_dollars),
plot_type='area',
plot_color='$purple',
plot_category='date',
plot_value='revenue',
plot_zero_value=0,
plot_data=data(
fields=['date', 'revenue'],
rows=[(next(revenue_overview_dates), next(revenue_overview_counts))
for i in range(30)],
pack=True,
),
)
metric_dates = generate_time_series(30)
metric_values = generate_random_walk()
q.page['conversion_stats'] = ui.small_series_stat_card(
box=ui.boxes(
ui.box('body', height='150px', order=4),
ui.box('stats1', order=1),
ui.box('stats', order=1),
),
title=next(sample_term),
value=next(sample_percent),
plot_type='area',
plot_color='$red',
plot_category='date',
plot_value='metric',
plot_zero_value=0,
plot_data=data(
fields=['date', 'metric'],
rows=[(next(metric_dates), next(metric_values))
for i in range(30)],
pack=True,
),
)
q.page['revenue_stats'] = ui.small_series_stat_card(
box=ui.boxes(
ui.box('body', height='150px', order=5),
ui.box('stats1', order=2),
ui.box('stats', order=2),
),
title=next(sample_term),
value=next(sample_percent),
plot_type='interval',
plot_color='$pink',
plot_category='date',
plot_value='metric',
plot_zero_value=0,
plot_data=data(
fields=['date', 'metric'],
rows=[(next(metric_dates), next(metric_values))
for i in range(30)],
pack=True,
),
)
q.page['purchases_stats'] = ui.small_series_stat_card(
box=ui.boxes(
ui.box('body', height='150px', order=6),
ui.box('stats1', order=3),
ui.box('stats', order=3),
),
title=next(sample_term),
value=next(sample_percent),
plot_type='area',
plot_color='$purple',
plot_category='date',
plot_value='metric',
plot_zero_value=0,
plot_data=data(
fields=['date', 'metric'],
rows=[(next(metric_dates), next(metric_values))
for i in range(30)],
pack=True,
),
)
q.page['transactions_stats'] = ui.small_series_stat_card(
box=ui.boxes(
ui.box('body', height='150px', order=7),
ui.box('stats2', order=1),
ui.box('stats', order=4),
),
title=next(sample_term),
value=next(sample_percent),
plot_type='area',
plot_color='$red',
plot_category='date',
plot_value='metric',
plot_zero_value=0,
plot_data=data(
fields=['date', 'metric'],
rows=[(next(metric_dates), next(metric_values))
for i in range(30)],
pack=True,
),
)
q.page['order_stats'] = ui.small_series_stat_card(
box=ui.boxes(
ui.box('body', height='150px', order=8),
ui.box('stats2', order=2),
ui.box('stats', order=5),
),
title=next(sample_term),
value=next(sample_percent),
plot_type='interval',
plot_color='$pink',
plot_category='date',
plot_value='metric',
plot_zero_value=0,
plot_data=data(
fields=['date', 'metric'],
rows=[(next(metric_dates), next(metric_values))
for i in range(30)],
pack=True,
),
)
q.page['quantity_stats'] = ui.small_series_stat_card(
box=ui.boxes(
ui.box('body', height='150px', order=6),
ui.box('stats2', order=3),
ui.box('stats', order=6),
),
title=next(sample_term),
value=next(sample_percent),
plot_type='area',
plot_color='$purple',
plot_category='date',
plot_value='metric',
plot_zero_value=0,
plot_data=data(
fields=['date', 'metric'],
rows=[(next(metric_dates), next(metric_values))
for i in range(30)],
pack=True,
),
)
sales_days_1 = generate_time_series(15)
sales_days_2 = generate_time_series(15)
sales_amounts_1 = generate_random_walk(8000, 15000)
sales_amounts_2 = generate_random_walk(8000, 15000)
q.page['sales_details'] = ui.form_card(
box=ui.boxes(
ui.box('body', height='400px', order=9),
ui.box('others', height='400px', order=1),
ui.box('details', order=1),
),
title=next(sample_title),
items=[
ui.stats(items=[
ui.stat(label=next(sample_term), value=next(sample_dollars)),
ui.stat(label=next(sample_term), value=next(sample_dollars)),
]),
ui.visualization(
plot=ui.plot([
ui.mark(type='interval',
x_scale='time',
x='=date',
y='=sales',
color='=site',
y_min=0,
color_range='$purple $red')
]),
data=data(
fields=['site', 'date', 'sales'],
rows=[('Online', next(sales_days_1), next(sales_amounts_1))
for i in range(15)] +
[('In-store', next(sales_days_2), next(sales_amounts_2))
for i in range(15)],
pack=True),
height='210px',
)
],
)
audience_days1 = generate_time_series(60)
audience_days2 = generate_time_series(60)
audience_hits1 = generate_random_walk(10000, 20000, 0.2)
audience_hits2 = generate_random_walk(8000, 15000)
q.page['visitor_details'] = ui.form_card(
box=ui.boxes(
ui.box('body', height='400px', order=10),
ui.box('others', height='400px', order=2),
ui.box('details', order=2),
),
title=next(sample_title),
items=[
ui.stats(items=[
ui.stat(label=next(sample_term), value=next(sample_amount)),
ui.stat(label=next(sample_term), value=next(sample_dollars)),
ui.stat(label=next(sample_term), value=next(sample_percent)),
ui.stat(label=next(sample_term), value=next(sample_dollars)),
]),
ui.visualization(
plot=ui.plot([
ui.mark(type='area',
x_scale='time',
x='=date',
y='=visitors',
color='=site',
color_range='$purple $pink'),
ui.mark(type='line',
x_scale='time',
x='=date',
y='=visitors',
color='=site',
color_range='$purple $pink'),
]),
data=data(
fields=['site', 'date', 'visitors'],
rows=[
('Online', next(audience_days1), next(audience_hits1))
for i in range(60)
] +
[('In-store', next(audience_days2), next(audience_hits2))
for i in range(60)],
pack=True),
height='210px',
)
],
)
q.page['earnings_reports'] = ui.stat_table_card(
box=ui.boxes(
ui.box('body', order=11),
ui.box('others', order=3),
ui.box('reports', order=1, size=3),
),
title=next(sample_title),
subtitle=next(sample_caption),
columns=[
next(sample_term),
next(sample_term),
next(sample_term),
next(sample_term)
],
items=[
ui.stat_table_item(label=next(sample_title),
values=[
next(sample_dollars),
next(sample_percent),
next(sample_percent)
]) for i in range(8)
])
q.page['products_reports'] = ui.stat_list_card(
box=ui.boxes(
ui.box('body', order=12),
ui.box('others', order=4),
ui.box('reports', order=2),
),
title=next(sample_title),
subtitle=next(sample_caption),
items=[
ui.stat_list_item(label=next(sample_term),
caption=next(sample_title),
value=next(sample_dollars),
icon=next(sample_icon),
icon_color=next(sample_color)) for i in range(5)
],
)
q.page['activity'] = ui.stat_list_card(
box=ui.boxes(
ui.box('body', order=13),
ui.box('sidebar', size='0'),
ui.box('sidebar', size='0'),
),
title=next(sample_title),
subtitle=next(sample_caption),
items=[
ui.stat_list_item(label=next(sample_term),
caption=f'Order #{random.randint(1111, 9999)}',
aux_value=f'{random.randint(1, 9)}hr',
icon=next(sample_icon)) for i in range(10)
],
)
q.page['footer'] = ui.footer_card(
box='footer', caption='(c) 2021 H2O.ai. All rights reserved.')
await q.page.save()
page = site['/demo']
colors = '$red $pink $blue $azure $cyan $teal $mint $green $lime $yellow $amber $orange $tangerine'.split()
curves = 'linear smooth step step-after step-before'.split()
fake = Faker()
cards = []
for i in range(len(curves)):
f = FakeCategoricalSeries()
cat, val, pc = f.next()
c = page.add(f'example{i}', ui.small_series_stat_card(
box=f'1 {i + 1} 1 1',
title=fake.cryptocurrency_name(),
value='=${{intl qux minimum_fraction_digits=2 maximum_fraction_digits=2}}',
data=dict(qux=val, quux=pc),
plot_category='foo',
plot_type='area',
plot_value='qux',
plot_color=colors[i],
plot_data=data('foo qux', -15),
plot_zero_value=0,
plot_curve=curves[i],
))
cards.append((f, c))
page.save()
while True:
time.sleep(1)
for f, c in cards:
cat, val, pc = f.next()
c.data.qux = val
c.data.quux = pc
def create_dashboard(update_freq=0.0):
page = site['/demo']
simples = []
for i in range(1, 7):
f = FakePercent()
val, pc = f.next()
c = page.add(
f'a{i}',
ui.small_stat_card(
box=f'{i} 1 1 1',
title=fake.cryptocurrency_name(),
value=f'${val:.2f}',
))
simples.append((f, c))
simples_colored = []
for i in range(1, 7):
f = FakeCategoricalSeries()
cat, val, pc = f.next()
c = page.add(
f'aa{i}',
ui.small_series_stat_card(
box=f'{6 + i} 1 1 1',
title=fake.cryptocurrency_code(),
value=
'=${{intl qux minimum_fraction_digits=2 maximum_fraction_digits=2}}',
data=dict(qux=val, quux=pc / 100),
plot_category='foo',
plot_value='qux',
plot_color=next_color(),
plot_data=data('foo qux', -15),
plot_zero_value=0,
plot_curve=next_curve(),
))
simples_colored.append((f, c))
lines = []
for i in range(1, 13, 2):
f = FakeCategoricalSeries()
cat, val, pc = f.next()
c = page.add(
f'b{i}',
ui.wide_series_stat_card(
box=f'{i} 2 2 1',
title=fake.cryptocurrency_name(),
value=
'=${{intl qux minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value=
'={{intl quux style="percent" minimum_fraction_digits=1 maximum_fraction_digits=1}}',
data=dict(qux=val, quux=pc / 100),
plot_category='foo',
plot_value='qux',
plot_color=next_color(),
plot_data=data('foo qux', -15),
plot_zero_value=0,
plot_curve=next_curve(),
))
lines.append((f, c))
bars = []
for i in range(1, 13, 2):
f = FakeCategoricalSeries()
cat, val, pc = f.next()
c = page.add(
f'c{i}',
ui.wide_series_stat_card(
box=f'{i} 3 2 1',
title=fake.cryptocurrency_name(),
value=
'=${{intl qux minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value=
'={{intl quux style="percent" minimum_fraction_digits=1 maximum_fraction_digits=1}}',
data=dict(qux=val, quux=pc),
plot_type='interval',
plot_category='foo',
plot_value='qux',
plot_color=next_color(),
plot_data=data('foo qux', -25),
plot_zero_value=0))
bars.append((f, c))
large_pcs = []
for i in range(1, 13):
f = FakePercent()
val, pc = f.next()
c = page.add(
f'd{i}',
ui.tall_gauge_stat_card(
box=f'{i} 4 1 2',
title=fake.cryptocurrency_name(),
value=
'=${{intl foo minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value=
'={{intl bar style="percent" minimum_fraction_digits=2 maximum_fraction_digits=2}}',
plot_color=next_color(),
progress=pc,
data=dict(foo=val, bar=pc / 100),
))
large_pcs.append((f, c))
large_lines = []
for i in range(1, 13):
f = FakeCategoricalSeries()
cat, val, pc = f.next()
c = page.add(
f'e{i}',
ui.tall_series_stat_card(
box=f'{i} 6 1 2',
title=fake.cryptocurrency_name(),
value=
'=${{intl qux minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value=
'={{intl quux style="percent" minimum_fraction_digits=1 maximum_fraction_digits=1}}',
data=dict(qux=val, quux=pc),
plot_type='area',
plot_category='foo',
plot_value='qux',
plot_color=next_color(),
plot_data=data('foo qux', -15),
plot_zero_value=0,
plot_curve=next_curve(),
))
large_lines.append((f, c))
small_pcs = []
for i in range(1, 7, 2):
f = FakePercent()
val, pc = f.next()
c = page.add(
f'f{i}',
ui.wide_gauge_stat_card(
box=f'{i} 8 2 1',
title=fake.cryptocurrency_name(),
value=
'=${{intl foo minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value=
'={{intl bar style="percent" minimum_fraction_digits=2 maximum_fraction_digits=2}}',
plot_color=next_color(),
progress=pc,
data=dict(foo=val, bar=pc / 100),
))
small_pcs.append((f, c))
small_pbs = []
for i in range(7, 13, 2):
f = FakePercent()
val, pc = f.next()
c = page.add(
f'f{i}',
ui.wide_bar_stat_card(
box=f'{i} 8 2 1',
title=fake.cryptocurrency_name(),
value=
'=${{intl foo minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value=
'={{intl bar style="percent" minimum_fraction_digits=2 maximum_fraction_digits=2}}',
plot_color=next_color(),
progress=pc,
data=dict(foo=val, bar=pc / 100),
))
small_pbs.append((f, c))
large_cards = []
for i in range(1, 7, 2):
f = FakePercent()
val, pc = f.next()
c = page.add(
f'g{i}',
ui.large_stat_card(
box=f'{i} 9 2 2',
title=fake.cryptocurrency_name(),
value=
'=${{intl qux minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value=
'={{intl quux style="percent" minimum_fraction_digits=1 maximum_fraction_digits=1}}',
data=dict(qux=val, quux=pc / 100),
caption=' '.join(fake.sentences()),
))
large_cards.append((f, c))
large_pbs = []
for i in range(7, 13, 2):
f = FakePercent()
val, pc = f.next()
c = page.add(
f'g{i}',
ui.large_bar_stat_card(
box=f'{i} 9 2 2',
title=fake.cryptocurrency_name(),
value=
'=${{intl foo minimum_fraction_digits=2 maximum_fraction_digits=2}}',
value_caption='This Month',
aux_value=
'={{intl bar style="percent" minimum_fraction_digits=2 maximum_fraction_digits=2}}',
aux_value_caption='Previous Month',
plot_color=next_color(),
progress=pc,
data=dict(foo=val, bar=pc / 100),
caption=' '.join(fake.sentences(2)),
))
large_pbs.append((f, c))
page.save()
while update_freq > 0:
time.sleep(update_freq)
for f, c in simples:
val, pc = f.next()
c.value = f'${val:.2f}',
for f, c in simples_colored:
cat, val, pc = f.next()
c.data.qux = val
c.data.quux = pc / 100
c.plot_data[-1] = [cat, val]
for f, c in lines:
cat, val, pc = f.next()
c.data.qux = val
c.data.quux = pc / 100
c.plot_data[-1] = [cat, val]
for f, c in bars:
cat, val, pc = f.next()
c.data.qux = val
c.data.quux = pc / 100
c.plot_data[-1] = [cat, val]
for f, c in large_lines:
cat, val, pc = f.next()
c.data.qux = val
c.data.quux = pc / 100
c.plot_data[-1] = [cat, val]
for f, c in large_pcs:
val, pc = f.next()
c.data.foo = val
c.data.bar = pc
c.progress = pc
for f, c in small_pcs:
val, pc = f.next()
c.data.foo = val
c.data.bar = pc
c.progress = pc
for f, c in small_pbs:
val, pc = f.next()
c.data.foo = val
c.data.bar = pc
c.progress = pc
for f, c in large_cards:
val, pc = f.next()
c.data.qux = val
c.data.quux = pc
for f, c in large_pbs:
val, pc = f.next()
c.data.foo = val
c.data.bar = pc
c.progress = pc
page.save()