Hooks

Hooks

The lpTag handles the interfere of many events that occur on the vistor's webpage by executing a callback.

These tag hooks provide transparency into the lifecycle flows of engagements, embeddeded chat windows, and cobrowse sessions, among others.

Below you can find a list of hooks available on a web page by the Web Tag, each organized under a given eventName.

Definition

Hook callback parameters: The “hook” function will get always one object:

Hook callback return parameters: The “hook” function MUST return always one object — if the “hook” returns non-object parameter, the executor will ignore the returned parameter and will take the previous one.

Execute order: The hooks will be executed by the order they were “pushed”.

If param1 was changed on hook1, hook2 will get param1 after the change.

Valid hook

function _hookCallback_(options){
  return options;
}

Invalid hooks

function hookCallback(option1, option2){
  return option1;
}

function hookCallback(options){
  return null;
}

function hookCallback(options){
  return "some string";
}

Limitations

• The customers need to make sure to integrate properly and to not cause bugs / edge cases
• Hooks will not be executed on external window. In the future when taglet “scope” will be supported, hooks will be supported only if the hook is inside a site taglet.

Register to hook

lpTag.hooks = lpTag.hooks || [];

lpTag.hooks.push({
  name: "BEFORE_SURVEY_SUBMIT",
  callback: function (options) {
    options.data.answers = "masking answer";
    return options;
  }
 });

lpTag.hooks.push({
  name: "BEFORE_SURVEY_SUBMIT",
  callback: function (options) {
    options.data.answers = "masking the masked answer";
    return options;
  }
});

Places

SMT

NAME: BEFORE_SUBMIT_SDE

Use case: SDE submit.

Interference: change / prevent sending SDE data before it's sent to server (push and send flows)

Place: TBD

Timing: Before

Parameters: TBD

Rendering

NAME: BEFORE_ENG_DISPLAY

Use case: Change engagement state / click target / display / etc.

Interference: Change engagement configuration before engagement display.

Place: rendererStub.js → engagement.createInstance

Timing: Before

Parameters: TBD

NAME: BEFORE_ENG_CHANNEL_OPEN

Use case: Open the content (window / target) in different way.

Interference: The flow after engagement click.

Place:

baseOffer.js → click → _openChannel

Timing: Before

Parameters: TBD

Unified Window

NAME: AFTER_GET_SURVEY

Use case: Change pre-chat / post-chat / offline survey data structure or fill in part of the answers

Interference: Pre-chat / post-chat / offline survey data before rendering the view

Timing: After

Parameters:

{
  "data": {
    "surveyType": surveyType,
    "surveyData": surveyData
  }
}

{
   "header":"",
   "id":1058794,
   "questions":{
      "question":[
         {
            "type":"Text Field",
            "validationType":"alpha_numeric",
            "id":5567213,
            "logicId":2,
            "order":0,
            "mandatory":true,
            "label":"From Name:",
            "lastKnownValue":""
         }
      ]
   }
}

NAME: BEFORE_SUBMIT_SURVEY

Use case: Change answers

Interference: Pre-chat / post-chat / offline survey answers before submit

Timing: Before

Parameters:

{
   "data": {
     "surveyType": offlineSurvey/ preChatSurvey / postChatSurvey,
     "questionsInfo": questionInfo,
     "surveyData": surveyData
  }
}

Array of Object — Data structure

[{
   "type":"Text Field",
   "validationType":"alpha_numeric",
   "id":5567213,
   "logicId":2,
   "order":0,
   "mandatory":true,
   "label":"From Name:",
   "lastKnownValue":"asf"
}]

surveyData — Data structure

{
   "survey":{
      "id":1058794,
      "question":[
         {
            "id":5567213,
            "answer":"asf"
         },
         {
            "id":5567214,
            "answer":"sadf@asf.con"
         },
         {
            "id":5567217,
            "answer":"asdf"
         }
      ]
   }
}

NAME: BEFORE_SEND_VISITOR_LINE

Use case: Change / prevent visitor lines on chat

Interference: Visitor lines text

Place:

TrabscriptManager.js → sendLine

Timing: Before

Parameters:

{
  "data": {
    "line": line
  }
}

{
   "text":"Can you help me?"
}

NAME: AFTER_GET_LINES

Use case: Change / prevent agent lines (e.g. change the look&feel of co-browse invitation)

Interference: All lines presented on visitor side only

Timing: After

Parameters:

{
  "data": {
    "lines": lines
  }
}

[
   {
      "@id":"4",
      "@type":"line",
      "time":"2017-03-02T11:51:02.545+02:00",
      "textType":"html",
      "text":"<div dir=\"ltr\" style=\"direction: ltr; text-align: left;\">how are you?</div>",
      "by":"margalitb@liveperson.com",
      "source":"agent",
      "subType":"REGULAR",
      "type":"line",
      "localId":2
   }
]

NAME: ON_ADD_TO_CART

Use case: Allows brands to hook into the add to cart process to customize or modify the behavior of adding items to the cart.

Interference: Occurs when a customer clicks on a button in order to add items to the cart.

Timing: On adding items to the cart.

Parameters:

{
  "data": {
    "type": "addToCart",
    "items": [
      {
        "productId": productId,
        "quantity": quantity
      }
    ]
  }
}