JavaScript Web API

Use the JavaScript Web API to add new participants, trigger referrals, get limited campaign data, get limited participant data, and open/close the GrowSurf window.

Getting started

Step 1: Make sure the GrowSurf Universal Code is installed

When you have the GrowSurf Universal Code installed on a webpage, that webpage has access to the JavaScript Web API, and you are ready for development. You can test this by entering growsurf.open() in your browser's Developer Console.

Note: The unique campaign ID that is set in your GrowSurf Universal Code is the campaign in which the GrowSurf JavaScript Web API will execute for. Click here for image

Testing in development? If you are testing on a development URL, you can add that URL to the whitelist in the Installation step of the Campaign Editor. Click here for image

grsfReady Event Listener

The GrowSurf Universal Code loads asynchronously, so if you intend on executing any growsurf functions on page load, you must wait until the library has completely loaded.

When loaded successfully, the GrowSurf Universal Code will dispatch a grsfReady event notifying any event listeners that it is ready for use. Only then will any GrowSurf JavaScript Web API functions work.

Example of using grsfReady

// Listen and wait for the Growsurf Universal Code to initialize
window.addEventListener('grsfReady', () => {
console.log('GrowSurf is Ready!');
// Your code goes here....
});

In some cases the GrowSurf Universal script may already be available and the grsfReady event may have already fired. This depends on how long it takes your scripts to load and can happen for various other reasons. If your grsfReadycallback isn't being invoked on thegrsfReady event we recommend you check to see if the growsurf script is already available before adding the event listener callback with a conditional like this...

// Check to see if GrowSurf is available
if(!growsurf) {
// Listen and wait for the Growsurf Universal Code to initialize
window.addEventListener('grsfReady', () => {
console.log('GrowSurf is Ready!');
// You code goes here....
});
} else {
console.log('GrowSurf is Already Available');
// You code goes here....
}

If you are executing growsurf functions not on page load, we recommend you wrap them in a conditional like this...

Example of using a conditional

// Check if the GrowSurf Universal Code is present
if (growsurf) {
// Then, open the GrowSurf window
growsurf.open();
}

Next steps

View our Tutorials for implementing JavaScript Web API methods, or view documentation: