diff --git a/scripts/html5.js b/scripts/html5.js index 64a9757b..a4855558 100644 --- a/scripts/html5.js +++ b/scripts/html5.js @@ -414,20 +414,31 @@ H5P.VideoHtml5 = (function ($) { self.seek(currentTimeBeforeChangingQuality); } - // Always play to get image. - video.play(); + // Callback to resolve play + var resolvePlaying = function () { + if (stateBeforeChangingQuality !== H5P.Video.PLAYING) { + // Do not resume playing + video.pause(); + } - if (stateBeforeChangingQuality !== H5P.Video.PLAYING) { - // Do not resume playing - video.pause(); - } + // Done changing quality + stateBeforeChangingQuality = undefined; - // Done changing quality - stateBeforeChangingQuality = undefined; + // Remove any errors + if ($error.is(':visible')) { + $error.remove(); + } + }; - // Remove any errors - if ($error.is(':visible')) { - $error.remove(); + // Always play to get image. + var playPromise = video.play(); + if (playPromise !== undefined) { + playPromise.finally(() => { + resolvePlaying(); + }); + } + else { + resolvePlaying(); // Fallback } }; video.addEventListener('loadedmetadata', loaded, false); @@ -489,6 +500,22 @@ H5P.VideoHtml5 = (function ($) { * @param {Number} time */ self.seek = function (time) { + if (lastState === undefined) { + // Make sure we always play before we seek to get an image. + // If not iOS devices will reset currentTime when pressing play. + + // Always play to get image. + var playPromise = video.play(); + if (playPromise !== undefined) { + playPromise.finally(() => { + video.pause(); + }); + } + else { + video.pause(); // Fallback + } + } + video.currentTime = time; // Use canplaythrough for IOs devices // Use loadedmetadata for all other devices.