Sentiment and Guidance Implementation

This topic explains the solution implementation for displaying the sentiment and guidance information on the callout. These two sections share most of their implementation.

The Sentiment section of the Enlighten callout displays the overall sentiment score on a dial. The color division of the dial range is specified by setting the values of properties of the CustomerDefined variable.

The Guidance Scores section indicates the current score for all Enlighten models for the current call, using color-coded bars.

Variables Used

Sentiment and Guidance

The table below describes all variables used for the preparation and display of sentiment and guidance information. They are listed approximately in the order in which they are used in the solution.

Variable

Property

Description
EventTriggers   Stores the last time at which an RTIG event was received, for debugging purposes only.
  RTIGUpdateInfo The last time at which the OnEnlightenUpdateReceived event handler was triggered.
NewRTIGUpdateInfo   Stores the contents of the RTIG Update Info parameter of the last Enlighten Update Received event received.
  Enlighten Results A list of all Enlighten models and their scores.
EnlightenModelScore   Stores the model name and score of a single Enlighten model. This variable is used in a For-Each loop to build the list ListOfEnlightenModelScore.
  Model The Enlighten model name.
  Score The Enlighten model score.
ListOfEnlightenModelScore   A list of the names and scores of all Enlighten models.

Sentiment

The table below describes all variables used for the preparation and display of sentiment information only. They are listed approximately in the order in which they are used in the solution.

Variable

Property

Description
JS_Sentiment   Stores Javascript for displaying sentiment information the callout.
  JS_Needle The Javascript that will be injected into the Enlighten callout to display the needle at the correct angle based on the sentiment score.
ForTesting   Stores variable values for debugging purposes only.
  TestOverallScoreJS The Javascript that will be injected into the Enlighten callout to display the needle at the correct angle based on the sentiment score.
CustomerDefined   Includes properties for customizing the display and behavior of the callout.
  AutoExpandSentiment If set to Yes, the Sentiment section will be expanded automatically if the needle position changes from one rating color range to another.
SentimentColor   Stores the current and previous rating color positions of the needle on the Sentiment dial, used for determining whether to automatically expand the Overall Sentiment section.
  SentimentColorCurrent The rating color range to which the needle points now.
  SentimentColorPrior The rating color range to which the needle pointed before the last Enlighten Update Received event was received.

Guidance

The table below describes all variables used for the preparation and display of guidance information only.

Variable

Property

Description
GuidanceScoreTranslated   Stores data for a single Enlighten model. Used for constructing the Javascript to inject into the callout to display the bar for the model.
  Percent The score of the model converted to a percent and rounded to the nearest 10%.
  RoundedScore The score of the model, rounded to a single decimal place.
  RedYellowGreen The name of the color for the bar.
  GuidanceScoreClass A string that combines hard-coded text and the values of the RedYellowGreen and Percent properties, used to construct the Javascript for the bar for a particular Enlighten model.

Event Handlers Used

Sentiment and Guidance

The table below describes all the event handlers used for the preparation and display of sentiment and guidance information.

Event Handler

Description
OnEnlightenUpdateReceived Triggered when an Enlighten Update Received event is received. Builds a list of details of Enlightenment scores for all models called ListOfEnlightenModelScore.
OnChange_EnlightenModelScoreList Triggered when the length of the list ListOfEnlightenModelScore changes. Sends that list to the function fxEnlightenModelScore_List.

Functions Used

Sentiment and Guidance

The table below describes all the user-defined functions used for the preparation and display of sentiment and guidance information. They are listed approximately in the order in which they are used in the solution.

Function

Description
fxEnlightenModelScore_List Cycles through the list of models and scores (ListOfEnlightenModelScore). For each model, sends the model name and score either to fxEnlighten_Sentiment (if the model is Sentiment) or fxEnlightenModelScore_Guidance (for any other model).
fxEnlighten_Color Receives the score for a single Enlighten model and returns the name of the rating color (Green/Yellow/Red) to which the score corresponds.

Sentiment

The table below describes all the user-defined functions used for the preparation and display of sentiment information only.

Function

