Video Not Playing in Safari Mac OS

[Dylanwoo24]

So I have an html5 canvas - the mp4 plays everywhere except Safari Mac OS.  I've added mime types, I've implemented byte range servers and I've even hosted the video from vimeo.com and it just won't play using the component.  Any ideas?  These videos play back in safari mac os when visited directly... interestingly once I do that in a separate tab the video loads fine in the component... I'm really stuck.

[ClayUUID]

So you're saying, even after you tap the video's play button, it won't play?

[Dylanwoo24]

Yes - I just get this:

[Dylanwoo24]

Even when I call it via my PHP byte-server request.

[Dylanwoo24]

[Dylanwoo24]

BTW... I even tried to stream it directly from vimeo.com which I am sure supports the byte-ranges.

[Dylanwoo24]

So the issue is that the video isn't playing inside of the canvas.

[ClayUUID]

Why do you keep mentioning byte ranges? You aren't trying to play some segment from the middle of the video are you?

[Dylanwoo24]

I'm just trying to say I covered everything I could find that would be a reason video wouldn't play in safari.  I've exhausted all the obvious items at this point.  So literally, I can copy the video HTML tag that is generated by animate, paste it manually outside the canvas and it will play normally (of course it won't be inside the canvas animation).  So I believe everything with the <video> tag that is injected by jquery and the video itself have no issues.  It literally doesn't load as soon as that video tag is injected inside of the canvas.  I've tried nesting it inside of movie clips and everything.

[ClayUUID]

The video element is never inside the canvas. It's impossible for anything to be inside a canvas element other than the pixels of the canvas element itself. HTML5 Canvas components are just DOM elements floated on top of the canvas.

Apple is always finding new and creative ways to muck with media payback on mobile devices, so I have no idea why it's not working in this particular case.