Javascript Built-Ins

Most of the JavaScript features are wrapped in Epyk in order to be able to use the auto completion to write JavaScript code. By design this framework is not dedicated to write thousand of lines of JavaScript. It has been implemented in order to help link components and modules with the Python object.

This module can be split into 4 main items:

  • JavaScript core features.

  • JavaScript Primitives.

  • JavaScript HTML wrappers.

  • JavaScript Packages wrappers.

Core Modules

class epyk.core.js.Js.JsBase(page: Optional[PageModel] = None, component: Optional[HtmlModel] = None)
property accounting

Shortcut to accounting properties.

Usages:

page.js.accounting.add_to_imports()

Related Pages:

activeElement()

The activeElement property returns the currently focused element in the document.

Related Pages:

Returns:

A reference to the element object in the document that has focus.

and_(*args) jsWrap

Create a Javascript and statement.

property body: JsDoms

Get the DOM object.

This will return the object. It will not create any variable.

property breadcrumb: JsBreadCrumb

Create an internal Breadcrumb to keep track of the user journey within your page.

Related Pages:

Returns:

A Python breadcrumb object.

clipboard(data: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None)

Copy the full URL to rhe clipboard.

Related Pages:

Parameters:
  • data – The Javascript expression

  • js_conv_func – Optional. A specific JavaScript data conversion function

createAttribute(attribute_name)

The createAttribute() method creates an attribute with the specified name, and returns the attribute as an Attr object.

Related Pages:

Parameters:

attribute_name – The name of the attribute you want to create.

Returns:

A Node object, representing the created attribute.

createElement(tag_name: str, js_code: Optional[str] = None, set_var: bool = True, dom_id: Optional[str] = None)

The createElement() method creates an Element Node with the specified name.

Related Pages:

Parameters:
  • tag_name – The name of the element you want to create

  • js_code – The variable name to be set. Default random name

  • set_var – Optional. Create a variable for the new object. Default True

  • dom_id – Optional. The Dom ID reference for the object

createEvent(event_type: str)

The createEvent() method creates an event object.

The event can be of any legal event type, and must be initialized before use.

Related Pages:

Parameters:

event_type – A String that specifies the type of the event.

Returns:

An Event object

static createTextNode(text: Optional[Union[JsDataModel, str]] = None, js_conv_func: Optional[Union[list, str]] = None) JsObject

The createTextNode() method creates a Text Node with the specified text.

Related Pages:

Parameters:
  • text – Optional. The text of the Text node

  • js_conv_func – Optional. A specific JavaScript data conversion function

Returns:

A Text Node object with the created Text Node.

custom(data: Union[str, JsDataModel], key: Optional[str] = None, is_py_data: bool = False, js_func: Optional[Union[list, str]] = None)

Allow the definition of bespoke javascript strings.

Parameters:
  • data – A String corresponding to a JavaScript object

  • key – Optional. A key reference in the JavaScript object

  • is_py_data – Optional. Specify if the data is in Python and should be jsonify first

  • js_func – Optional. Javascript functions

customFile(filename: str, path: Optional[str] = None, module_type: str = 'text/javascript', absolute_path: bool = False, requirements: Optional[list] = None, randomize: bool = False, authorize: bool = False)

This will load your local javascript file when the report will be built. Then you will be able to use the new features in the different Javascript wrappers.

Usage:

page.js.customFile("test.js", r"C:

older”)

param filename:

The filename

param path:

Optional. The file path

param module_type:

Optional. The module type

param absolute_path:

Optional. If path is None this flag will map to the current main path

param requirements:

Optional. The list of required packages

param randomize:

Optional. Add random suffix to the module to avoid browser caching

param authorize:

Optional. Add to the restricted list of packages

return:

The Js Object to allow the chaining.

customText(text: str)

Javascript fragment added at the beginning of the page. This will be called before any function in the framework.

Parameters:

text – The Javascript fragment

Returns:

self to allow the chaining.

property d3

D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS.

D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.

Related Pages:

property data: JsData

Get wrapped JavaScript data structures.

decodeURIComponent(url_enc: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None) JsObject

The decodeURIComponent() function decodes a URI component.

Related Pages:

Parameters:
  • url_enc – The URI to be decoded

  • js_conv_func – Optional. A specific JavaScript data conversion function

Returns:

A String, representing the decoded URI.

delay(js_funcs: Union[list, str], seconds: int = 0, window_id: str = 'window', profile: Optional[Union[bool, dict]] = False)

Add a wrapper on top of the setTimeout.

Usage:

page.js.delay([text.build("Change the value")], 5)
Parameters:
  • js_funcs – The function that will be executed

  • seconds – Optional. The number of seconds to wait before executing the code

  • window_id – Optional. The JavaScript window object

  • profile – Optional. Set to true to get the profile for the function on the Javascript console

delete(url: Union[str, JsDataModel], data: Optional[dict] = None, js_code: str = 'response', is_json: bool = True, components: Optional[List[Union[Tuple[HtmlModel, str], HtmlModel]]] = None, profile: Optional[Union[bool, dict]] = None, headers: Optional[dict] = None, asynchronous: bool = False, stringify: bool = True, dataflows: Optional[List[dict]] = None) XMLHttpRequest

Create a DELETE HTTP request.

Related Pages:

Parameters:
  • url – The url path of the HTTP request

  • data – Optional. Corresponding to a JavaScript object

  • js_code – Optional. The variable name created in the Javascript (default response)

  • is_json – Optional. Specify the type of object passed

  • components – Optional. This will add the component value to the request object

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

  • headers – Optional. The request headers

  • asynchronous – Async flag: true (asynchronous) or false (synchronous)

  • stringify – Optional. Stringify the request data for json exchange

  • dataflows – Chain of data transformations

property documentElement

Document.documentElement returns the Element that is the root element of the document (for example, the <html> element for HTML documents).

Related Pages:

encodeURIComponent(uri: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None) JsObject

The encodeURIComponent() function encodes a URI component.

Related Pages:

Parameters:
  • uri – The URI to be encoded

  • js_conv_func – Optional. A specific JavaScript data conversion function

Returns:

A String, representing the encoded URI.

eval(data: Union[JsDataModel, str], js_conv_func: Optional[Union[list, str]] = None)

The eval() function evaluates JavaScript code represented as a string.

Warning: Executing JavaScript from a string is an enormous security risk. It is far too easy for a bad actor to run arbitrary code when you use eval(). See Never use eval()!, below.

Related Pages:

Parameters:
  • data – Data to be evaluated

  • js_conv_func – Optional. A specific JavaScript data conversion function

execCommand(command: str, show_ui: bool, value: str) JsVoid

The execCommand() method executes the specified command for the selected part of an editable section.

Related Pages:

:param command:. Specifies the name of the command to execute on the selected section :param show_ui: specifies if the UI should be shown or not :param value: Some commands need a value to be completed

Returns:

A Boolean, false if the command is not supported, otherwise true.

extendProto(py_class: Any, func_name: str, js_funcs: Union[str, list], pmts: Optional[dict] = None, profile: Optional[Union[bool, dict]] = False)

Javascript Framework extension.

Hook in the base class to allow the definition of specific function to add extra primitive features. Usual this function should be used in a wrapper function with the same name in order to have a coherent bridge between Python and Javascript.

Related Pages:

Parameters:
  • py_class – PyJs class name

  • func_name – The Javascript function name

  • js_funcs – Javascript functions

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

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

Returns:

The Js Object to allow the chaining.

fetch(url: str, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = False, async_await: bool = False) JsPromise