Description
fxEnlighten_Sentiment Receives the score for the sentiment model and constructs and injects Javascript into the callout to display the needle in the Overall Sentiment section of the callout at the correct angle. Also expands that section if the needle position changes from one rating color range to another.

Guidance

The table below describes all the user-defined functions used for the preparation and display of guidance information only.

Function

Description
fxEnlightenModelScore_Guidance Receives the name and score of a single Enlighten model (except for Sentiment) and constructs and injects Javascript into the callout to display the Guidance bar for that particular model.
fxEnlightenRoundedScore Receives the score for a single Enlighten model and returns the score as a percentage rounded to the closest 10%, used for setting the length of the bar for the model in the Guidance section.

Process Summary

Sentiment

The graphic below illustrates the workflow for updating the Overall Sentiment section of the callout.

OR

View full size in new tab

Guidance

The graphic below illustrates the workflow for updating the Guidance Scores section of the callout.

OR

View full size in new tab

Process Details

A detailed explanation of how the solution is implemented is provided below. The process is presented according to the order of the flow and is divided by solution component.

Sentiment and Guidance

The parts of the process common for both Sentiment and Guidance are detailed below.

A: Event Handler: OnEnlightenUpdateReceived

  1. An Enlighten Update Received event is received.

  2. The OnEnlightenUpdateReceived event handler is triggered.

  3. The date and time at which the event handler was triggered are stored in the RTIGUpdateInfo property of the EventTriggers variable. This variable is used for debugging only.

  4. The contents of the event parameter, RTIG Upload Info, are copied to the NewRTIGUpdateInfo variable.

    The NewRTIGUpdateInfo variable now includes a property called Enlighten Results, which stores a list of all Enlighten models (e.g Sentiment, Acknowledge Loyalty, Speech Velocity, etc.) and their scores.

  5. The event handler cycles through all the Enlighten results. Each model-score pair is written to the variable EnglightenModelScore which is then added to a list variable ListOfEnlightenModelScore.

B: Event Handler: OnChange_EnlightenModelScoreList

  1. This event handler is triggered when the number of elements in the list variable ListOfEnlightenModelScore changes.

  2. If the list ListOfEnlightenModelScore is not empty, the list is sent to the function fxEnlightenModelScore_List as its only input.

C: User-Defined Function: fxEnlightenModelScore_List

  1. This function receives the list ListOfEnlightenModelScore as its only input.

  2. The function cycles through the list of model-score pairs in the list received.

    If the model is:

    • Sentiment, the score is sent to the function fxEnlighten_Sentiment.

    • Anything else, the model div name (the model name set to lower case and with spaces removed) and score are sent to the function fxEnlightenModelScore_Guidance. The div name corresponds to the name of the div tag in the callout HTML and is used later when constructing the Javascript to inject into the callout.

    The resulting model div names are listed in the table below.

    Model Name

    DIV Name
    Acknowledge Loyalty acknowledgeloyalty
    Active Listening activelistening
    Be Empathetic beempathetic
    Build Rapport buildrapport
    Demonstrate Ownership demonstrateownership
    Effective Questioning effectivequestioning
    Inappropriate Action inappropriateaction
    Interruption interruption
    Promote Self Service promoteselfservice
    Set Expectations setexpectations
    Speech Velocity speechvelocity

D: Event Handler: OnChange_EnlightenModelScoreList - Continued

  1. Once the function fxEnlightenModelScore_List has completed, the list ListOfEnlightenModelScore is cleared.

G: User-Defined Function: fxEnlighten_Color

  1. This function receives the current sentiment score as its only input. This function is used in both the Sentiment and Guidance flows (called by the functions fxEnlighten_Sentiment and fxEnlightenModelScore_Guidance respectively).

  2. The function returns the text:

    • Red if the sentiment score is less than the value of the property ScoreNegative_LessThanOrEqualTo of the variable CustomerDefined.

    • Green if the sentiment score is more than the value of the property ScorePositive_GreaterThanOrEqualTo of the variable CustomerDefined.

    • Yellow otherwise.

Sentiment Only

The parts of the process specific to Sentiment only are detailed below.

