Vignets Interface

class epyk.interfaces.components.CompVignets.Vignets(ui)

background(url: str, width: Union[tuple, int] = (90, '%'), height: Union[tuple, int] = (450, 'px'), size: str = 'contain', margin: int = 0, align: str = 'center', position: str = 'middle', options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

Tags:
Categories:

Usage:

:param url: String. The url string.
:param align: String. Optional. The text-align property within this component.
:param width: Tuple. Optional. A tuple with the integer for the component width and its unit.
:param height: Tuple. Optional. A tuple with the integer for the component height and its unit.
:param size: String. Optional.
:param margin: Integer. Optional.
:param position: String. Optional.
:param options: Dictionary. Optional. Specific Python options available for this component.
:param profile: Boolean | Dictionary. Optional. A flag to set the component performance storage.

block(records=None, color: Optional[str] = None, border: str = 'auto', width: Union[tuple, int] = (300, 'px'), height: Union[tuple, int] = (None, 'px'), helper: Optional[str] = None, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

Every HTML element has a default display value depending on what type of element it is. The two display values are: block and inline.

Tags:
Categories:

Usage:

page.ui.vignets.block({"text": 'This is a brand new python framework', "title": 'New Python Web Framework',
                       "button": {"text": 'Get Started', 'url': "/getStarted"}, 'color': 'green'})

Underlying HTML Objects:

epyk.core.html.HtmlTextComp.BlockText

Related Pages:

https://www.w3schools.com/htmL/html_blocks.asp

Parameters:

records – List. Optional. The list of dictionaries with the input data.
color – String. Optional. The font color in the component. Default inherit.
border –
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.
helper – String. Optional. The value to be displayed to the helper icon.
options – Dictionary. Optional. Specific Python options available for this component.
profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.

bubble(records=None, width: Union[tuple, int] = (70, 'px'), height: Union[tuple, int] = ('auto', ''), color: Optional[str] = None, background_color: Optional[str] = None, helper: Optional[str] = None, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

The bubbles event property returns a Boolean value that indicates whether or not an event is a bubbling event. Event bubbling directs an event to its intended target, it works like this: A button is clicked and the event is directed to the button If an event handler is set for that object, the event is triggered. If no event handler is set for that object, the event bubbles up (like a bubble in water) to the objects parent. The event bubbles up from parent to parent until it is handled, or until it reaches the document object.

Tags:
Categories:

Usage:

page.ui.vignets.bubble({"value": 23, "title": "Title"}, helper="This is a helper")

Underlying HTML Objects:

epyk.core.html.HtmlText.Text

epyk.core.html.HtmlContainer.Div

epyk.core.html.HtmlLinks.ExternalLink

Related Pages:

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

Parameters:

records – List. Optional. The list of dictionaries.
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.
color – String. Optional. The font color in the component. Default inherit.
background_color – String. Optional. The hexadecimal color code.
helper – String. Optional. The value to be displayed to the helper icon.
options – Dictionary. Optional. Specific Python options available for this component.
profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.

image(title: Optional[str] = None, content: str = '', image: Optional[str] = None, render: str = 'row', align: str = 'center', width: Union[tuple, int] = (90, '%'), height: Union[tuple, int] = (None, 'px'), options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

Tags:
Categories:

Usage:

:param title: String. Optional. A panel title. This will be attached to the title property.
:param content:
:param image:
:param render:
:param align: String. Optional. The text-align property within this component.
:param width: Tuple. Optional. A tuple with the integer for the component width and its unit.
:param height: Tuple. Optional. A tuple with the integer for the component height and its unit.
:param options: Dictionary. Optional. Specific Python options available for this component.
:param profile: Boolean | Dictionary. Optional. A flag to set the component performance storage.

number(number: float, label: str = '', title: Optional[str] = None, align: str = 'center', components=None, width: Union[tuple, int] = ('auto', ''), height: Union[tuple, int] = (None, 'px'), profile: Optional[Union[bool, dict]] = None, options: Optional[dict] = None, helper: Optional[str] = None)

The <input type=”number”> defines a field for entering a number. Use the following attributes to specify restrictions: max - specifies the maximum value allowed min - specifies the minimum value allowed step - specifies the legal number intervals value - Specifies the default value

Tags:
Categories:

Usage:

number = page.ui.vignets.number(500, "Test")
number_2 = page.ui.vignets.number(500, "Test 2 ", options={"url": "http://www.google.fr"})
number.span.add_icon(page.ui.icons.get.ICON_ENVELOPE)

Underlying HTML Objects:

epyk.core.html.HtmlTextComp.Number

Related Pages:

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

Parameters:

number – Integer. The value.
label – String. Optional. The label text.
title – String | Component. Optional. A panel title. This will be attached to the title property.
align – String. Optional. The text-align property within this component.
components – List. Optional. The 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.
profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.
options – Dictionary. Optional. Specific Python options available for this component.
helper – String. Optional. The value to be displayed to the helper icon.

price(value, title: str, items: Optional[List[Html]] = None, components: Optional[List[Html]] = None, url: Optional[str] = None, align: str = 'center', width: Union[tuple, int] = (250, 'px'), height: Union[tuple, int] = ('auto', ''), currency: str = '£', options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None, helper: Optional[str] = None)

Tags:
Categories:

Usage:

page.ui.vignets.price(10, "This is the price", [])

Parameters:

value –
title – String. Optional. A panel title. This will be attached to the title property.
items –
components –
url –
align – String. Optional. The text-align property within this component.
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.
currency – String. Optional. The currency value.
options – Dictionary. Optional. Specific Python options available for this component.
profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.
helper – String. Optional. The value to be displayed to the helper icon.

slides(start: int = 0, width: Union[tuple, int] = (100, '%'), height: Union[tuple, int] = (100, '%'), options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

Tags:
Categories:

Usage:

:param start:
:param width: Tuple. Optional. A tuple with the integer for the component width and its unit.
:param height: Tuple. Optional. A tuple with the integer for the component height and its unit.
:param options: Dictionary. Optional. Specific Python options available for this component.
:param profile: Boolean | Dictionary. Optional. A flag to set the component performance storage.

TODO: Fix layout issue with F11 (full screen)

text(records=None, width: Union[tuple, int] = (None, '%'), height: Union[tuple, int] = (None, 'px'), align: str = 'center', helper: Optional[str] = None, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

Tags:
Categories:

Usage:

page.ui.vignets.text({"title": "New Python Framework", 'value': "A new Python Web Framework", 'color': 'green',
                      'icon': 'fab fa-python', 'colorTitle': 'darkgreen'})

Underlying HTML Objects:

epyk.core.html.HtmlTextComp.TextWithBorder

Parameters:

records – List. Optional. The list of dictionaries with the input data.
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.
align – String. Optional. The text-align property within this component.
helper – String. Optional. The value to be displayed to the helper icon.
options – Dictionary. Optional. Specific Python options available for this component.
profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.

video(title: str, content: str = '', video: Optional[str] = None, render: str = 'row', align: str = 'center', width: Union[tuple, int] = (90, '%'), height: Union[tuple, int] = (None, 'px'), options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

Component to allow creation of a vignet embedding a video.

Tags:
Categories:

Usage:

Related Pages:

Issue:

https://github.com/epykure/epyk-ui/issues/92

param title:: String. Optional. A panel title. This will be attached to the title property.
param content:
param video:
param render:
param align:: String. The text-align property within this component.
param width:: Tuple. Optional. A tuple with the integer for the component width and its unit.
param height:: Tuple. Optional. A tuple with the integer for the component height and its unit.
param options:: Dictionary. Optional. Specific Python options available for this component.
param profile:: Boolean | Dictionary. Optional. A flag to set the component performance storage.

vignet(title: str, content: str, icon: Optional[str] = None, render: str = 'col', align: str = 'center', width: Union[tuple, int] = (200, 'px'), options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = None)

Tags:
Categories:

Usage:

:param title: String. Optional. A panel title. This will be attached to the title property.
:param content: String. Optional. The value to be displayed to the component.
:param icon: String. Optional. A string with the value of the icon to display from font-awesome.
:param render:
:param align: String. Optional. The text-align property within this component.
:param width: Tuple. Optional. A tuple with the integer for the component width and its unit.
:param options: Dictionary. Optional. Specific Python options available for this component.
:param profile: Boolean | Dictionary. Optional. A flag to set the component performance storage.