The Fetch API provides a JavaScript interface for accessing and manipulating parts of the HTTP pipeline, such as requests and responses.

Usage:

page.ui.button("Click").click([
  page.js.fetch("test", {"method": "POST"}).then([
    page.js.console.log(pk.events.response)
  ])
])

Related Pages:

Parameters:
  • url – The target url

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

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

  • async_await – Optional.

property fncs: JsRegisteredFunctions

Property to the predefined Javascript functions.

Returns:

The predefined functions.

for_(js_funcs: Optional[Union[list, str]] = None, step: int = 1, start: int = 0, end: int = 10, options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = False) JsFor

Shortcut to a for loop.

Usage:

js_for = page.js.for_(end=30)
js_for.fncs([page.js.console.log(js_for.i)])

Related Pages:

Parameters:
  • js_funcs – Javascript functions

  • step – Optional. The value to increment. Default 1

  • start – Optional. The first index in the for loop

  • end – Optional. The last index in the for loop

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

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

get(url: Union[str, JsDataModel], data: Optional[dict] = None, js_code: str = 'response', is_json: bool = True, components: Optional[Union[Tuple[HtmlModel, str], List[HtmlModel]]] = None, headers: Optional[dict] = None, asynchronous: bool = False, stringify: bool = True, dataflows: Optional[List[dict]] = None) XMLHttpRequest

Create a GET HTTP request.

Usage:

inputs = page.ui.input("")
btn = page.ui.button("Click").click([
  page.js.get("/test", {"fegeg": "efefe", "ok": inputs.dom.content}, components=[("input", inputs)])
])
Parameters:
  • url – The url path of the HTTP request

  • data – Optional. A String corresponding to a JavaScript object

  • js_code – Optional. The variable name created in the Javascript (default response)

  • is_json – Optional. Specify the type of object passed

  • components – Optional. This will add the component value to the request object

  • headers – Optional. The request headers

  • asynchronous – Async flag: true (asynchronous) or false (synchronous)

  • dataflows – Chain of data transformations

static getElementById(id_name: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None)

The getElementById() method returns the element that has the ID attribute with the specified value.

Related Pages:

Parameters:
  • id_name – The ID attribute’s value of the element you want to get.

  • js_conv_func – Optional. A specific JavaScript data conversion function.

Returns:

An Element Object, representing an element with the specified ID. Returns null if no elements with

the specified ID exists

static getElementsByClassName(cls_name: str) JsDoms

The getElementsByClassName() method returns a collection of all elements in the document with the specified class name, as a NodeList object.

Related Pages:

Parameters:

cls_name – The class name of the elements you want to get.

Returns:

A NodeList object, representing a collection of elements with the specified class name. The elements in the returned collection are sorted as they appear in the source code.

static getElementsByName(name: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None) JsDomsList

The getElementsByName() method returns a collection of all elements in the document with the specified name (the value of the name attribute), as a NodeList object.

The NodeList object represents a collection of nodes. The nodes can be accessed by index numbers. The index starts at 0.

Related Pages:

Parameters:
  • name – The name attribute value of the element you want to access/manipulate.

  • js_conv_func – Optional. A specific JavaScript data conversion function.

Returns:

A NodeList object, representing a collection of elements with the specified name. The elements in the returned collection are sorted as they appear in the source code.

static getElementsByTagName(tag_name: Union[str, JsDataModel], i: int = 0, js_conv_func: Optional[Union[list, str]] = None) JsDoms

The getElementsByTagName() method returns a collection of an elements’s child elements with the specified tag name, as a NodeList object.

The NodeList object represents a collection of nodes. The nodes can be accessed by index numbers. The index starts at 0.

Related Pages:

Parameters:
  • tag_name – The tag name of the child elements you want to get

  • i – Optional. The index of the element

  • js_conv_func – Optional. A specific JavaScript data conversion function

getVar(js_code: Union[str, JsDataModel], var_type: str = 'var') JsObject

Get the Javascript Variable name.

Parameters:
  • js_code – The Variable name

  • var_type – Optional. The scope of the variable

Returns:

Return the piece of script to be added to the Javascript.

if_(condition: Union[str, list, bool], js_funcs: Union[list, str], profile: Optional[Union[bool, dict]] = False)

Conditional statements are used to perform different actions based on different conditions.

Usage:

page.js.if_(icon.icon.dom.content == "fas fa-lock-open cssicon", [
  page.js.console.log(icon.icon.dom.content),
])

Related Pages:

Parameters:
  • condition – The Javascript condition. Can be a JsBoolean object

  • js_funcs – Optional. The Javascript functions

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

import_css(css_file: str, self_contained: bool = False, js_code: str = 'css_dyn')

Add a CSS file on the fly from a JavaScript event.

Related Pages:

Parameters:
  • css_file – A script name with a CSS extension

  • self_contained – Optional. A flag to specify where the import will be done

import_js(script: str, js_funcs: Union[str, list], profile: Optional[Union[bool, dict]] = None, self_contained: bool = False)

Add a Javascript module and then run function once it is loaded.

Usage:

icon = page.ui.icons.clock().css({"color": 'blue'})
icon.click([ page.js.import_js("utils.js", ["testImport()"])])

Related Pages:

Parameters:
  • script – A script name. A Js extension

  • js_funcs – Callback function when module loaded. The Javascript functions

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

  • self_contained – Optional. A flag to specify where the import will be done

info(data: Union[str, JsDataModel], css_style: Optional[dict] = None, icon: str = 'fas fa-spinner fa-spin', seconds: int = 10000)

Display a message.

Related Pages:

Parameters:
  • data – A String corresponding to a JavaScript object

  • css_style – Optional. The CSS attributes to be added to the HTML component

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

  • seconds – Optional. The number of second the info will be visible

intersectionObserver(js_code: str, callback: Optional[Union[List[Union[str, JsDataModel]], str]] = None, options: Optional[dict] = None, observe_once: bool = False, profile: Optional[Union[bool, dict]] = None) IntersectionObserver
Parameters:
  • js_code – The PyJs functions.

  • callback – JavaScript functions called by the intersectionObserver.

  • options – intersectionObserver options.

  • observe_once – A flag to remove the observable once callbacks run.

  • profile – Option to perform profiling logs in the browser console.

property jquery

jQuery is a fast, small, and feature-rich JavaScript library.

It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.

Usage:

btn = page.ui.button("Click")
btn.js.jquery.on("click", [
  page.js.alert("It works"),
  btn.js.jquery.after('<div style="background-color:yellow"> New div </div>'),
])

Related Pages:

property keydown: KeyCode

The onkeydown event occurs when the user is pressing a key (on the keyboard).

Usage:

page.js.keydown.enter(pk.js_std.alert('Hello World'), profile=True)

Related Pages:

property keypress: KeyCode

The onkeypress event occurs when the user presses a key (on the keyboard).

Usage:

page.js.keypress.enter(pk.js_std.alert('Hello World'), profile=True)

Related Pages:

property keyup: KeyCode

The onkeypress event occurs when the user presses a key (on the keyboard).

Usage:

page.js.keyup.enter(pk.js_std.alert('Hello World'), profile=True)

Related Pages:

property location: JsLocation

Property to the Javascript Location functions.

Usage:

page.ui.text("Test").click([
  page.js.location.open_new_tab(page.js.location.getUrlFromArrays([
    ["AAA", "BBB"], ["111", "222"]], end_line="

“))])

mail(mails, subject=None, body=None, cc=None, bcc=None)

Create an email.

Related Pages:

Parameters:
  • mails

  • subject

  • body

  • bcc

