CP9 - How can I access external Javascript?

Report · May 23, 2017

CP9

HTML5 output only

Hello,

I have never tried using external Javascript files, but I thought it was about time I at least understand them.

Unfortunately my attempts have failed and I need help please.

I have created a file name my_java.js and stored it in C:\Program Files\Adobe\Adobe Captivate 9 x64\HTML\assets\my_java.js

The my_java.js contains the code:

function my_fun(my_message) {

alert(my_message);

}

I edited the index.html file at C:\Program Files\Adobe\Adobe Captivate 9 x64\HTML\index.html

I have no idea where to put the reference to the my_java.js so I added it to this line:

var lJSFiles = [ 'assets/js/my_java.js','assets/js/jquery-1.11.3.min.js','assets/js/CPM.js','assets/playbar/playbarScript.js' ];

In Captivate I have made a button to Excecute Javascript and put in this text:

my_fun("hello");

I have saved and published the project and the my_java.js appears in the assets, and the index.html has the reference to it.

Unfortunately when I view the project it just shows a spinning circle and progresses no further.

I would really appreciate and help.

Thank you

Peter.

Report · May 23, 2017

Solved.

Report · May 24, 2017

I just could not find a guide on how to use an external library of custom JavaScript functions, there must be one somewhere, but it eluded me.

This is what I eventually came up with, I hope it helps anyone else.

Step 1

Make a file of java code called my_java_code.js containing functions.

function my_alert(my_message)

{

alert(my_message);

}

function my_print()

{

window.print();

}

Step 2

Make a folder called my_library at the root of your website.

Put my_java_code.js in the library folder.

C:\xampp\htdocs\my_library\my_java_code.js

(This path will be different on your own systems)

Step 3

Edit the index.html file in the Captivate installation to include a reference to the library.

Put the reference just above the </head> marker.

(Make a backup of the index.html before editing)

C:\Program Files\Adobe\Adobe Captivate 9 x64\HTML\index.html

</script>

</head>

Step 4

In a Captivate project make a button and use the Execute Javascript option.

In the Script Window type the function to use, such as:

my_alert(“Hello”);

Step 5

Publish project an press the button…. The java will run.

Good luck.

Peter

Report · Feb 22, 2018

I've followed step by step your procedure, but still it isn't working. How could it be?

I'm using Captivate 2017 and uploading the SCORM in Moodle.

I tried with my functions but still nothing happens, with your function but nothing again.

The only thing that is different from you is the address where I put the file.js because of my website.

I need your help!!

Report · Mar 26, 2018

Is there a way to send a captivate variable into that JS file and vise versa? If so how should it be initialized in both the JS file and Captivate?

Report · Mar 26, 2018

You will want to pick one place for it to be initialized and set the value in the other place by calling a function. You can set the initial value in your captivate file and create a function set_my_value(item, value) in the JS file. Then use the 'Execute JavaScript' action in the 'On Enter:' action for the first slide to call that function and pass in the value from the Cp lesson. In the JavaScript you could use a switch to find the correct variable to set. It would be simpler to set up but would be limited. A dictionary of items that map things by name might be better.

OTOH, if you need to set the value in the JavaScript, for instance if you're reading it from a SQL DB, then you would trigger the JavaScript at the appropriate time (perhaps when the page loads) and when the value is ready you use the JavaScript API to set the value... window.cpAPIInterface.setVariableValue("varname", "value"); See common-js-interface

HTH, Mike

Report · Mar 26, 2018

I managed to embed my jquery into a "Execute JavaScript" within Captivate. This allowed me to talk easily between the variables....

Report · Mar 26, 2018

Captivates variable are in the window object, so they are very easy to access from within Captivate or from an external JS file.

window.cpVariableName

window.yourJSVariable.

If your JS variables are in the window also, they both can be read exactly the same way. If they are in some king of local scope of a function, you will need to get them and return them with a function call.

Report · Mar 26, 2018

Hi,

I'm not sure if you found your solution yet but here are a couple things you can try. Get a copy of the content from moodle or publish it locally and check to make sure that your <script ... /> statement got published. Start the lesson and open the dev tools (F12 in Chrome or IE). Check the console to see if something happened that was output to the window... function undefined error message perhaps. Try to run the function right from the console.... just type the function name next to the > in the console and see if responds with an error message.

HTH, Mike

CP9 - How can I access external Javascript?

1 Correct answer