OptCodeMirror Module
- class epyk.core.html.options.OptCodeMirror.OptionExtraKeys(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- alt_f(value)
- Parameters:
value – String. The event code reference.
- ctrl_q(js_funcs, profile=None)
- Parameters:
js_funcs – List | String. Javascript functions.
profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.
- esc(js_funcs, profile=None)
- Parameters:
js_funcs – List | String. Javascript functions.
profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.
- f_11(js_funcs, profile=None)
- Parameters:
js_funcs – List | String. Javascript functions.
profile – Boolean | Dictionary. Optional. A flag to set the component performance storage.
- class epyk.core.html.options.OptCodeMirror.OptionPanels(component: HtmlModel, page: Optional[PageModel] = None)
- add(content, html_code, position='top')
Add a panel to the codemirror component.
Related Pages:
- Parameters:
content – String. The panel content.
html_code – String. An identifier for this component (on both Python and Javascript side).
position – String. Optional. The position of the panel on the component.
- remove(html_code)
Remove a panel visible on the codemirror component.
Related Pages:
- Parameters:
html_code – String. An identifier for this component (on both Python and Javascript side).
- 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.OptCodeMirror.OptionsCode(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- property addons: OptionCMAddons
The addon directory in the distribution contains a number of reusable components that implement extra editor functionality.
Related Pages:
- property autofocus
Can be used to make CodeMirror focus itself on initialization. Defaults to off. When fromTextArea is used, and no explicit value is given for this option, it will be set to true when either the source textarea is focused, or it has an autofocus attribute and no other element is focused.
Related Pages:
- property coverGutterNextToScrollbar
When fixedGutter is on, and there is a horizontal scrollbar, by default the gutter will be visible to the left of this scrollbar. If this option is set to true, it will be covered by an element with class CodeMirror-gutter-filler.
Related Pages:
- property cursorBlinkRate
Half-period in milliseconds used for cursor blinking. The default blink rate is 530ms. By setting this to zero, blinking can be disabled. A negative value hides the cursor entirely.
Related Pages:
- property cursorHeight
Determines the height of the cursor. Default is 1, meaning it spans the whole height of the line. For some fonts (and by some tastes) a smaller height (for example 0.85), which causes the cursor to not reach all the way to the bottom of the line, looks better
Related Pages:
- property cursorScrollMargin
How much extra space to always keep above and below the cursor when approaching the top or bottom of the visible view in a scrollable document. Default is 0.
Related Pages:
- property direction
Flips overall layout and selects base paragraph direction to be left-to-right or right-to-left. Default is “ltr”. CodeMirror applies the Unicode Bidirectional Algorithm to each line, but does not autodetect base direction — it’s set to the editor direction for all lines.
Related Pages:
- property dragDrop
Controls whether drag-and-drop is enabled. On by default.
Related Pages:
- property electricChars
Configures whether the editor should re-indent the current line when a character is typed that might change its proper indentation (only works if the mode supports indentation). Default is true.
Related Pages:
- property firstLineNumber
At which number to start counting lines. Default is 1.
Related Pages:
- property fixedGutter
Determines whether the gutter scrolls along with the content horizontally (false) or whether it stays fixed during horizontal scrolling (true, the default).
Related Pages:
- property foldGutter
Whether to use the context-sensitive indentation that the mode provides (or just indent the same as the line before). Defaults to true.
Related Pages:
- property gutters
Can be used to add extra gutters (beyond or instead of the line number gutter). Should be an array of CSS class names or class name / CSS string pairs, each of which defines a width (and optionally a background), and which will be used to draw the background of the gutters. May include the CodeMirror-linenumbers class, in order to explicitly set the position of the line number gutter (it will default to be to the right of all other gutters). These class names are the keys passed to setGutterMarker.
Related Pages:
- property hintOptions: OptionsHints
//codemirror.net/demo/complete.html
- Return type:
- Type:
https
- property historyEventDelay
The period of inactivity (in milliseconds) that will cause a new history event to be started when typing or deleting. Defaults to 1250.
Related Pages:
- property indentUnit
How many spaces a block (whatever that means in the edited language) should be indented. The default is 2.
Related Pages:
- property indentWithTabs
Whether, when indenting, the first N*tabSize spaces should be replaced by N tabs. Default is false.
Related Pages:
- property inputStyle
Selects the way CodeMirror handles input and focus. he core library defines the “textarea” and “contenteditable” input models. On mobile browsers, the default is “contenteditable”. On desktop browsers, the default is “textarea”.
Related Pages:
- property keyMap
Configures the key map to use. The default is “default”, which is the only key map defined in codemirror.js itself. Extra key maps are found in the key map directory. See the section on key maps for more information.
Related Pages:
- property lineNumbers
Whether to show line numbers to the left of the editor.
Related Pages:
- property lineSeparator
Explicitly set the line separator for the editor. By default (value null), the document will be split on CRLFs as well as lone CRs and LFs, and a single LF will be used as line separator in all output (such as getValue). When a specific string is given, lines will only be split on that string, and output will, by default, use that same separator.
Related Pages:
- property lineWiseCopyCut
When enabled, which is the default, doing copy or cut when there is no selection will copy or cut the whole lines that have cursors on them.
Related Pages:
- property lineWrapping
Whether CodeMirror should scroll or wrap for long lines. Defaults to false (scroll).
Related Pages:
- property matchBrackets
Defines an option matchBrackets which, when set to true or an options object, causes matching brackets to be highlighted whenever the cursor is next to them. It also adds a method matchBrackets that forces this to happen once, and a method findMatchingBracket that can be used to run the bracket-finding algorithm that this uses internally. It takes a start position and an optional config object. By default, it will find the match to a matchable character either before or after the cursor (preferring the one before), but you can control its behavior with these options:
Add extra addon: addon/selection/active-line.js
Related Pages:
- property mode
The mode to use. When not given, this will default to the first mode that was loaded. It may be a string, which either simply names the mode or is a MIME type associated with the mode.
add extra addon: /mode/javascript/javascript.js
Related Pages:
- property pasteLinesPerSelection
When pasting something from an external source (not from the editor itself), if the number of lines matches the number of selection, CodeMirror will by default insert one line per selection. You can set this to false to disable that behavior.
Related Pages:
- property readOnly
This disables editing of the editor content by the user. If the special value “nocursor” is given (instead of simply true), focusing of the editor is also disallowed.
Related Pages:
- property rtlMoveVisually
Determines whether horizontal cursor movement through right-to-left (Arabic, Hebrew) text is visual (pressing the left arrow moves the cursor left) or logical (pressing the left arrow moves to the next lower index in the string, which is visually right in right-to-left text). The default is false on Windows, and true on other platforms.
Related Pages:
- property screenReaderLabel
This label is read by the screenreaders when CodeMirror text area is focused. This is helpful for accessibility.
Related Pages:
- property scrollbarStyle
Chooses a scrollbar implementation. The default is “native”, showing native scrollbars. The core library also provides the “null” style, which completely hides the scrollbars. Addons can implement additional scrollbar models.
Related Pages:
- property selectionsMayTouch
Determines whether multiple selections are joined as soon as they touch (the default) or only when they overlap (true).
Related Pages:
- property showCursorWhenSelecting
Whether the cursor should be drawn when a selection is active. Defaults to false.
Related Pages:
- property smartIndent
Whether to use the context-sensitive indentation that the mode provides (or just indent the same as the line before). Defaults to true.
Related Pages:
- property styleActiveLine
Defines a styleActiveLine option that, when enabled, gives the wrapper of the line that contains the cursor the class CodeMirror-activeline, adds a background with the class CodeMirror-activeline-background, and adds the class CodeMirror-activeline-gutter to the line’s gutter space is enabled.
Add extra addon: addon/edit/matchbrackets.js
Related Pages:
- property tabSize
The width of a tab character. Defaults to 4.
Related Pages:
- property tabindex
The tab index to assign to the editor. If not given, no tab index will be assigned.
Related Pages:
- property theme
The theme to style the editor with. You must make sure the CSS file defining the corresponding .cm-s-[name] styles is loaded (see the theme directory in the distribution). The default is “default”, for which colors are included in codemirror.css. It is possible to use multiple theming classes at once—for example “foo bar” will assign both the cm-s-foo and the cm-s-bar classes to the editor.
Related Pages:
- property value
The starting value of the editor. Can be a string, or a document object.
Related Pages:
- class epyk.core.html.options.OptCodeMirror.OptionsHints(component: HtmlModel, attrs: Optional[dict] = None, options: Optional[dict] = None, js_tree: Optional[dict] = None, page: Optional[PageModel] = None)
- autocomplete()
- hint(mappings, js_funcs=None, profile=None)
Related Pages:
- Parameters:
mappings – List of List.
js_funcs – List | String. Optional. Javascript functions.
- snipet()
Related Pages: