Video plays everywhere except iOS 12.4

carlfink
Community Member Posts: 1,099 ✭ Legend ✭
I created a course that embeds a video (using the built-in Insert >> Video function of Lectora 18.2.3). I have it set to "Controller: None", played by an Action attached to a button on the page.
On Android, it plays correctly. On Windows, it plays correctly. On iPadOS 13, it plays correctly.
On an iPhone running iOS 12.4, when you tap the button, it plays the audio but the video is a black rectangle.
If the user rotates the phone to trigger an orientation change event, the video suddenly appears.
Responsive design problem? Android and iPadOS 13 don't do that. Tested in Chrome and the Success Factors (LMS) app.
I wonder if having a JS event sent by code would be a workaround, but I don't know JS well enough. Can anyone suggest a way to throw an onorientationchange event that will be caught by the video handler (mediaElement.js)?
Thanks in advance for any help.
On Android, it plays correctly. On Windows, it plays correctly. On iPadOS 13, it plays correctly.
On an iPhone running iOS 12.4, when you tap the button, it plays the audio but the video is a black rectangle.
If the user rotates the phone to trigger an orientation change event, the video suddenly appears.
Responsive design problem? Android and iPadOS 13 don't do that. Tested in Chrome and the Success Factors (LMS) app.
I wonder if having a JS event sent by code would be a workaround, but I don't know JS well enough. Can anyone suggest a way to throw an onorientationchange event that will be caught by the video handler (mediaElement.js)?
Thanks in advance for any help.
Comments
-
wheels Florida USACommunity Member, Administrator, Moderator, Rockstar Manager Posts: 665 eLearning ROCKSTAR Admin Team
-
Thanks, Joe.
It looks to me as if the HTML5 engine on Apple devices tries to preload either all, or a very large fraction of, a video file before letting you start play, much moreso than other operating systems. With a relatively small video file (50 megabytes), on WiFi, I often have to wait 10 seconds before a Play action works. I don't see this with Windows browsers or Android browsers. I do not know if this is related. Seen with both seamless and non-seamless publishing. I'm actually thinking I need to detect iDevices and put up a "wait for loading" animated GIF, something I haven't done in 10 years for any application.
Categories
- 35.8K All Categories
- 108 ✫ Announcements
- 33.1K Lectora®
- 31.1K Lectora Discussions
- 28.9K Lectora Desktop
- 2K Lectora Online
- 2K Lectora Feature Requests
- 71 Lectora User Groups
- 36 Lectora Accessibility User Group (LAUG)
- 22 ELB Learning Content
- 22 ELB Learning Content Discussions
- 321 CenarioVR®
- 188 CenarioVR Discussions
- 133 CenarioVR Feature Requests
- 41 Rockstar Learning Platform®
- 38 Rockstar Learning Platform Discussions
- 108 CourseMill®
- 108 CourseMill Discussions
- 47 ReviewLink®
- 47 ReviewLink Discussions
- 5 The Training Arcade®
- 5 The Training Arcade Discussions
- 934 All Things eLearning
- 36 eLearning Development
- 546 Learning Management System (LMS) Integration
- 332 Web Accessibility
- 1.2K ♪ The Green Room
- 9 Additional Learning Products