Automatic video file type

Can you post a link so I can see the problem?

I don’t recommend using .mov files because they can cause problems in IE. You can usually just change the filename to .mp4 without any trouble.

If there is an .ogv file in the same directory as your original video, the plugin will make it available as a second source in the video tag. Without seeing your site it’s hard to know why it’s not working.

I used a .mov file specifically because I knew it wasn’t compatible with Firefox, and I wanted to see if the browser would automatically revert to play the .ogv file. Both the .ogv and .mov file are in the same exact upload directory path.

I’ve successfully encoded the .ogv file once it was uploaded, and I see it sitting in the same directory as the .mov file. I tested the .ogv file on my personal desktop computer and it plays fine in my VLC player.

You can view my plugin configuration file here (I’m using video.js):
https://www.sdwebsitedemo.com/images/sample.png

Here is the path to try the video:
https://www.sdwebsitedemo.com/video-test-1/

Here is the code that the plugin inserted into the post:
[KGVID width=”640″ height=”360″]https://www.sdwebsitedemo.com/wp-content/uploads/2013/07/sample_iTunes2.mov[/KGVID]

The OGV works fine for me in Firefox 22 on a Mac. The video does not play in Chrome. Are you using Firefox in Windows? There is in fact support for H.264 videos in Firefox 22 on Windows. Since the .mov source is listed first, Firefox is probably trying to play the MPEG-4 encoded .mov file you provided as the primary source. Neither the MPEG-4 codec nor the .mov container are a good choice for web video. If you start with an H.264 .mp4 file it should work in every browser.

Yes I’m using Windows. I didn’t realize the operating system could have an effect on playback. We will have clients uploading videos and we want to allow a very large range of video types. I have set up a custom script using ffmpeg to convert any outlier filetypes that your plugin doesn’t handle.

You’re right .mp4 seems to work in most browsers I just tried.
Would you recommend that I just convert any file that’s uploaded immediately to an mp4? We are dealing with relatively small files so it shouldn’t be a problem with cpu usage or hard disk space.

Do you know if any mobile browsers have issues with .mp4 files?

Thank you again for the help!

Firefox does not natively support H.264 decoding. As a workaround to avoid incorporating proprietary tech into their open source browser while bowing to the reality that H.264 is the current standard for web video, they are relying on the OS to do the work. That was recently implemented for Windows 8, 7 and Vista. XP doesn’t have the built-in tools for H.264 and I suspect XP will never work with Firefox. Mac and Linux support hasn’t been finalized yet but is on the way. I expect H.264 .mp4 files to work for nearly every user by the end of the year and I no longer recommend making OGV or WEBM files. In the meantime Firefox on unsupported OSes can play H.264 videos with the fallback Flash player.

Every mobile browser I know of can play H.264 .mp4 video files. Like Firefox, the browsers tend to leave it to device support because decoding video in software is a waste of limited mobile resources. iOS devices will play almost anything you can throw at them, but Android devices are fairly picky about the particular profile of H.264. [email protected] seems to work well for me. Videos encoded with my plugin should work fine.

Since you’re relying on clients uploading videos I guess you can’t rely on the original videos to be encoded correctly. My plugin has always assumed that the original video was a priority for playback, as long as it has the correct extension, but in the future I do plan to give the option of replacing the original video with a correctly encoded one (and to start transcoding as soon as it’s uploaded)

I see you said “In the meantime Firefox on unsupported OSes can play H.264 videos with the fallback Flash player.”. If a client uploads a mp4 file and doesn’t do any encoding, will the video still play with the fallback Flash player on a firefox browser? What exactly activates this fallback Flash player?

I am very comfortable digging around the php code. If I were to put in my conversion script (which converts all video files to .mp4 as they are uploaded), could I still integrate the fallback flash player your plugin uses? If you could offer some private support I would be willing to pay for some extra help with the plugin.

The Flash player will load automatically if the browser reports that it’s unable to play any of the available sources. So if you only provide one H.264 .mp4 file, it will play natively in nearly every browser. If the user is on Opera or Mac/Linux Firefox, the browser knows that it can’t play video/mp4 files, and the Flash player will take over. You don’t have to do anything to make that happen. The only time it wouldn’t work is if the user doesn’t have Flash installed, which is an extremely small number of people in the desktop world.

Here’s a handy chart of compatible HTML5 video formats https://en.wikipedia.org/wiki/HTML5_video#Browser_support

You shouldn’t have to do anything special aside from converting all of your uploaded videos to .mp4. I would actually be very interested to know how you implemented that through WordPress.

It turns out the flash fallback wasn’t working because of the browser testing software I was using. Your plugin is great, I switched to a new browser testing software and the .mp4 file works flawlessly in every browser I tested. However, it wouldn’t play in any version of Opera Mobile, it says: “Sorry no compatible source and playback technology were found for this video. Try using another browser like Chrome or download Adobe Flash Player”. Any suggestions to support Opera Mobile with .mp4?

At the moment I have it set up to automatically convert the uploaded video (if it’s avi, mpg, mov, flv, or wmv) into a .mp4 file, and it changes the URL in the tinymce editor from the original .extension to .mp4. Haven’t run into any problems so far, I’d be happy to show you how I did it. Shoot me an email at [email protected]

Like Firefox, Opera Mobile depends on device support for playback. What device were you having a problem with? .mp4s work in the Opera Browser on my Nexus 4 without any trouble.