Gamify an E-Learning Course #102: Challenge | Recap
Gaming elements, such as rewards, points, discovery, and competition, are excellent ways to engage and motivate learners. But the challe...
Published 10 years ago
Version 1.0
Blog Post
That is amazing, I had a great fun. Did you do it all by stroryline? How do you keep the records? Is it a trigger too?
Hi Joanne,
thanks for your feedback. It’s a combination of Storyline, JavaScript and HTML 5.
When you enter the game slide, the HTML5 (WebObject) gets the Storyline Variable for the colour.
Then the WebObject sends the points back to Storyline and saves them.
The high score page get’s the TOP 5 via Javascript.
I hope that helps a bit :)
EDIT:
nice score by the way
thanks for your feedback. It’s a combination of Storyline, JavaScript and HTML 5.
When you enter the game slide, the HTML5 (WebObject) gets the Storyline Variable for the colour.
Then the WebObject sends the points back to Storyline and saves them.
The high score page get’s the TOP 5 via Javascript.
I hope that helps a bit :)
EDIT:
nice score by the way
- Hi Marcus,
Its really amazing, I like the highscores functionality and i know that you used java script for this but don't know the Java code.
Can you please share the code that you used to send the high score back to storyline.
Or if possible please share the storyfile with us so that we can peek under the hud.- Hi Amar,
thank you. The storylinefile would not help, because most of the logic is stored outside the storylinefile.
The JS Code i used in Storyline is:
getHighScore();
This Calls a JS function i stored in a MyFunctions.js here ist the getHighScore Function:
function setVariable(vName,vValue)
{
var player=GetPlayer();
var myVar = player.SetVar(vName,vValue);
return myVar;
}
function getHighScore()
{
$.post('Load.cfm',function (data) {
setVariable("UserNameTop1",data.DATA.USERNAME[0]);
setVariable("UserPointsTop1",data.DATA.POINTS[0]);
setVariable("UserDateTop1",data.DATA.DATECREATED[0]);
setVariable("UserNameTop2",data.DATA.USERNAME[1]);
setVariable("UserPointsTop2",data.DATA.POINTS[1]);
setVariable("UserDateTop2",data.DATA.DATECREATED[1]);
setVariable("UserNameTop3",data.DATA.USERNAME[2]);
setVariable("UserPointsTop3",data.DATA.POINTS[2]);
setVariable("UserDateTop3",data.DATA.DATECREATED[2]);
setVariable("UserNameTop4",data.DATA.USERNAME[3]);
setVariable("UserPointsTop4",data.DATA.POINTS[3]);
setVariable("UserDateTop4",data.DATA.DATECREATED[3]);
setVariable("UserNameTop5",data.DATA.USERNAME[4]);
setVariable("UserPointsTop5",data.DATA.POINTS[4]);
setVariable("UserDateTop5",data.DATA.DATECREATED[4]);});
return myVar;
}
The load.cfm file has some sql inside to get the data out of the database.
I hope that helps :)- Thanks a lot Marcus for sharing,
I will definitely try the code and share the result...
