Common

Common is a utility object available for import into Plugins/Widgets and Extensions. It is also accessible directly from the path window._genesys.widgets.common.

Common provides utility functions and dynamically generates common HTML Containers used throughout Genesys Widgets.

For all examples below, assume that _genesys.widgets.common has been stored in a local variable named 'Common'.

var Common = _genesys.widgets.common;

Common.Generate.Container({options})

Dynamically generates a new HTML Container in matching the style of Genesys Widgets with the selected components you request in your options object. Returns the generated container HTML as a jQuery wrapped set.

Arguments

'generic' or 'overlay'. Overlay containers have special CSS properties for appearing inside the Overlay widget. Default is 'generic'.

options.title

string

Title to apply to the container's titlebar area.

options.body

string or jQuery wrapped set

The HTML body you want the container to wrap.

options.icon

string

CSS Classname of icon to use.

options.controls

string

Select from a set of window control buttons to show at the top right. 'close' = Show only the close button. 'minimize' = Show only the minimize button. 'all' = Show both close and minimize buttons.

options.buttons

object

Options for displaying action buttons at the bottom of the container, such as OK and Cancel buttons.

options.buttons.type

string

Currently 'binary' is the only supported button set at this time. Additional sets and arrangements will be available in a later release. Please pass 'binary' as the type here if you wish to show typical 'accept' and 'dismiss' buttons.

Example

Arguments

Argument

Type

Description

options

object

Options for generating buttons, such as OK and Cancel buttons.

options.type

string

Currently 'binary' is the only supported button set at this time. Additional sets and arrangements will be available in a later release. Please pass 'binary' as the type here if you wish to show typical 'accept' and 'dismiss' buttons.

Common.config(object)

Configure some debug options for Common at runtime.

Example

'Enable full debug logging'

Common.config({debug:true, debugTimestamps:true});

Arguments

Argument

Type

Description

object

object

Supported options are 'debug' and 'debugTimestamps'. Setting debug to true will enable debug messages created by Common.log(). Setting debugTimestamps to true will add timestamps to the front of each debug message created by Common.log(). Default value for both is false.

Common.checkPath(object, path)

Check for the existence of a sub-property of an object at any depth. Returns the value of that property if found otherwise it returns false. Useful for checking configuration object paths without having to check each sub-property level individually.

Example

Arguments

An Object you want checked for a particular sub property at any depth.

path

string

The object path in dot notation you wish to search for.

Common.createPath(object, path, value)

Related to checkPath, createPath lets you specify a target object and path string but lets you create the path and set a value for it. This saves you the pain of defining each node in the path individually. All nodes in your path will be created as objects. Your final node, the property you are trying to create, will be whatever value you assign it.

Arguments

Choose the HTML TARGET attribute to apply to the generated links. Default is '_blank'. Set this option to 'self' to apply the target '_self' to the generated links.

Common.log(mixed, type)

Log something to the browser's console. When using Common.log, _genesys.main.debug must be set to true to see your logs. This allows you to add debug logging to your code without worrying about unwanted debug messages in production. If timestamps are enabled, they will be prefixed to all messages printed through Common.log.

Example

'Check the contents of window._genesys.main'

var Common = _genesys.widgets.common;
Common.log(window._genesys.main);if(!window._genesys.main){
Common.log('window._genesys.main is not defined','error');}

Arguments

Argument

Type

Description

mixed

Any

Any value or message you'd like to log.

type

string

You can specify the log type, such as 'log', 'debug' and 'error'. Default type is 'log'. Note, if your browser doesn't support the 'debug' or 'error' log type, use 'log' instead.

Common.sanitizeHTML(string)

Search for and escape < and > characters within a string. Returns transformed string. Useful for escaping HTML.

Arguments

Argument

Type

Description

string

string

Any string you want to be transformed.

Common.updateTemplateI18n(element, object)

Searches through an element's contents for i18n string elements to update with new strings. Used when updating the language in real-time. Works by searching for elements with the CSS classname 'i18n' and reading the custom attribute 'data-message' to match the string name in the language object. See example below.

Arguments

Argument

Type

Description

element

jQuery wrapped set

Element you want to search within to replace i18n strings.

object

Object of i18n Strings

The list of languages strings you want to update your UI with. This object comes from the App.i18n event or you can define your own custom object inline or using some other system. Object format is a simple name:value pair format. the 'data-message' attribute on your HTML element must match one of these property names to be updated.

Common.debugIcons

Returns the list of all the Icons with their names that Widgets support.

Example

'Fetch and Display list of icons present in Widgets'

Common.debugIcons()

Common.debug

Adds debug logs in to the browser's console. When using Common.debug, _genesys.main.debug must be set to true to see your logs. This allows you to add debug logging to your code without worrying about unwanted debug messages in production. If timestamps are enabled, they will be prefixed to all messages printed through Common.debug.

Example

'Check the File upload limits in WebChatService'

Common.debug(data_server_returned_file_limits);

Arguments

Argument

Type

Description

mixed

Any

Any value or message you'd like to add debug log. Note: This is only supported if your browser supports debug log type.

Common.error

Adds error logs in to the browser's console. When using Common.error, _genesys.main.debug must be set to true to see your logs. This allows you to add error logging to your code without worrying about unwanted error messages in production.

Example

'Logging error messages'

Common.error('A widget plugin did not receive the following config: ....');

Arguments

Argument

Type

Description

mixed

Any

Any value or message you'd like to add error log. Note: This is only supported if your browser supports error log type.

Common.populateAllPlaceholders

Adds place holder content to the input elements in a form with the given text strings.

Example

'Show placeholders strings in a form'

Common.populateAllPlaceholders($('#your_form'),{strings})

Arguments

Argument

Type

Description

Form Selector

jQuery DOM selector for a form

Form containing input elements. Note: Input elements should contain i18n class name and data attribute 'data-message-type' with value 'placeholder' for the place holder details to appear.

Key/Value pairs

object

Placeholder messages that needs to be displayed. This is an object with key-value pairs where, key should be equal to the 'data-message' attribute value of an input element and value can be any text that you would like to display.

Common.populateLanguageStrings

Adds the preferred language place holder text to the given input elements in a form.

Example

'Show placeholders strings in a form'

Common.populateLanguageStrings($('#your_form'),{strings})

Arguments

Argument

Type

Description

Form Selector

jQuery DOM selector for a form

Form containing input elements. Note: Input elements should contain i18n class name and data attribute 'data-message-type' with value 'placeholder' for the place holder details to appear.

Key/Value pairs

object

Placeholder messages that needs to be displayed. This is an object with key-value pairs where, key should be equal to the 'data-message' attribute value of an input element and value can be any text that you would like to display.

Common.populateIcons

Show all the Icons on a Widget.

Example

'Populate all Widget Icons'

Common.populateIcons($('#your_continer'));

Arguments

Argument

Type

Description

element

jQuery DOM selector

Specify the Widget container for which all the Icons have to be displayed.

Common.insertIcon

Adds an icon before the selected element.

Example

'Insert a check mark icon to an element you desire.'

Common.insertIcon($('#your_element'),'alert-checkmark')

Arguments

Argument

Type

Description

element

jQuery DOM selector

An html element to which Icon is to be displayed.

Icon name

string

Name of the Icon that you would like to display. Note: Refer to Common.debugIcons method to find out all the icons names that widgets supports.

Common.injectScript

Injects javascript code dynamically into widgets with the help of a script tag.