Navigation Interface

class epyk.interfaces.components.CompNavigation.Navigation(ui)

banner(image: str = '', text: str = '', link: str = '', width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (None, 'px'), options: Optional[dict] = None, profile: Union[dict, bool] = False)

Tags:

Categories:

Underlying HTML Objects:

• epyk.core.html.HtmlContainer.Div

• epyk.core.html.HtmlImage.Image

• epyk.core.html.HtmlContainer.Col

• epyk.core.html.HtmlContainer.Row

• epyk.core.html.HtmlText.Text

• epyk.core.html.HtmlLinks.ExternalLink

Parameters:

• image – Optional. The image full path

• text – Optional. The value to be displayed to the component

• link – Optional. The url link

• 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

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

bar(logo=None, title=None, width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (40, 'px'), options=None, html_code=None, avatar: Union[bool, str] = False, profile: Union[dict, bool] = False) → HtmlNavBar

Tags:

Categories:

Usage:

nav = page.ui.navigation.bar(title="test")
nav.add_text("Test text")
nav + page.ui.button("Click")

Underlying HTML Objects:

• epyk.core.html.HtmlMenu.HtmlNavBar

Parameters:

• logo –

• title – String. Optional. A panel title. This will be attached to the title property

• width – Tuple. Optional. A tuple with the integer for the component width and its unit

• height – Tuple. Optional. A tuple with the integer for the component height and its unit

• options – Optional. Specific Python options available for this component

• avatar – Optional.

• html_code – Optional. An identifier for this component (on both Python and Javascript side)

• profile – Optional. A flag to set the component performance storage

dots(count: int, selected: int = 1, position: str = 'right', width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (None, 'px'), html_code: Optional[str] = None, options: Optional[dict] = None, profile: Union[dict, bool] = False)

Tags:

Categories:

Usage:

d = page.ui.navigation.dots(10)

Parameters:

• count – Optional. The number of pages

• selected – Optional. The selected index

• position – Optional. A string with the vertical position of the 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)

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

down(icon: str = 'fas fa-arrow-down', top: int = 20, right: int = 20, bottom: Optional[int] = None, tooltip: Optional[str] = None, width: Union[tuple, int] = (25, 'px'), height: Union[tuple, int] = (25, 'px'), options: Optional[dict] = None, profile: Union[bool, dict] = False)

Navigation button to go to the bottom of the page directly.

Tags:

Categories:

Usage:

page.ui.navigation.down()

Parameters:

• icon – Optional. The component icon content from font-awesome references. Default fas fa-arrow-up

• top – Optional. The top property affects the vertical position of a positioned element

• right – Optional. The right property affects the horizontal position of a positioned element

• bottom – Optional. The top property affects the vertical position of a positioned element

• tooltip – Optional. A string with the value of the tooltip

• 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

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

footer(components=None, width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (80, 'px'), fixed=False, options=None, profile=False) → HtmlFooter

Will create a footer object in the body of the report.

Tags:

Categories:

Usage:

Underlying HTML Objects:

• epyk.core.html.HtmlMenu.HtmlFooter

Parameters:

• components – list of html components.

• width – Tuple. Optional. A tuple with the integer for the component width and its unit.

• height – Tuple. Optional. A tuple with the integer for the component height and its unit.

• fixed – Boolean. Optional. Fix the component at the page bottom.

• options – Dictionary. Optional. Specific Python options available for this component.

• profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.

indices(count: int, selected: int = 1, width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (None, 'px'), html_code: Optional[str] = None, options: Optional[dict] = None, profile: Union[bool, dict] = False)

Tags:

Categories:

Usage:

page.ui.navigation.indices(10)

Parameters:

• count – Optional. The number of pages

• selected – Optional. The selected index

• 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

• options – Optional. Specific Python options available for this component

• html_code – Optional. An identifier for this component (on both Python and Javascript side)

• profile – Optional. A flag to set the component performance storage

more(text: str = 'See more', icon: Optional[Union[str, bool]] = None, width: Union[tuple, int] = ('auto', ''), tooltip: Optional[str] = None, height: Union[tuple, int] = (None, 'px'), align: str = 'left', html_code: Optional[str] = None, profile: Optional[Union[bool, dict]] = None, options: Optional[dict] = None)

Add a see more button to get the number of calls for a pagination on the server side.

Usage:

t = page.ui.text("Rewind")
btn = page.ui.navigation.more()
btn.click([page.js.console.log(btn.dom.next())])
t.click([btn.dom.rewind()])

Parameters:

• text – Optional. The value to be displayed to the button

• icon – Optional. A string with the value of the icon to display from font-awesome

• tooltip – Optional. A string with the value of the tooltip

• 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

• align – Optional. A string with the horizontal position of the component

• html_code – Optional. An identifier for this component (on both Python and Javascript side)

• profile – Optional. A flag to set the component performance storage

• options – Optional. Specific Python options available for this component

nav(logo=None, title: Optional[str] = None, components=None, width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (40, 'px'), options: Optional[dict] = None, avatar: bool = False, profile: Union[dict, bool] = False) → HtmlNavBar

Tags:

Categories:

Usage:

page.ui.components_skin = {"nav": {"css": {"background-color": 'pink'}}}
nav = page.ui.navigation.nav(height=60, options={"center": True, "logo_height": 50})

Parameters:

• logo – Optional. The picture for the logo

• title – Optional. A panel title. This will be attached to the title property

• components – Optional. The Components to be added to the navbar

• 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

• options – Optional. Specific Python options available for this component

• avatar – Optional. Add a avatar picture to the right in the navbar

• profile – Optional. A flag to set the component performance storage

panel(width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (100, '%'), options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None, helper: Optional[str] = None) → PanelsBar

