Script

Learn about custom scripts needed for custom components.

With every custom component you create you must use a custom script. Files with custom scripts are specified in the action property of the UI configuration for a component.

Important: Custom script is executed inside the sandbox and does not have access to the DOM tree of the UI client, local storage, or any other parameters directly. However, there is a way to communicate with the UI client and execute different actions. To do this, you must use global object UI in your custom script and call async methods on this object.

General

{
                    "point":"com.reltio.plugins.ui.view",
                    "id":"com.reltio.plugins.entity.bbChartView",
                    "class":"com.reltio.plugins.ui.CustomActionView",
                    "caption":"B2B Integration",
                    "url":"https://cgraph-dev.reltio.com/custom-graph/bbChart?entityUri=",
                    "height":200,
                    "action":{
                    "files":[
                    "https://dl.dropboxusercontent.com/u/465285497/iframe.js"
                    ]
                    }
                    }

In this example, the API path and UI configuration of the current custom component is shown, and then two call alerts on the UI client.

`log`

UI.log(message);

This method allows a message to be logged.@param message {String|Object} log message

`setEnabled`

UI.setEnabled(value);

This method allows a change to the enabled state of control (must be used only with custom buttons).

@param value {Boolean} is enabled

`setVisibility`

UI.setVisibility(value);

This method allows a change in the visibility of the control state.

@param value {String} "visible" | "hidden" | "excluded"

`setHtml`

UI.setEnabled(value);

Set widget's internal HTML (can be used only with custom view).

@param html {String?} HTML

`setChildHtml`

UI.setChildHtml(id, html);

Set widget child's internal HTML (can be used only with custom view).@param id {String} widget child's id @param html {String?} HTML

`setHeight`

UI.setHeight(height);

Set widget's height (can be used only with custom buttons and views).@param height {Number?} height in pixels

`setWidth`

UI.setWidth(width);

Set widget's width (can be used only with custom buttons and views).@param height {Number?} width in pixels

`setToolTip`

UI.setEnabled(value);

Set widget's tooltip.

@param toolTip {String?} tool tip

`onAction`

UI.onAction(function(){
   //Some code
});

@deprecated: Use UI.onEvent(...) and listen for event "execute" instead.

The entry point of the script. When the all scripts are loaded, then the on action is invoked (can be used only with custom buttons and menu items/actions).

`onEvent`

UI.onEvent(function(type, data) {
  
});

The entry point of the script when a new event is thrown.

@param type {String} type of event

"execute": when you click a custom button or menu item. "data" is null.
"updateEntity": when a new entity is loaded from API. "data" is JSON of the entity.
"changeSearchQuery": when search criteria are changed. "data" is string with search query.
"changeVisibility": when visibility of custom component is changed. "data" is true or false.
"uiAction": when specified ui action occurs on DOM element of custom view. "data" is JSON: {type: uiAction, id: id, event: event}.
- uiAction: name of action ("click", "mousemove", "mousedown", etc.).
- id: id of target DOM element.
- event: clone of javascript event object.

@param data {String} additional data (see above)

`getEntityURI`

UI.getEntityUri().then(function(entityUri){
   //Code here
});

This method allows a get of the current entity uri.

`getEntity`

UI.getEntity().then(function(entity){
   //Code here
});

This method allows a get of the current entity.

`getApiPath`

UI.getApiPath().then(function(apiPath){
   //Code here
});

This method allows a get of the api path url.

`getSearchQuery`

UI.getApiPath().then(function(apiPath){
   //Code here
});

This method allows a get of the current search query.

`getTenant`

UI.getTenant().then(function(tenant){
   //Code here
});

The method allows a get of the current tenant name.

`getPerspective`

UI.getPerspective().then(function(perspective){
   //Code here
});

This method allows a get of the current perspective id.

`setPerspective`

UI.setPerspective(perspective).then(function(){
   //Code here
});

The method allows a set to the current perspective.@param perspective {String} perspective id

`setEntityUri`

UI.setEntityUri(entityUri).then(function(){
   //Code here
});

This method allows a set to the entity uri.@param entityUri {String} entity URI.

`api`

UI.api(url, method, tenant, headers, data).then(function(response){
   //Code here
});

This method allows a send of the api or external request. @param url {String} url. @param method {String?} request method: GET, POST, PUT, DELETE @param tenant {String?} tenant @param headers {Object?} headers @param data {Object|String?} request body

For example:UI.api('https://test.reltio.com/nui/version', 'GET')

`alert`

UI.alert(text).then(function(){
   //Code here
});

This method allows showing the alert box with text.

@param text {String} alert text

`confirm`

UI.confirm(text).then(function(response){
   //Code here
});

This method allows showing the confirm box with text.@param text {String} confirm text

`prompt`

UI.prompt(text,
defaultText).then(function(response){
   //Code here
});

This method allows showing the prompt box.

@param text {String} prompt text
           @param defaultText {String?} prompt default value

`getConfiguration`

UI.getConfiguration().then(function(jsonApiConfiguration){
   //Code here
});

Get metadata configuration.

`getUiConfiguration`

UI.getUiConfiguration().then(function(jsonUiConfiguration){
   //Code here
});

Get UI configuration of current custom component.

`openSearch`

UI.openSearch(searchState).then(function(){
   //Code here
});

Open search screen with some state.

@param searchState {Object?} search state json

Unify and manage your data

Script

General

`log`

`setEnabled`

`setVisibility`

`setHtml`

`setChildHtml`

`setHeight`

`setWidth`

`setToolTip`

`onAction`

`onEvent`

`getEntityURI`

`getEntity`

`getApiPath`

`getSearchQuery`

`getTenant`

`getPerspective`

`setPerspective`

`setEntityUri`

`api`

`alert`

`confirm`

`prompt`

`getConfiguration`

`getUiConfiguration`

`openSearch`

Footer