home
lars.st0ne.at
Linux And Related Stuff
[BLOG] |ARCHIVE| |TAG MAP| |OTHER STUFF| |ME|
  • html5 video in IE11 - size does matter


    #adb #ffmpeg #ffprobe #firefox #html #html5 #ie11

    I thought my plan is pretty straightforward. Take a screencast from my nexus4 with adb, upload it to my webserver and embed it into a html5 video tag.

    But it took me about 7 hours to get the video (a perfectly valid mp4) working in Internet Exporer 11.

    creating the video:

    $ adb shell screenrecord /sdcard/test.mp4
    $ adb pull /sdcard/test.mp4 .                                                                
    140 KB/s (6001 bytes in 0.041s)
    [steininr:~]↥ $ ffprobe test.mp4 
    ...
    [mov,mp4,m4a,3gp,3g2,mj2 @ 0x199e700] decoding for stream 0 failed
    Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'test.mp4':
      Metadata:
        major_brand     : isom
        minor_version   : 0
        compatible_brands: isom3gp4
        creation_time   : 2014-05-23 09:04:25
      Duration: 00:00:00.00, start: 0.000000, bitrate: N/A
        Stream #0:0(eng): Video: h264 (Baseline ... 768x1280, DAR 3:5 ...
        Metadata:
          creation_time   : 2014-05-23 09:04:25
          handler_name    : VideoHandle
    

    The result is a mp4 in portrait orientation, which works in Firefox 29, but not in IE11. After hours of trying to convert the video with ffmpeg, I accidentally recorded a video in landscape orientation.

    ffprobe for landscape video:

    $ ffprobe test.mp4 
    ...
    Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'test.mp4':
      Metadata:
        major_brand     : isom
        minor_version   : 0
        compatible_brands: isom3gp4
        creation_time   : 2014-05-23 09:20:20
      Duration: 00:00:06.11, start: 0.000000, bitrate: 3160 kb/s
        Stream #0:0(eng): Video: h264 (Baseline ... 1280x768, DAR 5:3 ...
        Metadata:
          creation_time   : 2014-05-23 09:20:20
          handler_name    : VideoHandle
    

    It differs from the first video in two ways. The resolution 1280x768 ( before: 768x1280 ) and the aspect ratio 5:3 ( before: 3:5 ). The crazy thing: The video works in IE11.

    What the Fuck!

    After playing around with different resolution and aspect ratios, I found out that IE11 can not play html5 videos with heights greater than 1088 pixels.

    For whatever reason 652x1088 works ... while 652x1090 does not.

    Edit 26.5.2014: Finally I've found the following link MS H.264 Decoder. The site describes, that the Microsoft H.264 Decoder (Windows 7) supports a maximum resolution of 1920 × 1088 pixels.

    converting to < 1088:

    $ ffmpeg -i test.mp4 -vcodec h264 -b:v 1500k -filter:v scale=512:854 -preset main -preset slow -g 30 bondroid.mp4
    
    May 23 2014 08:51
    by st0ne
    ? hits
    • comment @Twitter
    • share on Twitter
©2012 Robert Steininger aka st0ne
CC-BY-SA