Hi! I have a problem, I need to use a webobject with my project, but my webobject needs some informations. So, I put them in variables in Storyline and now my problem is how I can give them in the query string like this : http://mywebobject.com/mysite.php?info1=VariableSL1&info2=VariableSL2 Do you have any idea? Thank you very much!

I'm not sure how this will behave but you may have some luck hijacking the same function the Storyline player uses to show a web object. Execute this within a JavaScript trigger and you should be able to control the loaded URL. Here's an example: OpenWebObject(1,"../../yourcontent.html",0,0,720,540,245,52); Here's the function from story.js. This describes the parameters: function OpenWebObject(strId, strUrl, nXPos, nYPos, nWidth, nHeight, nSlideXOffset, nSlideYOffset) The values above provide an offset for a sidebar display at the default width and height. You may need to play with these values to get it to work. You'll have problems with Web Objects in some browsers if your object target is cross browser. In your example above, you'd be able to employ storyline variables in your web object call something like this: var player=GetPlayer(); var VariableSL1=player.GetVar("SLVariable1"); var VariableSL2=player.GetVar("SLVariable2"); var customURL="http://mywebobject.com/mysite.php?info1="+VariableSL1+"&info2="+VariableSL2; OpenWebObject(1,customURL,0,0,720,540,245,52);

Hi, Maybe this wil help. I had some kind of issue when embedding Construct 2 created HTML5 games inside Storyline as Webobject. I wanted two way communications. When the game loads, it receives variables from Storyline. When the game ends, it sends variables to Storyline. This is what ended up working for me (warning, it needs some knowledge of scripting): 1. Create your own xxx.js file. This way you can keep stuff in one location. No mess. You can name it myfunctions.js or whatever. 2. In that xxx.js file create a function that will do the Storyline -> Webobject communcation.function getVariable(vName) { var player=GetPlayer(); var myVar = player.GetVar(vName); return myVar; } Then add another function that will do the Webobject -> Storyline communication: function setVariable(vName,vValue) { var player=GetPlayer(); var myVar = player.SetVar(vName,vValue); return myVar; } 3. In order to use these functions you need to include the xxx.js in the story.html and story_html5.html files: 4. So far you have the functions in the xxx.js file saved in the same folder as the modified story.html and story_html5.html. Now, you can call these functions from your embedded webobject. From your webobject (for me it's an HTML5 game) you can include a javascript call: vJSVar = parent.getVariable("myStorylineVar"); This, for example will call the function you added in the xxx.js file, which in returns provides the value of the myStorylineVar variable that you set up in Storyline. This could be any variable. To set a variable in Storyline from the webobject use: parent.setVariable("myStorylineVar",100); This would again, call the function above and set the myStorylineVar variable in Storyline to 100. 5. You can also set up conditional triggers in Storyline to watch variables changing and act on it. For example, in mine, I use a variable called "action'. When "action" changes Storyline does a conditional jump to various places, depending on the value of the variable. (For example, I set the "action" to "complete" and set "score" to the game score. Storyline monitors the change of "action" and jumps to a page where it shows my score.) I know it looks like a (speed) train of thought here but for those who are in the weeds with scripting, I hope it helps. If you don't know what all this means I can give you a simple example and you can play with that. Note: keep in mind a couple of things. This is more around iframes than Storyline iself but there are some restrictions around calling the "parent" javascript function from inside an iframe. If they are on the same domain and same protocol (http vs. https), you should be good.

Hi Jean, Thanks again for coming back I appreciate your help. I have found my issue with the help of a fresh set of eyes. It was a Case issue in the function I was using for setting. The 's' in 'SetVar' is lower case in Zsolts original post where I copied the function from. Everything works as it should now. Moral of the story, Always verify syntax and case in all code. :-) Thanks again and hopefully this helps others. Happy Friday! :-> Correct working syntax functions copied directly from my working JS file below: function getVariable(vName){ var player=GetPlayer(); var myVar = player.GetVar(vName); return myVar;} function setVariable(vName,vValue){var player=GetPlayer();var myVar = player.SetVar(vName,vValue);return myVar;}

