JavaScript in Captivate 9 Project not Executing

[patrickv26253632]

I have tried for hours to get some JavaScript inside of an Adobe Captivate 9 project (published as SWF and HTML5), deployed to a public web server, to execute. To aid in troubleshooting, I've wrapped various steps of the script with console.log("status");, and even those aren't executing.

A demo project file is located here: https://dl.dropboxusercontent.com/u/6787201/Test%20Interaction%20Data%20HTML5/Test-Interaction-Data....

If you look at the JavaScript window, you'll notice there's a function call to sendInteractionData();

That's a custom function I wrote to fire off the data in various Captivate variables to a Google Spreadsheet. It is contained in the index.html page that I modify after publication. I've tested this function and it works when the values are explicitly defined and sendInteractionData() is called from a static web site... but when it's embedded in the Captivate JavaScript, no luck.

If you're interested, here's the code I insert to support the sendInteractionData() function:

// Setup section

// Paste the URL to the WEB SERVICE (obtained after running command PUBLISH > DEPLOY AS WEB APP) in the variable below!

var WebServiceURL = "mywebserviceurl";

// Do not edit below this line unless you intend to change the inner-workings of the script

// Declare some variables

var FirstName;

var LastName;

var Email;

var Attribute;

// Function to send the interaction data to the Google Spreadsheet. This function should be called by the Captivate Player AFTER setting the variables above.

function sendInteractionData() {

    // Get and set the pertinent data from the Captivate Player

    FirstName = window.cpAPIInterface.getVariableValue('cpFirstName');

    LastName = window.cpAPIInterface.getVariableValue('cpLastName');

    Email = window.cpAPIInterface.getVariableValue('cpEmail');

    Attribute = window.cpAPIInterface.getVariableValue('cpAttribute');

    // Send the data to the Google Sheet via AJAX call

     request = $.ajax({

        url: WebServiceURL,

        type: "post",

        data: "FirstName="+FirstName+"&LastName="+LastName+"&Email="+Email+"&Attribute="+Attribute

    });

      // Callback handler that will be called on success

    request.done(function (response, textStatus, jqXHR){

        // Log a message to the console

        console.log("Wrote interaction data to Sheet: FirstName="+FirstName+"&LastName="+LastName+"&Email="+Email+"&Attribute="+Attribute+"// Message: Success!");

    });

    // Callback handler that will be called on failure

    request.fail(function (jqXHR, textStatus, errorThrown){

        // Log the error to the console

        console.error(

            "The interaction data could not be saved: FirstName="+FirstName+"&LastName="+LastName+"&Email="+Email+"&Attribute="+Attribute+"// The following error occurred: "+

            textStatus, errorThrown

    );

    });

}

PS - reporting to a Google Spreadsheet really ought to be standard functionality by now...

Thanks for your help.

[patrickv26253632]

Update: I've tried going at this the other way around, by using the cpAPIEventEmitter. Guess what? It doesn't work either.

I added this line to my published HTML page:

// Add Event Listener

window.cpAPIEventEmitter.addEventListener("CPAPI_VARIABLEVALUECHANGED",sendInteractionData(),"cpAttribute");

When I open the eLearning with the JavaScript console, this error appears:

Test Interaction Data.htm:25 Uncaught TypeError: Cannot read property 'addEventListener' of undefined

Has anyone actually successfully used this API?

[Lilybiri]

Was the API already loaded when you executed that script?

[patrickv26253632]

Hi Lilybiri,

I believe it's loaded. In the Developer Console, when I click Sources, I see standard.js is in the list. I also tried moving the script to the end to give everything a chance to load, and still get the same error "Test Interaction Data.htm:66 Uncaught TypeError: Cannot read property 'addEventListener' of undefined"

[TLCMediaDesign · Accepted solution]

You really should use the module ready event listener attached to the window to ensure the API is present.

var interfaceObj, eventEmitterObj;

window.addEventListener( 'moduleReadyEvent', function ( e )
{
interfaceObj = e.Data;
eventEmitterObj = interfaceObj.getEventEmitter();
initializeEventListeners();
});

function initializeEventListeners()

{

if ( interfaceObj )

{

     if ( eventEmitterObj )

  {

         window.cpAPIEventEmitter.addEventListener( 'CPAPI_VARIABLEVALUECHANGED', function ()

   {

    sendInteractionData(); }, 'cpAttribute'

   );

  }

}

}

[patrickv26253632]

TLCMediaDesign,

Sincere THANK YOU for identifying that we have to wait for the API to be present!! It works!

[Lilybiri]

That is what I suggested, but David can help you much better with JS.