Skip to content

Commit

Permalink
WIP! all implementations for video tracking generic
Browse files Browse the repository at this point in the history
  • Loading branch information
@NSavenije
NSavenije committed Jan 19, 2022
1 parent c5c0c18 commit 44fc576
Show file tree
Hide file tree
Showing 5 changed files with 26 additions and 353 deletions.
78 changes: 7 additions & 71 deletions modules/xerte/parent_templates/Nottingham/models_html5/mediaLesson.html
View file
Expand Up @@ -23,10 +23,7 @@
var mediaLesson = new function() {
var $panelHolder,
plugins = ["mediaconstructor", "textplus", "subtitleplus", "xot", "mediaplus", "mcq", "slides", "sortholder"], // list of popcorn plugins to load
css = ["subtitleplus", "mcq", "overlaygeneric", "slides"], // list of popcorn plugin css to load
vidFullWatched,
trackinglabel = "";

css = ["subtitleplus", "mcq", "overlaygeneric", "slides"]; // list of popcorn plugin css to load

// function called every time the page is viewed after it has initially loaded
this.pageChanged = function() {
Expand Down Expand Up @@ -238,27 +235,7 @@
};

this.leavePage = function () {
vidFullWatched.segment.end = vidFullWatched.lastTime || -1;
addSegment(vidFullWatched);
$(".embed").each(function() {
$(this).data("popcornInstance").pause();
});
if (this.popcornInstance != null) {
this.removeEvents();
this.popcornInstance.destroy();
}
if (vidFullWatched == undefined)
{
vidFullWatched = {
duration: this.popcornInstance.duration() || 0,
synchName: "video",
watched: [],
segments:[]
};
}
var progress = XThelperDetermineProgress(vidFullWatched) * 100.0;
XTSetPageScore(x_currentPage, progress);
XTVideo(x_currentPage, trackinglabel, "", "exit", vidFullWatched, x_currentPageXML.getAttribute("grouping"));
document.dispatchEvent(new Event('leavepage'));
};

this.loadMedia = function($holder, type, data) {
Expand Down Expand Up @@ -295,7 +272,7 @@
}
}

this.initTracking = function(){
this.initTracking = function() {
var questions = x_currentPageXML.getElementsByTagName("synchMCQ");
var numOfQuestions = questions.length;
// Number the quesion in the order they appear in the editor
Expand All @@ -306,7 +283,7 @@
trackinglabel = x_currentPageXML.getAttribute("trackinglabel");
}
mediaLesson.questions = [];
var nr=0;
var nr = 0;
$(questions).each(function(key, value){
value.setAttribute("total_questions", numOfQuestions);
value.setAttribute("tracking_nr",nr);
Expand All @@ -321,7 +298,7 @@

window.correctQuestions = 0;
XTSetPageType(x_currentPage, 'numeric',numOfQuestions , this.weighting);
XTVideo(x_currentPage, trackinglabel, "", "initialized", vidFullWatched, x_currentPageXML.getAttribute("grouping"));
//XTVideo(x_currentPage, trackinglabel, "", "initialized", vidFullWatched, x_currentPageXML.getAttribute("grouping"));
};

// function loads the popcorn files
Expand Down Expand Up @@ -583,7 +560,8 @@
transcript: mediaPanelData.attr("transcript"),
transcriptBtnTxt: mediaPanelData.attr("transcriptBtnTxt"),
audioImage: mediaPanelData.attr("audioImage"),
audioImageTip: mediaPanelData.attr("audioImageTip")
audioImageTip: mediaPanelData.attr("audioImageTip"),
trackMedia: true
},
true
);
Expand Down Expand Up @@ -615,19 +593,6 @@

// _____ SORT & CREATE SYNCH POINT EVENTS FOR EACH PANEL _____
if (this.popcornInstance != undefined) {
if (vidFullWatched == null || vidFullWatched == undefined) {
vidFullWatched = {
time: 0,
prevTime: 0,
lastTime: 0,
duration: this.popcornInstance.duration(),
synchName: "video",
watched: [],
segments: [],
segment: {start: 0, end: -1}
}
}

panelData.each(function(i) {
mediaLesson.sortPopcorn($(this).children(), mediaLesson.panelbaseid + i, mediaLesson.popcornInstance, $(".mainMedia"));
});
Expand All @@ -639,39 +604,10 @@
};