Tags:

Categories:

Usage:

Templates:

https://github.com/epykure/epyk-templates/blob/master/locals/components/bars.py

Parameters:

• 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

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

• helper – Optional. A tooltip helper

path(record: List[dict], divider: Optional[str] = None, width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (None, 'px'), options: Optional[dict] = None, profile: Union[dict, bool] = False)

Tags:

Categories:

Usage:

record = [{"text": "Lin 1", 'url': 'report_list.html'}, {"text": "Link 2"}]
page.ui.navigation.path(record)

Parameters:

• record – Component input data

• divider – Optional. A path delimiter

• 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

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

pilcrow(text: str = '', html_code: Optional[str] = None, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

Add an anchor on the page and move to this when it is clicked.

Tags:

Categories:

Usage:

:param text: Optional. The value to be displayed to the component
:param html_code: Optional. An identifier for this component (on both Python and Javascript side)
:param options: Optional. Specific Python options available for this component
:param profile: Optional. A flag to set the component performance storage

pin(text: str, url: str = '#', icon: str = 'fas fa-map-pin', top: int = 20, right: int = 20, bottom: Optional[int] = None, tooltip: Optional[str] = None, width: Union[tuple, int] = (25, 'px'), height: Union[tuple, int] = (25, 'px'), options: Optional[dict] = None, profile: Union[bool, dict] = False)

Shortcut to a specific position in the page.

Tags:

Categories:

Usage:

page.ui.navigation.pin("anchor", tooltip="test", bottom=20)

Parameters:

• text – The shortcut name

• url – Optional. The anchor name

• icon – Optional. The component icon content from font-awesome references. Default fas fa-arrow-up

• top – Optional. The top property affects the vertical position of a positioned element

• right – Optional. The right property affects the horizontal position of a positioned element

• bottom – Optional. The top property affects the vertical position of a positioned element

• tooltip – Optional. A string with the value of the tooltip

• 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

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

points(count: int, selected: int = 0, width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (None, 'px'), html_code: Optional[str] = None, options: Optional[dict] = None, profile: Union[dict, bool] = False) → Points

Tags:

Categories:

Usage:

p = page.ui.navigation.points(10)
for i, _ in enumerate(p):
  p.click_item(i, [])

Parameters:

• count – The number of pages

• selected – Optional. The selected index

• 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)

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

scroll(progress: int = 0, height: Union[tuple, int] = (3, 'px'), options: Optional[dict] = None, profile: Union[bool, dict] = False)

Add a horizontal progressbar to display the status of the page scrollbar.

Tags:

Categories:

Usage:

page.ui.navigation.scroll()

Parameters:

• progress – Optional. The progression on the page

• height – Optional. A tuple with the integer for the component height and its unit

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

shortcut(components=None, logo=None, size=(40, 'px'), options=None, profile=None, html_code=None) → Shortcut

Tags:

Categories:

Usage:

:param components: List. The different HTML objects to be added to the component.
:param logo:
:param size: Integer. Optional. Panel's height in pixel.
:param options: Dictionary. Optional. Specific Python options available for this component.
:param profile: Boolean | Dictionary. Optional. A flag to set the component performance storage.
:param html_code: String. Optional. An identifier for this component (on both Python and Javascript side).

side(components=None, anchor=None, size=262, position='right', options=None, profile=False, z_index: int = 20, overlay: bool = False)

Tags:

Categories:

Usage:

Templates:

https://github.com/epykure/epyk-templates/blob/master/locals/components/contextmenu.py https://github.com/epykure/epyk-templates/blob/master/locals/components/st_news.py

Parameters:

• components – The different HTML objects to be added to the component.

• anchor – Optional. The panel button to show / hide.

• size – Optional. Panel’s width in pixel.

• position – Optional. A string with the vertical position of the component.

• options – Optional. Specific Python options available for this component.

• profile – Optional. A flag to set the component performance storage.

• z_index – Optional.

• overlay – Optional.

to(y, x: Optional[int] = None, icon: str = 'fas fa-map-pin', top: int = 20, right: int = 20, bottom: Optional[int] = None, tooltip: Optional[str] = None, width: Union[tuple, int] = (25, 'px'), height: Union[tuple, int] = (25, 'px'), options: Optional[dict] = None, profile: Union[bool, dict] = False)

Navigation button to go to a specific point in the page directly.

Tags:

Categories:

Usage:

page.ui.navigation.to(100, tooltip="test")

Parameters:

• y – The y position on the page

• x – Optional. The x position on the page

• icon – Optional. The component icon content from font-awesome references. Default fas fa-arrow-up

• top – Optional. The top property affects the vertical position of a positioned element

• right – Optional. The right property affects the horizontal position of a positioned element

• bottom – Optional. The top property affects the vertical position of a positioned element

• tooltip – Optional. A string with the value of the tooltip

• 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

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage

up(icon: str = 'fas fa-arrow-up', top: int = 20, right: int = 20, bottom: Optional[int] = None, tooltip: Optional[str] = None, width: Union[tuple, int] = (25, 'px'), height: Union[tuple, int] = (25, 'px'), options: Optional[dict] = None, profile: Union[bool, dict] = False)

Navigation button to go to the top of the page directly.

Tags:

Categories:

Usage:

page.ui.navigation.up()

Parameters:

• icon – Optional. The component icon content from font-awesome references. Default fas fa-arrow-up

• top – Optional. The top property affects the vertical position of a positioned element

• right – Optional. The right property affects the horizontal position of a positioned element

• bottom – Optional. The top property affects the vertical position of a positioned element

• tooltip – Optional. A string with the value of the tooltip

• 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

• options – Optional. Specific Python options available for this component

• profile – Optional. A flag to set the component performance storage