Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix multiple videos on page #3122

Closed
wants to merge 2 commits into from
Closed

Fix multiple videos on page #3122

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
457b44a
Fix multiple videos on page
Mar 29, 2014
842b914
Adding acceptance test for multiple videos.
Mar 29, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
67 changes: 61 additions & 6 deletions common/lib/xmodule/xmodule/js/src/video/01_initialize.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,10 @@ function (VideoPlayer, VideoStorage) {
setSpeed: setSpeed,
trigger: trigger,
youtubeId: youtubeId
};
},

_youtubeApiDeferred = null,
_oldOnYouTubeIframeAPIReady;

Initialize.prototype = methodsDict;

Expand Down Expand Up @@ -112,7 +115,7 @@ function (VideoPlayer, VideoStorage) {
// Require JS. At the time when we reach this code, the stand alone
// HTML5 player is already loaded, so no further testing in that case
// is required.
var video, onYTApiReady;
var video, onYTApiReady, setupOnYouTubeIframeAPIReady;

if (state.videoType === 'youtube') {
state.youtubeApiAvailable = false;
Expand All @@ -129,13 +132,65 @@ function (VideoPlayer, VideoStorage) {
};

if (window.YT) {
window.YT.ready(onYTApiReady);
} else {
window.onYouTubeIframeAPIReady = function () {
// If we have a Deferred object responsible for calling OnYouTubeIframeAPIReady
// callbacks, make sure that they have all been called by trying to resolve the
// Deferred object. Upon resolving, all the OnYouTubeIframeAPIReady will be
// called. If the object has been already resolved, the callbacks will not
// be called a second time.
if (_youtubeApiDeferred) {
_youtubeApiDeferred.resolve();
}

window.YT.ready(function () {
onYTApiReady();
});
} else {
// There is only one global variable window.onYouTubeIframeAPIReady which
// is supposed to be a function that will be called by the YouTube API
// when it finished initializing. This function will update this global function
// so that it resolves our Deferred object, which will call all of the
// OnYouTubeIframeAPIReady callbacks.
//
// If this global function is already defined, we store it first, and make
// sure that it gets executed when our Deferred object is resolved.
setupOnYouTubeIframeAPIReady = function () {
_oldOnYouTubeIframeAPIReady = window.onYouTubeIframeAPIReady || undefined;

window.onYouTubeIframeAPIReady = function () {
window.onYouTubeIframeAPIReady.resolve();
};

window.onYouTubeIframeAPIReady.resolve = _youtubeApiDeferred.resolve;
window.onYouTubeIframeAPIReady.done = _youtubeApiDeferred.done;

if (_oldOnYouTubeIframeAPIReady) {
window.onYouTubeIframeAPIReady.done(_oldOnYouTubeIframeAPIReady);
}
};

_loadYoutubeApi(state);
// If a Deferred object hasn't been created yet, create one now. It will
// be responsible for calling OnYouTubeIframeAPIReady callbacks once the
// YouTube API loads. After creating the Deferred object, load the YouTube
// API.
if (!_youtubeApiDeferred) {
_youtubeApiDeferred = $.Deferred();
setupOnYouTubeIframeAPIReady();
_loadYoutubeApi(state);
} else if (!window.onYouTubeIframeAPIReady || !window.onYouTubeIframeAPIReady.done) {
// The Deferred object could have been already defined in a previous
// initialization of the video module. However, since then the global variable
// window.onYouTubeIframeAPIReady could have been overwritten. If so,
// we should set it up again.
setupOnYouTubeIframeAPIReady();
}

// Attach a callback to our Deferred object to be called once the
// YouTube API loads.
window.onYouTubeIframeAPIReady.done(function () {
window.YT.ready(function () {
onYTApiReady();
});
});
}
} else {
video = VideoPlayer(state);
Expand Down
46 changes: 34 additions & 12 deletions lms/djangoapps/courseware/features/video.feature
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,49 +14,71 @@ Feature: LMS Video component
# And I click video button "play"
# Then I see video starts playing from "0:10" position

# 2
# 1
Scenario: Video component is fully rendered in the LMS in HTML5 mode
Given the course has a Video component in "HTML5" mode
When the video has rendered in "HTML5" mode
And all sources are correct

# 3
# 2
@skip_firefox
Scenario: Autoplay is disabled in LMS for a Video component
Given the course has a Video component in "HTML5" mode
Then when I view the video it does not have autoplay enabled

# 4
# 3
# Youtube testing
Scenario: Video component is fully rendered in the LMS in Youtube mode with HTML5 sources
Given youtube server is up and response time is 0.4 seconds
And the course has a Video component in "Youtube_HTML5" mode
When the video has rendered in "Youtube" mode

# 5
# 4
Scenario: Video component is not rendered in the LMS in Youtube mode with HTML5 sources
Given youtube server is up and response time is 2 seconds
And the course has a Video component in "Youtube_HTML5" mode
When the video has rendered in "HTML5" mode

# 6
# 5
Scenario: Video component is rendered in the LMS in Youtube mode without HTML5 sources
Given youtube server is up and response time is 2 seconds
And the course has a Video component in "Youtube" mode
When the video has rendered in "Youtube" mode

# 7
# 6
Scenario: Video component is rendered in the LMS in Youtube mode with HTML5 sources that doesn't supported by browser
Given youtube server is up and response time is 2 seconds
And the course has a Video component in "Youtube_HTML5_Unsupported_Video" mode
When the video has rendered in "Youtube" mode

# 8
# 7
Scenario: Video component is rendered in the LMS in HTML5 mode with HTML5 sources that doesn't supported by browser
Given the course has a Video component in "HTML5_Unsupported_Video" mode
Then error message is shown
And error message has correct text

# 8
Scenario: Multiple videos in sequentials all load and work, switching between sequentials
Given I am registered for the course "test_course"
And it has a video "A" in "Youtube" mode in position "1" of sequential
And a video "B" in "HTML5" mode in position "1" of sequential
And a video "C" in "Youtube" mode in position "1" of sequential
And a video "D" in "Youtube" mode in position "1" of sequential
And a video "E" in "Youtube" mode in position "2" of sequential
And a video "F" in "Youtube" mode in position "2" of sequential
And a video "G" in "Youtube" mode in position "2" of sequential
And I open the section with videos
Then video "A" should start playing at speed "1.0"
And I select the "2.0" speed on video "B"
And I select the "2.0" speed on video "C"
And I select the "2.0" speed on video "D"
When I open video "E"
Then video "E" should start playing at speed "2.0"
And I select the "1.0" speed on video "F"
And I select the "1.0" speed on video "G"
When I open video "A"
Then video "A" should start playing at speed "2.0"

# 9
Scenario: Video component stores speed correctly when each video is in separate sequence
Given I am registered for the course "test_course"
Expand Down Expand Up @@ -205,7 +227,7 @@ Feature: LMS Video component
# Then I see "Hi, welcome to Edx." text in the captions
# And I see duration "1:00"

# 21
# 20
Scenario: Download button works correctly for non-english transcript in Youtube mode of Video component
Given I am registered for the course "test_course"
And I have a "chinese_transcripts.srt" transcript file in assets
Expand All @@ -218,7 +240,7 @@ Feature: LMS Video component
And I see "好 各位同学" text in the captions
Then I can download transcript in "srt" format that has text "好 各位同学"

# 22
# 21
Scenario: Download button works correctly for non-english transcript in HTML5 mode of Video component
Given I am registered for the course "test_course"
And I have a "chinese_transcripts.srt" transcript file in assets
Expand All @@ -231,7 +253,7 @@ Feature: LMS Video component
And I see "好 各位同学" text in the captions
Then I can download transcript in "srt" format that has text "好 各位同学"

# 23
# 22
Scenario: Download button works correctly w/o english transcript in HTML5 mode of Video component
Given I am registered for the course "test_course"
And I have a "chinese_transcripts.srt" transcript file in assets
Expand All @@ -241,7 +263,7 @@ Feature: LMS Video component
And I see "好 各位同学" text in the captions
Then I can download transcript in "srt" format that has text "好 各位同学"

# 24
# 23
Scenario: Download button works correctly w/o english transcript in Youtube mode of Video component
Given I am registered for the course "test_course"
And I have a "chinese_transcripts.srt" transcript file in assets
Expand All @@ -251,7 +273,7 @@ Feature: LMS Video component
And I see "好 各位同学" text in the captions
Then I can download transcript in "srt" format that has text "好 各位同学"

# 25
# 24
Scenario: Verify that each video in each sub-section includes a transcript for non-Youtube countries.
Given youtube server is up and response time is 2 seconds
And I am registered for the course "test_course"
Expand Down