Skip to content
Blend-ed Docs

Quickstart

1. Install the package

Section titled “1. Install the package”

Add the repository to OPENEDX_EXTRA_PIP_REQUIREMENTS:

git+https://github.com/blend-ed/interactive-content-xblock.git@master

Rebuild the Open edX image and restart the platform. With Tutor:

Terminal window
tutor images build openedx
tutor local restart

See Deploy and operate for a local development mount and supported versions.

2. Enable the XBlock in a course

Section titled “2. Enable the XBlock in a course”

In Studio, open Settings → Advanced Settings. Add this value to Advanced Module List:

interactive_content_xblock

Save the settings. In a unit, select Advanced → Interactive Content XBlock.

3. Create an interaction

Section titled “3. Create an interaction”

Open the component editor. The default sample already contains a short quiz. The important connection is the global submitInteraction(data) function:

var startTime = Date.now();


function submitAnswer(answer) {
  submitInteraction({
    answer: answer,
    correct: answer === "Paris",
    timeSpent: Math.round((Date.now() - startTime) / 1000)
  });
}

Keep functions referenced by HTML event attributes in global scope:

<button type="button" onclick="submitAnswer('Paris')">Paris</button>

4. Configure and test

Section titled “4. Configure and test”

Set Enable Auto-Grading if the score should reach the Open edX gradebook, then set the point Weight. Choose None (JS controls grading) when the submitted object includes a boolean correct value.

Use Test Grading in the editor before saving. Publish the unit, open it in the LMS as a learner, submit an answer, and confirm that feedback and completion behave as expected.