property mediaRecorder: MediaRecorder

The MediaRecorder interface of the MediaStream Recording API provides functionality to easily record media. It is created using the MediaRecorder() constructor.

Related Pages:

property moment

Parse, validate, manipulate, and display dates and times in JavaScript.

Usage:

page.js.moment.new("2021-08-05", varName="momentTime"),
page.js.console.log(page.js.moment.var("momentTime").weekYear(1998)),
page.js.console.log(page.js.moment.var("momentTime").weekYear()),
page.js.console.log(page.js.moment.new("2021-08-05")),

Related Pages:

property msg: Msg

Shortcut to predefined temporary messages displayed to the UI.

navigateTo(url: Union[str, JsDataModel], options: Optional[dict] = None) JsObject

Navigator to another URL like NodeJs.

Usage:

icon.click([self.context.page.js.navigateTo(url)])

Related Pages:

Parameters:
  • url – The target url

  • options – Optional. The property of the location object

property navigator: JsNavigator

The information from the navigator object can often be misleading, and should not be used to detect browser versions because:

  • Different browsers can use the same name.

  • The navigator data can be changed by the browser owner.

  • Some browsers misidentify themselves to bypass site tests.

  • Browsers cannot report new operating systems, released later than the browser.

not_(data, js_conv_func: Optional[Union[list, str]] = None) JsFunction

Add the Symbol (!) for the boolean negation. This feature is also available directly to any JsBoolean objects.

Usage:

jsObj.not_(jsObj.objects.boolean.get("weekend"))

Related Pages:

Parameters:
  • data – A String corresponding to a JavaScript object

  • js_conv_func – Optional. A specific JavaScript data conversion function

Returns:

The Javascript fragment string.

number(data, js_code: Optional[str] = None, set_var: bool = False, is_py_data: bool = True) JsNumber

Shortcut to the Javascript Number primitives.

Parameters:
  • data – The String data.

  • js_code – Optional. The specific name to be used for this JavaScript String.

  • set_var – Optional. Set a variable. Default False.

  • is_py_data – Optional. Specify the type of data.

object(data, js_code: Optional[str] = None, set_var: bool = False, is_py_data: bool = True) JsObject

Shortcut to the Javascript Object primitives.

Parameters:
  • data – The String data.

  • js_code – Optional. The specific name to be used for this JavaScript String.

  • set_var – Optional. Set a variable. Default False.

  • is_py_data – Optional. Specify the type of data.

property objects: JsObjects

Interface to the main Javascript Classes and Primitives.

onReady(js_funcs: Union[str, list], profile: Optional[Union[bool, dict]] = False)

The ready event occurs when the body DOM (document object model) has been loaded.

Related Pages:

Parameters:
  • js_funcs – The Javascript functions to be added to this section

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

or_(*args) jsWrap

Create a Javascript Or statement.

static parseDate(value: str) JsNumber

The parse() method parses a date string and returns the number of milliseconds between the date string and midnight of January 1, 1970.

Related Pages:

Parameters:

value – A string representing a date.

Returns:

Number. Representing the milliseconds between the specified date-time and midnight January 1, 1970.

static parseFloat(value: str) JsNumber

The parseFloat() function parses a string and returns a floating point number.

Related Pages:

Parameters:

value – The string to be parsed.

Returns:

A Number. If the first character cannot be converted to a number, NaN is returned.

static parseInt(value: str)

The parseInt() function parses a string and returns an integer.

Related Pages:

Parameters:

value – The string to be parsed.

Returns:

A Number. If the first character cannot be converted to a number, NaN is returned.

patch(url: Union[str, JsDataModel], data: Optional[dict] = None, js_code: str = 'response', is_json: bool = True, components: Optional[List[Union[Tuple[HtmlModel, str], HtmlModel]]] = None, profile: Optional[Union[bool, dict]] = None, headers: Optional[dict] = None, asynchronous: bool = False, stringify: bool = True, dataflows: Optional[List[dict]] = None) XMLHttpRequest

Create a PATH HTTP request.

Related Pages:

Parameters:
  • url – The url path of the HTTP request

  • data – Optional. Corresponding to a JavaScript object

  • js_code – Optional. The variable name created in the Javascript (default response)

  • is_json – Optional. Specify the type of object passed

  • components – Optional. This will add the component value to the request object

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

  • headers – Optional. The request headers

  • asynchronous – Async flag: true (asynchronous) or false (synchronous)

  • stringify – Optional. Stringify the request data for json exchange

  • dataflows – Chain of data transformations

post(url: Union[str, JsDataModel], data: Optional[dict] = None, js_code: str = 'response', is_json: bool = True, components: Optional[List[Union[Tuple[HtmlModel, str], HtmlModel]]] = None, profile: Optional[Union[bool, dict]] = None, headers: Optional[dict] = None, asynchronous: bool = False, stringify: bool = True, dataflows: Optional[List[dict]] = None) XMLHttpRequest

Create a POST HTTP request.

Related Pages:

Parameters:
  • url – The url path of the HTTP request

  • data – Optional. Corresponding to a JavaScript object

  • js_code – Optional. The variable name created in the Javascript (default response)

  • is_json – Optional. Specify the type of object passed

  • components – Optional. This will add the component value to the request object

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

  • headers – Optional. The request headers

  • asynchronous – Async flag: true (asynchronous) or false (synchronous)

  • stringify – Optional. Stringify the request data for json exchange

  • dataflows – Chain of data transformations

print(content: Union[str, JsDataModel], timer: int = 1000, css_attrs: Optional[dict] = None)

Print a temporary message.

Parameters:
  • content – The content of the popup.

  • timer – Optional. The time the popup will be displayed.

  • css_attrs – Optional. The CSS attributes for the popup.

profile(type: Union[str, JsDataModel], html_code: str, mark: Union[str, JsDataModel], records_count: Optional[int] = None)
Parameters:
  • type – The type of profile tag.

  • html_code – The HTML component ID.

  • mark – The mark reference.

  • records_count – Optional. The records count.

put(url: Union[str, JsDataModel], data: Optional[dict] = None, js_code: str = 'response', is_json: bool = True, components: Optional[List[Union[Tuple[HtmlModel, str], HtmlModel]]] = None, profile: Optional[Union[bool, dict]] = None, headers: Optional[dict] = None, asynchronous: bool = False, stringify: bool = True, dataflows: Optional[List[dict]] = None) XMLHttpRequest

Create a PUT HTTP request.

Related Pages:

Parameters:
  • url – The url path of the HTTP request

  • data – Optional. Corresponding to a JavaScript object

  • js_code – Optional. The variable name created in the Javascript (default response)

  • is_json – Optional. Specify the type of object passed

  • components – Optional. This will add the component value to the request object

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

  • headers – Optional. The request headers

  • asynchronous – Async flag: true (asynchronous) or false (synchronous)

  • stringify – Optional. Stringify the request data for json exchange

  • dataflows – Chain of data transformations

querySelector(selector: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None)

The querySelector() method returns the first element that matches a specified CSS selector(s) in the document.

Related Pages:

Parameters:
  • selector – CSS selectors.

  • js_conv_func – Optional. A specific JavaScript data conversion function.

querySelectorAll(selector: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None) JsDomsList

The querySelectorAll() method returns all elements in the document that matches a specified CSS selector(s), as a static NodeList object.

Related Pages:

Parameters:
  • selector – CSS selectors.

  • js_conv_func – Optional. A specific JavaScript data conversion function.

queueMicrotask(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)

The queueMicrotask() method, which is exposed on the Window or Worker interface, queues a microtask to be executed at a safe time prior to control returning to the browser’s event loop.