this.addEvents = function() {
this.popcornInstance.on( "timeupdate", function() {
$("#overlayGray").hide();
vidFullWatched = addTrackingOnTimeUpdate(mediaLesson.popcornInstance, vidFullWatched);
});
this.popcornInstance.on( "play", function() {
$("#overlayGray").hide();
vidFullWatched = addTrackingOnPlay(mediaLesson.popcornInstance, vidFullWatched);
console.log("Play : " + mediaLesson.popcornInstance.currentTime());
});
this.popcornInstance.on( "pause", function() {
vidFullWatched = addTrackingOnPause(mediaLesson.popcornInstance, vidFullWatched);
console.log("Pause : " + mediaLesson.popcornInstance.currentTime());
});
this.popcornInstance.on( "seeked", function() {
vidFullWatched = addTrackingOnSeeked(mediaLesson.popcornInstance, vidFullWatched);
console.log("Seeked : " + mediaLesson.popcornInstance.currentTime() + ", prevTime=" + vidFullWatched.prevTime);
});
this.popcornInstance.on("ended", function() {
vidFullWatched = addTrackingOnEnded(mediaLesson.popcornInstance, vidFullWatched);
console.log("End : " + mediaLesson.popcornInstance.duration());
});
};

this.removeEvents = function() {
if (this.popcornInstance != null) {
this.popcornInstance.off("timeupdate");
this.popcornInstance.off("play");
this.popcornInstance.off("pause");
this.popcornInstance.off("seeked");
this.popcornInstance.off("ended");
}
};


// function loads audio in the footer bar (like narration) when it doesn't go in a panel
this.loadAudioInFooter = function() {
Expand Down
86 changes: 8 additions & 78 deletions modules/xerte/parent_templates/Nottingham/models_html5/nav.html
View file
Expand Up @@ -21,8 +21,6 @@
// pageChanged & sizeChanged functions are needed in every model file
// other functions for model should also be in here to avoid conflicts
var nav = new function() {
var videoState,
popcornInstance;

// Called from xenith if tab level deeplinking is available
this.deepLink = function(item) {
Expand Down Expand Up @@ -344,7 +342,8 @@
width: "100%",
height: "100%",
media: $media.data('source'),
autoplay: false
autoplay: false,
trackMedia: true
});
} else if ($media.hasClass('audio')) {
this.popcornInstance = loadMedia($media, "audio",
Expand All @@ -353,7 +352,8 @@
width: "100%",
height: "100%",
media: $media.data('source'),
autoplay: false
autoplay: false,
trackMedia: false
}, true);
}
}
Expand All @@ -376,9 +376,7 @@

});

this.initTracking();
this.addEvents(this.popcornInstance);
resizeEmbededMedia($(".popcornMedia.embed"), {width: "100%", height: "100%"})
resizeEmbededMedia($(".popcornMedia.embed"), {width: "100%", height: "100%"});

// set up interactions to change nested page
if (x_currentPageXML.getAttribute("type") == "Acc") {
Expand Down Expand Up @@ -497,56 +495,8 @@

this.loadMedia = function($holder, type, data) {
this.popcornInstance = loadMedia($holder, type, data);
return this.popcornInstance;
//return this.popcornInstance;
}

this.initTracking = function(){
videoState = {
time: 0,
lastTime: 0,
prevTime: 0,
duration: this.popcornInstance.duration() || 0,
synchName: "video",
watched: [],
segments: [],
segment: {start: 0, end: -1}
}
trackinglabel = $('<div>').html(x_currentPageXML.getAttribute("name")).text();
if (x_currentPageXML.getAttribute("trackinglabel") != undefined && x_currentPageXML.getAttribute("trackinglabel") != "")
{
trackinglabel = x_currentPageXML.getAttribute("trackinglabel");
}
XTSetPageType(x_currentPage, 'numeric', 0 , 1);
XTVideo(x_currentPage, trackinglabel, "", "initialized", videoState, x_currentPageXML.getAttribute("grouping"));
}

this.addEvents = function(popcornInstance) {
popcornInstance.on( "timeupdate", function() {
videoState = addTrackingOnTimeUpdate(nav.popcornInstance, videoState);
});
popcornInstance.on( "play", function() {
videoState = addTrackingOnPlay(nav.popcornInstance, videoState);
});
popcornInstance.on( "pause", function() {
videoState = addTrackingOnPause(nav.popcornInstance, videoState);
});
popcornInstance.on( "seeked", function() {
videoState = addTrackingOnSeeked(nav.popcornInstance, videoState);
});
popcornInstance.on( "ended", function() {
videoState = addTrackingOnEnded(nav.popcornInstance, videoState);
});
}

this.removeEvents = function() {
if (this.popcornInstance) {
this.popcornInstance.off("timeupdate");
this.popcornInstance.off("play");
this.popcornInstance.off("pause");
this.popcornInstance.off("seeked");
this.popcornInstance.off("ended");
}
};

this.slideshowChange = function(newPage) {
var $pageContents = $("#pageContents"),
Expand Down Expand Up @@ -589,28 +539,8 @@
}

this.leavePage = function () {
videoState.segment.end = videoState.lastTime || -1;
addSegment(videoState);
$(".embed").each(function() {
$(this).data("popcornInstance").pause();
});
if (this.popcornInstance != null) {
this.removeEvents();
this.popcornInstance.destroy();
}
if (videoState == undefined)
{
videoState = {
duration: this.popcornInstance.duration() || 0,
synchName: "video",
watched: [],
segments:[]
};
}
var progress = XThelperDetermineProgress(videoState) * 100.0;
XTSetPageScore(x_currentPage, progress);
XTVideo(x_currentPage, trackinglabel, "", "exit", videoState, x_currentPageXML.getAttribute("grouping"));
};
document.dispatchEvent(new Event('leavepage'));
};
}

