Call Lectora Object Actions from other External HTML object, javascript

michaelprescott

I have a custom HTML animation defined in an External HTML object, comprised of HTML and JavaScript. When the animation is complete, I want to tell an Image that was placed on "stage" at design-time (initially invisible) to Show. Ideally, I'd like to give an Action a custom name, like "ShowThisImage" or "MoveThisImage" and call those Actions from my custom JavaScript. Anyone know how to do this?

michaelprescott

Sorry, I selected to post this in the "General Lectora Online Discussion", but did not realize the forum service wouldn't categorize the post. We're only using Lectora Online.



We did review the source and found that images, buttons, and other resources have HTML names that may change with new titles and revisions. Also, object names that we assign from Lectora Online result in unusable/unreferencable JavaScript comments in the src. For example, LO might generate a name for a button, "button180", and with revisions to the title it might become "button181". Since some of our custom scripts are coded in external files and referenced by multiple titles, it seems necessary to have stable handles/IDs/references/classes or some sort of API to be able to access Lectora objects from that code.

wheels

Hi,



You posted in the right place, I was just unsure, sometimes we get Lectora Desktop questions.



Please see the attached example of how you might be able to associate a known function name with the generated function name. This would allow you to have an external script used across many titles, you would just need to create associations to the necessary functions in your titles.



For purposes of this thread I want to note that using Groups seems to be the best way to expose a Lectora Online action you want to call in JavaScript. This also allows you to run multiple actions from one group. The group can be called as follows:



runGroup_()



ie. runGroup_og22();



The group HTML name is available on the properties tab.



Download the pkg file (remove zip from the end of the file name after downloading):

[ATTACH]360[/ATTACH]





You are correct that object names change. It might be possible to create a mapping, depending on how many items you are talking about. You would create a mapping in much the same way as the associations above. Hopefully this gives you some ideas about how you can accomplish what you are trying to do.

michaelprescott

Thank you!



That does help with part of the problem. It demonstrates how to call Lectora Actions from JavaScript; however, I don't see a practical way of maintaining associations between JavaScript and Actions, yet. I tested by creating a new title and copying and pasting the Action group into it. Lectora Online generated a new HTML Name just as it does for other objects. So, this confirms that we'd need to revise the association script with each title, and perhaps even revise it again if the title is significantly modified. Not a big problem with one author and a few titles, but it will be very difficult to manage with many authors and hundreds of titles.



For example:

var MyAction = runGroup_og23;

became

var MyAction = runGroup_og4;

in the next title.

wheels

Hi,



I see what you mean. I have attached another example that does the resolution based on the course object's name. It contains some javascript you might not get, or maybe you will? It basically looks through the source and finds the name in the comments to determine the object name. Then it does an assignment that is configurable.



End result, if you name an action group 'MyAction' then you can call it in your external scripts as MyAction()



Take a look at the example title below, remove the zip extension after downloading.

[ATTACH]361[/ATTACH]

jcraft6852

I know this is an old thread, but I am trying to get something similar to work, and getting stuck. I would love to see your example Joe, but your attachments no longer are available to download, would you please be able to post them again? Thanks!

wheels

I am sorry I did not see this until now...  the example actually does not work now that responsive has been implemented.  I have another way for you to call an action, that might be more straight-forward:

1) Define a button (initially hidden, because you probably don't want the student to see it), and add an action that you would like to run.
2) Get the button html name (see image)


3) The action on the button can be called by using this name to reference the action as follows:

button35.cwObj.arChld[0].actItem()

This is repeatable by replacing the button name for any button you choose.  If you have multiple actions on the button you can increase the index into the arChld array to call the other actions like so:

button35.cwObj.arChld[0].actItem() // first action
button35.cwObj.arChld[1].actItem() // second action
button35.cwObj.arChld[2].actItem() // third action

mnotermans5114

I dont work with Lectora Online , so im not sure if this is a viable option in Lectora Online. I do use it in the desktop a lot. Give the element you want to target with Javascript a CSS-classname. Then you can get all objects with a specified CSS classname in Javascript by using the classname. Something like this:
var uiCollection = document.getElementsByClassName("ui");

That creates a htmlCollection of all your elements in the title ( desktop at least ).

And when you want to access a specific one in that collection...its just...

uiCollection[0]..

Again, im not sure whether this will work in Online...i do use it in desktop a lot...

 

Kind regards,

Math

tmichael9734

Hi Joe and Matt,

I'm sorry if I'm responding to an old post, but I'm running into a similar issue.  I'm using L18 desktop version.  I've a video playing in a pop-up window and I'm trying to return to the main screen after it's done playing.  I'm using these actions on the video:

On Done Playing:  Exit/Close Window

On Hide: RunJS: opener. runGroup_og139946();

But when I preview it, I get the attached message.  I've used this method before and it worked fine, but I don't know why it is not working any more.  I tested it in Chrome and Edge with no luck.  Did I do something wrong?