Merge pull request #794 from adityacp/video_tracking

Basic tracking for video lessons

1 files changed, 49 insertions, 8 deletions

diff --git a/yaksh/static/yaksh/js/show_toc.js b/yaksh/static/yaksh/js/show_toc.js
index a2507d0..55e9236 100644
--- a/yaksh/static/yaksh/js/show_toc.js
+++ b/yaksh/static/yaksh/js/show_toc.js
@@ -24,23 +24,49 @@ $(document).ready(function() {
     var totalSeconds;
     store_video_time(contents_by_time);
     var time_arr_length = video_time.length;
+    var total_duration;
+    player.on('ready', event => {
+        total_duration = parseInt(player.duration);
+        start_tracker((total_duration * 1000) / 4, player);
+    });
+
     player.on('timeupdate', event => {
-        if (time_arr_length > 0 && player.currentTime >= video_time[loc]) {
+        var current_time = player.currentTime;
+        $("#video_duration").val(get_time_in_hrs(total_duration));
+        $("#current_video_time").val(get_time_in_hrs(current_time));
+        if (time_arr_length > 0 && current_time >= video_time[loc]) {
             var content = contents_by_time[loc]; 
             loc += 1;
             if(content.content == 1) {
                 show_topic($("#toc_desc_"+content.id).val(), false);
             }
             else {
-                player.pause();
                 if(player.fullscreen.active) player.fullscreen.exit();
                 url = $("#toc_"+content.id).val();
-                ajax_call(url, "GET");
+                ajax_call(url, "GET", screen_lock=true);
             }
         }
     });
+    player.on('ended', event => {
+        var csrf = document.getElementById("track-form").elements[0].value;
+        ajax_call($("#track-form").attr("action"), $("#track-form").attr("method"),
+                  $("#track-form").serialize(), csrf, screen_lock=false);
+        window.location.href = $("#next_unit").attr("href");
+    });
 });
 
+
+function start_tracker(slice_duration, player) {
+    setTimeout(function run() {
+        if(player && player.playing) {
+            var csrf = document.getElementById("track-form").elements[0].value;
+            ajax_call($("#track-form").attr("action"), $("#track-form").attr("method"),
+                      $("#track-form").serialize(), csrf, screen_lock=false);
+        }
+        setTimeout(run, slice_duration);
+    }, slice_duration);
+}
+
 function show_topic(description, override) {
     var topic_div = $("#topic-description");
     if(override) {
@@ -51,8 +77,10 @@ function show_topic(description, override) {
 }
 
 function store_video_time(contents) {
-    for (var j = 0; j < contents.length; j++)
-    video_time.push(get_time_in_seconds(contents[j].time));
+    if(contents) {
+        for (var j = 0; j < contents.length; j++)
+        video_time.push(get_time_in_seconds(contents[j].time));
+    }
 }
 
 function get_time_in_seconds(time) {
@@ -63,6 +91,18 @@ function get_time_in_seconds(time) {
     return hh * 3600 + mm * 60 + ss;
 }
 
+function get_time_in_hrs(time) {
+    totalSeconds = parseInt(time)
+    hours = Math.floor(totalSeconds / 3600);
+    totalSeconds %= 3600;
+    minutes = Math.floor(totalSeconds / 60);
+    seconds = totalSeconds % 60;
+    hours = hours < 10 ? "0" + hours : hours;
+    minutes = minutes < 10 ? "0" + minutes : minutes;
+    seconds = seconds < 10 ? "0" + seconds : seconds;
+    return hours + ":" + minutes + ":" + seconds;
+}
+
 function lock_screen() {
     document.getElementById("loader").style.display = "block";
     if ($("#check").is(":visible")) {
@@ -87,7 +127,8 @@ function show_question(data) {
         e.preventDefault();
         lock_screen();
         var csrf = document.getElementById("submit-quiz-form").elements[0].value;
-        ajax_call($(this).attr("action"), $(this).attr("method"), $(this).serialize(), csrf);
+        ajax_call($(this).attr("action"), $(this).attr("method"),
+                  $(this).serialize(), csrf, screen_lock=true);
     });
 }
 
@@ -140,8 +181,8 @@ function show_message(message, msg_type) {
     }
 }
 
-function ajax_call(url, method, data, csrf) {
-    lock_screen();
+function ajax_call(url, method, data, csrf, screen_lock=true) {
+    if(screen_lock) {lock_screen();}
     $.ajax({
         url: url,
         timeout: 15000,