nav.init();
Expand Down
65 changes: 2 additions & 63 deletions modules/xerte/parent_templates/Nottingham/models_html5/perspectives.html
View file
Expand Up @@ -537,41 +537,9 @@
x_pageLoaded();
}

this.initTracking = function(){
videoState = {
time: 0,
lastTime: 0,
prevTime: 0,
duration: this.popcornInstance.duration() || 0,
synchName: "video",
watched: [],
segments: [],
segment: {start: 0, end: -1}
}
trackinglabel = $('<div>').html(x_currentPageXML.getAttribute("name")).text();
if (x_currentPageXML.getAttribute("trackinglabel") != undefined && x_currentPageXML.getAttribute("trackinglabel") != "")
{
trackinglabel = x_currentPageXML.getAttribute("trackinglabel");
}
XTSetPageType(x_currentPage, 'numeric', 0 , 1);
XTVideo(x_currentPage, trackinglabel, "", "initialized", videoState, x_currentPageXML.getAttribute("grouping"));
}

this.addEvents = function(popcornInstance) {
popcornInstance.on( "timeupdate", function() {
videoState = addTrackingOnTimeUpdate(perspectives.popcornInstance, videoState);
});
popcornInstance.on( "play", function() {
videoState = addTrackingOnPlay(perspectives.popcornInstance, videoState);
});
popcornInstance.on( "pause", function() {
videoState = addTrackingOnPause(perspectives.popcornInstance, videoState);
});
popcornInstance.on( "seeked", function() {
videoState = addTrackingOnSeeked(perspectives.popcornInstance, videoState);
});
popcornInstance.on( "ended", function() {
videoState = addTrackingOnEnded(perspectives.popcornInstance, videoState);
if ($("#pageContents").data("playAll") == true) {
if ($("#thumbHolder .thumbBox:eq(" + ($("#mainInfoHolder").data("index") + 2) + ")").length > 0) {
$("#thumbHolder .thumbBox:eq(" + ($("#mainInfoHolder").data("index") + 2) + ")").trigger("click", true);
Expand All @@ -584,10 +552,6 @@

this.removeEvents = function() {
if (this.popcornInstance) {
this.popcornInstance.off("timeupdate");
this.popcornInstance.off("play");
this.popcornInstance.off("pause");
this.popcornInstance.off("seeked");
this.popcornInstance.off("ended");
}
};
Expand Down Expand Up @@ -647,14 +611,9 @@
height: ($video.data("width") != "fixed" ? $video.data("dimensions")[1] : Number($video.data("dimensions")[1])),
media: $video.data("src"),
autoplay: "false",
aspect: "",
transcript: undefined,
transcriptBtnTxt: "",
audioImage: undefined,
audioImageTip: ""
trackMedia: true
}, true);

this.initTracking();
this.addEvents(this.popcornInstance);
resizeEmbededMedia($(".popcornMedia.embed"), {width: $video.data("dimensions")[0], height: $video.data("dimensions")[1]})

Expand Down Expand Up @@ -713,27 +672,7 @@
}

this.leavePage = function () {
videoState.segment.end = videoState.lastTime || -1;
addSegment(videoState);
$(".embed").each(function() {
$(this).data("popcornInstance").pause();
});
if (this.popcornInstance != null) {
this.removeEvents();
this.popcornInstance.destroy();
}
if (videoState == undefined)
{
videoState = {
duration: this.popcornInstance.duration() || 0,
synchName: "video",
watched: [],
segments:[]
};
}
var progress = XThelperDetermineProgress(videoState) * 100.0;
XTSetPageScore(x_currentPage, progress);
XTVideo(x_currentPage, trackinglabel, "", "exit", videoState, x_currentPageXML.getAttribute("grouping"));
document.dispatchEvent(new Event('leavepage'));
};
}

Expand Down

0 comments on commit 44fc576

Please sign in to comment.