E: User-Defined Function: fxEnlighten_Sentiment

  1. The function receives the sentiment score as its only input.

  2. The property JS_Needle of the variable JS_Sentiment, is cleared. This property stores the Javascript that will be injected into the Enlighten callout to display the needle at the correct angle based on the sentiment score.

  3. The Javascript for displaying the needle is constructed using hard-coded text and the value of the sentiment score provided to this function.

    An example of the constructed Javascript is shown below:

    document.querySelector("#OverallScoreMeter_Needle").setAttribute("style", "transform: rotate(" + (((23* 180) / 100)) + "deg)");

  4. The Javascript constructed is stored in the TestOverallScoreJS property of the ForTesting variable, for debugging purposes only.

  5. The Javascript constructed is injected into the Enlighten callout.

  6. The function then checks whether the AutoExpandSentiment property of the variable CustomerDefined is set to Yes, indicating that the Sentiment section of the callout should be expanded automatically (if collapsed) when the needle position changes from one color band to another.

    If it is set to Yes:

    • The value of the SentimentColorCurrent property of the SentimentColor variable is written to the SentimentColorPrior property.

    • The value of the SentimentColorCurrent property is updated based on the current sentiment score. The current sentiment score is sent to the function fxEnlighten_Color which returns the name of the color to which the current sentiment score corresponds.

    • The two properties SentimentColorCurrent and SentimentColorPrior are compared. If they are different, meaning that the needle now points to a different color than before, the Javascript function OverallScoreDown is executed in the callout to expand the Sentiment section.

    The OverallScoreDown function in the callout body is shown below.

    function OverallScoreDown(){
    $( "#TriRightOverallScore" ).hide();
    $( "#TriDownOverallScore" ).show();
    $( "#divOverallScoreContent" ).show();
    VisibleOverallScore = "Yes";
    AnyExpanded(); }

    The AnyExpanded function called by the OverallScoreDown function is shown below.

    function AnyExpanded(){
    if(VisibleGuidanceScore =="Yes" || VisibleOverallScore =="Yes" || VisibleAlerts =="Yes")
    {
    $( "#divNEVAImage" ).hide();
    }
    else{$( "#divNEVAImage" ).show();
    }}

Guidance Only

The parts of the process specific to Guidance only are detailed below.

E: User-Defined Function: fxEnlightenModelScore_Guidance

  1. The function receives two inputs. The parameter pEnlightenModelScore is of a complex type and includes the name and score for a single Enlighten model. The parameter pModelDivName is a standardized version of the model name (lower case and without spaces) for use within Javascript.

  2. The color to apply the model's guidance bar is determined based on the model's score. The model's score is sent to the function fxEnlighten_Color which returns the color name. That is stored in the RedYellowGreen property of the GuidanceScoreTranslated variable.

  3. The model score is then converted to a percentage value by sending the score value to the function fxEnlightenRoundedScore. The value received in return is written to the Percent property of the GuidanceScoreTranslated variable.

  4. The GuidanceScoreClass property of the GuidanceScoreTranslated variable is then populated by concatenating hard-coded text with the value of the YellowGreenRed property and the Percent property (converted to text). The resulting string will be used to construct the Javascript for displaying the guidance score bar for the particular Enlighten model in the callout.

  5. The Javascript for displaying the guidance score bar for the particular Enlighten model in the callout is then constructed and injected into the callout. The Javascript is constructed by concatenating hard-coded text with the model div name and GuidanceScoreClass properties of the GuidanceScoreTranslated variable.

    An example of the constructed Javascript is shown below:

    $("#acknowledgeloyalty").attr("class", "GuidanceScoreScore GuidanceScoreGreen GuidanceScore90");

F: User-Defined Function: fxEnlighten_RoundedScore

  1. The function receives the score for a single model as its only input.

  2. The value received is rounded to a single decimal place and is written to the RoundedScore property of the GuidanceScoreTranslated variable.

  3. The value of the RoundedScore property of the GuidanceScoreTranslated variable is multiplied by 100 and converted to a number. It is then returned to the fxEnlightenModelScore_Guidance function.