def home():
wp = jp.QuasarPage(tailwind=True)
page = jp.Div(a=wp, classes="bg-gray-200 h-screen")
# jp.Div(a=page, classes="bg-gray-300")
con = jp.Div(a=page, classes="bg-purple-300 m-24 p-10 rounded")
line = jp.Div(a=con, classes="grid grid-cols-3 gap-4")
in_1 = jp.Input(a=line,
placeholder="Enter the first value",
classes="form-input")
in_2 = jp.Input(a=line,
placeholder="Enter the second value",
classes="form-input")
result = jp.Div(a=line, text="Result goes here....")
jp.QBtn(
a=con,
label="Calculate",
color='purple',
icon="calculator",
click=sum_up,
in1=in_1,
in2=in_2,
total=result,
classes=
"bg-purple-600 m-2 py-1 px-4 text-gray-800 rounded hover:bg-purple-800"
)
jp.Div(a=con,
text="interactive div",
mouseenter=mouse_enter,
mouseleave=mouse_leave)
return wp
def view_genre(self, msg):
conn = sqlite3.connect('movies.db')
c = conn.cursor()
genre = (self.text,)
for row in c.execute('SELECT * FROM films WHERE genre=?', genre):
li.text = f'Genere selezionato: {self.text}'
body_table = jp.Tbody(style='overflow:auto;', a=movie_table)
row_table = jp.Tr(style='')
div_table1 = jp.Td(style='width: 447px;', a=row_table)
div_title_film = jp.Div(style='cursor: pointer;', text=row[0], a=div_table1, click=open_film)
div_table2 = jp.Td(style='width: 183px;', a=row_table)
div_director_film = jp.Div(style='cursor: pointer;', text=row[8], a=div_table2, click=open_film)
div_table3 = jp.Td(style='width: 100px;', a=row_table)
div_date_film = jp.Div(style='cursor: pointer;', text=row[3], a=div_table3, click=open_film)
div_title_film.additional_properties = row
div_director_film.additional_properties = row
div_date_film.additional_properties = row
row_table.additional_properties = {'Titolo': row[0], 'Regista': row[8], 'Data di uscita': row[3]}
body_table.add(row_table)
conn.commit()
conn.close()
button_sort_director.additional_properties = [self.text, 'Regista']
button_sort_title.additional_properties = [self.text, 'Titolo']
li2.set_classes('block')
div1.remove_component(div2)
movie_table.add(body_table)
div1.add(div_sort_buttons)
div1.add(movie_table)
def serve(cls, req):
wp = jp.QuasarPage(tailwind=True)
div = jp.Div(a=wp, classes="bg-gray-200 h-screen")
jp.Div(a=div,
text="Instant English Dictionary",
classes="text-4xl m-2")
jp.Div(a=div,
text="Get the definition of any English word as you type.",
classes="text-lg")
input_div = jp.Div(a=div, classes="grid grid-cols-2")
output_div = jp.Div(a=div, classes="m-2 p-2 text-lg border-2 h-40")
input_box = jp.Input(
a=input_div,
placeholder="Type in a word here...",
outputdiv=output_div,
classes=
"m-2 bg-gray-100 border-2 border-gray-200 rounded w-64 focus:bg-white "
"focus:outline-none focus:border-purple-500")
input_box.on("input", cls.get_definition)
# jp.Button(a=input_div, text="Get definition",
# classes="border-2 border-purple-500 rounded focus:outline-none "
# "focus:border-red-500", click=cls.get_definition, outputdiv=output_div, inputbox=input_box)
return wp
def show_demo():
wp = jp.WebPage()
b = jp.Button(text="Click to toggle show", a=wp, classes=button_classes)
d = jp.Div(text="Toggled by show", classes="m-2 p-2 text-2x1 border w-48", a=wp)
b.d = d
jp.Div(text="Will always show", classes="m-2", a=wp)
def toggle_show(self, msg):
self.d.show = not self.d.show
b.on("click", toggle_show)
b = jp.Button(text="Click to toggle visibility", a=wp, classes=button_classes)
d = jp.Div(text="Toggled by visible", classes="m-2 p-2 text-2x1 border w-48", a=wp)
d.visibility_state = "visible"
b.d = d
jp.Div(text="Will always show", classes="m-2", a=wp)
def toggle_visible(self, msg):
if self.d.visibility_state == "visible":
self.d.set_class("invisible")
self.d.visibility_state = "invisible"
else:
self.d.set_class("visible")
self.d.visibility_state = "visible"
b.on("click", toggle_visible)
return wp
async def result(self, msg):
if float(fee_inbox.value) == 0:
fee_inbox.set_classes('bg-red-700 font-bold text-white')
else:
fee_inbox.set_classes(inbox_style)
result_display.delete_components()
dates_non_overlap(self, msg)
jor = str(fee_inbox.value)
factor_mult_extras = float((factor_mult_extras_inbox.value / 100) + 1)
r = jp.P(text=operations_ctotal(
jor, factor_mult_extras,
operations_tiempos(start_workday_inbox.value, end_workday_inbox.value,
hs_por_jornada_inbox.value, night_check.checked)[2],
hs_por_jornada_inbox.value))
result.output = r.text
result.val_hs_extras = operations_ctotal.__getattribute__("val_hs_extras")
result.hs_ext_trabajadas = operations_ctotal.__getattribute__(
"hs_ext_trabajadas")
result.ganancia_por_hs_extras = operations_ctotal.__getattribute__(
"ganancia_por_hs_extras")
result_int_part = str(r.text).rsplit(".")[0]
result_display_decimal_part = str(r.text).rsplit(".")[1]
rd = jp.Div(
a=result_display, classes='flex py-2'
) # 'flex-col m-2 flex-shrink-0 flex-row content-start align-top inline-block text-align-right '
rd.add(jp.Div(text=result_int_part, classes='text-2xl'), jp.P(text='.'),
jp.Div(text=result_display_decimal_part, classes='text-ms'))
info_area_fn(self, msg)
await rd.update()
def serve(cls, req):
wp = jp.QuasarPage(tailwind=True)
lay = layout.DefaultLayout(a=wp)
container = jp.QPageContainer(a=lay)
div = jp.Div(a=container, classes="bg-gray-200 h-screen")
jp.Div(a=div,
text="Instant English Dictionary",
classes="text-4xl m-2")
jp.Div(
a=div,
text="Get the definition of any English word instantly as you type."
)
input_div = jp.Div(a=div, classes="grid grid-cols-2")
output_div = jp.Div(a=div, classes="m-2 p-2 text-lg border-2 h-40")
input_box = jp.Input(
a=input_div,
placeholder="Type in a word...",
outputdiv=output_div,
classes=
"m-2 bg-gray-100 border-2 border-gray2 rounded w-64 focus:outline-none "
"focus:border-purple-500 focus:bg-white py-2 px-4")
input_box.on('input', cls.get_definition)
return wp
def sort_by_director(self, msg):
movie_table.delete_components()
body_table_sorted = jp.Tbody(style='overflow:auto;')
with open('movies.json', encoding="utf8") as f:
data = json.load(f)
data.sort(key=get_key_director)
for i in data:
if i['Major_Genre'] == self.additional_properties[0]:
li.text = f'Genere selezionato: {self.additional_properties[0]}'
row_table = jp.Tr(style='')
div_table1 = jp.Td(style='width: 447px;', a=row_table)
div_title_film = jp.Div(style='cursor: pointer;',
text=i['Titolo'],
a=div_table1,
click=open_film)
div_table2 = jp.Td(style='width: 183px;', a=row_table)
div_director_film = jp.Div(style='cursor: pointer;',
text=i['Regista'],
a=div_table2,
click=open_film)
div_table3 = jp.Td(style='width: 100px;', a=row_table)
div_date_film = jp.Div(style='cursor: pointer;',
text=i['Data di uscita'],
a=div_table3,
click=open_film)
div_title_film.additional_properties = [i]
div_director_film.additional_properties = [i]
div_date_film.additional_properties = [i]
body_table_sorted.add(row_table)
movie_table.add(body_table_sorted)
def event_demo():
wp = jp.WebPage()
button_div = jp.Div(classes='flex m-4 flex-wrap', a=wp)
w_button_classes = 'bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 border border-blue-700 rounded ' \
'mr-2 '
r_button_classes = 'bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 border border-blue-700 ' \
'rounded mr-2 '
w_message = jp.Div(text='Click ↑ button to get weather condition',
classes='text-xl my-4',
a=wp)
r_message = jp.Div(text='Click ↑ button to get currency',
classes='text-xl my-4',
a=wp)
bw = jp.Button(text='Weather',
a=button_div,
classes=w_button_classes,
click=weather_click)
bw.message = w_message
br = jp.Button(text='Currency',
a=button_div,
classes=r_button_classes,
click=rate_click)
br.message = r_message
return wp
def inner_demo():
wp = jp.WebPage()
d = jp.Div(a=wp, classes = 'm-4 p-4 text-3x1')
d.inner_html = '<pre>Hello there. \n How are you?</pre>'
jp.Div(a=wp, inner_html=my_html)
for color in ['red', 'green', 'blue', 'pink', 'yellow', 'teal', 'purple']:
jp.Div(a=wp, inner_html=f'<p class="ml-2 text-{color}-500 text-3x1">{color}</p>')
return wp
def tab_comp_test():
wp = jp.WebPage(data={'tab': 'id2556'})
t = Tabs(a=wp,
classes='w-3/4 m-4',
style='',
animation=True,
content_height=550)
for chart_type in ['bar', 'column', 'line', 'spline']:
d = jp.Div(style=Tabs.wrapper_style, delete_flag=True)
my_chart = jp.HighCharts(a=d,
classes='m-2 p-2 border',
style='width: 1000px;',
options=my_chart_def,
use_cache=False)
my_chart.options.chart.type = chart_type
my_chart.options.title.text = f'Chart of Type {chart_type.capitalize()}'
my_chart.options.subtitle.text = f'Subtitle {chart_type.capitalize()}'
t.add_tab(f'id{chart_type}', f'{chart_type}', d)
d_flex = Div(classes='flex',
a=wp) # Container for the two dog pictures tabs
t = Tabs(a=d_flex,
classes=' w-1/2 m-4',
animation=True,
content_height=550,
model=[wp, 'tab'],
change=tab_change)
for pic_id in pics_papillons:
d = jp.Div(style=Tabs.wrapper_style)
jp.Img(
src=
f'https://images.dog.ceo/breeds/papillon/n02086910_{pic_id}.jpg',
a=d)
t.add_tab(f'id{pic_id}', f'Pic {pic_id}', d)
t = TabsPills(a=d_flex,
classes='w-1/2 m-4',
animation=True,
content_height=550,
change=tab_change)
for pic_id in pics_french_bulldogs:
d = jp.Div(style=Tabs.wrapper_style)
jp.Img(
src=
f'https://images.dog.ceo/breeds/bulldog-french/n02108915_{pic_id}.jpg',
a=d)
t.add_tab(f'id{pic_id}', f'Pic {pic_id}', d)
input_classes = "w-1/3 m-2 bg-gray-200 border-2 border-gray-200 rounded w-64 py-2 px-4 text-gray-700 focus:outline-none focus:bg-white focus:border-purple-500"
in1 = jp.Input(classes=input_classes, model=[wp, 'tab'], a=wp)
return wp
def form_submitted(request):
wp = jp.WebPage()
wp.display_url = '/thanks'
jp.Div(text='Thank you for submitting the form',
a=wp,
classes='text-xl m-2 p-2')
for field in session_data[request.session_id]:
if field.type in ['text', 'password']:
pass
elif field.type == 'checkbox' and field.checked:
jp.Div(text='We will send you stuff',
a=wp,
classes='text-lg m-1 p-1')
return wp
def radio_test():
wp = jp.WebPage()
genders = ["male", "female", "other"]
ages = [(0, 30), (31, 60), (61, 100)]
outer_div = jp.Div(classes="border m-2 p-2 w-64", a=wp)
# Create div to show radio button selection but don't add yet to page. It will be added at the end
# It is created here so that it could be assigned to the radio button attribute result_div
result_div = jp.Div(
text="Click radio buttons to see results here", classes="m-2 p-2 text-xl"
)
jp.P(a=outer_div, text="Please select your gender:")
gender_list = []
for gender in genders:
label = jp.Label(classes="inline-block mg-1 p-1", a=outer_div)
radio_btn = jp.Input(
type="radio",
name="gender",
value=gender,
a=label,
btn_list=gender_list,
result_div=result_div,
change=radio_changed,
)
gender_list.append(radio_btn)
jp.Span(classes="ml-1", a=label, text=gender.capitalize())
jp.Div(a=outer_div, classes="m-2") # Add spacing and line break
jp.P(a=outer_div, text="Please select your age:")
age_list = []
for age in ages:
label = jp.Label(classes="inline-block mb-1 p-1", a=outer_div)
radio_btn = jp.Input(
type="radio",
name="age",
value=age[0],
a=label,
btn_list=age_list,
result_div=result_div,
change=radio_changed,
)
age_list.append(radio_btn)
jp.Span(classes="ml-1", a=label, text=f"{age[0]} - {age[1]}")
jp.Br(a=outer_div)
wp.add(result_div)
return wp
def serve(cls, req):
wp = jp.QuasarPage(tailwind=True)
lay = xp.DefaultLayout(a=wp, view="hHh lpR fFf")
page_container = jp.QPageContainer(a=lay)
div = jp.Div(a=page_container, classes="bg-gray-200 h-screen p-2")
jp.Div(a=div, text="This is the Home page!", classes="text-4xl m-2")
jp.Div(a=div,
text="""
afdgdfglk ;lsdfgldkfl; ;fmdfsjg;ij; kjsdoiugfjdsfdk
""",
classes="text-lg")
return wp
def event_demo():
number_of_buttons = 25
wp = jp.WebPage()
button_div = jp.Div(classes='flex m-4 flex-wrap', a=wp)
button_classes = 'w-32 mr-2 mb-2 bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full'
message = jp.Div(classes='text-lg border m-2 p-2 overflow-auto h-64', a=wp)
message.add(jp.P(text='No button clicked yet'))
button_list = []
for i in range(1, number_of_buttons + 1):
b = jp.Button(text=f'Button {i}', a=button_div, classes=button_classes, click=button_click)
b.message = message
b.num_clicked = 0
button_list.append(b)
wp.button_list = button_list # The list will now be referenced by the WebPage instance attribute
return wp
def serve(cls, req):
wp = jp.QuasarPage(tailwind=True)
lay = layout.DefaultLayout(a=wp)
container = jp.QPageContainer(a=lay)
con = jp.Div(a=container, classes="bg-purple-300 m-24 p-10 rounded")
jp.Div(a=con, text="This is the home page", classes="text-4xl m-2")
jp.Div(a=con,
text="""
This website was created by Martin Slater, 18th February 2021
using JustPy and Tailwind CSS
""",
classes="text-lg")
return wp
def pydeck_demo(request):
wp = jp.QuasarPage(tailwind=True, title='Uber NYC Pickups')
wp.decks = {}
slider_div = jp.Div(a=wp,
classes='flex ml-4',
style='width: 50%; margin-top: 20px')
jp.Div(text='Select hour of pickup:',
a=slider_div,
classes='pt-3 text-xl font-bold ')
s1 = jp.Span(classes='ml-6 mt-1', style='width: 50%', a=slider_div)
jp.QSlider(classes='w-64',
min=0,
max=23,
a=s1,
label=True,
label_always=True,
markers=True,
step=1,
snap=True,
color='red',
change=slider_change)
deck_div = jp.Div(classes='flex ml-2', a=wp)
hour_data = data[data[DATE_TIME].dt.hour == int(0)]
deck = map_deck(hour_data, midpoint[0], midpoint[1], zoom_level_main)
all_div = jp.Div(a=deck_div)
wp.all_caption = jp.Div(text='All New York City from 0:00 to 1:00',
a=all_div,
style='margin: 10px;',
classes='text-xl font-bold')
wp.decks['main'] = jp.PyDeckFrame(
a=all_div,
deck=deck,
style='margin: 10px; height: 400px; width: 450px',
transition_duration=0.5)
for airport, coords in airports.items():
airport_deck = map_deck(hour_data, coords[0], coords[1],
zoom_level_airports)
airport_div = jp.Div(a=deck_div)
jp.Div(text=f'{airport} Airport',
a=airport_div,
style='margin: 10px;',
classes='text-xl font-bold')
wp.decks[airport] = jp.PyDeckFrame(
a=airport_div,
deck=airport_deck,
style='margin: 10px; height: 400px; width: 250px',
transition_duration=0.5)
if _has_altair:
chart = create_histogram(0)
wp.histogram_caption = jp.Div(
text='Breakdown of rides per minute between 0:00 and 1:00',
a=wp,
style='margin-left: 30px;',
classes='text-xl font-bold')
wp.histogram = jp.AltairChart(chart=chart,
a=wp,
style='padding: 10px; width: 100%;')
return wp
def serve(self):
wp = jp.QuasarPage(tailwind=True)
lay = layout.DefaultLayout(a=wp)
container = jp.QPageContainer(a=lay)
div = jp.Div(a=container, classes="bg-gray-200 h-screen")
jp.Div(a=div, text="This is the about page!", classes="text-4xl m-2")
jp.Div(a=div, text="""
iuhuih ihiusd uaih duasihdiuashd iusah diuhas da
iushdiua sdiuhs auidh asihd iuahd auhd
dsiuahd iusah duihas uidhasuihd iuashd iuash d
sudhiuadh iuashdiuash duihasiudhasuidh iu
""", classes="text-lg")
return wp
def __init__(self, **kwargs):
atexit.register(self.close)
super().__init__(**kwargs)
layout = jp.QLayout(view="hHh Lpr lff", classes="q-pa-md", style="height:300px", a=self)
async def toggle_menu(comp, msg):
print("button clicked")
await drawer.run_method("toggle()", msg.websocket)
with _(jp.QHeader(elevated=True, classes="bg-black", a=layout)) as header:
with _(jp.QToolbar(a=header)) as toolbar:
toolbar += jp.QBtn(flat=True, round=True, dense=True, icon="menu", click=toggle_menu)
toolbar += jp.QToolbarTitle(text="Header!!")
with _(
jp.QDrawer(
v_model="drawer",
show_if_above=True,
width=200,
breakpoint=500,
bordered=True,
content_class="bg-grey-3",
a=layout,
)
) as drawer:
with _(jp.QScrollArea(classes="fit", a=drawer)) as scrollarea:
with _(jp.QList(a=scrollarea)) as qlist:
with _(jp.Div(a=qlist)) as menu:
self.menu = menu
page_container = jp.QPageContainer(a=layout)
self.content = jp.QPage(padding=True, a=page_container)
def launcher(request):
wp = jp.QuasarPage()
wp.tailwind = True
wp.head_html = """
<link rel="stylesheet" href="https://unpkg.com/tailwindcss@^1.5/dist/base.min.css" />
<link rel="stylesheet" href="https://unpkg.com/tailwindcss@^1.5/dist/components.min.css" />
<link
rel="stylesheet"
href="https://unpkg.com/@tailwindcss/[email protected]/dist/typography.min.css"
/>
<link rel="stylesheet" href="https://unpkg.com/tailwindcss@^1.5/dist/utilities.min.css" />
"""
tlc = jp.Div(a=wp, classes="container mx-auto bg/gray/1")
title_ = wf.dur.title_banner_("title", "Monal Insights: An advanced Imaging Solutions Company")
title_(tlc, "")
intro_text = """
MonalInsights specializes in solutions and technologies for satellite and microCT images.
We provide end-to-end solution for ingestion, cleaning, registration, and advanced analysis of
images captured in industrial (oil and gas exploration, biomedical) and institutional domains (climate change, agricultural, forest).
"""
wf.dur.prose_("intro", intro_text, pcp=[])(tlc, "")
key_technology_topics = ["Massive Scale Image Storage and Processing Framework", "SemiSupervised based clustering and classification"]
#wf.fc.StackV_()
wf.fc.StackV_("keytechpanel", [
wf.dur.heading_("heading", "Key technologies", pcp=[mr/st/6]),
wf.fc.StackH_("keytechbuttons", map(lambda l: wf.dur.divbutton_(l, l, l, no_action), key_technology_topics))
]
)(tlc, "")
return wp
def rot_img():
wp = jp.WebPage()
image = jp.Img(src='https://i.ibb.co/Pjh1cJ6/caveman.jpg', a=wp)
image.classes = 'm-4 p-4 inline-block border border-blue-500 rounded'
image.style = f'transform: rotate(0deg)'
image.height = 400
image.width = 400
button_div = jp.Div(classes='flex m-4 flex-wrap', a=wp)
button_classes = 'bg-blue-500 hover:bg-blue-700 text-white py-1 px-2 border border-blue-700 rounded items-center'
def rotate(self, msg):
if self.image.style == f'transform: rotate(0deg)':
self.image.style = f'transform: rotate(90deg)'
elif self.image.style == f'transform: rotate(90deg)':
self.image.style = f'transform: rotate(180deg)'
elif self.image.style == f'transform: rotate(180deg)':
self.image.style = f'transform: rotate(270deg)'
elif self.image.style == f'transform: rotate(270deg)':
self.image.style = f'transform: rotate(0deg)'
br = jp.Button(text='Rotate',
a=button_div,
classes=button_classes,
click=rotate)
br.image = image
return wp
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.in1 = jp.Input(a=self, placeholder='type me',
input = self.input_handler)
self.in2 = jp.Input(a=self, placeholder='type me2',
input = self.input_handler)
self.in2.div = jp.Div(text='What do you type?', a=self)
async def stand(self, msg):
wp = msg.page
# Show dealer card
wp.card_back.set_class('hidden')
wp.down_card.remove_class('hidden')
for btn in [wp.stand_btn, wp.hit_btn]:
btn.disabled = True
btn.set_classes('cursor-not-allowed bg-gray-200 opacity-50')
await wp.update()
await asyncio.sleep(1.1)
while True:
dealer_hand_value = hand_value(wp.dealer_hand)
if dealer_hand_value > 16:
break
card_dict = jp.Dict(await deal(wp.deck_id))
card = card_dict.cards[0]
wp.dealer_hand.append(card)
wp.dealer_div.add(Card(src=card.image))
await wp.update()
await asyncio.sleep(1.1)
player_hand_value = hand_value(wp.player_hand)
result_div = jp.Div(classes=div_classes, a=wp.outer_div)
if (dealer_hand_value > 21) or (dealer_hand_value < player_hand_value):
result_div.text = f'YOU WON, Your hand: {player_hand_value}, Dealer\'s hand: {dealer_hand_value}'
elif dealer_hand_value > player_hand_value:
result_div.text = f'YOU LOST, Your hand: {player_hand_value}, Dealer\'s hand: {dealer_hand_value}'
else:
result_div.text = f'IT IS A DRAW, Your hand: {player_hand_value}, Dealer\'s hand: {dealer_hand_value}'
wp.play_again_btn.remove_class('hidden')
def event_demo():
number_of_buttons = 25
wp = jp.WebPage()
button_div = jp.Div(classes='flex m-4 flex-wrap', a=wp)
button_classes = 'w-32 mr-2 mb-2 bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-full'
message = jp.Div(text='No button clicked yet',
classes='text-2xl border m-4 p-2',
a=wp)
for i in range(1, number_of_buttons + 1):
b = jp.Button(text=f'Button {i}',
a=button_div,
classes=button_classes,
click=button_click)
b.message = message
b.num_clicked = 0
return wp
def model_demo():
wp = jp.WebPage()
d = jp.Div(a=wp, data={'text': ''})
repeat = 2
output = jp.Div(a=d)
jp.Div(text=f'output', a=output)
MyDiv(text=f'typing will go here',
a=output,
model=[d, 'text'],
repeat=repeat,
initial_text='Yada Yada')
middle_input = jp.Input(text='',
placeholder='Type here',
model=[d, 'text'],
a=d)
return wp
def serve(self):
wp = jp.WebPage()
div = jp.Div(a=wp, classes="bg-gray-200 h-screen")
jp.Div(a=div, text="Instant Dictionary API", classes="text-4xl m-2")
jp.Div(a=div, text="Get definitions of words: ", classes="text-lg")
jp.Hr(a=div)
jp.Div(a=div, text="www.example.com/api?w=rabbit")
jp.Hr(a=div)
jp.Div(a=div,
text="""
{"word": "rabbit", "definition":
["One of several small mammals of the family Leporidae,
with long ears, long hind legs and a short, fluffy tail."]}
""")
return wp
def test_quasar_layout():
from humbletray import layout
"""Basic sanity checks."""
default = layout.DefaultLayout()
default.content.add(jp.Div(text="success"))
assert 'success' in default.to_html()
assert 'q-layout' in default.to_html()
def index():
wp = jp.WebPage()
ymd = datetime.date.today().strftime("%Y%m%d")
for media_id in media_list:
d = jp.Div(a=wp, classes='flex bg-blue-200 text-lg p-2 m-2')
jp.A(text=media_list[media_id], href=f'/news/{media_id}/{ymd}', a=d)
return wp
def load_images(mode=1, pattern=''):
wp.all_image_containers = []
small_img = ''
for i in range(len(wp.small_images)):
small_img_container = jp.Div(a=images_container, classes=small_img_container_classes,
click=select_default_img, mouseenter=small_container_mouseenter,
mouseleave=small_container_mouseleave, )
if mode == 1:
small_img = jp.Img(src=f'/static/{wp.small_images[i]}', a=small_img_container, style=small_img_style, )
elif mode == 2:
if pattern:
filename_text = basename(wp.small_images[i]).replace(pattern, '')
filename_text = filename_text.replace(filename_text[filename_text.find('.'):], '')
small_img = jp.P(src=f'/static/{wp.small_images[i]}', a=small_img_container,
text=filename_text)
else:
small_img = jp.P(src=f'/static/{wp.small_images[i]}', a=small_img_container,
text=basename(wp.small_images[i]))
small_img_container.child = small_img
wp.all_image_containers.append(small_img_container)
wp.main_img.style = main_img_style
wp.main_img.style += 'position: absolute;'
wp.all_image_containers[0].set_class('bg-red-700')
main_img.show = True
def serve(self):
wp = jp.QuasarPage(tailwind=True)
lay = layout.DefaultLayout(a=wp)
container = jp.QPageContainer(a=lay)
div = jp.Div(a=container, classes="bg-gray-200 h-screen p-2")
jp.Div(a=div, text="This is the About page!", classes="text-4xl m-2")
jp.Div(a=div,
text="""
A web app that lets users type in a term in a text box and returns the English definition
of that term instantly as soon as the user has finished typing.
""",
classes="break-normal md:break-all text-lg")
return wp
def serve(cls, req):
wp = jp.QuasarPage(tailwind=True)
lay = layout.DefaultLayout(a=wp)
container = jp.QPageContainer(a=lay)
div = jp.Div(a=container, classes="bg-gray-200 h-screen p-2")
jp.Div(a=div, text="This is the Home page!", classes="text-4xl m-2")
jp.Div(a=div,
text="""
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin mattis quis purus et placerat.
Fusce viverra consequat odio, eget ornare mauris suscipit id. Morbi eu urna mattis,
tristique neque vel, ullamcorper metus.
""",
classes="text-lg")
return wp