Hi ! Thank you for your answer ! You talk about the frame.js, but I don't find the 'open_webobject()' you talked about. Is it the the frame.js in the "story_content" folder ? Or do you speak about the "storyline_compiled.js" in the mobile folder ? And I promise, if I do I let you know !

For future reference for others, you can do to it like this for html5. In the slide where the webobject exists, create a new Javascript that starts at the beginning of the timeline. The script below is my interpretation of how to solve the OP's problem: // Find and change the src part of the iframe (this will take the first webobject in the storyline, therefore [0]. If you want the second one, use [1], etc..var iFrameElem = document.getElementsByClassName('item webobject')[0]; var src = "http://mywebobject.com/mysite.php" var player = GetPlayer(); var var1 = player.GetVar("info1"); var var2 = player.GetVar("info2"); // Add together the finished url with querystrings var finishSrc = src + "?info1=" + var1 + "&info2=" + var2;iFrameElem.setAttribute('src', finishSrc);

WebObject and Storyline Variable | Articulate

AshleyT-Pollard
Staff
9 years ago
Hi Zsolt,

Thanks for sharing here. As for the notifications perhaps they were disabled within your profile? If you're set to auto-subscribe that'll include you on threads on which you've replied and then you can control each individual thread using the "subscribe" button at the top or access the subscriptions from your profile.
LeslieMcKerchie
Staff
9 years ago
Hi Richard! The last response from Zsolt on this thread was a while back and I'm not sure that he's still subscribed here. If you do not hear back soon, feel free to reach out to the user directly via the 'Contact Me' option on the user profile.
ZsoltOlah
Super Hero
9 years ago
Yes, the link is dead because I changed jobs since the post and my Inkling account was deleted. Unfortunately, it took all the session info with it...

So, I reposted just the integration package and the demo here:

http://bit.ly/2eZ80A1
LeslieMcKerchie
Staff
9 years ago
Thanks Zsolt :)
CdeTorres
Community Member
8 years ago
Is there a way to trigger different JavaScript elements depending on whether a course is being viewed with Flash or HTML5? How do we do this?
JohnBoulay
Community Member
8 years ago

Matthew Bibby

Something like this should do the trick Christian:

var player = GetPlayer();
if (/html5/.test(window.location.href)) {
player.SetVar("Output","HTML5");
} else {
player.SetVar("Output","Flash");
}

You'll need a text variable in Storyline called Output for this to work.

The JS will simply update that variable with either HTML5 or Flash, depending on which output is being viewed.

Very helpful html5 test Matthew, love simplified code, thanks!
LNoelJefferson
Community Member
4 years ago
I realize it has been some time since this last post, however, I'm still trying to get the above code to work. I found a storyline file that contained the the following script and it' works perfectly until you change the URL to something else. I've tried a number of different urls, but I'm not getting any of them to open. I can't even get https://www.articulate.com to open.

Ultimately, what I'm wanting to do is create a url by passing a a variable.

https://lab4.nog-oc.org/Variable1@netops.org/

I've tried everything with no luck. Anyone have any thoughts?

LaRhonda
javascript-web-object.story66 KB
Jean-Guy-Boulay
Community Member
4 years ago
I believe the function OpenWebObject was deprecated since "story.js" is no longer used.
You can target a web object (containing a transparent png) that you place in the story though.
I tried it out and it is loading with Jacqui Yoo's modified script (attached).

Alternatively, if you are feeling adventurous, you could create an iframe element dynamically and target its content window with your new URL. I've never done this with a full site, but I have done this with audio. I just don't know how it would impact the main storyline project.
javascript-web-object-embedded-sample.story98 KB
LNoelJefferson
Community Member
4 years ago
Jean-Guy,

Thanks so much for your response.

LaRhonda
KrisN
Community Member
4 years ago
Just be mindful - iFrames break a lot of security; and in some browsers, don't function as they once did (part of this has to do with stricter https enforcement, and disallowing the behaviour that iFrames allowed). iFrame's were always "a bad idea(tm)" -- its just that they provided a work around for many for such a long time.