Skip to content

E
edx-platform
Commit aefb1aa9 by Anton Stupak Committed by Alexander Kryklia
Options

Hides Error notification when subtitle file is missing 

Refactors bind and indexOf.
Adds error message when specify the wrong selector.
Adds some of the requested documentation.
Refactors 01_initialize.js.
Fixes to 03_video_player.js
parent 7d215e12
Showing with 168 additions and 222 deletions
common/lib/xmodule/xmodule/js/spec/helper.coffee
...@@ -10,7 +10,7 @@ window.YT = ...@@ -10,7 +10,7 @@ window.YT =
window.STATUS = window.YT.PlayerState window.STATUS = window.YT.PlayerState
oldGetWithPrefix = window.jQuery.getWithPrefix oldAjaxWithPrefix = window.jQuery.ajaxWithPrefix
jasmine.stubbedCaption = jasmine.stubbedCaption =
end: [3120, 6270, 8490, 21620, 24920, 25750, 27900, 34380, 35550, 40250] end: [3120, 6270, 8490, 21620, 24920, 25750, 27900, 34380, 35550, 40250]
...@@ -28,8 +28,9 @@ jasmine.stubbedCaption = ...@@ -28,8 +28,9 @@ jasmine.stubbedCaption =
"And some will have quite a bit of energy, just for a moment." "And some will have quite a bit of energy, just for a moment."
] ]
# For our purposes, we need to make sure that the function $.getWithPrefix doe not fail # For our purposes, we need to make sure that the function $.ajaxWithPrefix
# when during tests a captions file is requested. It is originally defined in # does not fail when during tests a captions file is requested.
# It is originally defined in
# #
# common/static/coffee/src/ajax_prefix.js # common/static/coffee/src/ajax_prefix.js
# #
...@@ -37,14 +38,21 @@ jasmine.stubbedCaption = ...@@ -37,14 +38,21 @@ jasmine.stubbedCaption =
# #
# 1.) Return a hard coded captions object if the file name contains 'test_name_of_the_subtitles'. # 1.) Return a hard coded captions object if the file name contains 'test_name_of_the_subtitles'.
# 2.) Behaves the same a as the origianl in all other cases. # 2.) Behaves the same a as the origianl in all other cases.
window.jQuery.getWithPrefix = (url, data, callback, type) ->
window.jQuery.ajaxWithPrefix = (url, settings) ->
if not settings
settings = url
url = settings.url
success = settings.success
data = settings.data
if url.match(/test_name_of_the_subtitles/g) isnt null or url.match(/slowerSpeedYoutubeId/g) isnt null or url.match(/normalSpeedYoutubeId/g) isnt null if url.match(/test_name_of_the_subtitles/g) isnt null or url.match(/slowerSpeedYoutubeId/g) isnt null or url.match(/normalSpeedYoutubeId/g) isnt null
if window.jQuery.isFunction(callback) is true if window.jQuery.isFunction(success) is true
callback jasmine.stubbedCaption success jasmine.stubbedCaption
else if window.jQuery.isFunction(data) is true else if window.jQuery.isFunction(data) is true
data jasmine.stubbedCaption data jasmine.stubbedCaption
else else
oldGetWithPrefix.apply this, arguments oldAjaxWithPrefix.apply @, arguments
# Time waitsFor() should wait for before failing a test. # Time waitsFor() should wait for before failing a test.
window.WAIT_TIMEOUT = 1000 window.WAIT_TIMEOUT = 1000
......
common/lib/xmodule/xmodule/js/spec/videoalpha/video_caption_spec.js
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
describe('constructor', function() { describe('constructor', function() {
describe('always', function() { describe('always', function() {
beforeEach(function() { beforeEach(function() {
spyOn($, 'getWithPrefix').andCallThrough(); spyOn($, 'ajaxWithPrefix').andCallThrough();
initialize(); initialize();
}); });
...@@ -49,7 +49,11 @@ ...@@ -49,7 +49,11 @@
}, 'Expect captions to be loaded.', 1000); }, 'Expect captions to be loaded.', 1000);
runs(function () { runs(function () {
expect($.getWithPrefix).toHaveBeenCalledWith(videoCaption.captionURL(), jasmine.any(Function)); expect($.ajaxWithPrefix).toHaveBeenCalledWith({
url: videoCaption.captionURL(),
notifyOnError: false,
success: jasmine.any(Function)
});
}); });
}); });
......
common/lib/xmodule/xmodule/js/src/.gitignore
...@@ -2,3 +2,7 @@ ...@@ -2,3 +2,7 @@
# For each of the xmodules subdirectories, add a .gitignore file that # For each of the xmodules subdirectories, add a .gitignore file that
# will version any *.js file that is specifically written, not compiled. # will version any *.js file that is specifically written, not compiled.
*.js *.js
# Videoalpha are written in pure JavaScript.
!videoalpha/*.js
\ No newline at end of file
common/lib/xmodule/xmodule/js/src/videoalpha/01_helper_utils.js deleted 100644 → 0
// IE browser supports Function.bind() only starting with version 9.
//
// The bind function is a recent addition to ECMA-262, 5th edition; as such it may not be present in all
// browsers. You can partially work around this by inserting the following code at the beginning of your
// scripts, allowing use of much of the functionality of bind() in implementations that do not natively support
// it.
//
// https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind
if (!Function.prototype.bind) {
Function.prototype.bind = function (oThis) {
var aArgs, fToBind, fNOP, fBound;
if (typeof this !== 'function') {
// closest thing possible to the ECMAScript 5 internal IsCallable function
throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
}
aArgs = Array.prototype.slice.call(arguments, 1);
fToBind = this;
fNOP = function () {};
fBound = function () {
return fToBind.apply(
this instanceof fNOP && oThis ? this : oThis,
aArgs.concat(Array.prototype.slice.call(arguments))
);
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}
// IE browser supports Array.indexOf() only starting with version 9.
//
// indexOf is a recent addition to the ECMA-262 standard; as such it may not be present in all browsers. You can work
// around this by utilizing the following code at the beginning of your scripts. This will allow you to use indexOf
// when there is still no native support. This algorithm matches the one specified in ECMA-262, 5th edition, assuming
// Object, TypeError, Number, Math.floor, Math.abs, and Math.max have their original values.
//
// https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/indexOf
if (!Array.prototype.indexOf) {
Array.prototype.indexOf = function (searchElement /*, fromIndex */ ) {
'use strict';
if (this == null) {
throw new TypeError();
}
var t = Object(this);
var len = t.length >>> 0;
if (len === 0) {
return -1;
}
var n = 0;
if (arguments.length > 1) {
n = Number(arguments[1]);
if (n != n) { // shortcut for verifying if it's NaN
n = 0;
} else if (n != 0 && n != Infinity && n != -Infinity) {
n = (n > 0 || -1) * Math.floor(Math.abs(n));
}
}
if (n >= len) {
return -1;
}
var k = n >= 0 ? n : Math.max(len - Math.abs(n), 0);
for (; k < len; k++) {
if (k in t && t[k] === searchElement) {
return k;
}
}
return -1;
}
}
if (!window.onTouchBasedDevice) {
window.onTouchBasedDevice = function() {
return navigator.userAgent.match(/iPhone|iPod|iPad/i);
};
}
common/lib/xmodule/xmodule/js/src/videoalpha/03_html5_video.js → common/lib/xmodule/xmodule/js/src/videoalpha/02_html5_video.js
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
(function (requirejs, require, define) { (function (requirejs, require, define) {
define( define(
'videoalpha/03_html5_video.js', 'videoalpha/02_html5_video.js',
[], [],
function () { function () {
var HTML5Video = {}; var HTML5Video = {};
...@@ -128,7 +128,7 @@ function () { ...@@ -128,7 +128,7 @@ function () {
* } * }
*/ */
function Player(el, config) { function Player(el, config) {
var sourceStr, _this; var sourceStr, _this, errorMessage;
// Initially we assume that el is a DOM element. If jQuery selector fails to select something, we // Initially we assume that el is a DOM element. If jQuery selector fails to select something, we
// assume that el is an ID of a DOM element. We try to select by ID. If jQuery fails this time, // assume that el is an ID of a DOM element. We try to select by ID. If jQuery fails this time,
...@@ -139,6 +139,12 @@ function () { ...@@ -139,6 +139,12 @@ function () {
this.el = $('#' + el); this.el = $('#' + el);
if (this.el.length === 0) { if (this.el.length === 0) {
errorMessage = 'VideoPlayer: Element corresponding to the given selector does not found.';
if (window.console && console.log) {
console.log(errorMessage);
} else {
throw new Error(errorMessage);
}
return; return;
} }
} }
......
common/lib/xmodule/xmodule/js/src/videoalpha/04_video_player.js → common/lib/xmodule/xmodule/js/src/videoalpha/03_video_player.js
...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
// VideoPlayer module. // VideoPlayer module.
define( define(
'videoalpha/04_video_player.js', 'videoalpha/03_video_player.js',
['videoalpha/03_html5_video.js'], ['videoalpha/02_html5_video.js'],
function (HTML5Video) { function (HTML5Video) {
// VideoPlayer() function - what this module "exports". // VideoPlayer() function - what this module "exports".
...@@ -12,7 +12,7 @@ function (HTML5Video) { ...@@ -12,7 +12,7 @@ function (HTML5Video) {
makeFunctionsPublic(state); makeFunctionsPublic(state);
renderElements(state); renderElements(state);
bindHandlers(); // No callbacks to DOM events (click, mousemove, etc.).
}; };
// *************************************************************** // ***************************************************************
...@@ -24,25 +24,25 @@ function (HTML5Video) { ...@@ -24,25 +24,25 @@ function (HTML5Video) {
// Functions which will be accessible via 'state' object. When called, these functions will // Functions which will be accessible via 'state' object. When called, these functions will
// get the 'state' object as a context. // get the 'state' object as a context.
function makeFunctionsPublic(state) { function makeFunctionsPublic(state) {
state.videoPlayer.pause = pause.bind(state); state.videoPlayer.pause = _.bind(pause, state);
state.videoPlayer.play = play.bind(state); state.videoPlayer.play = _.bind(play, state);
state.videoPlayer.update = update.bind(state); state.videoPlayer.update = _.bind(update, state);
state.videoPlayer.onSpeedChange = onSpeedChange.bind(state); state.videoPlayer.onSpeedChange = _.bind(onSpeedChange, state);
state.videoPlayer.onCaptionSeek = onSeek.bind(state); state.videoPlayer.onCaptionSeek = _.bind(onSeek, state);
state.videoPlayer.onSlideSeek = onSeek.bind(state); state.videoPlayer.onSlideSeek = _.bind(onSeek, state);
state.videoPlayer.onEnded = onEnded.bind(state); state.videoPlayer.onEnded = _.bind(onEnded, state);
state.videoPlayer.onPause = onPause.bind(state); state.videoPlayer.onPause = _.bind(onPause, state);
state.videoPlayer.onPlay = onPlay.bind(state); state.videoPlayer.onPlay = _.bind(onPlay, state);
state.videoPlayer.onUnstarted = onUnstarted.bind(state); state.videoPlayer.onUnstarted = _.bind(onUnstarted, state);
state.videoPlayer.handlePlaybackQualityChange = handlePlaybackQualityChange.bind(state); state.videoPlayer.handlePlaybackQualityChange = _.bind(handlePlaybackQualityChange, state);
state.videoPlayer.onPlaybackQualityChange = onPlaybackQualityChange.bind(state); state.videoPlayer.onPlaybackQualityChange = _.bind(onPlaybackQualityChange, state);
state.videoPlayer.onStateChange = onStateChange.bind(state); state.videoPlayer.onStateChange = _.bind(onStateChange, state);
state.videoPlayer.onReady = onReady.bind(state); state.videoPlayer.onReady = _.bind(onReady, state);
state.videoPlayer.updatePlayTime = updatePlayTime.bind(state); state.videoPlayer.updatePlayTime = _.bind(updatePlayTime, state);
state.videoPlayer.isPlaying = isPlaying.bind(state); state.videoPlayer.isPlaying = _.bind(isPlaying, state);
state.videoPlayer.log = log.bind(state); state.videoPlayer.log = _.bind(log, state);
state.videoPlayer.duration = duration.bind(state); state.videoPlayer.duration = _.bind(duration, state);
state.videoPlayer.onVolumeChange = onVolumeChange.bind(state); state.videoPlayer.onVolumeChange = _.bind(onVolumeChange, state);
} }
// function renderElements(state) // function renderElements(state)
...@@ -123,19 +123,12 @@ function (HTML5Video) { ...@@ -123,19 +123,12 @@ function (HTML5Video) {
} }
} }
// function bindHandlers(state) // function restartUsingFlash(state)
//
// Bind any necessary function callbacks to DOM events (click, mousemove, etc.).
function bindHandlers() {
}
// function reinitAsFlash(state)
// //
// When we are about to play a YouTube video in HTML5 mode and discover that we only // When we are about to play a YouTube video in HTML5 mode and discover that we only
// have one available playback rate, we will switch to Flash mode. In Flash speed // have one available playback rate, we will switch to Flash mode. In Flash speed
// switching is done by reloading videos recorded at differtn frame rates. // switching is done by reloading videos recorded at different frame rates.
function reinitAsFlash(state) { function restartUsingFlash(state) {
// Remove from the page current iFrame with HTML5 video. // Remove from the page current iFrame with HTML5 video.
state.videoPlayer.player.destroy(); state.videoPlayer.player.destroy();
...@@ -149,7 +142,7 @@ function (HTML5Video) { ...@@ -149,7 +142,7 @@ function (HTML5Video) {
// Removed configuration option that requests the HTML5 mode. // Removed configuration option that requests the HTML5 mode.
delete state.videoPlayer.playerVars.html5; delete state.videoPlayer.playerVars.html5;
// Reuqest for the creation of a new Flash player // Request for the creation of a new Flash player
state.videoPlayer.player = new YT.Player(state.id, { state.videoPlayer.player = new YT.Player(state.id, {
'playerVars': state.videoPlayer.playerVars, 'playerVars': state.videoPlayer.playerVars,
'videoId': state.youtubeId(), 'videoId': state.youtubeId(),
...@@ -179,6 +172,9 @@ function (HTML5Video) { ...@@ -179,6 +172,9 @@ function (HTML5Video) {
} }
} }
// This function gets the video's current play position in time
// (currentTime) and its duration.
// It is called at a regular interval when the video is playing (see below).
function update() { function update() {
this.videoPlayer.currentTime = this.videoPlayer.player.getCurrentTime(); this.videoPlayer.currentTime = this.videoPlayer.player.getCurrentTime();
...@@ -187,11 +183,6 @@ function (HTML5Video) { ...@@ -187,11 +183,6 @@ function (HTML5Video) {
} }
} }
// We request the reloading of the video in the case when YouTube is in
// Flash player mode, or when we are in Firefox, and the new speed is 1.0.
// The second case is necessary to avoid the bug where in Firefox speed
// switching to 1.0 in HTML5 player mode is handled incorrectly by YouTube
// API.
function onSpeedChange(newSpeed, updateCookie) { function onSpeedChange(newSpeed, updateCookie) {
if (this.currentPlayerMode === 'flash') { if (this.currentPlayerMode === 'flash') {
this.videoPlayer.currentTime = Time.convert( this.videoPlayer.currentTime = Time.convert(
...@@ -218,7 +209,12 @@ function (HTML5Video) { ...@@ -218,7 +209,12 @@ function (HTML5Video) {
!(this.browserIsFirefox && newSpeed === '1.0' && this.videoType === 'youtube') !(this.browserIsFirefox && newSpeed === '1.0' && this.videoType === 'youtube')
) { ) {
this.videoPlayer.player.setPlaybackRate(newSpeed); this.videoPlayer.player.setPlaybackRate(newSpeed);
} else { // if (this.currentPlayerMode === 'flash') { } else {
// We request the reloading of the video in the case when YouTube is in
// Flash player mode, or when we are in Firefox, and the new speed is 1.0.
// The second case is necessary to avoid the bug where in Firefox speed
// switching to 1.0 in HTML5 player mode is handled incorrectly by YouTube
// API.
if (this.videoPlayer.isPlaying()) { if (this.videoPlayer.isPlaying()) {
this.videoPlayer.player.loadVideoById(this.youtubeId(), this.videoPlayer.currentTime); this.videoPlayer.player.loadVideoById(this.youtubeId(), this.videoPlayer.currentTime);
} else { } else {
...@@ -229,6 +225,10 @@ function (HTML5Video) { ...@@ -229,6 +225,10 @@ function (HTML5Video) {
} }
} }
// Every 200 ms, if the video is playing, we call the function update, via
// clearInterval. This interval is called updateInterval.
// It is created on a onPlay event. Cleared on a onPause event.
// Reinitialized on a onSeek event.
function onSeek(params) { function onSeek(params) {
this.videoPlayer.log( this.videoPlayer.log(
'seek_video', 'seek_video',
...@@ -318,18 +318,24 @@ function (HTML5Video) { ...@@ -318,18 +318,24 @@ function (HTML5Video) {
availablePlaybackRates = this.videoPlayer.player.getAvailablePlaybackRates(); availablePlaybackRates = this.videoPlayer.player.getAvailablePlaybackRates();
if ((this.currentPlayerMode === 'html5') && (this.videoType === 'youtube')) { if ((this.currentPlayerMode === 'html5') && (this.videoType === 'youtube')) {
if (availablePlaybackRates.length === 1) { if (availablePlaybackRates.length === 1) {
reinitAsFlash(this); restartUsingFlash(this);
return; return;
} else if (availablePlaybackRates.length > 1) { } else if (availablePlaybackRates.length > 1) {
// We need to synchronize available frame rates with the ones that the user specified. // We need to synchronize available frame rates with the ones
// that the user specified.
baseSpeedSubs = this.videos['1.0']; baseSpeedSubs = this.videos['1.0'];
_this = this; _this = this;
// this.videos is a dictionary containing various frame rates
// and their associated subs.
// First clear the dictionary.
$.each(this.videos, function(index, value) { $.each(this.videos, function(index, value) {
delete _this.videos[index]; delete _this.videos[index];
}); });
this.speeds = []; this.speeds = [];
// Recreate it with the supplied frame rates.
$.each(availablePlaybackRates, function(index, value) { $.each(availablePlaybackRates, function(index, value) {
_this.videos[value.toFixed(2).replace(/\.00$/, '.0')] = baseSpeedSubs; _this.videos[value.toFixed(2).replace(/\.00$/, '.0')] = baseSpeedSubs;
...@@ -411,10 +417,8 @@ function (HTML5Video) { ...@@ -411,10 +417,8 @@ function (HTML5Video) {
if (this.videoType === 'youtube') { if (this.videoType === 'youtube') {
logInfo.code = this.youtubeId(); logInfo.code = this.youtubeId();
} else { } else if (this.videoType === 'html5') {
if (this.videoType === 'html5') {
logInfo.code = 'html5'; logInfo.code = 'html5';
}
} }
Logger.log(eventName, logInfo); Logger.log(eventName, logInfo);
......
common/lib/xmodule/xmodule/js/src/videoalpha/05_video_control.js → common/lib/xmodule/xmodule/js/src/videoalpha/04_video_control.js
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
// VideoControl module. // VideoControl module.
define( define(
'videoalpha/05_video_control.js', 'videoalpha/04_video_control.js',
[], [],
function () { function () {
...@@ -24,14 +24,14 @@ function () { ...@@ -24,14 +24,14 @@ function () {
// Functions which will be accessible via 'state' object. When called, these functions will // Functions which will be accessible via 'state' object. When called, these functions will
// get the 'state' object as a context. // get the 'state' object as a context.
function makeFunctionsPublic(state) { function makeFunctionsPublic(state) {
state.videoControl.showControls = showControls.bind(state); state.videoControl.showControls = _.bind(showControls,state);
state.videoControl.hideControls = hideControls.bind(state); state.videoControl.hideControls = _.bind(hideControls,state);
state.videoControl.play = play.bind(state); state.videoControl.play = _.bind(play,state);
state.videoControl.pause = pause.bind(state); state.videoControl.pause = _.bind(pause,state);
state.videoControl.togglePlayback = togglePlayback.bind(state); state.videoControl.togglePlayback = _.bind(togglePlayback,state);
state.videoControl.toggleFullScreen = toggleFullScreen.bind(state); state.videoControl.toggleFullScreen = _.bind(toggleFullScreen,state);
state.videoControl.exitFullScreen = exitFullScreen.bind(state); state.videoControl.exitFullScreen = _.bind(exitFullScreen,state);
state.videoControl.updateVcrVidTime = updateVcrVidTime.bind(state); state.videoControl.updateVcrVidTime = _.bind(updateVcrVidTime,state);
} }
// function renderElements(state) // function renderElements(state)
......
common/lib/xmodule/xmodule/js/src/videoalpha/06_video_quality_control.js → common/lib/xmodule/xmodule/js/src/videoalpha/05_video_quality_control.js
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
// VideoQualityControl module. // VideoQualityControl module.
define( define(
'videoalpha/06_video_quality_control.js', 'videoalpha/05_video_quality_control.js',
[], [],
function () { function () {
...@@ -29,8 +29,8 @@ function () { ...@@ -29,8 +29,8 @@ function () {
// Functions which will be accessible via 'state' object. When called, these functions will // Functions which will be accessible via 'state' object. When called, these functions will
// get the 'state' object as a context. // get the 'state' object as a context.
function makeFunctionsPublic(state) { function makeFunctionsPublic(state) {
state.videoQualityControl.onQualityChange = onQualityChange.bind(state); state.videoQualityControl.onQualityChange = _.bind(onQualityChange, state);
state.videoQualityControl.toggleQuality = toggleQuality.bind(state); state.videoQualityControl.toggleQuality = _.bind(toggleQuality, state);
} }
// function renderElements(state) // function renderElements(state)
...@@ -65,7 +65,7 @@ function () { ...@@ -65,7 +65,7 @@ function () {
function onQualityChange(value) { function onQualityChange(value) {
this.videoQualityControl.quality = value; this.videoQualityControl.quality = value;
if (this.config.availableQualities.indexOf(value) !== -1) { if (_.indexOf(this.config.availableQualities, value) !== -1) {
this.videoQualityControl.el.addClass('active'); this.videoQualityControl.el.addClass('active');
} else { } else {
this.videoQualityControl.el.removeClass('active'); this.videoQualityControl.el.removeClass('active');
...@@ -84,7 +84,7 @@ function () { ...@@ -84,7 +84,7 @@ function () {
event.preventDefault(); event.preventDefault();
if (this.config.availableQualities.indexOf(value) !== -1) { if (_.indexOf(this.config.availableQualities, value) !== -1) {
newQuality = 'large'; newQuality = 'large';
} else { } else {
newQuality = 'hd720'; newQuality = 'hd720';
......
common/lib/xmodule/xmodule/js/src/videoalpha/07_video_progress_slider.js → common/lib/xmodule/xmodule/js/src/videoalpha/06_video_progress_slider.js
...@@ -9,7 +9,7 @@ mind, or whether to act, and in acting, to live." ...@@ -9,7 +9,7 @@ mind, or whether to act, and in acting, to live."
// VideoProgressSlider module. // VideoProgressSlider module.
define( define(
'videoalpha/07_video_progress_slider.js', 'videoalpha/06_video_progress_slider.js',
[], [],
function () { function () {
...@@ -31,13 +31,13 @@ function () { ...@@ -31,13 +31,13 @@ function () {
// Functions which will be accessible via 'state' object. When called, these functions will // Functions which will be accessible via 'state' object. When called, these functions will
// get the 'state' object as a context. // get the 'state' object as a context.
function makeFunctionsPublic(state) { function makeFunctionsPublic(state) {
state.videoProgressSlider.onSlide = onSlide.bind(state); state.videoProgressSlider.onSlide = _.bind(onSlide, state);
state.videoProgressSlider.onChange = onChange.bind(state); state.videoProgressSlider.onChange = _.bind(onChange, state);
state.videoProgressSlider.onStop = onStop.bind(state); state.videoProgressSlider.onStop = _.bind(onStop, state);
state.videoProgressSlider.updateTooltip = updateTooltip.bind(state); state.videoProgressSlider.updateTooltip = _.bind(updateTooltip, state);
state.videoProgressSlider.updatePlayTime = updatePlayTime.bind(state); state.videoProgressSlider.updatePlayTime = _.bind(updatePlayTime, state);
//Added for tests -- JM //Added for tests -- JM
state.videoProgressSlider.buildSlider = buildSlider.bind(state); state.videoProgressSlider.buildSlider = _.bind(buildSlider, state);
} }
// function renderElements(state) // function renderElements(state)
......
common/lib/xmodule/xmodule/js/src/videoalpha/08_video_volume_control.js → common/lib/xmodule/xmodule/js/src/videoalpha/07_video_volume_control.js
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
// VideoVolumeControl module. // VideoVolumeControl module.
define( define(
'videoalpha/08_video_volume_control.js', 'videoalpha/07_video_volume_control.js',
[], [],
function () { function () {
...@@ -24,8 +24,8 @@ function () { ...@@ -24,8 +24,8 @@ function () {
// Functions which will be accessible via 'state' object. When called, these functions will // Functions which will be accessible via 'state' object. When called, these functions will
// get the 'state' object as a context. // get the 'state' object as a context.
function makeFunctionsPublic(state) { function makeFunctionsPublic(state) {
state.videoVolumeControl.onChange = onChange.bind(state); state.videoVolumeControl.onChange = _.bind(onChange, state);
state.videoVolumeControl.toggleMute = toggleMute.bind(state); state.videoVolumeControl.toggleMute = _.bind(toggleMute, state);
} }
// function renderElements(state) // function renderElements(state)
......
common/lib/xmodule/xmodule/js/src/videoalpha/09_video_speed_control.js → common/lib/xmodule/xmodule/js/src/videoalpha/08_video_speed_control.js
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
// VideoSpeedControl module. // VideoSpeedControl module.
define( define(
'videoalpha/09_video_speed_control.js', 'videoalpha/08_video_speed_control.js',
[], [],
function () { function () {
...@@ -24,9 +24,9 @@ function () { ...@@ -24,9 +24,9 @@ function () {
// Functions which will be accessible via 'state' object. When called, these functions will // Functions which will be accessible via 'state' object. When called, these functions will
// get the 'state' object as a context. // get the 'state' object as a context.
function makeFunctionsPublic(state) { function makeFunctionsPublic(state) {
state.videoSpeedControl.changeVideoSpeed = changeVideoSpeed.bind(state); state.videoSpeedControl.changeVideoSpeed = _.bind(changeVideoSpeed, state);
state.videoSpeedControl.setSpeed = setSpeed.bind(state); state.videoSpeedControl.setSpeed = _.bind(setSpeed, state);
state.videoSpeedControl.reRender = reRender.bind(state); state.videoSpeedControl.reRender = _.bind(reRender, state);
} }
// function renderElements(state) // function renderElements(state)
......
common/lib/xmodule/xmodule/js/src/videoalpha/10_video_caption.js → common/lib/xmodule/xmodule/js/src/videoalpha/09_video_caption.js
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
// VideoCaption module. // VideoCaption module.
define( define(
'videoalpha/10_video_caption.js', 'videoalpha/09_video_caption.js',
[], [],
function () { function () {
...@@ -24,30 +24,30 @@ function () { ...@@ -24,30 +24,30 @@ function () {
// Functions which will be accessible via 'state' object. When called, these functions will // Functions which will be accessible via 'state' object. When called, these functions will
// get the 'state' object as a context. // get the 'state' object as a context.
function makeFunctionsPublic(state) { function makeFunctionsPublic(state) {
state.videoCaption.autoShowCaptions = autoShowCaptions.bind(state); state.videoCaption.autoShowCaptions = _.bind(autoShowCaptions, state);
state.videoCaption.autoHideCaptions = autoHideCaptions.bind(state); state.videoCaption.autoHideCaptions = _.bind(autoHideCaptions, state);
state.videoCaption.resize = resize.bind(state); state.videoCaption.resize = _.bind(resize, state);
state.videoCaption.toggle = toggle.bind(state); state.videoCaption.toggle = _.bind(toggle, state);
state.videoCaption.onMouseEnter = onMouseEnter.bind(state); state.videoCaption.onMouseEnter = _.bind(onMouseEnter, state);
state.videoCaption.onMouseLeave = onMouseLeave.bind(state); state.videoCaption.onMouseLeave = _.bind(onMouseLeave, state);
state.videoCaption.onMovement = onMovement.bind(state); state.videoCaption.onMovement = _.bind(onMovement, state);
state.videoCaption.renderCaption = renderCaption.bind(state); state.videoCaption.renderCaption = _.bind(renderCaption, state);
state.videoCaption.captionHeight = captionHeight.bind(state); state.videoCaption.captionHeight = _.bind(captionHeight, state);
state.videoCaption.topSpacingHeight = topSpacingHeight.bind(state); state.videoCaption.topSpacingHeight = _.bind(topSpacingHeight, state);
state.videoCaption.bottomSpacingHeight = bottomSpacingHeight.bind(state); state.videoCaption.bottomSpacingHeight = _.bind(bottomSpacingHeight, state);
state.videoCaption.scrollCaption = scrollCaption.bind(state); state.videoCaption.scrollCaption = _.bind(scrollCaption, state);
state.videoCaption.search = search.bind(state); state.videoCaption.search = _.bind(search, state);
state.videoCaption.play = play.bind(state); state.videoCaption.play = _.bind(play, state);
state.videoCaption.pause = pause.bind(state); state.videoCaption.pause = _.bind(pause, state);
state.videoCaption.seekPlayer = seekPlayer.bind(state); state.videoCaption.seekPlayer = _.bind(seekPlayer, state);
state.videoCaption.hideCaptions = hideCaptions.bind(state); state.videoCaption.hideCaptions = _.bind(hideCaptions, state);
state.videoCaption.calculateOffset = calculateOffset.bind(state); state.videoCaption.calculateOffset = _.bind(calculateOffset, state);
state.videoCaption.updatePlayTime = updatePlayTime.bind(state); state.videoCaption.updatePlayTime = _.bind(updatePlayTime, state);
state.videoCaption.renderElements = renderElements.bind(state); state.videoCaption.renderElements = _.bind(renderElements, state);
state.videoCaption.bindHandlers = bindHandlers.bind(state); state.videoCaption.bindHandlers = _.bind(bindHandlers, state);
state.videoCaption.fetchCaption = fetchCaption.bind(state); state.videoCaption.fetchCaption = _.bind(fetchCaption, state);
state.videoCaption.captionURL = captionURL.bind(state); state.videoCaption.captionURL = _.bind(captionURL, state);
} }
// function renderElements() // function renderElements()
...@@ -109,27 +109,27 @@ function () { ...@@ -109,27 +109,27 @@ function () {
} }
function fetchCaption() { function fetchCaption() {
var _this = this, jQueryObject; var _this = this;
this.videoCaption.hideCaptions(this.hide_captions); this.videoCaption.hideCaptions(this.hide_captions);
jQueryObject = $.getWithPrefix(this.videoCaption.captionURL(), function(captions) { $.ajaxWithPrefix({
_this.videoCaption.captions = captions.text; url: _this.videoCaption.captionURL(),
_this.videoCaption.start = captions.start; notifyOnError: false,
_this.videoCaption.loaded = true; success: function(captions) {
_this.videoCaption.captions = captions.text;
if (onTouchBasedDevice()) { _this.videoCaption.start = captions.start;
_this.videoCaption.subtitlesEl.find('li').html( _this.videoCaption.loaded = true;
'Caption will be displayed when you start playing the video.'
); if (onTouchBasedDevice()) {
} else { _this.videoCaption.subtitlesEl.find('li').html(
_this.videoCaption.renderCaption(); 'Caption will be displayed when you start playing the video.'
);
} else {
_this.videoCaption.renderCaption();
}
} }
}); });
if (typeof jQueryObject === 'undefined') {
console.error('Subtitles not found. Upload subtitles to server!');
}
} }
function captionURL() { function captionURL() {
......
common/lib/xmodule/xmodule/js/src/videoalpha/11_main.js → common/lib/xmodule/xmodule/js/src/videoalpha/10_main.js
...@@ -3,13 +3,13 @@ ...@@ -3,13 +3,13 @@
// Main module. // Main module.
require( require(
[ [
'videoalpha/02_initialize.js', 'videoalpha/01_initialize.js',
'videoalpha/05_video_control.js', 'videoalpha/04_video_control.js',
'videoalpha/06_video_quality_control.js', 'videoalpha/05_video_quality_control.js',
'videoalpha/07_video_progress_slider.js', 'videoalpha/06_video_progress_slider.js',
'videoalpha/08_video_volume_control.js', 'videoalpha/07_video_volume_control.js',
'videoalpha/09_video_speed_control.js', 'videoalpha/08_video_speed_control.js',
'videoalpha/10_video_caption.js' 'videoalpha/09_video_caption.js'
], ],
function ( function (
Initialize, Initialize,
......
common/lib/xmodule/xmodule/videoalpha_module.py
...@@ -69,17 +69,16 @@ class VideoAlphaModule(VideoAlphaFields, XModule): ...@@ -69,17 +69,16 @@ class VideoAlphaModule(VideoAlphaFields, XModule):
js = { js = {
'js': [ 'js': [
resource_string(__name__, 'js/src/videoalpha/01_helper_utils.js'), resource_string(__name__, 'js/src/videoalpha/01_initialize.js'),
resource_string(__name__, 'js/src/videoalpha/02_initialize.js'), resource_string(__name__, 'js/src/videoalpha/02_html5_video.js'),
resource_string(__name__, 'js/src/videoalpha/03_html5_video.js'), resource_string(__name__, 'js/src/videoalpha/03_video_player.js'),
resource_string(__name__, 'js/src/videoalpha/04_video_player.js'), resource_string(__name__, 'js/src/videoalpha/04_video_control.js'),
resource_string(__name__, 'js/src/videoalpha/05_video_control.js'), resource_string(__name__, 'js/src/videoalpha/05_video_quality_control.js'),
resource_string(__name__, 'js/src/videoalpha/06_video_quality_control.js'), resource_string(__name__, 'js/src/videoalpha/06_video_progress_slider.js'),
resource_string(__name__, 'js/src/videoalpha/07_video_progress_slider.js'), resource_string(__name__, 'js/src/videoalpha/07_video_volume_control.js'),
resource_string(__name__, 'js/src/videoalpha/08_video_volume_control.js'), resource_string(__name__, 'js/src/videoalpha/08_video_speed_control.js'),
resource_string(__name__, 'js/src/videoalpha/09_video_speed_control.js'), resource_string(__name__, 'js/src/videoalpha/09_video_caption.js'),
resource_string(__name__, 'js/src/videoalpha/10_video_caption.js'), resource_string(__name__, 'js/src/videoalpha/10_main.js')
resource_string(__name__, 'js/src/videoalpha/11_main.js')
] ]
} }
css = {'scss': [resource_string(__name__, 'css/videoalpha/display.scss')]} css = {'scss': [resource_string(__name__, 'css/videoalpha/display.scss')]}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment