I need to convert a bunch of mp4 files so they are playable on iPad. I already successfully encoded a mp4 file so it plays on all major browsers (IE, Firefox, Chrome, Safari) the mp4 file even plays on my Android 4.x device.
The only 2 devices it won't play on are iPad and iPhone. I'm using Handbrake 4 to convert the files using the iPad/iPhone presets but it just won't work. Can someone explain to me why the file with the following characteristics wont work on all except iOS devics?
General
Complete name : chapter4.mp4
Format : MPEG-4
Format profile : Base Media / Version 2
Codec ID : mp42
File size : 10.4 MiB
Duration : 2mn 56s
Overall bit rate mode : Variable
Overall bit rate : 492 Kbps
Movie name : Chapter 4
Performer : Acuity
Encoded date : UTC 2013-02-06 16:04:37
Tagged date : UTC 2013-02-06 16:06:28
Writing application : HandBrake 0.9.8 2012071700
Video
ID : 1
Format : AVC
Format/Info : Advanced Video Codec
Format profile : [email protected]
Format settings, CABAC : No
Format settings, ReFrames : 2 frames
Codec ID : avc1
Codec ID/Info : Advanced Video Coding
Duration : 2mn 56s
Bit rate mode : Variable
Bit rate : 179 Kbps
Width : 720 pixels
Height : 400 pixels
Display aspect ratio : 16:9
Frame rate mode : Variable
Frame rate : 30.000 fps
Minimum frame rate : 30.000 fps
Maximum frame rate : 30.030 fps
Color space : YUV
Chroma subsampling : 4:2:0
Bit depth : 8 bits
Scan type : Progressive
Bits/(Pixel*Frame) : 0.021
Stream size : 3.76 MiB (36%)
Writing library : x264 core 120
Encoding settings : cabac=0 / ref=2 / deblock=1:0:0 / analyse=0x1:0x111 / me=umh / subme=6 / psy=1 / psy_rd=1.00:0.00 / mixed_ref=1 / me_range=16 / chroma_me=1 / trellis=0 / 8x8dct=0 / cqm=0 / deadzone=21,11 / fast_pskip=1 / chroma_qp_offset=-2 / threads=3 / sliced_threads=0 / nr=0 / decimate=1 / interlaced=0 / bluray_compat=0 / constrained_intra=0 / bframes=0 / weightp=0 / keyint=300 / keyint_min=30 / scenecut=40 / intra_refresh=0 / rc_lookahead=40 / rc=crf / mbtree=1 / crf=20.0 / qcomp=0.60 / qpmin=3 / qpmax=69 / qpstep=4 / ip_ratio=1.40 / aq=1:1.00
Encoded date : UTC 2013-02-06 16:04:37
Tagged date : UTC 2013-02-06 16:06:28
Color primaries : BT.709
Transfer characteristics : BT.709
Matrix coefficients : BT.709
Audio #1
ID : 2
Format : AAC
Format/Info : Advanced Audio Codec
Format profile : LC
Codec ID : 40
Duration : 2mn 56s
Bit rate mode : Variable
Bit rate : 85.2 Kbps
Maximum bit rate : 191 Kbps
Channel(s) : 2 channels
Channel positions : Front: L R
Sampling rate : 44.1 KHz
Compression mode : Lossy
Stream size : 1.80 MiB (17%)
Language : English
Encoded date : UTC 2013-02-06 16:04:37
Tagged date : UTC 2013-02-06 16:06:26
Audio #2
ID : 3
Format : AC-3
Format/Info : Audio Coding 3
Mode extension : CM (complete main)
Format settings, Endianness : Big
Codec ID : ac-3
Duration : 2mn 56s
Bit rate mode : Constant
Bit rate : 224 Kbps
Channel(s) : 2 channels
Channel positions : Front: L R
Sampling rate : 44.1 KHz
Bit depth : 16 bits
Compression mode : Lossy
Stream size : 4.72 MiB (46%)
Language : English
Encoded date : UTC 2013-02-06 16:04:37
Tagged date : UTC 2013-02-06 16:06:26
To play the video I'm using a combination of flash and video tag. Using modernizr.js i'd figure out of the h264 standard is supported. And If it is the following tag is displayed:
<video id="my_video_1" class="video-js vjs-default-skin" controls="" preload="auto" width="700" height="420" poster="http://server/video_first_frame.png" data-setup="{}">
<source src="http://server/9BF315E824517C75C1257B090055B87A/$File/Chapter 4.mp4">
</video>
When viewing on the iPad I can see it displays the html5 video tag but it displays as it cannot understand the file. Another file in the same application (ocean.mp4 from the video.js website) is playing correctly so I suspect it has something to do with the encoding..