Application

Utils

The Utils class provides helper functions for working with DOM elements.

findElementsByText

This function searches the HTML for elements with the specified innerText and returns the matching elements. If no rootElement is specified, the entire document is searched.

For example, the following code searches for elements with the innerText "Gmail" and hides the first matching element:

window.appnaviApi.utils.findElementsByText('Gmail')[0].style.display = 'none';

ANQuery

AppNavi provides its own distribution of jQuery. Through the anQuery implementation, selected jQuery functions are available to simplify DOM manipulation.

The following example uses anQuery to hide an element:

window.appnaviApi.anQuery('#gb > div > div:nth-child(1) > div > div:nth-child(1) > a').hide();

Application

The Application API provides methods for controlling AppNavi application and avatar behavior.

start :method

This method starts AppNavi within the specified selector. The optional delay parameter can be used to delay the start by a specified number of milliseconds.

Method Signature

start(configuration)

Arguments

The configuration object contains the following properties:

Code Sample

var configuration = {selector:'iFrame selector', delay:100};
window.appnaviApi.application.start(configuration);
console.log('AppNavi started in the selector: ' + configuration.selector);

setGuestUserId :method

This method specifies a unique identifier for a user. The identifier can be used to recognize returning users, for example, when tracking route progress or using training features.

An email address can be used as the unique identifier. The user ID cannot be overwritten when Enterprise Authentication is active.

Method Signature

setGuestUserId(configuration)

Arguments

The configuration object contains the following property:

Code Sample

var configuration = {userId:'85727577'};
window.appnaviApi.application.setGuestUserId(configuration);
console.log("User ID: ", configuration.userId);

setPreferredLanguage :method

This method sets the preferred content language and UI language for AppNavi. These preferences override the browser's language settings for AppNavi content and UI.

Method Signature

setPreferredLanguage(configuration)

Arguments

The configuration object contains the following properties:

Code Sample

var configuration = {contentLanguage:'de', uiLanguage:'de'};
window.appnaviApi.application.setPreferredLanguage(configuration);
console.log("Content language: ", configuration.contentLanguage);
console.log("UI language: ", configuration.uiLanguage);

hideAvatar :method

This method hides the AppNavi avatar.

The hideAvatar API only affects the visibility of the avatar. It does not disable other AppNavi functionality. Functions associated with the avatar, including functionality implemented through custom code, continue to run as usual.

Method Signature

hideAvatar()

Code Sample

window.setTimeout(function () {
    window.appnaviApi.application.hideAvatar();
    console.log("Avatar has been hidden");
});

showAvatar :method

This method displays the AppNavi avatar.

Method Signature

showAvatar()

Code Sample

window.appnaviApi.application.showAvatar();
console.log("Avatar displayed");

getCurrentApplicationId :method

This method returns the ID of the current application as a string.

Method Signature

getCurrentApplicationId()

Code Sample

var applicationId = window.appnaviApi.application.getCurrentApplicationId();
console.log('Application ID: ' + applicationId);

getCurrentApplication :method

This method returns the current application object.

Method Signature

getCurrentApplication()

Code Sample

var application = window.appnaviApi.application.getCurrentApplication();
console.log("Application: ", application);

getCurrentSubscriptionId :method

This method returns the ID of the current subscription.

Method Signature

getCurrentSubscriptionId()

Code Sample

var subscriptionId = window.appnaviApi.application.getCurrentSubscriptionId();
console.log('Subscription ID: ' + subscriptionId);

getApplicationContainer :method

This method returns the DOM parent object in which the AppNavi avatar is embedded. In the standard configuration, this is the DOM element with the global-an-container ID.

Method Signature

getApplicationContainer()

Code Sample

var appContainer = window.appnaviApi.application.getApplicationContainer();
console.log('Application Container: ' + appContainer);

setTargetAudienceConditions :method

This method defines the target audience for AppNavi content by applying labels. It can also be used to filter content using classic labels.

Method Signature

setTargetAudienceConditions(configuration)

Arguments

The configuration object contains the following property:

Code Sample

var configuration = {labels:['Administrator', 'Admin']};

window.appnaviApi.application.setTargetAudienceConditions(configuration);
console.log('Labels: ' + configuration.labels);

avatarLoad :event

This event is triggered when the AppNavi avatar has finished loading and is displayed in the interface.

Arguments

Code Sample

appnavi.event.register("an-avatarLoad", function(event){ 
    var eventDetails = event.detail;
    var detailObject = eventDetails.detail;
    console.log("Avatar loaded in application ID: " + detailObject.appId);
});

Custom Code for Identity Connect

After configuring OIDC, you can use the AppNavi Custom APIs to retrieve and verify profile information. These methods are available through the browser console.

Available Methods

JavaScript

await window.appnaviApi.identity.getToken();
// Returns the OIDC access token

await window.appnaviApi.identity.getAllClaims();
// Returns all available claims

await window.appnaviApi.identity.getClaim('email');
// Returns the value of the 'email' claim, for example, "[email protected]"

Warning: Step-level custom code can modify or skip live guidance. Test all affected routes and verify both successful and failure scenarios before deploying changes to customers.