👋 WELCOME to HypeXAPI
How are we doing it?

Sending a statement

8min

There are a few ways to send a statement to your LRS with Hype. I'm a low-code developer, so I wanted to create a way for us to send statements without having to work with code directly.




Method 1

We prepared an export script to use with the HypeXAPI extension. An export script adds more functionality to the actions menu, designed specifically for HypeXAPI.

How do you load the HypeXAPI export script?

To download the export script, go to this URL: https://github.com/worldoptimizer/HypeXAPI

The file is called: HypeXAPI.hype-export.py

After you downloaded and unzipped the content:

Open Hype > Go to 'Preferences' (cmd,) > Select 'Exporting' > Select 'Show Export Scripts Folder in Finder' > Open the highlighted folder in Finder > Drag the 'HypeXAPI.hype-export.py' file into the opened folder > Close the preferences window.

After you've completed loading the HypeXAPI export script, you have three more options in the action panel:

Export script additions
Export script additions


Decide where and how you want to trigger an xAPI statement for example, on a button click. Select "Send Statement..." from the actions drop-down. This will give you the option to add your xAPI syntax for your statement.

Choose a verb and an object from your HypeXAPI dictionary. Adding a result and context from the dictionary is optional.

Statement structure
Statement structure


That's it. Your statement is ready to be sent. Preview your project.

When you send a statement with this method (export script), make sure that you trigger the Send Statement action when there isn't an animation happening in your project. This method blocks JS untill the statement is sent or fails.



Method 2

The other way to send an xAPI Statement to your LRS, is by using the Additional HTML Attributes panel in the information panel. In the image below, you can see how to bind your xAPI syntax to an element in your project.

html attributes panel
html attributes panel


As you can see in the image, these attributes are tied to a Button.

After you've done this, go to the Actions tab and Run JavaScript... on an action.

Document image


Run this code inside the function:

JS


That's it. Your statement is ready to be sent. Preview your project.

ECHO

In the tutorial on this page, you saw that the statement echos back in the console from the LRS. That is convenient, as I don't have to go and check in my LRS whether the statements was received, or not. When it appears in the console it was received by the LRS and echoed back into your browser.

As with Method 2, you have to include the key and value data-xapi-debug:echo in your statement for this to happen.

In your HypeXAPI() function that holds your xAPI syntax you also need to include the following code snippet for the echo to run. A good place for it to be is right before the closing curly bracket '}' of the HypeXAPI() function. Then it is out of the way, yet very helpful.

JS


I advise that you comment this line of code out before you do your final export. Less noise in the console.

Updated 25 Mar 2024
Doc contributor
Did this page help you?