Usage:

page.body.onReady([
    page.js.queueMicrotask([page.js.alert("ok")])
  ])

Related Pages:

Parameters:
  • js_funcs – The Javascript function definition

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

registerFunction(func_name: str, js_funcs: Union[str, list], args: Optional[dict] = None, profile: Optional[Union[bool, dict]] = False)

Javascript Framework extension.

Register a predefined Javascript function. This is only dedicated to specific Javascript transformation functions.

Parameters:
  • func_name – The function name

  • js_funcs – The Javascript function definition

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

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

request_http(method_type: str, url: str, js_code: str = 'response', is_json: bool = True, components: Optional[List[HtmlModel]] = None) XMLHttpRequest

All modern browsers have a built-in XMLHttpRequest object to request data from a server.

Related Pages:

Usage:

page.js.request_http("ajax", "POST", "https://api.cdnjs.com/libraries").setHeaders(header).onSuccess([
page.js.alert(rptObj.js.objects.request.get("ajax").responseText)]).send(encodeURIData={"search": 'ractive'})
Parameters:
  • method_type – The method of the HTTP Request

  • url – The url path of the HTTP request

  • js_code – Optional. The variable name created in the Javascript

  • is_json – Optional. Specify the type of object passed

  • components – Optional. A list of HTML objects values to be passed in the request

request_rpc(js_code: str, method_type: Union[str, JsDataModel], fnc: Callable, url: str, extra_params: Optional[Union[dict, JsDataModel]] = None) XMLHttpRequest

Internal RPC to trigger services.

Parameters:
  • js_code – The variable name created in the Javascript.

  • method_type – The method type

  • fnc – Python function.

  • url – The service url

  • extra_params – Optional.

rest(method: str, url: Union[str, JsDataModel], data: Optional[dict] = None, js_code: str = 'response', is_json: bool = True, components: Optional[List[Union[Tuple[HtmlModel, str], HtmlModel]]] = None, profile: Optional[Union[bool, dict]] = None, headers: Optional[dict] = None, asynchronous: bool = False, stringify: bool = True, dataflows: Optional[List[dict]] = None) XMLHttpRequest

Create a POST HTTP request.

Parameters:
  • method – The REST method used

  • url – The url path of the HTTP request

  • data – Optional. Corresponding to a JavaScript object

  • js_code – Optional. The variable name created in the Javascript (default response)

  • is_json – Optional. Specify the type of object passed

  • components – Optional. This will add the component value to the request object

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

  • headers – Optional. The request headers

  • asynchronous – Optional. Async flag: true (asynchronous) or false (synchronous)

  • stringify – Optional. Stringify the request data for json exchange

  • dataflows – Chain of data transformations

return_(data: str) JsFunction

Javascript return keyword.

Parameters:

data – The Javascript expression.

property rxjs

Reactive Extensions Library for JavaScript.

Related Pages:

property samples: Samples

JavaScript feature to provide sample of data for a test/demo.

Usage:

page.js.samples.months(count_=7)
page.js.samples.numbers(count_=7, min_=-100, max_=100)
property screen

The screen object contains information about the visitor’s screen.

Related Pages:

serverSentEvent(html_code: Optional[str] = None) ServerSentEvent

SSE is a native HTML5 feature that allows the server to keep the HTTP connection open and push data changes to the client. Server-sent Streaming is really ideal for server-push notifications, device monitoring and all other tasks that do not require real-time push back from the client.

Related Pages:

Parameters:

html_code – The EventSource id (variable name) on the JavaScript side

socketio(html_code: Optional[str] = None)

This object must be created on the Python side.

The various function will be the one generating the Javascript string. This is just a Python wrapper on top of the library.

Related Pages:

Parameters:

html_code – Optional. The WebSocket id (variable name) on the JavaScript side

speechRecognition(js_code: str) SpeechRecognition

The SpeechRecognition interface of the Web Speech API is the controller interface for the recognition service; this also handles the SpeechRecognitionEvent sent from the recognition service.

Related Pages:

Usage:

page = pk.Page()
rec = page.js.speechRecognition("reco")

test = page.ui.button("Start recording")
test.click([rec.start()])

page.ui.input(html_code="test")

rec.speechend([rec.stop()])
rec.onresult([pk.js_callback("UpdateComponent(transcript, confidence)"), page.js.console.log("Done")])
page.body.onReady([page.js.import_js("test_fnc.js", [], self_contained=True), rec])

# in the module test_fnc.js
function ProcessData(transcript, confidence){
    console.log(transcript); return (transcript == 'hello')}

function UpdateComponent(transcript, confidence){
    var expr = transcript.split(" ");
    if (expr[0] === "put"){document.getElementById(expr[3]).value = expr[1]}}
Parameters:

js_code – The variable name for the speech recognition object

string(data, js_code: Optional[str] = None, set_var: bool = False, is_py_data: bool = True) JsString

Shortcut to the Javascript String primitives.

Parameters:
  • data – The String data.

  • js_code – Optional. The specific name to be used for this JavaScript String.

  • set_var – Optional. Set a variable. Default False.

  • is_py_data – Optional. Specify the type of data.

switch(variable: Union[str, JsDataModel, HtmlModel], js_conv_func: Optional[Union[list, str]] = None) JsSwitch

switch statement is used to perform different actions based on different conditions.

Related Pages:

Parameters:
  • variable – Variable on which we will apply the switch

  • js_conv_func – Optional. A specific JavaScript data conversion function

static title(text: Optional[Union[JsDataModel, str]] = None, js_conv_func: Optional[Union[list, str]] = None)

The title property sets or returns the title of the current document (the text inside the HTML title element).

Related Pages:

Parameters:
  • text – Optional. Representing the title of the document

  • js_conv_func – Optional. A specific JavaScript data conversion function

static typeof(data: str, var_type: Optional[str] = None)

The typeof function.

Related Pages:

Parameters:
  • data – A String corresponding to a JavaScript object

  • var_type – Optional. The type of object

property viewHeight

Return the current View port height visible in the browser.

websocket(html_code: Optional[str] = None, secured: bool = False)

WebSocket client applications use the WebSocket API to communicate with WebSocket servers using the WebSocket protocol.

Related Pages:

Parameters:
  • html_code – Optional. The WebSocket id (variable name) on the JavaScript side

  • secured – Optional. To define the right protocol for the WebSocket connection we or wss

while_(condition: Union[str, list], js_funcs: Union[list, str], options: Optional[dict] = None, profile: Optional[Union[bool, dict]] = False) JsWhile

The while loop loops through a block of code as long as a specified condition is true.

Related Pages:

Parameters:
  • condition – The JavaScript condition

  • js_funcs – Javascript functions

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

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

worker(html_code: Optional[str] = None, server: bool = False)

A web worker is a JavaScript running in the background, without affecting the performance of the page.

Related Pages:

Parameters:
  • html_code – Optional. The WebSocket id (variable name) on the JavaScript side

  • server – Optional. Specify if the page is running on a server

writeln(value: str)

The writeln() method is identical to the document.write() method, with the addition of writing a newline character after each statement.

Related Pages:

Parameters:

value – What to write to the output stream. Multiple arguments can be listed and they will be appended to the document in order of occurrence

Returns:

No return value

JavaScript features

Console

class epyk.core.js.Js.JsConsole(page: Optional[PageModel] = None)

This is a wrapper to the Console.

Related Pages:

property clear

The console.clear() method clears the console.

Usage:

page.js.console.clear

Related Pages:

Returns:

The Javascript String used to clear the console (F12 in standard browsers).

