HtmlContainer Module

class epyk.core.html.HtmlContainer.Caption(page: PageModel, text: Optional[str], color: Optional[str], align: Optional[str], width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], html_code: Optional[str], tooltip: Optional[str], options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

property options: OptionsText: Property to set all the possible object for a button.

class epyk.core.html.HtmlContainer.Col(page, components, position: str, width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], align: str, helper: str, options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

add(component: Html)

Add items to a container.

Parameters:: component –

build(data=None, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None, component_id: Optional[str] = None, dataflows: Optional[List[dict]] = None, **kwargs)

Parameters:

data –
options – Optional. Specific Python options available for this component
profile – Optional. A flag to set the component performance storage
component_id – Optional. A DOM component reference in the page
dataflows – Chain of data transformations

property options: OptionGrid: Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript available for a DOM element by default.

set_size(n: int, break_point: str = 'lg')

Set the column size.

Usage:

ps = page.ui.layouts.grid()
ps += [page.ui.text("test %s" % i) for i in range(5)]
ps[0][0].set_size(10)

Parameters:

n – The size of the component in the bootstrap row.
break_point – Optional. Grid system category, with - xs (for phones - screens less than 768px wide) - sm (for tablets - screens equal to or greater than 768px wide) - md (for small laptops - screens equal to or greater than 992px wide) - lg (for laptops and desktops - screens equal to or greater than 1200px wide)

