Course Player Event Hooks

Event HooksLink

The Course Player exposes javascript events that you can listen for with custom javascript placed in the Site Footer Code. These Event Hooks allow you to write your own custom javascript and use it to interact with our Course Player. You can use this to send data on student course navigation, and course and lesson completion, to your analtyics tools custom applications.

Available HooksLink

The following hooks are currently available to you:

EventSescriptionhooks:contentDidChangeFired after a student has navigated to a new lesson.hooks:contentWillChangeFired just before a student navigates to a new lesson. Your function will receive a second parameter call abortTransactionCallback. If you choose to, you can call this function with a boolean value. If you call it with true, the transition to the new lesson will be canceled. If you call it with false, the transition will continue. If you do not call it, the transition will continue.hooks:contentWasCompletedFired when the student clicks the Next button and completes the lesson.hooks:contentWasMarkedIncompleteFired when the student clicks the Mark Incomplete button on a previously completed lesson.hooks:enrollmentWasCompletedFired when the student completes the entire course and their enrollment percentage complete reaches 100%.

Event DataLink

All 5 events pass the same data:

var data = {        
  lesson: {} //object containing lesson attributes,
  chapter:  {} //object containing chapter attributes,
  course:  {} //object containing course attributes,
  enrollment:  {} //object containing enrollment attributes,
  user: {} //object containing student attributes

Example UsageLink

Below is an example of a script which would fire when a student clicks the "Next" button and completes the lesson:

  $(function() {
    if(typeof(CoursePlayerV2) !== 'undefined') {
      CoursePlayerV2.on('hooks:contentWasCompleted', function(data) {
        data["user"] = Thinkific.current_user;
        ThinkificAnalytics.track("Custom Content Completed", data);