property debugger

Trigger a Javascript debugger from this point. The Javascript will be stopped. It will be possible to check the process step by step in the browser using F12.

Usage:

page.js.console.debugger

Related Pages:

Returns:

The Javascript Keyword to trigger the browser debugger.

error(data: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None)

The console.error() method writes an error message to the console.

Related Pages:

Parameters:
  • data – The Javascript fragment

  • js_conv_func – Optional. A specific JavaScript data conversion function

Returns:

The Javascript String used to clear the console (F12 in standard browsers)

info(data: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None)

The console.info() method writes a message to the console.

Related Pages:

Parameters:
  • data – The Javascript fragment

  • js_conv_func – Optional. A specific JavaScript data conversion function

Returns:

The Javascript String used to clear the console (F12 in standard browsers)

log(data: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None, skip_data_convert: bool = False)

The console.log() method writes a message to the console.

Usage:

page.js.console.log("Test")

Related Pages:

Parameters:
  • data – The Javascript fragment.

  • js_conv_func – Optional. A specific JavaScript data conversion function.

  • skip_data_convert – Optional. Flag to specify to the framework if a Json conversion is needed.

Returns:

The Javascript String used to clear the console (F12 in standard browsers)

perf(js_code: str, label: Optional[str] = None)

Shortcut function to display performances from a variable. The variable must be global. Namely the name should start with window.

Parameters:
  • js_code – The variable var name use to compute the performance.

  • label – Optional. The description.

service(msg: str, headers: Optional[dict] = None)

Send logs to the backend.

Parameters:
  • msg – The log message to be sent to the backend

  • headers – the service headers

table(data: Union[str, JsDataModel], js_header: Optional[list] = None) JsFunction

The console.table() method writes a table in the console view.

Related Pages:

Parameters:
  • data – The data to fill the table with

  • js_header – Optional. An array containing the names of the columns to be included in the table

Returns:

The Javascript String used to clear the console (F12 in standard browsers).

time(html_code: Union[str, JsDataModel]) JsNumber

The console.time() method starts a timer in the console view.

Related Pages:

Parameters:

html_code – Use the label parameter to give the timer a name

Returns:

A Python Javascript Number.

timeEnd(html_code: Union[str, JsDataModel])

The console.timeEnd() method ends a timer, and writes the result in the console view.

Related Pages:

Parameters:

html_code – The name of the timer to end

Returns:

The Javascript String used to clear the console (F12 in standard browsers).

tryCatch(js_funcs: Union[str, list], js_funcs_errs: Union[str, list] = 'console.warn(err.message)', profile: Optional[Union[bool, dict]] = False)

Javascript Try Catch Exceptions.

Related Pages:

Parameters:
  • js_funcs – The Javascript functions

  • js_funcs_errs – The Javascript functions

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

Returns:

The Javascript String used to clear the console (F12 in standard browsers)

warn(data: Union[str, JsDataModel], js_conv_func: Optional[Union[list, str]] = None)

The console.warn() method writes a warning to the console.

Related Pages:

Parameters:
  • data – The Javascript fragment

  • js_conv_func – Optional. A specific JavaScript data conversion function

Returns:

The Javascript String used to clear the console (F12 in standard browsers)

Json

class epyk.core.js.Js.JsJson

Wrapper around the Javascript Json module.

This wrapper will only wrapper the different functions available in the underlying library. The documentation can be found in each function or are available on the Javascript Official documentation.

Related Pages:

parse(data: Union[str, JsDataModel], js_result_func: Optional[str] = None, js_conv_func: Optional[Union[list, str]] = None)

Parses a JSON string and returns a JavaScript object.

Related Pages:

Parameters:
  • data – A String corresponding to a JavaScript object

  • js_result_func – Optional. A function used to transform the result. The function is called for each item. Any nested objects are transformed before the parent

  • js_conv_func – Optional. A specific JavaScript data conversion function

Returns:

The Javascript string method

stringify(data: Union[str, JsDataModel], replacer=None, space: int = 0, js_conv_func: Optional[Union[list, str]] = None)

The JSON.stringify() method converts JavaScript objects into strings.

Related Pages:

Parameters:
  • data – The value to convert to a string.

  • replacer – Optional. Either a function or an array used to transform the result. The replacer is called for each item.

  • space – Optional. Either a String or a Number. A string to be used as white space (max 10 characters), or a Number, from 0 to 10, to indicate how many space characters to use as white space.

  • js_conv_func – Optional. A specific JavaScript data conversion function.

Returns:

The Javascript string method.

Screen

class epyk.core.js.Js.JsScreen
property availHeight: JsNumber

The availHeight property returns the height of the user’s screen, in pixels, minus interface features like the Windows Task bar.

Related Pages:

property availWidth: JsNumber

The availWidth property returns the width of the user’s screen, in pixels, minus interface features like the Windows Task bar.

Related Pages:

property colorDepth: JsNumber

The colorDepth property returns the bit depth of the color palette for displaying images (in bits per pixel).

Related Pages:

property height: JsNumber

The height property returns the total height of the user’s screen, in pixels.

Related Pages:

property pixelDepth: JsNumber

The pixelDepth property returns the color resolution (in bits per pixel) of the visitor’s screen.

Related Pages:

property width: JsNumber

The width property returns the total width of the user’s screen, in pixels.

Related Pages:

Maths

class epyk.core.js.Js.JsMaths.JsMaths

Wrapper for the Javascript Math module

Related Pages:

property E: JsNumber

The E property returns the Euler’s number and the base of natural logarithms, approximately 2.718.

Usage:

page.js.math.E

Related Pages:

https//www.w3schools.com/jsref/jsref_e.asp

Returns:

Returns Euler’s number (approx. 2.718)

property LN10

The LN10 property returns the natural logarithm of 10, approximately 2.302.

Usage:

jsObj.math.LN10

Related Pages:

Returns:

Returns the natural logarithm of 10 (approx. 2.302)

property LN2

The LN2 property returns the natural logarithm of 2, approximately 0.693.

Usage:

jsObj.math.LN2

Related Pages:

https//www.w3schools.com/jsref/jsref_ln2.asp

Returns:

Returns the natural logarithm of 2 (approx. 0.693)

property LOG2E

The LOG2E property returns the base-2 logarithm of E, approximately 1.442

Usage:

jsObj.math.LOG2E

Related Pages:

https//www.w3schools.com/jsref/jsref_log2e.asp

Returns:

Returns the base-2 logarithm of E (approx. 1.442)

property PI

The PI property returns the ratio of a circle’s area to the square of its radius, approximately 3.14.

Related Pages:

property SQRT1_2

The SQRT1_2 property returns the square root of 1/2, approximately 0.707.

Usage:

jsObj.math.SQRT1_2

Related Pages:

https//www.w3schools.com/jsref/jsref_sqrt1_2.asp

Returns:

Returns the square root of 1/2 (approx. 0.707)

property SQRT2: <module 'epyk.core.js.primitives.JsNumber' from '../epyk/core/js/primitives/JsNumber.py'>

The SQRT2 property returns the square root of 2, approximately 1.414.

Usage:

jsObj.math.SQRT2

Related Pages:

https//www.w3schools.com/jsref/jsref_sqrt2.asp

Returns:

Returns the square root of 2 (approx. 1.414)

abs(number: Union[float, JsDataModel])

The abs() method returns the absolute value of a number.

Related Pages:

https//www.w3schools.com/jsref/jsref_abs.asp

Parameters:

number (Union[infloatt, primitives.JsDataModel]) – A number.

Returns:

Returns the absolute value of x.

