def create_page(): page = Report() page.headers.dev() page.theme = ThemeBlue.BlueGrey() tickers_info = { 'BAC': "Bank of America", 'GS': "Goldman Sachs", 'JPM': "JPMorgan Chase", 'SAN.MC': "Banco Santander", 'C.MX': "Citigroup Inc.", 'HSBC-PA': "HSBC Holdings PLC" } title = page.ui.title("Flask - Advanced example 1") ticker = page.ui.fields.select( cpns.select.from_dict(tickers_info), label="Tickers", multiple=True, html_code="ticker_value") from_dt = page.ui.fields.date(value="M-1", html_code="from_date", label="From") to_dt = page.ui.fields.today(html_code="to_date", label="To") button = page.ui.buttons.colored("Click") text = page.ui.calendars.pill("1Y", group="chart_time") text_6m = page.ui.calendars.pill("6M", group="chart_time") text_2m = page.ui.calendars.pill("2M", group="chart_time") text_1m = page.ui.calendars.pill("1M", group="chart_time") sub_title = page.ui.title("Financial Sector 2020") buttons = page.ui.div([text, text_6m, text_2m, text_1m]) chart = page.ui.charts.chartJs.line([], x_axis='Date') chart.options.scales.y_axis().ticks.toNumber() chart.options.scales.y_axis().add_label("Stock Price (USD)") chart.options.scales.x_axes().add_label("Date") chart.options.tooltips.callbacks.labelCurrency("$", digit=4) table = page.ui.tables.aggrid([]) button.click([ page.body.loading(), page.js.post("/test_event", components=[ticker, from_dt, to_dt]).onSuccess([ chart.build(events.data["chart"]), table.js.setColumnDefs(events.data["columns"]), table.js.setRowData(events.data["table"]), page.body.loading(False)])]) text.click([from_dt.input.build(text.dom.content), button.dom.events.trigger("click")]) text_6m.click([from_dt.input.build(text_6m.dom.content), button.dom.events.trigger("click")]) text_2m.click([from_dt.input.build(text_2m.dom.content), button.dom.events.trigger("click")]) text_1m.click([from_dt.input.build(text_1m.dom.content), button.dom.events.trigger("click")]) powered = page.ui.rich.powered() hr = page.ui.layouts.hr() box = page.ui.div() box.extend([title, powered, hr, ticker, from_dt, to_dt, button, sub_title, buttons, chart, table]) box.style.doc() return page
def create_page(): page = Report() page.headers.dev() page.theme = ThemeBlue.BlueGrey() tickers_info = { 'BAC': "Bank of America", 'GS': "Goldman Sachs", 'JPM': "JPMorgan Chase", 'SAN.MC': "Banco Santander", 'C.MX': "Citigroup Inc.", 'HSBC-PA': "HSBC Holdings PLC" } title = page.ui.title("Flask - Advanced example 2") ticker = page.ui.fields.select(cpns.select.from_dict(tickers_info), label="Tickers", multiple=True, html_code="ticker_value") from_dt = page.ui.fields.date(value="M-1", html_code="from_date", label="From") to_dt = page.ui.fields.today(html_code="to_date", label="To") button = page.ui.buttons.colored("Click") sub_title = page.ui.title("Financial Sector") pivot = page.ui.tables.pivots.plotly() button.click([ page.body.loading(), page.js.post("/test_event", components=[ticker, from_dt, to_dt]).onSuccess([ pivot.build(events.data["table"]), page.body.loading(False) ]) ]) powered = page.ui.rich.powered() hr = page.ui.layouts.hr() box = page.ui.div() box.extend( [title, powered, hr, ticker, from_dt, to_dt, button, sub_title, pivot]) box.style.configs.doc() return page
from epyk.core.Page import Report from epyk.core.data import components from epyk.core.css.themes import ThemeBlue from epyk.core.data import events # Create a basic report object page = Report() page.headers.dev() template = page.body.add_template(defined_style="doc") template.style.css.background = "white" page.theme = ThemeBlue.BlueGrey() categories = ["Shopping", "Meeting"] page.ui.title("My todo list") check_list = page.ui.lists.checks(width=(100, "%")) check_list.options.delete = True check_list.style.css.border = True check_list.style.css.padding = 5 item = page.ui.inputs.left(placeholder="Add your item", width=(None, '')) category = page.ui.select(components.select.from_list(categories)) button = page.ui.buttons.colored("Add") page.css.customText('''.test:hover {color: green !IMPORTANT}''') container = page.ui.div() for c in [item, category, button]: container.add(page.ui.layouts.inline(c)) container[1].style.css.padding_left = 5 container[1].style.css.padding_right = 5
def create_page(): page = Report() page.headers.dev() page.body.add_template(defined_style="doc") page.theme = ThemeBlue.BlueGrey() title = page.ui.title("Python") page.ui.layouts.underline() title.options.editable = True sub_title = page.ui.titles.subtitle("The Python Community") page.ui.menu(sub_title, post="/bar") p = page.ui.paragraph(''' The [Python Software Foundation](https://www.python.org/psf/) and the global Python community welcome and encourage participation by everyone. Our community is based on mutual respect, tolerance, and encouragement, and we are working to help each other live up to these principles. ''', options={"markdown": True}) page.ui.menu(p) table = page.ui.tables.tabulator(mocks.languages) page.ui.tables.menu(table, post="/table") page.ui.titles.subtitle("Zoom on a package") pkg_name = page.ui.fields.input("epyk", label="Package name", html_code="package") bar_chart = page.ui.charts.chartJs.bar(y_columns=["download"], x_axis="name") menu_bar = page.ui.charts.menu(bar_chart, post={ "url": "/chart", "components": [pkg_name] }) pie_chart = page.ui.charts.chartJs.pie(y_columns=["value"], x_axis="type") menu_pie = page.ui.charts.menu(pie_chart, post={ "url": "/pie", "components": [pkg_name] }) row = page.ui.row([[menu_bar, bar_chart], [menu_pie, pie_chart]], position="top") row.options.responsive = False row.options.autoSize = False sub_title2 = page.ui.titles.subtitle("Conferences and Workshops") sub_title2.options.editable = True p2 = page.ui.paragraph(''' There are a number of conferences held each year where the Python community gathers together (listed alphabetically): ''', options={"markdown": True}) page.ui.menu(p2, save_funcs=[page.js.alert(p2.dom.content)], update_funcs=[p2.build("Updated paragraph")], profile=True) sq = page.ui.lists.squares(["DjangoCon Europe"]) page.ui.lists.menu(sq) page.ui.layouts.hr().css({"margin-top": '20px'}) page.ui.titles.subtitle("Report powered by") page.ui.rich.powered() page.ui.icons.fixed("fas fa-file-download").click([ std.var("backboneData", global_scope=True).addComponent(sub_title), page.js.clipboard( std.var("backboneData", global_scope=True).stringify()), page.js.window.download( page.js.window.btoa( std.var("backboneData", global_scope=True).stringify()), "configuration.json") # page.js.location.download(page.js.location.getUrlFromData(std.var("backboneData", global_scope=True).stringify())) ]) page.body.onReady([ std.var("backboneData", value={}, global_scope=True), ]) return page
def create_page(): page = Report() page.theme = ThemeBlue.BlueGrey() page.body.style.css.background = "linear-gradient(45deg, #00f 1%, #fff 1%, #fff 49%, #00f 49%, #00f 51%, #fff 51%, #fff 99%, #00f 99%)" page.body.style.css.background_size = "20px 20px" page.body.style.css.background_position = "0 0" page.body.style.css.text_align = "center" page.body.style.css.padding_top = 10 page.body.style.css.padding_bottom = 10 page.body.style.css.min_height = "100%" container = page.ui.div(width=(100, '%'), height=(100, '%')) container.style.css.background = "white" container.style.css.max_width = "600px" container.style.css.margin = "auto" container.style.css.padding = "0 10px" container.style.configs.shadow() title = page.ui.titles.head("Pseudorandom Number Generator in Python") title.style.css.display = "inline-block" container.add(title) sub_title0 = page.ui.titles.title("Mersenne Twister") paragraph = page.ui.panels.sliding(''' The Mersenne Twister is a pseudorandom number generator (PRNG). It is by far the most widely used general-purpose PRNG.[1] Its name derives from the fact that its period length is chosen to be a Mersenne prime. The Mersenne Twister was developed in 1997 by Makoto Matsumoto [ja] (松本 眞) and Takuji Nishimura (西村 拓士).[2] It was designed specifically to rectify most of the flaws found in older PRNGs. The most commonly used version of the Mersenne Twister algorithm is based on the Mersenne prime 219937−1. The standard implementation of that, MT19937, uses a 32-bit word length. There is another implementation (with five variants[3]) that uses a 64-bit word length, MT19937-64; it generates a different sequence. ''', sub_title0) container.add(paragraph) container.add(page.ui.layouts.hr()) sub_title = page.ui.titles.title("Parameters") container.add(sub_title) seed1 = page.ui.fields.input(label="seed", html_code="seed") container.add(seed1) n = page.ui.fields.input(label="Samples", html_code="n") container.add(n) valid = page.ui.buttons.colored("Run Python") valid_js = page.ui.buttons.colored("Run Javascript") valid_js.style.css.margin_left = 10 container.add(page.ui.div([valid, valid_js])) container.add(page.ui.layouts.hr()) py_title = page.ui.titles.section("Python Results") container.add(py_title) line = page.ui.charts.chartJs.line([], y_columns=["y"], x_axis=["x"], height=160) bar = page.ui.charts.chartJs.bar([], y_columns=["c"], x_axis=["b"], height=160) container.add(page.ui.row([line, bar]).css({"background": 'white'})) js_title = page.ui.titles.section("Javascript Results") container.add(js_title) js_line = page.ui.charts.chartJs.line([], y_columns=["y"], x_axis=["x"], height=160) container.add(js_line) valid.click([ page.js.objects.time("window.time_py"), page.js.post("/compute", [seed1, n]).onSuccess([ line.build(events.data["line"]), bar.build(events.data["bar"]), page.js.console.perf("window.time_py", label="Python Processing: "), page.js.print("Python computed", 2000, cssAttrs={"bottom": "10px", 'right': "10px", 'position': 'fixed'}) ]), ]) valid_js.click([ page.js.objects.list.new([], "js_data"), page.js.objects.time("window.time_py"), expr.for_(n, [ page.js.objects.new({}, "row"), page.js.objects.get("row").setattr("y", page.js.math.random()).r, page.js.objects.get("row").setattr("x", page.js.objects.get("i")).r, page.js.objects.list.get("js_data").push(page.js.objects.get("row")) ]), js_line.build(page.js.objects.list.get("js_data")), page.js.console.perf("window.time_py", label="Javascript Processing: "), page.js.print("Javascript computed", 2000, cssAttrs={"bottom": "10px", 'right': "10px", 'position': 'fixed'}) ]) return page