diff --git a/common/lib/xmodule/xmodule/js/src/video/10_main.js b/common/lib/xmodule/xmodule/js/src/video/10_main.js index 2721cd2a43..4d3b8b1363 100644 --- a/common/lib/xmodule/xmodule/js/src/video/10_main.js +++ b/common/lib/xmodule/xmodule/js/src/video/10_main.js @@ -1,93 +1,61 @@ -(function (requirejs, require, define) { +/*jslint + browser: true, white: false, indent: 4, maxlen: 120 +*/ -// In the case when the Video constructor will be called before -// RequireJS finishes loading all of the Video dependencies, we will have -// a mock function that will collect all the elements that must be -// initialized as Video elements. -// -// Once RequireJS will load all of the necessary dependencies, main code -// will invoke the mock function with the second parameter set to truthy value. -// This will trigger the actual Video constructor on all elements that -// are stored in a temporary list. -window.Video = (function () { - // Temporary storage place for elements that must be initialized as Video - // elements. - var tempCallStack = []; +/*properties + RequireJS, Video, clearYoutubeXhr, data, each, find, jQuery, modules, off, + push, require, saveState, videoPlayer, youtubeXhr +*/ - return function (element, processTempCallStack) { - // If mock function was called with second parameter set to truthy - // value, we invoke the real `window.Video` on all the stored elements - // so far. - if (processTempCallStack) { - $.each(tempCallStack, function (index, element) { - // By now, `window.Video` is the real constructor. - window.Video(element); - }); +(function (require, $) { + 'use strict'; - return; - } + // In the case when the Video constructor will be called before RequireJS finishes loading all of the Video + // dependencies, we will have a mock function that will collect all the elements that must be initialized as + // Video elements. + // + // Once RequireJS will load all of the necessary dependencies, main code will invoke the mock function with + // the second parameter set to truthy value. This will trigger the actual Video constructor on all elements + // that are stored in a temporary list. + window.Video = (function () { + // Temporary storage place for elements that must be initialized as Video elements. + var tempCallStack = []; - // If normal call to `window.Video` constructor, store the element - // for later initializing. - tempCallStack.push(element); + return function (element, processTempCallStack) { + // If mock function was called with second parameter set to truthy value, we invoke the real `window.Video` + // on all the stored elements so far. + if (processTempCallStack) { + $.each(tempCallStack, function (index, element) { + // By now, `window.Video` is the real constructor. + window.Video(element); + }); - // Real Video constructor returns the `state` object. The mock - // function will return an empty object. - return {}; - }; -}()); + return; + } -// Main module. -require( -[ - 'video/01_initialize.js', - 'video/025_focus_grabber.js', - 'video/035_video_accessible_menu.js', - 'video/04_video_control.js', - 'video/05_video_quality_control.js', - 'video/06_video_progress_slider.js', - 'video/07_video_volume_control.js', - 'video/08_video_speed_control.js', - 'video/09_video_caption.js' -], -function ( - Initialize, - FocusGrabber, - VideoAccessibleMenu, - VideoControl, - VideoQualityControl, - VideoProgressSlider, - VideoVolumeControl, - VideoSpeedControl, - VideoCaption -) { - var previousState, - youtubeXhr = null, - oldVideo = window.Video; + // If normal call to `window.Video` constructor, store the element for later initializing. + tempCallStack.push(element); - // Because this constructor can be called multiple times on a single page (when - // the user switches verticals, the page doesn't reload, but the content changes), we must - // will check each time if there is a previous copy of 'state' object. If there is, we - // will make sure that copy exists cleanly. We have to do this because when verticals switch, - // the code does not handle any Xmodule JS code that is running - it simply removes DOM - // elements from the page. Any functions that were running during this, and that will run - // afterwards (expecting the DOM elements to be present) must be stopped by hand. - previousState = null; + // Real Video constructor returns the `state` object. The mock function will return an empty object. + return {}; + }; + }()); - window.Video = function (element) { - var state; - - // Check for existance of previous state, uninitialize it if necessary, and create a new state. - // Store new state for future invocation of this module consturctor function. - if (previousState && previousState.videoPlayer) { - previousState.saveState(true); - $(window).off('unload', previousState.saveState); - } - - state = {}; - previousState = state; - - state.modules = [ + // Main module. + require( + [ + 'video/01_initialize.js', + 'video/025_focus_grabber.js', + 'video/035_video_accessible_menu.js', + 'video/04_video_control.js', + 'video/05_video_quality_control.js', + 'video/06_video_progress_slider.js', + 'video/07_video_volume_control.js', + 'video/08_video_speed_control.js', + 'video/09_video_caption.js' + ], + function ( + initialize, FocusGrabber, VideoAccessibleMenu, VideoControl, @@ -96,29 +64,62 @@ function ( VideoVolumeControl, VideoSpeedControl, VideoCaption - ]; + ) { + var youtubeXhr = null, + oldVideo = window.Video, - state.youtubeXhr = youtubeXhr; - Initialize(state, element); - if (!youtubeXhr) { - youtubeXhr = state.youtubeXhr; + // Because this constructor can be called multiple times on a single page (when the user switches + // verticals, the page doesn't reload, but the content changes), we must will check each time if there + // is a previous copy of 'state' object. If there is, we will make sure that copy exists cleanly. We + // have to do this because when verticals switch, the code does not handle any Xmodule JS code that is + // running - it simply removes DOM elements from the page. Any functions that were running during this, + // and that will run afterwards (expecting the DOM elements to be present) must be stopped by hand. + previousState = null; + + window.Video = function (element) { + var state; + + // Check for existance of previous state, uninitialize it if necessary, and create a new state. Store + // new state for future invocation of this module consturctor function. + if (previousState && previousState.videoPlayer) { + previousState.saveState(true); + $(window).off('unload', previousState.saveState); + } + + state = {}; + previousState = state; + + state.modules = [ + FocusGrabber, + VideoAccessibleMenu, + VideoControl, + VideoQualityControl, + VideoProgressSlider, + VideoVolumeControl, + VideoSpeedControl, + VideoCaption + ]; + + state.youtubeXhr = youtubeXhr; + initialize(state, element); + if (!youtubeXhr) { + youtubeXhr = state.youtubeXhr; + } + + $(element).find('.video').data('video-player-state', state); + + // Because the 'state' object is only available inside this closure, we will also make it available to + // the caller by returning it. This is necessary so that we can test Video with Jasmine. + return state; + }; + + window.Video.clearYoutubeXhr = function () { + youtubeXhr = null; + }; + + // Invoke the mock Video constructor so that the elements stored within it can be processed by the real + // `window.Video` constructor. + oldVideo(null, true); } - - $(element).find('.video').data('video-player-state', state); - - // Because the 'state' object is only available inside this closure, we will also make - // it available to the caller by returning it. This is necessary so that we can test - // Video with Jasmine. - return state; - }; - - window.Video.clearYoutubeXhr = function () { - youtubeXhr = null; - }; - - // Invoke the mock Video constructor so that the elements stored within - // it can be processed by the real `window.Video` constructor. - oldVideo(null, true); -}); - -}(RequireJS.requirejs, RequireJS.require, RequireJS.define)); + ); +}(window.RequireJS.require, window.jQuery));