ceil(number: Union[float, JsDataModel])

The ceil() method rounds a number UPWARDS to the nearest integer, and returns the result.

Usage:

jsObj.math.ceil(jsObj.objects.number.get("MyNumber"))

Related Pages:

https//www.w3schools.com/jsref/jsref_ceil.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – The number you want to round.

Returns:

Returns x, rounded upwards to the nearest integer.

cos(number: Union[float, JsDataModel])

The acos() method returns the cosinus of a number as a value value between 0 and PI radians.

Related Pages:

https//www.w3schools.com/jsref/jsref_cos.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – Returns the cosine of x (x is in radians).

Returns:

A Number, from -1 to 1, representing the cosine of an angle, or NaN if the value is empty.

exp(number: Union[float, JsDataModel])

The exp() method returns the value of Ex, where E is Euler’s number (approximately 2.7183) and x is the number passed to it.

Related Pages:

https//www.w3schools.com/jsref/jsref_exp.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – Number. Required. A number,

Returns:

Returns the value of exponential of x,

floor(number: Union[float, JsDataModel])

The floor() method rounds a number DOWNWARDS to the nearest integer, and returns the result.

Usage:

jsObj.math.floor(13.566)

Related Pages:

https//www.w3schools.com/jsref/jsref_floor.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – Required. The number you want to round.

Returns:

A Number, representing the nearest integer when rounding downwards

log(number: Union[float, JsDataModel])

The log() method returns the natural logarithm (base E) of a number.

Related Pages:

https//www.w3schools.com/jsref/jsref_log.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – Number. Required. A number.

Returns:

Returns the natural logarithm (base E) of x.

max(*args)

The max() method returns the number with the highest value.

Usage:

jsObj.math.max(10, 45, 100, -3, 56)

Related Pages:

Parameters:

args – Optional. One or more numbers to compare.

Returns:

A Number, representing the highest number of the arguments, or -Infinity if no arguments are given, or NaN

if one or more arguments are not numbers

min(*args)

The min() method returns the number with the lowest value.

Usage:

jsObj.math.min(10, 45, 100, -3, 56)

Related Pages:

Parameters:

args – Optional. One or more numbers to compare.

Returns:

A Number, representing the lowest number of the arguments, or Infinity

if no arguments are given, or NaN if one or more arguments are not numbers

static pow(number: Union[JsDataModel, float], power: Union[JsDataModel, int])

The pow() method returns the value of x to the power of y (xy).

Usage:

jsObj.objects.number.new(23.6, varName="MyNumber")
jsObj.math.pow(jsObj.objects.number.get("MyNumber"), 2)

Related Pages:

https//www.w3schools.com/jsref/jsref_pow.asp

Parameters:
  • number (Union[float, primitives.JsDataModel]) – The base.

  • power (Union[int, primitives.JsDataModel]) – The exponent.

Returns:

Returns the value of x to the power of y.

random(min_val: Union[int, JsDataModel] = 0, max_val: Union[int, JsDataModel] = 1)

Math.random() returns a random number between 0 (inclusive), and 1 (exclusive):

Usage:

page.js.math.random()
jsObj.math.random(10, 100)

Related Pages:

Parameters:
  • min_val (Union[int, primitives.JsDataModel]) – Optional The minimum value for the random function.

  • max_val (Union[int, primitives.JsDataModel]) – Optional The maximum value for the random function.

Returns:

A Number, representing a number from 0 up to but not including 1.

round(number: Union[float, JsDataModel])

The round() method rounds a number to the nearest integer.

Note: 2.49 will be rounded down (2), and 2.5 will be rounded up (3).

Usage:

jsObj.objects.number.new(23.6, varName="MyNumber")
jsObj.math.round(jsObj.objects.number.get("MyNumber"))

Related Pages:

https//www.w3schools.com/jsref/jsref_round.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – The number to be rounded.

Returns:

Rounds x to the nearest integer.

sin(number: Union[float, JsDataModel])

The sin() method returns the sinus of a number as a value value between 0 and PI radians.

Related Pages:

https//www.w3schools.com/jsref/jsref_sin.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – Returns the sinus of x (x is in radians).

Returns:

Number. from -1 to 1, representing the sine of an angle, or NaN if the value is empty.

sqrt(number: Union[float, JsDataModel])

The sqrt() method returns the square root of a number.

Usage:

jsObj.objects.number.new(23.6, varName="MyNumber")
jsObj.math.sqrt(jsObj.objects.number.get("MyNumber"))

Related Pages:

https//www.w3schools.com/jsref/jsref_sqrt.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – A number.

Returns:

A Number. If x is a negative number, NaN is returned.

trunc(number: Union[float, JsDataModel])

The trunc() method returns the integer part of a number.

Usage:

page.js.math.trunc(rptObj.js.math.SQRT2)

Related Pages:

https//www.w3schools.com/jsref/jsref_trunc.asp

Parameters:

number (Union[float, primitives.JsDataModel]) – Number. Required. A number.

Returns:

Returns the integer part of a number (x).

Location

class epyk.core.js.Js.JsLocation.JsLocation

JavaScript Location module.

classmethod assign(url: Union[str, JsDataModel]) JsFunction

The assign() method loads a new document.

Related Pages:

https//www.w3schools.com/jsref/met_loc_assign.asp

Parameters:

url – Specifies the URL of the page to navigate to

classmethod download(url: Union[str, JsDataModel], name: Union[str, JsDataModel] = 'download') JsVoid

Download data from the url.

Parameters:
  • url – The url of the image

  • name – Optional. The name of the file

classmethod getUrlFromArrays(data: Union[list, JsDataModel], delimiter: Union[str, JsDataModel] = ',', charset: str = 'utf-8', end_line: Union[str, JsDataModel] = '\r\n')

Convert data to a URL.

Parameters:
  • data – A JavaScript array

  • delimiter – Optional. The column delimiter

  • charset – Optional.

  • end_line – Optional.

classmethod getUrlFromData(data: Union[dict, JsDataModel], options: Optional[Union[dict, JsDataModel]] = None)

Convert data to a URL.

Related Pages:

Parameters:
  • data – Input data to be converted

  • options – Optional. Blob definition properties

property hash: JsObject

