[html5] html5 code for ipad video display

Jody Gugelhupf knueffle at yahoo.com
Mon Sep 12 09:44:57 PDT 2011


Hi all :)
My system:I run ubuntu natty, and have an old analog TV card, the winTV-go +FM. and vlc 1.1.9., apache2What I want to achieve:take the output of my old tv card, stream it with vlc and have the stream embedded on a local site to be displayed with html5, so i can watch the stream on my ipad 1 or 2Current situation:I have managed to get streaming with vlc working (i don't use the gui) with different containters and codecs. I have 3 working stream-commands that include:
1: vlc -vvv v4l2:///dev/video0:width=640:height=480 :input-slave=alsa://hw:1,1 --sout '#transcode{vcodec=mp4v,acodec=mp3,vb=8000,ab=128,channels=1,samplerate=44100}:standard{access=http,mux=ts,dst=192.168.1.10:9090}'
2: vlc -vvv v4l2:///dev/video0:width=640:height=480 :input-slave=alsa://hw:1,1 --sout '#transcode{vcodec=theo,acodec=mp3,vb=8000,ab=128,channels=1,samplerate=44100}:standard{access=http,mux=ogg,dst=192.168.1.10:9080/test.ogv}'
3: vlc -v v4l2:///dev/video0:width=640:height=480 :input-slave=alsa://hw:1,1 --sout '#transcode{vcodec=h264,vb=1024,acodec=mp3,channels=1,ab=128,samplerate=44100}:standard{access=http,mux=ts,dst=192.168.1.10:9080/test.mp4}'
I can open all 3 streams on a different computer and play them in vlc, Note on the side: the *.ogv stream i can also just enter as an url (http://192.168.1.10:9080/test.ogv) in chrome and it displays it there as a video, the other 2 streams it tries to download as a file.
So far so good, now I come to my html5 code:
<html>  
<head> 
<script src="video.js" type="text/javascript" charset="utf-8"></script>    
<link rel="stylesheet" href="video-js.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
</head>
<body>    
<script type="text/javascript" charset="utf-8">     
VideoJS.setupAllWhenReady();    
</script>  
<div class="video-js-box">    
<video class="video-js" width="640" height="480" controls preload poster="http://192.168.1.10/TV_new/jen.jpg">      
<source src=http://192.168.1.10:9080/test.ogv type=video/ogg; codecs="theora, vorbis"'>          
<!-- Image Fallback. -->        
<img src="http://192.168.1.10/TV_new/jen.jpg" width="640" height="264" alt="Poster Image" title="No video playback capabilities." />      </object>    </video>    </p>  </div>  </body></html>

this works perfectly in chrome, but because it is ogv it will of course not work on the ipad, so i need to use h.264/mp4 as that is supported/built in with safari, but when using the stream command 1 or 3 then i get no video displayed on ipad or chrome.When not using stream-command 2 (the ogv command) I adjust the html5 code to one of the following (I have tried all 3):
      <source src=http://192.168.1.10:9080/test.mp4 type=video/mp4; codecs="avc1.4D401E, mp3"'>  
or
     <source src=http://192.168.1.10:9080/test.mp4 type=video/mp4'>  
or
     <source src=http://192.168.1.10:9080/test.mp4'>  
none of these work.
I have also added mime types to my /etc/mime.types video/mp4                                       mp4
video/quicktime                                 qt mov
video/mp4v-es
video/ogg                                       ogv
video/webm                                      webm
video/x-matroska                                mpv mkv
application/x-mpegURL                           m3u8
video/MP2T                                      ts
application/x-mpegURL .m3u8
how do I have to specify the html5 code for it to be properly displayed on my ipad? anyone got a clue?btw I have also tried http apple live stream using ffmpeg and segmenter and i get that working as well, but due to the fact that TV is a continuous stream of data it does not work well with the playlist, so i stops after a while and you need to restart etc, not very handy and i want the above working, would appreciate the help, thanks in advance :)
jody
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/help-whatwg.org/attachments/20110912/4fe820ec/attachment-0001.htm>


More information about the Help mailing list