Add xapi video verbs

scripts/html5.js

@@ -1,5 +1,6 @@
 /** @namespace H5P */
 H5P.VideoHtml5 = (function ($) {
+  'use strict';
 
   /**
    * HTML5 video player for H5P.
@@ -12,12 +13,6 @@ H5P.VideoHtml5 = (function ($) {
   function Html5(sources, options, l10n) {
     var self = this;
 
-    /**
-     * xAPI Helper.
-     * @private
-     */
-    var videoXAPI = new H5P.VideoXAPI(self);
-
     /**
      * Displayed when the video is buffering
      * @private
@@ -162,7 +157,7 @@ H5P.VideoHtml5 = (function ($) {
         }
       }
 
-      return videoXAPI.getArgsXAPIInitialized(video.videoWidth, video.videoHeight, video.playbackRate, video.volume, ccEnabled, ccLanguage, video.videoHeight, video.duration);
+      return self.videoXAPI.getArgsXAPIInitialized(video.videoWidth, video.videoHeight, video.playbackRate, video.volume, ccEnabled, ccLanguage, video.videoHeight, video.duration);
 
     };
 
@@ -194,24 +189,18 @@ H5P.VideoHtml5 = (function ($) {
             }
 
             if (arg === H5P.Video.PLAYING) {
-              if (self.seeking === true) {
-                extraArg = videoXAPI.getArgsXAPISeeked(self.seekedTo);
-                extraTrigger = 'seeked';
-                lastSend = 'seeked';
-                self.seeking = false;
-              }
-              else if (lastSend !== 'play') {
-                extraArg = videoXAPI.getArgsXAPIPlayed(video.currentTime);
+              if (lastSend !== 'play') {
+                extraArg = self.videoXAPI.getArgsXAPIPlayed(video.currentTime);
                 extraTrigger = 'play';
                 lastSend = 'play';
               }
             }
 
             if (arg === H5P.Video.PAUSED) {
               // Put together extraArg for sending to xAPI statement.
-              if (!video.seeking && self.seeking === false && video.currentTime !== video.duration) {
+              if (!video.seeking && self.seeking === false && video.currentTime !== video.duration && self.previousState !== H5P.Video.BUFFERING) {
                 extraTrigger = 'paused';
-                extraArg = videoXAPI.getArgsXAPIPaused(video.currentTime, video.duration);
+                extraArg = self.videoXAPI.getArgsXAPIPaused(video.currentTime, video.duration);
                 lastSend = 'paused';
               }
             }
@@ -221,10 +210,10 @@ H5P.VideoHtml5 = (function ($) {
               var length = video.duration;
               if (length > 0) {
                 // Length passed in as current time, because at end of video when this is fired currentTime reset to 0 if on loop
-                var progress = videoXAPI.getProgress(length, length);
-                if (progress >= 0.95) {
+                var progress = self.videoXAPI.getProgress(length, length);
+                if (progress >= self.finishedThreshold) {
                   extraTrigger = 'finished';
-                  extraArg = videoXAPI.getArgsXAPICompleted(video.currentTime, video.duration, progress);
+                  extraArg = self.videoXAPI.getArgsXAPICompleted(video.currentTime, video.duration, progress);
                   lastSend = 'finished';
                 }
               }
@@ -237,23 +226,23 @@ H5P.VideoHtml5 = (function ($) {
             return; // Just need to store current time for seeked event.
             break;
           case 'volumechange' :
-            arg = videoXAPI.getArgsXAPIVolumeChanged(video.currentTime, video.muted, video.volume);
+            arg = self.videoXAPI.getArgsXAPIVolumeChanged(video.currentTime, video.muted, video.volume);
             lastSend = 'volumechange';
             break;
           case 'play':
             if (self.seeking === false && lastSend !== h5p) {
-              arg = videoXAPI.getArgsXAPIPlayed(video.currentTime);
+              arg = self.videoXAPI.getArgsXAPIPlayed(video.currentTime);
               lastSend = h5p;
             }
             else {
-              arg = videoXAPI.getArgsXAPISeeked(self.seekedTo);
+              arg = self.videoXAPI.getArgsXAPISeeked(self.seekedTo);
               lastSend = 'seeked';
               self.seeking = false;
               h5p = 'seeked';
             }
             break;
           case 'fullscreen':
-            arg = videoXAPI.getArgsXAPIFullScreen(video.currentTime, video.videoWidth, video.videoHeight);
+            arg = self.videoXAPI.getArgsXAPIFullScreen(video.currentTime, video.videoWidth, video.videoHeight);
             lastSend = h5p;
             break;
           case 'loaded':
@@ -306,6 +295,7 @@ H5P.VideoHtml5 = (function ($) {
             arg = self.getPlaybackRate();
             break;
         }
+        self.previousState = arg;
         self.trigger(h5p, arg);
 
         // Make extra calls for events with needed values for xAPI statement.

scripts/x-api.js

@@ -122,7 +122,10 @@ H5P.VideoXAPI = (function ($) {
       if (typeof volume !== 'undefined') {
         extensions['https://w3id.org/xapi/video/extensions/volume'] = volume;
       }
-      extensions['https://w3id.org/xapi/video/extensions/completion-threshold'] = instance.finishedThreshold;
+      if (typeof instance.finishedThreshold !== 'undefined') {
+        extensions['https://w3id.org/xapi/video/extensions/completion-threshold'] = instance.finishedThreshold;
+      }
+
       return self.getArgsXAPI({
         verb: 'http://adlnet.gov/expapi/verbs/initialized',
         extensionsContext: extensions
@@ -384,6 +387,8 @@ H5P.VideoXAPI = (function ($) {
      * Converts an array of played segments to the string representation defined
      * in the xAPI Video Profile spec.
      * @see  https://liveaspankaj.gitbooks.io/xapi-video-profile/content/statement_data_model.html#2545-played-segments
+     *
+     * @private
      * @return {String} Played segments string, e.g., '0.000[.]12.000[,]14.000[.]21.000'
      */
     var stringifyPlayedSegments = function () {

scripts/youtube.js

@@ -1,5 +1,6 @@
 /** @namespace H5P */
 H5P.VideoYouTube = (function ($) {
+  'use strict';
 
   /**
    * YouTube video player for H5P.
@@ -12,12 +13,6 @@ H5P.VideoYouTube = (function ($) {
   function YouTube(sources, options, l10n) {
     var self = this;
 
-    /**
-     * xAPI Helper.
-     * @private
-     */
-    var videoXAPI = new H5P.VideoXAPI(self);
-
     var player;
     var playbackRate = 1;
     var id = 'h5p-youtube-' + numInstances;
@@ -111,7 +106,7 @@ H5P.VideoYouTube = (function ($) {
             }
           },
           onStateChange: function (state) {
-            if (state.data > -1 && state.data < 4) {
+            if (state.data >= H5P.Video.ENDED && state.data <= H5P.Video.BUFFERING) {
 
               // Fix for keeping playback rate in IE11
               if (H5P.Video.IE11_PLAYBACK_RATE_FIX && state.data === H5P.Video.PLAYING && playbackRate !== 1) {
@@ -124,35 +119,32 @@ H5P.VideoYouTube = (function ($) {
               self.trigger('stateChange', state.data);
 
               // Calls for xAPI events.
-              if (state.data === 1) {
+              if (state.data === H5P.Video.PLAYING) {
                 // Get and send play call when not seeking.
                 if (self.seeking === false) {
-                  self.trigger('play', videoXAPI.getArgsXAPIPlayed(player.getCurrentTime()));
-                }
-                else {
-                  self.trigger('seeked', videoXAPI.getArgsXAPISeeked(self.seekedTo));
-                  self.seeking = false;
+                  self.trigger('play', self.videoXAPI.getArgsXAPIPlayed(player.getCurrentTime()));
                 }
               }
-              else if (state.data === 2) {
+              else if (state.data === H5P.Video.PAUSED) {
                 // This is a paused event.
-                if (self.seeking === false) {
-                  self.trigger('paused', videoXAPI.getArgsXAPIPaused(player.getCurrentTime(), self.duration));
+                if (self.seeking === false && self.previousState !== H5P.Video.BUFFERING) {
+                  self.trigger('paused', self.videoXAPI.getArgsXAPIPaused(player.getCurrentTime(), self.duration));
                 }
               }
-              else if (state.data === 0) {
+              else if (state.data === H5P.Video.ENDED) {
                 // Send xapi trigger if video progress indicates finished.
                 var length = self.duration;
                 if (length > 0) {
                   // Length passed in as current time, because at end of video when this is fired currentTime reset to 0 if on loop
-                  var progress = videoXAPI.getProgress(length, length);
-                  if (progress >= 0.95) {
-                    var arg = videoXAPI.getArgsXAPICompleted(player.getCurrentTime(), self.duration, progress);
+                  var progress = self.videoXAPI.getProgress(length, length);
+                  if (progress >= self.finishedThreshold) {
+                    var arg = self.videoXAPI.getArgsXAPICompleted(player.getCurrentTime(), self.duration, progress);
                     self.trigger('finished', arg);
                   }
                 }
               }
             }
+            self.previousState = state.data;
           },
           onPlaybackQualityChange: function (quality) {
             self.trigger('qualityChange', quality.data);
@@ -224,7 +216,7 @@ H5P.VideoYouTube = (function ($) {
           break;
       }
 
-      return (returnType.toLowerCase().trim()=='width') ? width : height;
+      return (returnType.toLowerCase().trim() === 'width') ? width : height;
     };
 
     /**
@@ -241,7 +233,7 @@ H5P.VideoYouTube = (function ($) {
         ccLanguage = player.getOptions('cc', 'track').languageCode;
       }
 
-      return videoXAPI.getArgsXAPIInitialized(width, height, self.getPlaybackRate(), self.getVolume(), ccEnabled, ccLanguage, self.getQuality(), self.getDuration());
+      return self.videoXAPI.getArgsXAPIInitialized(width, height, self.getPlaybackRate(), self.getVolume(), ccEnabled, ccLanguage, self.getQuality(), self.getDuration());
 
     };
 
@@ -421,7 +413,7 @@ H5P.VideoYouTube = (function ($) {
         return;
       }
 
-      self.trigger('volumechange', videoXAPI.getArgsXAPIVolumeChanged(player.getCurrentTime(), true, player.getVolume()));
+      self.trigger('volumechange', self.videoXAPI.getArgsXAPIVolumeChanged(player.getCurrentTime(), true, player.getVolume()));
 
       player.mute();
     };
@@ -436,7 +428,7 @@ H5P.VideoYouTube = (function ($) {
         return;
       }
 
-      self.trigger('volumechange', videoXAPI.getArgsXAPIVolumeChanged(player.getCurrentTime(), false, player.getVolume()));
+      self.trigger('volumechange', self.videoXAPI.getArgsXAPIVolumeChanged(player.getCurrentTime(), false, player.getVolume()));
 
       player.unMute();
     };
@@ -480,7 +472,7 @@ H5P.VideoYouTube = (function ($) {
         return;
       }
 
-      self.trigger('volumechange', videoXAPI.getArgsXAPIVolumeChanged(player.getCurrentTime(), player.isMuted(), level));
+      self.trigger('volumechange', self.videoXAPI.getArgsXAPIVolumeChanged(player.getCurrentTime(), player.isMuted(), level));
 
       player.setVolume(level);
     };