Web Template Display Utilities
DisplayUtils is a set of utility functions built with SPA handling in mind that provides page behavior APIs, including page exit intention, page inactivity, page scroll, visible elements, and loaded elements watcher.
All methods
-
Bind with an ID so that later one can unbind listeners/observers with the same ID whenever they want.
-
rebinding with same ID unbinds the previous binding and sets the new unbind method to the ID.
-
if using
bind()
alone, it generates IDs based on function name and selector -
if there are no
bind()
methods used, it generates a random ID-
SalesforceInteractions
namespace -
Evergage
namespace
-
-
-
unbind with an ID to cancel listeners/observers
-
SalesforceInteractions
namespace -
Evergage
namespace
-
-
getBindings
gets all IDs with their unbinding methods-
SalesforceInteractions
namespace -
Evergage
namespace
-
-
clearBindings
goes through each known binding and unbinds them all-
SalesforceInteractions
namespace -
Evergage
namespace
-
-
Triggers resolve functions when the provided percentage of a target node is in the viewport
-
Defaults to firing when at least 1 pixel of the target is visible.
-
Only trigger one time
-
No IE support because it requires Intersection Observer API.
-
entry
is the data when element is visible -
Error "[pageElementVisible] Invalid arguments":
-
selector is not a string
-
typeof
percentage is not “number” -
Percentage less than zero
-
Percentage greater than one
-
SalesforceInteractions
namespace -
Evergage
namespace
-
-
While Personalization web templates are based on responsive HTML that supports displaying web campaigns on mobile devices, the pageExit
utility does not detect exit intent on mobile devices since it depends on listening for mouse move events on a page.
-
Triggers resolve function when the cursor leaves the bounds of the body from the top of the page with/without a delay. If more mouse movement is detected in the body within the delay period after leaving the window, the exit intent detection delay is cleared, but the event listener is not removed.
-
Default to a 0 millisecond delay (which also means no delay).
-
Listening for the
mousemove
event. -
Only trigger one time.
-
event
is themousemove
event when mouse leaves the page -
Error "[pageExit] Invalid arguments":
-
typeof delay
is not a number -
delay
is less than 0 -
SalesforceInteractions
namespace -
Evergage
namespace
-
-
-
Triggers a resolve function when no user activity within the document after
ms
milliseconds.-
Any
mousemove
,click
,scroll
,keyup
, andkeydown
events in the document resets the inactivity timer. -
Using
.then
only trigger one time -
Using
.subscribe
continues to trigger on inactivity.- To discontinue, please call
event.disconnect
- To discontinue, please call
-
event
is the last event that triggers inactive.- Event types:
mousemove
,click
,scroll
,keyup
,keydown
- Event types:
-
Error "[pageInactive] Invalid arguments":
-
typeof ms
is not a number -
ms
is less than or equal to 0 -
SalesforceInteractions
namespace -
Evergage
namespace
-
-
-
Triggers resolve function when user scroll pass provided page percentage.
-
percentage
is expected to be in decimal form. -
Only trigger one time.
-
Be careful for dynamic height pages.
-
There is no detection on page scrolling direction so it triggers either from top to bottom or bottom to top.
-
event
is the scroll event when scrolling passed percentage. -
Error "[pageScroll] Invalid arguments":
-
typeof percentage
is not a number -
percentage
is less than 0 -
percentage
is greater than 1 -
SalesforceInteractions
namespace -
Evergage
namespace
-
-
-
Triggers when element is loaded on page.
-
Choose
observerSelector
wisely to avoid performance issues. -
Use Mutation Observer to watch added nodes.
-
Only trigger one time.
-
element
is the target element that loaded. -
Error "[pageElementLoaded] Invalid arguments":
targetSelector
must be a non-empty stringobserverSelector
must be a non-empty string
- If no
observerSelector
is specified, thepageElementLoaded
function binds a listener to thebody
orhtml
element and waits for thetargetSelector
to be added as a descendant. - Ensure that the
observerSelector
configured in thepageElementLoaded
function is available on the page when running a campaign.
-
SalesforceInteractions
namespace -
Evergage
namespace
-