Video plays everywhere except iOS 12.4

carlfink

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.

wheels

Wild shot in the dark here...

Try doing an action On Device Rotation (delay 0.5) Run JavaScript and put in this code:

getDisplayWindow().is.clientProp.device=null;
getDisplayWindow().changeSize();

carlfink

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.