# Settings API

Use the settings API to access the item settings in raw and interpolated formats. The item settings are defined in the ./settings.json file. You can access the item settings using the API methods in any Vue file of your project.

The settings API exposes its methods using this context:

this.$settings

# Usage

You can use the settings API methods to get the item settings: the template name and ID, localization, navigation, and other information from the ./settings.json file. Use the settings API methods with the this.$settings context in a Vue file: for example, a slide index.vue file or the App.vue file in emails, landing pages, and messenger ads.

# Methods

The following methods are available for the settings API.

Method Description
getRaw() Returns an object with the non-interpolated item settings stored in the ./settings.json file. If some settings are missing, the returned object is substituted with the default values.
get() Returns an object with the interpolated item settings. This means that all the placeholders for the field values are replaced with the actual values. The assetFileNameTemplate field is interpolated for the current slide where the settings method is invoked.
getByPath(keypath, options, defaultValue) Returns an object with the interpolated settings that are stored by the defined path. The options, and defaultValue parameters are optional.
getClmSettings(clmName) Returns an object with the settings of a specific target system.
getRawByPath(keypath, defaultValue) Returns an object with the non-interpolated settings that are stored by the defined path. The options and defaultValue parameters are optional.
setSettings()
getCurrentTheme() Returns the value for the current theme field in the ./settings.json file.
getCurrentScheme() Returns the value for the scheme field for the current theme in the ./settings.json file.

# Parameters

The following parameters are available for the settings API methods.

Parameter Type Description
clmName String The target system name. For example, iqvia.
keypath String The path to the settings in the ./settings.json file. For example, getByPath('navigation.swipe.slide.direction').
options Object Specifies the ID of the slide and chapter to interpolate their settings. This is usually used to interpolate the assetFileNameTemplate value.
defaultValue Any If the keypath doesn't have the setting, the value defined in the defaultValue parameter is returned.

# getRaw

The getRaw method returns the non-interpolated values (placeholders) from the ./settings.json file: you see the values exactly as they're in the repository.

this.$settings.getRaw()

# get

The get method returns the interpolated settings (actual values instead of placeholders) from the ./settings.json file.

this.$settings.get()

# getClmSettings

The getClmSettings method returns the object with the e-Detailer or messenger ad settings for the specified target system.

To get the settings for the specific target system, add the target system name as the parameter to the getClmSettings() method.

this.$settings.getClmSettings('clmName')

# Parameters of getClmSettings

The getClmSettings method has the following parameters.

Parameter Type Default Description
clmName String NA Optional parameter. Specify the target system to show its settings. For example, getClmSettings('irep').

# getByPath

The getByPath method returns the interpolated value for specified setting in your item from the settings.json file. Add the full path to this setting as the keypath parameter to the getByPath() method to show the field value.

this.$settings.getByPath('keypath')

# Parameters of getByPath

The getByPath method has the following parameters.

Parameter Type Default Description
keypath String NA Required parameter. Provide the full path to the setting in the settings.json file to show its value. For example, getByPath('navigation.swipe.slide.direction').
options Object {} Optional parameter. Use this parameter to redefine the slide and chapter ID to interpolate their values. The name and id fields are available for interpolation.
defaultValue String NA Optional parameter. If keypath refers to the setting that doesn't exist in the settings.json file, the value defined in the defaultValue parameter is returned. Use this parameter with the options parameter.

# Usage of options

Use the options parameter with the getByPath method to redefine the slide or chapter ID. The name and id fields are available for interpolation.

this.$settings.getByPath('clms.irep.assetFileNameTemplate', {
        slide: {
            id: 'home',
        },
        chapter: {
            id: 'home',
        }
    });

Use the defaultValue parameter to define the value for the setting that doesn't exist in the settings.json file.

this.$settings.getByPath('defaultValue')

Add the options parameter and enter the defaultValue parameter that you want to return if that value doesn't exist in the ./settings.json file.

this.$settings.getByPath('test.value', options, 'defaultValue')

# getRawByPath

The getRawByPath method returns the non-interpolated values (placeholders) for the specified setting in your item from the ./settings.json file. This method has the same parameters as the getByPath method.

this.$settings.getRawByPath('keypath', options, 'defaultValue')

# setSettings

The setSettings method updates the item settings values stored in the browser memory. The app uses the new values set by this method instead of the values in the project ./settings.json file during the current session in the browser.

this.$settings.setSettings(settingJson)

# Parameters of setSettings

The setSettings method has the following parameters.

Parameter Type Default Description
settingJson Object {} Required parameter. Redefine one or more values from the ./settings.json file at runtime.

# getCurrentTheme

The getCurrentTheme method returns the value for the current theme field in the ./settings.json file.

this.$settings.getCurrentTheme()

# getCurrentScheme

The getCurrentScheme method returns the value for the scheme field in the ./settings.json file. This is the color scheme for the current theme.

this.$settings.getCurrentScheme()

For more information, see settings API.

Last updated: 12/13/2022, 1:21:31 PM