OptSliders Module
- class epyk.core.html.options.OptSliders.OptionBar(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- property draggable
Set the bar draggable using Jquery UI
- class epyk.core.html.options.OptSliders.OptionDialog(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- property appendTo
Which element the dialog (and overlay, if modal) should be appended to
Related Pages:
- property autoOpen
If set to true, the dialog will automatically open upon initialization. If false, the dialog will stay hidden until the open() method is called.
Related Pages:
- property classes
Specify additional classes to add to the widget’s elements. Any of classes specified in the Theming section can be used as keys to override their value. To learn more about this option, check out the learn article about the
Related Pages:
- property closeOnEscape
Specifies whether the dialog should close when it has focus and the user presses the escape (ESC) key.
Related Pages:
- property closeText
Specifies the text for the close button. Note that the close text is visibly hidden when using a standard theme.
Related Pages:
- property draggable
If set to true, the dialog will be draggable by the title bar. Requires the jQuery UI Draggable widget to be included.
Related Pages:
- property empty
Empty the dialog content first.
This is the default behaviour in case of content as text.
- property height
The height of the dialog.
Related Pages:
- property hide
If and how to animate the hiding of the dialog.
Related Pages:
- property maxHeight
The maximum height to which the dialog can be resized, in pixels.
Related Pages:
- property maxWidth
The maximum width to which the dialog can be resized, in pixels.
Related Pages:
- property minHeight
The minimum height to which the dialog can be resized, in pixels.
Related Pages:
- property minWidth
The minimum width to which the dialog can be resized, in pixels.
Related Pages:
- property modal
If set to true, the dialog will have modal behavior; other items on the page will be disabled, i.e., cannot be interacted with. Modal dialogs create an overlay below the dialog but above other page elements.
Related Pages:
- position(my: str = 'center', at: str = 'center', of: str = 'window')
Specifies where the dialog should be displayed when opened. The dialog will handle collisions such that as much of the dialog is visible as possible.
Related Pages:
- Parameters:
my –
at –
of –
- property resizable
If set to true, the dialog will be resizable. Requires the jQuery UI Resizable widget to be included.
Related Pages:
- property title
Specifies the title of the dialog. If the value is null, the title attribute on the dialog source element will be used.
Related Pages:
- property width
The width of the dialog, in pixels.
Related Pages:
- class epyk.core.html.options.Options(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- property builder
Add a JavaScript Builder function to the options.
This will be used to automatically map the Python component to its corresponding JavaScript builder function used by the build method.
Usage:
but = page.ui.button() but.options.builder = "Button"
- Prop value:
The JavaScript builder function name.
- property config_default
The default value for the configuration in case of template.
Default value is an empty string.
Usage:
component.options.config_default = {"value": "test"}
- config_html()
Return the HTML options used by the python and passed to the HTML.
Those options will not be available in the JavaScript layer and they are only defined either to build the HTML from Python or to set some HTML properties.
The returned dictionary is a copy so it can be changed or used in other processes. To change the internal component property, the options property should be used.
- config_js(attrs: Optional[dict] = None)
Return the JavaScript options used by the builders functions.
Builder functions can be defined in the framework or external from the various packages.
The returned dictionary is a copy so it can be changed or used in other processes. To change the internal component property, the options property should be used.
- Parameters:
attrs – Optional. The extra or overridden options
- custom_config(name: str, value: Any, js_type: bool = False)
Add a custom JavaScript configuration.
Usage:
chart = page.ui.charts.apex.scatter() chart.options.chart.zoom.custom_config("test", False)
- Parameters:
name – The key to be added to the attributes
value – String or JString. The value of the defined attributes
js_type – Optional. Specify if the parameter is a JavaScript fragment
- details()
Retrieve the defined properties details.
This function will return a dictionary with all the component attributes (required and optional) ones. It will provide the full available description of those components.
Usage:
but = page.ui.button() pprint.pprint(but.options.details(), indent=4)
- from_json(vals: dict, schema: Optional[dict] = None)
Load the option schema for a component from a json string.
TODO: add more feature to handle functions and enumeration
- Parameters:
vals – The input schema
schema – The full object schema
- has_attribute(cls_obj, name: Optional[str] = None)
Add an extra sub layer to the data structure.
The key in the object representation will be the function name.
- Parameters:
cls_obj – Class. The sub data class used in the structure definition
name – The sub attribute name
- isJsContent(property_name: str)
Check if the content of a property is defined to always be a JavaScript fragment.
Thus the framework will not convert it to a Json content.
Usage:
div = page.ui.div() print(div.options.isJsContent("inline"))
- Parameters:
property_name – The property name
- property managed
Boolean flag to set if the component needs to be added to the page.
If set to False the component has to be managed manually in the page.
Usage:
but = page.ui.button() but.options.managed = False
- Prop bool:
Flag to specify if this component is automatically managed by the page
- optional()
Return all options not added to the HTML component by default.
Those are options which will impact either the Python or the JavaScript builders.
To get the full definition of options the details method should be used.
Usage:
but = page.ui.button() pprint.pprint(but.options.optional(), indent=4)
- property profile
Boolean flag to set if extra logs need to be displayed.
This could help in debugging, default is the page verbose flag (default is false).
Usage:
but = page.ui.button() but.options.verbose = True
- Prop flag:
Flag to display / hide warning logs generated by the framework.
- required()
Return all the mandatory / required options with the default values.
Those options are added by the framework to provide a default for the HTML components but they can be changed.
System options are also added to this category as they are always available in any HTML components.
To get the full definition of options the details method should be used.
Usage:
but = page.ui.button() pprint.pprint(but.options.required(), indent=4)
- set_attrs(vals: dict)
Set the object internal attributes.
- Parameters:
vals – All the attributes to be added to the component
- property style
Change some CSS attributes to the internal HTML component.
Related Pages:
- Prop values:
The CSS attributes.
- update_config(attrs: dict)
Update the option configuration.
- Parameters:
attrs – The attributes to set
- property verbose
Boolean flag to set if extra logs need to be displayed.
This could help in debugging, default is the page verbose flag (default is false).
Usage:
but = page.ui.button() but.options.verbose = True
- Prop flag:
Boolean. Flag to display / hide warning logs generated by the framework.
- class epyk.core.html.options.OptSliders.OptionsMenu(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- property classes
Specify additional classes to add to the widget’s elements. Any of classes specified in the Theming section can be used as keys to override their value. To learn more about this option, check out the learn article about the
Related Pages:
- property disabled
Disables the menu if set to true
Related Pages:
- property icons
Icons to use for submenus, matching an icon provided by the jQuery UI CSS Framework.
Related Pages:
- property position
Identifies the position of submenus in relation to the associated parent menu item. The of option defaults to the parent menu item, but you can specify another element to position against. You can refer to the jQuery UI Position utility for more details about the various options.
Related Pages:
- class epyk.core.html.options.OptSliders.OptionsProgBar(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- property background
- property border_color
- property classes
Initialize the progressbar with the classes option specified, changing the theming for the ui-progressbar
Related Pages:
- css(attrs: dict)
- Parameters:
attrs – The CSS attributes
- property digits
Get the number of digit for the value.
Related Pages:
- property disabled
Disables the progressbar if set to true.
Related Pages:
- property max
The maximum value of the progressbar.
Related Pages:
- property min
The min value of the progressbar.
Related Pages:
- property rounded
Change the border radius style of the component.
- property value
The value of the progressbar.
Related Pages:
- class epyk.core.html.options.OptSliders.OptionsSkillbars(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- css(values: dict)
Set CSS for bars
- property danger
- property digits
Number of digit for the percentage value..
- property height
Set height for the bars default 20px
- property label
Key used in the record to get the label
- property percentage
Flag to display the percentage value on the bars.
- property success
- property value
Key used in the record to get the value
- property warning
- property width
- class epyk.core.html.options.OptSliders.OptionsSlider(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- property animate
Whether to slide the handle smoothly when the user clicks on the slider track. Also accepts any valid animation.
Related Pages:
- change(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)
- Parameters:
js_funcs –
profile –
- property classes
Specify additional classes to add to the widget’s elements. Any of classes specified in the Theming section can be used as keys to override their value. To learn more about this option, check out the learn article about the classes option.
Related Pages:
- create(js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, profile: Optional[Union[bool, dict]] = None)
Triggered when the slider is created.
Related Pages:
- Parameters:
js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage
- property css
Whether to slide the handle smoothly when the user clicks on the slider track. Also accepts any valid animation.
Related Pages:
- property disabled
Disables the slider if set to true.
Related Pages:
- property force_show_current
- property handler_css
Whether to slide the handle smoothly when the user clicks on the slider track. Also accepts any valid animation.
Related Pages:
- property max
The maximum value of the slider.
Related Pages:
- property min
The minimum value of the slider.
Related Pages:
- Prop value:
The min value
- property orientation
Determines whether the slider handles move horizontally (min on left, max on right) or vertically (min on bottom, max on top). Possible values: “horizontal”, “vertical”.
Related Pages:
- property range
Whether the slider represents a range.
Related Pages:
- property show_min_max
- slide(js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, profile: Optional[Union[bool, dict]] = None, readout: bool = True, readout_level: str = 'handle', readout_format: Optional[bool] = True, options: Optional[Union[bool, dict]] = None, css: Optional[dict] = None, precision: int = 0, delay_ms: int = 0)
Triggered on every mouse move during slide. The value provided in the event as ui.value represents the value that the handle will have as a result of the current movement.
Related Pages:
Usage:
slider = page.ui.slider(5) slider.options.step = 0.01 slider.options.slide(precision=2)
- Parameters:
js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage
readout – Optional. Show the value in a popup
readout_level – Optional
readout_format – Optional
options – Optional. The slide effect options
delay_ms – Optional. The delay before the change in milliseconds
css – Optional. The label CSS attributes
precision – Optional. Number of digits in the slider increments
- property step
Determines the size or amount of each interval or step the slider takes between the min and max. The full specified value range of the slider (max - min) should be evenly divisible by the step.
Usage:
slider = page.ui.slider(5) slider.options.step = 0.01
Related Pages:
- property value
Determines the value of the slider, if there’s only one handle. If there is more than one handle, determines the value of the first handle.
Related Pages:
- property values
This option can be used to specify multiple handles. If the range option is set to true, the length of values should be 2.
Related Pages: