From 9b38ba6c02d6434e7464eafc6b3d7110bdea2403 Mon Sep 17 00:00:00 2001
From: Thomas Zarebczan <thomas.zarebczan@gmail.com>
Date: Thu, 29 Oct 2020 14:33:38 -0400
Subject: [PATCH] Improve IOS inline experience

Also puts back the video js player which has rate support - but it's hidden on smaller devices...maybe someone can fix later on.
---
 ui/component/viewers/videoViewer/internal/videojs.jsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/ui/component/viewers/videoViewer/internal/videojs.jsx b/ui/component/viewers/videoViewer/internal/videojs.jsx
index c4c7e848f..4aaf0e2f4 100644
--- a/ui/component/viewers/videoViewer/internal/videojs.jsx
+++ b/ui/component/viewers/videoViewer/internal/videojs.jsx
@@ -53,7 +53,6 @@ const VIDEO_JS_OPTIONS: VideoJSOptions = {
   playbackRates: [0.25, 0.5, 0.75, 1, 1.1, 1.25, 1.5, 1.75, 2],
   responsive: true,
   controls: true,
-  html5: { nativeControlsForTouch: IS_IOS },
 };
 
 const F11_KEYCODE = 122;
@@ -94,6 +93,8 @@ export default React.memo<Props>(function VideoJs(props: Props) {
     autoplay: false,
     poster: poster, // thumb looks bad in app, and if autoplay, flashing poster is annoying
     plugins: { eventTracking: true },
+    'webkit-playsinline': IS_IOS,
+    playsinline: IS_IOS,
   };
 
   videoJsOptions.muted = startMuted;
@@ -261,7 +262,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
   return (
     reload && (
       // $FlowFixMe
-      <div className={classnames('video-js-parent', { 'video-js-parent--ios': IS_IOS })} ref={containerRef}>
+      <div className={classnames('video-js-parent')} ref={containerRef}>
         <Button
           label={__('Tap to unmute')}
           button="link"