Video Playback in iOS not working

video
ios

(Jeff Hill) #1

Sorry if this is a basic question. I’ve searched the forums and haven’t been able to find anything and specifically addresses my issue. I created a series of interactive modules and am having trouble figuring out how to get the videos to playback on iOS. I have tried turning off autoplay, tried adding in a mouse click (tap action) to “start timeline” with autoplay turned on.

The module I have been troubleshooting on is here: http://www.tamingthesru.com/ankle-and-foot-nerve-blocks located under the heading PLANTAR SURFACE OF THE FOOT. It currently is set to autoplay and start timeline on a tap.

I have the videos uploaded into the resource as .mp4, .ogv, and .webm


#2

One thing that might be causing the issue is if you have other elements obscuring your video. The video needs to be at the top of the layer order. You may need to animate contents off of the video’s rectangle area instead of reducing opacity.

If that’s not the case can you share your document?


(Jeff Hill) #3

Yeah I don’t think that that’s the issue. The file was large and challenging to upload with my internet speeds. Here’s a link to it - https://www.dropbox.com/sh/v9gb37edf1lsonj/AADsijWDLCTkHBGgWQW4atMba?dl=0


(Jeff Hill) #4

I see in the support documents that you need mouse click actions to get the video to play, but I don’t know what mouse click action to use.


(Jeff Hill) #5

Still trying to work on this issue. I have been troubleshooting with the “Sural” scene and planned to fix the others once I figured out what the issue is.

  • I changed the main timeline so that it doesn’t start on scene load.

  • There is nothing else that could be obscuring the video since it is
    already at the front (and I told it to “bring to front” just to be
    sure).

  • I attempted to add a play pause button and use a javascript
    to run the video as outlined elsewhere in the forums but still with
    no luck.

It works fine on a computer browser, but I really need to get this working on mobile (50% of my site visitors are mobile) and am at a loss as to where to go next.

The only thing I could think to do next is abandon any further attempts to fix this and add a separate button that says “play on mobile” which would bring up a vimeo embed. (I would rather have the videos in the file because the IT department at my hospital has a firewall against vimeo/youtube)

Any help you (or anyone else) can provide would be appreciated.

Here is a link to the most recent version of the document: https://www.dropbox.com/sh/v9gb37edf1lsonj/AADsijWDLCTkHBGgWQW4atMba?dl=0


(theron_hp) #6

I’ve had videos in my projects playing on iOS, and since the iOS 10 update they stopped working. So I suspect that Apple broke something in the update that stops video from playing, or they just did not tell the industry that they changed something crucial.
The video plays fine in Reflect, but the moment it sits on a server, it stops working.
Let’s see how soon they can fix it. I’m sure they received quite a few bug reports by now.


#7

Can you share a URL or Hype document with us?


(theron_hp) #8

Hi Daniel. The content is inside a learning management system. I don’t have admin rights. What I do know is that they use the MediaElement.js to play their video.


(theron_hp) #9

I looked at the source code and this is what it says about the video:

	<video id="o_so_vid1000006432" width="960" height="540"  poster="/m/4b1b6d47363e24f3289515823fa59b53/poster.jpg"  controls  preload="none" oncontextmenu="return false;"  class="o_video">			
    		    		<source type="video/mp4" src="/m/e962ffa709a09fc1b62766531496e774/540video.mp4" title="540p (8.8 MB)" />
    		    		<source type="video/mp4" src="/m/e962ffa709a09fc1b62766531496e774/480video.mp4" title="480p (6.6 MB)" />
    		    		<source type="video/mp4" src="/m/e962ffa709a09fc1b62766531496e774/360video.mp4" title="360p (4.3 MB)" />
    		    		    		    	
  				  				  			</video>

(theron_hp) #10

Some more code around the MediaElement: (the code is open source, so I’m hoping it is allowed to share here)

// <![CDATA[
var mediaElementBaseUrl = BPlayer._mediaElementBaseUrl();
jQuery(’#o_so_vid1000006432’).mediaelementplayer({
enablePluginDebug: BPlayer.debugEnabled,

								pluginPath: mediaElementBaseUrl,
		flashName: 'flashmediaelement.swf',
		silverlightName: 'silverlightmediaelement.xap',
		plugins: ['flash','silverlight'],
		
								features: ['playpause','current','volume','progress','duration','tracks','sourcechooser','fullscreen'],
		
					success: function (mediaElement, domObject) {

					        mediaElement.addEventListener('play', function(e) {
	        	if (!o_info.linkbusy) {
	        		o_XHRNFEvent('/auth/1:1:1000006432:2:1/','cid','play','no-response','oo-no-response', 'currentTime', mediaElement.currentTime, 'src', mediaElement.src);
				}
	        }, false);
	        		        mediaElement.addEventListener('pause', function(e) {
	        	if (!o_info.linkbusy) {
					o_XHRNFEvent('/auth/1:1:1000006432:2:1/','cid','pause','no-response','oo-no-response', 'currentTime', mediaElement.currentTime, 'src', mediaElement.src);
				}
	        }, false);
	        		        mediaElement.addEventListener('seeked', function(e) {
	        	if (!o_info.linkbusy) {
					o_XHRNFEvent('/auth/1:1:1000006432:2:1/','cid','seeked','no-response','oo-no-response', 'currentTime', mediaElement.currentTime, 'src', mediaElement.src);
				}
	        }, false);
	        		        mediaElement.addEventListener('ended', function(e) {
	        	if (!o_info.linkbusy) {
					o_XHRNFEvent('/auth/1:1:1000006432:2:1/','cid','ended','no-response','oo-no-response', 'currentTime', mediaElement.currentTime, 'src', mediaElement.src);
				}
	        }, false);

					        		        		        jQuery(jQuery('.mejs-sourcechooser-selector input')[0]).prop("checked", true).trigger("click");;
	        			}
	});
	// ]]>
	</script>

(Steve Warby) #11

Hi

I have this hype site containing videos.

http://toolfolks.com/dewalt/54volt.html

No problems on ios10.


(Wolfgang Wunderlich) #12

Hi Steve,
This is a little off topic, sorry TS.

But I checked you`re Webside an always got a load error, until Safari crashes.
I have the same problem with my web side, including couple of Youtube Videos and also made with Hype, that I can not figure why.
So fare I thought it´s my problem, but now I see, it´s the same on you´re side.
It´s not working on MAC OS (newest Beta) an not on iOS (newest version)- both Safari-
Anyone else has a problem like that ?


(Steve Warby) #13

I don’t have any issues on iOS 10 (Iphone and iPad).

I use the page a lot in my shop. I have just realised that the Mac at work cannot upgrade to sierra (as it is too old). Just tested on my mac at home( sierra) and it is crashing.

Very strange


(Wolfgang Wunderlich) #14

Hmm…
Same here, it was working before Sierra on MAC but never on iOS on Pad.
Perhaps Daniel could take a closer look to the change in Sierra and iOS.

@Daniel
I can mail you the link to my troubled side (if necessary) , but don’t want to post it public.


#15

After a little more investigation and it doesn’t mean that this might be the problem but …

There is a deprecated method being used in the embedded player.

“KeyEvent.keyIdentifier”

Blurb from Chrome …

Remove the WebKit specific KeyEvent.keyIdentifier field.
It is not specified in a current specification and has a number of interoperability concerns.

This is a planned removal in October 2016.

Perhaps there is an update to the embedded player JS?


#16

@DBear
What would this Forum be like without You?

One of the Emojis missing in the collection is “mind blown” - I’ve added one: