Skip to content

Commit cfd869b

Browse files
committed
Add info to FAQ about video playback
1 parent e1ac47c commit cfd869b

File tree

1 file changed

+13
-9
lines changed

1 file changed

+13
-9
lines changed

‎docs/introduction/faq.md‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -100,11 +100,11 @@ stringification operations. This also means mutation observations will not
100100
fire. Use the [debug component][debug] or [`.flushToDOM` methods][flushtodom]
101101
if you need to sync to the DOM.
102102

103-
## Why does my video not play on mobile?
103+
## Why does my video not play?
104104

105105
[iosvideo]: https://developer.apple.com/library/iad/documentation/UserExperience/Conceptual/iAdJSProgGuide/PlayingVideosinAds/PlayingVideosinAds.html
106106

107-
Mobile browsers have had limitations playing inline video.
107+
Mobile and now desktop browsers have limitations playing inline video.
108108

109109
Because of an [iOS platform restriction][iosvideo] in order to get inline video
110110
(with or without autoplay), we must:
@@ -113,15 +113,19 @@ Because of an [iOS platform restriction][iosvideo] in order to get inline video
113113
- Set the `playsinline` attribute to the video element (is automatically added to all videos).
114114
- Possibly pin the webpage to the homescreen for older iOS versions.
115115

116-
Inline video support on iOS 10 may change this. On certain Android devices or
117-
browsers, we must:
116+
Mobile and desktop browsers have been tightening the video autoplay policies to preserve battery and avoid intrusive advertisements. Most browsers now require a user action (such as a click or tap event) to start video playback:
118117

119-
[android-touch-bug]: https://bugs.chromium.org/p/chromium/issues/detail?id=178297
118+
-[Chrome for Android](https://bugs.chromium.org/p/chromium/issues/detail?id=178297)
119+
-[Chrome desktop](https://www.chromium.org/audio-video/autoplay)
120+
-[Safari](https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/)
121+
-[Firefox](https://hacks.mozilla.org/2019/02/firefox-66-to-block-automatically-playing-audible-video-and-audio/)
120122

121-
- Require user interaction to trigger the video (such as a click or tap event). See [Chromium Bug 178297][android-touch-bug].
123+
[video-playback-example]: https://aframe.io/aframe/examples/test/video/
124+
[video-playback-code]: https://github.com/mayognaise/aframe-html-shader/
122125

123-
Lately, there has been improving support. We do not focus too much on video,
124-
but below are GitHub issues that may contain helpful information from community:
126+
There's an [A-Frame example that includes the necessary logic][video-playback-example] to request the user clicking or tapping to start video playback. [The source code is also available][video-playback-code]
127+
128+
We do not focus too much on video, but below are GitHub issues that may contain helpful information from community:
125129

126130
- [*Videos and videospheres don't work on mobile*](https://github.com/aframevr/aframe/issues/316)
127131
- [*Document iOS video encoding restrictions*](https://github.com/aframevr/aframe/issues/1846)
@@ -329,6 +333,6 @@ Phones with Adreno 300 series GPUs are notoriously problematic. Set [renderer pr
329333

330334
## Why is the gyroscope / magic window mode not working?
331335

332-
[New browser policies](https://www.w3.org/TR/orientation-event/#dom-deviceorientationevent-requestpermission) require sites to prompt the user for permission before getting access to DeviceMotionEvents. [Starting with iOS 13](https://webkit.org/blog/9674/new-webkit-features-in-safari-13/) DeviceMotionEvents are only available for pages served over `https`. Other browsers will also apply same policies and restrictions. A-Frame now [incorporates customizable UI](https://aframe.io/docs/1.0.0/components/device-orientation-permission-ui.html#sidebar) to request the necessary permissions to the user. Make sure to update to [A-Frame latest version](https://github.com/aframevr/aframe/releases)
336+
[New browser policies](https://www.w3.org/TR/orientation-event/#dom-deviceorientationevent-requestpermission) require sites to prompt the user for permission before getting access to DeviceMotionEvents. [Starting with iOS 13](https://webkit.org/blog/9674/new-webkit-features-in-safari-13/) DeviceMotionEvents are only available for pages served over `https`. Other browsers will also apply same policies and restrictions. A-Frame now [incorporates customizable UI](https://aframe.io/docs/1.0.0/components/device-orientation-permission-ui.html#sidebar) to request the necessary permissions to the user. Make sure to update to [A-Frame latest version](https://github.com/aframevr/aframe/releases)
333337

334338

0 commit comments

Comments
 (0)