class epyk.core.html.HtmlContainer.Div(page: PageModel, components: List[Html], label: Optional[str], color: Optional[str], width: Optional[Union[tuple, int, str]], icon: Optional[str], height: Optional[Union[tuple, int, str]], editable: bool, align: str, padding: Optional[str], html_code: Optional[str], tag: str, helper: Optional[str], options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

build(data: Optional[Union[str, JsDataModel, float, dict, list, bool]] = None, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None, component_id: Optional[str] = None, dataflows: Optional[List[dict]] = None, **kwargs)

Build / Update the component. This is a function triggered on the JavaScript side.

Parameters:

data – Optional. A String corresponding to a JavaScript object
options – Optional. Specific Python options available for this component
profile – Optional. A flag to set the component performance storage
component_id – Optional. A DOM component reference in the page
dataflows – Chain of data transformations

property dom: JsHtmlRich

Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript by default.

Returns:: A Javascript Dom object

extend(components: List[Html])

Add multiple HTML components to the container.

Parameters:: components – The list of components.

focus(js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, profile: Optional[Union[bool, dict]] = None, options: Optional[dict] = None, source_event: Optional[str] = None, on_ready: bool = False)

Action on focus.

Parameters:

js_funcs – Optional. Javascript functions
profile – Optional. A flag to set the component performance storage
options – Optional. Specific Python options available for this component
source_event – Optional. The JavaScript DOM source for the event (can be a sug item)
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

goto(url: str, js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, profile: Optional[Union[bool, dict]] = None, target: str = '_blank', source_event: Optional[str] = None)

Click event which redirect to another page.

Related Pages:

https://www.w3schools.com/tags/att_a_target.asp

Parameters:

url – the url
js_funcs – Optional. The Javascript Events triggered before the redirection
profile – Optional. A flag to set the component performance storage
target – Optional. The target attribute specifies where to open the linked document
source_event – Optional. The event source

insert(n: int, component: Html)

Insert a component to a div.

Parameters:

n – The expected position of the component in the list
component – The component to be added to the underlying list

property options: OptionsDiv: Property to set all the possible object for a button.

property style: ClassDiv: Property to the CSS Style of the component.

class epyk.core.html.HtmlContainer.Form(page: PageModel, components: List[Html], helper: Optional[str])

extend(components: List[Html])

Add multiple HTML components to the container.

Parameters:: components – The list of components

submit(method: Optional[str] = None, action: Optional[str] = None, text: Optional[str] = None)

Add a submit event to the form.

Parameters:

method – Optional. The method used to transfer data
action – Optional. The end point for submitting
text – Optional. The text on the submit button

class epyk.core.html.HtmlContainer.Grid(page: PageModel, rows: list, width: tuple, height: tuple, align: str, position: str, options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

property dom: JsHtmlGrid

Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript by default.

Returns:: A Javascript Dom object

property options: OptionGrid

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

class epyk.core.html.HtmlContainer.Header(page: PageModel, component: HtmlModel, width: tuple, height: tuple, html_code: str, helper: str, options: dict, profile: Union[dict, bool])

property options: OptionsDiv

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

class epyk.core.html.HtmlContainer.IFrame(report, url, width, height, helper, profile)

allowfullscreen(flag: bool = True)

Related Pages:

https://www.w3schools.com/tags/tag_iframe.ASP

Parameters:: flag – optional. The <iframe> can activate fullscreen mode by calling the requestFullscreen() method.

property dom: JsHtmlIFrame

Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript by default.

Returns:: A Javascript Dom object.

referrerpolicy(text: str)

Related Pages:

https://www.w3schools.com/tags/att_iframe_referrerpolicy.asp

Parameters:: text –

sandbox(text: str)

Related Pages:

https://www.w3schools.com/tags/att_iframe_sandbox.asp

Parameters:: text – Enables an extra set of restrictions for the content in an <iframe>.

scrolling(flag: bool = True)

Related Pages:

https://www.w3schools.com/tags/tag_iframe.ASP

Parameters:: flag – Optional.

class epyk.core.html.HtmlContainer.IconsMenu(icon_names: list, page: PageModel, width, height, html_code, helper, profile)

add_icon(text: str, css: Optional[dict] = None, position: str = 'after', family: Optional[str] = None, html_code: Optional[str] = None)

Add an icon to the HTML object.

Usage:

checks.title.add_icon("fas fa-align-center")

Parameters:

text – The icon reference from font-awesome website
css – Optional. A dictionary with the CSS style to be added to the component
position – Optional. The position compared to the main component tag
family – Optional. The icon framework to be used (preferred one is font-awesome)
html_code – Optional. An identifier for this component (on both Python and Javascript side)

add_select(action: str, data, width: int = 150)

Parameters:

action –
data –
width (int) –

class epyk.core.html.HtmlContainer.Indices(page: PageModel, count: int, width: tuple, height: tuple, html_code: str, options: dict, profile: Optional[Union[bool, dict]])

click_item(i: int, js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)

Parameters:

i –
js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage

property options: OptionsPanelPoints

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

class epyk.core.html.HtmlContainer.Modal(page: PageModel, components: List[Html], header, footer, submit, helper)

close_on_background(): Will allow an event to close the modal if a click event is detected anywhere outside the modal.

property style: ClassModal: Property to the CSS Style of the component.

class epyk.core.html.HtmlContainer.Panel(page: PageModel, components: Union[List[Html], Html], title: Optional[str], color: Optional[str], width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], html_code: Optional[str], helper: Optional[str], options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

add_menu(close: bool = True, mini: bool = True, info: Optional[bool] = None, pin: Optional[bool] = False)

Add specific and predefined options to the panels.

Parameters:

close – Optional. Add a close button to the panel.
mini – Optional. Add a minimize button to the panel.
info – Optional. Add a info button to the panel.
pin – Optional. Add a pin button to the panel.

property dom: JsHtmlPanel

Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript by default.

Returns:: A Javascript Dom object

extend(components: List[Html])

Add multiple HTML components to the container.

Parameters:: components – The list of components.

property style: ClassDiv: Property to the CSS Style of the component.

class epyk.core.html.HtmlContainer.PanelSlide(page: PageModel, components: Optional[List[Html]], title: Union[Html, str], color: Optional[str], width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], html_code: Optional[str], helper, options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

click(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

Event added to the title bar. This will be triggered first.

Parameters:

js_funcs – The Javascript functions
profile – Optional. A flag to set the component performance storage
source_event – Optional. The JavaScript DOM source for the event (can be a sug item)
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property dom: JsHtmlSlidingPanel

Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript by default.

Returns:: A Javascript Dom object

open(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, on_ready: str = False)

Event triggered when the sliding panel is open.

Parameters:

js_funcs – The Javascript functions
profile – Optional. A flag to set the component performance storage
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property options: OptionPanelSliding

Property to the comments component options. Optional can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

class epyk.core.html.HtmlContainer.PanelSplit(page: PageModel, width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], left_width: Optional[Union[tuple, int, str]], left_obj, right_obj, resizable: bool, helper, options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

left(component: Html)

Add the left component to the panel.

Usage:

split_panel = page.ui.panels.split()
split_panel.left(page.ui.col([page.ui.text("Left")]))

Parameters:: component – An HTML component.

right(component: Html)

Add the right component to the panel.

Usage:

split_panel = page.ui.panels.split()
split_panel.right(page.ui.col([page.ui.text("Right")]))

Parameters:: component – An HTML component.

class epyk.core.html.HtmlContainer.Points(page: PageModel, count: int, width: tuple, height: tuple, html_code: str, options: dict, profile: Union[dict, bool])

click_item(i: int, js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, on_ready: bool = False)

Add a click event on a particular item of the component.

Parameters:

i – The item index
js_funcs – The Javascript functions
profile – Optional. A flag to set the component performance storage
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

on(event: str, js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

Add Javascript events to all the items in the component.

Related Pages:

https://www.w3schools.com/jsref/obj_events.asp

Parameters:

event (str) – The event type for an HTML object.
js_funcs – The Javascript functions.
profile – Optional. A flag to set the component performance storage.
source_event – Optional. The JavaScript DOM source for the event (can be a sug item).
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded.

on_item(i: int, event: Union[list, str], js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = False, source_event: Optional[str] = None, on_ready: bool = False)

Add specific event on the container items.

Parameters:

i – The item index in the container
event – The Javascript event type from the dom_obj_event.asp
js_funcs – A Javascript Python function
profile – Optional. Set to true to get the profile for the function on the Javascript console
source_event – Optional. The source target for the event
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property options: OptionsPanelPoints

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

class epyk.core.html.HtmlContainer.Row(page, components, position: str, width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], align: str, helper: str, options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

add(components: Union[Html, List[Html]]): Add items to a container

property dom: JsHtmlRow

Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript by default.

Returns:: A Javascript Dom object

property options: OptionGrid

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

set_size_cols(*args, break_point: str = 'lg')

Set the dimension of the columns in the row container. The sum of the various columns should not exceed 12, the max layout in Bootstrap.

Parameters:

args – Integer the size of the different columns.
break_point – Optional. Grid system category, with - xs (for phones - screens less than 768px wide) - sm (for tablets - screens equal to or greater than 768px wide) - md (for small laptops - screens equal to or greater than 992px wide) - lg (for laptops and desktops - screens equal to or greater than 1200px wide)

set_width_cols(*args)

Force the width of the different columns in the tow component.

Parameters:: args – The width object (value, unit).

class epyk.core.html.HtmlContainer.Section(page: PageModel, component: Union[Html, List[Html]], width: tuple, height: tuple, html_code: str, helper: str, options: dict, profile: Union[dict, bool])

property options: OptionsDiv

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

class epyk.core.html.HtmlContainer.TSection(page: PageModel, type: str, rows: Optional[list] = None, options: Optional[Union[bool, dict]] = None, profile: Optional[Union[bool, dict]] = None)

property options: OptionPanelTable

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

class epyk.core.html.HtmlContainer.Table(page: PageModel, rows, width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], helper: Optional[str], options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

add_caption(text: str, color: Optional[str] = None, align: Optional[str] = None, width: tuple = (100, '%'), height: tuple = (100, '%'), html_code: Optional[str] = None, tooltip: Optional[str] = None, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

The <caption> tag defines a table caption.

Related Pages:

https://www.w3schools.com/tags/tag_caption.asp

Parameters:

text – Optional. The value to be displayed to the component
color – Optional. The font color in the component. Default inherit
align – Optional. The text-align property within this component
width – Optional. A tuple with the integer for the component width and its unit
height – Optional. A tuple with the integer for the component height and its unit
html_code – Optional. An identifier for this component (on both Python and Javascript side)
tooltip – Optional. A string with the value of the tooltip
options – Optional. Specific Python options available for this component
profile – Optional. A flag to set the component performance storage

col(i: int)

Parameters:: i – The column index.

from_array(data: list, dim: int)

Load data from a 2D array.

Parameters:

data – The list of data
dim – The number of columns in the table

get_footer(i: int = 0)

Get a specific items from the table footer.

Parameters:: i – Optional. The table footer component position

get_header(i: int = 0)

Get a component from the header based on its position.

Parameters:: i – Optional. The component index in the header

line(text: str = ' ', align: str = 'left', dim: Optional[int] = None)

Parameters:

text – Optional. The value to be displayed to the component
align – Optional. The text-align property within this component
dim – Optional. The number of columns in the table

property options: OptionPanelTable

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

class epyk.core.html.HtmlContainer.Tabs(page: PageModel, color: str, width: tuple, height: tuple, html_code: Optional[str], helper: Optional[str], options: Optional[dict], profile: Optional[Union[bool, dict]])

add_panel(name: str, div: Html, icon: Optional[str] = None, selected: bool = False, css_tab: Optional[dict] = None, css_tab_clicked: Optional[dict] = None, width: Optional[tuple] = None, tooltip: Optional[str] = None)

Add a panel / tab to a tabs container.

Parameters:

name – The panel name.
div – HTML Component.
icon – Optional.
selected – Optional. Flag to set the selected panel
css_tab – Optional. The CSS attributes to be added to the HTML component
css_tab_clicked – Optional. The CSS attributes to be added to the HTML component
width – Optional. A tuple with the integer for the component width and its unit
tooltip – Optional. Add a tooltip to the tab

property dom: JsHtmlTabs

Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript by default.

Returns:: A Javascript Dom object.

property options: OptionPanelTabs

Property to the component options. Options can either impact the Python side or the Javascript builder.

Python can pass some options to the JavaScript layer.

panel(name: str)

Get the panel object.

Parameters:: name – The tab name.

select(name: str)

Set a value to be selected when the component is created.

Parameters:: name – The selected value.

tab(name: str) → Div

Get the tab container.

Parameters:: name – The tab name.

tab_holder(name: str) → Div

Get the tab container.

Parameters:: name – The tab name.

tabs(): Get the tab container.

class epyk.core.html.HtmlContainer.TabsArrowsDown(page: PageModel, color: str, width: tuple, height: tuple, html_code: Optional[str], helper: Optional[str], options: Optional[dict], profile: Optional[Union[bool, dict]])

add_panel(name: str, div, icon=None, selected=False, css_tab=None, css_tab_clicked=None, width=None)

Add a panel / tab to a tabs container.

Parameters:

name – The panel name.
div – HTML Component.
icon – Optional.
selected – Optional. Flag to set the selected panel
css_tab – Optional. The CSS attributes to be added to the HTML component
css_tab_clicked – Optional. The CSS attributes to be added to the HTML component
width – Optional. A tuple with the integer for the component width and its unit
tooltip – Optional. Add a tooltip to the tab

class epyk.core.html.HtmlContainer.TabsArrowsUp(page: PageModel, color: str, width: tuple, height: tuple, html_code: Optional[str], helper: Optional[str], options: Optional[dict], profile: Optional[Union[bool, dict]])

add_panel(name, div, icon=None, selected=False, css_tab=None, css_tab_clicked=None, width=None)

Add a panel / tab to a tabs container.

Parameters:

name – The panel name.
div – HTML Component.
icon – Optional.
selected – Optional. Flag to set the selected panel
css_tab – Optional. The CSS attributes to be added to the HTML component
css_tab_clicked – Optional. The CSS attributes to be added to the HTML component
width – Optional. A tuple with the integer for the component width and its unit
tooltip – Optional. Add a tooltip to the tab

class epyk.core.html.HtmlContainer.Td(page: PageModel, components: Optional[List[Union[Html, str]]], header: bool, position: Optional[str], width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], align: Optional[str], options: Optional[Union[bool, dict]], profile: Optional[Union[bool, dict]])

colspan(i: int)

The colspan attribute defines the number of columns a cell should span.

Related Pages:

https://www.w3schools.com/tags/att_td_colspan.asp

Parameters:: i – The column span value for the cell object

rowspan(i: int)

The rowspan attribute specifies the number of rows a cell should span.

Related Pages:

https://www.w3schools.com/tags/att_td_rowspan.asp

Parameters:: i – The row span value for the cell

class epyk.core.html.HtmlContainer.Tr(page: PageModel, components: Optional[List[Html]], header, position, width: Optional[Union[tuple, int, str]], height: Optional[Union[tuple, int, str]], align: Optional[str], options: Optional[Union[bool, dict]], profile)

property dom: JsHtmlTr

Return all the Javascript functions defined for an HTML Component. Those functions will use plain javascript by default.

Returns:: A Javascript Dom object