unserver-unify
Version:
233 lines (229 loc) • 7.57 kB
JavaScript
angular.module('bamboo.common').component('coursewareVideoQuiz', {
templateUrl: 'app/directive/courseware/videoquiz.tpl.html',
bindings: {
chapter: "<",
callback: "&",
mp4time: "<",
destroycallback: "&"
},
controller: function($timeout, ApiService, $sce, ExamQuestionBizModel, CoursewareService) {
var vm = this;
vm.videocomplete = false;
vm.$onInit = function() {
init();
console.log(vm);
vm.callback({
bool: true
});
}
vm.$onDestroy = function() {
var mp4time = (vm.API.totalTime!=vm.API.currentTime)?parseInt(vm.API.currentTime / 1000):0;
vm.destroycallback({
mp4time: mp4time,
videocomplete: vm.videocomplete
});
};
vm.$onChanges = function(changesObj) {
console.log(changesObj);
if (vm.API) {
console.log(vm.API);
console.log(vm.chapter);
vm.API.stop();
$timeout(function(){
init();
},500);
}
};
vm.API = null;
vm.onPlayerReady = function(API) {
vm.API = API;
if(vm.mp4time){
vm.API.seekTime(vm.mp4time, false);
}
};
vm.onVideoFinished = function() {
console.log("------------------- video play finished ----------------");
vm.videocomplete = true;
};
function init() {
vm._last_rid = null;
vm._historydetail = {};
vm.views = [];
vm._lasttime = new Date();
/* received all API from videogular when html was loaded*/
vm.ResUrl = ApiService.SHOST + '/lcourse/';
vm.mp4config = {
sources: [{}],
// theme: AppConfig.videogular_theme,
tracks: [{
src: "",
kind: "subtitles",
srclang: "en",
label: "English",
default: "true"
}],
cuePoints: {},
};
vm.resulticon = {
Correct: "fa fa-check",
Wrong: "fa fa-times",
'Not Attempted': "fa fa-times miss"
};
vm.mp4config.sources[0].src = vm.getMediaUrl();
if(vm.chapter.type!='onlinequiz'){
vm.mp4config.sources[0].type = 'video/mp4';
vm.mp4config.tracks[0].src = vm.getSubUrl();
}
vm.topLevelAudio = vm.audio = null;
vm.flag = false;
vm.typename = {
'single': 'Select one answer',
'fill': 'Fill in the blank',
'mfill': 'Fill in all the blanks',
'tof': 'True or False',
'multiple': 'Multiple Choices, You can select more than one answer!',
};
console.log(vm.chapter);
//record usage
var params = {
prechapter: angular.copy(vm.chapter),
flag: vm.flag,
_historydetail: vm._historydetail,
views: vm.views,
_last_rid: vm._last_rid,
_lasttime: vm._lasttime
};
var promise = CoursewareService.recordUsage(params);
if (promise) {
promise.then(function() {
vm._historydetail = {}
if (!vm.flag) {
vm.callback({
bool: true
});
}
});
}
vm.configVideo();
}
/**
* config cuepoints for pause popup
*/
vm.configVideo = function() {
vm.chapter.ppts = _.sortBy(vm.chapter.ppts, function(o) {
return o.cueTiming
});
console.log(vm.chapter.ppts);
if (vm.chapter.ppts && vm.chapter.ppts.length > 0) {
var cues = [];
var lastCuePot;
for (var i = 0; i < vm.chapter.ppts.length; i++) {
// config videogular for one cue point
var j = i - 1;
var lastCueTime = (j >= 0) ? cues[j].timeLapse : undefined;
var cue = {
timeLapse: {
// avoid the 0 start time, videogular will trigger call even if the video is not playing
// and if the cueTiming is missing, set the cue point to -1 to make sure it will not show
start: vm.chapter.ppts[i].cueTiming === 0 ? 0.1 : (vm.chapter.ppts[i].cueTiming - 1) || -1
},
//onEnter: this.onEnterCuePoint.bind(this),
//onLeave : this.onEnterCuePoint.bind(this),
onComplete: vm.onEnterCuePoint.bind(this),
params: {
displayQuiz: vm.chapter.ppts[i],
lastCue: lastCuePot ? lastCuePot.timeLapse : undefined
}
};
console.log(lastCuePot);
lastCuePot = cue;
cues.push(cue);
}
vm.mp4config.cuePoints.quizSwitch = cues;
}
}
/**
* call back function to cuepoint
*/
vm.onEnterCuePoint = function(currentTime, timeLapse, params) {
console.log('.............enter cuepoint...........');
vm.lastCuePointTime = params.lastCue ? params.lastCue.end : 0;
console.log(vm.lastCuePointTime);
if (params.displayQuiz.linked) {
// pause video play if needed
$timeout(function() {
if (vm.API.currentState == 'play') {
vm.API.pause();
}
vm.flag = true;
vm.displayQuizs = vm.getQuestionsByQuiz(params.displayQuiz);
vm.displayQuizName = params.displayQuiz.quizname;
console.log(vm.displayQuizs);
}, 300);
}
// disable show overlay
$timeout(function() {
vm.show_overlay = false;
}, 0);
};
vm.getQuestionById = function(id) {
for (var q in vm.chapter.questions) {
if (vm.chapter.questions[q].q_id == id) {
return vm.chapter.questions[q];
}
}
return null;
};
vm.getQuestionsByQuiz = function(quiz) {
var ques = [];
angular.forEach(quiz.questions, function(val, idx) {
var q = vm.getQuestionById(val);
ExamQuestionBizModel.convertQ(q);
if (q != null) {
ques.push(q);
}
});
return ques;
};
vm.getSubUrl = function() {
var suburl = ApiService.MEDIAPATH + '/lcourse/' + (vm.chapter.rid || vm.chapter.cid) + "/resources/" + vm.chapter.subtitle;
if (ApiService.MEDIAPATH && vm.chapter.subtitle) {
return $sce.trustAsResourceUrl(encodeURI(suburl));
} else {
return null;
}
}
vm.getMediaUrl = function() {
var fullurl = vm.ResUrl + (vm.chapter.rid || vm.chapter.cid) + "/resources/" + encodeURI(vm.chapter.content);
if(vm.chapter.type=='onlinequiz'){
fullurl = encodeURI(vm.chapter.content);
}
return $sce.trustAsResourceUrl(fullurl);
};
vm.replay = function() {
ExamQuestionBizModel.clearresult(vm.displayQuizs);
vm.flag = false;
vm.submit = false;
vm.API.seekTime(vm.lastCuePointTime, false);
vm.API.play();
}
vm.submitChapterTestForVideoQuiz = function(quiz) {
//chapter, questions, _historydetail, views
CoursewareService.checkresult(vm.chapter, quiz, vm._historydetail, vm.views);
vm.chapter.showresult = true;
vm.submit = true;
};
vm.continueVideo = function() {
ExamQuestionBizModel.clearresult(vm.displayQuizs);
vm.flag = false;
vm.submit = false;
vm.API.play();
}
vm.retestChapter = function(quiz) {
ExamQuestionBizModel.clearresult(quiz);
vm.chapter.showresult = false;
vm.submit = false;
}
},
controllerAs: 'ctrl',
});