diff --git a/CHANGELOG.rst b/CHANGELOG.rst index 80ab2a071b..a66cefdce9 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -5,6 +5,14 @@ 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: Video player improvements: + - Disable edX controls on iPhone/iPod (native controls are used). + - Disable unsupported controls (volume, playback rate) on iPad/Android. + - Controls becomes visible after click on video or play placeholder to avoid + issues with YouTube API on iPad/Android. + - Captions becomes visible just after full initialization of video player. + - Fix blinking of captions after initialization of video player. BLD-206. + LMS: Fix answer distribution download for small courses. LMS-922, LMS-811 Blades: Add template for the zooming image in studio. BLD-206. diff --git a/cms/djangoapps/contentstore/features/video.py b/cms/djangoapps/contentstore/features/video.py index a293b13727..2a86222584 100644 --- a/cms/djangoapps/contentstore/features/video.py +++ b/cms/djangoapps/contentstore/features/video.py @@ -141,12 +141,13 @@ def the_youtube_video_is_shown(_step): @step('Make sure captions are (.+)$') def set_captions_visibility_state(_step, captions_state): SELECTOR = '.closed .subtitles' + world.wait_for_visible('.hide-subtitles') if captions_state == 'closed': if not world.is_css_present(SELECTOR): - world.browser.find_by_css('.hide-subtitles').click() + world.css_find('.hide-subtitles').click() else: if world.is_css_present(SELECTOR): - world.browser.find_by_css('.hide-subtitles').click() + world.css_find('.hide-subtitles').click() @step('I hover over button "([^"]*)"$') diff --git a/cms/static/coffee/src/main.coffee b/cms/static/coffee/src/main.coffee index fef7ce9871..5c835b27b2 100644 --- a/cms/static/coffee/src/main.coffee +++ b/cms/static/coffee/src/main.coffee @@ -9,7 +9,7 @@ define ["domReady", "jquery", "underscore.string", "backbone", "gettext", window.CMS = window.CMS or {} CMS.URL = CMS.URL or {} window.onTouchBasedDevice = -> - navigator.userAgent.match /iPhone|iPod|iPad/i + navigator.userAgent.match /iPhone|iPod|iPad|Android/i _.extend CMS, Backbone.Events Backbone.emulateHTTP = true diff --git a/common/lib/xmodule/xmodule/css/video/display.scss b/common/lib/xmodule/xmodule/css/video/display.scss index 36318df11b..5f4e9d1063 100644 --- a/common/lib/xmodule/xmodule/css/video/display.scss +++ b/common/lib/xmodule/xmodule/css/video/display.scss @@ -2,6 +2,10 @@ margin-bottom: 30px; } +.is-hidden { + display: none; +} + div.video { @include clearfix(); background: #f3f3f3; @@ -97,12 +101,35 @@ div.video { } } + .btn-play { + @include transform(translate(-50%, -50%)); + position: absolute; + z-index: 1; + background: rgba(0, 0, 0, 0.7); + top: 50%; + left: 50%; + padding: 30px; + border-radius: 25%; + + &:after{ + content: ''; + display: block; + width: 0px; + height: 0px; + border-style: solid; + border-width: 30px 0 30px 50px; + border-color: transparent transparent transparent #ffffff; + position: relative; + } + } section.video-player { overflow: hidden; min-height: 300px; - div { + > div { + height: 100%; + &.hidden { display: none; } @@ -674,6 +701,7 @@ div.video { width: 275px; padding: 0 20px; z-index: 0; + display: none; } } @@ -764,6 +792,17 @@ div.video { } } } + + &.is-touch { + div.tc-wrapper { + article.video-wrapper { + object, iframe, video{ + width: 100%; + height: 100%; + } + } + } + } } diff --git a/common/lib/xmodule/xmodule/js/fixtures/video.html b/common/lib/xmodule/xmodule/js/fixtures/video.html index e80bd3a0dd..a28d10422a 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/video.html +++ b/common/lib/xmodule/xmodule/js/fixtures/video.html @@ -3,7 +3,7 @@
+ +
-
+