diff --git a/CHANGELOG.rst b/CHANGELOG.rst index 489abfcbd1..49e5841712 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -5,6 +5,11 @@ These are notable changes in edx-platform. This is a rolling list of changes, in roughly chronological order, most recent first. Add your entries at or near the top. Include a label indicating the component affected. +Blades: Hovering over CC button in video player, when transcripts are hidden, +will cause them to show up. Moving the mouse from the CC button will auto hide +them. You can hover over the CC button and then move the mouse to the +transcripts which will allow you to select some video position in 1 click. + Blades: Add possibility to use multiple LTI tools per page. Blades: LTI module can now load external content in a new window. diff --git a/cms/djangoapps/contentstore/features/component_settings_editor_helpers.py b/cms/djangoapps/contentstore/features/component_settings_editor_helpers.py index 9881290eba..63dba91a15 100644 --- a/cms/djangoapps/contentstore/features/component_settings_editor_helpers.py +++ b/cms/djangoapps/contentstore/features/component_settings_editor_helpers.py @@ -35,7 +35,7 @@ def click_new_component_button(step, component_button_css): step.given('I have clicked the new unit button') world.wait_for_requirejs( ["jquery", "js/models/course", "coffee/src/models/module", - "coffee/src/views/unit", "jquery.ui"] + "coffee/src/views/unit", "jquery.ui", "domReady!"] ) world.css_click(component_button_css) diff --git a/common/lib/xmodule/xmodule/css/video/display.scss b/common/lib/xmodule/xmodule/css/video/display.scss index 1411ac5707..ed0131c54c 100644 --- a/common/lib/xmodule/xmodule/css/video/display.scss +++ b/common/lib/xmodule/xmodule/css/video/display.scss @@ -638,8 +638,6 @@ div.video { ol.subtitles { width: 0; height: 0; - - visibility: hidden; } ol.subtitles.html5 { @@ -673,8 +671,6 @@ div.video { ol.subtitles { right: -(flex-grid(4)); width: auto; - - visibility: hidden; } } diff --git a/common/lib/xmodule/xmodule/js/src/video/09_video_caption.js b/common/lib/xmodule/xmodule/js/src/video/09_video_caption.js index f9efbdecb5..21cc64e81c 100644 --- a/common/lib/xmodule/xmodule/js/src/video/09_video_caption.js +++ b/common/lib/xmodule/xmodule/js/src/video/09_video_caption.js @@ -182,7 +182,6 @@ function () { this.videoCaption.hideSubtitlesEl.on({ mousemove: this.videoCaption.autoShowCaptions, - focus: this.videoCaption.autoShowCaptions, mouseout: this.videoCaption.autoHideCaptions, blur: this.videoCaption.autoHideCaptions @@ -677,6 +676,7 @@ function () { event.preventDefault(); if (this.el.hasClass('closed')) { + this.videoCaption.autoShowCaptions(); this.videoCaption.hideCaptions(false); } else { this.videoCaption.hideCaptions(true); 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 df81ba898e..9f20a1c87e 100644 --- a/common/lib/xmodule/xmodule/js/src/video/10_main.js +++ b/common/lib/xmodule/xmodule/js/src/video/10_main.js @@ -1,5 +1,42 @@ (function (requirejs, require, define) { +// 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 = []; + + 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); + }); + + return; + } + + // If normal call to `window.Video` constructor, store the element + // for later initializing. + tempCallStack.push(element); + + // Real Video constructor returns the `state` object. The mock + // function will return an empty object. + return {}; + }; +}()); + // Main module. require( [ @@ -23,7 +60,8 @@ function ( VideoCaption ) { var previousState, - youtubeXhr = null; + youtubeXhr = null, + oldVideo = window.Video; // 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 @@ -79,6 +117,10 @@ function ( 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));