get and set variable values using Javascript

Hi,


I am new to using javascript in my prodjects and need help to get started.


I have tried to change the value of a variable using VarMyvariable.set(value) but can't get it to work. Please help me understand what I am doing wrong.

This is what I have done:


1. Created a variable called "Item" in Lectora and set the initial value to 10


2. Added the following action to an image (just to test the function):


On: Click

Action: Run Javascript

Javascript:

VarItem.set(2);


I run the project and debug the variables, but the variable does not change. Please help me understand why!


Thanks

Kristina

Discussion (7)

@ssneg 57037 wrote:

First of all, are you sure you want to post this in Snap! forum, and not in Lectora forum?


Anyway, you cannot change image or select image (only form elements, as in "change textfield" or "select radio button"), so your "On: Change / Select" action will never fire. You have to use On Click or On Show.



I use onclick and the script fires, but the variable does not change. Appreciate your help.




/Kristina

First of all, are you sure you want to post this in Snap! forum, and not in Lectora forum?


Anyway, you cannot change image or select image (only form elements, as in "change textfield" or "select radio button"), so your "On: Change / Select" action will never fire. You have to use On Click or On Show.

I just tested what you describe and it's changing the variable value alright. What do you do to check whether Item = 2?


Tim

Hi again,


Ted, I test using debug - > variables. I solved my last problem in a different way, but now I am facing a another problem, which it would be nice to use Javascript to solve. I still can't get this to work. I have tried several different combinations (with and without ; etc etc) but the variable does not change. I can't figure out why, so please help me!


Thanks!

It seems as if I have answered my own question: the script does not work in run mode. It works if I add another object, which changes based on the value of the variable. It only works when I test it in a browser - maybe I should add of course to this... hope it at least saves some time for someone else to know about this.

external javascript routines will only run when you publish to HTML and run it in the browser. If you do preview in browser, it should work...

what are you trying to do in javascript? Because, I am sure that this example is not what you need to do? Because, you can always do an action On Show --> Mod Var --> Item --> 2.


So this is what I usually do with javascript in Lectora ( because I have done a lot of it ). First, it will only run in the browser, because, javascript is made for the web! Lectora developers only gave us the flexibility to do a Run Javascript command in Lectora 11.X because people asked for it so they could extend the functionality of the HTML in Lectora (though, there is a way to run javascript in 10.X using a trick)


For example, because of various problems with video in Lectora and accessibility, I make my own HTML 5 video in Lectora. So, I do a External HTML Custom DIV and declare my video on a page like this...



Your browser does not support HTML 5 video



But now, I need to control the video (play, pause) and set some Lectora variables and run some of Lectora's action groups. So, in External HTML Header Scripting, I define some javascript functions...


function playIntroductionVideo(){

// Check for video element support.

if (window.HTMLVideoElement)

{

try

{

var oVideo = document.getElementById("IntroductionVideo");

if( (oVideo.paused) || (oVideo.ended) )

{

oVideo.play();

VarVideoPlaying.set(1);

}

}

catch (e) {

// Fail silently but show in F12 developer tools console

if(window.console undefined

VarVideoPlaying.set(0);

}

}

catch (e) {

// Fail silently but show in F12 developer tools console

if(window.console undefined

oVideo.currentTime = 0;

if( (oVideo.paused) || (oVideo.ended) )

{

oVideo.play();

VarVideoPlaying.set(1);

}

}

catch (e) {

// Fail silently but show in F12 developer tools console

if(window.console undefined

oVideo.currentTime = 0;

VarVideoPlaying.set(0);

}

}

catch (e) {

// Fail silently but show in F12 developer tools console

if(window.console undefined

VarVideoPlaying.set(0);

}

// event handler for Pause event

function videoPauseHandler(e) {

if(!e) { e = window.event; }

//alert('video paused');

// run the stop action group

runGroup_og208977();

VarVideoPlaying.set(0);

}

// event handler for Play event

function videoPlayingHandler(e) {

if(!e) { e = window.event; }

//alert('video playing');

// run the play action group

runGroup_og241857();

VarVideoPlaying.set(1);

}

function AddEventHandlersForIntroductionVideo() {

var oVideo= document.getElementById ("IntroductionVideo");

if (oVideo.addEventListener) { // all browsers except IE before version 9

oVideo.addEventListener ('ended', videoEndingHandler, false);

oVideo.addEventListener ('pause', videoPauseHandler, false);

oVideo.addEventListener ('playing', videoPlayingHandler, false);

}

else {

if (oVideo.attachEvent) { // IE before version 9

oVideo.attachEvent ('ended', videoEndingHandler);

oVideo.attachEvent ('pause', videoPauseHandler);

oVideo.attachEvent ('playing', videoPlayingHandler);

}

}

}



Now, if I need to play the video, I just do a action on a button and say On Click, Run Javascript, playIntroductionVideo()


Or if I need to add my event Listeners for the video, I just add a action on the page, On Show, Run Javascript,

AddEventHandlersForIntroductionVideo()


This will only work in the browser. In Run Mode, etc, you will only see the video shown as an external object and none of the javascript will work.

Discussions have been disabled for this post