diff --git a/cms/djangoapps/contentstore/views/tests/test_videos.py b/cms/djangoapps/contentstore/views/tests/test_videos.py index d02835a7a2..5bdcf6f7e7 100644 --- a/cms/djangoapps/contentstore/views/tests/test_videos.py +++ b/cms/djangoapps/contentstore/views/tests/test_videos.py @@ -13,7 +13,7 @@ import ddt import pytz from django.conf import settings from django.test.utils import override_settings -from edxval.api import create_profile, create_video, get_video_info +from edxval.api import create_profile, create_video, get_video_info, get_course_video_image_url from mock import Mock, patch from contentstore.models import VideoUploadConfig diff --git a/cms/static/js/views/video_thumbnail.js b/cms/static/js/views/video_thumbnail.js index ec757a891e..ee94c27978 100644 --- a/cms/static/js/views/video_thumbnail.js +++ b/cms/static/js/views/video_thumbnail.js @@ -28,7 +28,7 @@ define( icon: '', text: HtmlUtils.interpolateHtml( // Translators: This is a 3 part text which tells the image requirements. - gettext('Image requirements {lineBreak} 1280px by 720px {lineBreak} .jpg | .png | .gif'), + gettext('Image requirements: {lineBreak} 1280px by 720px {lineBreak} .jpg, .png, or .gif'), { lineBreak: HtmlUtils.HTML('
') } @@ -208,7 +208,10 @@ define( this.$('.thumbnail-action .action-icon'), HtmlUtils.HTML(this.actionsInfo[action].icon) ); - this.$('.thumbnail-action .action-text').html(this.actionsInfo[action].text); + HtmlUtils.setHtml( + this.$('.thumbnail-action .action-text'), + HtmlUtils.HTML(this.actionsInfo[action].text) + ); this.$('.thumbnail-action .action-text-sr').text(additionalSRText || ''); this.$('.thumbnail-wrapper').attr('class', 'thumbnail-wrapper {action}'.replace('{action}', action)); }, diff --git a/cms/static/sass/views/_video-upload.scss b/cms/static/sass/views/_video-upload.scss index 4d2a1bd1b7..af1d25081f 100644 --- a/cms/static/sass/views/_video-upload.scss +++ b/cms/static/sass/views/_video-upload.scss @@ -147,6 +147,11 @@ } .assets-library { + + .js-table-body .video-id-col { + word-break: break-all; + } + .assets-title { display: inline-block; width: flex-grid(5, 9); diff --git a/common/lib/xmodule/xmodule/js/fixtures/video_hls.html b/common/lib/xmodule/xmodule/js/fixtures/video_hls.html index f0742ca8ee..e5347b67db 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/video_hls.html +++ b/common/lib/xmodule/xmodule/js/fixtures/video_hls.html @@ -4,7 +4,7 @@
diff --git a/common/lib/xmodule/xmodule/js/fixtures/video_html5.html b/common/lib/xmodule/xmodule/js/fixtures/video_html5.html index 4e2a9dba0a..c199efd959 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/video_html5.html +++ b/common/lib/xmodule/xmodule/js/fixtures/video_html5.html @@ -4,7 +4,7 @@
diff --git a/common/lib/xmodule/xmodule/js/spec/video/html5_video_spec.js b/common/lib/xmodule/xmodule/js/spec/video/html5_video_spec.js index 5f23f4338b..f9775d81aa 100644 --- a/common/lib/xmodule/xmodule/js/spec/video/html5_video_spec.js +++ b/common/lib/xmodule/xmodule/js/spec/video/html5_video_spec.js @@ -4,7 +4,8 @@ var state, oldOTBD, playbackRates = [0.75, 1.0, 1.25, 1.5], - describeInfo; + describeInfo, + POSTER_URL = '/media/video-images/poster.png'; beforeEach(function() { oldOTBD = window.onTouchBasedDevice; @@ -320,6 +321,15 @@ }).done(done); }); }); + + describe('poster', function() { + it('has url in player config', function() { + expect(state.videoPlayer.player.config.poster).toEqual(POSTER_URL); + expect(state.videoPlayer.player.videoEl).toHaveAttrs({ + poster: POSTER_URL + }); + }); + }); }); describe('non-hls encoding', function() { @@ -338,6 +348,28 @@ jasmine.getEnv().describe(describeInfo.description, describeInfo.specDefinitions); }); + it('does not show poster for html5 video if url is not present', function() { + state = jasmine.initializePlayer( + 'video_html5.html', + { + poster: null + } + ); + expect(state.videoPlayer.player.config.poster).toEqual(null); + expect(state.videoPlayer.player.videoEl).not.toHaveAttr('poster'); + }); + + it('does not show poster for hls video if url is not present', function() { + state = jasmine.initializePlayer( + 'video_hls.html', + { + poster: null + } + ); + expect(state.videoPlayer.player.config.poster).toEqual(null); + expect(state.videoPlayer.player.videoEl).not.toHaveAttr('poster'); + }); + it('native controls are used on iPhone', function() { window.onTouchBasedDevice.and.returnValue(['iPhone']); diff --git a/common/lib/xmodule/xmodule/js/src/video/02_html5_video.js b/common/lib/xmodule/xmodule/js/src/video/02_html5_video.js index 49387481a8..367939e21a 100644 --- a/common/lib/xmodule/xmodule/js/src/video/02_html5_video.js +++ b/common/lib/xmodule/xmodule/js/src/video/02_html5_video.js @@ -44,8 +44,11 @@ function(_) { * // video format of the source. Supported * // video formats are: 'mp4', 'webm', and * // 'ogg'. + * poster: Video poster URL * - * events: { // Object's properties identify the + * browserIsSafari: Flag to tell if current browser is Safari + * + * events: { // Object's properties identify the * // events that the API fires, and the * // functions (event listeners) that the * // API will call when those events occur. @@ -320,6 +323,11 @@ function(_) { this.videoEl.prop('controls', true); } + // Set video poster + if (this.config.poster) { + this.videoEl.prop('poster', this.config.poster); + } + // Place the