Has anyone been able to create an onscreen link to a webpage whose URL is held in a variable? I can't get my javascript to work.
My current attempt goes like this:
var player = GetPlayer(); var url = player.getVar("google"); // google is a text variable containing "http://www.google.com" var win = window.open(url)
For more posterity, the reason to do this is so I can store external URLs in a .js file, allowing them to be changed post-deployment without republishing the course. On the first page of the course I populate the Storyline variables with the strings held in the .js file.
I understand that this is a very old thread and I am not sure if Martin or Kamil see this post. But I thought they might be still around or one of the heroes could help on this.
I am trying to do the same thing that Martin was going to do: store URLs as variables in a .js file and import them to Storyline. I have created an Execute JavaScript trigger, like Martin's:
var player = GetPlayer(); var url = player.GetVar("Lecture1"); var win = window.open(url);
In the LinksList.js file, I have defined Lecture 1 as a variable:
Thank you for your prompt reply and your great help, Martin. It worked. I set a variable var1 in the .js file and in the trigger I used SetVar to set the value of Lecture1 to var1. You made my day.
Hi Martin. Thanks again for your help above. As I mentioned above, the method works very well when I publish on the web. But when I publish as SCORM to upload to our VLE (Canvas), it doesn't work. I think the SCORM package has more content than the web version and probably just inserting a js file and changing story.html is not adequate. I wonder if you have ever used your output in a VLE.
Hi Mike, You would need to make a .js file assigning variables to the URL addresses. For example:
Add the .js file to the story_content folder of your published story.
var var1 = "https://the address";
var var2= "https:// ...";
Modify the story.html file to contain the script for your .js file (I have have named it LinksList.js). The code below should be added anywhere between <head> and </head>:
12 Replies
Dear Martin, there is no function called getVar - correct name is GetVar :)
Aha! Thank you.
(Don'cha hate it when that happens...)
For posterity, it still didn't work first time, but this does:
var player = GetPlayer();
var win = window.open(player.GetVar("google"));
For more posterity, the reason to do this is so I can store external URLs in a .js file, allowing them to be changed post-deployment without republishing the course. On the first page of the course I populate the Storyline variables with the strings held in the .js file.
Thanks for sharing Martin.
I understand that this is a very old thread and I am not sure if Martin or Kamil see this post. But I thought they might be still around or one of the heroes could help on this.
I am trying to do the same thing that Martin was going to do: store URLs as variables in a .js file and import them to Storyline. I have created an Execute JavaScript trigger, like Martin's:
var player = GetPlayer();
var url = player.GetVar("Lecture1");
var win = window.open(url);
In the LinksList.js file, I have defined Lecture 1 as a variable:
var Lecture1 = "http://www.google.co.uk/"; // For simplicity.
I have put LinksList.js in the story_content folder of the published story. I have also modified story.html file as described at https://articulate.com/support/article/javascript-best-practices-and-examples-sl2, by adding this line between <head> and </head>:
<script LANGUAGE="JavaScript1.2" SRC="story_content/LinksList.js" TYPE="text/javascript"></script>
When I click on the link to the above trigger, it goes to a Storyline output/null page with a 'Your file couldn't be accessed' message.
Any help will be appreciated.
Have you checked whether the variable Lecture1 is being populated successfully from your .js file? Try putting its value on screen. If not, you'll need to use SetVar - look at https://articulate.com/support/article/Articulate-Storyline-360-JavaScript-Best-Practices-and-Examples for guidance
Thank you for your prompt reply and your great help, Martin. It worked. I set a variable var1 in the .js file and in the trigger I used SetVar to set the value of Lecture1 to var1. You made my day.
:)
Hi Martin. Thanks again for your help above. As I mentioned above, the method works very well when I publish on the web. But when I publish as SCORM to upload to our VLE (Canvas), it doesn't work. I think the SCORM package has more content than the web version and probably just inserting a js file and changing story.html is not adequate. I wonder if you have ever used your output in a VLE.
Hi Martin. I sorted it out. If you ever going to use the contents as a SCORM package in an LMS, please let me know and I will post the details.
Hi Naser -- Please do feel free to post the details. ;-)
Hi Mike, You would need to make a .js file assigning variables to the URL addresses. For example:
Add the .js file to the story_content folder of your published story.
var var1 = "https://the address";
var var2= "https:// ...";
Modify the story.html file to contain the script for your .js file (I have have named it LinksList.js). The code below should be added anywhere between <head> and </head>:
<script LANGUAGE="JavaScript1.2" SRC="story_content/LinksList.js" TYPE="text/javascript"></script>
The index_lms.html should be modified the same way.
Modify imsmanifest.xml by adding the location of your .js file to the resources section of the file:
<file href="story_content/LinksList.js" />
Define a variable in your story (I have defined it as Lecture1).
Use a run javascript trigger to connect the story variable to the variable you have defined in your .js file:
var player = GetPlayer();
player.SetVar("Lecture1", var1);
var url = player.GetVar("Lecture1");
var win = window.open(url);
I hope that you find it helpful.