def __init__(self, **kwargs): super().__init__(**kwargs) # layout = jp.QLayout(a=self, view="hHh lpR fFf") header = jp.QHeader(a=self, elevated=True) # header.on("class", "bg-primary text-white") toolbar = jp.QToolbar(a=header) q_drawer = jp.QDrawer(a=self, show_if_above=True, v_model="left", side="left", bordered=True) scroll_area = jp.QScrollArea(a=q_drawer, classes="fit") drawer_list = jp.QList(a=scroll_area) list_classes = "p-2 m-2 text-lg text-blue-400 hover:text-blue-700" jp.A(a=drawer_list, text="Home", href="/", classes=list_classes) jp.Br(a=drawer_list) jp.A(a=drawer_list, text="Dictionary", href="/dictionary", classes=list_classes) jp.Br(a=drawer_list) jp.A(a=drawer_list, text="About", href="/about", classes=list_classes) jp.Br(a=drawer_list) jp.QBtn(a=toolbar, dense=True, flat=True, icon="menu", click=self.move_drawer, drawer=q_drawer) # q_button.on("round", True) jp.QToolbarTitle(a=toolbar, text="Instant Dictionary")
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 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 __init__(self, view="hHh lpR fff", **kwargs): super().__init__(view=view, **kwargs) header = jp.QHeader(a=self) toolbar = jp.QToolbar(a=header) drawer = jp.QDrawer(a=self, show_if_above=True, v_mode="left", bordered=True) scroller = jp.QScrollArea(a=drawer, classes="fit") qlist = jp.QList(a=scroller) a_classes = "p-2 m-2 text-lg text-blue-400 hover:text-blue-700" jp.A(a=qlist, text="Home", href="/", classes=a_classes) jp.Br(a=qlist) jp.A(a=qlist, text="Dictionary", href="/dictionary", classes=a_classes) jp.Br(a=qlist) jp.A(a=qlist, text="About", href="/about", classes=a_classes) jp.Br(a=qlist) jp.QBtn(a=toolbar, dense=True, flat=True, round=True, icon="menu", click=self.move_drawer, drawer=drawer) jp.QToolbarTitle(a=toolbar, text="Instant Dictionary")
def foo(self, msg): msg.page.content.delete_components() jp.QBtn(text="back to main", click=index, a=msg.page.content) for n in range(0, 155): msg.page.content.add( jp.P( text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Fugit nihil praesentium molestias a adipisci, dolore vitae odit, quidem consequatur optio voluptates asperiores pariatur eos numquam rerum delectus commodi perferendis voluptate?" ) )
def quasar_example(): wp = jp.QuasarPage(dark=True) # Load page in dark mode d = jp.Div(classes='q-pa-md q-gutter-sm', a=wp) jp.QBtn(color='primary', icon='mail', label='On Left', a=d, click=my_click) jp.QBtn(color='secondary', icon_right='mail', label='On Right', a=d, click=my_click) jp.QBtn(color='red', icon='mail', icon_right='send', label='On Left and Right', a=d, click=my_click) jp.Br(a=d) jp.QBtn(icon='phone', label='Stacked', stack=True, glossy=True, color='purple', a=d, click=my_click) return wp
def __init__(self, **kwargs): super().__init__(**kwargs) c1 = self c1.classes = 'bg-grey-3' c2 = jp.QBtn(flat=True, round=True, dense=True, a=c1) c3 = jp.QIcon(name='menu', a=c2) c4 = jp.QMenu(a=c2) c5 = jp.QList(style='min-width: 100px', a=c4) c6 = jp.QItem(clickable=True, v_close_popup=True, a=c5) c7 = jp.QItemSection(a=c6) c8 = jp.A(href='/about', style='text-decoration: none', a=c7, text='about') c9 = jp.QSeparator(a=c5) c10 = jp.QItem(clickable=True, v_close_popup=True, a=c5) c11 = jp.QItemSection(a=c10) c12 = jp.A(href='/tool', style='text-decoration: none', a=c11, text='help') c13 = jp.QToolBarTitle(a=c1, text='Toolbar') c14 = jp.QBtn(flat=True, round=True, dense=True, a=c1) c15 = jp.QIcon(name='more_vert', a=c14)
def home(): wp = jp.QuasarPage(tailwind=True) div = jp.Div(a=wp, classes="bg-gray-200 h-screen") div1 = jp.Div(a=div, classes="grid grid-cols-3 gap-4 p-4") in_1 = jp.Input(a=div1, placeholder="Enter first value", classes="form-input") in_2 = jp.Input(a=div1, placeholder="Enter second value", classes="form-input") d_output = jp.Div(a=div1, text="Result", classes="text-gray-600") jp.Div(a=div1, text="Just another Div", classes="text-gray-600") jp.Div(a=div1, text="Yet another Div", classes="text-gray-600") div2 = jp.Div(a=div, classes="grid grid-cols-2 gap-4") jp.QBtn(a=div2, text="Calculate", click=sum_up, in1=in_1, in2=in_2, d=d_output, classes="border border-blue-500 m-2 py-1 px-4 rounded " "text-blue-600 hover:bg-red-500 hover:text-white") jp.Div(a=div2, text="I'm an interactive div", mouseenter=mouse_enter, mouseleave=mouse_leave, classes="hover:bg-red-500") return wp
def create_inputs(wp): input_div = jp.Div(classes='flex m-2 p-2', a=wp) style = 'width: 150px' wp.ticker = jp.QInput(label='Enter ticker', hint='', a=input_div, classes='m-2', style='width: 100px', value='AAPL', outlined=True) wp.param_type = jp.QSelect(label='Param type', hint='', options=['Standard', 'Nonstandard'], a=input_div, classes='m-2', style=style, value='Standard', outlined=True) wp.price_type = jp.QSelect(label='Price type', hint='Select price to use for calculation', options=['mid', 'last'], a=input_div, classes='m-2', style=style, value='mid', outlined=True) wp.opt_type = jp.QSelect(label='Option type', hint='Select option type', options=['calls', 'puts', 'both'], a=input_div, classes='m-2', style=style, value='both', outlined=True) wp.moneyness = jp.QSelect(label='Moneyness', hint='Select moneyness to plot', options=['itm', 'otm', 'both'], a=input_div, classes='m-2', style=style, value='both', outlined=True) wp.r = jp.QInput(label='Enter risk free rate', hint='',a=input_div, classes='m-2', style='width: 150px', value=0.004, type='number', outlined=True) now = dt.datetime.now() wp.current_date = str(now.date()) minute = now.time().minute wp.current_time = '{}:{}'.format(now.time().hour, minute) if minute < 10: wp.current_time = '{}:0{}'.format(now.time().hour, minute) wp.date_time = jp.QInputDateTime(a=input_div, classes='m-2', value=f'{wp.current_date} {wp.current_time}', hint='Date and time to use', outlined=True) wp.plot_button = jp.QBtn(label='Generate Plots', color='primary', a=input_div, classes='m-2 h-1') wp.input_div = input_div return wp
def __init__(self, view="hHh lpR fFf", **kwargs): super().__init__(view=view, **kwargs) header = jp.QHeader(a=self) toolbar = jp.QToolbar(a=header, classes="bg-purple-700") drawer = jp.QDrawer(a=self, show_if_above=True, v_mode='left', bordered=True) scroller = jp.QScrollArea(a=drawer, classes="fit") qlist = jp.QList(a=scroller) a_class = "p-2 m-2 text-lg text-purple-400 hover:text-purple-700" jp.A(a=qlist, text="Home", href="/", classes=a_class) jp.Br(a=qlist) jp.A(a=qlist, text="Dictionary", href="/dictionary", classes=a_class) jp.Br(a=qlist) jp.A(a=qlist, text="About", href="/about", classes=a_class) jp.Br(a=qlist) jp.A(a=qlist, text="Flat Mate Bill", href="/fmb", classes=a_class) jp.Br(a=qlist) jp.QBtn(a=toolbar, dense=True, flat=True, round=True, icon="menu", click=self.move_drawer, drawer=drawer) jp.QToolbarTitle(a=toolbar, text='OOP course modules')
def index(self, msg): msg.page.content.delete_components() jp.QBtn(text="foo", click=foo, a=msg.page.content)
def happiness_plot(request): # ['Country', 'Rank', 'Score', 'Unexplained', 'GDP', 'Social_support', 'Health', 'Freedom', 'Generosity', Corruption'] wp = jp.QuasarPage() chart_theme = request.query_params.get('theme', 8) # Default is 'grid' themes = [ 'high-contrast-dark', 'high-contrast-light', 'avocado', 'dark-blue', 'dark-green', 'dark-unica', 'gray', 'grid-light', 'grid', 'sand-signika', 'skies', 'sunset' ] wp.highcharts_theme = themes[int(chart_theme)] wp.stacking = '' wp.cols_to_plot = [3, 4, 5, 6, 7, 8, 9] wp.df = df d = jp.Div(classes='q-ma-lg', a=wp) bg = jp.QBtnToggle(push=True, glossy=True, toggle_color='primary', value='', a=d, input=stack_change, style='margin-right: 30px') bg.options = [{ 'label': 'No Stacking', 'value': '' }, { 'label': 'Normal', 'value': 'normal' }, { 'label': 'percent', 'value': 'percent' }] wp.toggle_list = [] corr_button = jp.QBtn(label='Show pairwise correlation', a=d, click=corr_button_click) for i in df.columns[3:]: wp.toggle_list.append( jp.QToggle(checked_icon='check', color='green', unchecked_icon='clear', value=True, label=f'{i}', a=d, input=series_change)) # ,style='margin-right: 10px', chart = df.jp.plot( 'Country', wp.cols_to_plot, kind='column', a=wp, title='World Happiness Ranking', subtitle= 'Click and drag in the plot area to zoom in. Shift + drag to pan', stacking='', classes='border m-2 p-2 q-ma-lg p-ma-lg') grid = df.jp.ag_grid(a=wp) grid.options.columnDefs[0].rowDrag = True for event_name in [ 'sortChanged', 'filterChanged', 'columnMoved', 'rowDragEnd' ]: grid.on(event_name, grid_change) wp.c = chart grid.c = chart bg.c = chart return wp