The hash property sets or returns the anchor part of a URL, including the hash sign (#).

Usage:

jsObj.location.hash

Related Pages:

https//www.w3schools.com/jsref/prop_loc_hash.asp

Returns:

A String, representing the anchor part of the URL, including the hash sign (#).

property host: JsString

The host property sets or returns the hostname and port of a URL.

Usage:

jsObj.location.host

Related Pages:

https//www.w3schools.com/jsref/prop_loc_host.asp

Returns:

Return the hostname and port of the current URL.

property hostname: JsString

The hostname property sets or returns the hostname of a URL.

Usage:

page.location.hostname

Related Pages:

https//www.w3schools.com/jsref/obj_location.asp

Returns:

Return the hostname property.

classmethod href(href: Optional[Union[JsDataModel, str]] = None, secured: bool = False) JsObject

The href property sets or returns the entire URL of the current component.

Usage:

page.js.location.href("https://www.w3schools.com/howto/howto_js_fullscreen.asp")

Related Pages:

Parameters:
  • href – Optional. Set the href property

  • secured – Optional. The secured flag

Returns:

A String, representing the entire URL of the page, including the protocol (like http://).

mail(mails: List[str], subject: str, body: str)

The mailto link when clicked opens users default email program or software. A new email page is created with “To” field containing the address of the name specified on the link by default.

Usage:

page.js.location.mail(["test@gmail.com"], "This is a test", "This is the email's content")

Related Pages:

Parameters:
  • mails – The email addresses

  • subject – The email’s subject

  • body – The email’s content

Returns:

THe Javascript string.

classmethod open_new_tab(url: Union[str, JsDataModel], name: Union[str, JsDataModel] = '_blank', specs: Optional[Union[JsDataModel, str]] = None, replace: Optional[Union[JsDataModel, str]] = None, window_id: str = 'window', data: Optional[dict] = None, secured: bool = False) JsFunction

Opens a new browser window in a new tab (duplicated but part of the Window module).

Usage:

page.js.location.open_new_tab("www.google.fr")

Related Pages:

Parameters:
  • url – Optional. Specifies the URL of the page to open. If no URL is specified, a new window/tab with about:blank is opened

  • name – Optional. Specifies the target attribute or the name of the window. Default _blank

  • specs – Optional. A comma-separated list of items, no whitespaces

  • replace – Optional. Specifies whether the URL creates a new entry or replaces the current entry in the history list

  • window_id – Optional. The JavaScript window object

  • data – Optional. The url parameters

  • secured – Optional. The secure flag

property origin: JsString

The origin property returns the protocol, hostname and port number of a URL.

Usage:

page.js.location.origin + page.js.location.pathname

Related Pages:

https//www.w3schools.com/jsref/prop_loc_origin.asp

Returns:

A String, representing the protocol (including ://), the domain name (or IP address) and port number (including the colon sign (:) of the URL. For URL’s using the “file:” protocol, the return value differs between browser)

property pathname: JsString

The hostname property sets or returns the hostname of a URL.

Usage:

jsObj.location.pathname

Related Pages:

https//www.w3schools.com/jsref/obj_location.asp

Returns:

Return the pathname property.

property port: JsString

The port property sets or returns the port number the server uses for a URL.

Related Pages:

https//www.w3schools.com/jsref/prop_loc_port.asp

Returns:

A String, representing the port number of a URL.

classmethod postTo(url: str, data: dict, method: str = 'POST', target: str = '_blank')

This method will create an internal form and submit the response exactly like a post of a form to another page.

Related Pages:

Parameters:
  • url – The target url

  • data – The url parameters

  • method – Optional. The method used to send the data. Default POST

  • target – Optional. Target method to access the new page

classmethod reload(force_get: bool = False)

The reload() method is used to reload the current document.

The reload() method does the same as the reload button in your browser.

Related Pages:

https//www.w3schools.com/jsref/met_loc_reload.asp

Parameters:

force_get – Optional. Specifies the type of reloading: false - Default. Reloads the current page from the cache true - Reloads the current page from the server

classmethod replace(url: Union[str, JsDataModel], secured: bool = False) JsFunction

The replace() method replaces the current document with a new one.

The difference between this method and assign(), is that replace() removes the URL of the current document from the document history, meaning that it is not possible to use the “back” button to navigate back to the original document.

Related Pages:

https//www.w3schools.com/jsref/met_loc_replace.asp

Parameters:
  • url – Specifies the URL of the page to navigate to

  • secured – Optional. If the http is missing. This will be used to fix the url

property search: JsString

The search property sets or returns the querystring part of a URL, including the question mark (?).

Related Pages:

https//www.w3schools.com/jsref/prop_loc_search.asp

Returns:

A String, representing the querystring part of a URL, including the question mark (?).

url(params: Optional[Union[dict, JsDataModel]] = None, removed_params: Optional[List[str]] = None) JsString

Get the current url value. This function can also apply some filters on the existing parameters.

Parameters:
  • params – Parameters to be changed / added

  • removed_params – Parameters to be removed

property urlSearchParams: URLSearchParams

The URLSearchParams() constructor creates and returns a new URLSearchParams object.

Related Pages:

class epyk.core.js.Js.JsLocation.URLSearchParams(query: str)
append(key: Union[str, JsDataModel], value: Any)

Append a key, value to the url parameter object.

Related Pages:

Parameters:
  • key – The url parameter

  • value – The value to be appended to the URL

delete(key)

The delete() method of the URLSearchParams interface deletes the given search parameter and all its associated values, from the list of all search parameters.

Related Pages:

Parameters:

key

get(key: str, default: Optional[Any] = None)

Get the value of a request parameter in the url.

Related Pages:

Parameters:
  • key – The url parameter

  • default – Optional. The default value

getAll(key: Union[str, JsDataModel])

Get all the values of a request parameter in the url.

Related Pages:

Parameters:

key – The url parameter

has(key: Union[str, JsDataModel])

Check if a given parameter is in the url.

Related Pages:

Parameters:

key – The url parameter

set(key: str, value: Any)

Set the value of a request parameter in the url.

Related Pages:

Parameters:
  • key – The url parameter

  • value – The value to set

Window

epyk.core.js.Js.JsWindow

alias of <module ‘epyk.core.js.JsWindow’ from ‘../epyk/core/js/JsWindow.py’>

WebWorkers

Web Workers are a simple means for web content to run scripts in background threads. The worker thread can perform tasks without interfering with the user interface.

It is possible to create and to use web worker with Epyk. To do so it is possible to use them in a dedicated page or in a Jupyter Notebook:

w2 = page.js.worker()
w2.connect(content='''
self.addEventListener('message', function(e) {
  var data = e.data; console.log(data);
  switch (data.cmd) {
    case 'add':
      self.postMessage('Result: ' + (data.value1 + data.value2 + data.value3)); break;
    case 'mult':
      self.postMessage('Result: ' + (data.value1 * data.value2 * data.value3)); break;
    case 'stop':
      self.postMessage('WORKER STOPPED: ' + data.msg + '. (buttons will no longer work)');
      self.close(); break;
    default:
      self.postMessage('Unknown command: ' + data.msg);
  };
}, false);
''')

slider = page.ui.slider()
number = page.ui.fields.number()

div = page.ui.div()
page.ui.button("Add").click([w2.postMessage({'cmd': 'add', 'value1': 2}, components=[(slider, "value2"), (number, "value3")])])
page.ui.button("Mult").click([w2.postMessage({'cmd': 'mult', 'value1': 5}, components=[(slider, "value2"), (number, "value3")])])

page.ui.button("Stop worker").click([w2.postMessage({'cmd': 'stop'})])

More details on the web workers are available in the functions documentation.

Websocket

class epyk.core.js.Js.JsWebSocket.WebSocket(html_code: Optional[str] = None, src: Optional[Union[str, PageModel]] = None, secured: bool = False)
close(code: int = 1000, reason: Optional[Union[JsDataModel, str]] = None)

When you’ve finished using the WebSocket connection, call the WebSocket method close()

Related Pages:

Parameters:
  • code (int) – Optional. The HTTP code to be sent to the server for the closure

  • reason (Optional[str]) – Optional. The message to be sent to the server for the closure

connect(url: Optional[str] = None, port: Optional[int] = None, protocol: Optional[Union[list, str]] = None, from_config=None)

In order to communicate using the WebSocket protocol, you need to create a WebSocket object; this will automatically attempt to open the connection to the server.

Related Pages:

Parameters:
  • url (str) – The URL to which to connect; this should be the URL to which the WebSocket server will respond. This should use the URL scheme wss://, although some software may allow you to use the insecure ws:// for local connections.

  • port (Optional[int]) – The application port number.

  • protocol (Union[list, str]) – Either a single protocol string or an array of protocol strings.

  • from_config

property http_codes

To get connection state, additionally there’s socket.readyState property with values:

Related Pages:

property message

Fired when data is received through a WebSocket. Also available via the onmessage property.

Related Pages:

onclose(js_funcs: Optional[Union[list, str]], profile: Optional[Union[bool, dict]] = None)

Fired when a connection with a WebSocket is closed. Also available via the onclose property.

Related Pages:

Parameters:
  • js_funcs (Optional[Union[list, str]]) – Javascript functions.

  • profile (Optional[Union[dict, bool]]) – Optional. A flag to set the component performance storage.

onerror(js_funcs: Optional[Union[list, str]], profile: Optional[Union[bool, dict]] = None)

Fired when a connection with a WebSocket has been closed because of an error, such as when some data couldn’t be sent. Also available via the onerror property.

Related Pages:

Parameters:
  • js_funcs (Optional[Union[list, str]]) – Javascript functions.

  • profile (Optional[Union[dict, bool]]) – Optional. A flag to set the component performance storage.

onmessage(js_funcs: Optional[Union[list, str]], profile: Optional[Union[bool, dict]] = None)

Fired when data is received through a WebSocket. Also available via the onmessage property.

Related Pages:

Parameters:
  • js_funcs (Optional[Union[list, str]]) – Javascript functions.

  • profile (Optional[Union[dict, bool]]) – Optional. A flag to set the component performance storage.

onopen(js_funcs: Optional[Union[list, str]], profile: Optional[Union[bool, dict]] = None)

Fired when a connection with a WebSocket is opened. Also available via the onopen property.

Related Pages:

Parameters:
  • js_funcs (Optional[Union[list, str]]) – Javascript functions.

  • profile (Optional[Union[dict, bool]]) – Optional. A flag to set the component performance storage.

property readyState

The WebSocket.readyState read-only property returns the current state of the WebSocket connection.

Related Pages:

receive(js_funcs: Optional[Union[list, str]], profile: Optional[Union[bool, dict]] = None)

Fired when data is received through a WebSocket. Also available via the onmessage property.

Parameters:
  • js_funcs (Optional[Union[list, str]]) – Javascript functions.

  • profile (Optional[Union[dict, bool]]) – Optional. A flag to set the component performance storage.

reconnect()
send(data)

Basic way to send a text message to the server.

Related Pages:

Parameters:

data – String. The message to be sent

sendText(components: List[HtmlModel], attrs: Optional[dict] = None)

Send a complex message from components.

Related Pages:

Parameters:
  • components (List[primitives.HtmlModel]) – The list of HTML components (it will get the dom.content automatically)

  • attrs (dict) – Optional. Attach some static attributes to the request

property states

To get connection state, additionally there’s socket.readyState property with values:

Related Pages:

Performance

class epyk.core.js.Js.JsPerformance.JsPerformance(page: Optional[PageModel] = None)
add_profiling(js_funcs: Optional[Union[list, str]])

Wrap the Javascript functions with function to asset on the execution time.

Usage:

page.js.performance.add_profiling(fncs['content'])

Related Pages:

Parameters:

js_funcs (Optional[Union[list, str]]) – The Javascript functions.

Returns:

The profile variable name

clearMarks(name: Optional[str] = None)

The clearMarks() method removes the named mark from the browser’s performance entry buffer. If the method is called with no arguments, all performance entries with an entry type of “mark” will be removed from the performance entry buffer.

Usage:

performance.clearMarks("a")

Related Pages:

Parameters:

name (Optional[str]) – Optional. The mark name.

Returns:

Void, the String for the Javascript side

clearMeasures(name: Optional[str] = None)

The clearMeasures() method removes the named measure from the browser’s performance entry buffer. If the method is called with no arguments, all performance entries with an entry type of “measure” will be removed from the performance entry buffer.

Usage:

performance.clearMeasures("a");

Related Pages:

Parameters:

name (Optional[str]) – Optional. The name of the mark to be cleared.

Returns:

Void, the String for the Javascript side

clearResourceTimings()

The clearResourceTimings() method removes all performance entries with an entryType of “resource” from the browser’s performance data buffer and sets the size of the performance data buffer to zero. To set the size of the browser’s performance data buffer, use the Performance.setResourceTimingBufferSize() method.

Usage:

performance.clearResourceTimings()

Related Pages:

Returns:

This method has no return value, but only the String for the Javascript side

getEntries()

The getEntries() method returns a list of all PerformanceEntry objects for the page. The list’s members (entries) can be created by making performance marks or measures (for example by calling the mark() method) at explicit points in time. If you are only interested in performance entries of certain types or that have certain names, see getEntriesByType() and getEntriesByName().

Related Pages:

Returns:

An array of PerformanceEntry objects

getEntriesByName(name: Union[JsDataModel, str], entry_type: Optional[str] = None)

The getEntriesByName() method returns a list of PerformanceEntry objects for the given name and type. The list’s members (entries) can be created by making performance marks or measures (for example by calling the mark() method) at explicit points in time.

Usage:

performance.getEntriesByName("Begin", "mark")

Related Pages:

https//developer.mozilla.org/en-US/docs/Web/API/Performance/getEntriesByName

Parameters:
  • name (Union[primitives.JsDataModel, str]) – The name of the entry to retrieve.

  • entry_type (Optional[str]) – Optional. The type of entry to retrieve such as “mark”.

Returns:

A list of PerformanceEntry objects that have the specified name and type

getEntriesByType(entry_type: str)

The getEntriesByType() method returns a list of PerformanceEntry objects for a given type. The list’s members (entries) can be created by making performance marks or measures (for example by calling the mark() method) at explicit points in time.

Usage:

performance.getEntriesByType("mark")

Related Pages:

Parameters:

entry_type (str) – The type of entry to retrieve such as “mark”.

Returns:

A list of PerformanceEntry objects that have the specified type.

mark(name: Union[JsDataModel, str])

The mark() method creates a timestamp in the browser’s performance entry buffer with the given name. The application defined timestamp can be retrieved by one of the Performance interface’s getEntries*() methods (getEntries(), getEntriesByName() or getEntriesByType()).

Usage:

performance.mark("a")

Related Pages:

Parameters:

name (Union[primitives.JsDataModel, str]) – A DOMString representing the name of the mark.

Returns:

Void, The String for the Javascript side.

measure(name: Union[JsDataModel, str], start_mark: Optional[str] = None, end_mark: Optional[str] = None)

The measure() method creates a named timestamp in the browser’s performance entry buffer between marks, the navigation start time, or the current time.

When measuring between two marks, there is a start mark and end mark, respectively. The named timestamp is referred to as a measure.

Related Pages:

Parameters:
  • name (str) – A DOMString representing the name of the measure.

  • start_mark (Optional[str]) – Optional. A DOMString representing the name of the measure’s starting mark.

  • end_mark (Optional[str]) – Optional, A DOMString representing the name of the measure’s ending mark.

Returns:

Void, The String for the Javascript side

property now

The performance.now() method returns a DOMHighResTimeStamp, measured in milliseconds.

Usage:

var t0 = performance.now();

Related Pages:

Returns:

A Javascript Number

setResourceTimingBufferSize(max_size: int)

The setResourceTimingBufferSize() method sets the browser’s resource timing buffer size to the specified number of “resource” performance entry type objects.

Usage:

performance.setResourceTimingBufferSize(maxSize)

Related Pages:

Parameters:

max_size (int) – The buffer maximum size.

Returns:

Void, the String for the Javascript side.

toJSON()

The toJSON() method of the Performance interface is a standard serializer: it returns a JSON representation of the performance object’s properties.

Usage:

performance.toJSON()

Related Pages:

Returns:

A JSON object that is the serialization of the Performance object.