Prevent progression until inserted Web Object has been completed

As you guru's know, Storyline 3 is able to execute externally, i.e. user, generated JavaScript code. I know the commands for outputting the code to localStorage/sessionStorage and bringing it back in again. What I am having trouble with is transferring the exported variable value, via localStorage/sessionStorage, from one storyline generated web application to another, the former of which happens to be embedded, as a Web Object, into the latter.

The idea is to prevent the student from progression until the embedded web object, which happens to be a Storyline generated interactive animation, has been completed. I could build these animations.....there are a number of them, into the main project, but they work fine as web objects and the main project is already VERY large.

My plan was to set a variable value to 'true' in the animation project, inserted into the main project as a Web Object, when the animation has been completed, exporting it, via javascript and then transfer that variable value back into the main project via javascript using browser sessionStorage or localStorage. This variable would then used to trigger the change of state of a 'continue' button in the main project. The problem I have is that the values from the web object don't appear to reach localStorage/sessionStorage. It would need to work across all browsers, including Internet Explorer!

Any ideas how I can achieve this. Or can anyone think of an alternative method that doesn't involve building all the animations into the main project?

Thanks in advance.

13 Replies
Michael Anderson

Here's a very basic demonstration of this working. The pacman.story file has been published and then inserted into the Animation.story as a web object. Of course the pacman story.html was renamed to index,html first. You can see the javascript in the trigger in the pacman file that changes the variable in the Animation course.

Chris Clift

Hi Michale, I have implemented in the locally run project and it works brilliantly. Again thank you. I will be sending a version to the client shortly to test the LMS version and will keep you updated.

In the meantime, other than posting on the forum and using tutorials on general JavaScript use, do you know any resources specifically aimed at JavaScript inside Storyline?

Much appreciated


Chris Clift

Hi Michael, thanks for the links, I found them very informative. @Matthew and (if he catches this chain) @Zsolt, both of you have some very interesting tutorials which I am bound to look at for ideas on how to resolve some of the issues I come across.

However, picking up on this chain, the resolution kindly provided by Michael, using the parent.GetPlayer() script, works just as Michael said it would in Internet Explorer and, again, thank you for that Michael.....however in Google Chrome, which throws up the following error message in the Developer Tools:

app.min.js:3 actionator::exeJavaScript - Blocked a frame with origin "null" from accessing a cross-origin frame.

Which, when expanded, gives the following information:

(anonymous) @ app.min.js:3
(anonymous) @ app.min.js:3
o @ app.min.js:3
exeJavaScript @ app.min.js:3
c @ app.min.js:3
trigger @ app.min.js:3
triggerAction @ app.min.js:3
(anonymous) @ app.min.js:3
(anonymous) @ app.min.js:3
(anonymous) @ app.min.js:3
(anonymous) @ app.min.js:3
applyMethod @ app.min.js:3
executeAction @ app.min.js:3
executeActions @ app.min.js:3
(anonymous) @ app.min.js:3
forEach @ app.min.js:3
executeFilteredPlayerEvent @ app.min.js:3
t @ app.min.js:3
triggerEvent @ app.min.js:3
h @ app.min.js:3

I presume this is a security feature in browsers that, since IE is not w3 complient, ignores. My question is, is there a way to get the parent.GetPlayer() function to work in Chrome?

Chris Clift

Hi Michael. I had read somewhere that this was an issue with Chrome not allowing access unless it was hosted, however, unfortunately the client has requested that the CBT be run locally so hosting is not an option and, due to strict security issues, there isn't a hope in hell of getting them to install a local web hosting service to try and get round the issue. Any other thoughts would be gratefully received?

Michael Anderson

Some options that come to mind.

1. Modify the security settings in Chrome to allow the course to run normally.
2. Use a different browser like Firefox to view the course.
3. Install a web server on the local network to serve the course.
4. Modify the course in some way so that you are not using a web object.